/* Amazon Hills — sistema visual "selva viva"
   Estructura de la familia Discovery Land (serif en mayúsculas, sans pequeña con tracking,
   ritmo vertical amplio, video a pantalla completa) con una paleta tomada de la selva alta:
   verde dosel profundo, verde hoja vivo, turquesa de quebrada, ámbar de atardecer y arcilla. */

@font-face{font-family:"AH Display";src:url("../fonts/AH-Newsreader-Display.woff2") format("woff2");font-weight:400 500;font-style:normal;font-display:swap}
@font-face{font-family:"AH Serif";src:url("../fonts/AH-Newsreader-Text.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"AH Serif";src:url("../fonts/AH-Newsreader-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"AH Sans";src:url("../fonts/AH-Figtree.woff2") format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"AH Display Fallback";src:local("Georgia"),local("Times New Roman");size-adjust:96%;ascent-override:92%;descent-override:24%}
@font-face{font-family:"AH Sans Fallback";src:local("Segoe UI"),local("Helvetica Neue"),local("Arial");size-adjust:98%}

:root{
  /* base */
  --cream:#f7f2e4;--warm:#fffbf1;--sand:#ebe2c9;--sand-2:#f1ead8;--stone:#d8cfb3;
  /* selva */
  --canopy:#0b3a2c;--jungle:#155f41;--leaf:#2f9e5b;--leaf-2:#5fbf6f;--lime:#b9dc55;--moss:#7a9a3c;
  /* agua y sol */
  --river:#1d9c8d;--river-2:#8fd3c8;--sun:#f4a63a;--sun-2:#ffd48a;--clay:#c9612f;
  /* texto */
  --ink:#1c2b22;--ink-2:#3b4b41;--mist:#6d7d71;
  --line:rgba(28,43,34,.16);--line-strong:rgba(28,43,34,.42);
  --font-display:"AH Display","AH Display Fallback",Georgia,serif;
  --font-serif:"AH Serif","AH Display Fallback",Georgia,serif;
  --font-sans:"AH Sans","AH Sans Fallback",system-ui,sans-serif;
  --h1:3.4rem;--h1-line:1.05;--h2:2.6rem;--h3:2rem;--lg:1.6rem;--md:1.4rem;--sm:1.3rem;--cap:1.1rem;
  --gutter:1.4rem;--sec:6rem;--ease:cubic-bezier(.19,1,.22,1);
  --hdr:6.4rem;
}
@media(min-width:650px){:root{--h1:4.2rem;--h3:2.8rem;--gutter:2.4rem;--sec:8rem;--hdr:7.2rem}}
@media(min-width:1300px){:root{--h1:5.8rem;--h2:3rem;--gutter:3.2rem;--hdr:8rem}}

*,*::before,*::after{box-sizing:border-box}
html{font-size:62.5%;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--cream);color:var(--ink);font:400 var(--md)/1.4 var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:var(--leaf);color:#fff}
:focus-visible{outline:2px solid var(--river);outline-offset:3px}

/* ---- tipografía ---- */
.t-h1{font:400 var(--h1)/var(--h1-line) var(--font-display);text-transform:uppercase;letter-spacing:0;text-wrap:balance}
.t-h2{font:400 var(--h2)/1.125 var(--font-display);letter-spacing:-.02em;text-wrap:balance}
.t-h3{font:400 var(--h3)/1.2 var(--font-display);letter-spacing:-.02em;text-wrap:balance}
.t-serif{font:400 1.5rem/1.35 var(--font-serif)}
.t-ital{font:italic 400 1.7rem/1.4 var(--font-serif)}
.t-lg{font-size:var(--lg);line-height:1.35}
.t-md{font-size:var(--md);line-height:1.5}
.t-sm{font-size:var(--sm);line-height:1.45}
.t-cap{font:500 var(--cap)/1.4 var(--font-sans);letter-spacing:.1em;text-transform:uppercase}
.t-num{font:400 4rem/1 var(--font-display);letter-spacing:-.02em;color:var(--jungle)}
@media(min-width:650px){.t-num{font-size:5.2rem}}
.muted{color:var(--mist)}
.green{color:var(--jungle)}
.eyebrow{display:block;margin-bottom:2rem;color:var(--leaf)}
.eyebrow::before{content:"";display:inline-block;width:1.8rem;height:2px;background:currentColor;vertical-align:middle;margin-right:1rem;border-radius:2px}
.measure{max-width:52rem}
.measure-l{max-width:64rem}
.pending{border-bottom:1px dotted var(--clay);color:var(--clay);cursor:help}
.hl{background:linear-gradient(transparent 62%,var(--sun-2) 62%)}

/* ---- layout ---- */
.wrap{padding-left:var(--gutter);padding-right:var(--gutter);width:100%;max-width:150rem;margin:0 auto}
.sec{padding:var(--sec) 0 calc(var(--sec) * .8)}
.bg-sand{background:var(--sand)}
.bg-sand-2{background:var(--sand-2)}
.bg-cream{background:var(--cream)}
.bg-warm{background:var(--warm)}
.bg-canopy{background:var(--canopy);color:var(--cream)}
.bg-canopy .muted{color:rgba(247,242,228,.66)}
.bg-canopy .eyebrow{color:var(--lime)}
.bg-canopy .t-num{color:var(--sun-2)}
.grid-2{display:grid;gap:3rem}
@media(min-width:900px){.grid-2{grid-template-columns:1fr 1fr;gap:6rem;align-items:start}}
@media(min-width:900px){.sticky{position:sticky;top:calc(var(--hdr) + 2rem)}}

/* ---- botones ---- */
.btn{display:inline-flex;align-items:center;gap:.9rem;font:500 var(--cap)/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;padding:1.4rem 1.9rem;border:1px solid currentColor;border-radius:.4rem;white-space:nowrap;transition:background-color .35s ease-out,color .35s ease-out,border-color .35s ease-out,transform .5s var(--ease)}
.btn:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.btn svg{width:1.4rem;height:1.4rem;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.btn-solid{background:#fff;color:var(--ink);border-color:#fff}
.btn-solid:hover{background:var(--sun-2);border-color:var(--sun-2);color:var(--ink)}
.btn-sun{background:var(--sun);color:var(--ink);border-color:var(--sun)}
.btn-sun:hover{background:var(--sun-2);border-color:var(--sun-2);color:var(--ink);transform:translateY(-1px)}
.btn-dark{background:var(--jungle);color:var(--cream);border-color:var(--jungle)}
.btn-dark:hover{background:var(--leaf);border-color:var(--leaf);color:#fff}
.link{display:inline-flex;align-items:center;gap:.8rem;font:500 var(--cap)/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;padding-bottom:.6rem;border-bottom:1px solid currentColor;transition:opacity .3s ease-out,color .3s}
.link:hover{color:var(--leaf)}
.link svg{width:1.2rem;height:1.2rem;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s var(--ease)}
.link:hover svg{transform:translateX(.4rem)}

/* ---- header ---- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--hdr);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--gutter);color:#fff;transition:background-color .45s ease-out,color .45s ease-out,border-color .45s ease-out;border-bottom:1px solid transparent}
.hdr.is-solid{background:rgba(247,242,228,.95);color:var(--ink);border-color:var(--line);backdrop-filter:saturate(1.2) blur(8px)}
.hdr-menu{display:inline-flex;align-items:center;gap:1.2rem;justify-self:start}
.hdr-menu .lines{display:block;width:1.8rem;height:1rem;position:relative}
.hdr-menu .lines::before,.hdr-menu .lines::after{content:"";position:absolute;left:0;right:0;height:1px;background:currentColor}
.hdr-menu .lines::before{top:0}.hdr-menu .lines::after{top:.9rem}
.hdr-menu .lbl{display:none}
@media(min-width:650px){.hdr-menu .lbl{display:inline}}
.brand{display:inline-flex;align-items:center;gap:1rem;font:400 2.1rem/1 var(--font-display);letter-spacing:.01em;white-space:nowrap}
.brand svg{width:2.8rem;height:2.8rem}
@media(min-width:650px){.brand{font-size:2.4rem}}
.hdr-cta{justify-self:end}
.hdr-cta .btn{padding:1.1rem 1.4rem;border-color:rgba(255,255,255,.7)}
.hdr.is-solid .hdr-cta .btn{background:var(--sun);border-color:var(--sun);color:var(--ink)}
.hdr-cta .btn .long{display:none}
@media(min-width:650px){.hdr-cta .btn .long{display:inline}.hdr-cta .btn .short{display:none}}

/* menú overlay */
.menu{position:fixed;inset:0;z-index:60;background:var(--canopy);color:var(--cream);display:grid;grid-template-rows:var(--hdr) 1fr auto;opacity:0;visibility:hidden;transition:opacity .5s ease-out,visibility 0s .5s}
.menu.is-open{opacity:1;visibility:visible;transition:opacity .5s ease-out}
.menu-top{display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);border-bottom:1px solid rgba(247,242,228,.18)}
.menu-close{display:inline-flex;align-items:center;gap:1rem}
.menu-close svg{width:1.6rem;height:1.6rem;stroke:currentColor;fill:none;stroke-width:1.4}
.menu-list{padding:4rem var(--gutter);display:grid;align-content:center;gap:.4rem}
.menu-list a{font:400 clamp(3rem,7vw,5.6rem)/1.15 var(--font-display);letter-spacing:-.02em;display:flex;align-items:baseline;gap:1.6rem;padding:.6rem 0;border-bottom:1px solid rgba(247,242,228,.18);transform:translateY(1.6rem);opacity:0;transition:transform .9s var(--ease),opacity .9s ease-out,color .3s}
.menu-list a:hover{color:var(--lime)}
.menu.is-open .menu-list a{transform:none;opacity:1}
.menu-list a span{font:500 var(--cap)/1 var(--font-sans);letter-spacing:.1em;color:var(--lime)}
.menu-foot{padding:2rem var(--gutter) 3rem;display:flex;gap:2rem;flex-wrap:wrap;color:rgba(247,242,228,.6)}

/* ---- hero ---- */
.hero{position:relative;height:100svh;min-height:58rem;display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--canopy)}
.media{position:absolute;inset:0;overflow:hidden}
.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media video{opacity:0;transition:opacity .9s ease-out}
.media video.is-on{opacity:1}
.media .shade{position:absolute;inset:0;background:
  linear-gradient(to bottom,rgba(11,58,44,.45) 0%,rgba(11,58,44,0) 28%),
  linear-gradient(to top,rgba(11,58,44,.86) 0%,rgba(11,58,44,.5) 34%,rgba(11,58,44,0) 70%)}
@media(max-width:899px){.hero .media .shade{background:linear-gradient(to bottom,rgba(11,58,44,.5) 0%,rgba(11,58,44,.12) 30%,rgba(11,58,44,.6) 60%,rgba(11,58,44,.9) 100%)}}
.hero-c{position:relative;z-index:2;width:100%;text-align:center;padding:0 var(--gutter) 8.5rem;text-shadow:0 1px 18px rgba(0,0,0,.35)}
@media(min-width:650px){.hero-c{padding-bottom:9rem}}
.hero-c>*{opacity:0;transform:translateY(1.4rem);animation:rise 1.3s var(--ease) forwards}
.hero-c>:nth-child(1){animation-delay:.25s}.hero-c>:nth-child(2){animation-delay:.45s}.hero-c>:nth-child(3){animation-delay:.7s}.hero-c>:nth-child(4){animation-delay:.9s}
@keyframes rise{to{opacity:1;transform:none}}
.hero-c .t-cap{color:var(--lime)}
.hero-c .t-h1{max-width:22ch;margin:0 auto}
.hero-c .sub{max-width:36ch;margin:2rem auto 0;color:rgba(255,255,255,.88)}
.hero-c .actions{margin-top:3.2rem;display:flex;flex-direction:column;align-items:center;gap:1.8rem}
@media(min-width:650px){.hero-c .actions{flex-direction:row;justify-content:center;gap:2.8rem}}
.hero-c .actions .link{color:#fff}
.hero-ui{position:absolute;left:var(--gutter);right:var(--gutter);bottom:2.4rem;z-index:3;display:flex;justify-content:space-between;align-items:center}
.ico-btn{width:3.4rem;height:3.4rem;display:inline-grid;place-items:center;border-radius:.4rem;background:rgba(0,0,0,.35);color:#fff;transition:background .3s ease-out}
.ico-btn:hover{background:rgba(0,0,0,.55)}
.ico-btn svg{width:1.2rem;height:1.2rem;fill:currentColor}
.ico-btn .ic-play{display:none}
.ico-btn.is-paused .ic-play{display:block}.ico-btn.is-paused .ic-pause{display:none}
.scroll-cue{width:3.4rem;height:3.4rem;display:grid;place-items:center;color:#fff}
.scroll-cue svg{width:1.4rem;height:1.4rem;stroke:currentColor;fill:none;stroke-width:1.5;animation:bob 2.4s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(.5rem)}}
@media(prefers-reduced-motion:reduce){.hero-c>*{animation:none;opacity:1;transform:none}.scroll-cue svg{animation:none}}

/* ---- intro / cifras ---- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:4rem;padding-top:3rem;border-top:2px solid var(--leaf)}
.stat small{display:block;margin-top:1rem;color:var(--mist)}
.stat .t-num{white-space:nowrap}
@media(max-width:649px){.stats{grid-template-columns:1fr 1fr}.stat:first-child{grid-column:1/-1}}
.facts{display:grid;gap:2.4rem;margin-top:4rem}
@media(min-width:650px){.facts{grid-template-columns:repeat(3,1fr);gap:3rem}}
.fact{padding-top:1.6rem;border-top:1px solid var(--line)}
.fact h3{margin-bottom:.8rem;font-size:1.6rem;color:var(--jungle)}

/* ---- cards (galería / alrededores) ---- */
.sec-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:2rem 4rem;margin-bottom:3.6rem}
.cards{display:flex;gap:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter);scrollbar-width:none;margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter) 1rem}
.cards::-webkit-scrollbar{display:none}
.card{flex:0 0 78vw;margin:0;scroll-snap-align:start}
@media(min-width:650px){.card{flex-basis:42vw}}
@media(min-width:1000px){.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;overflow:visible;margin:0;padding:0}.card{max-width:none}}
.card figure{margin:0;overflow:hidden;background:var(--stone)}
.card img{aspect-ratio:4/5;width:100%;height:auto;object-fit:cover;border-radius:.4rem;transform:scale(1.001);transition:transform 1.4s var(--ease)}
.card:hover img{transform:scale(1.04)}
.card figcaption{padding:1.4rem 0 0}
.card figcaption b{display:block;font-weight:500;font-size:1.4rem}
.card figcaption i{display:block;font:italic 400 1.3rem/1.4 var(--font-serif);color:var(--mist);margin-top:.3rem}
.cards.wide .card img{aspect-ratio:3/2}
.cards.wide .card{flex-basis:78vw}
@media(min-width:650px){.cards.wide .card{flex-basis:42vw}}
@media(min-width:1000px){.cards.wide{grid-template-columns:repeat(5,1fr)}.cards.wide .card img{aspect-ratio:4/5}}
.card .min{display:inline-block;margin-top:.6rem;font:500 1.1rem/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--river)}
.credit{margin-top:2rem;color:var(--mist);font-size:1.2rem}
.carousel{position:relative}
.car-nav{display:flex;gap:.8rem;align-items:center}
.car-nav button{width:4rem;height:4rem;border:1px solid var(--line-strong);border-radius:99rem;display:grid;place-items:center;color:var(--ink);transition:background .3s,color .3s,opacity .3s,border-color .3s}
.car-nav button svg{width:1.4rem;height:1.4rem;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.car-nav button:hover{background:var(--jungle);color:var(--cream);border-color:var(--jungle)}
.carousel.at-start [data-prev],.carousel.at-end [data-next]{opacity:.3;pointer-events:none}
.carousel.no-scroll .car-nav,.carousel.no-scroll .car-hint{display:none}
.car-hint{display:flex;align-items:center;gap:1rem;margin-top:1.4rem;color:var(--mist)}
.car-hint .bar{position:relative;flex:1;height:1px;background:var(--line)}
.car-hint svg{width:1.4rem;height:1.4rem;stroke:currentColor;fill:none;stroke-width:1.5;animation:nudge 1.8s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(.5rem)}}
@media(min-width:1000px){.car-hint{display:none}}

/* ---- bandas full-bleed con video ---- */
.bleed{position:relative;color:#fff;background:var(--canopy);min-height:100svh;display:flex;align-items:flex-end;overflow:hidden}
@media(min-width:900px){.bleed{width:100%;min-height:0;aspect-ratio:1422/935;max-height:100vh;align-items:center}} /* width fija: sin ella, max-height se transfiere al ancho por el aspect-ratio y en pantallas anchas la sección queda a dos tercios */
.bleed .media .shade{background:linear-gradient(to top,rgba(11,58,44,.9) 0%,rgba(11,58,44,.62) 50%,rgba(11,58,44,.28) 100%)}
@media(min-width:900px){.bleed .media .shade{background:linear-gradient(to left,rgba(11,58,44,.82) 0%,rgba(11,58,44,.5) 42%,rgba(11,58,44,.05) 78%)}}
.bleed-c{position:relative;z-index:2;width:100%;padding:8rem var(--gutter) 5rem;text-shadow:0 1px 14px rgba(0,0,0,.35)}
@media(min-width:900px){.bleed-c{display:grid;grid-template-columns:1fr 1fr;gap:4rem}.bleed-c>*{grid-column:2}}
.bleed .t-h3{color:#fff}
.bleed .eyebrow{color:var(--lime)}
.bleed .sub{color:rgba(255,255,255,.82);margin-top:1.8rem}
@media(min-width:900px){.bleed.left .media .shade{background:linear-gradient(to right,rgba(11,58,44,.82) 0%,rgba(11,58,44,.5) 42%,rgba(11,58,44,.05) 78%)}.bleed.left .bleed-c>*{grid-column:1}}
.dist{margin-top:3rem;border-top:1px solid rgba(255,255,255,.28)}
.dist li{display:flex;justify-content:space-between;gap:2rem;padding:1.2rem 0;border-bottom:1px solid rgba(255,255,255,.28);font-size:1.5rem}
.dist li span:last-child{font:500 1.1rem/1.6 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--sun-2);white-space:nowrap}
.steps{margin-top:3rem;counter-reset:s;display:grid;gap:1.6rem}
.steps li{counter-increment:s;display:grid;grid-template-columns:3.6rem 1fr;gap:1.2rem;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.28)}
.steps li::before{content:"0" counter(s);font:400 2.2rem/1 var(--font-display);color:var(--sun-2)}
.steps b{display:block;font-weight:500;font-size:1.5rem;margin-bottom:.4rem}
.steps p{color:rgba(255,255,255,.82)}
.vid-pause{position:absolute;left:var(--gutter);bottom:2rem;z-index:3}

/* ---- vivir en la selva (sección inmersiva) ---- */
.selva{position:relative;overflow:hidden}
.selva::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 20% 0%,rgba(47,158,91,.35),transparent 55%),radial-gradient(ellipse at 90% 100%,rgba(29,156,141,.28),transparent 50%);pointer-events:none}
.selva .wrap{position:relative}
.day{display:grid;gap:1.4rem;margin-top:4rem}
@media(min-width:900px){.day{grid-template-columns:repeat(4,1fr);gap:1.6rem}}
.day li{background:rgba(255,255,255,.06);border:1px solid rgba(247,242,228,.14);border-radius:.6rem;padding:2rem;backdrop-filter:blur(2px)}
.day time{display:block;font:400 2.4rem/1 var(--font-display);color:var(--sun-2);margin-bottom:1rem}
.day b{display:block;font-weight:500;font-size:1.5rem;margin-bottom:.6rem}
.day p{color:rgba(247,242,228,.72)}
.mosaic{display:grid;gap:1.2rem;margin-top:4rem}
@media(min-width:650px){.mosaic{grid-template-columns:repeat(4,1fr)}.mosaic figure:first-child{grid-column:1/3;grid-row:1/3}.mosaic figure:nth-child(2){grid-column:3/5}}
.mosaic figure{margin:0;overflow:hidden;border-radius:.6rem;background:var(--jungle);position:relative}
.mosaic img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;transition:transform 1.6s var(--ease)}
@media(min-width:650px){.mosaic figure:first-child img{aspect-ratio:auto;position:absolute;inset:0}.mosaic figure:first-child{min-height:100%}}
.mosaic figure:hover img{transform:scale(1.03)}
.mosaic figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.4rem;font:italic 400 1.3rem/1.4 var(--font-serif);color:#fff;background:linear-gradient(to top,rgba(11,58,44,.75),transparent)}
.clima{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem;margin-top:4rem;padding-top:3rem;border-top:1px solid rgba(247,242,228,.18)}
@media(min-width:650px){.clima{grid-template-columns:repeat(4,1fr)}}
.clima b{display:block;font:400 3rem/1 var(--font-display);color:var(--lime)}
.clima small{display:block;margin-top:.6rem;color:rgba(247,242,228,.66)}

/* ---- maqueta 3D ---- */
.plan3d{margin-bottom:4rem}
.plan3d-stage{position:relative;aspect-ratio:4/5;background:#e7edf0;border:1px solid var(--line);border-radius:.6rem;overflow:hidden}
@media(min-width:700px){.plan3d-stage{aspect-ratio:16/10}}
@media(min-width:1000px){.plan3d-stage{aspect-ratio:16/8.5}}
.plan3d-stage canvas{display:block;width:100%!important;height:100%!important;touch-action:pan-y;outline:none}
.plan3d-stage canvas:focus-visible{box-shadow:inset 0 0 0 2px var(--sun)}
.plan3d.is-full .plan3d-stage canvas{touch-action:none}
.plan3d-stage .plan3d-load{position:absolute;inset:0;display:grid;place-items:center;color:var(--mist);font-size:var(--sm);text-align:center;padding:2rem}
.plan3d-stage .plan3d-hint{position:absolute;left:1.2rem;top:1.2rem;pointer-events:none;color:var(--ink-2);opacity:.75}
.plan3d-stage .plan3d-hint .m,.plan3d-stage .plan3d-hint .mf{display:none}
@media(pointer:coarse){.plan3d-stage .plan3d-hint .d{display:none}.plan3d-stage .plan3d-hint .m{display:inline}.plan3d.is-full .plan3d-hint .m{display:none}.plan3d.is-full .plan3d-hint .mf{display:inline}}
.plan3d-cams{position:absolute;left:1.2rem;bottom:1.2rem;display:flex;gap:.4rem;flex-wrap:wrap}
.plan3d-cams button{font:500 1.05rem/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;padding:.9rem 1.2rem;border-radius:99rem;background:rgba(255,255,255,.82);color:var(--ink-2);backdrop-filter:blur(6px);transition:background .3s,color .3s}
.plan3d-open{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.8rem 2.2rem 1.6rem;border-radius:1.2rem;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.55);color:#fff;backdrop-filter:blur(8px);text-shadow:0 1px 6px rgba(0,0,0,.35);transition:background .3s,transform .5s var(--ease)}
.plan3d-open:hover{background:rgba(255,255,255,.34);transform:translate(-50%,-50%) scale(1.04)}
.plan3d-open-ico{display:grid;place-items:center;width:5.6rem;height:5.6rem;border-radius:99rem;background:rgba(21,95,65,.75)}
.plan3d-open-ico svg{width:2.6rem;height:2.6rem;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.plan3d.is-full .plan3d-open{display:none}
.plan3d-back{display:none;position:absolute;left:1.2rem;top:1.2rem;z-index:6;align-items:center;gap:.6rem;font:500 1.1rem/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;padding:1rem 1.4rem 1rem 1rem;border-radius:99rem;background:rgba(255,255,255,.88);color:var(--ink);backdrop-filter:blur(6px)}
.plan3d-back svg{width:1.6rem;height:1.6rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.plan3d.is-full .plan3d-back{display:inline-flex}
.plan3d.is-full .plan3d-hint{left:50%;transform:translateX(-50%);top:1.7rem;white-space:nowrap}
@media (max-width:599px){.plan3d.is-full .plan3d-hint{top:6rem}} /* en celular el texto de ayuda baja para no chocar con Salir */
.plan3d-legend{position:absolute;right:1.2rem;top:1.2rem;display:none;gap:.4rem 1.2rem;flex-wrap:wrap;background:rgba(255,255,255,.82);backdrop-filter:blur(6px);padding:.8rem 1.2rem;border-radius:.6rem;font-size:1.2rem;color:var(--ink-2)}
.plan3d.is-picking .plan3d-legend{display:flex}
.plan3d-legend i{display:inline-block;width:1.1rem;height:1.1rem;border-radius:.2rem;margin-right:.5rem;vertical-align:-.1rem}
.plan3d-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:1.4rem}
.plan3d-bar .t-cap{color:var(--mist);margin-right:.6rem}
.plan3d-bar button{font:500 1.1rem/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;padding:1.1rem 1.5rem;border-radius:99rem;border:1px solid var(--line-strong);color:var(--ink-2);transition:background .3s,color .3s,border-color .3s}
.plan3d-bar button[aria-pressed="true"]{background:var(--jungle);border-color:var(--jungle);color:var(--cream)}
.plan3d-card{position:absolute;z-index:5;left:0;top:0;width:23rem;max-width:calc(100% - 2.4rem);display:flex;flex-direction:column;gap:.3rem;padding:1.4rem 1.6rem 1.6rem;background:#fff;color:var(--ink);border-radius:.6rem;box-shadow:0 12px 32px rgba(28,43,34,.22);transform:translate(-50%,calc(-100% - 1.6rem));transition:opacity .25s ease-out}
.plan3d-card[hidden]{display:none}
.plan3d-card::after{content:"";position:absolute;left:50%;bottom:-.7rem;width:1.4rem;height:1.4rem;background:#fff;transform:translateX(-50%) rotate(45deg);box-shadow:4px 4px 10px rgba(28,43,34,.08)}
.plan3d-card .t-cap{color:var(--leaf);display:flex;align-items:center;gap:.6rem}
.plan3d-card-occ i{width:.9rem;height:.9rem;border-radius:99rem;background:var(--leaf);flex:none}
.plan3d-card-occ[data-occ="ocupado"]{color:var(--clay)}.plan3d-card-occ[data-occ="ocupado"] i{background:var(--clay)}
.plan3d-card-occ[data-occ="no"]{color:var(--mist)}.plan3d-card-occ[data-occ="no"] i{background:#8d968b}
.plan3d-card b{font:400 1.9rem/1.15 var(--font-display);letter-spacing:-.01em;white-space:nowrap}
.plan3d-card-price{font:500 var(--lg)/1.2 var(--font-sans);margin-top:.2rem}
.plan3d-card small{color:var(--mist);font-size:var(--sm);line-height:1.4}
.plan3d-card .btn{margin-top:1rem;justify-content:center}
.plan3d-card .btn[hidden]{display:none}
.plan3d-card-x{position:absolute;right:.6rem;top:.5rem;width:2.8rem;height:2.8rem;border-radius:99rem;font-size:2rem;line-height:1;color:var(--mist);transition:background .3s,color .3s}
.plan3d-card-x:hover{background:var(--sand);color:var(--ink)}
.plan3d.is-full .plan3d-stage{position:fixed;inset:0;z-index:60;border-radius:0;aspect-ratio:auto;border:0}
.plan3d.is-full .plan3d-cams{bottom:calc(1.2rem + env(safe-area-inset-bottom))}
/* vistas reales: pines con cámara y capa de foto dentro de la maqueta */
.plan3d-pins{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:4}
.plan3d-pin{position:absolute;pointer-events:auto;transform:translate(-50%,-100%);display:flex;align-items:center;gap:.5rem;padding:.4rem .9rem .4rem .4rem;border-radius:99rem;background:rgba(255,255,255,.92);color:var(--ink);font:500 1.05rem/1 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;box-shadow:0 6px 18px rgba(28,43,34,.22);transition:transform .3s,background .3s}
.plan3d-pin[hidden]{display:none}
.plan3d-pin i{display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:99rem;background:var(--leaf);color:#fff;flex:none}
.plan3d-pin svg,.plan3d-card-foto svg{width:1.4rem;height:1.4rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.plan3d-pin::after{content:"";position:absolute;left:50%;bottom:-.45rem;width:1rem;height:1rem;background:rgba(255,255,255,.92);transform:translateX(-50%) rotate(45deg)}
.plan3d-pin:hover{transform:translate(-50%,-100%) scale(1.05);background:#fff}
.plan3d-card-foto{display:inline-flex;align-items:center;gap:.5rem;margin-top:.8rem;text-decoration:underline;text-underline-offset:.3em}
.plan3d-foto{position:absolute;inset:0;z-index:8;background:#0e1a14;opacity:0;transition:opacity .3s ease-out}
.plan3d-foto.is-on{opacity:1}
.plan3d-foto[hidden]{display:none}
.plan3d-foto img{width:100%;height:100%;object-fit:cover;display:block}
.plan3d-foto-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:2.4rem 1.2rem 1.2rem;background:linear-gradient(transparent,rgba(14,26,20,.75));color:#fff}
.plan3d-foto-bar .t-cap{color:#fff}.plan3d-foto-bar .t-cap b{font-weight:600}
.plan3d-foto-bar div{display:flex;gap:.4rem}
.plan3d-foto-bar button{padding:.8rem 1.2rem;border-radius:99rem;background:rgba(255,255,255,.92);color:var(--ink);font:500 1.1rem/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;transition:background .3s}
.plan3d-foto-bar button:hover{background:#fff}
.plan3d-foto-bar [data-foto-prev],.plan3d-foto-bar [data-foto-next]{font-size:1.8rem;padding:.3rem 1.1rem}
.plan3d.is-full .plan3d-foto-bar{padding-bottom:calc(1.2rem + env(safe-area-inset-bottom))}

.plan3d.is-full .plan3d-legend{top:auto;bottom:calc(9.6rem + env(safe-area-inset-bottom))}
@media (min-width:600px){.plan3d.is-full .plan3d-legend{bottom:calc(6.4rem + env(safe-area-inset-bottom))}}
.plan3d.is-full .plan3d-bar{display:none} /* en pantalla completa no hay barra de capas: todo arranca prendido, y así la leyenda queda a la vista */
html.plan3d-lock body{position:fixed;left:0;right:0;width:100%;overflow:hidden}

/* ---- plano ---- */
.plan-tabs{display:inline-flex;gap:.4rem;background:var(--sand);padding:.4rem;border-radius:99rem;margin-bottom:1.6rem}
.plan-tabs button{font:500 1.1rem/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;padding:1.1rem 1.6rem;border-radius:99rem;color:var(--ink-2);transition:background .3s,color .3s}
.plan-tabs button[aria-selected="true"]{background:var(--jungle);color:var(--cream)}
.plan-grid{display:grid;gap:3rem;margin-top:2rem}
@media(min-width:1000px){.plan-grid{grid-template-columns:minmax(0,1fr) 36rem;gap:4rem;align-items:start}}
.plan-stage{position:relative;background:var(--sand-2);border:1px solid var(--line);border-radius:.6rem;overflow:hidden;transition:background .6s}
.plan-stage.is-paisaje{background:#cfe4bd}
.plan-stage svg{width:100%;height:auto;display:block;font-family:var(--font-sans);touch-action:manipulation}
.plan-stage .hint{position:absolute;left:1.2rem;top:1.2rem;pointer-events:none;color:var(--mist)}
.plan-stage.is-paisaje .hint{color:var(--canopy)}
.plan-stage .north{position:absolute;right:1.4rem;top:1.4rem;width:3.2rem;height:3.2rem;color:var(--ink);transition:transform .8s var(--ease)}
.plan-stage .north svg{width:100%;height:100%}
.lot{fill:#fbf7ea;stroke:#3b4b41;stroke-width:.5;cursor:pointer;transition:fill .25s ease-out}
.lot.reservado{fill:#e9d59a}
.lot.vendido{fill:#7f8c82;cursor:default}
.lot.vendido + .lot-n{fill:#fff}
.lot.no-venta{fill:url(#plan-hatch);cursor:default}
.lot.no-venta:hover{fill:url(#plan-hatch)}
.lot.por-confirmar{fill:#f1ede0;stroke-dasharray:1.6 1.2}
.lot:hover,.lot.is-hover{fill:var(--lime)}
.lot.is-sel{fill:var(--jungle)}
.lot-n{font-size:6.4px;fill:#1c2b22;text-anchor:middle;dominant-baseline:central;pointer-events:none;font-weight:500}
.lot.is-sel + .lot-n{fill:#fff}
.feat-green{fill:#b8dca2;stroke:none}
.feat-mirador{fill:#f5d9a0;stroke:none}
.feat-club{fill:#e7c7b5;stroke:#c9612f;stroke-width:.6;stroke-dasharray:2 1.5}
.feat-faja{fill:#bfe5df;stroke:none}
.outline line{stroke:#2b3a31;stroke-width:.9;fill:none;opacity:.5;stroke-linecap:round}
.mz-l{font:400 22px var(--font-display);fill:#1c2b22;text-anchor:middle;dominant-baseline:central;pointer-events:none;opacity:.9}
.mz-l tspan{font:500 6.5px var(--font-sans);letter-spacing:.8px}
.st-l{font:500 6.2px var(--font-sans);letter-spacing:1.2px;text-transform:uppercase;fill:#5a6a5e;text-anchor:middle;dominant-baseline:central;pointer-events:none}
.hint-l{font:italic 400 8px var(--font-serif);fill:#3b4b41;text-anchor:middle;dominant-baseline:central;pointer-events:none}
/* modo paisaje */
.is-paisaje .lot{fill:#eef4d6;stroke:#6f8a5a;stroke-width:.4}
.is-paisaje .lot:hover{fill:var(--sun-2)}
.is-paisaje .lot.is-sel{fill:var(--sun)}
.is-paisaje .lot.is-sel + .lot-n{fill:#1c2b22}
.is-paisaje .lot.reservado{fill:#e9d59a}
.is-paisaje .lot.vendido{fill:#9aa993}
.is-paisaje .feat-green{fill:#7fb56b}
.is-paisaje .feat-mirador{fill:#e8c27a}
.is-paisaje .feat-club{fill:#dcb391;stroke:#8c5a3a}
.is-paisaje .feat-faja{fill:#7fcbc0}
.is-paisaje .outline line{stroke:#5a7a4a;opacity:.35}
.is-paisaje .mz-l{fill:#173c2a}
.is-paisaje .st-l{fill:#3f5a3a}
.is-paisaje .hint-l{fill:#173c2a}
.contour{fill:none;stroke:#8fb37e;stroke-width:.45;opacity:.7}
.road{fill:none;stroke:#e6d4ac;stroke-linecap:round;stroke-linejoin:round}
.road-mid{fill:none;stroke:#fff8e6;stroke-width:.5;stroke-dasharray:3 3;opacity:.8}
.tree{pointer-events:none}
.water{fill:none;stroke:#3fb3a5;stroke-width:2.2;stroke-linecap:round;opacity:.9}
.legend{display:flex;flex-wrap:wrap;gap:1.2rem 2rem;margin-top:1.6rem;color:var(--mist)}
.legend li{display:inline-flex;align-items:center;gap:.8rem;font-size:1.2rem}
.legend i{width:1.4rem;height:1.4rem;border:1px solid var(--line-strong);border-radius:.2rem;display:inline-block}
.panel{background:var(--warm);border:1px solid var(--line);border-radius:.6rem;padding:2.4rem;box-shadow:0 1rem 3rem rgba(11,58,44,.06)}
.panel .t-cap{color:var(--leaf)}
.panel h3{margin:1rem 0 1.6rem}
.panel dl{display:grid;grid-template-columns:auto 1fr;gap:.9rem 1.6rem;margin:0;border-top:1px solid var(--line);padding-top:1.6rem}
.panel dt{color:var(--mist)}.panel dd{margin:0;font-weight:500}
.panel[data-estado="reservado"] .actions,.panel[data-estado="vendido"] .actions,.panel[data-estado="no-venta"] .actions{display:none}
.panel .actions{display:grid;gap:1.2rem;margin-top:2.4rem}
.panel .price{font:400 3.2rem/1 var(--font-display);letter-spacing:-.02em;margin:.4rem 0 .2rem;color:var(--jungle)}
.panel .price small{font:400 1.3rem/1 var(--font-sans);color:var(--mist);letter-spacing:0;margin-left:.6rem}
.panel.is-empty dl,.panel.is-empty .price,.panel.is-empty .actions{display:none}
.panel-summary{display:grid;grid-template-columns:repeat(3,auto);gap:1rem 2rem;padding-top:1.6rem;border-top:1px solid var(--line)}
.panel-summary b{display:block;font:400 2.4rem/1 var(--font-display);color:var(--jungle)}
.panel-summary small{color:var(--mist)}
.panel:not(.is-empty) .panel-summary{display:none}
.panel .note{margin-top:2rem;color:var(--mist);font-size:1.2rem}
.tip{position:absolute;z-index:4;pointer-events:none;background:var(--canopy);color:#fff;padding:.7rem 1rem;border-radius:.4rem;font-size:1.2rem;white-space:nowrap;transform:translate(-50%,calc(-100% - 1rem));opacity:0;transition:opacity .2s ease-out}
.tip.is-on{opacity:1}
.tip b{font-weight:500}
.render{margin-top:3rem;display:grid;gap:1.6rem}
@media(min-width:900px){.render{grid-template-columns:7fr 5fr;align-items:center}}
.render figure{margin:0;overflow:hidden;border-radius:.6rem;background:var(--stone)}
.render img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.render .t-ital{color:var(--ink-2)}

/* ---- editorial ---- */
.edit{display:grid;gap:3rem}
@media(min-width:900px){.edit{grid-template-columns:5fr 7fr;gap:6rem;align-items:center}}
.edit figure{margin:0;overflow:hidden;background:var(--stone);border-radius:.6rem}
.edit img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.edit .t-h2{margin-bottom:2rem}
.edit p+p{margin-top:1.4rem}
.quien{display:grid;gap:1.4rem;margin-top:3rem}
@media(min-width:650px){.quien{grid-template-columns:repeat(3,1fr)}}
.quien li{padding:1.8rem;border:1px solid var(--line);border-radius:.6rem;background:var(--warm)}
.quien b{display:block;font:400 1.9rem/1.2 var(--font-display);color:var(--jungle);margin-bottom:.6rem}
.quien p{color:var(--ink-2)}

/* ---- formulario ---- */
.form{display:grid;gap:2.2rem;margin-top:3.6rem}
.form fieldset{border:0;padding:0;margin:0;display:grid;gap:2.2rem;min-width:0}
.form legend{display:flex;align-items:baseline;gap:1.2rem;margin-bottom:2rem;padding:0;font:400 2rem/1.2 var(--font-display);letter-spacing:-.02em}
.form legend span{font:500 var(--cap)/1 var(--font-sans);letter-spacing:.1em;color:var(--leaf)}
.form fieldset+fieldset{padding-top:2.6rem;border-top:1px solid var(--line)}
@media(min-width:650px){.form fieldset{grid-template-columns:1fr 1fr;gap:2.4rem 3rem}.form .full{grid-column:1/-1}}
.f{display:grid;gap:.8rem}
.f label{font:500 var(--cap)/1.4 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.f label em{font-style:normal;color:var(--clay)}
.f .help{color:var(--mist);font-size:1.2rem}
.f input,.f select,.f textarea{width:100%;background:var(--warm);border:1px solid var(--line-strong);border-radius:.4rem;padding:1.3rem 1.4rem;min-height:5rem;font:400 1.6rem/1.3 var(--font-sans);color:var(--ink);outline:none;transition:border-color .3s ease-out,box-shadow .3s ease-out;-webkit-appearance:none;appearance:none}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--leaf);box-shadow:0 0 0 3px rgba(47,158,91,.18)}
.f textarea{min-height:9rem;resize:vertical}
.f select{background:var(--warm) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c2b22' stroke-width='1.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 1.2rem center/1.6rem;padding-right:3.6rem}
.f input::placeholder,.f textarea::placeholder{color:#a9b1a6}
.f.is-bad input,.f.is-bad select,.f.is-bad textarea{border-color:var(--clay)}
.f .err{display:none;color:var(--clay);font-size:1.2rem}
.f.is-bad .err{display:block}
.f.check{grid-template-columns:auto 1fr;align-items:start;gap:1.2rem}
.f.check input{width:1.8rem;height:1.8rem;min-height:0;margin-top:.2rem;padding:0;-webkit-appearance:auto;appearance:auto;accent-color:var(--jungle)}
.f.check label{text-transform:none;letter-spacing:0;font:400 1.3rem/1.5 var(--font-sans);color:var(--ink)}
.f.check .err{grid-column:1/-1}
.form .submit{display:grid;gap:1.4rem;margin-top:1rem}
.form .submit .btn{justify-content:center;padding:1.8rem 2rem}
@media(min-width:650px){.form .submit{grid-template-columns:auto 1fr;align-items:center;gap:2rem 3rem}}
.form .submit small{color:var(--mist);max-width:40ch}
.form-ok{display:none;padding:4rem 0 1rem}
.form.is-done{display:none}
.form.is-done+.form-ok{display:block}
.form-ok .ok-mark{width:4.8rem;height:4.8rem;border-radius:99rem;background:var(--leaf);display:grid;place-items:center;margin-bottom:2rem}
.form-ok .ok-mark svg{width:2rem;height:2rem;stroke:#fff;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chips{display:flex;flex-wrap:wrap;gap:.8rem}
.chip{font:500 1.1rem/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;padding:1.4rem 1.6rem;background:var(--warm);border:1px solid var(--line-strong);border-radius:.4rem;transition:background .3s,color .3s,border-color .3s}
.chip.is-on,.chip:hover{background:var(--jungle);color:var(--cream);border-color:var(--jungle)}
.lote-pick{display:none;margin-top:.2rem;padding:1.2rem 1.4rem;border:1px solid var(--leaf);border-radius:.4rem;background:rgba(47,158,91,.08);font-size:1.3rem;color:var(--ink)}
.lote-pick.is-on{display:flex;justify-content:space-between;gap:1.2rem;flex-wrap:wrap}
.lote-pick b{font-weight:500}
.steps-lite{margin-top:3rem;border-top:1px solid var(--line)}
.steps-lite li{display:grid;grid-template-columns:3rem 1fr;gap:1.2rem;align-items:baseline;padding:1.4rem 0;border-bottom:1px solid var(--line);font-size:1.5rem}
.steps-lite b{font:400 2.2rem/1 var(--font-display);color:var(--leaf)}

/* ---- footer ---- */
.foot{background:var(--canopy);color:var(--cream);padding:5rem 0 3rem;font-size:1.3rem}
.foot-grid{display:grid;gap:3rem}
@media(min-width:650px){.foot-grid{grid-template-columns:2fr 1fr 1fr 1fr;gap:4rem}}
.foot .brand{color:var(--cream)}
.foot .muted{color:rgba(247,242,228,.6)}
.foot h4{margin:0 0 1.4rem;font:500 var(--cap)/1.4 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lime)}
.foot li{padding:.5rem 0}
.foot li a{transition:color .3s}.foot li a:hover{color:var(--lime)}
.foot-bottom{margin-top:4rem;padding-top:2rem;border-top:1px solid rgba(247,242,228,.18);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;color:rgba(247,242,228,.55);font-size:1.2rem}

/* ---- reveal ---- */
[data-reveal]{opacity:0;transform:translateY(2.2rem);transition:opacity 1.1s ease-out,transform 1.2s var(--ease);transition-delay:var(--d,0s)}
[data-reveal].is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none}.media video{transition:none}}

/* ---- bullets, FAQ, enlaces de distancia ---- */
.bullets{margin-top:3.6rem;display:grid;gap:1.2rem;max-width:64rem}
@media(min-width:900px){.bullets{grid-template-columns:1fr 1fr;gap:1.4rem 3rem}}
.bullets li{position:relative;padding-left:2.4rem;font-size:1.5rem;line-height:1.45}
.bullets li::before{content:"";position:absolute;left:0;top:.7em;width:1.2rem;height:2px;background:var(--leaf);border-radius:2px}
.dist li a{display:flex;justify-content:space-between;gap:2rem;width:100%;transition:color .3s}
.dist li a:hover{color:var(--lime)}
.faq{margin-top:3rem;max-width:80rem;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:1.8rem 0;font:400 1.9rem/1.25 var(--font-display);letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:300 2.4rem/1 var(--font-sans);color:var(--leaf);transition:transform .4s var(--ease);flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{padding:0 0 2rem;max-width:64rem;color:var(--ink-2);font-size:1.5rem;line-height:1.5}
.stats .t-num{font-size:3rem}
@media(min-width:650px){.stats .t-num{font-size:4rem}}

/* ================================================================
   Naturaleza: vectores, divisores y animaciones
   ================================================================ */

/* El sprite vive oculto al inicio del body; cada pieza se usa con <use>. */
.v-sprite{position:absolute;width:0;height:0;overflow:hidden}

/* Piezas de linea. El trazo se dibuja solo al entrar en pantalla: los paths
   traen pathLength="1", asi que un dasharray de 1 cubre la figura entera y
   --draw (que hereda del host al shadow tree del <use>) la revela. */
.v{fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;overflow:visible;--draw:1}
.v.is-in{--draw:0}
#v-helecho path,#v-hoja path,#v-rama path,#v-colibri path,#v-quebrada path{
  stroke-dasharray:1;stroke-dashoffset:var(--draw,0);
  transition:stroke-dashoffset 2s var(--ease);transition-delay:var(--d,0s)}
#v-colibri circle{fill:currentColor;stroke:none}

/* Curvas de nivel: textura de fondo, quieta. */
.topo-bg{position:absolute;z-index:0;pointer-events:none;width:52rem;max-width:70%;
  color:var(--jungle);opacity:.075;fill:none;stroke:currentColor;stroke-width:1.1;
  top:14%;right:-14rem}
.topo-bg.izq{right:auto;left:-16rem;top:auto;bottom:6%}
.topo-bg.der{right:-18rem;top:auto;bottom:10%}
.form-sec .wrap,.faq-sec .wrap,#proyecto .wrap{position:relative;z-index:1}

/* Divisores: la silueta de la seccion sube hacia la seccion de arriba. */
.divisor{position:absolute;left:0;width:100%;height:6rem;z-index:2;pointer-events:none;
  fill:currentColor;stroke:none;display:block}
.divisor.arriba{top:0;transform:translateY(-99.5%)}
.divisor.dosel{height:5rem;transform:translateY(-99.5%) scaleY(-1)}
.divisor.abajo{bottom:0;height:4rem}
.divisor.quebrada{fill:none;stroke:currentColor;stroke-width:2;color:var(--river-2);opacity:.45}
@media(min-width:900px){.divisor{height:9rem}.divisor.dosel{height:7rem}}
.bg-cream>.divisor{color:var(--cream)}
.bg-sand>.divisor{color:var(--sand)}
.bg-sand-2>.divisor{color:var(--sand-2)}
.bg-canopy>.divisor{color:var(--canopy)}
.bg-canopy>.divisor.quebrada{color:var(--river-2)}

/* Vaiven lento de las hojas sueltas. */
@keyframes vaiven{0%,100%{rotate:var(--r0,-2deg)}50%{rotate:var(--r1,2deg)}}
.v[data-sway]{animation:vaiven var(--sway,9s) ease-in-out infinite}

/* Flora del hero: hojas en las esquinas, con parallax suave desde JS. */
.hero-flora{position:absolute;inset:0;z-index:2;pointer-events:none;color:rgba(255,255,255,.42)}
.hero-flora .v{position:absolute;translate:0 var(--py,0px)}
.hero-flora .v-l1{top:-2rem;left:-3rem;width:14rem;--r0:14deg;--r1:21deg;rotate:18deg}
.hero-flora .v-l2{top:-4rem;right:-4rem;width:15rem;--r0:-27deg;--r1:-20deg;rotate:-24deg}
.hero-flora .v-l3{bottom:12rem;left:-7rem;width:20rem;opacity:.7;--r0:-11deg;--r1:-5deg;rotate:-8deg}
@media(min-width:900px){
  .hero-flora .v-l1{width:20rem;left:1rem;top:-3rem}
  .hero-flora .v-l2{width:22rem;right:2rem}
  .hero-flora .v-l3{width:30rem;left:-4rem;bottom:8rem}
}

/* Hojas de acompanamiento en las secciones. */
.v-helecho-say{width:11rem;color:var(--leaf);opacity:.5;margin-top:3.2rem;translate:0 var(--py,0px)}
.v-hoja-cierre{width:9rem;color:var(--lime);opacity:.55;margin-top:3.2rem;translate:0 var(--py,0px)}
.v-rama-alr{position:absolute;top:2rem;right:-5rem;width:22rem;color:var(--leaf);opacity:.35;
  pointer-events:none;translate:0 var(--py,0px)}
.v-colibri-selva{position:absolute;top:6rem;right:1.5rem;width:11rem;color:var(--lime);opacity:.6;
  pointer-events:none;z-index:1;translate:0 var(--py,0px)}
@media(min-width:900px){
  .v-helecho-say{width:15rem}.v-hoja-cierre{width:12rem}
  .v-rama-alr{width:32rem;right:2rem;top:4rem}
  .v-colibri-selva{width:16rem;right:6rem;top:8rem}
}
@media(max-width:520px){.v-rama-alr,.v-colibri-selva{display:none}}

/* ================================================================
   Hero: imagen viva, neblina y botones
   ================================================================ */
@keyframes acercar{from{scale:1}to{scale:1.12}}
/* El acercamiento va en las dos capas del hero: la imagen (que es lo unico que hay en
   movil) y el video de escritorio. Como las dos arrancan la animacion al cargar la
   pagina, van sincronizadas y el fundido del video no salta de encuadre. */
.hero .media img,.hero .media video{transform-origin:52% 46%;animation:acercar 26s ease-out forwards}

.niebla{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.niebla i{position:absolute;left:-30%;width:160%;height:46%;
  background:radial-gradient(58% 58% at 50% 50%,rgba(255,255,255,.34),rgba(255,255,255,0) 72%);
  filter:blur(4px);animation:deriva 38s ease-in-out infinite alternate}
.niebla i:nth-child(1){top:30%;opacity:.55}
.niebla i:nth-child(2){top:50%;opacity:.32;animation-duration:56s;animation-direction:alternate-reverse}
@keyframes deriva{from{translate:-7% 1.5%}to{translate:7% -1.5%}}

.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
@media(min-width:650px){.hero-c .actions{flex-direction:row;justify-content:center;gap:1.2rem}}
.ico-btn.is-off{visibility:hidden}

/* ================================================================
   Secciones de formulario
   ================================================================ */
.form-sec{position:relative;overflow:visible}
.grid-form{display:grid;gap:3.6rem;align-items:start}
@media(min-width:900px){.grid-form{grid-template-columns:1fr 1fr;gap:6rem}}
@media(min-width:1200px){.grid-form{grid-template-columns:1.05fr .95fr;gap:8rem}}
.form-say{position:relative}
@media(min-width:900px){.form-say{position:sticky;top:calc(var(--hdr) + 3rem)}}

.form-box{background:var(--warm);border:1px solid var(--line);border-radius:1.2rem;
  padding:2.6rem 2.2rem;box-shadow:0 2.4rem 6rem -3rem rgba(11,58,44,.45)}
@media(min-width:650px){.form-box{padding:3.4rem 3rem}}
.form-box .form{margin-top:0}
.form-box .form-ok{padding:1rem 0}
.bg-canopy .form-box,.bg-canopy .form-box .t-h3{color:var(--ink)}
.bg-canopy .form-box .muted{color:var(--mist)}
.bg-canopy .form-box .eyebrow{color:var(--leaf)}

.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.privacidad{margin:0}
.form-err{color:var(--clay);font-size:1.3rem;margin:0}

.ventajas{margin-top:3rem;display:grid;gap:1.3rem;max-width:46rem}
.ventajas li{display:grid;grid-template-columns:auto 1fr;gap:1.2rem;align-items:start;
  font-size:1.5rem;line-height:1.45}
.ventajas svg{width:1.8rem;height:1.8rem;margin-top:.15rem;
  stroke:var(--leaf);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bg-canopy .ventajas svg{stroke:var(--lime)}

.cta-linea{margin-top:4.4rem}
.bleed-cta{margin-top:3.2rem}
.sub-head{margin-top:7rem}

/* ================================================================
   Boton flotante
   ================================================================ */
.flota{position:fixed;z-index:60;left:50%;bottom:calc(1.4rem + env(safe-area-inset-bottom));
  display:inline-flex;align-items:center;gap:.9rem;padding:1.5rem 2.2rem;border-radius:99rem;
  background:var(--sun);color:var(--ink);border:1px solid var(--sun);
  font:500 var(--cap)/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;
  white-space:nowrap;box-shadow:0 1.2rem 3rem -.8rem rgba(11,58,44,.55);
  opacity:0;visibility:hidden;translate:-50% 1.4rem;
  transition:opacity .4s ease-out,translate .5s var(--ease),visibility .4s,background-color .3s}
.flota svg{width:1.6rem;height:1.6rem;stroke:currentColor;fill:none;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round}
.flota.is-on{opacity:1;visibility:visible;translate:-50% 0}
.flota:hover{background:var(--sun-2);border-color:var(--sun-2)}
@media(min-width:900px){
  .flota{left:auto;right:2.4rem;translate:0 1.4rem}
  .flota.is-on{translate:0 0}
}

/* WhatsApp flotante: circular, abajo a la derecha. Es el único botón fijo de la página */
.wa-flota{position:fixed;z-index:60;right:1.6rem;bottom:calc(1.6rem + env(safe-area-inset-bottom));
  display:grid;place-items:center;width:5.6rem;height:5.6rem;border-radius:50%;
  background:#25d366;color:#fff;box-shadow:0 1rem 2.6rem -.6rem rgba(11,58,44,.55);
  opacity:0;visibility:hidden;translate:0 1.4rem;
  transition:opacity .4s ease-out,translate .5s var(--ease),visibility .4s,background-color .3s}
.wa-flota svg{width:3rem;height:3rem;fill:currentColor}
.wa-flota.is-on{opacity:1;visibility:visible;translate:0 0}
.wa-flota:hover{background:#1ebe5b}
@media(min-width:900px){
  .wa-flota{right:2.4rem;bottom:calc(2.4rem + env(safe-area-inset-bottom));width:6rem;height:6rem}
}

/* ================================================================
   Menos movimiento
   ================================================================ */
@media(prefers-reduced-motion:reduce){
  .hero .media img,.hero .media video{animation:none}
  .niebla{display:none}
  .v[data-sway]{animation:none}
  #v-helecho path,#v-hoja path,#v-rama path,#v-colibri path,#v-quebrada path{
    stroke-dasharray:none;stroke-dashoffset:0;transition:none}
  .hero-flora .v,.v-helecho-say,.v-hoja-cierre,.v-rama-alr,.v-colibri-selva{translate:none}
  .flota{transition:opacity .2s linear}
}

/* ---- ajustes: recorte de la decoracion y ritmo en movil ---- */

/* Las curvas de nivel se salen a proposito del borde; el recorte va en un
   envoltorio para que la seccion pueda seguir dejando salir su divisor. */
.topo-wrap{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.topo-bg{position:absolute;pointer-events:none;width:52rem;max-width:78%;
  color:var(--jungle);opacity:.075;fill:none;stroke:currentColor;stroke-width:1.1;
  top:12%;right:-12rem}
.topo-bg.izq{right:auto;left:-13rem;top:auto;bottom:6%}
.topo-bg.der{right:-14rem;top:auto;bottom:10%}

/* El colibri y la rama viven dentro de .wrap, que ya limita el ancho. */
.selva .wrap,#alrededores .wrap{position:relative}
.v-colibri-selva{top:-1rem;right:0}
.v-rama-alr{top:-1rem;right:0}
@media(min-width:900px){.v-colibri-selva{top:-2rem;right:2rem}.v-rama-alr{top:-2rem;right:0}}

/* Mosaico en movil: dos columnas en vez de una tira de cuatro fotos.
   Ahorra media pantalla de scroll sin perder ninguna imagen. */
@media(max-width:649px){
  .mosaic{grid-template-columns:1fr 1fr}
  .mosaic img{aspect-ratio:4/5}
  .mosaic figcaption{padding:1rem;font-size:1.15rem}
}

/* La cabecera es fija: los anclajes se detienen justo debajo de ella. */
main > section[id]{scroll-margin-top:calc(var(--hdr) + 1rem)}

/* ---- ajuste de la flora del hero ----
   Las hojas cuelgan desde el borde superior, como vegetación que entra al cuadro.
   Rotadas ~180° para que la punta apunte hacia adentro: recortadas por la esquina
   y con el tallo arriba parecían telarañas. */
.hero-flora{color:rgba(255,255,255,.5)}
.hero-flora .v{filter:drop-shadow(0 1px 3px rgba(11,58,44,.45));stroke-width:1.4}
.hero-flora .v-l1{top:-5rem;left:-4rem;width:15rem;--r0:158deg;--r1:166deg;rotate:162deg}
.hero-flora .v-l2{top:-7rem;right:-3rem;width:14rem;--r0:190deg;--r1:198deg;rotate:194deg}
.hero-flora .v-l3{bottom:9rem;left:-8rem;width:19rem;opacity:.75;--r0:-11deg;--r1:-5deg;rotate:-8deg}
@media(min-width:900px){
  .hero-flora .v-l1{width:24rem;left:-2rem;top:-7rem}
  .hero-flora .v-l2{width:22rem;right:-1rem;top:-9rem}
  .hero-flora .v-l3{width:30rem;left:-5rem;bottom:7rem}
}
@media(max-width:520px){.hero-flora .v-l3{display:none}}

/* Un poco más de sombra abajo: la foto nueva es más clara que la anterior. */
@media(min-width:900px){
  .hero .media .shade{background:
    linear-gradient(to bottom,rgba(11,58,44,.42) 0%,rgba(11,58,44,0) 26%),
    linear-gradient(to top,rgba(11,58,44,.88) 0%,rgba(11,58,44,.62) 34%,rgba(11,58,44,0) 74%)}
}

/* El colibrí quedaba casi invisible sobre el verde oscuro. */
.v-colibri-selva{opacity:.8;stroke-width:1.5}

/* Mientras la cabecera es transparente lleva un velo propio: sin él, el texto blanco
   queda ilegible en la franja donde el divisor de cerros ya pintó crema pero el hero
   todavía no termina. Se apaga cuando la cabecera se vuelve sólida. */
.hdr::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(11,58,44,.55) 0%,rgba(11,58,44,.28) 55%,rgba(11,58,44,0) 100%);
  transition:opacity .45s ease-out}
.hdr.is-solid::before{opacity:0}

/* La toma es vertical (9:16) y el hero de escritorio es apaisado, asi que el recorte
   solo deja ver un 36 % del alto del cuadro. Centrado se queda en el pasto y tira el
   cielo y los cerros, que es lo que hace buena la foto: se ancla arriba. El origen del
   acercamiento va tambien arriba, si no el zoom se come el cielo. En movil no hace
   falta, el cuadro entra casi entero. */
@media(min-width:900px){
  .hero .media img,.hero .media video{object-position:50% 0%;transform-origin:50% 0%}
}

/* perfiles: familia y retiro */
.perfiles{display:grid;gap:2.4rem;margin-top:4.4rem;max-width:96rem}
@media (min-width:760px){.perfiles{grid-template-columns:1fr 1fr;gap:3.2rem}}
.perfil{padding-top:2rem;border-top:1px solid var(--line-strong)}
.perfil .t-h3{margin-top:.8rem}
.perfil p{margin-top:1rem;font-size:1.5rem;line-height:1.5}
/* pantalla de gracias */
.form-ok .ok-wa{margin-top:2.8rem;padding-top:2rem;border-top:1px solid var(--line-strong)}
.form-ok .ok-wa p{margin-bottom:1.2rem}
.btn-wa{background:#1f8f4e;border-color:#1f8f4e;color:#fff}
.btn-wa:hover{background:#16733d;border-color:#16733d;color:#fff}
.btn-wa svg{width:1.8rem;height:1.8rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* pie: contacto y redes */
.foot-contacto .foot-tel{font-size:1.8rem;letter-spacing:.02em}
.foot-contacto .foot-mail{overflow-wrap:anywhere}
.foot-redes{display:flex;flex-wrap:wrap;gap:.5rem;padding-top:1.2rem!important}
.foot-redes a{display:grid;place-items:center;width:3.4rem;height:3.4rem;border-radius:99rem;border:1px solid rgba(247,242,228,.3);transition:background .3s,border-color .3s,color .3s}
.foot-redes a:hover{background:var(--lime);border-color:var(--lime);color:var(--canopy)}
.foot-redes svg{width:1.6rem;height:1.6rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* beneficios en fichas con ícono (sección "Qué es Amazon Hills") */
.benefs{margin-top:4rem;display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;list-style:none;padding:0}
@media(min-width:700px){.benefs{grid-template-columns:repeat(4,1fr);gap:1.6rem}}
.benef{display:flex;flex-direction:column;gap:.9rem;padding:2rem 1.8rem 2.2rem;background:#fff;border:1px solid var(--line);border-radius:.8rem;box-shadow:0 8px 24px rgba(28,43,34,.06)}
.benef-ico{display:grid;place-items:center;width:4.4rem;height:4.4rem;border-radius:99rem;background:var(--jungle);color:var(--lime);margin-bottom:.4rem}
.benef-ico svg{width:2.4rem;height:2.4rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.benef b{font:400 2.1rem/1.15 var(--font-display);letter-spacing:-.01em;color:var(--ink)}
.benef span{font-size:1.35rem;line-height:1.45;color:var(--mist)}
.benefs-nota{margin-top:3.2rem}
