/* About-only interaction layer; shared typography remains authoritative. */
.about-page .ocean{opacity:.45}
.about-page .about-hero{min-height:70dvh;gap:36px}
.about-page .about-hero-copy .personal-hook{color:var(--ink);margin-bottom:20px}
.about-page .about-story{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:48px;padding-block:48px}
.about-page .about-story h2{max-width:10em}
.about-page .about-practice{position:relative;grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:36px 48px;align-items:start}
.about-page .practice-intro{grid-column:1;grid-row:1 / span 2}
.about-page .explorer-hint{grid-column:2;margin:0;color:var(--muted);font:14px/1.7 var(--hf-font)}
.about-page .folder-stack{grid-column:2;border:0;isolation:isolate;padding-top:8px}
.about-page .folder-stack article{display:block;border:1px solid #4c7480;border-radius:0 14px 14px 14px;background:#173c49;padding:0;margin-top:24px;box-shadow:0 12px 24px #00111930;position:relative;transition:background .25s ease,transform .25s ease}
.about-page .folder-stack article:nth-child(2){background:#204954}
.about-page .folder-stack article:nth-child(3){background:#285761}
.about-page .folder-stack article.is-open{background:#dce7e4;color:#122f38;transform:translateX(-8px)}
.about-page .folder-tab{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;padding:20px 24px;background:none;border:0;color:inherit;font:600 18px/1.5 var(--hf-font);text-align:left;cursor:pointer}
.about-page .folder-tab::before{content:'';position:absolute;top:-13px;left:-1px;width:42%;height:13px;background:inherit;background-color:#28505b;border:1px solid #4c7480;border-bottom:0;border-radius:9px 14px 0 0}
.about-page .is-open .folder-tab::before{background-color:#dce7e4}
.about-page .folder-tab::after{content:'+';font:24px/1 var(--hf-font)}
.about-page .is-open .folder-tab::after{content:'−'}
.about-page .folder-content{padding:4px 24px 26px}
body.about-page main .folder-stack .folder-content h3{margin:0 0 16px;color:#122f38}
body.about-page main .folder-stack article{padding:0;display:block}
.about-page .folder-content p{color:#36525a}
.about-page .method-diagram{display:flex;list-style:none;padding:0;margin:24px 0 0;gap:8px;flex-wrap:wrap}
.about-page .method-diagram li{flex:1;min-width:90px;padding:12px 8px;border:1px solid #9ab5ba;border-radius:3px;text-align:center;font:13px/1.6 var(--hf-font);color:#163942}
.about-page .method-diagram li:not(:last-child)::after{content:' →';color:#7d3c31}
.about-page .side-explorer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.about-page .side-stage{position:sticky;top:105px;min-height:380px;border:1px solid #466b77;border-radius:16px;background:#0c2632;overflow:hidden;padding:26px;display:flex;flex-direction:column;justify-content:space-between}
.about-page .stage-label{font:11px/1.6 var(--hf-mono);letter-spacing:.06em;color:#aac4ca}
.about-page .stage-canvas{padding:32px 0;min-height:250px;display:flex;flex-direction:column;justify-content:center;gap:24px}
.about-page .scene-word{font:600 clamp(26px,3vw,42px)/1.2 var(--hf-font);letter-spacing:-.04em;color:#e7eeea}
.about-page .scene-pieces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.about-page .scene-piece{display:block;background:#214958;color:#d8e8e9;border:1px solid #64838d;border-radius:5px;padding:18px 12px;font:13px/1.4 var(--hf-mono);animation:piece-enter .35s ease both;animation-delay:calc(var(--piece) * 45ms)}
.about-page [data-scene="1"] .scene-piece{border-radius:28px;text-align:center;background:#263b48}
.about-page [data-scene="2"] .scene-piece{transform:rotate(-3deg);background:#584347;border-color:#9c7777}
.about-page [data-scene="2"] .scene-piece:nth-child(even){transform:rotate(3deg)}
.about-page .stage-caption{margin:0;font:16px/1.7 var(--hf-font);color:#c2d4d8}
body.about-page main .side-explorer .recent-list article{display:block;padding-block:0;border-top:1px solid var(--line)}
.about-page .side-button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:24px 0;border:0;background:none;color:var(--muted);text-align:left;font:inherit;cursor:pointer}
.about-page .side-button::after{content:'↗';font-size:20px;flex:none}
.about-page .is-selected .side-button{color:var(--ink)}
.about-page .is-selected .side-button::after{content:'↓';color:var(--accent)}
.about-page .recent-list article>div{padding-bottom:28px}
.about-page [hidden]{display:none!important}
.about-page button:focus-visible{outline:2px solid #ffb6a6;outline-offset:5px}
.about-page .folder-tab:hover,.about-page .side-button:hover{color:#ffb6a6}
.about-page .is-open .folder-tab:hover{color:#823e30}
@keyframes piece-enter{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(max-width:900px){.about-page .about-story,.about-page .about-practice{grid-template-columns:1fr}.about-page .practice-intro,.about-page .explorer-hint,.about-page .folder-stack{grid-column:1;grid-row:auto}.about-page .side-explorer{gap:28px}}
@media(max-width:680px){.about-page .about-story{gap:12px}.about-page .side-explorer{grid-template-columns:1fr}.about-page .side-stage{position:relative;top:0;min-height:250px;padding:20px}.about-page .stage-canvas{min-height:160px;padding:20px 0;gap:16px}.about-page .scene-pieces{grid-template-columns:repeat(4,minmax(0,1fr))}.about-page .scene-piece{font-size:10px;padding:16px 4px;text-align:center;overflow-wrap:anywhere}.about-page .folder-stack article.is-open{transform:none}.about-page .folder-content{padding:0 18px 22px}.about-page .folder-tab{padding:18px}.about-page .side-button{padding-block:20px}.about-page .about-hero{min-height:auto}}
@media(prefers-reduced-motion:reduce){.about-page .scene-piece{animation:none}.about-page .folder-stack article{transition:none}.about-page .about-figure img{animation:none}}

/* Continuous ocean: light and distance replace paper, frames and dividers. */
body.about-page main section,body.about-page main article,body.about-page main .practice-lines{border:0!important}
body.about-page main .folder-stack article:nth-child(n){background:transparent!important;box-shadow:none!important;border-radius:0!important}
body.about-page{background:#04141f}
.about-page .ocean{opacity:.8}
.about-page main{position:relative;isolation:isolate;background:radial-gradient(ellipse at 88% 12%,#23708033,transparent 27%),radial-gradient(ellipse at 6% 50%,#277a7d30,transparent 25%),linear-gradient(180deg,transparent,#04172277 70%,#03101acc)}
body.about-page main>section,body.about-page main article,body.about-page main .practice-lines,body.about-page main .side-explorer .recent-list article{border:0}
body.about-page main a{border-bottom:0;text-decoration:underline;text-decoration-color:#7aa2ae;text-underline-offset:8px}
body.about-page main .about-story{padding-block:90px}
body.about-page main .about-practice,body.about-page main .about-recent{padding-block:100px}
.about-page .folder-stack{position:relative;padding:0 0 0 28px}
.about-page .folder-stack::before{content:'';position:absolute;inset:-50px 0;background:radial-gradient(ellipse,#307c8935,transparent 65%);filter:blur(22px);z-index:-1;pointer-events:none}
body.about-page main .folder-stack article,body.about-page main .folder-stack article.is-open{background:none;border:0;box-shadow:none;transform:none;border-radius:0;padding:0;margin:0 0 24px;color:var(--ink)}
.about-page .folder-tab{justify-content:start;gap:20px;padding:14px 0;color:#aac4ce}
.about-page .folder-tab::before,.about-page .is-open .folder-tab::before{position:static;content:'';width:10px;height:10px;flex:none;border:0;border-radius:50%;background:#688f9c;box-shadow:0 0 12px #7acddd33}
.about-page .is-open .folder-tab::before{background:#c5f6f2;box-shadow:0 0 12px #9cf2df,0 0 38px #7bddc877}
.about-page .folder-tab::after{margin-left:auto}
.about-page .is-open .folder-tab,.about-page .is-open .folder-tab:hover{color:#e9f8fa}
.about-page .folder-content{padding:16px 0 26px 30px;animation:surface-in .4s ease both}
body.about-page main .folder-stack .folder-content h3{color:var(--ink)}
.about-page .folder-content p{color:var(--muted)}
.about-page .side-explorer{align-items:center}
.about-page .side-stage{position:relative;top:0;min-height:430px;border:0;background:none;box-shadow:none;border-radius:0;overflow:visible;padding:0;pointer-events:none}
.about-page .side-stage::before{content:'';position:absolute;inset:-40px;background:radial-gradient(ellipse,#47999930,transparent 63%);filter:blur(24px)}
.about-page .stage-canvas{position:absolute;inset:0;display:grid;place-items:center;padding:0}
.about-page .sea-life{position:relative;width:250px;height:310px;filter:drop-shadow(0 0 26px #5ac1c233);animation:sea-sway 7s ease-in-out infinite alternate;transform-origin:50% 90%}
.about-page .sea-life::before{content:'';position:absolute;left:22px;top:12px;width:210px;height:125px;border-radius:52% 48% 35% 38% / 80% 80% 20% 20%;background:radial-gradient(ellipse at 45% 10%,#d0fff388,#76d9d738 48%,#70bfcf18 70%);box-shadow:inset 0 -7px 20px #bceee533;transition:transform .65s,opacity .65s,background .65s}
.about-page .sea-frond{position:absolute;top:113px;left:calc(55px + var(--piece) * 40px);width:30px;height:calc(130px + var(--piece) * 16px);border-radius:35% 65% 80% 20%;background:linear-gradient(#92e8d638,#499eae18,transparent);transform:rotate(calc((var(--piece) - 1.5) * 9deg));transform-origin:50% 0;transition:height .65s,transform .65s,background .65s}
.about-page [data-scene="1"] .sea-life::before{opacity:.2;transform:scale(.65) translateY(70px)}
.about-page [data-scene="1"] .sea-frond{top:60px;height:220px;width:42px;background:linear-gradient(0deg,#398a7744,#9adfbb66,transparent);transform-origin:50% 100%;transform:rotate(calc((var(--piece) - 1.5) * 20deg));border-radius:80% 20% 20% 80%}
.about-page [data-scene="2"] .sea-life::before{transform:scale(.85);background:radial-gradient(ellipse at 45% 10%,#ffe2da88,#d890ad33 55%,transparent 80%)}
.about-page [data-scene="2"] .sea-frond{background:linear-gradient(#e7a7c144,#8b77be22,transparent);transform:rotate(calc((var(--piece) - 1.5) * 15deg))}
.about-page .side-button{justify-content:start;gap:18px;color:#a9c2cb}
.about-page .side-button::before{content:'';flex:none;width:7px;height:7px;border-radius:50%;background:#517c8b}
.about-page .side-button::after{content:none}
.about-page .is-selected .side-button::after{content:none}
.about-page .is-selected .side-button::before{background:#dcfff4;box-shadow:0 0 20px #b5ffe5}
.about-page .recent-list article>div{padding:0 0 28px 25px;animation:surface-in .4s ease both}
.about-page .side-button:hover,.about-page .folder-tab:hover{color:#e0fff3}
.about-page button:focus-visible{outline:2px solid #b2f5e4;outline-offset:5px}
@keyframes surface-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes sea-sway{from{transform:translateY(0) rotate(-4deg)}to{transform:translateY(-12px) rotate(4deg)}}
@media(max-width:680px){body.about-page main .about-story,body.about-page main .about-practice,body.about-page main .about-recent{padding-block:60px}.about-page .folder-stack{padding-left:0}.about-page .side-explorer{gap:0}.about-page .side-stage{min-height:200px;overflow:clip}.about-page .sea-life{scale:.6;height:290px;transform-origin:center}.about-page .stage-canvas{inset:-55px 0 0}.about-page .side-stage::before{inset:0}}
@media(prefers-reduced-motion:reduce){.about-page .sea-life,.about-page .folder-content,.about-page .recent-list article>div{animation:none}.about-page .sea-frond,.about-page .sea-life::before{transition:none}}
