:root{--ink:#202124;--muted:#6e7075;--paper:#f5f5f7;--accent:#b5563a;--line:#dedee3;--landing-header-height:70px;--landing-page-height:calc(100svh - 70px);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);background:white;text-rendering:optimizeLegibility}
*{box-sizing:border-box}
body{margin:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:3px solid #a65037;outline-offset:5px}
button{border:0}
img{display:block;max-width:100%;height:auto}
figure,p,h1,h2,h3{margin:0}
p{line-height:1.6;text-wrap:pretty}
html{scroll-behavior:smooth;scroll-padding-top:var(--landing-header-height)}
.skip-link{position:fixed;top:-100px;z-index:100;background:white;padding:12px}
.skip-link:focus{top:10px}
#hdr{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;height:70px;padding:0 clamp(22px,4vw,72px);background:rgba(255,255,255,.9);backdrop-filter:blur(20px);border-bottom:1px solid #e8e8ec}
.brand{display:flex;align-items:center;gap:9px;font-size:20px;font-weight:600;letter-spacing:-.7px}
.brand img{width:29px;height:29px}
.navigation,.mast-nav{display:flex;align-items:center;gap:30px}
.mast-nav a{font-size:13px;color:#55565c}
.mast-nav a:hover{color:var(--ink)}
.nav-download{background:var(--ink);color:white;border-radius:30px;padding:9px 18px;font-size:14px}
.nav-download span{margin-left:8px}
.menu-toggle{display:none;background:transparent;padding:12px}
.menu-toggle span{display:block;width:18px;height:1.5px;background:var(--ink);margin:5px 0}
.screen{position:relative;min-height:var(--landing-page-height);padding:70px clamp(24px,6vw,110px);display:flex;flex-direction:column;justify-content:center;overflow:visible}
.eyebrow{font-size:13px;font-weight:650;letter-spacing:.05em;margin-bottom:19px;color:var(--muted)}
h1,h2{font-weight:600;line-height:1.14;letter-spacing:-.025em}
h1{font-size:clamp(62px,6.4vw,104px)}
h2{font-size:clamp(36px,4vw,62px)}
h2 span{color:var(--muted)}
.section-heading{text-align:center;max-width:920px;margin:0 auto 28px}
.section-heading>p:not(.eyebrow){margin-top:20px;font-size:17px;color:var(--muted)}
.actions{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap}
.button{display:inline-flex;justify-content:center;align-items:center;gap:16px;border-radius:30px;padding:15px 24px;font-size:14px;white-space:nowrap;font-weight:550;transition:transform .2s,background .2s}
.button:hover{transform:translateY(-2px)}
.primary{background:var(--accent);color:white}
.secondary{background:#ebe9e6;color:var(--ink)}
.dark{background:var(--ink);color:white}
.play-icon{font-size:13px}
.text-link{font-size:14px;color:var(--accent);white-space:nowrap}
.text-link:hover{text-decoration:underline;text-underline-offset:4px}
.text-link span{margin-left:10px}
.mobile-break{display:none}
.app-section{background:#f5f5f7;align-items:center;padding-top:50px;padding-bottom:48px}
.app-section .section-heading{margin-bottom:20px}
.app-section .section-heading h2{font-size:clamp(34px,3.6vw,56px)}
.app-section .section-heading>p:not(.eyebrow){font-size:15px;margin-top:16px}
.scene-selector{display:flex;padding:4px;border-radius:30px;background:#e6e6e9;gap:2px;margin-bottom:25px}
.scene-selector button{border-radius:24px;background:transparent;color:#74747b;padding:9px 23px;font-size:14px}
.scene-selector button[aria-pressed=true]{background:white;box-shadow:0 1px 7px #0000000c;color:var(--ink)}
.app-figure{width:min(860px,100%)}
.app-figure>a{display:block;overflow:hidden;border-radius:12px;box-shadow:0 16px 38px -18px #16131180;border:1px solid #3c3934}
.app-figure img{width:100%}
figcaption{display:flex;justify-content:space-between;gap:15px;margin-top:13px;font-size:13px;color:#85858c;line-height:1.7}
figcaption a{text-decoration:underline;text-underline-offset:3px}
.community-section{display:grid;grid-template-columns:1.05fr .85fr;align-items:center;gap:90px;background:#f2ebe4}
.community-word{display:flex;flex-direction:column;gap:10px;font-size:clamp(40px,5.9vw,86px);font-weight:640;letter-spacing:-.065em;line-height:1.3;color:#8c6c56}
.community-word .multiply{font-size:65px;line-height:1;font-weight:250;color:#b69379}
.community-copy h2{font-size:clamp(42px,4vw,64px)}
.community-copy h2 span{color:#967b69}
.community-copy>p:not(.eyebrow){font-size:16px;color:#857467;margin-top:22px}
.community-copy .button{margin-top:30px}
.community-copy .community-note{font-size:13px!important;color:#9b8c80!important;max-width:310px;margin-top:30px!important}
.download-section{text-align:center;align-items:center}
.download-logo{margin-bottom:30px}
.download-section .eyebrow{margin-bottom:12px}
.download-section>p:not(.eyebrow){font-size:16px;color:var(--muted);margin:24px 0}
.download-section .actions{margin:8px 0 0}
.download-section .download-note{font-size:13px!important;margin:20px 0 28px!important}
.download-section .text-link{font-size:14px}
footer{background:#f5f5f7;border-top:1px solid #e4e4e9;display:grid;grid-template-columns:1fr auto;padding:38px clamp(24px,6vw,110px) 25px;gap:30px;color:#86868d;font-size:13px}
.footer-brand{font-size:17px;font-weight:650;color:#53545a;letter-spacing:-.5px}
footer p{margin-top:7px}
.footer-links{display:flex;gap:25px;padding-top:8px}
.icp{grid-column:1/-1;justify-self:center;font-size:13px}
dialog{width:min(1100px,94vw);max-height:92svh;padding:0;border:1px solid #484747;border-radius:14px;background:#171717;color:white;box-shadow:0 40px 110px #0008}
dialog::backdrop{background:rgba(5,8,13,.83);backdrop-filter:blur(14px)}
.film-dialog-heading{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;font-size:14px;color:#bcbcbc}
.close-film{background:#303030;color:#ddd;font-size:14px;border-radius:18px;padding:8px 12px}
.close-film span{font-size:18px;margin-left:8px}
video{display:block;width:100%;max-height:78svh;background:#000;aspect-ratio:16/9}
.film-open{overflow:hidden}
#film-error{font-size:13px;padding:20px}
#film-error a{text-decoration:underline}
html.chapter-paging{scroll-behavior:auto;scroll-snap-type:none}
@media(min-width:1200px) and (max-height:900px){.screen{padding-top:40px;padding-bottom:40px}
.app-figure{width:min(700px,100%)}
.app-section .eyebrow{margin-bottom:10px}
.app-section .section-heading>p:not(.eyebrow){margin-top:10px}
.scene-selector{margin-bottom:18px}}
@media(max-width:1199px){.screen{padding-left:40px;padding-right:40px}
.community-section{gap:45px}
.app-section .section-heading h2{font-size:42px}}
@media(max-width:760px){#hdr{height:62px;padding:0 20px}
.brand{font-size:18px}
.brand img{width:25px;height:25px}
.navigation{gap:10px}
.nav-download{padding:8px 13px;font-size:13px}
.menu-toggle{display:block}
.mast-nav{position:absolute;top:calc(100% - 1px);left:0;right:0;display:none;flex-direction:column;gap:0;align-items:stretch;padding:10px 22px 20px;background:#fffffff5;border-bottom:1px solid var(--line)}
.mast-nav.is-open{display:flex}
.mast-nav a{padding:13px 5px;font-size:15px}
.screen{padding:48px 24px}
.eyebrow{font-size:13px;margin-bottom:16px}
.desktop-break{display:none}
h2{font-size:36px;line-height:1.18;letter-spacing:-.025em}
.section-heading{margin-bottom:30px}
.section-heading>p:not(.eyebrow){font-size:14px;line-height:1.7;margin-top:18px}
.mobile-break{display:block}
.app-section{padding:48px 20px}
.app-section .section-heading h2{font-size:34px}
.app-section h2 span{display:block}
.app-section .section-heading>p:not(.eyebrow){font-size:13px}
.scene-selector{margin-bottom:22px}
.scene-selector button{font-size:13px;padding:9px 20px}
.app-figure>a{border-radius:7px}
.app-figure figcaption{flex-direction:column;gap:4px;text-align:center;font-size:13px;margin-top:17px}
.community-section{display:flex;gap:35px;align-items:flex-start;justify-content:center}
.community-word{font-size:46px;gap:4px;line-height:1.12}
.community-word .multiply{font-size:38px;margin:9px 0}
.community-copy h2{font-size:38px}
.community-copy h2 br{display:none}
.community-copy .eyebrow{font-size:13px}
.community-copy>p:not(.eyebrow){font-size:13px;margin-top:16px}
.community-copy .button{font-size:14px;margin-top:22px}
.community-copy .community-note{font-size:13px!important;margin-top:22px!important}
.download-logo{width:62px;height:62px;margin-bottom:25px}
.download-section .eyebrow{font-size:13px}
.download-section h2{font-size:38px}
.download-section>p:not(.eyebrow){font-size:13px;margin:22px 0}
.download-section .actions{gap:12px}
.download-section .button{font-size:14px;padding:14px 20px;gap:12px}
footer{padding:28px 24px 22px;grid-template-columns:1fr;gap:20px}
.footer-links{flex-wrap:wrap;gap:22px;padding:0;font-size:13px}
.icp{margin-top:8px;font-size:13px}
.film-dialog-heading{font-size:13px;padding:10px}
.close-film{font-size:13px}
dialog{width:96vw;border-radius:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;scroll-snap-type:none!important}
.button{transition:none}}
.app-figure{width:min(800px,100%)}
@media(min-width:1200px) and (min-height:901px){.app-section{padding-top:42px;padding-bottom:42px}}
@media(min-width:1200px) and (max-height:900px){.app-figure{width:min(700px,100%)}}


/* T30: content-sized product composition; both original images stay in flow. */
:root {
  --type-caption: .8125rem;
  --type-ui: .875rem;
  --type-body: 1rem;
  --type-lead: 1.125rem;
  --type-title: clamp(2.125rem, 3.5vw, 3.5rem);
  --type-display: clamp(2.75rem, 5.1vw, 5rem);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1,h2,h3 { text-wrap:balance; }
h1 { font-size:var(--type-display); }
h2 { font-size:var(--type-title); }
h3 { font-size:1.375rem; line-height:1.3; }
.eyebrow { font-size:var(--type-caption); }
.button,.text-link,.mast-nav a { font-size:var(--type-ui); }
figcaption { font-size:var(--type-caption); color:#6e7075; }
.download-note { font-variant-numeric:tabular-nums; }
/* Native Blender top view, with the same orientation and framing as the original hero. */
.hero {
  align-items:center;
  justify-content:center;
  padding:38px 32px 42px;
  background:#f1f2f4;
  text-align:center;
}
/* Leave space for the header, caption, copy and actions at medium desktop heights. */
.hero-stage { width:min(980px,100%,calc((100svh - 280px) * 2200 / 1520)); display:grid; container-type:inline-size; }
.hero-copy,.hero-product { grid-area:1/1; }
.hero-copy { position:relative; z-index:1; align-self:start; width:100%; padding-top:0; }
.hero-copy .eyebrow { font-size:22px; color:#25272a; font-weight:600; letter-spacing:-.025em; margin:0 0 16px; }
.hero h1 { font-size:clamp(3.75rem,5.1vw,5rem); line-height:1.1; letter-spacing:-.035em; font-weight:600; }
.hero-product { margin:0; }
/* Balance the transparent space between the title, product and caption. */
.hero-image { width:100%; position:relative; top:5cqw; }
.hero-product figcaption { justify-content:center; align-items:center; flex-wrap:wrap; gap:8px 18px; margin:-35px 0 25px; position:relative; font-size:13px; line-height:1.7; }
.hero-product figcaption a { color:#a5482f; text-decoration:none; padding:8px 0; }
.hero-product figcaption a:hover { text-decoration:underline; text-underline-offset:4px; }
/* Native alpha lets the page background show through without fading the product. */
.hero-product img { width:100%; height:auto; max-width:100%; transform:none; filter:none; border-radius:0; }
.hero-description { max-width:780px; font-size:20px; font-weight:500; color:#54575c; line-height:1.6; margin:0; }
.hero-actions { display:flex; align-items:center; justify-content:center; gap:34px; margin-top:22px; }
.hero-actions a,.hero-actions button { display:inline-flex; align-items:center; gap:8px; padding:8px 0; font-size:17px; line-height:1.3; color:#a5482f; background:none; white-space:nowrap; }
.hero-actions a>span { font-size:25px; line-height:16px; }
.hero-actions a:hover,.hero-actions button:hover { text-decoration:underline; text-underline-offset:4px; }
.hero-actions svg { flex:none; }
/* Physical personalization follows software settings, using native part portraits. */
.diy-section { background:#fafafa; align-items:center; padding-block:48px; }
.diy-section .section-heading { margin-bottom:12px; }
.diy-section h2 span { display:inline-block; white-space:nowrap; }
.diy-section h2 .diy-title-start { color:var(--ink); }
.diy-parts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; width:min(1120px,100%); }
.diy-part { text-align:center; min-width:0; }
.diy-part img { width:100%; height:auto; }
.diy-part figcaption { display:block; margin:0; }
.diy-part h3 { font-size:clamp(19px,1.65vw,23px); font-weight:600; color:var(--ink); line-height:1.35; letter-spacing:-.015em; }
.diy-part p { font-size:16px; line-height:1.7; margin-top:12px; color:var(--muted); }
.diy-note { font-size:12px; line-height:1.7; color:var(--muted); text-align:center; margin-top:42px; }
@media(min-width:761px) and (max-height:850px) {
  .diy-section { padding-block:36px; }
}
@media(max-width:760px) {
  .diy-section { padding:40px 20px; }
  .diy-section .section-heading { margin-bottom:18px; }
  .diy-parts { grid-template-columns:1fr; gap:14px; width:min(440px,100%); }
  .diy-part { display:grid; grid-template-columns:38% minmax(0,1fr); align-items:center; gap:10px; text-align:left; }
  .diy-part h3 { font-size:18px; line-height:1.4; text-wrap:balance; }
  .diy-part p { font-size:14px; line-height:1.6; margin-top:6px; text-wrap:pretty; }
  .diy-part p br { display:none; }
  .diy-note { margin-top:30px; font-size:12px; }
}
/* One fixed photograph; locations and their use change together. */
.hardware-section { background:#fafafa; align-items:center; padding-block:36px; }
.hardware-section .section-heading { margin-bottom:24px; }
.hardware-section .eyebrow { margin-bottom:12px; }
.hardware-tabs { display:flex; gap:4px; padding:5px; border-radius:40px; background:#eaeaec; margin-bottom:14px; }
.hardware-tabs button { background:transparent; border-radius:28px; font-size:14px; line-height:24px; min-height:42px; padding:9px 25px; color:#6e7075; transition:background .2s,color .2s; }
.hardware-tabs button[aria-selected=true] { background:#202124; color:white; }
.hardware-tabs button:hover:not([aria-selected=true]) { color:#202124; }
.hardware-panels { display:grid; width:100%; }
.hardware-panel { grid-area:1/1; min-width:0; text-align:center; }
.hardware-panel[hidden] { display:block; visibility:hidden; pointer-events:none; }
.hardware-photo { width:min(940px,100%,max(400px,calc((var(--landing-page-height) - 450px) * 1800 / 1040))); margin-inline:auto; aspect-ratio:1800/900; }
.hardware-map { display:block; width:100%; height:auto; overflow:hidden; }
.hardware-annotation[hidden] { display:none; }
.hardware-annotation text { fill:#55585d; font-size:var(--annotation-font-size,43px); font-weight:500; letter-spacing:0; }
.hardware-mark,.hardware-leader,.hardware-point { fill:none; vector-effect:non-scaling-stroke; stroke-linecap:round; stroke-linejoin:round; }
.hardware-mark { stroke:#8a8d91; stroke-width:1.2px; }
.hardware-leader { stroke:#8a8d91; stroke-width:1px; }
.hardware-point { stroke:#a5482f; stroke-width:1.3px; }
.hardware-dot { fill:#55585d; stroke:white; stroke-width:1.2px; }
.hardware-caption { max-width:720px; margin:8px auto 0; }
.hardware-caption h3 { font-size:24px; line-height:1.3; font-weight:600; letter-spacing:-.02em; }
.hardware-caption>p:not(.hardware-note) { font-size:16px; color:#666970; margin-top:9px; line-height:1.65; }
.hardware-caption>.text-link { display:inline-flex; margin-top:15px; }
.hardware-caption .hardware-note { margin-top:13px; font-size:12px; color:#777a80; line-height:1.5; }
.hardware-fallback { margin-top:24px; font-size:14px; max-width:600px; }
.chapter-entered .section-heading,.chapter-entered .community-copy { animation:chapter-arrive .5s cubic-bezier(.2,.7,.2,1) both; }
@keyframes chapter-arrive { from { opacity:.25; transform:translateY(12px); } to { opacity:1; transform:none; } }
@media(max-width:760px) {
  .hardware-section { padding:42px 20px; }
  .hardware-section .section-heading { margin-bottom:24px; }
  .hardware-section h2 { font-size:36px; }
  .hardware-section h2 span { display:block; }
  .hardware-tabs { width:min(390px,100%); gap:0; padding:4px; margin-bottom:14px; }
  .hardware-tabs button { flex:1; padding:8px 7px; font-size:13px; white-space:nowrap; }
  .hardware-photo { width:min(560px,100%); }
  .hardware-annotation text { font-size:var(--annotation-font-size,72px); }
  .hardware-caption { max-width:460px; margin-top:12px; }
  .hardware-caption h3 { font-size:23px; }
  .hardware-caption>p:not(.hardware-note) { font-size:15px; }
  .hardware-caption>p:not(.hardware-note) br { display:none; }
  .hardware-caption>.text-link { white-space:normal; }
  .hardware-caption .hardware-note { max-width:27em; margin-inline:auto; }
}
@media(max-width:360px) {
  .hardware-annotation text { font-size:var(--annotation-font-size,84px); }
}
@media(min-width:1101px) and (max-height:850px) {
  .hero { padding-block:28px; }
  .hero-stage { width:min(690px,100%); }
  .hero h1 { font-size:clamp(3rem,7.5cqw,3.75rem); }
  .hero-copy .eyebrow { font-size:20px; margin-bottom:12px; }
  .hero-description { font-size:18px; }
  .hero-actions { margin-top:14px; }
}
@media(max-width:1100px) {
  .hero { padding:42px 28px 38px; }
  .hero-stage { width:min(850px,100%,calc((100svh - 320px) * 1100 / 760)); }
  .hero h1 { font-size:clamp(3rem,7.5cqw,4.75rem); }
  .hero-copy .eyebrow { font-size:20px; }
  .hero-description { max-width:650px; font-size:18px; }
}
@media(max-width:760px) {
  .hero { padding:42px 20px 40px; }
  /* Top view reaches higher in the source frame. Give the title its own row
     at the same breakpoint as the compact navigation, with room for actions. */
  .hero-stage { display:flex; flex-direction:column; width:min(100%,max(280px,calc((100svh - 420px) * 1100 / 760))); }
  .hero h1 { font-size:clamp(2.75rem,11.5vw,3.75rem); }
  .hero-copy .eyebrow { font-size:18px; margin-bottom:14px; }
  .hero-product { margin:0; }
  .hero-image { top:0; }
  .hero-product figcaption { gap:2px 14px; margin:-8px 0 20px; font-size:12px; }
  .hero-description { max-width:23em; font-size:16px; line-height:1.65; }
  .hero-actions { gap:28px; margin-top:20px; }
  .hero-actions a,.hero-actions button { font-size:16px; }
}

/* Fit regular laptop chapters by sizing media, not clipping or reducing readable text. */
@media(min-width:821px) and (max-height:850px) {
  .app-section { padding-block:28px; }
  .app-section .section-heading { margin-bottom:14px; }
  .app-section .section-heading h2 { font-size:40px; }
  .app-section .eyebrow { margin-bottom:10px; }
  .app-section .section-heading>p:not(.eyebrow) { margin-top:12px; }
  .app-section .scene-selector { margin-bottom:18px; }
  .app-figure { width:min(700px,100%,calc((var(--landing-page-height) - 310px) * 1189 / 768)); }
}
@media(prefers-reduced-motion:reduce) {
  .chapter-entered .section-heading,.chapter-entered .community-copy { animation:none; }
  .hardware-tabs button { transition:none; }
}
