:root { --ease:cubic-bezier(.2,.75,.2,1); }
button,a { -webkit-tap-highlight-color:transparent; } button { font:inherit; cursor:pointer; }
a:focus-visible,button:focus-visible { outline:3px solid #ee763e; outline-offset:5px; }
.sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
.menu-toggle { display:none; } section,article[id] { scroll-margin-top:30px; }
.pill-button,.header-link,.contact-link { transition:transform .3s var(--ease),color .3s,box-shadow .3s; }
.pill-button:hover { transform:translateY(-3px);box-shadow:0 8px 35px #c9ff3524; }
.header-link:hover,nav a:hover { color:var(--acid); }
.pill-button span,.contact-link span,.download-link span,.gallery-button span { display:inline-block;transition:transform .35s var(--ease); }
.contact-link:hover span,.download-link:hover span { transform:translate(3px,-3px); }
.hero-art .phone { transition:transform .7s var(--ease),box-shadow .7s; }
.hero-art .phone:hover,.hero-art .phone:focus-visible { transform:translateY(-18px) rotate(0);box-shadow:0 32px 65px #0008;z-index:6; }
.orb-one { animation:breathe 8s ease-in-out infinite alternate; }.orb-two { animation:breathe 7s ease-in-out infinite alternate-reverse; }
@keyframes breathe { to { transform:translate(12px,-20px) scale(1.09); } }
.app-filters { display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px; }
.filter { border:1px solid #c8c9c1;border-radius:30px;background:transparent;padding:13px 18px;font-size:12px;font-weight:700;min-height:44px;transition:background .25s,color .25s; }
.filter.active,.filter:hover { background:var(--ink);color:var(--paper);border-color:var(--ink); }
.project { min-height:670px;border-radius:16px;isolation:isolate;transition:box-shadow .5s,transform .5s var(--ease); }
.project[hidden] { display:none; }.project-wide { min-height:390px; }.project-copy { max-width:100%;position:static; }
.project-copy>p:not(.project-number) { max-width:345px; }.project-copy>* { position:relative; }.project h3 { position:static; }
.project-art { pointer-events:none;transition:translate .6s var(--ease),scale .6s var(--ease);translate:var(--mx,0px) var(--my,0px); }
.project:not(.project-wide) .project-art { width:43%;max-width:230px;right:8%;bottom:-13%; }.project-art img { border-radius:18px; }
.app-store-link { color:inherit;text-decoration:none; }.app-store-link::after { content:'';position:absolute;inset:0;z-index:2; }
.app-actions { position:relative;z-index:3;display:flex;gap:10px;flex-wrap:wrap; }
.download-link,.gallery-button { display:inline-flex;justify-content:center;align-items:center;gap:12px;min-height:46px;border-radius:100px;padding:11px 16px;font-size:11px;font-weight:800;text-decoration:none;border:1px solid currentColor;color:inherit;background:transparent; }
.download-link { background:#f7f6f0;color:#101718;border-color:transparent; }.project-nucleus .download-link,.project-docnest .download-link { background:#11171c;color:#fff; }
.gallery-button:hover span { transform:rotate(90deg); }.gallery-button:hover { background:#ffffff17; }
.feature-tags { list-style:none;padding:0;margin:0 0 24px;display:flex;gap:6px;flex-wrap:wrap; }
.feature-tags li { font:9px var(--mono);border-bottom:1px solid #8886;padding-bottom:7px;margin-right:7px; }
.project::before { content:'';pointer-events:none;position:absolute;width:310px;height:310px;border-radius:50%;background:#ffffff0c;bottom:-35px;right:-70px;transition:transform .8s var(--ease); }
.project:hover::before { transform:scale(1.65); }.project:hover .project-art,.project:focus-within .project-art { scale:1.045; }.project:hover { box-shadow:0 18px 40px #0b0d1216; }
.footer-actions { display:flex;flex-wrap:wrap;gap:18px; }.footer-actions a,#motion-toggle { color:#d4d8ce;font:10px var(--mono);text-decoration:none;background:none;border:none;padding:12px 0; }.footer-actions a:hover,#motion-toggle:hover { color:var(--acid); }
.gallery-open { overflow:hidden; }.gallery-dialog { --gallery-color:#d5c9ff;--screen-color:#b79a61;width:min(1320px,96vw);max-width:none;height:min(960px,94dvh);max-height:94dvh;border:1px solid #ffffff30;border-radius:22px;padding:0;background:#11151b;color:#f2f1e9;overflow:auto;overscroll-behavior:contain; }
.gallery-dialog::backdrop { background:#05080cd9;backdrop-filter:blur(16px); }.gallery-dialog[open] { animation:gallery-in .5s var(--ease); }
@keyframes gallery-in { from { opacity:0;transform:translateY(28px) scale(.98); } to { opacity:1;transform:none; } }
.gallery-header { display:flex;justify-content:space-between;align-items:center;padding:26px 36px;border-bottom:1px solid #ffffff18; }
.gallery-label { font:10px var(--mono);text-transform:uppercase;color:#9ea6a8;letter-spacing:.12em; }
.close-gallery { background:#ffffff0a;color:#eee;border:1px solid #ffffff30;border-radius:50px;padding:10px 16px;font-size:12px;min-height:44px; }.close-gallery:hover { background:#ffffff20; }
.gallery-layout { display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;padding:42px 48px;align-items:center; }
.gallery-story h2 { font-size:clamp(40px,4.8vw,68px);color:var(--gallery-color); }.gallery-story>p:not(.eyebrow):not(.capture-note) { color:#bfc5c5;font-size:15px;line-height:1.8;max-width:410px; }
.gallery-story .eyebrow { font-size:9px;line-height:1.6; }.gallery-story .eyebrow b { font-weight:500; }
#gallery-features { list-style:none;padding:0;margin:28px 0 35px; }#gallery-features li { padding:13px 0 13px 22px;border-bottom:1px solid #ffffff16;color:#dae0dc;font-size:12px;line-height:1.6;position:relative; }#gallery-features li::before { content:'↗';position:absolute;left:0;color:var(--gallery-color); }
.gallery-story .pill-button { background:var(--gallery-color); }.capture-note { color:#939c9d;font:10px/1.7 var(--mono);max-width:390px;margin:24px 0 0; }
.gallery-viewer { min-width:0; }.gallery-stage { position:relative;height:clamp(300px,46vh,470px);display:flex;align-items:center;justify-content:center;touch-action:pan-y; }
.stage-halo { position:absolute;width:83%;aspect-ratio:1;max-width:400px;border-radius:50%;background:radial-gradient(circle,var(--screen-color),transparent 68%);opacity:.26;transition:background 1s; }
.screen-stack { position:relative;height:100%;aspect-ratio:9 / 20;perspective:1000px; }.gallery-screen { position:absolute;width:100%;height:100%;object-fit:contain;background:#111;border:5px solid #30353c;border-radius:22px;box-shadow:0 24px 60px #0005;transition:transform .75s var(--ease),opacity .6s,filter .6s;pointer-events:none; }
.gallery-screen.current { opacity:1;transform:translateX(0) rotate(0) scale(1);z-index:3; }.gallery-screen.upcoming { opacity:.35;transform:translateX(55px) rotate(9deg) scale(.85);filter:brightness(.7);z-index:2; }.gallery-screen.waiting { opacity:0;transform:translateX(-50px) rotate(-9deg) scale(.85);z-index:1; }
.slide-arrow { position:absolute;z-index:5;border:1px solid #ffffff38;color:#fff;background:#151b21;border-radius:50%;width:46px;height:46px;font-size:22px;transition:background .2s,transform .2s; }.slide-arrow:hover { background:#39424a;transform:scale(1.1); }.prev { left:0; }.next { right:0; }
.slide-caption { display:flex;justify-content:space-between;gap:15px;font:11px/1.5 var(--mono);margin:25px 0 18px; }#slide-counter { white-space:nowrap;color:#8f9b9e; }
.theme-picker { display:flex;gap:6px;flex-wrap:wrap; }.theme-chip { display:flex;gap:6px;align-items:center;background:transparent;border:1px solid #ffffff28;color:#aeb9bb;border-radius:30px;padding:9px 10px;min-height:36px;font-size:10px; }.theme-chip::before { content:'';width:8px;height:8px;border-radius:50%;background:var(--swatch); }.theme-chip.selected { border-color:var(--gallery-color);color:#fff;background:#ffffff0a; }
.gallery-thumbs { display:flex;justify-content:center;gap:10px;padding-top:22px; }.thumbnail { width:40px;height:66px;background:#222;border:1px solid transparent;border-radius:5px;padding:2px;opacity:.45;transition:opacity .3s,transform .3s,border-color .3s; }.thumbnail img { width:100%;height:100%;object-fit:cover;border-radius:3px; }.thumbnail.selected { opacity:1;border-color:var(--gallery-color);transform:translateY(-4px); }.gesture-hint { text-align:center;color:#879598;font:9px var(--mono);margin:14px 0 0; }
@media(min-width:1100px) { .project:not(.project-wide) { min-height:700px; }.project-copy>p:not(.project-number) { max-width:370px; }.project:not(.project-wide) .project-art { bottom:-16%;width:45%;max-width:250px; } }
@media(max-width:1050px) and (min-width:801px) { .hero { grid-template-columns:1fr 1fr;padding-inline:5vw; }.hero h1 { font-size:62px; }.phone-main { width:165px; }.phone-back { width:135px; }.phone-front { width:125px; }.work-section { padding-inline:5vw; } }
@media(max-width:800px) { .menu-toggle { display:inline-flex;border:0;color:var(--paper);background:transparent;font:11px var(--mono);padding:15px 0; }.site-header { flex-wrap:wrap;height:auto;min-height:74px;gap:12px; }.site-header .wordmark { margin-right:auto; }.header-link { display:none; }#main-nav { display:none;width:100%;order:5;padding:8px 0 22px; }#main-nav.open { display:flex; }#main-nav a { padding:10px 0; }.hero-art { max-width:460px;width:100%;margin-inline:auto;min-height:450px; }.hero-art .phone-main { width:170px; }.hero-art .phone-front { top:170px; }.orbit-text { display:none; }.art-caption { bottom:12px; }.project { min-height:650px;padding:30px; }.project-wide { min-height:400px; }.project-wide .tank { width:76%;bottom:-10px;right:-25%; }.project:not(.project-wide) .project-art { width:44%;max-width:220px;bottom:-20%; }.contact { min-height:450px; }.gallery-dialog { width:100vw;height:100dvh;max-height:100dvh;border-radius:0;border:0; }.gallery-header { padding:18px 22px;position:sticky;top:0;z-index:10;background:#11151bf5;backdrop-filter:blur(12px); }.gallery-label { display:none; }.gallery-layout { grid-template-columns:1fr;padding:30px 22px;gap:30px; }.gallery-story h2 { font-size:43px; }.gallery-story>p:not(.eyebrow):not(.capture-note) { max-width:none; }.gallery-story #gallery-features { margin:18px 0 24px; }.gallery-stage { height:min(56dvh,460px); }.gallery-viewer { grid-row:2; }.gallery-story .capture-note { font-size:9px;max-width:none; }.footer-actions { gap:24px; } }
@media(max-width:430px) { .hero-art { transform:none;margin-bottom:0;min-height:450px; }.hero-art .phone-main { right:23%;width:155px; }.hero-art .phone-back { right:48%;width:125px; }.hero-art .phone-front { width:115px;right:0;top:190px; }.project { min-height:620px;padding:26px; }.project-wide { min-height:420px; }.project:not(.project-wide) .project-art { width:48%;bottom:-10%;right:9%; }.project-wide .tank { width:100%;right:-32%;bottom:0; }.project-copy { max-width:none; }.project h3 { font-size:40px; }.app-actions { gap:8px; }.download-link,.gallery-button { padding:10px 13px;font-size:10px; }.filter { font-size:10px;padding:11px 13px; }.slide-caption { font-size:10px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { animation:none!important;transition:none!important; }.reveal { opacity:1;transform:none; } }
.motion-paused { scroll-behavior:auto; }.motion-paused *,.motion-paused *::before,.motion-paused *::after { animation:none!important;transition:none!important; }.motion-paused .reveal { opacity:1;transform:none; }
@media(max-width:800px) {
  .gallery-viewer { grid-row:1; }
  .gallery-story { grid-row:2; }
  .gallery-label { display:block;font-size:9px;letter-spacing:.03em; }
  .gallery-stage { height:min(51dvh,440px); }
}
.app-deep-dive { margin:0 48px 48px;padding-top:42px;border-top:1px solid #ffffff20; }
.story-jump { background:none;border:0;border-bottom:1px solid #ffffff35;color:var(--gallery-color);padding:12px 0;font:11px var(--mono);margin-top:12px; }#app-story-title { scroll-margin-top:110px; }
.gallery-header { position:sticky;top:0;z-index:10;background:#11151bf5;backdrop-filter:blur(12px); }
.gallery-thumbs { flex-wrap:wrap; }.thumbnail { flex:0 0 40px; }
.gallery-stage { scroll-margin-top:100px; }
.app-deep-dive>.eyebrow { color:#99a3a3;font-size:9px; }.app-deep-dive>h3 { font:600 clamp(30px,3.5vw,48px)/1.12 var(--serif);letter-spacing:-.035em;max-width:760px;margin-bottom:22px; }
#app-story-intro { max-width:700px;font-size:15px;line-height:1.85;color:#bfc8c6;margin-bottom:38px; }
.story-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:30px 35px; }.story-grid article { border-top:1px solid #ffffff20;padding:20px 0; }.story-grid article>span { font:10px var(--mono);color:var(--gallery-color); }.story-grid h4 { font-size:17px;letter-spacing:-.025em;margin:16px 0 12px; }.story-grid p { color:#aebbb9;font-size:13px;line-height:1.85;margin:0; }
.story-ending { display:flex;align-items:center;justify-content:space-between;gap:26px;margin-top:28px;padding:26px 0 0;border-top:1px solid #ffffff20; }.story-ending p { color:#c8d1c9;max-width:500px;font:500 18px/1.6 var(--serif);margin:0; }.story-download { color:var(--gallery-color);font-size:12px;text-underline-offset:6px;white-space:nowrap; }
@media(max-width:800px) { .app-deep-dive { margin:0 22px 36px;padding-top:32px; }.story-grid { grid-template-columns:1fr;gap:2px; }.story-ending { align-items:flex-start;flex-direction:column; }.story-grid h4 { font-size:19px; } }