/* Darosa's own signature, traced as editable paths from the supplied logo. */
:root{--accent:#f1e539;--bg:#0c0d0b;--surface:#191a15;--muted:#929486;--ink:#e9e8de}
body{background:var(--bg)}
.logo{width:156px;flex-shrink:0;letter-spacing:0;font-size:0}
.logo .brand-logo{width:100%;height:52px;object-fit:contain}
.logo small{font-size:7px;letter-spacing:.55em;text-align:center;margin-top:0;color:var(--accent);padding-left:.55em}
header{height:102px}
.header-book{border-color:#f1e53970}
.menu .eyebrow{letter-spacing:.25em}
.menu-open header .brand-logo{filter:brightness(0)}
.menu-open header .logo small{color:var(--bg)}
.hero{background:radial-gradient(ellipse at 78% 38%,#34321b66,transparent 52%),#0c0d0b}
.hero-aura{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 430px 400px at var(--light-x,40%) var(--light-y,50%),#f1e5390c,transparent 80%);z-index:0}
.hero:before{content:'';position:absolute;left:35%;top:13%;width:65vw;height:65vw;border:1px solid #f1e53912;border-radius:50%;pointer-events:none;transform:rotateX(var(--aura-tilt,0deg));}
.hero-title{padding-top:45px;min-height:500px;isolation:isolate}
.hero-signature{position:relative;z-index:5;width:84vw;margin-top:0;pointer-events:none;transform-origin:40% 55%;}
.signature-drawing{display:block;width:100%;height:auto;max-height:420px;overflow:visible;stroke:var(--accent);stroke-width:3.2;filter:drop-shadow(0 0 20px #f1e53918)}
.signature-caption{position:relative;display:flex;align-items:center;justify-content:space-between;width:69%;margin:5px 0 0 12%;font:9px 'Courier New',monospace;letter-spacing:.28em;color:var(--accent)}
.hero h1,.motion-ready .hero h1{position:relative;z-index:4;max-width:100%;font:11px 'Courier New',monospace!important;line-height:1.5!important;letter-spacing:.15em!important;margin-top:25px;display:flex;align-items:center;gap:7px;color:#b9baa9}
.hero h1 br{display:none}
.hero h1 .yellow{color:#b9baa9}
.hero-art{top:0;width:34vw;height:540px;right:0;opacity:.6}
.hero-art img{filter:grayscale(1) contrast(1.1)}
.art-label{color:#c4c4aa}
.art-stamp{font-size:8px;width:85px;height:85px;right:-15px;top:60%;background:var(--accent)}
.art-stamp b{font-size:24px}
.hero-bottom{position:absolute;left:var(--pad);right:var(--pad);bottom:100px;align-items:end;margin:0}
.hero-bottom p{font-size:13px;line-height:1.7}
.hero-index{color:#9b9d8a}
.hero-index>span{letter-spacing:.15em}
.ticker{background:var(--accent)}
.ticker>div{font-weight:500;font:19px 'Courier New',monospace;letter-spacing:-.06em}
.motion-ready .hero-signature{opacity:clamp(0,calc(1 - var(--hero-progress,0) * 2.15),1);transform:translate3d(calc(var(--hero-progress,0) * -55px),calc(var(--hero-progress,0) * -120px),0) rotate(calc(var(--hero-progress,0) * -7deg)) scale(calc(1 + var(--hero-progress,0) * .85));will-change:transform,opacity}
.motion-ready .hero h1{transform:none!important;opacity:var(--hero-meta,1)}
.motion-ready .hero-art{opacity:calc(var(--hero-art-opacity,1) * .65 + var(--hero-progress,0) * .35)}
.signature-stroke{stroke-dasharray:1;stroke-dashoffset:0}
@media(prefers-reduced-motion:no-preference){
.signature-drawing .signature-stroke{animation:signature-ink 1.05s cubic-bezier(.4,0,.2,1) both}
.signature-drawing .stroke-0{animation-delay:.06s}
.signature-drawing .stroke-1{animation-delay:.18s}
.signature-drawing .stroke-2{animation-delay:.37s}
.signature-drawing .stroke-3{animation-delay:.51s}
.signature-drawing .stroke-4{animation-delay:.65s}
.signature-drawing .stroke-5{animation-delay:.78s}
.signature-drawing .stroke-6{animation-delay:.91s}
.signature-drawing .stroke-7{animation-delay:1.05s;animation-duration:1.1s}
.signature-caption{animation:signature-caption .8s .7s both}
}
.portfolio-study{position:absolute;left:20px;top:23px;font:8px 'Courier New',monospace;color:var(--ink);letter-spacing:.15em;border-left:2px solid var(--accent);padding-left:9px;z-index:2}
.portfolio-real .artwork img{filter:none}
.portfolio-real .artwork:hover img{filter:none}
.work-card .artwork{border-radius:1px}
#lightbox>img{background:#090b07}
.footer-signature{padding:0 3vw 65px;position:relative;overflow:hidden;margin-bottom:40px;border-bottom:1px solid var(--line)}
.footer-signature>img{height:auto;max-height:400px;object-fit:contain;width:100%;opacity:.87;transform:translateY(var(--footer-logo-y,0px));}
.footer-signature>span{display:block;margin:15px 0 0;text-align:center;font:9px 'Courier New',monospace;letter-spacing:.4em;color:var(--muted)}
.studio-signature{padding:25px 0;transform:rotate(-6deg);width:210px;letter-spacing:0}
.studio-signature img{height:90px;width:100%;object-fit:contain}
.footer-top .logo{width:160px}
@keyframes signature-ink{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes signature-caption{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1600px){.hero-signature{width:82vw;margin-top:20px}.signature-drawing{max-height:500px}.hero-art{height:650px;width:33vw}.hero-title{padding-top:45px}.hero-bottom{bottom:110px}}
@media(max-width:1050px){.hero-signature{margin-top:45px;width:88vw}.hero-art{width:42vw;height:540px}.signature-caption{font-size:7px;letter-spacing:.18em;width:75%}.hero-title{padding-top:60px}.hero-bottom{gap:35px}.logo{width:145px}}
@media(max-width:650px){
header{height:90px}.logo{width:130px}.logo .brand-logo{height:45px}.logo small{font-size:6px;margin-top:-1px;letter-spacing:.45em}
.header-right{gap:20px}.languages{font-size:9px}
.hero,.motion-ready .hero{padding-top:125px;min-height:740px}
.hero-top .eyebrow{font-size:7px;letter-spacing:.03em}.hero-top i{margin-right:6px;width:5px;height:5px}
.hero-title{padding-top:30px;min-height:500px}
.hero-signature{width:94vw;margin-left:-3vw;margin-top:0}
.signature-drawing{stroke-width:4.1;height:auto;max-height:none}
.signature-caption{margin:12px 0 0 11%;width:77%;font-size:6px;letter-spacing:.14em;gap:10px}
.hero h1,.motion-ready .hero h1{font-size:8px!important;letter-spacing:.08em!important;margin-top:24px;gap:5px}
.hero-art,.motion-ready .hero-art{top:175px;right:5vw;width:65vw;height:320px;min-height:0}
.art-stamp{height:72px;width:72px;right:-14px;top:60%;font-size:7px}.art-stamp b{font-size:20px}
.hero-bottom,.motion-ready .hero-bottom{bottom:90px;gap:15px}
.hero-bottom p{font-size:11px;line-height:1.7}
.hero-index{font-size:6px;gap:10px}.hero-index>span{font-size:6px;letter-spacing:.03em}
.ticker>div{font-size:16px}.ticker{padding:15px 0}
.work h2{font-size:9vw}.portfolio-study{font-size:7px;left:15px;top:20px}
.footer-signature{padding:10px 0 40px;margin-bottom:35px}.footer-signature>span{font-size:6px;letter-spacing:.24em;margin-top:18px}
.footer-top .logo{width:125px}
.studio-signature{width:190px;padding:18px 0}.studio-signature img{height:78px}
}
@media(max-width:370px){.logo{width:110px}.header-right{gap:15px}.hero-bottom p{font-size:10px}.signature-caption{font-size:5px}}
@media(prefers-reduced-motion:reduce){.hero-signature,.motion-ready .hero-signature{transform:none;opacity:1}.signature-stroke{stroke-dashoffset:0}.footer-signature>img{transform:none}}
.hero h1,.motion-ready .hero h1{position:absolute;top:20px;left:0;margin:0}
@media(max-width:650px){.hero h1,.motion-ready .hero h1{top:176px;left:0}}
@media(min-width:651px) and (prefers-reduced-motion:no-preference){.motion-ready .work{height:var(--work-length,270svh)}}
/* The signature is the visual headline; retain the translated H1 for assistive reading. */
.hero h1,.motion-ready .hero h1{width:1px!important;height:1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap;display:block;padding:0}
@media(min-width:651px) and (prefers-reduced-motion:no-preference){.motion-ready .work-sticky{padding-top:105px}}