/* Páginas internas — mismo lenguaje que la home (Propuesta A) */

/* ---- hero de página ---- */
.phero{position:relative;min-height:92svh;display:grid;align-items:end;padding:0 var(--gut) 13vh;overflow:hidden}
.phero-bg{position:absolute;inset:0}
.phero-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);opacity:0;transition:opacity 2.4s var(--e-io) .2s,transform 4s var(--e-out) .2s}
.ready .phero-bg img{opacity:1;transform:scale(1)}
.phero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,9,9,.88),rgba(10,9,9,.25) 55%,rgba(10,9,9,.45))}
.phero-bg.gray img{filter:grayscale(1) sepia(.2) brightness(.8)}
.phero-in{position:relative;z-index:2;max-width:1100px}
.phero h1{font-size:clamp(46px,7.6vw,128px);line-height:.98;margin-bottom:34px}
.phero h1 em{font-weight:200}
.phero .lede{max-width:52ch;color:rgba(235,229,220,.78);font-size:18px;margin:0}
.phero.plain{min-height:78svh;align-items:center;padding-top:16vh;padding-bottom:8vh}
.phero .crumb{position:absolute;z-index:2;right:var(--gut);bottom:13vh;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);writing-mode:vertical-rl}

/* ---- bloques ---- */
.wrap{padding:26vh var(--gut)}
.stmt{display:grid;justify-items:center;text-align:center;padding:30vh var(--gut) 26vh}
.stmt h2{font-size:clamp(34px,4.8vw,80px);max-width:18ch}
.stmt p{max-width:56ch;margin:48px 0 0;color:var(--mute);font-size:18px}
.stmt .perfiles-wrap{margin-bottom:9vh}

/* editorial: imagen grande + texto, con aire */
.ed{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:center;padding:16vh var(--gut)}
.ed-img{grid-column:1/8;margin:0;aspect-ratio:4/5;overflow:hidden;position:relative}
.ed-img.land{aspect-ratio:4/3}
.ed-txt{grid-column:9/13}
.ed.rev .ed-img{grid-column:6/13;grid-row:1}
.ed.rev .ed-txt{grid-column:1/5;grid-row:1}
.ed-txt h2,.ed-txt h3{font-size:clamp(34px,3.8vw,62px);margin-bottom:30px}
.ed-txt p{color:var(--mute);margin:0 0 20px}
.ed-txt p.big{font-family:var(--serif);font-weight:300;font-size:22px;line-height:1.45;color:var(--fg)}
.chap{display:flex;align-items:baseline;gap:18px;margin-bottom:26px}
.chap b{font-family:var(--serif);font-weight:200;font-size:72px;line-height:.8}
.chap span{font-size:11.5px;letter-spacing:.32em;text-transform:uppercase;color:var(--mute)}
.who-fig{width:120px;margin-bottom:34px;color:var(--fg)}
.who-fig svg{width:100%;height:auto}
.who-fig svg path{opacity:.18}
.who-fig[data-face="0"] svg path:nth-child(1),.who-fig[data-face="1"] svg path:nth-child(2),.who-fig[data-face="2"] svg path:nth-child(3){opacity:1}
.mini-q{font-family:var(--serif);font-style:italic;font-weight:300;font-size:21px;line-height:1.45;border-left:1px solid var(--line);padding-left:22px;margin:34px 0 0;color:var(--fg)}
.mini-q cite{display:block;margin-top:12px;font-family:var(--sans);font-style:normal;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--mute)}

/* tríada */
.triad{display:grid;grid-template-columns:repeat(3,1fr);gap:4vw;padding:22vh var(--gut);max-width:1400px;margin:0 auto}
.triad div{border-top:1px solid var(--line);padding-top:28px}
.triad h3{font-size:clamp(34px,3.4vw,54px);margin-bottom:20px;font-style:italic}
.triad p{margin:0;color:var(--mute)}

/* año gigante con imagen */
.year{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:6vw;padding:24vh var(--gut)}
.year .year-n{font-family:var(--serif);font-weight:200;font-size:clamp(120px,19vw,320px);line-height:.8;letter-spacing:-.02em}
.year p{max-width:42ch;color:var(--mute);font-size:18px}
.year p.big{font-family:var(--serif);font-weight:300;font-size:26px;line-height:1.35;color:var(--fg)}
.year-img{margin:0;aspect-ratio:3/4;overflow:hidden}

/* dos orígenes */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:10vh var(--gut) 20vh}
.duo a,.duo article{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;color:var(--bone);text-decoration:none}
.duo img{width:100%;height:100%;object-fit:cover;transition:transform 2s var(--e-out)}
.duo article:hover img{transform:scale(1.04)}
.duo article::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,9,9,.82),transparent 55%)}
.duo .duo-t{position:absolute;left:34px;right:34px;bottom:34px;z-index:2}
.duo h3{font-size:clamp(34px,3.6vw,58px);font-style:italic;margin-bottom:12px}
.duo p{margin:0;color:rgba(235,229,220,.78);max-width:40ch}

/* pasos fijos (genérico, como generaciones en la home) */
.pin{position:relative}
.pin-sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:0 var(--gut)}
.pin-bg{position:absolute;inset:0}
.pin-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity 1.6s var(--e-io),transform 6s var(--e-out);filter:brightness(.42)}
.pin-bg img.is-on{opacity:1;transform:scale(1)}
.pin-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,9,9,.2),rgba(10,9,9,.8))}
.pin-big{position:relative;z-index:2;font-family:var(--serif);font-weight:200;font-size:clamp(110px,16vw,260px);line-height:.8}
.pin-big span{display:block;font-family:var(--sans);font-weight:300;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--mute);margin-top:18px}
.pin-steps{position:relative;z-index:2;height:min(56vh,480px);max-width:500px}
.pin-step{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center}
.pin-step>*{opacity:0;transform:translateY(24px);transition:opacity .9s var(--e-io),transform 1.2s var(--e-out)}
.pin-step.is-on>*{opacity:1;transform:none}
.pin-step.is-on>*:nth-child(2){transition-delay:.12s}.pin-step.is-on>*:nth-child(3){transition-delay:.26s}
.pin-step h3{font-size:clamp(34px,3.6vw,58px);margin:0 0 22px}
.pin-step p{margin:0;color:rgba(235,229,220,.8)}
.pin-step .gen-n{margin:0 0 22px}
.pin-ticks{position:absolute;z-index:2;left:var(--gut);bottom:7vh;display:flex;gap:10px}
.pin-ticks i{width:48px;height:1px;background:var(--line);position:relative;overflow:hidden}
.pin-ticks i::after{content:"";position:absolute;inset:0;background:var(--bone);transform:scaleX(var(--p,0));transform-origin:left}

/* horizontal */
.hs{position:relative}
.hs-sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:flex-end;padding-bottom:9vh}
.hs-head{position:absolute;top:10vh;left:var(--gut);z-index:2}
.hs-head h2{font-size:clamp(38px,4.2vw,66px)}
.hs-track{display:flex;gap:5vw;padding:0 12vw 0 42vw;align-items:flex-end;will-change:transform}
.hs-track figure{margin:0;flex:none;width:min(36vw,520px)}
.hs-track img{width:100%;height:42vh;object-fit:cover}
.hs-track figcaption{margin-top:20px}
.hs-track figcaption b{display:block;font-family:var(--serif);font-weight:300;font-style:italic;font-size:30px}
.hs-track figcaption span{color:var(--mute);font-size:15px}

/* ficha técnica */
.ficha{display:grid;grid-template-columns:4fr 8fr;gap:6vw;padding:24vh var(--gut);max-width:1400px;margin:0 auto}
.ficha h2{font-size:clamp(36px,4vw,64px)}
.ficha>div:first-child{position:sticky;top:18vh;align-self:start}
.ficha-tbl{border-top:1px solid var(--line)}
.ficha-tbl h3{font-family:var(--sans);font-weight:600;font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);margin:36px 0 6px}
.ficha-tbl div{display:grid;grid-template-columns:12rem 1fr;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.ficha-tbl dt{font-size:14px;color:var(--mute)}
.ficha-tbl dd{margin:0;font-family:var(--serif);font-weight:300;font-size:19px}
.ficha-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:40px}

/* añadas */
.tabs{display:inline-flex;gap:6px;margin-top:38px;border:1px solid var(--line);border-radius:999px;padding:5px}
.tabs button,.tabs span{padding:10px 20px;border-radius:999px;font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.tabs .on{background:var(--bone);color:var(--ink)}
.tabs .off{opacity:.45;cursor:default}

/* hero del vino */
.vhero{position:relative;min-height:100svh;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:4vw;padding:16vh var(--gut) 8vh}
.vhero-l h1{font-size:clamp(60px,8.6vw,150px);line-height:.9;text-transform:uppercase}
.vhero-l .eyebrow{margin-bottom:24px}
.vhero-bottle{width:min(190px,34vw);align-self:start;opacity:0;transform:translateY(60px);transition:opacity 2s var(--e-io) .5s,transform 2.6s var(--e-out) .5s}
.ready .vhero-bottle{opacity:1;transform:none}
.vhero-bottle img{width:100%;filter:drop-shadow(0 50px 60px rgba(0,0,0,.6))}
.vhero-r{justify-self:end;max-width:30ch;color:var(--mute)}
.vhero-r p{margin:0 0 18px}
.vhero-r b{display:block;color:var(--fg);font-family:var(--serif);font-weight:300;font-size:22px;line-height:1.35;font-style:italic}

/* pendiente (contenido a completar con la familia) */
.pending{border:1px dashed var(--line);padding:28px 30px;color:var(--mute);font-size:15px;max-width:640px}
.pending b{display:block;font-size:11px;letter-spacing:.3em;text-transform:uppercase;margin-bottom:10px;color:var(--fg)}
.tag-ej{display:inline-block;font-size:10px;letter-spacing:.24em;text-transform:uppercase;border:1px dashed currentColor;padding:2px 8px;margin-left:10px;opacity:.6;vertical-align:middle}

/* prensa */
.press{padding:6vh var(--gut) 22vh;max-width:1300px;margin:0 auto}
.press-item{display:grid;grid-template-columns:10rem 1fr auto;gap:30px;align-items:baseline;padding:34px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .6s var(--e-out)}
.press-item:first-child{border-top:1px solid var(--line)}
.press-item:hover{padding-left:14px}
.press-item time{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.press-item h3{font-size:clamp(24px,2.4vw,38px)}
.press-item span{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.scores{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:0 var(--gut) 22vh;max-width:1300px;margin:0 auto}
.scores div{border-top:1px solid var(--line);padding-top:24px}
.scores b{display:block;font-family:var(--serif);font-weight:200;font-size:76px;line-height:1}
.scores span{color:var(--mute)}
.kit{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center;padding:22vh var(--gut)}
.kit-img{margin:0;aspect-ratio:3/2;overflow:hidden}.kit-img img{width:100%;height:100%;object-fit:cover}
.kit h2{font-size:clamp(36px,4vw,64px);margin-bottom:24px}
.kit ul{list-style:none;margin:0 0 40px;padding:0;border-top:1px solid var(--line)}
.kit li{padding:14px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;color:var(--mute)}

/* dónde comprar */
.where{display:grid;grid-template-columns:4fr 8fr;gap:6vw;padding:20vh var(--gut);max-width:1400px;margin:0 auto}
.where h2{font-size:clamp(38px,4.4vw,70px)}
.where-list{border-top:1px solid var(--line)}
.where-row{display:grid;grid-template-columns:1fr 1fr auto;gap:20px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line)}
.where-row h3{font-family:var(--serif);font-weight:300;font-size:26px}
.where-row p{margin:0;color:var(--mute);font-size:15px}
.where-row a{font-size:12px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:4px}

/* contacto */
.contact{display:grid;grid-template-columns:5fr 7fr;min-height:100svh}
.contact-img{position:relative;overflow:hidden}
.contact-img img{width:100%;height:100%;object-fit:cover}
.contact-in{padding:22vh 7vw 12vh}
.contact-in h1{font-size:clamp(46px,5.6vw,96px);margin-bottom:26px}
.contact-in .lede{color:var(--mute);max-width:48ch;margin:0 0 7vh}
.form{display:grid;grid-template-columns:1fr 1fr;gap:28px 24px;max-width:720px}
.form label{display:grid;gap:8px;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--mute)}
.form .full{grid-column:1/-1}
.form input,.form select,.form textarea{font:inherit;font-size:17px;letter-spacing:0;text-transform:none;color:var(--fg);background:transparent;border:0;border-bottom:1px solid var(--line);padding:10px 0;border-radius:0;outline:none;transition:border-color .4s}
.form select{appearance:none;background:linear-gradient(45deg,transparent 50%,var(--mute) 50%) calc(100% - 6px) 55%/6px 6px no-repeat,linear-gradient(-45deg,transparent 50%,var(--mute) 50%) 100% 55%/6px 6px no-repeat}
.form select option{background:var(--ink);color:var(--bone)}
.form textarea{min-height:130px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--bone)}
.form .chk{grid-column:1/-1;display:flex;gap:12px;align-items:center;text-transform:none;letter-spacing:0;font-size:14px}
.form .chk input{width:16px;height:16px;accent-color:var(--red)}
.form-ok{display:none;grid-column:1/-1;color:var(--bone);font-family:var(--serif);font-style:italic;font-size:20px}
.form.sent .form-ok{display:block}
.contact-data{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:8vw;margin-top:12vh;padding-top:30px;border-top:1px solid var(--line);max-width:720px}
.contact-data p{margin:0;font-size:15px;color:var(--mute)}
.contact-data b{display:block;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--fg);font-weight:400;margin-bottom:8px}
.contact-data a{text-decoration:none}

/* siguiente página */
.next{position:relative;display:block;height:78svh;overflow:hidden;text-decoration:none;color:var(--bone)}
.next img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.42);transform:scale(1.06);transition:transform 2.4s var(--e-out),filter 1.2s}
.next:hover img{transform:scale(1);filter:brightness(.55)}
.next-in{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;gap:18px}
.next-in span{font-size:11.5px;letter-spacing:.32em;text-transform:uppercase;color:rgba(235,229,220,.7)}
.next-in b{font-family:var(--serif);font-weight:200;font-size:clamp(56px,9vw,160px);line-height:.9}
.next-in i{width:1px;height:60px;background:var(--bone);transform-origin:top;animation:cue 2.6s var(--e-io) infinite;background:linear-gradient(var(--bone),transparent);background-size:100% 200%}

/* activo en el menú */
.hdr a[aria-current="page"]{opacity:1;border-bottom:1px solid currentColor;padding-bottom:4px}

@media (max-width:900px){
  .phero{min-height:86svh;padding-bottom:10vh}
  .phero .crumb{display:none}
  .ed,.ed.rev{grid-template-columns:1fr;row-gap:44px;padding:10vh var(--gut)}
  .ed-img,.ed.rev .ed-img,.ed-txt,.ed.rev .ed-txt{grid-column:1;grid-row:auto}
  .triad{grid-template-columns:1fr;gap:44px;padding:14vh var(--gut)}
  .year{grid-template-columns:1fr;padding:16vh var(--gut)}
  .duo{grid-template-columns:1fr}
  .pin-sticky{grid-template-columns:1fr;grid-template-rows:auto 1fr;padding:14vh var(--gut) 10vh}
  .pin-big{font-size:96px}
  .pin-steps{height:48vh}
  .hs-track{padding:0 8vw;gap:7vw}
  .hs-track figure{width:74vw}
  .hs-track img{height:44vh}
  .ficha,.where{grid-template-columns:1fr;gap:40px;padding:14vh var(--gut)}
  .ficha>div:first-child{position:static}
  .vhero-bottle{align-self:center}
  .ficha-tbl div{grid-template-columns:1fr;gap:2px}
  .vhero{grid-template-columns:1fr;justify-items:center;text-align:center;padding-top:18vh}
  .vhero-r{justify-self:center}
  .press-item{grid-template-columns:1fr;gap:8px}
  .scores{grid-template-columns:1fr}
  .kit{grid-template-columns:1fr;padding:14vh var(--gut)}
  .where-row{grid-template-columns:1fr;gap:6px}
  .contact{grid-template-columns:1fr}
  .contact-img{height:46vh}
  .contact-in{padding:12vh var(--gut)}
  .form{grid-template-columns:1fr}
  .contact-data{grid-template-columns:1fr;gap:24px}
}
.year .year-n.year-w{font-size:clamp(76px,10vw,170px);font-style:italic;margin-bottom:30px}
.where+.where{padding-top:4vh}
