/* About v4 — an open canvas, compact materials, a short story.
   Product block proportions derive from the current application's TextBlock,
   ImageBlock, YouTubeBlock and PDFBlock. Shared page/film/3D styles stay intact.
   v4.1 (2026-10-04): the page also carries five sections copied from Home,
   each marked data-home and styled by Home's own files (home.css, folder.css,
   anywhere.css). The page-wide rules below that would reach them (scroll
   margin, [hidden], heading margins and sizes, the phone label size) skip
   them with :where(:not([data-home] ...)), which leaves every selector's
   specificity, and so About's own sections, exactly as they were. The other
   way round, home.css gives Home's hero a bottom padding and its h1 a top
   padding; .ab-hero and .ab h1 set both back to About's own 0. */
.ab { --ab-panel:#181a1c; --ab-edge:rgba(255,255,255,.1); }
.ab-skip{position:fixed;z-index:999;top:12px;left:20px;transform:translateY(-150%);padding:12px 18px;background:var(--flow);color:#17140f}
.ab-skip:focus{transform:none}
.ab section:where(:not([data-home])),.ab [id]:where(:not([data-home],[data-home] *)){scroll-margin-top:112px}
.ab [hidden]:where(:not([data-home] *)){display:none!important}
.ab h1,.ab h2:where(:not([data-home] *)),.ab h3:where(:not([data-home] *)),.ab h4:where(:not([data-home] *)){margin:0}
.ab .ab-hero{padding-top:142px;padding-bottom:0}
.ab .hero-meta{margin-bottom:44px}
.ab-hero-grid{display:grid;grid-template-columns:1.5fr 1fr;align-items:center;gap:32px}
.ab h1{font-size:clamp(66px,7.6vw,118px);line-height:1.02;letter-spacing:-.065em;padding-top:0}
.ab h1 mark{padding-bottom:.09em;margin-bottom:-.09em}
.ab .ab-hero-copy>p{max-width:420px;margin-top:36px;font-size:19px;line-height:1.5;color:var(--sw-muted)}
.ab-text-link{display:inline-flex;align-items:center;gap:48px;padding:16px 0;min-height:48px;border-bottom:1px solid var(--sw-ink);margin-top:16px;font-size:16px}
.ab-text-link span,.ab-hero-foot a span{transition:transform .3s var(--sw-ease)}
.ab-text-link:hover span{transform:translate(3px,-3px)}
.ab-specimen{position:relative;width:100%;max-width:420px;aspect-ratio:1.03;margin:0 0 0 auto}
.ab-specimen-image{position:absolute;top:0;right:20px;width:65%;border-radius:5px;overflow:hidden;background:#151718}
.ab-specimen-image img{display:block;width:100%;height:auto}
.ab-handle{position:absolute;top:8px;left:8px;font-size:16px;line-height:20px;color:#d0d0c8;background:#252729;border-radius:4px;padding:0 3px}
.ab-specimen-note{position:absolute;left:0;top:58%;width:54%;padding:18px 20px;background:var(--ab-panel);color:#efeee9;border:1px solid var(--ab-edge);border-radius:8px;z-index:2}
.ab-specimen-note .eyebrow{font-size:8px;color:#b5b4ae}
.ab .ab-specimen-note p{font:15px/1.5 system-ui,sans-serif;margin-top:10px}
.ab-note-dot{position:absolute;right:-4px;top:50%;width:7px;height:7px;background:#e9e6de;border-radius:50%;border:1px solid #4c4d49}
.ab-specimen-line{position:absolute;inset:0;width:100%;height:100%;stroke:var(--sw-muted);stroke-width:1;pointer-events:none}
.ab-specimen-line circle{fill:var(--sw-paper)}
.ab-specimen figcaption{position:absolute;bottom:0;left:0;color:var(--sw-muted);font-size:9px}
.ab-hero-foot{display:flex;justify-content:space-between;gap:24px;border-top:1px solid var(--sw-line);padding:20px 0;margin-top:48px;color:var(--sw-muted)}
.ab-hero-foot a{display:flex;align-items:center;justify-content:space-between;gap:32px;min-height:44px;margin:-12px 0;color:var(--sw-ink)}
.ab-hero-foot a:hover span{transform:translateY(3px)}
.ab .ab-flow{padding-top:76px}
.ab-flow-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:clamp(36px,7vw,110px);align-items:start;margin-top:44px}
.ab h2:where(:not([data-home] *)){font-size:clamp(42px,4.55vw,70px);line-height:1.06;letter-spacing:-.055em}
.ab-chapters{list-style:none;margin:34px 0 0;padding:0}
.ab-chapters li{display:grid;grid-template-columns:30px 1fr;gap:22px;padding:32px 0;border-top:1px solid var(--sw-line);scroll-margin-top:180px}
.ab-chapters li>.eyebrow{padding-top:7px;color:var(--sw-muted);transition:color .3s}
.ab-chapters h3{font-size:26px;line-height:1.25;letter-spacing:-.035em}
.ab .ab-chapters p{font-size:16px;line-height:1.55;max-width:32ch;color:var(--sw-muted);margin-top:12px}
.ab-chapters li.is-active>.eyebrow{color:var(--sw-accent)}
.ab-board-wrap{position:sticky;top:160px;width:100%;max-width:540px;margin:20px 0 0 auto}
.ab-board{width:100%;aspect-ratio:540/530;position:relative;color:#edeee9;isolation:isolate}
.ab-board-label{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;color:var(--sw-muted);font-size:8px}
.ab-board-label>span{color:var(--sw-ink);font-size:18px;line-height:10px}
.ab-connections{position:absolute;width:100%;height:100%;inset:0;stroke:var(--sw-muted);stroke-width:1.1;z-index:-1}
.ab-connections circle{fill:var(--sw-paper)}
.ab-wire{stroke-dasharray:500;stroke-dashoffset:0;transition:stroke .35s}
.ab-board[data-step="1"] .ab-wire-one,.ab-board[data-step="2"] .ab-wire-two{stroke:var(--sw-accent);stroke-width:1.6}
.ab-block{position:absolute;box-shadow:0 0 0 1px transparent;transition:transform .65s var(--sw-ease),box-shadow .35s}
.ab-board[data-step="1"] [data-material="thought"],.ab-board[data-step="2"] [data-material="creation"]{box-shadow:0 0 0 1px var(--sw-accent)}
.ab-board[data-step="2"] .ab-image-block{transform:translateY(-7px)}
.ab-board-wrap figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--sw-line);padding-top:16px;margin-top:22px;color:var(--sw-muted);font-size:13px}
.ab-board-wrap figcaption .eyebrow{font-size:8px}
.ab-pdf{top:11%;left:0;width:41%;background:#181a1c;border:1px solid #393a3c;border-radius:12px;overflow:hidden;font-family:Inter,system-ui,sans-serif}
.ab-pdf-head{display:flex;align-items:center;gap:5px;padding:8px 7px;border-bottom:1px solid #333537;background:#1d1f21;color:#d5d6d4;font-size:9px;white-space:nowrap}
.ab-pdf-head>span:first-child{font-size:15px;color:#858788}
.ab-pdf-head svg{width:12px;height:12px;fill:none;stroke:#e0864a;stroke-width:1.4;flex:none}
.ab-pdf-head small{font-size:7px;margin-left:auto;color:#949797}
.ab-pdf-paper{margin:7px;background:#f4f1e9;color:#262824;padding:17px 16px 12px;min-height:200px}
.ab-pdf-paper>span{font:7px/1.4 var(--sw-mono);letter-spacing:.05em}
.ab .ab-pdf-paper h4{font-size:23px;font-weight:500;letter-spacing:-.045em;line-height:1.08;margin-top:16px}
.ab-branch-diagram{margin:8px 0 3px;height:65px}
.ab-branch-diagram svg{width:100%;height:100%;stroke:#5b665a;stroke-width:1;fill:none}
.ab-branch-diagram circle{fill:#e67534;stroke:none}
.ab .ab-pdf-paper p{font:9px/1.6 Inter,system-ui,sans-serif;max-width:none}
.ab-pdf-foot{display:flex;align-items:center;justify-content:center;gap:18px;height:36px;font-size:9px;color:#b9babc}
.ab-pdf-foot button{height:32px;width:36px;background:transparent;color:inherit;border:0;font-size:19px;cursor:pointer;touch-action:manipulation}
.ab-pdf-foot button:disabled{opacity:.25;cursor:default}
.ab-pdf-foot button:hover:not(:disabled){color:#fff;background:#2a2c2e}
.ab-text-block{left:55%;top:16%;width:45%;border:1px solid var(--ab-edge);border-radius:8px;background:#191b1d;padding:18px 20px;font-family:system-ui,sans-serif}
.ab .ab-text-block h4{font:600 15px/1.35 system-ui,sans-serif;letter-spacing:-.01em;color:#eeefeb}
.ab .ab-text-block p{font:13px/1.65 system-ui,sans-serif;color:#c4c6c4;margin-top:9px}
.ab .ab-text-block .ab-block-question{color:#eeefeb;font-size:12px;margin-top:14px}
.ab-image-block{left:65%;top:61%;width:29%;border-radius:5px;overflow:hidden}
.ab-image-block img{display:block;width:100%;height:auto}
.ab .ab-video-block{left:9%;top:74%;width:34%;border:1px solid #333638;border-radius:9px;overflow:hidden;background:#1c1e20;color:#f0f1ed;font-family:Inter,system-ui,sans-serif}
.ab-video-grip{display:flex;height:15px;align-items:center;justify-content:center;font-size:12px;color:#6c6e70;background:#202224}
.ab-video-image{position:relative;display:block;aspect-ratio:16/9;overflow:hidden}
.ab-video-image img{display:block;width:100%;height:100%;object-fit:cover}
.ab-play{position:absolute;inset:0;margin:auto;width:34px;height:24px;display:grid;place-content:center;border-radius:6px;background:#c7372d;font-size:11px;color:white;transition:transform .2s}
.ab-video-block:hover .ab-play{transform:scale(1.1)}
.ab-video-title{display:block;padding:8px 10px;font-size:10px;font-weight:500;line-height:1.3}
.ab-video-title small{display:block;color:#a5a5a5;font-size:8px;font-weight:400;margin-top:4px}
.ab .ab-film-section{padding-block:64px 76px;margin-top:24px}
.ab-film-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,120px);align-items:center;margin-top:48px}
.ab-film-grid>div>p{margin-top:28px;max-width:32ch;font-size:18px}
.ab-italic{font-style:italic}
.ab .ab-film-section .pff{width:100%;max-width:520px;margin-left:auto;--sw-muted:#493323;--sw-line:rgba(23,20,15,.3)}
.ab .pff-frame{flex:none;min-height:0;aspect-ratio:1.66}
.ab .pff-ch,.ab .pff-toggle{min-height:44px}
.ab .pff-now{font-size:13px}
.ab .pff-ch:focus-visible,.ab .pff-toggle:focus-visible{outline-color:#17140f}
.ab .ab-close{padding-block:80px 64px}
.ab-close-grid{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:64px;margin-top:48px}
.ab .ab-close-grid>div>p{font-size:18px;color:var(--sw-muted);max-width:35ch;margin-top:28px}
.ab-close-grid .button{max-width:330px;margin-top:32px;min-height:54px;padding:18px 22px;font-size:15px;transition:background-color .2s}
.ab-close-grid .button:hover{background:#ef6920}
.ab-secondary{display:inline-flex;padding:16px 0;min-height:44px;font-size:13px;color:var(--sw-muted)}
.ab-secondary:hover{text-decoration:underline}
.ab-device{width:100%;max-width:400px;margin:0 0 0 auto}
.ab-device figcaption{text-align:center;font-size:9px;color:var(--sw-muted);margin-top:14px}
.ab .sw-footer-wrap{padding-top:20px}
@media(min-width:1500px){.ab-hero-grid{min-height:420px}.ab-flow-grid{grid-template-columns:1fr 1fr}.ab-board-wrap{margin-right:28px}}
@media(max-width:1100px){.ab-hero-grid{grid-template-columns:1.35fr 1fr;gap:24px}.ab h1{font-size:7.7vw}.ab-specimen{max-width:360px}.ab-flow-grid{gap:40px}.ab-board-wrap{top:180px}.ab-pdf-paper{padding:12px;min-height:170px}.ab .ab-pdf-paper h4{font-size:20px;margin-top:10px}.ab-branch-diagram{height:52px}.ab-text-block{padding:14px}.ab .ab-text-block h4{font-size:13px}.ab .ab-text-block p{font-size:11px}.ab .ab-text-block .ab-block-question{font-size:10px}.ab-pdf-head small{display:none}.ab-pdf-foot{height:32px}.ab-video-title{font-size:9px}.ab-video-title small{font-size:7px}.ab-close-grid{gap:32px}.ab-board-wrap figcaption{margin-top:40px}}
@media(max-width:800px){.ab .ab-hero{padding-top:116px}.ab .hero-meta{margin-bottom:28px}.ab-hero-grid{grid-template-columns:1fr 1fr;gap:18px}.ab h1{font-size:8.4vw}.ab .ab-hero-copy>p{font-size:16px;margin-top:24px}.ab-specimen{max-width:310px}.ab-specimen-image{right:0;width:72%}.ab-specimen-note{width:65%;padding:12px}.ab .ab-specimen-note p{font-size:12px}.ab-specimen-note .eyebrow{font-size:6px}.ab-specimen figcaption{font-size:7px}.ab-flow-grid{grid-template-columns:1fr;gap:24px}.ab-flow-copy h2{max-width:500px}.ab-chapters{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.ab-chapters li{display:block;padding:20px 0}.ab-chapters h3{font-size:21px;margin-top:12px}.ab .ab-chapters p{font-size:14px}.ab-board-wrap{position:relative;top:auto;margin:12px auto 0;max-width:510px}.ab-pdf-paper{min-height:195px}.ab-text-block{padding:18px}.ab .ab-text-block h4{font-size:15px}.ab .ab-text-block p{font-size:13px}.ab .ab-text-block .ab-block-question{font-size:12px}.ab-film-grid{gap:32px}.ab-film-grid h2{font-size:42px}.ab-film-grid>div>p{font-size:16px}.ab .pff-now{font-size:11px}.ab-close-grid{grid-template-columns:1.2fr 1fr}.ab-close-grid h2{font-size:42px}.ab .ab-close-grid>div>p{font-size:16px}}
@media(max-width:600px){.ab .ab-hero{padding-top:104px}.ab .hero-meta{font-size:8px;gap:16px}.ab .hero-meta span:last-child{font-size:7px}.ab-hero-grid{grid-template-columns:1fr;gap:24px}.ab h1{font-size:clamp(49px,11.7vw,70px)}.ab .ab-hero-copy>p{max-width:29ch;font-size:16px;margin-top:24px}.ab-text-link{font-size:14px;margin-top:10px;padding-block:12px}.ab-specimen{width:78%;max-width:285px;aspect-ratio:1.16;margin:0 0 0 auto}.ab-specimen-image{width:65%}.ab-specimen-note{left:0;top:53%;width:60%}.ab-specimen figcaption{font-size:7px}.ab-hero-foot{margin-top:26px;padding-top:16px;gap:16px;font-size:7px}.ab-hero-foot a{gap:12px;white-space:nowrap}.ab .ab-flow{padding-top:42px}.ab .section-label:where(:not([data-home] *)){font-size:8px;gap:16px}.ab .section-label:where(:not([data-home] *))>span:last-child{text-align:right;font-size:7px}.ab-flow-grid{margin-top:32px}.ab h2:where(:not([data-home] *)){font-size:42px}.ab-chapters{grid-template-columns:1fr;gap:0;margin-top:28px}.ab-chapters li{display:grid;grid-template-columns:20px 1fr;gap:18px;padding:20px 0}.ab-chapters h3{font-size:24px;margin-top:0}.ab .ab-chapters p{font-size:15px;max-width:32ch;margin-top:8px}.ab-board-wrap{max-width:420px;margin-top:16px}.ab-board{aspect-ratio:auto;height:460px}.ab-pdf{top:9%;width:47%}.ab-pdf-head{font-size:8px;padding:6px 4px;gap:3px}.ab-pdf-head>span:first-child{font-size:11px}.ab-pdf-head svg{width:10px}.ab-pdf-paper{padding:12px 8px;min-height:174px;margin:5px}.ab-pdf-paper>span{font-size:6px}.ab .ab-pdf-paper h4{font-size:19px}.ab-branch-diagram{height:50px}.ab .ab-pdf-paper p{font-size:8px}.ab-pdf-foot{height:36px;gap:3px}.ab-pdf-foot button{min-height:36px;width:36px}.ab-text-block{top:13%;left:52%;width:48%;padding:12px}.ab .ab-text-block h4{font-size:12px}.ab .ab-text-block p{font-size:11px;line-height:1.5}.ab .ab-text-block .ab-block-question{font-size:10px;margin-top:10px}.ab-image-block{left:59%;top:62%;width:36%}.ab .ab-video-block{top:69%;left:0;width:46%}.ab-video-title{font-size:9px;padding:7px}.ab-video-title small{font-size:7px}.ab-connections{display:none}.ab-board-wrap figcaption{font-size:12px;margin-top:30px}.ab-board-wrap figcaption .eyebrow{font-size:7px}.ab .ab-film-section{margin-top:12px;padding-block:44px 48px}.ab-film-grid{grid-template-columns:1fr;gap:32px;margin-top:32px}.ab-film-grid>div>p{font-size:16px;margin-top:20px;max-width:29ch}.ab .ab-film-section .pff{max-width:420px;margin:0}.ab .pff-now{font-size:12px}.ab-close-grid{grid-template-columns:1fr;gap:24px;margin-top:32px}.ab .ab-close{padding-block:48px 32px}.ab-close-grid .button{max-width:100%;margin-top:24px}.ab-device{max-width:310px;margin:0 auto}.ab-device figcaption{font-size:8px;margin-top:0}.ab .sw-footer-wrap{padding-top:0}}
@media(prefers-reduced-motion:reduce){.ab .ab-block,.ab .ab-wire,.ab-text-link span,.ab-hero-foot a span,.ab-play{transition:none}.ab-board[data-step="2"] .ab-image-block{transform:none}}

/* Comfortable keyboard/touch targets without enlarging the page artwork. */
.ab .ab-pdf-foot{height:44px}
.ab .ab-pdf-foot button{width:44px;height:44px;min-height:44px;flex:none}
@media(min-width:801px){.ab-board-wrap figcaption{margin-top:40px}}

@media(min-width:1101px){.ab h1{width:max-content;max-width:100%}.ab h1 mark{display:block;width:fit-content;margin-inline:auto}}