/* =========================================================
   Chelawasi Casa Pública — v3
   Sistema: negro / blanco hueso / verde salvia · Exposure + Inter Tight
   ========================================================= */
@font-face{font-family:"Exposure";src:url(../fonts/exposure-40.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Inter Tight";src:url(../fonts/inter-tight-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(../fonts/inter-tight-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(../fonts/inter-tight-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(../fonts/inter-tight-latin-900-normal.woff2) format("woff2");font-weight:900;font-display:swap}

:root{
  --negro:#000000; --negro-2:#141414; --hueso:#EDEDED; --hueso-2:#E2E2E2; --linea:#cdcdcd;
  --salvia:#5D8779; --salvia-osc:#4A6C61; --salvia-clara:#8FB3A6;
  --display:"Exposure",Georgia,serif; --stretch:"Exposure",Georgia,serif;
  --body:"Inter Tight",system-ui,-apple-system,sans-serif;
  --max:1320px; --g:clamp(16px,4.2vw,56px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --grano:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{background:var(--hueso);color:var(--negro);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit}
::selection{background:var(--salvia);color:var(--negro)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--g)}
.eyebrow{font-weight:700;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:.98;letter-spacing:-.01em}
.grano{position:relative}
.grano::after{content:"";position:absolute;inset:0;background-image:var(--grano);opacity:.18;mix-blend-mode:multiply;pointer-events:none;z-index:1}
.oscuro .grano::after,.grano.claro::after{mix-blend-mode:screen;opacity:.10}

/* Grilla con trazo (recurso de Provincia): letras dentro de casillas */
.grilla{display:flex;flex-wrap:wrap;border-top:1.5px solid currentColor;border-bottom:1.5px solid currentColor;width:max-content;max-width:100%}
.grilla span{font-family:var(--display);font-size:min(clamp(30px,4.4vw,58px),calc((100vw - 40px)/14));line-height:1;width:1.12em;height:1.3em;display:grid;place-items:center;border-left:1.5px solid currentColor;text-transform:uppercase}
.grilla span:last-child{border-right:1.5px solid currentColor}
.grilla span.v{border-left-color:transparent}
.grilla.chica span{font-size:clamp(22px,2.6vw,32px)}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:28px;flex-wrap:wrap;margin-bottom:clamp(36px,5vw,64px)}
.sec-head p{max-width:42ch}

/* Botones */
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:15px;text-decoration:none;padding:15px 24px;border:1.5px solid currentColor;transition:background .25s var(--ease),color .25s var(--ease),transform .25s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn .ar{transition:transform .25s var(--ease)}.btn:hover .ar{transform:translateX(4px)}
.btn-hueso{background:var(--hueso);color:var(--negro);border-color:var(--hueso)}
.btn-hueso:hover{background:var(--salvia);border-color:var(--salvia);color:var(--negro)}
.btn-negro{background:var(--negro);color:var(--hueso);border-color:var(--negro)}
.btn-negro:hover{background:var(--salvia);border-color:var(--salvia)}
.btn-linea:hover{background:var(--hueso);color:var(--negro);border-color:var(--hueso)}
.btn-linea-osc:hover{background:var(--negro);color:var(--hueso)}

/* Header */
.top{position:fixed;inset:0 0 auto 0;z-index:40;color:var(--hueso);transition:background .35s var(--ease),transform .35s var(--ease)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:18px}
.top.solid{background:rgba(0,0,0,.94);backdrop-filter:blur(8px)}
.top.oculto{transform:translateY(-100%)}
.logo img{height:30px;width:auto}
@media(max-width:520px){.logo img{height:24px}}
.nav{display:flex;gap:26px;align-items:center}
.nav a{text-decoration:none;font-weight:500;font-size:15px;position:relative}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1.5px;background:currentColor;transition:right .3s var(--ease)}
.nav a:not(.btn):hover::after{right:0}
.nav .btn{padding:10px 16px;font-size:14px}
.estado{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500;opacity:.9;white-space:nowrap}
.estado i{width:8px;height:8px;border-radius:50%;background:#7fbf9a;box-shadow:0 0 0 0 rgba(127,191,154,.7);animation:pulso 2.2s infinite}
.estado.cerrado i{background:#b9a99a;animation:none}
@keyframes pulso{70%{box-shadow:0 0 0 8px rgba(127,191,154,0)}100%{box-shadow:0 0 0 0 rgba(127,191,154,0)}}
@media(max-width:980px){.nav a:not(.btn){display:none}}
@media(max-width:520px){.estado span{display:none}}

/* Hero */
.hero{position:relative;background:var(--negro);color:var(--hueso);min-height:100svh;display:grid;grid-template-columns:1.25fr .75fr;overflow:hidden}
.hero .izq{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:flex-end;padding:120px var(--g) clamp(36px,6vh,72px)}
.hero h1.marca{margin:0;line-height:0}
.hero h1.marca img{display:block;width:100%;max-width:980px;height:auto}
.hero .lema{font-family:var(--display);font-size:clamp(44px,6.4vw,112px);line-height:.92;letter-spacing:-.015em;margin-top:clamp(18px,2.4vw,34px)}
.hero .lema em{font-style:normal;color:var(--salvia-clara)}
.hero .lead{font-size:clamp(17px,1.45vw,21px);max-width:40ch;margin:28px 0 34px;color:#d4d4d4}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero .datos{display:flex;gap:30px;flex-wrap:wrap;margin-top:44px;padding-top:20px;border-top:1px solid #333;font-size:14px;color:#b3b3b3}
.hero .datos b{color:var(--hueso);font-weight:700;margin-right:6px}
.hero .der{position:relative}
.hero video,.hero .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .der::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--negro) 0%,rgba(0,0,0,0) 22%)}
@keyframes giro{to{transform:rotate(360deg)}}
@media(max-width:900px){
  .hero{grid-template-columns:1fr;min-height:100svh}
  .hero .der{position:absolute;inset:0}
  .hero .der::before{background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.15) 30%,rgba(0,0,0,.88) 70%,var(--negro) 100%)}
  .hero .izq{padding-top:52svh}
}

/* Cinta */
.cinta{background:var(--salvia);color:var(--negro);overflow:hidden;border-top:1.5px solid var(--negro);border-bottom:1.5px solid var(--negro)}
.cinta .pista{display:flex;width:max-content;animation:cinta 38s linear infinite}
.cinta span{font-family:var(--stretch);font-size:clamp(26px,3.4vw,44px);white-space:nowrap;padding:14px 0;display:flex;align-items:center}
.cinta span::after{content:"✳";font-family:var(--body);font-size:.6em;margin:0 .9em;opacity:.8}
@keyframes cinta{to{transform:translateX(-50%)}}

/* Manifiesto */
.manif{padding:clamp(90px,13vw,170px) 0 clamp(70px,10vw,130px)}
.manif .cols{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(40px,7vw,110px);align-items:start}
.manif blockquote{font-family:var(--display);font-size:clamp(36px,4.9vw,72px);line-height:1.02;margin:34px 0 30px}
.manif blockquote em{font-style:normal;color:var(--salvia)}
.manif .txt{columns:2;column-gap:28px;color:#33312d;font-size:16px}
.manif .txt p{margin-bottom:14px;break-inside:avoid}
.manif .firma{font-weight:700;color:var(--negro);margin-top:6px}
@media(max-width:700px){.manif .txt{columns:1}}
.collage{display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:1fr 1fr;gap:12px;height:clamp(520px,52vw,720px)}
.collage figure{overflow:hidden;background:var(--negro);min-height:0}
.collage img{width:100%;height:100%;object-fit:cover}
.collage .f1{grid-row:span 2}
.estampa-txt{width:min(360px,80%);margin-top:34px;opacity:.9}
@media(max-width:900px){.manif .cols{grid-template-columns:1fr}.collage{height:120vw}}

/* Statement */
.frase{background:var(--negro);color:var(--hueso);padding:clamp(80px,11vw,150px) 0;text-align:center}
.frase h2{font-family:var(--stretch);font-size:clamp(54px,11vw,190px);line-height:.9}
.frase h2 span{display:block}
.frase h2 .s{color:var(--salvia-clara)}
.frase p{max-width:52ch;margin:34px auto 30px;color:#cfc8ba}

/* Agenda */
.agenda{background:var(--salvia);color:var(--negro);padding:clamp(80px,11vw,140px) 0}
.afiches{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1.5px solid rgba(0,0,0,.8)}
.afiche{position:relative;padding:28px 24px 30px;border-right:1.5px solid rgba(0,0,0,.8);min-height:270px;display:flex;flex-direction:column;justify-content:space-between;transition:background .3s var(--ease)}
.afiche:first-child{border-left:1.5px solid rgba(0,0,0,.8)}
.afiche:hover{background:var(--salvia-osc)}
.afiche .n{font-family:var(--stretch);font-size:96px;line-height:.8;opacity:.9}
.afiche h3{font-size:clamp(30px,2.6vw,40px);margin:18px 0 10px}
.afiche p{font-size:15px;color:#101a16}
.ev .dia{font-family:var(--stretch);font-size:64px;line-height:.85}
.ev .hora{font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin-top:8px}
.ev .lugar{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border:1.5px solid rgba(0,0,0,.8);padding:5px 10px;margin-top:16px}
.agenda .nota{margin-top:28px;font-size:15px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
@media(max-width:980px){.afiches{grid-template-columns:1fr 1fr}.afiche{border-bottom:1.5px solid rgba(0,0,0,.8)}.afiche:nth-child(odd){border-left:1.5px solid rgba(0,0,0,.8)}}
@media(max-width:560px){.afiches{grid-template-columns:1fr}.afiche{border-left:1.5px solid rgba(0,0,0,.8);min-height:0;gap:20px}.afiche .n{font-size:64px}}

/* Espacios */
.espacios{padding:clamp(90px,12vw,160px) 0 clamp(70px,9vw,120px)}
.carrusel{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.esp{position:relative;color:var(--hueso);text-decoration:none}
.esp figure{position:relative;aspect-ratio:3/4.6;overflow:hidden;background:var(--negro)}
.esp img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease),filter .6s;filter:brightness(.82) saturate(.9)}
.esp:hover img{transform:scale(1.05);filter:brightness(.95)}
.esp figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.92))}
.esp .c{position:absolute;left:18px;right:18px;bottom:18px;z-index:2}
.esp .num{font-family:var(--stretch);font-size:20px;opacity:.8}
.esp h3{font-size:clamp(34px,3vw,44px);margin:4px 0 6px}
.esp p{font-size:14px;color:#d4d4d4}
@media(max-width:980px){.carrusel{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 calc(var(--g)*-1);padding:0 var(--g) 6px;scrollbar-width:none}.carrusel::-webkit-scrollbar{display:none}.esp{flex:0 0 72%;scroll-snap-align:start}}

/* Gemelos */
.gemelos{background:var(--negro);color:var(--hueso);padding:clamp(90px,12vw,160px) 0;overflow:hidden}
.gemelos .cols{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,7vw,110px);align-items:center}
.gemelos .foto{position:relative}
.gemelos .foto img{aspect-ratio:4/5;object-fit:cover;width:100%}
.gemelos .foto .big{position:absolute;right:-24px;bottom:-34px;font-family:var(--stretch);font-size:clamp(140px,16vw,250px);line-height:.8;color:var(--salvia-clara);mix-blend-mode:normal;z-index:2}
.gemelos .foto .big small{display:block;font-family:var(--body);font-size:14px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--hueso);text-align:right;margin-top:10px}
.gemelos h2{font-size:clamp(46px,6.2vw,96px);margin:22px 0 22px}
.gemelos p{color:#d3ccbf;max-width:46ch}
.gemelos ul{list-style:none;margin:30px 0 38px;border-top:1px solid #333}
.gemelos li{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:baseline;border-bottom:1px solid #333;padding:14px 0}
.gemelos li b{font-family:var(--stretch);font-weight:400;font-size:clamp(24px,2.4vw,30px);white-space:nowrap;color:var(--salvia-clara)}
@media(max-width:900px){.gemelos .cols{grid-template-columns:1fr}.gemelos .foto .big{right:8px}}
@media(max-width:480px){.gemelos li{grid-template-columns:110px 1fr}}

/* Carta teaser */
.carta-t{padding:clamp(90px,12vw,160px) 0}
.carta-t .cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,110px);align-items:center}
.carta-t h2{font-size:clamp(46px,6.2vw,96px);margin:22px 0 20px}
.carta-t .txt p{color:#33312d;max-width:44ch}
.cifras{display:grid;grid-template-columns:1fr 1fr;border-top:1.5px solid var(--negro);border-bottom:1.5px solid var(--negro);margin:34px 0}
.cifras div{padding:18px 0}
.cifras div+div{border-left:1.5px solid var(--negro);padding-left:22px}
.cifras b{display:block;font-family:var(--stretch);font-weight:400;font-size:clamp(70px,8vw,120px);line-height:.85;color:var(--salvia)}
.cifras span{font-weight:700;font-size:14px}
.mosaico{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:12px}
.mosaico img{width:100%;height:100%;object-fit:cover}
.mosaico .a{grid-row:span 2;aspect-ratio:2/3.4}
.mosaico .b,.mosaico .c{aspect-ratio:1/1}
@media(max-width:900px){.carta-t .cols{grid-template-columns:1fr}}

/* Visita (ilustración sola, como pide el manual) */
.visita{background:var(--hueso-2);padding:clamp(90px,12vw,150px) 0 clamp(60px,8vw,100px);text-align:center}
.visita .ilus{width:min(980px,100%);height:auto;margin:0 auto}
.visita h2{font-size:clamp(40px,5vw,72px);margin:clamp(30px,4vw,54px) 0 14px}
.visita .dir{font-size:clamp(17px,1.5vw,20px)}
.visita .horas{display:flex;justify-content:center;flex-wrap:wrap;gap:0;margin:30px auto 34px;border-top:1.5px solid var(--negro);border-bottom:1.5px solid var(--negro);width:max-content;max-width:100%}
.visita .horas div{padding:14px 26px;text-align:left}
.visita .horas div+div{border-left:1.5px solid var(--negro)}
.visita .horas small{display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--salvia-osc)}
.visita .horas b{font-family:var(--display);font-weight:400;font-size:26px}
.visita .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
@media(max-width:640px){.visita .horas{flex-direction:column;width:100%}.visita .horas div+div{border-left:0;border-top:1.5px solid var(--negro)}.visita .horas div{text-align:center}}

/* Footer */
.foot{background:var(--negro);color:#b3b3b3;padding:clamp(60px,8vw,100px) 0 30px;overflow:hidden}
.foot .marca{width:100%;margin-bottom:clamp(40px,6vw,70px)}
.foot .marca img{width:100%;height:auto}
.foot .fila{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:30px;font-size:15px}
.foot h4{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--hueso);margin-bottom:12px}
.foot a{text-decoration:none;display:block;margin-bottom:6px}.foot a:hover{color:var(--hueso)}
.foot .estampa{width:220px;filter:invert(.9) sepia(.15);opacity:.9}
.foot .legal{margin-top:50px;padding-top:20px;border-top:1px solid #2c2c2c;font-size:13px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
@media(max-width:900px){.foot .fila{grid-template-columns:1fr 1fr}}

/* WhatsApp flotante (móvil) */
.wa-float{position:fixed;left:16px;right:16px;bottom:14px;z-index:45;display:none;justify-content:center;background:var(--hueso);color:var(--negro);font-weight:700;text-decoration:none;padding:16px;border:1.5px solid var(--negro);box-shadow:0 10px 30px rgba(0,0,0,.35);transform:translateY(140%);transition:transform .4s var(--ease)}
.wa-float.ver{transform:none}
@media(max-width:820px){.wa-float{display:flex}}

/* Aparición al hacer scroll */
.rev{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rev.in{opacity:1;transform:none}
.rev.d1{transition-delay:.1s}.rev.d2{transition-delay:.2s}.rev.d3{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){.rev{opacity:1;transform:none}.cinta .pista,.estado i{animation:none}html{scroll-behavior:auto}}

/* ===== Página de carta ===== */
.carta-page .top{background:rgba(0,0,0,.94)}
.carta-hero{background:var(--negro);color:var(--hueso);padding:130px 0 46px}
.carta-hero h1{font-size:clamp(64px,11vw,160px);line-height:.88;margin:18px 0 0}
.carta-hero h1 em{font-style:normal;color:var(--salvia-clara)}
.carta-hero p{color:#cfc8ba;max-width:52ch;margin-top:22px}
.tabs{position:sticky;top:74px;z-index:30;background:var(--negro);border-top:1px solid #2a2a2a}
.tabs .wrap{display:flex;gap:0;overflow-x:auto;scrollbar-width:none}
.tabs .wrap::-webkit-scrollbar{display:none}
.tabs a{flex:none;color:#cfc8ba;text-decoration:none;font-weight:700;font-size:14px;padding:16px 18px;border-bottom:2px solid transparent}
.tabs a:hover,.tabs a.on{color:var(--hueso);border-bottom-color:var(--salvia-clara)}
.sec{padding:clamp(60px,8vw,96px) 0 10px;scroll-margin-top:130px}
.sec h2{font-size:clamp(48px,6.5vw,92px);margin-bottom:10px}
.sec .sub{color:#5d5a54;margin-bottom:30px;max-width:62ch}
.items{display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
.item{padding:22px 0;border-top:1.5px solid var(--linea)}
.item .row{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.item .row::after{content:none}
.item h3{font-size:clamp(26px,2.2vw,32px)}
.item .precio{font-family:var(--stretch);font-size:28px;white-space:nowrap}
.item p{font-size:15px;color:#3a3834;margin-top:6px}
@media(max-width:760px){.items{grid-template-columns:1fr}}
.grupo-canos{margin-top:34px}
.grupo-canos .gh{display:flex;justify-content:space-between;align-items:end;gap:14px;flex-wrap:wrap;border-bottom:1.5px solid var(--negro);padding-bottom:12px;margin-bottom:0}
.grupo-canos h3{font-size:clamp(34px,3.6vw,52px)}
.precios{display:flex;gap:0;border:1.5px solid var(--negro)}
.precios div{padding:8px 14px;text-align:center}
.precios div+div{border-left:1.5px solid var(--negro)}
.precios small{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--salvia-osc)}
.precios b{font-family:var(--stretch);font-weight:400;font-size:24px}
.taps{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));border-left:1.5px solid var(--linea)}
.tap{padding:18px 20px;border-right:1.5px solid var(--linea);border-bottom:1.5px solid var(--linea);display:grid;grid-template-columns:44px 1fr;gap:0 12px}
.tap .no{font-family:var(--stretch);font-size:34px;line-height:1;color:var(--salvia)}
.tap .casa{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--salvia-osc)}
.tap h4{font-family:var(--display);font-weight:400;font-size:26px;line-height:1.05;margin:2px 0 6px}
.tap .m{display:flex;gap:12px;font-size:13px;font-weight:500;color:#3a3834;flex-wrap:wrap}
.nota-canos{margin-top:22px;padding:16px 18px;background:var(--hueso-2);border-left:3px solid var(--salvia);font-size:15px}

@media(max-width:900px){.gemelos .foto{margin-bottom:40px}}
.manif .grilla span{font-size:min(clamp(26px,2.9vw,44px),calc((100vw - 40px)/14))}