/* Estilos por vista. Valores idénticos al prototipo; al final, media queries
   (deben cargar de último para conservar la cascada original). */

/* ---- Home v1 (editorial): hero + manifiesto + recorrido ---- */
.hero{height:100svh;min-height:560px;position:relative;overflow:hidden}
.scrim-t{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,0) 24%,rgba(0,0,0,0) 52%,rgba(0,0,0,.5))}
.hero-cap{position:absolute;left:clamp(20px,4vw,56px);bottom:38px;color:#fff}
.hero-cap .label{display:block}
.hero-cap .t{display:block;margin-top:9px;font-size:clamp(14px,1.3vw,17px);opacity:.9}
.hero-cue{position:absolute;right:clamp(20px,4vw,56px);bottom:38px;color:#fff;font-size:14px;letter-spacing:.02em;display:inline-flex;align-items:center;gap:10px;cursor:pointer;background:none;border:0;font-family:inherit;opacity:.92}
.hero-cue:hover{opacity:1}
.manifesto{padding:clamp(96px,21vh,230px) 0}
.manifesto .k{display:block;margin-bottom:clamp(28px,5vh,54px)}
.manifesto .line{max-width:16ch}
.section{padding:clamp(70px,11vh,150px) 0}
.journey{position:relative}
.jslide{position:sticky;top:0;height:100svh;min-height:520px;width:100%;display:block;overflow:hidden;padding:0;border:0;cursor:pointer;text-align:left;background:#111;color:#fff;font-family:inherit}
.jscrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.16),rgba(0,0,0,0) 30%,rgba(0,0,0,0) 55%,rgba(0,0,0,.55))}
.jnum{position:absolute;top:calc(72px + 20px);right:clamp(20px,4vw,56px);font-size:13px;letter-spacing:.16em;opacity:.85}
.jcap{position:absolute;left:clamp(20px,4vw,56px);right:clamp(20px,4vw,56px);bottom:clamp(30px,6vh,54px);display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
.jname{font-size:clamp(30px,4.6vw,68px);font-weight:600;letter-spacing:-.026em;line-height:1;margin:0}
.jmeta{margin-top:10px;font-size:clamp(14px,1.3vw,17px);opacity:.9}
.jgo{font-size:14px;letter-spacing:.02em;border-bottom:1px solid rgba(255,255,255,.6);padding-bottom:5px;white-space:nowrap;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.jslide:hover .jgo{opacity:1;transform:none}
.jslide:hover .cover.desat{filter:saturate(1) contrast(1.02)}
@supports (animation-timeline:view()){.jslide .cover{animation:jset 1s linear both;animation-timeline:view();animation-range:entry 0% entry 100%}}
@keyframes jset{from{transform:scale(1.04)}to{transform:scale(1)}}
.jsp{height:55svh}

/* ---- Home v2 (grove 3D) ---- */
@keyframes pfloat{0%,100%{opacity:0;transform:translateY(6px)}30%{opacity:.55}50%{opacity:.75;transform:translateY(-8px)}70%{opacity:.4}}
.grove{height:280vh;position:relative;background:#fff}
.grove-stage{position:sticky;top:0;height:100svh;min-height:520px;overflow:hidden;perspective:1300px}
.grove-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#fff}
.orbit{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.ocard{pointer-events:none;position:absolute;left:50%;top:50%;width:clamp(150px,17vw,240px);margin:0;padding:0;background:#fff;border:1px solid var(--line);cursor:pointer;font-family:inherit;color:var(--ink);text-align:left;opacity:0;will-change:transform,opacity;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.ocard-im{display:block;aspect-ratio:4/3;overflow:hidden;background:#ECEAE3}
.ocard-p{position:absolute;border-radius:50%;background:var(--green);pointer-events:none;opacity:0}
.op1{width:5px;height:5px;left:-14px;top:22%;animation:pfloat 5.2s ease-in-out infinite}
.op2{width:3px;height:3px;right:-11px;top:58%;animation:pfloat 4.1s ease-in-out 1.2s infinite}
.op3{width:4px;height:4px;left:14%;bottom:-13px;animation:pfloat 6s ease-in-out 2.3s infinite}
.oflow{position:absolute;left:50%;top:50%;border-radius:50%;pointer-events:none;opacity:0;will-change:transform,opacity}
.ocard-im img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.68);transition:filter .4s ease}
.ocard:hover .ocard-im img{filter:saturate(1)}
.ocard-cap{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:10px 12px}
.ocard-nm{font-size:13px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocard-yr{font-size:11px;color:var(--muted)}
.grove-intro{position:absolute;left:clamp(20px,4vw,56px);top:calc(72px + 5vh);max-width:560px}
.gi-line{margin:.35em 0 0}
.gi-cue{display:inline-block;margin-top:18px;font-size:13px;letter-spacing:.04em;color:var(--muted)}
.grove-final{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:8vh;text-align:center;opacity:0;pointer-events:none;transition:opacity .6s ease}
.grove-final.on{opacity:1;pointer-events:auto}
.gf-wm{font-size:clamp(44px,7vw,104px)}
.gf-line{margin:14px 0 24px;font-size:clamp(16px,1.6vw,22px);color:var(--muted)}
/* Enlace del cierre (el prototipo no lo estilaba; mismo trato que .invite .go) */
.grove-final .go{display:inline-flex;align-items:center;gap:12px;font-size:15px;letter-spacing:.02em;cursor:pointer;background:none;border:0;color:inherit;font-family:inherit;border-bottom:1px solid var(--ink);padding-bottom:6px}

/* ---- Invitación (cierre de Home) ---- */
.invite{padding:clamp(80px,15vh,190px) 0}
.invite .line{font-size:clamp(26px,3.6vw,56px);font-weight:500;letter-spacing:-.025em;line-height:1.08;max-width:20ch}
.invite .go{margin-top:34px;display:inline-flex;align-items:center;gap:12px;font-size:15px;letter-spacing:.02em;cursor:pointer;background:none;border:0;color:inherit;font-family:inherit;border-bottom:1px solid var(--ink);padding-bottom:6px}

/* ---- Índice de proyectos ---- */
.pagetop{padding-top:calc(72px + clamp(46px,9vh,104px))}
.idxhead{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:clamp(30px,5vh,60px)}
.pgrid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,1.8vw,30px);align-items:start}
.tile{position:relative;overflow:hidden;cursor:pointer;background:none;border:0;padding:0;color:inherit;font-family:inherit;display:block}
.t-a{grid-column:span 7;aspect-ratio:16/11}
.t-b{grid-column:span 5;aspect-ratio:3/4;margin-top:clamp(46px,13vh,160px)}
.t-c{grid-column:span 5;aspect-ratio:3/4;margin-top:clamp(46px,10vh,120px)}
.t-d{grid-column:span 7;aspect-ratio:16/11}
.tile:hover .cover{transform:scale(1.04)}
.tile:hover .cover.desat{filter:saturate(1) contrast(1.02)}
.tile-ov{position:absolute;inset:0;display:flex;align-items:flex-end;padding:clamp(18px,2vw,30px);background:linear-gradient(0deg,rgba(0,0,0,.56),rgba(0,0,0,.06) 46%,rgba(0,0,0,0) 72%);color:#fff;opacity:0;transition:opacity .55s ease}
.tile:hover .tile-ov{opacity:1}
.tile-ov .nm{font-size:clamp(20px,2.1vw,30px);font-weight:600;letter-spacing:-.02em}
.tile-ov .mt{margin-top:6px;font-size:13px;opacity:.9;letter-spacing:.01em}

/* ---- Plantilla de proyecto ---- */
.phero{position:relative;height:clamp(540px,92svh,1020px);overflow:hidden}
.phero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.4),rgba(0,0,0,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,.56))}
.phero-cap{position:absolute;left:clamp(20px,4vw,56px);right:clamp(20px,4vw,56px);bottom:clamp(34px,6vh,56px);color:#fff}
.phero-cap .ph-name{margin:.18em 0 0}
.phero-cap .pl{margin-top:14px;font-size:clamp(15px,1.4vw,18px);opacity:.94}
.pnav{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff;font-size:26px;line-height:0;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:inherit;padding:0 0 4px;transition:background .35s ease,border-color .35s ease}
.pnav:hover{background:rgba(255,255,255,.16);border-color:#fff}
.pnav-l{left:clamp(14px,3vw,40px)}
.pnav-r{right:clamp(14px,3vw,40px)}
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.striprow{display:flex;flex-wrap:wrap;gap:clamp(22px,4.6vw,72px);padding:26px 0}
.si{display:flex;flex-direction:column;gap:9px}
.sv{font-size:15px;font-weight:500}
.concept .wrap{padding:clamp(74px,13vh,158px) 0 clamp(30px,5vh,60px)}
.archsec .wrap{padding:0 0 clamp(74px,13vh,158px)}
.archlist{margin-top:26px}
.archrow{border-top:1px solid var(--line);padding:20px 0;font-size:clamp(16px,1.5vw,21px);max-width:36em}
.archrow:last-child{border-bottom:1px solid var(--line)}
.cgrid{display:grid;grid-template-columns:repeat(12,1fr)}
.cbody{grid-column:4/12}
.gal{display:flex;flex-direction:column;gap:clamp(46px,8.5vh,124px)}
.gitem{position:relative;overflow:hidden}
.gitem.gbleed{height:clamp(460px,93vh,1050px)}
.gitem.ginset{aspect-ratio:3/2;width:min(100%,780px);margin-left:auto}
.gal-next{margin-top:clamp(46px,8.5vh,124px)}
.nextsec{cursor:pointer}
.next{position:relative;display:block;width:100%;height:clamp(420px,68vh,780px);overflow:hidden;text-align:left;background:none;border:0;color:inherit;font-family:inherit;cursor:pointer}
.next-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.16) 50%,rgba(0,0,0,.52));transition:background .6s}
.next:hover .next-scrim{background:linear-gradient(180deg,rgba(0,0,0,.36),rgba(0,0,0,.24) 50%,rgba(0,0,0,.58))}
.next:hover .cover{transform:scale(1.04)}
.next-cap{position:absolute;left:clamp(20px,4vw,56px);bottom:clamp(34px,6vh,54px);color:#fff}
.nextname{display:block;margin-top:12px;font-size:clamp(30px,5vw,74px)}

/* ---- Nosotros ---- */
.about-lead{max-width:20ch}
.lead-top{margin-top:.24em}
.abgrid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(24px,4vw,60px);margin-top:clamp(40px,7vh,90px)}
.abcol{grid-column:5/12;display:flex;flex-direction:column;gap:clamp(20px,2.4vh,30px)}
.abcol p{margin:0;font-size:clamp(17px,1.5vw,21px);line-height:1.6;max-width:38em}
.tl{margin-top:clamp(50px,9vh,110px)}
.recos{margin-top:clamp(50px,9vh,110px)}
.tl-row{display:grid;grid-template-columns:130px 1fr;gap:clamp(20px,3vw,50px);padding:24px 0;border-top:1px solid var(--line);align-items:baseline}
.tl-row:last-child{border-bottom:1px solid var(--line)}
.tl-yr{font-size:15px;font-weight:500;color:var(--muted)}
.tl-tx{font-size:clamp(17px,1.6vw,22px)}
.about-img{margin-top:clamp(70px,11vh,150px)}

/* ---- Contacto ---- */
.cwrap{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(30px,5vw,80px);margin-top:clamp(40px,7vh,86px)}
.cinfo{grid-column:1/6;display:flex;flex-direction:column}
.cform{grid-column:7/12}
.crow{display:flex;flex-direction:column;gap:8px;padding:24px 0;border-top:1px solid var(--line)}
.crow:first-child{border-top:0;padding-top:0}
.cv{font-size:clamp(19px,1.9vw,26px);font-weight:500;letter-spacing:-.01em}
.cv a{border-bottom:1px solid var(--line)}
.cv a:hover{border-color:var(--ink)}

/* ---- Responsive (siempre al final: conserva la cascada del prototipo) ---- */
@media(max-width:860px){.statgrid{grid-template-columns:repeat(2,1fr);gap:clamp(30px,6vw,50px)}.cbody{grid-column:1/13}.abcol{grid-column:1/13}.cinfo{grid-column:1/13}.cform{grid-column:1/13;margin-top:10px}}
@media(max-width:760px){.nlinks{display:none}.menu-btn{display:inline-flex}.pgrid{grid-template-columns:1fr}.t-a,.t-b,.t-c,.t-d{grid-column:auto;aspect-ratio:4/3;margin-top:0}.tile-ov{opacity:1;background:linear-gradient(0deg,rgba(0,0,0,.5),rgba(0,0,0,0) 60%)}.gitem.ginset{width:100%}.tl-row{grid-template-columns:1fr;gap:6px}}
@media(max-width:560px){body{font-size:17px}.feat-img{height:clamp(360px,66vh,520px)}.cap{flex-direction:column;align-items:flex-start;gap:12px}.cap.r{flex-direction:column}.capmeta,.cap.r .capmeta{text-align:left}}
