:root {
  /*
   * Identité officielle
   * Ligue Guadeloupéenne de Football
   */
  --green:#1BA62F;
  --green-dark:#137A22;
  --green-soft:rgba(27,166,47,.12);

  --yellow:#F2CC0F;
  --orange:#F2CC0F;

  --red:#F20505;
  --secondary:#F2727D;

  --light:#F2F2F2;
  --cream:#F2F2F2;

  --ink:#111827;
  --muted:#667085;
  --line:#D9E1DA;

  --white:#FFFFFF;

  --radius:18px;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
}

body {
  margin:0;
  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  color:var(--ink);
  background:var(--white);
}

a {
  color:inherit;
  text-decoration:none;
}

.shell {
  width:min(1180px,calc(100% - 40px));
  margin:0 auto;
}

.site-header {
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(19,122,34,.98);
  color:white;
  border-bottom:3px solid var(--orange);
}

.header-inner {
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
}

.brand-logo {
  display:block;
  flex:0 0 auto;
  width:58px;
  height:auto;
  max-height:52px;
  object-fit:contain;
}

.brand::after {
  content:"";
  width:5px;
  height:28px;
  margin-left:2px;
  border-radius:999px;
  background:#F2CC0F;
}

.brand strong {
  display:block;
  font-size:1.35rem;
}

.brand small {
  display:block;
  opacity:.72;
  margin-top:2px;
}

.main-nav {
  display:flex;
  align-items:center;
  gap:24px;
  font-weight:650;
}

.main-nav a:hover {
  color:#F2CC0F;
}

.hero {
  background:
    linear-gradient(
      125deg,
      #137A22 0%,
      #1BA62F 100%
    );
  color:white;
  overflow:hidden;
}

.hero-inner {
  min-height:570px;
  display:grid;
  grid-template-columns:
    minmax(0,1.35fr)
    minmax(280px,.65fr);
  gap:70px;
  align-items:center;
  padding:70px 0;
}

.eyebrow {
  display:inline-block;
  color:var(--orange);
  font-size:.82rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.13em;
  margin-bottom:14px;
}

.hero h1 {
  font-size:clamp(3.2rem,7vw,6.2rem);
  line-height:.92;
  letter-spacing:-.06em;
  margin:0;
  max-width:850px;
}

.hero h1 em {
  color:#F2CC0F;
  font-style:normal;
}

.hero p {
  max-width:650px;
  color:rgba(255,255,255,.8);
  font-size:1.15rem;
  line-height:1.7;
  margin:28px 0 0;
}

.hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:34px;
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:0 22px;
  border-radius:12px;
  font-weight:800;
}

.button-primary {
  background:var(--orange);
  color:#111827;
}

.button-secondary {
  border:1px solid rgba(255,255,255,.28);
  color:white;
}

.hero-panel {
  min-height:300px;
  padding:34px;
  border-radius:28px;
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.12),
      rgba(255,255,255,.04)
    );
  border:1px solid rgba(255,255,255,.18);
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.hero-panel strong {
  font-size:2.5rem;
}

.hero-panel p {
  margin:12px 0 28px;
  font-size:1rem;
}

.hero-panel small {
  color:rgba(255,255,255,.65);
}

.live-dot {
  width:11px;
  height:11px;
  border-radius:50%;
  background:#F20505;
  box-shadow:
    0 0 0 8px rgba(242,5,5,.16);
  margin-bottom:28px;
}

.section {
  padding:72px 0;
}

.section-soft {
  background:var(--cream);
}

.section-title {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:28px;
}

.section-title h2,
.page-head h1 {
  margin:0;
  color:var(--green-dark);
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:-.04em;
}

.section-title a {
  color:var(--green);
  font-weight:750;
}

.match-grid {
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:18px;
}

.match-card {
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:22px;
  background:white;
  box-shadow:
    0 8px 24px rgba(16,24,40,.035);
}

.match-topline,
.match-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}

.match-topline {
  color:var(--green);
  font-size:.82rem;
  font-weight:800;
}

.access-badge {
  padding:5px 8px;
  border-radius:99px;
  background:var(--green-soft);
  white-space:nowrap;
}

.match-date {
  color:var(--muted);
  margin-top:18px;
  font-size:.9rem;
}

.teams {
  display:grid;
  gap:5px;
  margin-top:14px;
  font-size:1.18rem;
}

.teams span {
  color:var(--muted);
  font-size:.78rem;
  font-weight:600;
}

.match-location {
  color:var(--muted);
  min-height:38px;
  margin-top:16px;
  font-size:.85rem;
  line-height:1.45;
}

.match-footer {
  border-top:1px solid var(--line);
  margin-top:20px;
  padding-top:16px;
}

.status {
  color:var(--muted);
  font-size:.82rem;
  font-weight:700;
}

.status-live {
  color:#F20505;
}

.card-link {
  color:var(--green);
  font-size:.88rem;
  font-weight:800;
}

.empty-state {
  border:1px dashed #cfd7d2;
  background:#f8fbf9;
  border-radius:var(--radius);
  padding:42px;
}

.empty-state strong {
  font-size:1.35rem;
  color:var(--green);
}

.empty-state p {
  color:var(--muted);
  max-width:620px;
  line-height:1.6;
}

.page-head {
  padding:72px 0 42px;
  background:var(--cream);
}

.page-head p {
  color:var(--muted);
  max-width:700px;
  line-height:1.6;
}

.match-hero {
  padding:70px 0;
  background:
    linear-gradient(
      125deg,
      #137A22,
      #1BA62F
    );
  color:white;
}

.match-hero h1 {
  max-width:900px;
  margin:12px 0 34px;
  font-size:clamp(2.5rem,6vw,5rem);
  line-height:1;
  letter-spacing:-.055em;
}

.match-hero h1 span {
  display:block;
  color:#F2CC0F;
  font-size:.35em;
  margin:10px 0;
  letter-spacing:0;
}

.back-link {
  display:block;
  margin-bottom:34px;
  color:rgba(255,255,255,.7);
}

.match-info {
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:12px;
}

.match-info > div {
  padding:18px;
  border-radius:13px;
  background:rgba(255,255,255,.08);
}

.match-info small {
  display:block;
  color:rgba(255,255,255,.55);
  margin-bottom:5px;
}

.player-placeholder {
  min-height:450px;
  border-radius:24px;
  background:#101416;
  color:white;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:40px;
}

.player-placeholder h2 {
  font-size:2.2rem;
  margin:8px 0;
}

.player-placeholder p {
  color:#9aa4aa;
  max-width:580px;
}

.live-pill {
  color:#F20505;
  font-weight:900;
  letter-spacing:.08em;
}

.sponsor {
  margin-top:18px;
  border:1px solid var(--line);
  border-radius:14px;
  padding:20px;
  text-align:center;
  color:var(--muted);
}

.sponsor strong {
  color:var(--ink);
  margin-left:5px;
}

footer {
  background:#137A22;
  color:white;
}

.footer-inner {
  min-height:110px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.footer-inner span {
  color:rgba(255,255,255,.58);
}

@media (max-width:900px) {

  .hero-inner {
    grid-template-columns:1fr;
    gap:35px;
  }

  .hero-panel {
    min-height:220px;
  }

  .match-grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}

@media (max-width:650px) {

  .shell {
    width:min(
      100% - 28px,
      1180px
    );
  }

  .header-inner {
    align-items:flex-start;
    padding:14px 0;
    flex-direction:column;
  }

  .main-nav {
    width:100%;
    gap:16px;
    overflow-x:auto;
    padding-bottom:4px;
  }

  .brand small {
    display:none;
  }

  .hero-inner {
    min-height:auto;
    padding:55px 0;
  }

  .match-grid {
    grid-template-columns:1fr;
  }

  .section-title {
    align-items:flex-start;
    flex-direction:column;
  }

  .match-info {
    grid-template-columns:1fr;
  }

  .footer-inner {
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
  }

}


/* ==========================================================
   LGF TV V0.2.3 — ANTENNE PERMANENTE
   ========================================================== */

.antenna-section {
  background:#FFFBF5;
}

.antenna-player {
  max-width:1040px;
}

.antenna-screen {
  position:relative;
  overflow:hidden;
  aspect-ratio:16 / 9;
  border-radius:22px;
  background:#090d0b;
  box-shadow:
    0 18px 50px rgba(9,58,27,.12);
}

.antenna-screen video {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}

.antenna-info {
  position:absolute;
  left:20px;
  bottom:20px;
  display:flex;
  flex-direction:column;
  gap:2px;
  max-width:min(70%,520px);
  padding:12px 15px;
  border-radius:12px;
  color:#fff;
  background:rgba(9,58,27,.82);
  backdrop-filter:blur(7px);
}

.antenna-info span {
  color:#F39200;
  font-size:.7rem;
  font-weight:850;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.antenna-info strong {
  font-size:1.05rem;
}

.antenna-info small {
  color:rgba(255,255,255,.78);
}

.antenna-sound,
.antenna-start {
  position:absolute;
  right:18px;
  bottom:18px;
  min-height:42px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.34);
  border-radius:10px;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-weight:750;
  cursor:pointer;
}

.antenna-start {
  right:auto;
  left:50%;
  bottom:50%;
  transform:translate(-50%,50%);
  background:#0C5126;
  border-color:#F39200;
}

.antenna-caption {
  display:flex;
  align-items:center;
  gap:14px;
  padding:15px 2px 0;
}

.antenna-caption .live-dot {
  flex:0 0 auto;
  margin:0;
}

.antenna-caption strong,
.antenna-caption small {
  display:block;
}

.antenna-caption strong {
  color:#093A1B;
}

.antenna-caption small {
  margin-top:2px;
  color:#667085;
}

.antenna-live-priority {
  padding:34px;
  border:1px solid #D7E1DA;
  border-radius:18px;
  background:#fff;
}

.antenna-live-priority h3 {
  margin:.8rem 0 .3rem;
  color:#093A1B;
}

.antenna-live-priority p {
  color:#667085;
}

@media (max-width:650px) {

  .antenna-screen {
    border-radius:14px;
  }

  .antenna-info {
    left:10px;
    bottom:10px;
    max-width:68%;
    padding:8px 10px;
  }

  .antenna-sound {
    right:10px;
    bottom:10px;
    padding:0 10px;
    font-size:.78rem;
  }

}
