/* ============================================================
   PDH — Proshop del Horacio · Landing
   Paleta y tipografía según Manual de Identidad (Caro Llano.AC)
   Green #1A4033 · Musgo #37633F · Gold #E0A326
   Off White #F6F7F9 · Black Chalkboard #151716
   Títulos: Panama (sustituto web: Prata) · Cuerpo: Neue Haas
   Grotesque (sustituto: Helvetica Neue/Inter) · Botones: Bebas Neue
   ============================================================ */

:root{
  --green:#1A4033;
  --musgo:#37633F;
  --gold:#E0A326;
  --offwhite:#F6F7F9;
  --black:#151716;
  --ink:#1f2421;
  --ink-soft:#5c655f;
  --line:rgba(26,64,51,.15);
  --font-title:"Prata",Georgia,serif;
  --font-body:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-btn:"Bebas Neue",sans-serif;
  --radius:14px;
  --max:1120px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--offwhite);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
section{padding:72px 0}

h1,h2,h3{font-family:var(--font-title);font-weight:400;line-height:1.15;color:var(--green)}
h1{font-size:clamp(2.2rem,5.5vw,4rem)}
h2{font-size:clamp(1.7rem,3.4vw,2.6rem);margin-bottom:10px}
h3{font-size:1.25rem}

.kicker{font-family:var(--font-btn);letter-spacing:.22em;font-size:.85rem;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:10px}
.sub{color:var(--ink-soft);max-width:560px;margin-bottom:36px}

/* ---------- Botones (Bebas, pill — button style 01/02 del manual) */
.btn{font-family:var(--font-btn);font-size:1rem;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;padding:13px 30px;border-radius:999px;border:1.5px solid var(--green);color:var(--green);background:transparent;cursor:pointer;transition:all .22s ease;white-space:nowrap}
.btn:hover{background:var(--green);color:var(--offwhite)}
.btn.solid{background:var(--green);color:var(--offwhite)}
.btn.solid:hover{background:var(--musgo);border-color:var(--musgo)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--black)}
.btn.gold:hover{background:#c88f1c;border-color:#c88f1c}
.btn.light{border-color:var(--offwhite);color:var(--offwhite)}
.btn.light:hover{background:var(--offwhite);color:var(--green)}
.btn.sm{padding:9px 20px;font-size:.9rem}

/* ---------- Nav */
header.site{position:sticky;top:0;z-index:60;background:rgba(246,247,249,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:20px;height:72px}
.brand{display:flex;align-items:center;flex-shrink:0}
.brand img{height:48px;width:auto;display:block}
.nav .links{display:flex;gap:18px;flex:1;justify-content:center;font-size:.88rem}
.nav .links a{color:var(--ink-soft);padding:6px 2px;border-bottom:2px solid transparent;transition:.2s}
.nav .links a:hover{color:var(--green)}
.nav .links a.on{color:var(--green);border-bottom-color:var(--gold);font-weight:600}
.nav-toggle{display:none;background:none;border:none;font-size:1.6rem;color:var(--green);cursor:pointer}
/* Tabs deshabilitadas con badge "Pronto" (teasers Proshop y Clasificados) */
.nav .links a.soon{cursor:default;display:inline-flex;align-items:center;gap:7px}
.nav .links a.soon:hover{color:var(--ink-soft)}
.soon-tag{font-family:var(--font-btn);font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;background:var(--gold);color:var(--black);border-radius:999px;padding:2px 6px;line-height:1.5}

/* ---------- Placeholders de foto (a reemplazar por assets reales) */
.ph{position:relative;overflow:hidden;background:linear-gradient(145deg,var(--green),var(--musgo));border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:rgba(246,247,249,.55)}
.ph::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 20% 10%,rgba(224,163,38,.14),transparent 55%)}
.ph span{position:relative;z-index:1;font-family:var(--font-btn);letter-spacing:.18em;font-size:.8rem;text-transform:uppercase;text-align:center;padding:0 14px}
.ph.gold{background:linear-gradient(145deg,#b9821a,var(--gold))}
.ph.dark{background:linear-gradient(160deg,var(--black),#2a3330)}
.ph.photo{background-size:cover;background-position:center}
.ph.photo::after{display:none}

/* ---------- Carruseles */
.carousel{position:relative}
.track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:6px}
.track::-webkit-scrollbar{display:none}
.track>*{scroll-snap-align:start;flex-shrink:0}
.c-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1.5px solid var(--green);background:var(--offwhite);color:var(--green);font-size:1.2rem;cursor:pointer;z-index:5;display:flex;align-items:center;justify-content:center;transition:.2s;box-shadow:0 4px 14px rgba(21,23,22,.12)}
.c-nav:hover{background:var(--green);color:var(--offwhite)}
.c-nav.prev{left:-14px}
.c-nav.next{right:-14px}
.dots{display:flex;gap:8px;justify-content:center;margin-top:20px}
.dots button{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--green);background:transparent;cursor:pointer;padding:0;transition:.2s}
.dots button.on{background:var(--gold);border-color:var(--gold)}

/* ---------- Hero (home) */
.hero{background:var(--green);color:var(--offwhite);position:relative;overflow:hidden}
.hero .slide{width:100%;min-height:560px;display:flex;align-items:center;position:relative;overflow:hidden}
/* Fondo por variables (--veil/--bg/--bg-m/--pos en el style inline del slide):
   en mobile se sirve la variante liviana -m */
.hero .slide{background-image:var(--veil),var(--bg);background-position:var(--pos,center);background-size:cover}
.hero .slide-inner{max-width:var(--max);margin:0 auto;padding:90px 24px;width:100%;position:relative;z-index:1}
.hero .bgvideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .veil{position:absolute;inset:0;pointer-events:none;background-image:var(--veil)}
video.ph{width:100%;object-fit:cover;display:block}
.hero h1{color:var(--offwhite);max-width:640px}
.hero .kicker{color:var(--gold)}
.cup-logo{display:block;width:112px;height:auto;margin-bottom:16px;filter:drop-shadow(0 4px 14px rgba(21,23,22,.35))}
.hero p.lead{color:rgba(246,247,249,.78);max-width:520px;margin:18px 0 32px;font-size:1.08rem}
.hero .deco{position:absolute;right:-4%;bottom:-12%;width:46%;opacity:.09;pointer-events:none}
.hero .countdown{display:flex;gap:14px;margin:22px 0 30px}
.hero .countdown div{background:rgba(246,247,249,.08);border:1px solid rgba(246,247,249,.18);border-radius:10px;padding:10px 16px;text-align:center;min-width:74px}
.hero .countdown b{display:block;font-family:var(--font-title);font-size:1.6rem;color:var(--gold)}
.hero .countdown small{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,247,249,.6)}

/* ---------- Stats (Qué es PDH) */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;text-align:center}
.stat b{display:block;font-family:var(--font-title);font-size:2rem;color:var(--green)}
.stat span{font-size:.82rem;color:var(--ink-soft);letter-spacing:.04em}

/* ---------- Qué es PDH (video + contenido) */
.about-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}
.about-video{position:relative;margin:0;border-radius:var(--radius);background:var(--black);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.about-video::after{content:"";position:absolute;inset:14px -14px -14px 14px;border:1px solid rgba(224,163,38,.55);border-radius:var(--radius);pointer-events:none;z-index:-1}
.band-green .about-stats .stat{background:rgba(246,247,249,.05);border-color:rgba(246,247,249,.14)}
.band-green .about-stats .stat b{color:var(--gold)}
.band-green .about-stats .stat span{color:rgba(246,247,249,.65)}
.about-video video{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:var(--radius)}
.about-video-tag{position:absolute;top:14px;left:14px;font-family:var(--font-btn);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--offwhite);background:rgba(21,23,22,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:6px 14px;border-radius:999px}
.sound-toggle{position:absolute;bottom:14px;left:14px;font-family:var(--font-btn);font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;background:var(--gold);color:var(--black);border:0;padding:9px 18px;border-radius:999px;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.28);transition:transform .15s ease,background .15s ease}
.sound-toggle:hover{transform:translateY(-1px)}
.sound-toggle[aria-pressed="true"]{background:var(--offwhite)}
.about-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
.about-stats .stat{text-align:left;padding:18px 20px}
.about-stats .stat b{font-size:1.7rem}
.about-ctas{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
/* Mini-carrusel "Qué es PDH": el clip de Grillo + episodios destacados */
.about-carousel .track{gap:28px}
.about-carousel .track>figure{width:100%}
.about-carousel .about-video .ep-thumb{aspect-ratio:4/3;border-radius:var(--radius)}
.about-carousel .dots{margin-top:18px}
.band-green .dots button{border-color:rgba(246,247,249,.65)}

/* ---------- Cards viaje */
.trip-featured{display:grid;grid-template-columns:1.1fr 1fr;gap:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:44px;box-shadow:0 10px 34px rgba(21,23,22,.07)}
.trip-featured .ph{min-height:340px;border-radius:0}
.trip-cup{position:absolute;top:16px;left:16px;width:84px;height:auto;z-index:1;filter:drop-shadow(0 3px 10px rgba(21,23,22,.4))}
.ph span.trip-flag{position:absolute;top:20px;right:16px;left:auto;z-index:1;font-family:var(--font-btn);font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;background:var(--gold);color:var(--black);padding:7px 16px 6px;border-radius:999px;box-shadow:0 4px 14px rgba(21,23,22,.35);white-space:nowrap}
.trip-featured .body{padding:38px 40px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.badge{display:inline-block;font-family:var(--font-btn);font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;background:var(--gold);color:var(--black);padding:5px 14px;border-radius:999px;width:fit-content}
.badge.green{background:var(--green);color:var(--offwhite)}
.badge.soft{background:rgba(26,64,51,.08);color:var(--green)}
.facts{display:flex;flex-wrap:wrap;gap:8px}
.facts span{font-size:.8rem;border:1px solid var(--line);border-radius:999px;padding:5px 13px;background:var(--offwhite);color:var(--ink-soft)}
.cupos{display:flex;align-items:center;gap:12px;font-size:.8rem;color:var(--ink-soft)}
.cupos .bar{flex:1;height:8px;border-radius:99px;background:rgba(26,64,51,.1);overflow:hidden}
.cupos .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--musgo),var(--gold));border-radius:99px}
.price-line{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.price-line small{color:var(--ink-soft);font-size:.85rem}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;width:330px;transition:transform .22s,box-shadow .22s}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(21,23,22,.1)}
.card .ph{height:190px;border-radius:0}
.card .inner{padding:20px 22px}
.card .inner h3{margin-bottom:4px}
.card .inner p{font-size:.85rem;color:var(--ink-soft);margin-bottom:12px}
.cta-link{font-family:var(--font-btn);letter-spacing:.14em;font-size:.9rem;color:var(--green);border-bottom:1.5px solid var(--gold);padding-bottom:2px;text-transform:uppercase}
.cta-link:hover{color:var(--gold)}

/* ---------- Split (tour resumen home) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}

/* ---------- Listing (fechas) */
.listing{display:flex;align-items:center;gap:18px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;margin-bottom:14px;transition:.2s}
.listing:hover{border-color:var(--musgo)}
.listing .ph{width:96px;height:96px;flex-shrink:0}
.listing .info{flex:1;min-width:0}
.listing .info b{display:block;font-size:.98rem;color:var(--green)}
.listing .info small{color:var(--ink-soft);font-size:.82rem}
.listing.played{opacity:.78}
.listing .winline{display:block;margin-top:2px}
.listing .winline b{display:inline;font-family:var(--font-btn);font-weight:400;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-right:6px}

/* ---------- Tabla ranking */
table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);font-size:.9rem}
th{font-family:var(--font-btn);letter-spacing:.14em;font-size:.82rem;text-transform:uppercase;background:var(--green);color:var(--offwhite);padding:13px 16px;text-align:left;font-weight:400}
td{padding:12px 16px;border-top:1px solid var(--line);color:var(--ink-soft)}
tr td:first-child{font-family:var(--font-title);color:var(--gold);font-size:1.05rem;width:52px}
tbody tr:hover{background:rgba(224,163,38,.06)}

/* ---------- Clips */
.clip{width:225px;height:390px;border-radius:var(--radius)}
.clip-card{width:300px;flex-shrink:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 10px 30px rgba(21,23,22,.08);transition:transform .22s,box-shadow .22s}
.clip-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(21,23,22,.16)}
/* Recorte del embed de IG: el iframe va 42% más ancho y centrado para que el
   área de media (que IG clava en 4:5 con letterbox) llene el marco 9:16 del
   reel sin franjas negras; top -54px oculta el header y el alto extra empuja
   el footer de IG fuera del crop. Calibrado visualmente — tocar con cuidado. */
.clip-crop{position:relative;aspect-ratio:9/16;overflow:hidden;background:var(--black)}
.clip-crop iframe{position:absolute;top:-54px;left:-21%;width:142%;height:calc(100% + 300px);border:0}
.clip-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-top:1px solid var(--line)}
.clip-foot small{color:var(--ink-soft);font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clip-foot a{font-family:var(--font-btn);letter-spacing:.1em;font-size:.85rem;text-transform:uppercase;color:var(--green);white-space:nowrap;transition:.2s}
.clip-foot a:hover{color:var(--gold)}
.gvideo{width:237px;height:420px;object-fit:cover;border-radius:var(--radius);flex-shrink:0;background:var(--black)}
@media(max-width:700px){.clip-card{width:min(300px,88vw)}}
.clip .play{width:52px;height:52px;border-radius:50%;border:1.5px solid rgba(246,247,249,.7);display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--offwhite);position:relative;z-index:1}
/* ---------- Episodios (contenido.html) */
.ep-card{width:340px;flex-shrink:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 10px 30px rgba(21,23,22,.08);transition:transform .22s,box-shadow .22s;display:flex;flex-direction:column}
.ep-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(21,23,22,.16)}
.ep-thumb{position:relative;aspect-ratio:16/9;background:var(--black);background-size:cover;background-position:center;cursor:pointer;border:0;padding:0;display:block;width:100%}
.ep-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(21,23,22,.45))}
.ep-thumb .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;background:var(--gold);color:var(--black);display:flex;align-items:center;justify-content:center;font-size:1.15rem;z-index:1;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .2s}
.ep-card:hover .play{transform:translate(-50%,-50%) scale(1.08)}
.ep-thumb iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:2}
.ep-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.ep-body small{font-family:var(--font-btn);letter-spacing:.14em;text-transform:uppercase;font-size:.74rem;color:var(--gold)}
.ep-body h3{font-size:1.02rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ep-body a{color:inherit;transition:.2s}
.ep-body a:hover{color:var(--musgo)}
.ep-card.more{background:var(--green);border-color:var(--green);align-items:center;justify-content:center;text-align:center;gap:14px;padding:24px;min-height:100%}
.ep-card.more strong{font-family:var(--font-title);font-weight:400;color:var(--offwhite);font-size:1.3rem;line-height:1.3}
@media(max-width:700px){.ep-card{width:80vw}}

.platforms{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.platforms a{font-family:var(--font-btn);letter-spacing:.12em;font-size:.9rem;border:1.5px solid var(--green);border-radius:999px;padding:9px 22px;color:var(--green);transition:.2s;text-transform:uppercase;display:inline-flex;align-items:center;gap:9px}
.platforms a:hover{background:var(--green);color:var(--offwhite)}
.platforms a svg{width:15px;height:15px;fill:currentColor;flex-shrink:0}

/* ---------- Operador del viaje (puntacana.html) */
.operado{display:flex;align-items:center;gap:12px;margin-top:30px;color:var(--ink-soft);font-size:.85rem}
.operado img{height:34px;width:auto}

/* ---------- Logos de las canchas (cordoba.html) */
/* Miniatura de listing = logo del club sobre blanco (reemplaza la foto de cancha) */
.listing .ph.club{background:#fff;border:1px solid var(--line)}
.listing .ph.club::after{display:none}
.listing .ph.club img{max-width:72%;max-height:72%;width:auto;height:auto}
.canchas-strip{display:flex;gap:48px;row-gap:22px;align-items:center;flex-wrap:wrap;margin-top:38px}
.canchas-strip img{height:48px;width:auto;opacity:.88;filter:grayscale(1);transition:opacity .2s,filter .2s}
.canchas-strip img:hover{opacity:1;filter:none}
@media(max-width:700px){.canchas-strip{gap:28px}.canchas-strip img{height:38px}}

/* ---------- Sponsors */
.sponsors{background:var(--black);color:var(--offwhite)}
.sponsors h2{color:var(--offwhite)}
.logo-strip{display:flex;gap:56px;align-items:center;overflow:hidden;margin-top:36px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logo-strip .strip-inner{display:flex;gap:56px;animation:marquee 26s linear infinite;flex-shrink:0}
.logo-strip .slot{height:64px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-strip .slot img{height:44px;width:auto;filter:brightness(0) invert(1);opacity:.8;transition:opacity .2s}
.logo-strip .slot:hover img{opacity:1}
@keyframes marquee{to{transform:translateX(calc(-100% - 56px))}}
/* Variante sobre fondo claro (clubes del tour): grayscale en vez de invert */
.logo-strip.clubs .slot{height:76px}
.logo-strip.clubs .slot img{height:56px;filter:grayscale(1);opacity:.85}
.logo-strip.clubs .slot:hover img{filter:none;opacity:1}

/* ---------- Newsletter */
.newsletter{background:var(--musgo);color:var(--offwhite)}
.newsletter h2{color:var(--offwhite)}
.newsletter .row{display:flex;gap:40px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.newsletter form{display:flex;gap:10px;flex-wrap:wrap}
.newsletter input{background:rgba(246,247,249,.1);border:1.5px solid rgba(246,247,249,.35);border-radius:999px;padding:13px 22px;color:var(--offwhite);font-family:var(--font-body);font-size:.95rem;min-width:0;flex:1 1 220px;outline:none}
.newsletter input::placeholder{color:rgba(246,247,249,.55)}
.newsletter input:focus{border-color:var(--gold)}

/* ---------- Steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.steps.cols-5{grid-template-columns:repeat(5,1fr)}
.steps.cols-3{grid-template-columns:repeat(3,1fr)}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;position:relative}
.step b{font-family:var(--font-title);font-size:2rem;color:var(--gold);display:block;margin-bottom:8px}
.step h3{font-size:1rem;margin-bottom:6px}
.step p{font-size:.84rem;color:var(--ink-soft)}

/* ---------- Itinerario */
.day{display:grid;grid-template-columns:110px 150px 1fr;gap:22px;padding:0 0 34px 26px;border-left:2px solid var(--line);position:relative}
.day::before{content:"";position:absolute;left:-8px;top:4px;width:14px;height:14px;border-radius:50%;background:var(--gold);border:3px solid var(--offwhite);box-shadow:0 0 0 2px var(--gold)}
.day:last-child{border-left-color:transparent;padding-bottom:0}
.day .d-label{font-family:var(--font-btn);letter-spacing:.14em;font-size:1.05rem;color:var(--green);text-transform:uppercase}
.day .ph{height:96px}
.day h3{font-size:1.05rem;margin-bottom:4px}
.day p{font-size:.88rem;color:var(--ink-soft)}

/* ---------- Pricing */
.pricing{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:22px;align-items:start}
.price-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:32px 28px}
.price-card.featured{border:2px solid var(--gold);position:relative}
.price-card .amount{font-family:var(--font-title);font-size:2.4rem;color:var(--green);margin:10px 0 4px}
.price-card ul{list-style:none;margin-top:16px}
.price-card li{font-size:.86rem;color:var(--ink-soft);padding:7px 0 7px 24px;position:relative;border-bottom:1px dashed var(--line)}
.price-card li::before{content:"✓";position:absolute;left:0;color:var(--gold);font-weight:700}

/* ---------- Form */
.form-card{background:var(--green);color:var(--offwhite);border-radius:var(--radius);padding:34px 30px}
.form-card h3{color:var(--offwhite);margin-bottom:6px}
.form-card p{font-size:.85rem;color:rgba(246,247,249,.7);margin-bottom:20px}
.form-card label{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(246,247,249,.65);margin:14px 0 6px}
.form-card input,.form-card select{width:100%;background:rgba(246,247,249,.08);border:1.5px solid rgba(246,247,249,.25);border-radius:10px;padding:12px 14px;color:var(--offwhite);font-family:var(--font-body);font-size:.92rem;outline:none}
.form-card input:focus,.form-card select:focus{border-color:var(--gold)}
.form-card select option{color:var(--ink)}
.form-card .btn{width:100%;justify-content:center;margin-top:22px}

/* ---------- FAQ */
details{background:#fff;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:12px;overflow:hidden}
summary{cursor:pointer;padding:20px 24px;font-weight:600;color:var(--green);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
summary::after{content:"+";font-family:var(--font-title);font-size:1.4rem;color:var(--gold);transition:.2s}
details[open] summary::after{transform:rotate(45deg)}
details .a{padding:0 24px 20px;color:var(--ink-soft);font-size:.92rem}

/* ---------- Sticky CTA (viaje) */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:70;background:var(--black);color:var(--offwhite);padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;transform:translateY(110%);transition:transform .3s ease}
.sticky-cta.show{transform:translateY(0)}
.sticky-cta b{font-family:var(--font-title);font-weight:400}
.sticky-cta small{display:block;font-size:.75rem;color:var(--gold);letter-spacing:.1em;text-transform:uppercase}

/* ---------- Player / contenido */
.episode{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.video-ph{aspect-ratio:16/9;border-radius:var(--radius)}
.video-ph .play{width:74px;height:74px;border-radius:50%;background:var(--gold);color:var(--black);display:flex;align-items:center;justify-content:center;font-size:1.5rem;position:relative;z-index:1;box-shadow:0 10px 30px rgba(0,0,0,.3)}

/* ---------- Footer */
footer.site{background:var(--green);color:rgba(246,247,249,.75);padding:60px 0 34px}
footer .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px;margin-bottom:44px}
footer h4{font-family:var(--font-btn);letter-spacing:.18em;font-size:.9rem;color:var(--gold);margin-bottom:14px;text-transform:uppercase;font-weight:400}
footer a{display:block;font-size:.9rem;padding:4px 0;color:rgba(246,247,249,.75)}
footer a:hover{color:var(--offwhite)}
footer .brand img{height:76px}
footer .legal{border-top:1px solid rgba(246,247,249,.15);padding-top:22px;font-size:.78rem;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:rgba(246,247,249,.45)}

/* ---------- Secciones alternadas */
.band{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.band-green{background:var(--green);color:var(--offwhite)}
.band-green h2{color:var(--offwhite)}
.band-green .sub{color:rgba(246,247,249,.7)}

/* ---------- Search field */
.search{display:flex;align-items:center;gap:10px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:4px 8px 4px 22px;max-width:360px;margin-bottom:24px}
.search input{border:none;outline:none;flex:1;font-family:var(--font-body);font-size:.92rem;background:transparent;padding:10px 0;color:var(--ink)}

/* ---------- Responsive */
@media(max-width:900px){
  .stats,.steps,.steps.cols-5,.steps.cols-3{grid-template-columns:1fr 1fr}
  .about-grid{grid-template-columns:1fr;gap:28px}
  .about-video::after{display:none}
  .about-video video{aspect-ratio:16/9}
  .about-carousel .about-video .ep-thumb{aspect-ratio:16/9}
  .trip-featured,.split,.episode{grid-template-columns:1fr}
  .pricing{grid-template-columns:1fr}
  /* itinerario: label | texto arriba, foto abajo a lo ancho (sin esto el
     texto cae por auto-placement en la columna de 80px del label) */
  .day{grid-template-columns:80px 1fr}
  .day>div:last-child{grid-column:2;grid-row:1}
  .day .ph{grid-column:2;grid-row:2;height:150px}
  footer .grid{grid-template-columns:1fr 1fr}
}
/* Tramo desktop angosto: se aprietan gaps y tipografía para que
   las 7 tabs (2 con badge "Pronto") + CTA sigan entrando en una fila */
@media(max-width:1200px){
  .nav{gap:14px}
  .nav .links{gap:13px;font-size:.85rem}
}
/* El nav colapsa a hamburguesa antes que el resto del layout:
   aun compactado, con 7 tabs + CTA no entra por debajo de ~1020px */
@media(max-width:1020px){
  .nav{gap:12px}
  .nav .links{display:none;position:absolute;top:72px;left:0;right:0;background:var(--offwhite);flex-direction:column;padding:18px 24px;gap:4px;border-bottom:1px solid var(--line);box-shadow:0 16px 30px rgba(21,23,22,.08)}
  .nav .links.open{display:flex}
  .nav .links a{padding:12px 0;border-bottom:none}
  .nav-toggle{display:block}
  .nav .btn{margin-left:auto;padding:8px 14px;font-size:.82rem}
}
@media(max-width:700px){
  .brand img{height:44px}
  /* CTAs con texto largo (p. ej. hidratados desde la API) no se recortan */
  .btn{white-space:normal;text-align:center}
  .hero .slide{min-height:520px;background-image:var(--veil),var(--bg-m,var(--bg))}
  section{padding:52px 0}
  .c-nav{display:none}
  .card{width:78vw}
  .clip{width:56vw;height:340px}
  .trip-featured .body{padding:26px 22px}
  .cup-logo{width:84px;margin-bottom:12px}
  .trip-cup{width:64px;top:12px;left:12px}
  .ph span.trip-flag{font-size:.72rem;top:14px;right:12px;padding:6px 12px 5px}
  /* items de carrusel con width inline fijo: cap al viewport */
  .track>.ph.photo{max-width:84vw}
  .gvideo{width:192px;height:340px}
  /* listings (fechas): badge y botón bajan a una segunda fila */
  .listing{flex-wrap:wrap;row-gap:10px}
  .listing .info{flex:1 1 55%;min-width:0}
  .listing .btn{margin-left:auto}
  /* tabla de ranking: sin columna Hcp, compacta */
  th,td{padding:10px 10px}
  #rank-table{font-size:.84rem}
  #rank-table th:nth-child(3),#rank-table td:nth-child(3){display:none}
  tr td:first-child{width:36px}
  .newsletter form{width:100%;max-width:420px}
  .sticky-cta{flex-wrap:wrap;gap:10px;padding:12px 16px}
  .sticky-cta>div{flex:1 1 100%;font-size:.9rem}
  .sticky-cta .btn{width:100%;justify-content:center}
}
@media(max-width:480px){
  .wrap{padding:0 18px}
  .hero .slide{min-height:440px}
  .hero .slide-inner{padding:64px 18px}
  .hero .countdown{gap:10px}
  .hero .countdown div{min-width:60px;padding:8px 10px}
  .trip-featured .ph{min-height:230px}
  .step{padding:20px 16px}
}

/* ---------- Ranking en vivo (PDH Tour · datos de Green) */
.rank-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}
.rank-tabs button{font-family:var(--font-btn);font-size:.88rem;letter-spacing:.14em;text-transform:uppercase;padding:8px 18px;border-radius:999px;border:1.5px solid var(--green);background:transparent;color:var(--green);cursor:pointer;transition:all .2s ease}
.rank-tabs button:hover{background:rgba(26,64,51,.08)}
.rank-tabs button.on{background:var(--green);color:var(--offwhite)}
.rank-tabs button i{font-style:normal;font-family:var(--font-body);font-size:.72rem;letter-spacing:0;opacity:.6;margin-left:4px}
.rank-tabs button:disabled{cursor:default}
.rank-tabs button:disabled:not(.on):hover{background:transparent}
#rank-table td b{color:var(--ink)}
#rank-table tr.no-clasifica td{opacity:.55}
#rank-table tr.cutline td{font-family:var(--font-btn);letter-spacing:.16em;text-transform:uppercase;font-size:.72rem;color:var(--gold);text-align:center;padding:6px 16px;background:rgba(224,163,38,.07);border-top:2px dashed var(--gold)}

/* ---------- Stats del Tour (récords en vivo) */
.stat .stat-label{display:block;font-family:var(--font-btn);letter-spacing:.16em;font-size:.76rem;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.stat .who{display:block;font-weight:600;color:var(--ink);font-size:.95rem;letter-spacing:0}
.stat small{display:block;font-size:.78rem;color:var(--ink-soft);margin-top:2px}

/* ---------- Ficha de la próxima fecha (dentro de la form-card) */
.ficha-fecha{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 6px;text-align:left}
.ficha-fecha>div{background:rgba(246,247,249,.07);border:1px solid rgba(246,247,249,.18);border-radius:10px;padding:10px 14px}
.ficha-fecha small{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,247,249,.6);margin-bottom:2px}
.ficha-fecha b{font-family:var(--font-title);font-weight:400;color:var(--offwhite);font-size:1rem}

/* ---------- Resultados por fecha: tablero de golf (estilo Masters, paleta PDH) */
summary .sum-t{flex:1;text-align:left}
summary .sum-sub{font-weight:400;color:var(--ink-soft);font-size:.82rem;white-space:nowrap}
details.res-board{background:var(--green);border-color:rgba(224,163,38,.4)}
details.res-board summary{color:var(--offwhite);font-family:var(--font-title);font-weight:400}
details.res-board summary .sum-sub{color:rgba(246,247,249,.55);font-family:var(--font-body)}
.board{padding:2px 24px 18px}
.b-head,.b-row{display:grid;grid-template-columns:40px 1fr 70px 60px 60px;gap:10px;align-items:center}
.b-head{font-family:var(--font-btn);letter-spacing:.16em;font-size:.7rem;text-transform:uppercase;color:rgba(246,247,249,.5);padding:6px 0 8px;border-bottom:1px solid rgba(246,247,249,.18)}
.b-head span:nth-child(n+3),.b-row span:nth-child(n+3){text-align:right}
.b-cat{font-family:var(--font-btn);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-size:.88rem;margin:16px 0 2px}
.b-cat i{font-style:normal;color:rgba(246,247,249,.4);font-size:.7rem;letter-spacing:.08em}
.b-row{padding:7px 0;border-bottom:1px solid rgba(246,247,249,.08);font-size:.92rem;color:rgba(246,247,249,.85)}
.b-row .pos{font-family:var(--font-title);color:var(--gold)}
.b-row .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.b-row .name b{color:var(--offwhite)}
.b-row .sc{font-family:var(--font-title);font-size:1.05rem;color:var(--offwhite)}
.b-row .sc.under{color:#ff8d84}
.b-row .num{color:rgba(246,247,249,.6)}
.b-foot{margin-top:14px;font-size:.82rem;color:rgba(246,247,249,.55)}
@media(max-width:700px){
  summary .sum-sub{display:none}
  .board{padding:2px 16px 14px}
  .b-head,.b-row{grid-template-columns:30px 1fr 56px 46px;gap:8px}
  .b-head span:nth-child(5),.b-row span:nth-child(5){display:none}
}

/* ---------- Ranking: score + tabla colapsable */
#rank-table td .rank-net{font-size:.8rem;color:var(--ink-soft);opacity:.8}
#rank-table tr.extra{display:none}
#rank-table tbody.expandida tr.extra,#rank-table tbody.buscando tr.extra{display:table-row}
#rank-table tr.ver-mas td{text-align:center;padding:12px;width:auto}
#rank-table tr.ver-mas button{font-family:var(--font-btn);letter-spacing:.14em;text-transform:uppercase;font-size:.85rem;background:none;border:none;border-bottom:1.5px solid var(--gold);color:var(--green);cursor:pointer;padding:0 0 2px;transition:.2s}
#rank-table tr.ver-mas button:hover{color:var(--gold)}
