@import url("https://fonts.googleapis.com/css2?family=Inter:wght@600;800;900&family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,300,0,0&display=swap");
@font-face{font-family:"AHDS Rounded";src:url("../public/assets/fonts/GenSenRounded2TW-R.subset.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"AHDS Rounded";src:url("../public/assets/fonts/GenSenRounded2TW-M.subset.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:"AHDS Rounded";src:url("../public/assets/fonts/GenSenRounded2TW-B.subset.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"AHDS Rounded";src:url("../public/assets/fonts/GenSenRounded2TW-H.subset.woff2") format("woff2");font-style:normal;font-weight:900;font-display:swap}
@font-face{font-family:"AHDS Rounded Full";src:url("../public/assets/fonts/GenSenRounded2TW-R.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"AHDS Rounded Full";src:url("../public/assets/fonts/GenSenRounded2TW-M.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:"AHDS Rounded Full";src:url("../public/assets/fonts/GenSenRounded2TW-B.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"AHDS Rounded Full";src:url("../public/assets/fonts/GenSenRounded2TW-H.woff2") format("woff2");font-style:normal;font-weight:900;font-display:swap}

:root{--ink:#11151c;--muted:#2caadb;--cyan:#00d9ef;--cyan-deep:#00bfd7;--ice:#e7f8ff;--line:#dce7ec;--footer:#11191e;--content:1120px;--page-content:var(--content);--header-h:98px;--radius:20px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:"AHDS Rounded","AHDS Rounded Full","PingFang TC","Microsoft JhengHei",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
.about-page,.news-page{--page-content:1280px}
.content-width{width:min(var(--page-content),calc(100% - 120px));margin-inline:auto}
.section-code{margin:0 0 10px;color:var(--cyan-deep);font-size:12px;font-weight:900;letter-spacing:.06em}

.page-intro{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 82% 13%,#bdd3e9 0%,transparent 43%),linear-gradient(135deg,#6f98c3 0%,#8fb4d9 52%,#bdd3e9 100%);color:#fff;transition:transform 1s cubic-bezier(.76,0,.24,1),visibility 1s}
.page-intro.is-done{transform:translateY(-102%);visibility:hidden}
.page-intro__copy{width:min(1180px,calc(100% - 48px));padding:36px 0;text-align:center}
.page-intro__line{white-space:nowrap}
.page-intro__copy p{margin:0 0 12px;font-size:clamp(24px,3vw,48px);font-weight:700;line-height:1.3;letter-spacing:.06em}
.page-intro__copy strong{display:block;font-family:Inter,Arial,sans-serif;font-size:clamp(56px,9vw,138px);line-height:1.04;letter-spacing:-.04em}
.page-intro__char{display:inline-block;color:rgba(255,255,255,.22);opacity:.48;filter:blur(2px);transform:translateY(.24em);animation:intro-char 720ms cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(var(--char-index) * 68ms)}
.page-intro__studio{display:block;margin-top:24px;color:rgba(255,255,255,.9);font-family:Inter,Arial,sans-serif;font-size:clamp(13px,1.2vw,19px);font-weight:600;letter-spacing:.22em;text-transform:uppercase;opacity:0;transform:translateY(14px);animation:intro-studio .8s 1.45s cubic-bezier(.16,1,.3,1) forwards}
.page-intro__count{position:absolute;right:38px;bottom:26px;font-family:Arial,sans-serif;font-size:17px;font-weight:700}
.page-intro__count::after{content:"%";margin-left:2px;font-size:10px}
.page-intro__count.is-loading-status{font-family:"PingFang TC","Microsoft JhengHei",sans-serif;font-size:14px;letter-spacing:.04em;white-space:nowrap}
.page-intro__count.is-loading-status::after{content:none}
@keyframes intro-char{to{color:#fff;opacity:1;filter:blur(0);transform:translateY(0)}}
@keyframes intro-studio{to{opacity:1;transform:none}}

.about-profile-page>.page-intro{background:radial-gradient(circle at 82% 13%,#fff0a8 0%,transparent 43%),linear-gradient(135deg,#f4b900 0%,#fdd000 52%,#ffe66a 100%);color:#11151c}
.about-profile-page>.page-intro .page-intro__char{color:rgba(17,21,28,.22);animation-name:intro-char-dark}
.about-profile-page>.page-intro .page-intro__studio{color:rgba(17,21,28,.9)}
@keyframes intro-char-dark{to{color:#11151c;opacity:1;filter:blur(0);transform:translateY(0)}}

.about-header{position:sticky;z-index:30;top:0;left:0;width:100vw;height:126px;display:flex;align-items:center;justify-content:space-between;padding:27px 3.2vw 24px 2.7vw;background:rgba(255,255,255,.92);box-shadow:inset 0 -1px rgba(19,32,51,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand{display:block;width:clamp(205px,12.8vw,246px)}
.brand img{width:100%;height:auto}
.nav-shell{display:contents}
.top-nav{position:absolute;left:50%;display:flex;align-items:center;gap:clamp(24px,1.75vw,34px);color:#111;font-size:clamp(13px,.84vw,17px);font-weight:500;letter-spacing:.015em;transform:translateX(-50%);white-space:nowrap;-webkit-font-smoothing:auto}
.top-nav a{position:relative;padding-block:8px;transition:color 260ms ease}
.top-nav a:hover,.top-nav a.is-current{color:var(--cyan-deep)}
.top-nav a::after{content:none}
.header-actions{display:flex;align-items:center;gap:clamp(12px,1vw,19px);margin-left:auto}
.contact-button{position:relative;isolation:isolate;height:24px;min-height:24px;display:flex;align-items:center;justify-content:space-between;gap:9px;overflow:hidden;border:1.2px solid rgba(17,21,28,.92);border-radius:999px;padding:0 9px 0 12px;color:#111;background:rgba(255,255,255,.08);font-size:clamp(10px,.62vw,12px);line-height:1;font-weight:500;letter-spacing:.015em;transition:color 300ms ease,transform 220ms ease,background-color 220ms ease}
.contact-button::before{content:"";position:absolute;z-index:0;inset:0;border-radius:inherit;background:#111;transform:scaleX(0);transform-origin:left center;transition:transform 520ms cubic-bezier(.22,.72,.18,1)}
.contact-button>span{position:relative;z-index:1}
.contact-button .material-symbols-rounded{font-size:14px}
.contact-button:hover::before,.contact-button:focus-visible::before{transform:scaleX(1)}
.contact-button:hover,.contact-button:focus-visible{color:#fff;transform:translateX(-3px)}
.music-toggle{position:relative;flex:none;width:70.8px;height:38px;padding:0;overflow:hidden;border:1.5px solid rgba(17,21,28,.88);border-radius:999px;color:#111;background:rgba(17,21,28,.08);cursor:pointer;margin-inline:-14.16px;transform:scale(.6);transform-origin:center;transition:background-color 360ms ease,border-color 360ms ease,box-shadow 360ms ease}
.music-toggle::after{content:"";position:absolute;top:50%;left:5px;width:27px;height:27px;border-radius:50%;background:#111;box-shadow:0 2px 8px rgba(16,32,51,.18);transform:translateY(-50%);transition:left 420ms cubic-bezier(.22,.8,.2,1),transform 420ms cubic-bezier(.22,.8,.2,1),background-color 360ms ease}
.music-toggle.is-on{border-color:#66ffff;color:#132033;background:#66ffff;box-shadow:0 0 18px rgba(102,255,255,.2)}
.music-toggle.is-on::after{left:38.8px;background:#fff;transform:translateY(-50%) rotate(180deg)}
.music-toggle:hover,.music-toggle:focus-visible{border-color:#66ffff;box-shadow:0 0 0 3px rgba(102,255,255,.16);outline:none}
.mobile-music-toggle,.menu-toggle{display:none}

.side-signature{position:fixed;z-index:4;left:26px;top:50%;display:flex;align-items:center;gap:20px;transform:translate(-42%,-50%) rotate(-90deg);transform-origin:center;font-family:Arial,sans-serif;font-size:10px;font-weight:800;letter-spacing:.12em;pointer-events:none}
.side-signature i{display:block;width:72px;height:1px;background:#111}

.about-hero{padding-top:98px}
.hero-sequence-pending .about-hero__copy,.hero-sequence-pending .about-hero .media-frame{opacity:0}
.about-hero__copy{transform-origin:left center}
.about-title-group{width:max-content;max-width:100%;transform-origin:left center;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.about-title-group:hover{transform:scale(1.035)}
.about-hero.visuals-entered .about-hero__copy{animation:about-copy-arrive 1.8s cubic-bezier(.16,1,.3,1) both}
.about-hero h1{margin:0;font-family:Arial,sans-serif;font-size:clamp(70px,8vw,116px);line-height:.88;letter-spacing:-.075em}
.about-hero h1 em{color:var(--cyan);font-style:normal}
.about-hero h2,.numbers-section h2,.section-heading h2{margin:14px 0 0;font-size:clamp(24px,2.3vw,34px);letter-spacing:.02em}
.hero-intro{margin-top:28px;font-size:16px;line-height:1.8;color:#35414a}
.hero-intro p{margin:0}
.hero-gallery{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:50px}
.media-frame{position:relative;margin:0;aspect-ratio:4/3;overflow:hidden;background:#e9f7fb;transition:transform .75s cubic-bezier(.16,1,.3,1),filter .75s cubic-bezier(.16,1,.3,1)}
.media-frame::after{content:"";position:absolute;inset:-25% -70%;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.42) 50%,transparent 62%);transform:translateX(-46%);opacity:0;pointer-events:none}
.media-frame img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.8,.2,1),filter .7s ease}
.media-frame:hover img{transform:scale(1.045);filter:saturate(1.06)}
.media-frame:hover::after{opacity:1;transform:translateX(46%);transition:transform 1.1s cubic-bezier(.16,1,.3,1),opacity .25s ease}
.media-frame--left{clip-path:polygon(20% 0,100% 0,100% 100%,0 100%,0 11%,20% 11%)}
.media-frame--right{clip-path:polygon(0 0,100% 0,100% 89%,80% 89%,80% 100%,0 100%)}
.about-hero.visuals-entered .media-frame--left{animation:hero-frame-left-arrive 2.35s 1.85s cubic-bezier(.16,1,.3,1) both}
.about-hero.visuals-entered .media-frame--right{animation:hero-frame-right-arrive 2.35s 2.1s cubic-bezier(.16,1,.3,1) both}

.numbers-section{margin-top:100px;padding-top:38px;border-top:1px solid var(--line)}
.number-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px}
.number-card{min-height:164px;padding:25px 28px;border-radius:14px;background:linear-gradient(135deg,#e6f8ff 0%,#cceefd 100%);display:flex;flex-direction:column;justify-content:space-between;transition:transform .35s,box-shadow .35s}
.number-card:hover{transform:translateY(-6px);box-shadow:0 18px 35px rgba(44,132,164,.16)}
.number-card span{font-size:15px;font-weight:700}
.number-card small{display:block;margin-top:4px;color:#78909b;font-family:Arial,sans-serif;font-size:9px;font-weight:700;letter-spacing:.08em}
.number-card strong{align-self:flex-end;font-family:Arial,sans-serif;font-size:48px;line-height:1;letter-spacing:-.04em}

.system-section{margin-top:110px;padding-top:38px;border-top:1px solid var(--line)}
.story-card{min-height:330px;display:grid;grid-template-columns:90px 1fr minmax(340px,46%);gap:34px;align-items:stretch;margin-top:30px;padding:20px;border:1px solid #cce8f1;border-radius:18px;background:#fff;overflow:hidden}
.story-index{padding:14px 0 0 8px;color:var(--cyan);font-family:Arial,sans-serif;font-size:30px;font-weight:800;border-right:1px solid var(--line)}
.story-copy{align-self:center;padding:22px 0}
.story-copy h3,.feature-copy h3{margin:0 0 18px;font-size:28px;line-height:1.25}
.story-copy p,.feature-copy p{max-width:520px;margin:0;color:var(--muted);font-size:15px;line-height:1.9}
.story-copy p.copy-dark,.feature-copy p.copy-dark{color:#3b434a}
.story-copy blockquote{margin:0 0 14px;font-family:Arial,sans-serif;font-size:16px;line-height:1.45;color:#3b4953}
.story-media{position:relative;margin:0;min-height:290px;overflow:hidden;padding:1px;background:#8edbe8}
.story-media.is-awaiting-entrance{opacity:0;transform:translate3d(64px,0,0)}
.story-media--corner-a{clip-path:polygon(15% 0,100% 0,100% 100%,0 100%,0 15%,15% 15%)}
.story-media--corner-b{clip-path:polygon(0 0,85% 0,85% 15%,100% 15%,100% 100%,0 100%)}
.story-media--corner-c{clip-path:polygon(0 0,100% 0,100% 85%,85% 85%,85% 100%,0 100%)}
.story-media img{width:100%;height:100%;object-fit:cover;transform:translateZ(0) scale(1);backface-visibility:hidden;transition:transform .42s cubic-bezier(.16,1,.3,1);will-change:transform}
.story-media--top img{object-position:center 23%}
@media (hover:hover) and (pointer:fine){
  .story-media:hover img,.story-card:focus-within .story-media img{transform:translateZ(0) scale(1.02)}
}
.round-link,.footer-arrow{width:54px;height:30px;display:grid;place-items:center;margin-top:20px;border-radius:999px;color:#fff;background:var(--cyan);font-family:Arial,sans-serif;font-weight:800;transition:width .25s,background .25s}
.round-link:hover,.footer-arrow:hover{width:72px;background:#66ffff}

.feature-panel{display:grid;grid-template-columns:1fr 1.08fr;align-items:center;gap:42px;min-height:470px;margin-top:22px;padding:50px 64px;border-radius:18px;background:linear-gradient(135deg,#f0f9fc 0%,#e2f3f8 100%);overflow:hidden}
.feature-panel--reverse{grid-template-columns:1.08fr 1fr}
.feature-copy h3{font-size:32px}
.capability-map,.triad-diagram{position:relative;width:min(100%,400px);aspect-ratio:1;margin:auto}
.capability-map{border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.98) 0 22%,rgba(89,207,239,.09) 22.5% 42%,transparent 42.5%);isolation:isolate}
.capability-orbit{position:absolute;z-index:-1;inset:9%;border:1px solid rgba(0,191,215,.32);border-radius:50%}
.capability-orbit--two{inset:25%;border-style:dashed;opacity:.75}
.capability-core{position:absolute;left:50%;top:50%;width:116px;height:116px;display:grid;place-content:center;text-align:center;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #aeb7bf;transform:translate(-50%,-50%)}
.capability-core__mark{display:block;width:104px;height:104px;overflow:hidden;border-radius:50%}
.capability-core__mark img{display:block;width:auto;max-width:none;height:100%}
.capability-node{position:absolute;width:178px;min-height:66px;display:flex;flex-direction:column;justify-content:center;padding:12px 15px;border:1px solid rgba(0,191,215,.25);border-radius:13px;background:rgba(255,255,255,.88);box-shadow:0 12px 25px rgba(64,142,169,.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.capability-node b{font-family:Inter,Arial,sans-serif;font-size:12px;line-height:1.25;letter-spacing:.01em}
.capability-node span{margin-top:5px;color:#337283;font-family:Inter,Arial,sans-serif;font-size:10px;line-height:1.25;font-weight:700}
.capability-node--digital{left:50%;top:0;transform:translateX(-50%);text-align:center}
.capability-node--visual{right:-2%;bottom:11%}
.capability-node--motion{left:-2%;bottom:11%}
.triad-diagram img{width:100%;height:100%;object-fit:contain}
.triad-label{position:absolute;text-align:center;font-family:"AHDS Rounded","AHDS Rounded Full","PingFang TC","Microsoft JhengHei",sans-serif;font-size:19px;line-height:1.1;font-weight:800}
.triad-label small{display:block;margin-top:3px;font-family:"AHDS Rounded","AHDS Rounded Full",sans-serif;font-size:9px;font-weight:700}
.triad-label{font-size:19px;font-weight:800}
.triad-label small{font-size:9px;font-weight:700}
.triad-label--1{left:50%;top:20%;transform:translateX(-50%)}
.triad-label--2{left:17%;bottom:23%}
.triad-label--3{right:14%;bottom:23%}
.feature-panel.is-visible .capability-orbit--one{animation:orbit-turn 16s linear infinite}
.feature-panel.is-visible .capability-orbit--two{animation:orbit-turn-reverse 11s linear infinite}
.feature-panel.is-visible .capability-core{animation:core-breathe 4.8s ease-in-out infinite}
.feature-panel.is-visible .capability-node{animation:diagram-item-arrive .9s cubic-bezier(.16,1,.3,1) both}
.feature-panel.is-visible .capability-node--visual{animation-delay:.13s}
.feature-panel.is-visible .capability-node--motion{animation-delay:.26s}
.feature-panel.is-visible .triad-diagram img{animation:triad-breathe 7s ease-in-out infinite}
.feature-panel.is-visible .triad-label{animation:diagram-item-arrive .9s cubic-bezier(.16,1,.3,1) both}
.feature-panel.is-visible .triad-label--2{animation-delay:.14s}
.feature-panel.is-visible .triad-label--3{animation-delay:.28s}
@keyframes photo-arrive{from{opacity:.12;filter:blur(12px) saturate(.72);transform:scale(1.1)}to{opacity:1;filter:blur(0) saturate(1);transform:scale(1)}}
@keyframes about-copy-arrive{from{opacity:.08;filter:blur(10px);transform:translate3d(0,34px,0) scale(.76)}to{opacity:1;filter:blur(0);transform:translate3d(0,0,0) scale(1)}}
@keyframes about-copy-arrive-desktop{from{opacity:.08;transform:translate3d(0,34px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes hero-frame-left-arrive{from{opacity:0;filter:blur(7px);transform:translate3d(-92px,0,0)}to{opacity:1;filter:blur(0);transform:translate3d(0,0,0)}}
@keyframes hero-frame-right-arrive{from{opacity:0;filter:blur(7px);transform:translate3d(92px,0,0)}to{opacity:1;filter:blur(0);transform:translate3d(0,0,0)}}
@keyframes orbit-turn{to{transform:rotate(360deg)}}
@keyframes orbit-turn-reverse{to{transform:rotate(-360deg)}}
@keyframes core-breathe{0%,100%{box-shadow:0 0 0 4px #aeb7bf,0 16px 32px rgba(17,25,35,.2)}50%{box-shadow:0 0 0 4px #aeb7bf,0 18px 42px rgba(0,191,215,.3)}}
@keyframes diagram-item-arrive{from{opacity:.15;filter:blur(8px)}to{opacity:1;filter:blur(0)}}
@keyframes triad-breathe{0%,100%{transform:rotate(-1deg) scale(.985)}50%{transform:rotate(1deg) scale(1.025)}}
.projects-strip{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:38px;margin-top:24px;padding:26px 30px;border:1px solid var(--line);border-radius:12px;transition:border-color .3s,background-color .3s,transform .3s}
.projects-strip strong{color:var(--cyan-deep);font-family:Inter,Arial,sans-serif;font-size:19px}
.projects-strip>span:not(.projects-strip__arrow){color:#44525b;font-size:13px;line-height:1.6}
.projects-strip__arrow{width:46px;height:28px;display:grid;place-items:center;border-radius:999px;color:#fff;background:var(--cyan);font-family:Arial,sans-serif;font-weight:800;transition:width .3s}
.projects-strip:hover,.projects-strip:focus-visible{border-color:var(--cyan);background:#f3fcfe;transform:translateY(-2px)}
.projects-strip:hover .projects-strip__arrow{width:62px}

.about-footer{margin-top:100px;background:var(--footer);color:#fff}
.footer-base{min-height:190px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:40px;width:min(var(--content),calc(100% - 104px));margin:auto}
.footer-base img{width:185px;justify-self:center}
.footer-left{justify-self:start;display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.footer-left canvas{display:block;width:235px;height:56px;max-width:100%}
.footer-copyright{font-size:11px;line-height:1.6;color:#fff}
.footer-contact{justify-self:end;text-align:right}
.footer-contact b,.footer-contact a,.footer-contact span{display:block;font-size:11px;line-height:1.75}
.footer-contact b{margin-bottom:5px;color:#66ffff;font-family:Inter,Arial,sans-serif;letter-spacing:.05em}
.footer-contact a,.footer-contact span{color:#b8c2c8}

.reveal{opacity:1;transform:none}

@media (max-width:1000px){
  :root{--header-h:82px}
  body.menu-open{overflow:hidden}
  .content-width{width:min(100% - 60px,var(--page-content))}
  .about-header{height:82px;padding:16px 20px}
  .brand{position:relative;z-index:2;width:clamp(164px,24vw,190px)}
  .menu-toggle{position:relative;z-index:3;width:46px;height:46px;display:grid;place-content:center;gap:5px;margin-left:10px;padding:0;border:0;border-radius:0;background:transparent;cursor:pointer;transition:transform 260ms ease}
  .menu-toggle span{display:block;width:24px;height:2.5px;border-radius:999px;background:#111;transform-origin:center;transition:transform 360ms cubic-bezier(.22,.8,.2,1),opacity 220ms ease,width 260ms ease,background-color 220ms ease}
  .menu-toggle:hover,.menu-toggle:focus-visible{background:transparent;outline:none}
  .menu-toggle:hover span,.menu-toggle:focus-visible span,.site-header.is-menu-open .menu-toggle span{background:#66ffff}
  .site-header.is-menu-open .menu-toggle{transform:scale(.96)}
  .site-header.is-menu-open .menu-toggle span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .site-header.is-menu-open .menu-toggle span:nth-child(2){width:0;opacity:0}
  .site-header.is-menu-open .menu-toggle span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  .mobile-music-toggle{position:relative;z-index:3;display:block;flex:none;width:60px;height:34px;margin:0 2px 0 auto;transform:none}
  .mobile-music-toggle::after{left:4px;width:24px;height:24px}
  .mobile-music-toggle.is-on::after{left:30px}
  .nav-shell{position:fixed;top:0;right:0;width:50vw;height:100dvh;padding:88px 18px 24px;display:flex;flex-direction:column;align-items:stretch;gap:16px;overflow-x:hidden;overflow-y:auto;border:1px solid rgba(255,255,255,.5);border-radius:10px 0 0 10px;background:linear-gradient(145deg,rgba(24,42,64,.86),rgba(48,70,96,.82));color:#fff;backdrop-filter:blur(28px) saturate(135%);-webkit-backdrop-filter:blur(28px) saturate(135%);box-shadow:0 24px 60px rgba(20,32,51,.3),inset 1px 1px 0 rgba(255,255,255,.3);opacity:0;visibility:hidden;transform:translate3d(105%,0,0);pointer-events:none;transition:opacity 260ms ease,visibility 260ms ease,transform 380ms cubic-bezier(.22,.8,.2,1)}
  .nav-shell.is-open,.site-header.is-menu-open .nav-shell{opacity:1;visibility:visible;transform:translate3d(0,0,0);pointer-events:auto}
  .top-nav{position:static;left:auto;display:flex;flex-direction:column;align-items:stretch;gap:0;color:#fff;font-size:17px;transform:none}
  .top-nav a{width:100%;min-height:64px;display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,.14);padding:12px 5px}
  .top-nav a:last-child{border-bottom:0}
  .top-nav a::before{content:"";width:0;height:1px;margin-right:0;background:#66ffff;transition:width 260ms ease,margin-right 260ms ease}
  .top-nav a:hover::before,.top-nav a:focus-visible::before,.top-nav a.is-current::before{width:18px;margin-right:10px}
  .header-actions{display:flex;width:100%;gap:12px;margin:0;padding-top:2px}
  .header-actions .music-toggle{display:none}
  .contact-button{flex:1;height:44px;min-height:44px;gap:12px;padding:0 14px 0 17px;border:1.5px solid #fff;color:#fff;font-size:14px}
  .contact-button .material-symbols-rounded{font-size:19px}
  .side-signature{display:none}
  .about-hero{padding-top:78px}
  .story-card{grid-template-columns:68px 1fr minmax(280px,40%)}
  .feature-panel{padding:40px}
}

@media (max-width:720px){
  .content-width{width:calc(100% - 36px)}
  .about-header{height:74px;padding:13px 14px}.brand{width:152px}
  .menu-toggle{width:42px;height:42px}
  .nav-shell{width:50vw;padding:82px 14px 24px}
  .top-nav{font-size:17px}
  .header-actions{display:none}
  .page-intro__copy{width:100%;padding-inline:14px}.page-intro__copy p{font-size:clamp(21px,6vw,28px);letter-spacing:.025em}.page-intro__copy strong{font-size:clamp(48px,14vw,64px)}.page-intro__studio{font-size:11px;letter-spacing:.14em}
  .about-hero{padding-top:58px}.section-code{font-size:10px}
  .about-hero h1{font-size:54px}.about-hero h2{font-size:22px}
  .hero-intro{font-size:14px}.hero-gallery{grid-template-columns:1fr;gap:12px;margin-top:32px}
  .numbers-section,.system-section{margin-top:70px}
  .number-grid{grid-template-columns:1fr 1fr}.number-card{min-height:130px;padding:20px}.number-card strong{font-size:36px}
  .story-card{grid-template-columns:46px 1fr;padding:12px;gap:18px}
  .story-index{font-size:22px}.story-copy{padding:18px 4px}.story-copy h3,.feature-copy h3{font-size:23px}
  .story-media{grid-column:1/-1;min-height:230px}.story-media--top img{object-position:center 28%}
  .feature-panel,.feature-panel--reverse{grid-template-columns:1fr;padding:34px 22px;gap:20px}.feature-panel--reverse .triad-diagram{order:2}.feature-panel--reverse .feature-copy{order:1}
  .capability-map,.triad-diagram{width:min(100%,320px)}
  .capability-node{width:148px;min-height:66px;padding:9px 10px}.capability-node--visual{right:-4%}.capability-node--motion{left:-4%}.capability-core{width:96px;height:96px}.capability-core__mark{width:86px;height:86px}
  .projects-strip{grid-template-columns:1fr auto;gap:8px 18px;padding:22px}.projects-strip strong{font-size:18px}.projects-strip>span:not(.projects-strip__arrow){grid-column:1/-1;grid-row:2}.projects-strip__arrow{grid-column:2;grid-row:1}
  .footer-base{width:calc(100% - 48px);min-height:320px;grid-template-columns:1fr;justify-items:center;gap:20px;padding-block:38px;text-align:center}.footer-base img{grid-row:1;width:178px}.footer-left{grid-row:2;justify-self:center;align-items:center}.footer-contact{grid-row:3;justify-self:center;text-align:center}
}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.page-intro{display:none}.reveal{opacity:1;transform:none;transition:none}.media-frame,.media-frame img,.story-media,.story-media img,.nav-shell{transition:none}.story-media.is-awaiting-entrance{opacity:1;transform:none}.about-hero.visuals-entered .media-frame,.feature-panel.is-visible .capability-orbit,.feature-panel.is-visible .capability-core,.feature-panel.is-visible .capability-node,.feature-panel.is-visible .triad-diagram img,.feature-panel.is-visible .triad-label{animation:none}}

@media (max-width:900px){body .site-header .top-nav a.is-current{color:#66ffff!important}}

/* Mobile-only refinement pass. Desktop declarations above remain untouched. */
.feature-panel--reverse .feature-copy>p{color:#3b434a}
@media (max-width:720px){
  .mobile-music-toggle{transform:scale(.8);transform-origin:right center}
  .footer-copyright{font-size:13px}
  .footer-contact b,.footer-contact a,.footer-contact span{font-size:13px}
}
@media (prefers-reduced-motion:reduce){.about-hero.visuals-entered .about-hero__copy{animation:none}.about-title-group{transition:none}.about-title-group:hover{transform:none}}
@media (min-width:721px){.about-hero.visuals-entered .about-hero__copy{animation-name:about-copy-arrive-desktop}}