/* Typography & base */
:root{
  --gnf-cyan:#26d7e9;
  --gnf-cyan-strong:#12d0de;
  --gnf-navy:#0f1923;
  --gnf-deep:#111827;
  --gnf-deeper:#0b131b;
}
html,body{font-family:'Barlow', 'Inter', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, sans-serif; background:#0d1520;}
.fw-extrabold{font-weight:800;}
.tracking-tight{letter-spacing:.05rem;}
.bg-dark-gnf{background:rgba(255,255,255,.06)!important;}
.bg-deep{background:#0f1823;}
.bg-deeper{background:#0c141d;}
.bg-cyan{background:var(--gnf-cyan);}
.bg-cyan-strong{background:var(--gnf-cyan-strong);}
.btn-gnf{background:var(--gnf-cyan); color:#0b1016; border:none;}
.btn-gnf:hover{filter:brightness(.95); color:#0b1016;}
.logo-square{display:inline-grid; place-items:center; width:38px; height:38px; background:var(--gnf-cyan); color:#001018; border-radius:.5rem;}
.logo-circle{display:inline-grid; place-items:center; width:48px; height:48px; background:#0f1923; color:#fff; border-radius:50%; font-weight:800;}

/* HERO */
.hero{min-height:72vh; display:grid; align-items:center; position:relative;}
.hero-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(10%) contrast(1.05) brightness(.7);}
.hero .overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,25,35,.55), rgba(15,25,35,.78));}
.hero-inner{padding:6rem 0;}
.eyebrow{opacity:.85; text-transform:uppercase; letter-spacing:.2em;}
h1, h2, h3{color:#fff}

/* Logotipo arriba-izquierda */
.brand-badge{
  position:absolute; top:24px; left:24px; z-index:3;
  padding:0; /* sin caja, como en el diseño */
}
.brand-badge img{
  height:130px; width:auto; display:block;
}
@media (min-width: 768px){
  .brand-badge img{height:200px;}
  .hero-inner{padding:7rem 0;}
}

/* ===== WE PLAY TOGETHER (SVG inline con currentColor) ===== */
.weplay{
  background:#141a28;   /* fondo liso del bloque */
  color:#e9eef6;
}
.weplay-mark{
  color:#ffffff;        /* ← color del logo (cámbialo aquí) */
  max-width: 260px;
  width: 100%;
  display: inline-block;
}
.weplay .logo-gnf, .weplay svg{
  width:100%;
  height:auto;
  display:block;
}
.weplay-claim{
  color:#ffffff;
  letter-spacing:.02em;
  margin-bottom:.5rem;
}
.weplay-text{
  color:#cbd5e1;
  margin-top:.5rem;
}

@media (min-width: 992px){
  .weplay .container{padding-top:3rem; padding-bottom:3rem;}
  .weplay-mark{max-width:280px;}
}


/* STAMP */
.stamp .stamp-mark{display:inline-block; padding:.35rem .6rem; border:2px solid var(--gnf-cyan); border-radius:.5rem; font-weight:800; color:#fff; margin-bottom:.5rem;}

/* ===== PRIZES (PNG) ===== */
.prizes-split{
  display:grid;
  grid-template-columns:1fr;
  min-height:520px;
}
@media (min-width: 992px){
  .prizes-split{ grid-template-columns: 1fr 1fr; }
}

/* Izquierda */
.prizes-left{
  position:relative;
  background:#12d0de;           /* cian liso del mockup */
  color:#0f1923;
}
.prizes-left::after{             /* barra divisoria central */
  content:""; position:absolute; top:0; right:0; width:12px; height:100%;
  background:#0fc3cf;
}
.prizes-wrap{
  max-width:720px;
  padding: clamp(2rem, 5vw, 4rem);
  margin-inline:auto;
}
.prizes-title{
  font-weight:800;
  letter-spacing:.35em;
  text-transform:uppercase;
  font-size:clamp(1.1rem, 1.2rem + .6vw, 1.4rem);
  margin:0 0 2rem 0;
}
.prize-item{
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:1rem;
  align-items:flex-start;
  margin-bottom:1.25rem;
}
.prize-ico{
  width:40px; height:auto; margin-top:.2rem; flex:0 0 auto;
  filter: grayscale(1) contrast(1.1); /* opcional si tu PNG es lineal oscuro */
}
.prize-text{ margin:0; font-size:1rem; line-height:1.6; }
.only-one{ font-size:1.15rem; margin:1.5rem 0 1rem; }

/* Botón */
.btn-prizes{
  display:inline-block;
  background:#2b2f39; color:#fff; text-decoration:none;
  font-weight:800; text-transform:uppercase;
  padding:0.95rem 1.6rem; letter-spacing:.02em;
  border-radius:.25rem;
}

/* Derecha */
.prizes-right{
  position:relative; min-height:420px;
  background-size:cover; background-position:center;
  overflow:hidden;
}
.prizes-right::before{           /* tinte cian sobre la foto */
  content:""; position:absolute; inset:0;
  background:rgba(18,208,222,.82);
  mix-blend-mode:multiply;       /* refuerza el tono */
}

/* Marca inferior centrada */
.wm{ position:absolute; left:50%; bottom:2.2rem; transform:translateX(-50%);
     text-align:center; color:#fff; }
.wm-logo{ width:60px; height:auto; display:block; margin:0 auto; }
.wm-sub{ margin-top:.3rem; letter-spacing:.35em; font-size:.8rem; }


/* ==== FORMULARIO INSCRIPCIÓN ==== */
.section-form{ background:#141a28; color:#e9eef6; padding:3rem 0; }
.form-title{ letter-spacing:.35em; text-transform:uppercase; color:#fff; margin-bottom:2rem; }

.form-gnf .hp{ position:absolute; left:-9999px; } /* honeypot */

.block{ margin-bottom:1.75rem; }
.block > legend{ font-size:.95rem; font-weight:700; color:#e9eef6; margin-bottom:.75rem; }
.block-resp .legend-side{
  font-size:.95rem; font-weight:700; margin-top:.25rem;
  color:#e9eef6; opacity:.9;
}

.form-label{ color:#e9eef6; font-size:.95rem; margin-bottom:.25rem; }

/* Inputs estilo subrayado */
.input-line{
  width:100%; background:transparent; border:none; border-bottom:1px solid rgba(255,255,255,.35);
  color:#fff; padding:.5rem 0 .6rem; border-radius:0; outline:0;
}
.input-line:focus{ border-bottom-color:#fff; box-shadow:none; outline:0; }
.input-line::placeholder{ color:#aab6c5; }

/* Checkbox y botón */
.form-check-label{ color:#cbd5e1; font-size:.9rem; }
.btn-submit{
  display:inline-block; background:#ffffff; color:#1a2230; border:0;
  padding:.6rem 1.5rem; border-radius:.3rem; font-weight:700;
}
.btn-submit:disabled{ opacity:.75; }

.form-status{ margin-top:.75rem; min-height:1.2em; color:#e9eef6; text-align:center; }

.contact-mail{
  display:flex; align-items:center; gap:.5rem; justify-content:center;
  margin-top:1rem; color:#e9eef6;
}
.contact-mail a{ color:#e9eef6; text-decoration:none; }
.mail-ico{ width:26px; height:auto; opacity:.9; }

@media (min-width:768px){
  .section-form{ padding:3.5rem 0; }
}


/* ===== FOOTER ===== */
.footer-gnf{ background:#12d0de; color:#0f1923; }
.footer-gnf a{ color:#0f1923; text-decoration:none; }

.f-gnflogo{ height:64px; width:auto; display:block; }
.partner{ height:54px; width:auto; display:block; }
.partner.jerez{ height:58px; }

.f-strap, .strap-mobile{ display:flex; align-items:center; gap:.75rem; }
.strap-left{ font-weight:600; letter-spacing:.35em; text-transform:uppercase; font-size:.8rem; }
.strap-line{ flex:1; height:1px; background:#0f1923; opacity:.55; display:block; }

.social-label{ font-weight:600; letter-spacing:.1em; text-transform:uppercase; font-size:.85rem; }
.social-ico{ height:24px; width:auto; display:block; }
.social-handle{ font-weight:600; }

.footer-sep{ border:0; border-top:1px solid rgba(15,25,35,.35); opacity:.8; }
.copy, .legal{ color:#0f1923; }
.legal a{ margin:0 .25rem; }
.legal .sep{ color:#0f1923; margin:0 .25rem; }

@media (max-width: 991.98px){
  .partner{ height:42px; }
  .partner.jerez{ height:46px; }
  .f-gnflogo{ height:56px; }
}

/* opcional: mejorar alineación/hover de los iconos */
.social a{ display:inline-flex; align-items:center; }
.social a:hover{ opacity:.8; }

/* puedes eliminar la regla .social-ico si la tenías */

/* ===== Páginas legales ===== */

/* Header legal (acorde al footer: fondo cian, texto oscuro) */
.legal-header{
  background:#12d0de; color:#0f1923; border-bottom:1px solid rgba(15,25,35,.25);
}
.legal-header .container{ padding-top:1rem; padding-bottom:1rem; }
.lh-logo{ height:48px; width:auto; display:block; }
.brand-text{ font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:.9rem; }
.back-home{ color:#0f1923; text-decoration:none; font-weight:600; }
.back-home:hover{ opacity:.8; }

/* Cuerpo legal (fondo claro para máxima legibilidad) */
/* ===== Páginas legales (tema oscuro) ===== */
.legal-main{
  background:#141a28;            /* azul oscuro */
  color:#ffffff;
  padding:3rem 0;
}
.legal-article{
  max-width: 820px; margin: 0 auto;
  font-size:1rem; line-height:1.75;
  color:#e9eef6;                 /* texto base algo más suave */
}
.legal-article h1,
.legal-article h2,
.legal-article h3{
  color:#ffffff;
}
.legal-article h1{
  font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  font-size: clamp(1.35rem, 1.1rem + 1.2vw, 1.75rem);
  margin:0 0 1rem 0;
}
.legal-article .updated{ color:#b9c3d1; font-size:.95rem; margin-bottom:1.25rem; }
.legal-article h2{ font-weight:700; margin-top:1.8rem; margin-bottom:.75rem; font-size:clamp(1.1rem, 1rem + .5vw, 1.35rem); }
.legal-article h3{ font-weight:600; margin-top:1.4rem; margin-bottom:.5rem; }

/* Enlaces con acento cian */
.legal-article a{
  color:#26d7e9;
  text-decoration:underline;
}
.legal-article a:hover{ color:#8beef5; }

/* Separadores y listas */
.legal-article hr{ border:0; border-top:1px solid rgba(255,255,255,.15); margin:1.75rem 0; }
.legal-article ul, .legal-article ol{ padding-left:1.2rem; }

/* Tablas en oscuro */
.legal-article table{
  width:100%; border-collapse:collapse; margin:1rem 0; font-size:.95rem;
  color:#e9eef6;
}
.legal-article th, .legal-article td{
  border:1px solid rgba(255,255,255,.15);
  padding:.6rem .7rem; vertical-align:top;
}
.legal-article th{ background:rgba(255,255,255,.06); }

/* Citas */
.legal-article blockquote{
  margin:1rem 0; padding:.9rem 1rem;
  border-left:4px solid #26d7e9;
  background:rgba(255,255,255,.06);
  color:#e9eef6;
}

/* Responsive */
@media (max-width: 991.98px){
  .legal-main{ padding:2.2rem 0; }
}


/* === DIN Next LT Arabic (Light/Regular/Bold) === */
@font-face{
  font-family: "DINNextLTArabic";
  src: url("../fonts/DINNextLTArabic-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "DINNextLTArabic";
  src: url("../fonts/DINNextLTArabic-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "DINNextLTArabic";
  src: url("../fonts/DINNextLTArabic-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Aplica la fuente a todo */
html, body, button, input, select, textarea {
  font-family: "DINNextLTArabic", -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Encabezados y utilidades (evita falsos pesos) */
h1, h2, h3, h4, h5, h6 { font-weight: 700; }
.fw-bold { font-weight: 700 !important; }
.fw-semibold { font-weight: 400 !important; }  /* la familia no trae semibold */
.fw-normal { font-weight: 400 !important; }
.fw-light { font-weight: 300 !important; }
.fw-extrabold { font-weight: 700 !important; } /* evita “faux bold” */