.depth-world{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none;display:none;background:#172831}
.depth-ready .depth-world{display:block}
.hero{background:#101d26}
#inicio>.landscape{display:none;background-image:none}
#inicio.is-original>.landscape{display:block}
#inicio.is-original>.dawn{background-image:url('assets/dawn.webp')}
#inicio.is-original>.night{background-image:url('assets/night.webp')}
.depth-plane{position:absolute;left:50%;top:50%;width:var(--scene-width,max(108%,192svh));aspect-ratio:16/9;transform:translate3d(-50%,-50%,0);will-change:transform}
.depth-plane>img{display:block;width:100%;height:100%;position:absolute;inset:0;transition:filter 1.8s,opacity 1.8s}
.depth-night{opacity:0}.is-night .depth-night{opacity:1}
.depth-middle>img{transform:translate(4%,10%) scale(.85);transform-origin:right bottom}
.is-night .depth-middle>img{filter:brightness(.55) saturate(.65)}
.is-night .depth-front>img{filter:brightness(.72) saturate(.8)}
.hero.depth-ready:after{background:linear-gradient(0deg,#0b1014 2%,transparent 32%),radial-gradient(ellipse at 50% 43%,#08121b80,transparent 49%);pointer-events:none}
.depth-ready .hero-copy{pointer-events:none}
.depth-ready .hero-copy button,.depth-ready .hero-copy a{pointer-events:auto}
.depth-ready .hero-side{display:none}
.depth-tools{position:absolute;bottom:105px;left:4vw;z-index:2;display:flex;gap:8px;align-items:center}
.depth-tools button{font-size:14px;padding:9px 13px;background:#09131bed;border-color:#d4ad7250}
.depth-tools button[aria-pressed=true]{color:#edca90;border-color:#d4ad72}
.depth-tools .depth-hint{font-size:12px;color:#d4caba;margin-left:12px}
.hero.depth-ready .hero-foot{display:flex;bottom:calc(105px + var(--depth-tools-height,44px) + 18px)}
.lantern-touch{position:absolute;left:var(--lx);top:var(--ly);width:10%;aspect-ratio:1;transform:translate(-50%,-50%);border:0;border-radius:50%;pointer-events:auto;padding:0;background:none;--warmth:0}
.lantern-touch:before{content:'';position:absolute;inset:-65%;border-radius:50%;background:radial-gradient(circle,#fff6be 0%,#ffe097b0 9%,#ffbc5960 24%,#fcae3820 44%,transparent 69%);mix-blend-mode:screen;opacity:var(--warmth);transition:opacity .18s;pointer-events:none}
.lantern-touch:hover,.lantern-touch:focus-visible,.lantern-touch[aria-pressed=true]{--warmth:1!important}
.lantern-touch:focus-visible{outline:2px solid #fff0bd;outline-offset:0}
.depth-motes{position:absolute;inset:0;overflow:hidden;z-index:1;pointer-events:none}
.depth-motes i{position:absolute;left:var(--left);top:110%;width:var(--size);height:var(--size);border-radius:50%;background:#eed397;filter:blur(2px);opacity:0;animation:depth-drift var(--duration) linear infinite;animation-delay:var(--delay)}
@keyframes depth-drift{10%,80%{opacity:.4}to{transform:translate(100px,-115svh);opacity:0}}
.depth-paused .depth-motes i{animation-play-state:paused}
.depth-leaves{position:absolute;inset:0;overflow:hidden;z-index:4;pointer-events:none}
.depth-back{z-index:0}.depth-middle{z-index:2}.depth-front{z-index:4}
.depth-leaves-far{z-index:1}.depth-leaves-middle{z-index:3}.depth-leaves-near{z-index:4}
.depth-leaf{position:absolute;left:0;top:0;width:var(--leaf-size);aspect-ratio:1;opacity:1;animation:leaf-wind var(--leaf-duration) linear infinite;animation-delay:var(--leaf-delay);will-change:transform}
.depth-leaf>img{width:100%;height:100%;object-fit:contain;filter:blur(var(--leaf-blur))}
.leaf-trail{position:absolute;width:190%;height:50%;right:78%;top:30%;overflow:visible;opacity:.14;filter:blur(.65px)}
.leaf-trail path{fill:none;stroke:#eee8cf;stroke-width:.8;stroke-linecap:round;stroke-dasharray:70 150;animation:wind-trace 5s ease-in-out infinite}
.depth-leaves-far .leaf-trail{opacity:.08}.depth-leaves-near .leaf-trail{opacity:.11;filter:blur(1.3px)}
@keyframes wind-trace{0%,100%{stroke-dashoffset:180;opacity:0}30%,65%{opacity:1}85%{stroke-dashoffset:-100;opacity:0}}
.depth-paused .leaf-trail path{animation-play-state:paused}
.lantern-touch.is-resonating{--warmth:1!important}
.lantern-swing{position:absolute;aspect-ratio:2/3;transform-origin:50% 2%;animation:lantern-sway 6.8s ease-in-out infinite;will-change:transform}
.lantern-left{left:10.5%;top:5%;width:21%}
.lantern-right{left:74.05%;top:30%;width:15.5%;animation-duration:8.1s;animation-delay:-3s}
.lantern-swing>img{display:block;width:100%;height:100%;pointer-events:none}
.lantern-swing .lantern-touch{left:50%;top:69%;width:54%;height:38%;aspect-ratio:auto}
.is-night .lantern-swing>img{filter:brightness(.9) saturate(.85)}
@keyframes lantern-sway{0%,100%{transform:rotate(-1.3deg)}50%{transform:rotate(1.3deg)}}
.depth-paused .lantern-swing{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.lantern-swing{animation:none;will-change:auto}}
@keyframes leaf-wind{0%{transform:translate3d(-220px,var(--leaf-y),0) rotate(-25deg) scaleX(.9)}30%{transform:translate3d(25vw,calc(var(--leaf-y) - var(--leaf-sway)),0) rotate(12deg) scaleX(.75)}65%{transform:translate3d(68vw,calc(var(--leaf-y) + var(--leaf-sway)*.25),0) rotate(75deg) scaleX(1)}100%{transform:translate3d(calc(100vw + 220px),calc(var(--leaf-y) + var(--leaf-sway)),0) rotate(145deg) scaleX(.85)}}
.depth-paused .depth-leaf{animation-play-state:paused}
.hero:not(.depth-ready) .depth-leaves{display:none}
@media(max-width:750px){.depth-tools{bottom:172px;left:0;right:0;justify-content:center}.depth-tools .depth-hint{display:none}.depth-ready .hero-foot{display:none}.depth-front{opacity:.65}.hero.depth-ready:after{background:linear-gradient(0deg,#0b1014,transparent 55%),radial-gradient(ellipse at 50% 40%,#07101bba,transparent 80%)}}
@media(prefers-reduced-motion:reduce){.depth-plane{will-change:auto}.depth-motes,.depth-leaves{display:none}.depth-plane>img,.lantern-touch:before{transition:none}}

/* Keep the artwork luminous while giving the reading area a stable dark ground. */
.hero.depth-ready:after{background:linear-gradient(0deg,#0b1014 2%,transparent 35%),radial-gradient(ellipse at 50% 44%,#07111bb3 0%,#07111b85 28%,transparent 66%)}
.hero .hero-copy .eyebrow{display:inline-block;padding:5px 12px;background:#08131be6;color:#f2d39f;border-radius:2px}
.hero .hero-copy .motto{color:#fff6e6;text-shadow:0 2px 3px #000,0 0 18px #07111b;background:radial-gradient(ellipse,#07111bc9 0%,#07111b80 45%,transparent 72%);padding:8px 0}
.hero-actions>a{padding:12px 16px;background:#08131be6;border:1px solid #e8d3b14d;color:#fff6e6;text-shadow:none}
.hero-actions>a:hover{background:#182933;color:#f2d39f}
.hero-foot{color:#fff6e6;text-shadow:0 2px 4px #000,0 0 8px #000}
header{border-bottom:0}
header .brand{background:none;filter:none;display:flex;align-items:center}
header .brand{position:relative;isolation:isolate}
header .brand:before{content:'';position:absolute;inset:-3px -5px;z-index:-1;background:url('assets/hero-relieve/wordmark-stone-v6.png') center/100% 100% no-repeat;pointer-events:none}
header .brand img{width:190px;height:auto;object-fit:contain}
@media(max-width:750px){header .brand img{width:132px;height:auto}}
.lantern-status:empty{display:none}.lantern-status{flex-basis:100%;font-size:13px;color:#fff0cf;background:#08131be6;padding:8px 12px}
.depth-tools{flex-wrap:wrap;max-width:92vw}.depth-tools .depth-hint{display:none}
@media(min-width:751px){.hero{min-height:1000px}.depth-tools{bottom:105px}}
@media(max-width:750px){
  /* Content grows with its text; secondary controls follow it instead of floating over it. */
  .hero{height:auto;min-height:100svh;max-height:none;padding:145px 5vw 185px}
  .hero .hero-copy{position:relative;left:auto;top:auto;width:100%;transform:none;animation:none}
  .hero .hero-actions{gap:14px}
  .hero .hero-actions>a{min-height:44px;display:inline-flex;align-items:center}
  .hero .hero-foot,.hero.depth-ready .hero-foot{display:none}
  .hero .depth-tools{position:relative;left:auto;right:auto;bottom:auto;justify-content:center;flex-wrap:wrap;gap:10px;margin:30px auto 0;width:100%}
  .hero .depth-tools button{min-height:44px;flex:1 1 145px;max-width:230px;white-space:normal}
  .hero .depth-tools .depth-hint{display:none}
}