/* DOC NIL / φ — a two-dimensional study in proportion. */
:root{--ratio-accent:#e4c88c}
.golden-stage{background:#090b0c;z-index:0;isolation:isolate;--spiral-reveal:1;--ratio-split:50%}
.golden-stage::after{opacity:.035}
.golden-wallpaper{position:absolute;inset:0;background:url('/assets/fibonacci-wallpaper.svg') center/cover no-repeat;opacity:.22}
.ratio-actor{position:absolute;left:var(--actor-x,72%);top:var(--actor-y,52%);width:var(--actor-width,55vw);transform:translate(-50%,-50%) scale(var(--actor-scale,1));transform-origin:center;transition:opacity .55s;opacity:.96}
.ratio-plate-wrap{width:100%;position:relative}
.ratio-plate-wrap svg{display:block;width:100%;height:auto;overflow:visible}
.ratio-plate-wrap .fibonacci-grid{opacity:calc(.6 + var(--energy,0)*.4)}
.ratio-plate-wrap .fibonacci-spiral{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--spiral-reveal,1));filter:drop-shadow(0 0 7px #d9b56b40)}
.ratio-coordinate{position:absolute;right:var(--pad);bottom:115px;display:flex;gap:36px;align-items:center;font:8px/1.8 var(--mono);letter-spacing:.09em;color:#bfae90}
.ratio-divider{position:absolute;left:8%;right:8%;bottom:-7%;height:17px;display:flex;border:1px solid #c9b39780;opacity:0;transition:opacity .4s}
.ratio-divider i:first-child{width:var(--ratio-split);background:#d7ba79}
.ratio-divider i:nth-child(2){flex:1;background:#6a6559}
.ratio-divider>span{position:absolute;top:28px;left:0;right:0;text-align:center;font:12px var(--mono);letter-spacing:.08em;color:var(--gold)}
.golden-stage[data-phase="2"] .ratio-divider{opacity:1}
.golden-stage[data-phase="3"] .ratio-actor{opacity:.22}
.golden-stage .application-cloud{perspective:none}
.golden-stage .world-poster{left:60%;top:25%;width:22vw;min-height:350px;transform:rotate(-5deg);background:#d5c9b5 url('/assets/fibonacci-wallpaper.svg') center/cover;color:#f3e9d6;border:1px solid #c9b39770;box-shadow:0 30px 70px #0006}
.golden-stage .world-business-card{left:75%;top:63%;width:19vw;transform:rotate(5deg);background:#151919 url('/assets/fibonacci-wallpaper.svg') center/cover;border:1px solid #c9b39770}
.golden-stage .world-web-card{left:48%;top:62%;width:23vw;transform:rotate(-2deg);background:#ede6d8;box-shadow:0 25px 50px #0008}
.ratio-application-symbol{font:65px/.7 var(--serif);color:var(--gold)}
.golden-stage .world-web-card strong{font-size:clamp(30px,3vw,52px)}
.golden-stage .concept-label{bottom:9%;color:#b5a382;right:var(--pad)}
.hero-chapter .chapter-content{width:52%;max-width:760px}
.hero-chapter h1{font-size:clamp(64px,6.7vw,112px);line-height:1.02;letter-spacing:-.065em}
.hero-chapter h1 em{white-space:normal;font-size:.96em}
.hero-chapter .page-kicker{font:9px/1.8 var(--mono);letter-spacing:.1em;color:#dcc38e}
.hero-chapter .tiny-spark{width:auto;height:auto;font:22px/1 var(--serif);border:0;transform:none;vertical-align:0;margin-right:8px;color:#e5c98e}
.hero-chapter .hello-note{display:none}
.hold-icon{font-family:var(--serif)!important;font-size:35px}
#balance-slider{accent-color:var(--ratio-accent)}
.page-intro,.selected-section,.practice-teaser,.studio-section,.page-outro,.service-chapter,.case-story{position:relative;isolation:isolate;overflow:hidden}
.page-intro::before,.selected-section::before,.practice-teaser::before,.studio-section::before,.page-outro::before,.service-chapter::before,.case-story::before{content:'';position:absolute;inset:0;background:url('/assets/fibonacci-wallpaper.svg') right center/cover no-repeat;opacity:.2;z-index:-1;pointer-events:none}
.selected-section::before,.page-outro::before{opacity:.36}
.studio-art{background:#101415 url('/assets/fibonacci-wallpaper.svg') center/cover}
.studio-art>img{width:100%;height:auto;object-fit:contain;transform:none!important;position:relative;inset:auto;padding:20px}
.studio-orbit{display:none}
.studio-sticker{z-index:2;color:#dcc38e;background:#090b0cbb}
.service-creature{transform:none!important;animation:none!important;width:112%;height:100%;left:-6%;top:0;object-fit:contain;padding:12px}
.logo-gallery-stage{perspective:none;background:#111617 url('/assets/fibonacci-wallpaper.svg') center/cover}
.logo-gallery-stage::after{content:'φ / FIBONACCI SEQUENCE · GOLDEN RATIO';position:absolute;bottom:12px;left:20px;right:20px;font:7px/1.7 var(--mono);letter-spacing:.14em;color:#c9b397;pointer-events:none;text-align:center}
.logo-stack-layer{background:#151c1d url('/assets/fibonacci-wallpaper.svg') center/cover}
.case-full-image,.case-mark-pair{background:#141819 url('/assets/fibonacci-wallpaper.svg') center/cover}
.case-full-image{padding-bottom:45px}
@media(min-width:761px){.signature-chapter .chapter-content,.next-chapter .chapter-content{width:47%;padding-left:10px}.system-chapter .chapter-content{width:44%}.story-ui{bottom:22px}}
@media(max-width:1100px) and (min-width:761px){.hero-chapter h1{font-size:8vw}.ratio-actor{width:54vw}.hero-intro{max-width:320px}.golden-stage .world-poster{left:58%;min-height:290px}.golden-stage .world-web-card{left:45%}}
@media(max-width:760px){
 .story-chapter{height:max(118svh,980px);min-height:980px;align-items:flex-start}
 .story-chapter .chapter-content,.hero-chapter .chapter-content{width:100%;padding-top:140px;padding-bottom:430px}
 .hero-chapter h1{font-size:clamp(58px,14.5vw,94px);line-height:1.03;margin:23px 0}
 .hero-chapter .page-kicker{font-size:7px;letter-spacing:.03em;gap:2px}
 .hero-chapter .hero-intro{font-size:13px}
 .hero-chapter .scroll-prompt{font-size:6px!important;max-width:300px}
 .ratio-coordinate{bottom:86px;right:24px;left:24px;justify-content:space-between;gap:12px;font-size:6px}
 .ratio-actor{left:50%!important;top:74%!important;width:101vw!important;max-width:650px;transform:translate(-50%,-50%) scale(.96)}
 .golden-wallpaper{background-position:62% center;opacity:.32}
 .story-chapter h2{font-size:clamp(45px,11.5vw,74px)}
 .story-chapter .chapter-content>p:not(.page-kicker):not(.discovery-status){font-size:12px;line-height:1.85}
 .ratio-divider{bottom:-1%;left:12%;right:12%;height:13px}
 .ratio-divider>span{font-size:9px;top:21px}
 .golden-stage .world-poster{left:46%;top:63%;width:39vw;min-height:210px;padding:18px;gap:14px}
 .golden-stage .world-poster strong{font-size:39px}
 .golden-stage .world-business-card{left:45%;top:82%;width:45vw;min-height:110px;padding:16px;gap:8px}
 .ratio-application-symbol{font-size:40px}
 .golden-stage .world-web-card{left:5%;top:77%;width:47vw;min-height:155px;padding:16px}
 .golden-stage .world-web-card strong{font-size:27px;margin-top:12px}
 .golden-stage .concept-label{display:none}
 .page-intro::before,.selected-section::before,.practice-teaser::before,.studio-section::before,.page-outro::before,.service-chapter::before,.case-story::before{background-size:auto 100%;background-position:63% center;opacity:.23}
 .studio-art>img{padding:5px}.studio-art{aspect-ratio:1.25}
 .logo-gallery-stage::after{font-size:5px;letter-spacing:.07em;bottom:10px}
}
@media(max-width:380px){.hero-chapter h1{font-size:14vw}.hero-chapter .page-kicker{font-size:6px}.story-chapter .chapter-content{padding-top:130px}.hero-button{margin-top:21px}.ratio-actor{top:76%!important}.story-chapter{min-height:1000px}}
@media(prefers-reduced-motion:reduce){.ratio-actor,.ratio-plate-wrap .fibonacci-spiral{transition:none;filter:none}}
html[data-motion=off] .ratio-plate-wrap .fibonacci-spiral{stroke-dashoffset:0}

.mobile-ratio-plate{display:none}
.golden-division-demo{width:100%}
@media(max-width:760px){
 .story-chapter{height:auto;min-height:1120px}
 .golden-stage .ratio-actor,.golden-stage .ratio-coordinate,.golden-stage .application-cloud{display:none}
 .mobile-ratio-plate{display:block;position:absolute;left:0;right:0;bottom:80px;width:100%;max-width:650px;margin:auto;pointer-events:none}
 .mobile-ratio-plate>img{width:100%;height:auto;display:block;padding:8px}
 .hero-chapter .mobile-ratio-plate{top:550px;bottom:auto}
 .golden-stage .golden-wallpaper{opacity:.16}
}
@media(max-width:380px){.hero-chapter .mobile-ratio-plate{top:555px}}

.mobile-concept-label{padding:20px 24px;text-align:center;font:8px var(--mono);color:var(--gold);letter-spacing:.05em}.mobile-concept-label .concept-name{font:inherit}
