@font-face { font-family: "Loop Sans"; src: url("../fonts/lololoop-sans.5c9e01fa0d3d.woff2") format("woff2"); font-style: normal; font-weight: 100 900; font-display: swap; }
:root {
  --ink: #121a19;
  --muted: #60706d;
  --paper: #f2f3ef;
  --warm: #e8e4dc;
  --mist: #cad9db;
  --leaf: #738d7c;
  --line: rgba(18,26,25,.15);
  --dark: #172423;
  --radius: 1.25rem;
  --wide: min(1280px, calc(100vw - 80px));
  --serif: Iowan Old Style, Baskerville, Georgia, serif;
  --sans: "Loop Sans", "Noto Sans SC", "HarmonyOS Sans SC", sans-serif;
  --ease-out: cubic-bezier(.18,.76,.22,1);
  --four-loop-texture: url("../icons/lololoop-four-loop-pattern.e6bddf7f3f2f.svg");
  --four-loop-pattern-size: clamp(16rem, 22vw, 22rem);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--sans); font-size: 16px; line-height: 1.55; }
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { display: block; width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-weight: 400; letter-spacing: -.055em; line-height: .98; }
h1 { font-size: clamp(3.2rem, 7vw, 7.5rem); max-width: 11ch; }
h2 { font-size: clamp(2.25rem, 4.4vw, 4.9rem); max-width: 15ch; }
h3 { font-size: 1.25rem; font-weight: 500; letter-spacing: -.03em; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 100; transform: translateY(-150%); background: var(--ink); color: white; padding: .75rem 1rem; border-radius: .5rem; }
.skip-link:focus { transform: translateY(0); }
.site-header { height: 76px; width: 100%; padding: 0 40px; position: absolute; z-index: 10; color: #fff; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid rgba(255,255,255,.15); }
body:not([data-page="home"]) .site-header { position: relative; color: var(--ink); border-color: var(--line); }
.brand { display: inline-flex; align-items: center; width: fit-content; }
.brand .brand-wordmark { width: 92px; height: auto; object-fit: contain; filter: brightness(0) invert(1); }
body:not([data-page="home"]) .brand .brand-wordmark, .site-footer .brand .brand-wordmark { filter: none; }
.main-nav { display: flex; align-items: center; gap: clamp(.85rem, 2vw, 2.4rem); font-size: .77rem; letter-spacing: .05em; }
.main-nav a { opacity: .8; transition: opacity .2s ease; position: relative; }
.main-nav a:hover, .main-nav a:focus-visible, .main-nav a.is-active { opacity: 1; }
.main-nav a.is-active::after { content: ''; position: absolute; left: 0; right: 0; bottom: -.55rem; height: 1px; background: currentColor; }
.main-nav small { color: inherit; opacity: .55; font-size: .58rem; margin-left: .32rem; text-transform: uppercase; }
.header-actions { justify-self: end; display: flex; align-items: center; gap: .55rem; }
.language-switch, .theme-toggle { font-size: .7rem; letter-spacing: .12em; border: 1px solid currentColor; border-radius: 50%; width: 34px; height: 34px; display: grid; place-items: center; }
.theme-toggle { padding: 0; color: inherit; background: transparent; cursor: pointer; }
.theme-glyph::before { content: '☾'; display: block; font-size: 1.2rem; line-height: 1; transform: translateY(-1px); }
html[data-theme="dark"] .theme-glyph { position: relative; display: block; width: 15px; height: 15px; }
html[data-theme="dark"] .theme-glyph::before { content: ''; position: absolute; top: 3px; left: 3px; width: 7px; height: 7px; border: 1.25px solid currentColor; border-radius: 50%; transform: none; }
html[data-theme="dark"] .theme-glyph::after { content: ''; position: absolute; inset: 0; background: linear-gradient(currentColor, currentColor) center top / 1px 2px no-repeat, linear-gradient(currentColor, currentColor) center bottom / 1px 2px no-repeat, linear-gradient(90deg, currentColor, currentColor) left center / 2px 1px no-repeat, linear-gradient(90deg, currentColor, currentColor) right center / 2px 1px no-repeat; }
.menu-toggle { display: none; }
.hero { min-height: min(870px, 100svh); position: relative; display: flex; align-items: end; overflow: hidden; background: var(--dark); color: white; }
.hero-visual, .hero-visual picture, .hero-visual img, .hero-visual video { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-visual img, .hero-visual video { object-fit: cover; }
.hero-visual video { opacity: 0; transition: opacity .7s ease; }
.hero-visual.has-video video { opacity: 1; }
.hero-scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,20,18,.68), rgba(10,20,18,.17) 65%), linear-gradient(0deg, rgba(10,20,18,.4), transparent 45%); }
.hero-copy { position: relative; z-index: 2; width: var(--wide); margin: 0 auto clamp(5rem, 10vh, 8rem); }
.hero-copy h1 { margin-bottom: 1.45rem; }
.hero-copy > p:not(.eyebrow) { max-width: 35rem; color: rgba(255,255,255,.88); font-size: 1.1rem; }
.eyebrow { margin-bottom: 1.2rem; color: currentColor; font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.hero-note { position: absolute; z-index: 2; right: 40px; bottom: 2.1rem; writing-mode: vertical-rl; font-size: .65rem; letter-spacing: .08em; color: rgba(255,255,255,.7); }
.action-row { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.button { min-height: 47px; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .75rem 1.2rem; border: 1px solid transparent; border-radius: 100px; cursor: pointer; font-size: .78rem; font-weight: 600; letter-spacing: .03em; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-light { color: var(--ink); background: white; }
.button-quiet { color: inherit; background: transparent; border-color: currentColor; }
.button-dark { background: var(--dark); color: #fff; }
.button-outline { background: transparent; color: var(--ink); border-color: var(--ink); }
.icon-play { width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 7px solid currentColor; }
.layout-grid, .statement, .feature-pro, .collection-section, .comfort-band, .loop-system, .partner-strip, .page-intro, .catalogue-group, .product-hero, .product-section, .engineering, .craft-feature, .testing-grid, .partner-panel, .concept-callout, .intelligence-values, .boundary-grid, .current-boundary, .about-origin, .team-section, .privacy-list, .legal-note { width: var(--wide); margin-left: auto; margin-right: auto; }
.statement { display: grid; grid-template-columns: .3fr 1.4fr 1fr; align-items: center; gap: 3rem; padding: clamp(5rem, 12vw, 12rem) 0; }
.statement-mark { display: grid; place-items: center; }
.statement-mark img { width: clamp(72px, 8vw, 112px); height: auto; }
.statement p:last-child { color: var(--muted); max-width: 24rem; }
.feature-pro { display: grid; grid-template-columns: .92fr 1.08fr; min-height: 680px; background: #dce3de; }
.feature-copy { padding: clamp(2.5rem, 6vw, 7rem); display: flex; flex-direction: column; justify-content: center; }
.feature-copy > p:not(.eyebrow), .comfort-copy > p:not(.eyebrow), .craft-feature p, .testing-grid p, .concept-callout p, .boundary-grid p, .about-origin p, .privacy-list p, .legal-note p { max-width: 35rem; color: var(--muted); }
.feature-image, .feature-image .media-frame, .feature-image img { height: 100%; }
.media-frame { display: block; overflow: hidden; }
.feature-image img, .card-media img, .product-hero-image img, .design-image img, .craft-feature img, .testing-grid img { height: 100%; object-fit: cover; }
.feature-list { list-style: none; padding: 0; margin: 1.8rem 0; display: grid; gap: .65rem; }
.feature-list li { display: flex; align-items: center; gap: .7rem; font-size: .92rem; }
.icon-dot { width: .45rem; height: .45rem; border: 1px solid var(--leaf); border-radius: 50%; }
.collection-section { padding: clamp(6rem, 12vw, 11rem) 0; }
.section-heading, .system-head { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 2.4rem; }
.section-heading h2, .system-head h2 { margin-bottom: 0; }
.text-link { display: inline-flex; gap: .55rem; align-items: center; border-bottom: 1px solid currentColor; padding-bottom: .2rem; font-size: .79rem; font-weight: 600; white-space: nowrap; }
.text-link span { font-size: 1rem; }
.collection-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.product-card { background: #e5e4df; min-width: 0; }
.card-media { display: block; height: 400px; background: #d7dad5; overflow: hidden; }
.card-media img { height: 100%; object-fit: cover; transition: transform .55s cubic-bezier(.2,.75,.25,1); }
.product-card:hover .card-media img { transform: scale(1.04); }
.product-card-body { padding: 1.25rem 1.25rem 1.5rem; }
.product-card-body .eyebrow { color: var(--muted); margin-bottom: .6rem; }
.product-card h3, .product-card p { margin-bottom: .25rem; }
.product-card-body > p { color: var(--muted); font-size: .85rem; min-height: 2.8rem; }
.product-card .text-link { margin-top: 1rem; }
.comfort-band { display: grid; grid-template-columns: 1.2fr .8fr; background: var(--mist); }
.comfort-band > div:first-child { min-height: 620px; }
.comfort-band img { height: 100%; object-fit: cover; }
.comfort-copy { align-self: center; padding: clamp(2.5rem, 6vw, 7rem); }
.comfort-copy h2 { font-size: clamp(2.2rem, 4vw, 4.5rem); }
.loop-system { padding: clamp(6rem, 12vw, 11rem) 0; }
.status { display: inline-block; font-size: .58rem; font-weight: 500; padding: .25rem .45rem; border: 1px solid currentColor; border-radius: 99px; vertical-align: middle; letter-spacing: .08em; }
.system-orbit { min-height: 570px; position: relative; display: grid; place-items: center; background: #d9e2df; overflow: hidden; }
.system-orbit::before, .system-orbit::after { content: ''; position: absolute; border: 1px solid rgba(23,36,35,.18); border-radius: 50%; }
.system-orbit::before { width: min(78vw, 900px); height: min(78vw, 460px); }
.system-orbit::after { width: min(54vw, 640px); height: min(54vw, 320px); transform: rotate(-24deg); }
.orbit-core { z-index: 1; display: grid; place-items: center; gap: .4rem; width: 130px; height: 130px; border-radius: 50%; color: #fff; background: var(--dark); }
.orbit-core img { width: 40px; height: 40px; filter: brightness(0) invert(1); }
.orbit-core span { font-size: .85rem; letter-spacing: -.06em; }
.orbit-node { position: absolute; z-index: 2; width: 180px; }
.orbit-node span, .intelligence-values > article > span, .role-grid span { color: var(--leaf); font-size: .68rem; letter-spacing: .1em; }
.orbit-node h3 { margin: .45rem 0; }
.orbit-node p { margin: 0; color: var(--muted); font-size: .78rem; }
.node-1 { top: 16%; left: 12%; }.node-2 { top: 17%; right: 12%; }.node-3 { bottom: 14%; left: 19%; }.node-4 { bottom: 14%; right: 19%; }
.system-disclaimer { color: var(--muted); font-size: .75rem; margin: 1rem 0 0; }
.partner-strip { padding: 2.4rem 0; display: flex; align-items: center; justify-content: space-between; gap: 3rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.partner-strip p { margin: 0; max-width: 39rem; color: var(--muted); font-size: .8rem; }
.partner-names { display: flex; flex-wrap: wrap; gap: 1.3rem; align-items: center; font-weight: 700; letter-spacing: -.07em; font-size: 1.3rem; white-space: nowrap; }
.contact-block { color: #fff; background: var(--dark); padding: clamp(4rem, 10vw, 9rem) max(40px, calc((100vw - var(--wide))/2)); }
.contact-block h2 { max-width: 16ch; margin-bottom: 2rem; }
.page-intro { padding: clamp(5rem, 10vw, 9rem) 0 clamp(3rem, 7vw, 6rem); }
.page-intro h1 { margin-bottom: 1.8rem; }
.page-lead { max-width: 43rem; color: var(--muted); font-size: clamp(1rem, 1.6vw, 1.25rem); }
.catalogue-controls { width: var(--wide); margin: 0 auto 5rem; display: flex; gap: .6rem; }
.catalogue-controls a { padding: .45rem .8rem; border: 1px solid var(--line); border-radius: 99px; font-size: .78rem; }
.catalogue-group { margin-bottom: 6rem; scroll-margin-top: 2rem; }
.catalogue-grid { grid-template-columns: repeat(3, 1fr); }.catalogue-group:last-of-type .catalogue-grid { grid-template-columns: minmax(0, 1fr); max-width: calc((100% - 2rem)/3); }
.product-hero { display: grid; grid-template-columns: .82fr 1.18fr; min-height: 700px; background: #e2e0d9; }
.product-hero > div:first-child { padding: clamp(3rem, 7vw, 8rem); align-self: center; }.product-hero h1 { font-size: clamp(4rem, 9vw, 8.5rem); margin-bottom: .8rem; }.product-tagline { font-family: var(--serif); font-size: 1.5rem; }
.product-hero-image, .product-hero-image .media-frame { height: 100%; }.product-hero-image img { object-position: center; }
.anchor-nav { width: var(--wide); margin: 0 auto; padding: 1.3rem 0; display: flex; gap: 1.5rem; border-bottom: 1px solid var(--line); }.anchor-nav a { font-size: .78rem; font-weight: 600; }
.product-section { padding: clamp(5rem, 10vw, 9rem) 0; scroll-margin-top: 1rem; }.product-overview { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; }.feature-list.large { margin: 0; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--line); }.feature-list.large li { padding: 1rem 0; border-bottom: 1px solid var(--line); font-size: 1rem; }.feature-list.large li span { width: 2.4rem; color: var(--leaf); font-size: .7rem; }
.product-design { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(2rem, 8vw, 10rem); background: var(--warm); padding-left: max(40px, calc((100vw - var(--wide))/2)); padding-right: max(40px, calc((100vw - var(--wide))/2)); width: 100%; }.design-image { min-height: 570px; }.scene-pills { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.8rem; }.scene-pills span { font-size: .75rem; padding: .45rem .65rem; border: 1px solid var(--line); border-radius: 99px; }
.detail-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 4rem; }.detail-list { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); }.detail-list > div { display: flex; align-items: center; gap: .7rem; padding: 1.1rem 0; border-bottom: 1px solid var(--line); }.detail-list p { margin: 0; font-size: .88rem; }.icon-detail { display: block; width: .65rem; height: .65rem; border: 1px solid var(--leaf); transform: rotate(45deg); }
.engineering { padding: clamp(5rem, 10vw, 9rem) 0; }.engineering-head { margin-bottom: 2.5rem; }.engineering-stage { display: grid; grid-template-columns: 1.2fr .8fr; background: #202927; color: #fff; }.engineering-image { min-height: 620px; }.engineering-image img { height: 100%; object-fit: cover; mix-blend-mode: screen; }.engineering-parts { display: grid; grid-template-columns: 1fr 1fr; }.engineering-parts article { padding: 1.5rem; border-bottom: 1px solid rgba(255,255,255,.18); border-left: 1px solid rgba(255,255,255,.18); }.engineering-parts span { font-size: .7rem; color: #b9d5ca; }.engineering-parts h3 { font-size: 1rem; }.engineering-parts p { color: rgba(255,255,255,.68); font-size: .8rem; }
.craft-feature, .testing-grid { display: grid; grid-template-columns: 1.1fr .9fr; background: #dfe6e4; }.craft-feature > div:first-child, .testing-grid > div:last-child { min-height: 600px; }.craft-feature > div:last-child, .testing-grid > div:first-child { align-self: center; padding: clamp(2.5rem, 6vw, 7rem); }.testing-grid { margin-top: 5rem; background: var(--warm); grid-template-columns: .85fr 1.15fr; }.partner-panel { padding: clamp(5rem, 10vw, 9rem) 0; }.partner-panel h2 { margin-bottom: 1.4rem; }.partner-panel > p { max-width: 43rem; color: var(--muted); }.partner-names.large { margin-top: 3rem; font-size: clamp(1.5rem, 4vw, 4rem); gap: clamp(1rem, 5vw, 4rem); }
.concept-callout { display: grid; grid-template-columns: 1fr .85fr; gap: 4rem; padding: clamp(3rem, 8vw, 8rem); background: #dce6e3; }.camera-module { justify-self: end; align-self: center; width: 240px; aspect-ratio: 1; padding: 1.5rem; border-radius: 50%; display: flex; flex-direction: column; justify-content: space-between; color: white; background: radial-gradient(circle at 35% 30%, #5d7a77, #1b2928 65%); box-shadow: inset 0 0 0 14px rgba(255,255,255,.11); }.camera-module span { font-size: 3rem; line-height: 1; }.camera-module p { color: #fff; margin: 0; line-height: 1.15; letter-spacing: .08em; font-size: .8rem; }.camera-module small { font-size: .65rem; opacity: .7; }
.intelligence-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding: 0; }.intelligence-values article { padding: clamp(2rem, 4vw, 4rem); min-height: 330px; border-right: 1px solid var(--line); }.intelligence-values article:first-child { padding-left: 0; }.intelligence-values article:last-child { border-right: none; }.intelligence-values h2 { font-size: clamp(2rem, 3vw, 3.3rem); margin: 2rem 0 1rem; }.intelligence-values p { color: var(--muted); max-width: 20rem; }
.boundary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); margin-top: 6rem; }.boundary-grid > div { background: var(--paper); padding: clamp(2rem, 5vw, 5rem); }.boundary-grid h2 { font-size: clamp(2rem, 3vw, 3.4rem); }.current-boundary { padding: 1.4rem 0; border-bottom: 1px solid var(--line); }.current-boundary p { max-width: 48rem; margin: 0; color: var(--muted); font-size: .86rem; }
.about-origin { display: grid; grid-template-columns: 1.2fr .8fr; gap: 3rem; padding: clamp(2rem, 6vw, 6rem); background: var(--warm); }.origin-mark { align-self: center; justify-self: end; display: grid; gap: 1.2rem; place-items: center; }.origin-mark img { width: min(15vw, 180px); }.origin-mark span { font-family: var(--serif); font-size: 1.25rem; line-height: 1.1; text-align: center; }.team-section { padding: clamp(5rem, 10vw, 9rem) 0; }.team-section > p:not(.eyebrow) { color: var(--muted); max-width: 34rem; }.role-grid { margin-top: 2.8rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); }.role-grid article { min-height: 210px; padding: 1.5rem; background: var(--paper); }.role-grid h3 { margin-top: 2.5rem; }.role-grid p { color: var(--muted); font-size: .85rem; }
.privacy-list { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; padding: clamp(3rem, 7vw, 7rem) 0; }.privacy-list ul { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }.privacy-list li { display: flex; align-items: center; gap: .7rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }.icon-check { display: inline-block; width: .9rem; height: .5rem; border-left: 1px solid var(--leaf); border-bottom: 1px solid var(--leaf); transform: rotate(-45deg) translateY(-2px); }.legal-note { background: #dce6e3; padding: clamp(3rem, 7vw, 7rem); margin-bottom: 6rem; }
.site-footer { width: var(--wide); margin: 0 auto; padding: 3.2rem 0 2.5rem; display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 2rem; }.site-footer p, .footer-contact a { color: var(--muted); font-size: .78rem; }.footer-links, .footer-contact { display: flex; flex-direction: column; gap: .55rem; font-size: .82rem; }.footer-contact { align-items: end; text-align: right; }.footer-contact p { margin: .8rem 0 0; }
.film-modal { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 1.25rem; background: rgba(9,13,13,.82); }.film-modal[hidden] { display: none; }.film-dialog { position: relative; width: min(100%, 1080px); background: #101413; padding: 3rem 1.5rem 1.2rem; }.film-dialog video { display: block; width: 100%; max-height: 75svh; }.modal-close { position: absolute; top: .75rem; right: .75rem; color: #fff; background: transparent; border: none; font-size: 1.8rem; cursor: pointer; }.film-quality { display: flex; justify-content: end; gap: .5rem; margin-top: .75rem; }.film-quality button { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.5); border-radius: 99px; padding: .3rem .7rem; cursor: pointer; font-size: .72rem; }.film-quality button.is-selected { background: #fff; color: #101413; }
.reveal { opacity: 1; transform: none; transition: opacity .7s ease, transform .7s ease; }
:focus-visible { outline: 2px solid var(--leaf); outline-offset: 4px; }
@media (max-width: 900px) { :root { --wide: min(100% - 40px, 1280px); }.site-header { padding: 0 20px; grid-template-columns: 1fr auto auto; gap: 1rem; }.main-nav { position: fixed; inset: 76px 0 auto; padding: 1.2rem 20px 1.7rem; color: var(--ink); background: var(--paper); display: none; flex-direction: column; align-items: stretch; gap: 0; border-bottom: 1px solid var(--line); }.main-nav a { padding: .75rem 0; }.main-nav a.is-active::after { display: none; }.menu-open .main-nav { display: flex; }.menu-toggle { display: grid; gap: 4px; width: 30px; padding: 6px 0; background: transparent; border: 0; color: inherit; cursor: pointer; }.menu-toggle span:not(.visually-hidden) { width: 21px; height: 1px; background: currentColor; }.menu-open .menu-toggle span:nth-child(1) { transform: translateY(5px) rotate(45deg); }.menu-open .menu-toggle span:nth-child(2) { opacity: 0; }.menu-open .menu-toggle span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }.hero { min-height: 770px; }.hero-copy { margin-bottom: 6.5rem; }.hero-note { right: 20px; }.statement { grid-template-columns: .25fr 1fr; gap: 1.5rem; }.statement p:last-child { grid-column: 2; }.collection-grid { grid-template-columns: repeat(2, 1fr); }.catalogue-grid { grid-template-columns: repeat(2, 1fr); }.catalogue-group:last-of-type .catalogue-grid { max-width: calc((100% - 1rem)/2); }.card-media { height: 330px; }.comfort-band, .product-hero, .craft-feature, .testing-grid { grid-template-columns: 1fr; }.comfort-band > div:first-child, .craft-feature > div:first-child, .testing-grid > div:last-child { min-height: 480px; }.system-orbit { min-height: 650px; }.node-1 { top: 11%; left: 8%; }.node-2 { top: 11%; right: 7%; }.node-3 { bottom: 11%; left: 8%; }.node-4 { bottom: 11%; right: 7%; }.partner-strip { align-items: start; flex-direction: column; }.product-hero { min-height: auto; }.product-hero-image { min-height: 560px; }.product-overview, .product-design, .detail-section, .engineering-stage, .concept-callout, .about-origin, .privacy-list { grid-template-columns: 1fr; }.product-design { padding-left: 20px; padding-right: 20px; }.detail-section { gap: 2rem; }.engineering-image { min-height: 460px; }.engineering-parts { grid-template-columns: 1fr 1fr; }.intelligence-values { grid-template-columns: 1fr; }.intelligence-values article, .intelligence-values article:first-child { padding: 2rem 0; border-right: 0; border-bottom: 1px solid var(--line); min-height: 0; }.boundary-grid { grid-template-columns: 1fr; }.origin-mark { justify-self: start; grid-template-columns: auto auto; }.origin-mark img { width: 90px; }.role-grid { grid-template-columns: 1fr 1fr; }.site-footer { grid-template-columns: 1fr 1fr; }.site-footer > :first-child { grid-column: 1 / -1; }.footer-contact { align-items: start; text-align: left; } }
@media (max-width: 560px) { :root { --wide: min(100% - 32px, 1280px); } h1 { font-size: clamp(3.15rem, 16vw, 4.8rem); }.site-header { height: 65px; }.main-nav { inset: 65px 0 auto; }.brand .brand-wordmark { width: 80px; }.hero { min-height: 720px; }.hero-copy { margin-bottom: 5rem; }.hero-copy > p:not(.eyebrow) { font-size: .98rem; }.hero-note { display: none; }.statement { grid-template-columns: 1fr; gap: 1.25rem; }.statement p:last-child { grid-column: auto; }.statement-mark { font-size: 7rem; }.feature-pro { grid-template-columns: 1fr; }.feature-image { min-height: 470px; }.section-heading, .system-head { align-items: start; flex-direction: column; gap: 1.3rem; }.collection-grid, .catalogue-grid { grid-template-columns: 1fr; }.catalogue-group:last-of-type .catalogue-grid { max-width: 100%; }.card-media { height: 420px; }.comfort-band > div:first-child, .craft-feature > div:first-child, .testing-grid > div:last-child { min-height: 390px; }.system-orbit { min-height: 710px; }.system-orbit::before { width: 620px; height: 450px; }.orbit-node { width: 130px; }.orbit-node h3 { font-size: 1rem; }.orbit-node p { font-size: .68rem; }.node-1 { top: 9%; left: 8%; }.node-2 { top: 9%; right: 4%; }.node-3 { bottom: 9%; left: 8%; }.node-4 { bottom: 9%; right: 4%; }.orbit-core { width: 100px; height: 100px; }.partner-names { gap: 1rem; font-size: 1.1rem; white-space: normal; }.page-intro { padding-top: 4rem; }.product-hero > div:first-child { padding: 4rem 0 3rem; }.product-hero { background: transparent; }.product-hero-image { min-height: 430px; }.anchor-nav { overflow: auto; white-space: nowrap; }.product-overview { gap: 2.5rem; }.feature-list.large { grid-template-columns: 1fr; }.design-image { min-height: 420px; }.detail-list { grid-template-columns: 1fr; }.engineering-parts { grid-template-columns: 1fr; }.engineering-parts article { border-left: 0; }.concept-callout { padding: 2rem; gap: 2rem; }.camera-module { justify-self: start; width: 200px; }.role-grid { grid-template-columns: 1fr; }.site-footer { grid-template-columns: 1fr; }.footer-contact { grid-row: 3; }.action-row { align-items: stretch; flex-direction: column; }.button { width: 100%; }.contact-block { padding-left: 16px; padding-right: 16px; }.reveal { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.reveal { opacity: 1; transform: none; transition: none; }.product-card:hover .card-media img, .button:hover { transform: none; }.hero-visual video { display: none; } }

/* Precision layer: typography, brand lockup, and restrained motion. */
body { font-weight: 420; letter-spacing: -.008em; transition: opacity .22s ease, transform .22s var(--ease-out); }
body.is-leaving { opacity: 0; transform: translateY(-7px); pointer-events: none; }
p { text-wrap: pretty; }
h1, h2 { font-family: var(--sans); font-weight: 540; letter-spacing: -.045em; line-height: 1.08; text-wrap: balance; }
h1 { max-width: 14em; font-size: clamp(3.1rem, 6vw, 6.8rem); }
h2 { max-width: 18ch; font-size: clamp(2.2rem, 4vw, 4.45rem); }
:where(h1, h2, h3, p, li, small, .button, .text-link) { overflow-wrap: break-word; }
:lang(en) :where(h1, h2, h3) { hyphens: none; overflow-wrap: normal; text-wrap: balance; }
:lang(en) :where(p, li, small) { hyphens: none; overflow-wrap: normal; text-wrap: pretty; }
:lang(zh-CN) :where(h1, h2, h3, p, li, small) { line-break: strict; word-break: normal; overflow-wrap: normal; }
:lang(zh-CN) h1, :lang(zh-CN) h2, :lang(zh-CN) h3 { word-break: auto-phrase; }
:lang(zh-CN) h1, :lang(zh-CN) h2 { letter-spacing: -.055em; }
.page-intro { position: relative; padding-top: clamp(5.5rem, 9vw, 8.5rem); }
.page-intro::after { content: ""; position: absolute; left: 0; bottom: clamp(2.25rem, 5vw, 4.5rem); width: 3.5rem; height: 1px; background: var(--leaf); transform-origin: left; }
.page-intro h1 { max-width: 100%; margin-bottom: 2rem; font-size: clamp(3.15rem, 5.3vw, 5.6rem); }
.page-intro .page-lead { max-width: 48rem; line-height: 1.75; }
.hero-copy h1 { max-width: 12em; font-size: clamp(3.35rem, 6.6vw, 7.1rem); }
.hero-copy > p:not(.eyebrow) { line-height: 1.75; }
.section-heading h2, .system-head h2 { max-width: 18ch; }
.feature-copy h2, .comfort-copy h2 { max-width: 13ch; }
.product-tagline { font-family: var(--sans); font-weight: 520; letter-spacing: -.035em; }

.brand-lockup { gap: .62rem; min-width: max-content; }
.brand-lockup .brand-symbol { width: 25px; height: 25px; object-fit: contain; filter: brightness(0) invert(1); }
.brand-lockup .brand-divider { width: 1px; height: 17px; background: currentColor; opacity: .38; }
.brand-lockup .brand-wordmark { width: 84px; height: auto; }
body:not([data-page="home"]) .brand-lockup .brand-symbol, .site-footer .brand-lockup .brand-symbol { filter: none; }
.footer-brand { margin-bottom: .9rem; }

.motion-ready body { animation: page-arrive .72s var(--ease-out) both; }
.motion-ready .hero-copy > *, .motion-ready .page-intro > * { animation: intro-rise .76s var(--ease-out) both; }
.motion-ready .hero-copy > :nth-child(1), .motion-ready .page-intro > :nth-child(1) { animation-delay: .08s; }
.motion-ready .hero-copy > :nth-child(2), .motion-ready .page-intro > :nth-child(2) { animation-delay: .15s; }
.motion-ready .hero-copy > :nth-child(3), .motion-ready .page-intro > :nth-child(3) { animation-delay: .23s; }
.motion-ready .hero-copy > :nth-child(4) { animation-delay: .31s; }
.motion-ready .page-intro::after { animation: line-grow .85s .34s var(--ease-out) both; }
@keyframes page-arrive { from { opacity: 0; } to { opacity: 1; } }
@keyframes intro-rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes line-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.motion-ready .reveal:not(.is-visible) { opacity: 0; filter: blur(3px); transform: translateY(28px); transition: opacity .82s var(--ease-out), transform .82s var(--ease-out), filter .82s var(--ease-out); }
.motion-ready .reveal.is-visible { opacity: 1; filter: none; transform: translateY(0); }
.product-card { transition: transform .42s var(--ease-out), box-shadow .42s var(--ease-out), background .42s ease; }
.product-card:hover { z-index: 1; transform: translateY(-7px); background: #ebeae5; box-shadow: 0 24px 48px rgba(27, 42, 39, .12); }
.product-card-body { transition: padding .42s var(--ease-out); }
.product-card:hover .product-card-body { padding-left: 1.45rem; }
.card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 62%, rgba(18, 26, 25, .12)); opacity: 0; transition: opacity .42s ease; pointer-events: none; }
.card-media { position: relative; }
.product-card:hover .card-media::after { opacity: 1; }
.text-link { position: relative; border-bottom: 0; padding-bottom: .32rem; }
.text-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform-origin: right; transition: transform .34s var(--ease-out); }
.text-link:hover::after { transform: scaleX(.32); }
.text-link span { transition: transform .3s var(--ease-out); }
.text-link:hover span { transform: translate(3px, -3px); }
.button { position: relative; overflow: hidden; transition: transform .3s var(--ease-out), box-shadow .3s ease, background .3s ease, color .3s ease; }
.button:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(18, 26, 25, .16); }
.main-nav a { transition: opacity .25s ease, transform .25s var(--ease-out); }
.main-nav a:hover { transform: translateY(-1px); }
.language-switch, .theme-toggle { transition: transform .38s var(--ease-out), background .25s ease, color .25s ease; }
.language-switch:hover { transform: rotate(9deg); background: currentColor; color: var(--paper); }
.theme-toggle:hover { transform: rotate(15deg); background: color-mix(in srgb, currentColor 14%, transparent); }
.anchor-nav { position: sticky; top: 0; z-index: 8; background: color-mix(in srgb, var(--paper) 91%, transparent); backdrop-filter: blur(14px); }
.anchor-nav a { position: relative; padding: .25rem 0; transition: color .25s ease; }
.anchor-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 1px; background: var(--leaf); transition: right .3s var(--ease-out); }
.anchor-nav a:hover::after { right: 0; }

@media (max-width: 900px) {
  .page-intro h1 { font-size: clamp(3rem, 8.7vw, 5.2rem); }
  .brand-lockup .brand-symbol { width: 23px; height: 23px; }
  .brand-lockup .brand-wordmark { width: 78px; }
}
@media (max-width: 560px) {
  h1 { font-size: clamp(2.8rem, 13vw, 3.8rem); line-height: 1.09; }
  h2 { font-size: clamp(2.05rem, 10vw, 3rem); line-height: 1.12; }
  .page-intro h1 { font-size: clamp(2.75rem, 12vw, 3.55rem); line-height: 1.12; }
  .hero-copy h1 { max-width: 100%; font-size: clamp(2.55rem, 12vw, 3.3rem); line-height: 1.06; }
  .brand-lockup { gap: .48rem; }
  .brand-lockup .brand-symbol { width: 20px; height: 20px; }
  .brand-lockup .brand-divider { height: 14px; }
  .brand-lockup .brand-wordmark { width: 69px; }
  .product-card:hover { transform: none; box-shadow: none; }
  .anchor-nav { margin-left: 0; margin-right: 0; padding-left: 16px; padding-right: 16px; width: 100%; }
  .product-hero > * { min-width: 0; }
  .product-hero h1 { font-size: clamp(3rem, 18vw, 4rem); }
}
@media (max-width: 360px) {
  .page-intro h1 { font-size: clamp(2.35rem, 12vw, 2.75rem); }
}
@media (prefers-reduced-motion: reduce) {
  .motion-ready body, .motion-ready .hero-copy > *, .motion-ready .page-intro > *, .motion-ready .page-intro::after { animation: none; }
  body, body.is-leaving { opacity: 1; transform: none; transition: none; }
  .reveal, .reveal.is-visible { filter: none; transform: none; transition: none; }
  .product-card, .product-card:hover, .button, .button:hover, .language-switch, .language-switch:hover { transform: none; transition: none; }
}

/* Chinese is composed as editorial display type, not as condensed English display type. */
:lang(zh-CN) body { font-weight: 400; letter-spacing: .012em; line-height: 1.72; }
:lang(zh-CN) h1, :lang(zh-CN) h2, :lang(zh-CN) h3 {
  font-weight: 560;
  letter-spacing: -.03em;
  line-height: 1.18;
  text-wrap: pretty;
}
:lang(zh-CN) .page-intro h1 {
  max-width: 11em;
  font-size: clamp(3rem, 4.7vw, 5.2rem);
  line-height: 1.16;
}
:lang(zh-CN) .page-intro .page-lead {
  max-width: 38rem;
  font-size: clamp(1rem, 1.25vw, 1.16rem);
  line-height: 1.85;
  letter-spacing: .012em;
}
:lang(zh-CN) .hero-copy h1 { letter-spacing: -.04em; line-height: 1.1; }
:lang(zh-CN) .product-tagline { letter-spacing: -.018em; line-height: 1.42; }
:lang(zh-CN) .feature-copy > p:not(.eyebrow),
:lang(zh-CN) .comfort-copy > p:not(.eyebrow),
:lang(zh-CN) .statement p:last-child { line-height: 1.85; letter-spacing: .012em; }

@media (max-width: 900px) {
  :lang(zh-CN) .page-intro h1 { font-size: clamp(2.8rem, 7.2vw, 4.6rem); }
}

@media (max-width: 560px) {
  :lang(zh-CN) .page-intro { padding-top: 4.45rem; }
  :lang(zh-CN) .page-intro h1 { font-size: clamp(2.45rem, 10.6vw, 3.05rem); line-height: 1.2; margin-bottom: 1.45rem; }
  :lang(zh-CN) .page-intro .page-lead { font-size: 1rem; line-height: 1.82; }
  :lang(zh-CN) .hero-copy h1 { font-size: clamp(2.5rem, 11.4vw, 3.5rem); line-height: 1.12; }
  :lang(zh-CN) h2 { line-height: 1.22; }
}

html[data-theme="dark"] {
  --ink: #edf3ee;
  --muted: #a8b8b0;
  --paper: #121916;
  --warm: #202b27;
  --mist: #1b2926;
  --leaf: #a7c7b2;
  --line: rgba(237,243,238,.16);
  --dark: #08100e;
  color-scheme: dark;
}
html[data-theme="dark"] .feature-pro { background: #1b2a26; }
html[data-theme="dark"] .hero-visual { filter: brightness(.62) saturate(.72); }
html[data-theme="dark"] .hero-scrim { background: linear-gradient(90deg, rgba(4,12,10,.78), rgba(4,12,10,.38) 66%), linear-gradient(0deg, rgba(4,12,10,.58), rgba(4,12,10,.08) 52%); }
html[data-theme="dark"] .product-card { background: #1c2926; }
html[data-theme="dark"] .product-card:hover { background: #253631; box-shadow: 0 24px 48px rgba(0,0,0,.3); }
html[data-theme="dark"] .card-media { background: #263530; }
html[data-theme="dark"] .system-orbit { background: #1c2b27; }
html[data-theme="dark"] .product-hero { background: #202923; }
html[data-theme="dark"] .craft-feature { background: #1c2b27; }
html[data-theme="dark"] .testing-grid { background: #202b27; }
html[data-theme="dark"] .concept-callout,
html[data-theme="dark"] .legal-note { background: #1c2b27; }
html[data-theme="dark"] .camera-module { background: radial-gradient(circle at 35% 30%, #789987, #0d1815 65%); }
html[data-theme="dark"] .button-light { color: #0e1613; background: #edf3ee; }
html[data-theme="dark"] body:not([data-page="home"]) .brand .brand-wordmark,
html[data-theme="dark"] body:not([data-page="home"]) .brand .brand-symbol,
html[data-theme="dark"] .site-footer .brand .brand-wordmark,
html[data-theme="dark"] .site-footer .brand .brand-symbol,
html[data-theme="dark"] .statement-mark img,
html[data-theme="dark"] .origin-mark img { filter: brightness(0) invert(1); }
html[data-theme="dark"] .anchor-nav { background: color-mix(in srgb, var(--paper) 91%, transparent); }
html[data-theme="dark"] .film-dialog { background: #07100d; }
html[data-theme="dark"] .film-quality button.is-selected { color: #0d1613; background: #edf3ee; }
.hero-visual, .hero-scrim { transition: filter .55s var(--ease-out), background .55s ease; }

/* Six-screen homepage — a quiet field guide, not a product catalogue. */
body[data-page="home"] main { overflow: clip; }
.six-home { position: relative; background: var(--paper); }
.home-screen { position: relative; min-height: 100svh; }
.home-hero { display: grid; min-height: max(42rem, 100svh); color: #f4f8f3; background: #10251f; isolation: isolate; }
.home-hero-media, .home-hero-media picture, .home-hero-media img, .home-hero-media video { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-hero-media { z-index: -2; overflow: hidden; background: #1c312b; }
.home-hero-media picture, .home-hero-media video { object-fit: cover; }
.home-hero-media img, .home-hero-media video { object-fit: cover; object-position: center; }
.home-hero-media video { opacity: 0; transition: opacity .8s ease; }
.home-hero-media.has-video video { opacity: 1; }
.home-hero-scrim { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(7, 18, 15, .74), rgba(7, 18, 15, .18) 68%), linear-gradient(0deg, rgba(7, 18, 15, .5), transparent 55%); }
.home-hero-copy { align-self: end; width: min(49rem, calc(100% - 12vw)); margin: 0 0 clamp(7rem, 14vh, 10rem) 8vw; }
.home-hero-copy .eyebrow { color: #d4e9d9; }
.home-hero-copy h1 { max-width: 11ch; margin: .8rem 0 1.25rem; font-size: clamp(3.8rem, 7.5vw, 7.6rem); line-height: .98; letter-spacing: -.07em; }
.home-hero-copy p:not(.eyebrow) { max-width: 34rem; color: rgba(244,248,243,.84); font-size: clamp(1rem, 1.3vw, 1.22rem); line-height: 1.72; }
.home-hero-copy .button { margin-top: 1.7rem; }
@media (min-width: 761px) { .home-hero-copy { width: min(80rem, calc(100% - 12vw)); }.home-hero-copy h1 { max-width: none; font-size: clamp(3.55rem, 6.1vw, 6.85rem); white-space: nowrap; } }
.home-hero-note { position: absolute; right: 2.5rem; bottom: 2rem; font-size: .68rem; letter-spacing: .12em; opacity: .76; }
.section-kicker { display: flex; gap: .8rem; align-items: center; color: var(--muted); font: 600 .68rem/1 var(--font-sans); letter-spacing: .14em; }
.section-kicker span { color: var(--leaf); }
.materials-gallery { padding: clamp(5.5rem, 10vw, 10rem) max(7vw, 1.5rem); color: #15231e; background: #e9f1ec; }
.materials-head, .series-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, .42fr); gap: 4rem; align-items: end; margin: 2.4rem 0 3.5rem; }
.materials-head { grid-template-columns: minmax(0, 1fr); }
.materials-head h2, .series-head h2, .studio-copy h2, .museum-copy h2, .final-content h2 { margin: 0; font-size: clamp(3rem, 6.4vw, 7rem); line-height: .98; letter-spacing: -.07em; }
.materials-head > p { max-width: 26rem; margin: 0 0 .5rem; color: rgba(21,35,30,.7); line-height: 1.75; }
.materials-viewport { overflow: hidden; border-radius: 1.5rem; background: #dce7df; }
.materials-track { display: flex; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.material-slide { flex: 0 0 100%; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(18rem, .55fr); min-height: clamp(28rem, 50vw, 42rem); }
.material-image { position: relative; overflow: hidden; }
.material-image .media-frame { height: 100%; }
.material-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.8,.2,1); }
.material-slide.is-current .material-image img { transform: scale(1.045); }
.material-waterline { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.18) 48%, transparent 64%); transform: translateX(-120%); }
.material-slide.is-current .material-waterline { animation: material-waterline 4.8s .35s cubic-bezier(.2,.7,.2,1) both; }
@keyframes material-waterline { to { transform: translateX(120%); } }
.material-caption { display: flex; flex-direction: column; justify-content: end; padding: clamp(1.8rem, 4vw, 4rem); background: #d6e4d9; }
.material-caption > span { color: #6b9e7c; font-size: .75rem; letter-spacing: .12em; }
.material-caption h3 { margin: .7rem 0; font-size: clamp(2rem, 3vw, 3.5rem); letter-spacing: -.055em; }
.material-caption p { max-width: 20rem; margin: 0; color: rgba(21,35,30,.68); line-height: 1.72; }
.materials-controls { display: flex; gap: 1rem; align-items: center; justify-content: center; margin-top: 1.4rem; }
.materials-controls > button, .materials-pagination button { width: 2.5rem; height: 2.5rem; color: #20382d; border: 1px solid rgba(32,56,45,.22); border-radius: 50%; background: transparent; }
.materials-pagination { display: flex; gap: .55rem; }
.materials-pagination button { width: .48rem; height: .48rem; padding: 0; border: 0; background: rgba(32,56,45,.22); }
.materials-pagination button[aria-current="true"] { background: #477e5b; transform: scale(1.35); }
.series-stage { min-height: max(64rem, 115svh); padding: clamp(5.5rem, 10vw, 10rem) max(7vw, 1.5rem) clamp(8rem, 13vw, 12rem); overflow: visible; background: var(--paper); }
.series-head { grid-template-columns: minmax(0, 1fr) auto; }
.series-head .text-link { margin-bottom: .8rem; }
.series-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; padding-bottom: 3.8rem; overflow: visible; background: var(--line); }
.series-card { position: relative; min-width: 0; padding: 1.1rem 1.1rem 1.4rem; background: var(--warm); transform: translateY(calc((3 - var(--series-index)) * 1.2rem)); transition: transform .7s cubic-bezier(.2,.8,.2,1), background .4s ease; }
.series-card:hover { z-index: 1; background: color-mix(in srgb, var(--warm) 88%, var(--leaf)); transform: translateY(-.7rem); }
.series-media { display: block; aspect-ratio: .82; overflow: hidden; }
.series-media .media-frame, .series-media img { width: 100%; height: 100%; }
.series-media img { object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.series-card:hover .series-media img { transform: scale(1.07); }
.series-card > div { position: relative; padding: 1.1rem .35rem 0; }
.series-card span { color: var(--muted); font-size: .62rem; letter-spacing: .1em; }
.series-card h3 { margin: .55rem 0 .25rem; font-size: 1.55rem; letter-spacing: -.045em; }
.series-card p { margin: 0; color: var(--muted); font-size: .86rem; }
.series-card .series-concept { display: block; margin-top: .8rem; color: var(--leaf); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.series-arrow { position: absolute; right: 0; bottom: 0; display: grid; width: 2rem; aspect-ratio: 1; place-items: center; color: var(--ink); text-decoration: none; border: 1px solid var(--line); border-radius: 50%; transition: transform .3s ease; }
.series-card:hover .series-arrow { transform: rotate(45deg); }
.series-swipe-hint { display: none; }
.harness-studio { position: relative; isolation: isolate; padding: clamp(5.5rem, 10vw, 10rem) max(7vw, 1.5rem); overflow: hidden; color: #19251f; background: #d7e4db; }
.harness-studio::before { display: none; }
@keyframes brand-pattern-drift { to { background-position: 17.5rem 8.75rem; } }
.studio-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 7vw, 10rem); align-items: center; max-width: 1360px; margin: 2.5rem auto 0; }
.studio-copy h2 { max-width: 9ch; }
.studio-copy > p { max-width: 31rem; margin: 1.5rem 0 2.5rem; color: rgba(25,37,31,.68); line-height: 1.75; }
.colour-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem .9rem; margin-top: 2rem; }
.colour-choices button { display: grid; grid-template-columns: 1.7rem minmax(0, 1fr); gap: .7rem; align-items: center; min-height: 3.4rem; padding: .45rem .55rem; color: inherit; text-align: left; border: 0; border-radius: .75rem; background: transparent; opacity: .92; transition: opacity .25s ease, background .25s ease, transform .25s ease; }
.colour-choices button[hidden] { display: none; }
.colour-choices button:hover { opacity: 1; background: rgba(47,105,74,.07); }
.colour-choices button[aria-pressed="true"] { opacity: 1; background: rgba(47,105,74,.12); transform: translateY(-1px); }
.colour-choices button:disabled { opacity:.22; cursor:not-allowed; filter:grayscale(.82); }
.colour-choices i { width: 1.7rem; aspect-ratio: 1; border-radius: 50%; background: linear-gradient(135deg, var(--colour-a) 50%, var(--colour-b) 50%); }
.studio-product { position: relative; display: grid; min-height: min(52vw, 43rem); overflow: hidden; place-items: center; border: 1px solid rgba(41,76,57,.12); border-radius: clamp(1.5rem, 3vw, 3rem); background: radial-gradient(circle at 50% 48%, rgba(255,255,255,.76), rgba(241,247,241,.32) 48%, transparent 70%); }
.studio-product img { position: relative; z-index: 1; display: block; width: min(86%, 36rem); height: auto; aspect-ratio: 1; object-fit: contain; filter: drop-shadow(0 2rem 2rem rgba(21,47,35,.16)); transition: opacity .22s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.studio-product img.is-switching { opacity: .1; transform: scale(.96); }
.studio-orbit { position: absolute; width: 78%; aspect-ratio: 1; border: 1px solid rgba(51,105,72,.25); border-radius: 50%; box-shadow: 0 0 0 3rem rgba(239,249,240,.2), 0 0 0 8rem rgba(239,249,240,.11); animation: studio-orbit 12s linear infinite; }
@keyframes studio-orbit { to { transform: rotate(1turn); } }
.studio-readout { position: absolute; z-index: 2; bottom: 4%; right: 1%; padding: .85rem 1rem; color: #f5fbf5; background: rgba(30,64,46,.8); backdrop-filter: blur(13px); }
.studio-readout p { margin: 0 0 .2rem; font-size: 1rem; }
.studio-readout span { font-size: .63rem; letter-spacing: .06em; }
.future-museum { min-height:350vh; color:#173529; background:#dceae0; transition:color .65s ease,background-color .65s ease; }
.museum-sticky { position: sticky; top: 0; display: grid; min-height: 100svh; grid-template-columns: minmax(20rem,.68fr) minmax(34rem,1.32fr); align-items: center; overflow: hidden; isolation: isolate; }
.museum-atmosphere { position: absolute; z-index: -2; inset: -12%; background:radial-gradient(circle at calc(28% + var(--museum-progress,0) * 40%) 32%,rgba(132,204,153,.3),transparent 24%),radial-gradient(circle at 82% 72%,rgba(162,198,173,.32),transparent 30%),linear-gradient(135deg,#edf5ef,#c9dfcf 55%,#e8f1e9); transform: scale(1.08) rotate(calc(var(--museum-progress,0) * 3deg)); transition: background .8s ease; }
.museum-copy { position: relative; z-index: 5; width: min(35rem, calc(100% - 2rem)); margin: 0 0 8rem max(7vw,1.5rem); }
.museum-copy .eyebrow { color:#527b62; }.museum-copy .status { padding:.2rem .4rem; color:#416b50; border:1px solid rgba(51,94,66,.32); border-radius:99rem; font-size:.58rem; }
.museum-copy h2 { max-width:10ch; margin:1rem 0 1.4rem; }.museum-copy > p:last-child { max-width:30rem; color:rgba(24,54,42,.7); line-height:1.75; }
.museum-window { position:relative; z-index:2; width:min(58vw,64rem); aspect-ratio:16/10; overflow:hidden; border:1px solid rgba(220,249,225,.24); border-radius:clamp(1.4rem,2.4vw,2.8rem); background:#153c2d; box-shadow:0 3rem 8rem rgba(0,0,0,.36); transform:translate3d(0,calc((.5 - var(--museum-progress,0)) * 2rem),0); }
.museum-panel { position:absolute; inset:0; overflow:hidden; opacity:0; clip-path:inset(100% 0 0 0 round 2.2rem); transition:clip-path .9s cubic-bezier(.2,.75,.18,1),opacity .65s ease; }
.museum-panel.is-active { z-index:2; opacity:1; clip-path:inset(0 0 0 0 round 2.2rem); }
.museum-panel { background:#09251b; }
.museum-panel::after { position:absolute; z-index:2; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(2,19,13,.06),transparent 52%,rgba(1,12,8,.34)); content:""; }
.museum-panel-index { position:absolute; z-index:3; top:1.5rem; left:1.7rem; color:rgba(255,255,255,.7); font-size:.66rem; letter-spacing:.18em; }
.museum-panel > p { position:absolute; z-index:3; top:1.25rem; right:1.7rem; margin:0; color:rgba(255,255,255,.75); font-size:.72rem; letter-spacing:.12em; }
.museum-panel > strong { position:absolute; z-index:3; left:-.035em; bottom:-.13em; color:rgba(241,255,242,.13); font-size:clamp(8rem,14vw,16rem); line-height:.8; letter-spacing:-.09em; text-transform:uppercase; }
.museum-artwork { position:absolute; z-index:1; inset:0; overflow:hidden; transform:scale(1.025) translate3d(calc((var(--museum-progress,0) - .5) * 1.5rem),0,0); transition:transform 1.2s cubic-bezier(.2,.75,.18,1); }.museum-artwork .media-frame,.museum-artwork img { display:block; width:100%; height:100%; }.museum-artwork img { object-fit:cover; object-position:center; filter:saturate(.94) contrast(1.03); }
.museum-scanline { position:absolute; z-index:4; top:-15%; left:0; width:100%; height:14%; pointer-events:none; background:linear-gradient(180deg,transparent,rgba(220,255,226,.22),transparent); animation:museum-scan 5.5s ease-in-out infinite; }.museum-window-label { position:absolute; z-index:6; right:1.4rem; bottom:1rem; margin:0; padding:.34rem .62rem; max-width:calc(100% - 2.4rem); overflow:hidden; color:rgba(242,255,243,.82); font-size:.55rem; letter-spacing:.16em; line-height:1; text-overflow:ellipsis; white-space:nowrap; background:rgba(5,25,18,.58); border:1px solid rgba(220,249,225,.18); border-radius:99rem; backdrop-filter:blur(8px); pointer-events:none; }
@keyframes museum-scan { 55%,100% { transform:translateY(780%); opacity:0; } }
.museum-nodes { position:absolute; z-index:5; left:max(7vw,1.5rem); bottom:5.2rem; display:grid; width:min(31rem,36vw); grid-template-columns:repeat(4,1fr); gap:1px; }.museum-nodes button { display:grid; min-width:0; padding:.7rem .55rem; color:rgba(235,248,235,.52); text-align:left; border:0; border-top:1px solid rgba(235,248,235,.2); background:transparent; transition:color .35s ease,background .35s ease,transform .35s ease; }.museum-nodes button span { color:#92cba0; font-size:.58rem; }.museum-nodes button strong { margin:.25rem 0; font-size:.78rem; }.museum-nodes button small { overflow:hidden; font-size:.58rem; text-overflow:ellipsis; white-space:nowrap; }.museum-nodes button.is-active,.museum-nodes button:hover,.museum-nodes button:focus-visible,.museum-nodes button[aria-expanded="true"] { color:#fff; background:rgba(235,248,235,.11); transform:translateY(-.35rem); outline:1px solid rgba(218,255,226,.35); outline-offset:-1px; }
.museum-detail { position:absolute; z-index:8; right:max(7vw,1.5rem); bottom:2rem; width:min(28rem,38vw); padding:1.2rem 3.6rem 1.25rem 1.35rem; color:#eff9f0; border:1px solid rgba(220,249,225,.25); border-radius:1.2rem; background:rgba(10,38,27,.72); box-shadow:0 1.5rem 4rem rgba(0,0,0,.28); backdrop-filter:blur(18px); animation:museum-detail-in .45s cubic-bezier(.2,.75,.18,1) both; }.museum-detail[hidden] { display:none; }.museum-detail-close { position:absolute; top:.75rem; right:.75rem; display:grid; width:2.2rem; aspect-ratio:1; place-items:center; color:#eff9f0; border:1px solid rgba(235,248,235,.24); border-radius:50%; background:rgba(255,255,255,.06); font-size:1.2rem; }.museum-detail > span { color:#9dccaa; font-size:.56rem; letter-spacing:.14em; }.museum-detail h3 { margin:.45rem 0; font-size:clamp(1.6rem,3vw,2.6rem); letter-spacing:-.05em; }.museum-detail p { margin:0 0 1rem; color:rgba(239,249,240,.76); line-height:1.65; }.museum-detail a { color:#fff; text-decoration:none; border-bottom:1px solid rgba(239,249,240,.4); }.museum-detail a span { margin-left:1rem; }@keyframes museum-detail-in { from { opacity:0; transform:translateY(1rem) scale(.98); } }
[data-overlay-open="true"] .museum-scanline { animation-play-state:paused; }
.museum-link { position:absolute; z-index:5; bottom:2rem; left:max(7vw,1.5rem); padding-bottom:.4rem; color:#e9f5e9; text-decoration:none; border-bottom:1px solid rgba(233,245,233,.45); }.museum-link span { margin-left:1.3rem; }
.future-museum .museum-nodes button { color:rgba(26,63,46,.58); border-top-color:rgba(35,79,54,.2); }.future-museum .museum-nodes button span { color:#477e59; }.future-museum .museum-nodes button.is-active,.future-museum .museum-nodes button:hover,.future-museum .museum-nodes button:focus-visible,.future-museum .museum-nodes button[aria-expanded="true"] { color:#173529; background:rgba(49,104,67,.1); outline-color:rgba(38,93,58,.28); }.future-museum .museum-link { color:#214e37; border-bottom-color:rgba(33,78,55,.4); }
html[data-theme="dark"] .future-museum { color:#edf7ed; background:#071914; }html[data-theme="dark"] .museum-atmosphere { background:radial-gradient(circle at calc(28% + var(--museum-progress,0) * 40%) 32%,rgba(124,214,155,.25),transparent 24%),radial-gradient(circle at 82% 72%,rgba(77,134,113,.25),transparent 30%),linear-gradient(135deg,#061612,#10382a 55%,#06130f); }html[data-theme="dark"] .museum-copy .eyebrow { color:#bedbc4; }html[data-theme="dark"] .museum-copy .status { color:#d7ead9; border-color:rgba(215,234,217,.35); }html[data-theme="dark"] .museum-copy > p:last-child { color:rgba(233,245,233,.72); }html[data-theme="dark"] .future-museum .museum-nodes button { color:rgba(235,248,235,.52); border-top-color:rgba(235,248,235,.2); }html[data-theme="dark"] .future-museum .museum-nodes button span { color:#92cba0; }html[data-theme="dark"] .future-museum .museum-nodes button.is-active,html[data-theme="dark"] .future-museum .museum-nodes button:hover,html[data-theme="dark"] .future-museum .museum-nodes button:focus-visible,html[data-theme="dark"] .future-museum .museum-nodes button[aria-expanded="true"] { color:#fff; background:rgba(235,248,235,.11); outline-color:rgba(218,255,226,.35); }html[data-theme="dark"] .future-museum .museum-link { color:#e9f5e9; border-bottom-color:rgba(233,245,233,.45); }
.home-final { display: grid; min-height: 100svh; place-items: center; overflow: hidden; color: #eff9ef; text-align: center; background: radial-gradient(circle at 50% 65%, rgba(150,214,164,.2), transparent 30%), linear-gradient(180deg, #1e4635, #10271e); }.home-final::before { position: absolute; inset: 0; background-image: var(--four-loop-texture); background-position: 50% 50%; background-size: var(--four-loop-pattern-size); background-repeat: repeat; animation: brand-pattern-drift 58s linear infinite; content: ""; }.final-content, .final-meta { position: relative; z-index: 2; }.final-content img { width: 2.8rem; filter: brightness(0) invert(1); }.final-content .eyebrow { margin-top: 1.25rem; color: #c0dec8; }.final-content h2 { margin: .9rem 0 2rem; }.final-meta { position: absolute; bottom: 2rem; color: rgba(239,249,239,.48); font-size: .65rem; letter-spacing: .12em; }.final-trail { position: absolute; inset: 0; pointer-events: none; }.final-trail svg { width: 100%; height: 100%; }.final-trail path { fill: none; stroke: rgba(194,235,201,.3); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-dasharray: 4 10; animation: trail-drift 18s linear infinite; }.final-trail span { position: absolute; top: 52%; left: 50%; width: .55rem; aspect-ratio: 1; border-radius: 50%; background: #e5ffe7; box-shadow: 0 0 1rem #b9f5c2; animation: trail-dot 8s ease-in-out infinite; }@keyframes trail-drift { to { stroke-dashoffset: -180; } }@keyframes trail-dot { 50% { transform: translate(27rem, -4rem); } }
.home-progress { position: fixed; z-index: 9; top: 50%; right: 1.1rem; display: grid; gap: .75rem; transform: translateY(-50%); }.home-progress a { display: flex; gap: .35rem; align-items: center; color: var(--muted); font-size: .58rem; text-decoration: none; }.home-progress i { width: .36rem; height: .36rem; border: 1px solid currentColor; border-radius: 50%; }.home-progress a.is-active { color: var(--leaf); }.home-progress a.is-active i { background: currentColor; box-shadow: 0 0 .6rem currentColor; }
.language-landing, .not-found { position: relative; display: grid; min-height: 100svh; overflow: hidden; place-items: center; color: #183228; background: #e7f0e8; }.landing-haze { position: absolute; width: 70vw; aspect-ratio: 1; border: 1px solid rgba(68,120,86,.2); border-radius: 50%; background: radial-gradient(circle, rgba(186,224,194,.72), transparent 67%); animation: landing-haze 13s ease-in-out infinite; }.landing-brand, .not-found-brand { position: absolute; top: 2rem; left: 2rem; display: flex; gap: .65rem; align-items: center; }.landing-brand img:first-child, .not-found-brand img:first-child { width: 1.7rem; }.landing-brand img:last-child, .not-found-brand img:last-child { width: 6.3rem; }.landing-copy { position: relative; z-index: 1; text-align: center; }.landing-copy p { font-size: .65rem; letter-spacing: .16em; }.landing-copy h1 { margin: 1rem 0 .45rem; font-size: clamp(3rem, 8vw, 7rem); letter-spacing: -.08em; }.landing-copy span { color: #5a7868; }.landing-actions { position: relative; z-index: 1; display: flex; gap: 1px; overflow: hidden; border: 1px solid rgba(38,82,58,.25); }.landing-actions a { display: grid; gap: .25rem; min-width: 9rem; padding: 1rem 1.2rem; color: inherit; text-decoration: none; background: rgba(255,255,255,.25); transition: background .35s ease, color .35s ease; }.landing-actions a:hover { color: #f4fbf4; background: #2d6949; }.landing-actions small { color: inherit; opacity: .65; }@keyframes landing-haze { 50% { transform: scale(1.12) translate(2%, -4%); } }
.not-found { align-content: center; gap: 2rem; }.not-found > div:last-child { position: relative; z-index: 1; text-align: center; }.not-found > div:last-child > p { margin: 0; color: #6a9478; font-size: .72rem; letter-spacing: .16em; }.not-found h1 { max-width: 15ch; margin: .7rem auto 1.8rem; font-size: clamp(2.3rem, 6vw, 5rem); letter-spacing: -.07em; }.not-found-language { display: block; margin: 1.25rem auto 0; color: #426955; text-decoration: underline; border: 0; background: transparent; }.not-found-scene { position: absolute; top: 38%; left: 0; width: 100%; }.not-found-scene path { fill: none; stroke: rgba(51,111,77,.35); stroke-width: 1.5; }.not-found-scene g { animation: not-found-walk 4s cubic-bezier(.4,0,.2,1) forwards; }.not-found-scene g path { fill: #5b9b6d; stroke: none; }.not-found-scene g circle { fill: #123d29; }@keyframes not-found-walk { 0% { transform: translate(-50px, 0); } 72% { transform: translate(560px, -18px); } 100% { transform: translate(540px, -18px) rotate(-12deg); } }
html[data-theme="dark"] .materials-gallery { color: #e5f1e6; background: #182c24; }.home-hero-media { filter: brightness(.88); }html[data-theme="dark"] .home-hero-media { filter: brightness(.53) saturate(.75); }html[data-theme="dark"] .material-caption { color: #15231e; }html[data-theme="dark"] .harness-studio { color: #e6f1e7; background: #20372c; }html[data-theme="dark"] .harness-studio::before { background: #d3ebd8; opacity: .06; }html[data-theme="dark"] .materials-head > p, html[data-theme="dark"] .studio-copy > p { color: rgba(239,248,240,.78); }html[data-theme="dark"] .colour-choices button { color: #e6f1e7; }html[data-theme="dark"] .colour-choices button[aria-pressed="true"] { background: rgba(148,205,160,.18); }html[data-theme="dark"] .language-landing, html[data-theme="dark"] .not-found { color: #e4f0e5; background: #11271d; }html[data-theme="dark"] .landing-copy span, html[data-theme="dark"] .not-found-language { color: #b0d3b8; }
html[data-effects="reduced"] .studio-orbit, html[data-effects="reduced"] .final-trail path, html[data-effects="reduced"] .material-waterline, html[data-effects="reduced"] .museum-scanline, html[data-effects="reduced"] .harness-studio::before { animation: none; }html[data-effects="reduced"] .studio-orbit { box-shadow: 0 0 0 1.5rem rgba(239,249,240,.12); }
@media (prefers-reduced-motion: reduce) { .home-hero-media video { display: block; }.six-home .reveal, .six-home .reveal.is-visible { opacity: 1; transform: none; }.six-home .material-waterline, .six-home .studio-orbit, .six-home .final-trail path, .six-home .museum-scanline { animation: none; } }
@media (prefers-reduced-motion: reduce) { .harness-studio::before, .contact-block::after { animation: none; } }
@media (max-width: 760px) { .home-hero { min-height: 100svh; }.home-hero-media img, .home-hero-media video { object-position: 56% center; }.home-hero-copy { width: calc(100% - 3rem); margin: 0 1.5rem 7.7rem; }.home-hero-copy h1 { max-width: 10ch; font-size: clamp(3.05rem, 14vw, 4.8rem); }.home-hero-copy p:not(.eyebrow) { max-width: 23rem; font-size: .96rem; }.home-hero-note { right: 1.5rem; bottom: 1.65rem; }.materials-gallery, .series-stage, .harness-studio { min-height: auto; padding: 5rem 1.25rem; }.series-stage { padding-bottom: 6.5rem; }.materials-head, .series-head { grid-template-columns: 1fr; gap: 1.15rem; margin: 1.9rem 0 2.2rem; }.materials-head h2, .series-head h2, .studio-copy h2, .museum-copy h2, .final-content h2 { font-size: clamp(2.85rem, 13vw, 4.5rem); }.materials-head > p { margin: 0; }.materials-viewport { margin-right: -1.25rem; border-radius: 1.15rem 0 0 1.15rem; }.material-slide { grid-template-columns: 1fr; min-height: 0; }.material-image { aspect-ratio: 1.05; }.material-caption { min-height: 13rem; padding: 1.5rem; }.materials-controls { justify-content: flex-start; }.series-cards { display: flex; margin-right: -1.25rem; padding-bottom: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-inline:contain; touch-action:pan-x pan-y; }.series-card { flex: 0 0 min(75vw, 18rem); scroll-snap-align: start; transform: none; }.series-card:hover { transform: none; }.studio-grid { grid-template-columns: 1fr; gap: 2rem; }.studio-product { min-height: 92vw; margin: 0; }.studio-product img { width: 88%; }.studio-readout { right: .75rem; bottom: .75rem; max-width: calc(100% - 1.5rem); }.museum-sticky { display: block; min-height: 100svh; padding-top: 1px; }.museum-copy { width: calc(100% - 2.5rem); margin: 0; padding: 5.2rem 1.25rem 0; }.museum-copy h2 { margin:.7rem 0 1rem; font-size:clamp(2.65rem,12vw,4rem); }.museum-copy > p:last-child { margin-bottom:0; font-size: .82rem; line-height:1.55; }.museum-window { width:calc(100% - 2.5rem); margin:1rem auto 0; aspect-ratio:1.12; border-radius:1.4rem; }.museum-panel { clip-path:inset(100% 0 0 0 round 1.3rem); }.museum-panel.is-active { clip-path:inset(0 0 0 0 round 1.3rem); }.museum-panel > strong { font-size:clamp(5.8rem,25vw,8rem); }.museum-artwork { inset:0; }.museum-panel-index { top:1rem; left:1rem; }.museum-panel > p { top:.8rem; right:1rem; }.museum-window-label { display:none; }.museum-nodes { left:1.25rem; bottom:4.5rem; width:calc(100% - 2.5rem); grid-template-columns:repeat(4,1fr); gap:1px; }.museum-nodes button { padding:.42rem .3rem; }.museum-nodes button small { display: none; }.museum-detail { position:fixed; right:0; bottom:0; left:0; width:auto; min-height:min(44svh,24rem); padding:1.4rem 4rem max(2rem,env(safe-area-inset-bottom)) 1.4rem; border-radius:1.5rem 1.5rem 0 0; background:rgba(7,31,22,.92); }.museum-detail h3 { font-size:2.5rem; }.museum-link { bottom:1.4rem; left:1.25rem; }.future-museum { min-height:250vh; }.home-progress { top: auto; right: 50%; bottom: calc(.75rem + env(safe-area-inset-bottom)); display: flex; transform: translateX(50%); padding: .5rem .65rem; border-radius: 99rem; background: color-mix(in srgb, var(--paper) 75%, transparent); backdrop-filter: blur(10px); }.home-progress a span { display: none; }.home-progress i { width: .4rem; height: .4rem; }html[data-overlay-open="true"] .home-progress { opacity:0; pointer-events:none; }.final-trail span { animation-name: none; }.landing-actions { width: calc(100% - 2.5rem); }.landing-actions a { flex: 1; min-width: 0; }.landing-brand, .not-found-brand { top: 1.3rem; left: 1.25rem; }.not-found-scene { top: 33%; } }

/* Component density stays compact on every narrow viewport; slide navigation remains height-gated below. */
@media (max-width: 760px) {
  .home-hero-media { --mobile-film-top: clamp(4.5rem, 10svh, 6.5rem); --mobile-film-height: min(56.25vw, 27rem); background: radial-gradient(circle at 78% 23%, rgba(113,153,130,.38), transparent 34%), radial-gradient(circle at 18% 44%, rgba(82,121,102,.24), transparent 31%), linear-gradient(180deg, #1b352b 0%, #10251f 58%, #081713 100%); }
  .home-hero-media::before { position: absolute; z-index: 0; inset: 0; background: linear-gradient(125deg, rgba(162,197,174,.13), transparent 42%), radial-gradient(ellipse at 50% 32%, rgba(226,238,228,.1), transparent 47%); content: ""; }
  .home-hero-media picture, .home-hero-media video { z-index: 1; top: var(--mobile-film-top); bottom: auto; height: var(--mobile-film-height); aspect-ratio: 16 / 9; object-fit: contain; object-position: center; -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 70%, rgba(0,0,0,.92) 78%, rgba(0,0,0,.48) 90%, transparent 100%); mask-image: linear-gradient(to bottom, #000 0%, #000 70%, rgba(0,0,0,.92) 78%, rgba(0,0,0,.48) 90%, transparent 100%); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
  .home-hero-media picture img, .home-hero-media video { object-fit: contain; object-position: center; }
  .home-hero-media::after { position: absolute; z-index: 2; top: calc(var(--mobile-film-top) - 1px); right: 0; left: 0; height: calc(var(--mobile-film-height) + clamp(3.25rem, 14vw, 4.5rem)); pointer-events: none; background: linear-gradient(90deg, rgba(16,37,31,.78), transparent 7%, transparent 93%, rgba(16,37,31,.78)), linear-gradient(180deg, rgba(16,37,31,.9), transparent 13%, transparent 70%, rgba(16,37,31,.62) 82%, rgba(16,37,31,.28) 91%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 76%, rgba(0,0,0,.74) 88%, transparent 100%); mask-image: linear-gradient(to bottom, #000 0%, #000 76%, rgba(0,0,0,.74) 88%, transparent 100%); content: ""; }
  /* The film lands in the same deep green as the hero. The daylight palette only opens once the reader enters the material chapter. */
  .home-hero-scrim { background: linear-gradient(180deg, rgba(7,18,15,.06) 0%, rgba(7,18,15,.08) 38%, rgba(7,18,15,.68) 68%, rgba(7,18,15,.94) 79%, #0b2119 92%, #10251f 100%), linear-gradient(90deg, rgba(7,18,15,.48), transparent 78%); }
  .home-hero-note { color: rgba(225,239,229,.78); }
  html[data-theme="dark"] .home-hero-scrim { background: linear-gradient(180deg, rgba(7,18,15,.06) 0%, rgba(7,18,15,.08) 38%, rgba(7,18,15,.64) 66%, rgba(7,18,15,.94) 82%, #182c24 100%), linear-gradient(90deg, rgba(7,18,15,.48), transparent 78%); }
  html[data-theme="dark"] .home-hero-note { color: rgba(229,241,230,.72); }
  html[data-theme="light"] .materials-gallery { background: linear-gradient(180deg, #10251f 0, #1d4232 1.8rem, #5f8872 3.75rem, #d1e2d6 5.75rem, #e9f1ec 8.5rem, #e9f1ec 100%); }
  .materials-head h2, .series-head h2, .studio-copy h2, .museum-copy h2 { font-size: clamp(2.2rem, 9.5vw, 3.45rem); line-height: .97; }
  .materials-viewport { margin-right: 0; border-radius: 1.1rem; }
  .material-image { aspect-ratio: 1.4; }
  .material-caption { min-height: 8.5rem; padding: 1.1rem 1.25rem; }
  .material-caption h3 { margin: .35rem 0; font-size: 1.6rem; }
  .material-caption p { font-size: .76rem; line-height: 1.45; }
  .series-cards { padding-bottom: 0; scrollbar-width: none; }
  .series-cards::-webkit-scrollbar { display: none; width: 0; height: 0; }
  .series-head { position: relative; }
  .series-swipe-hint { position: absolute; z-index: 6; right: 0; bottom: 0; display: flex; gap: .55rem; align-items: center; padding: .38rem .6rem; color: color-mix(in srgb, var(--ink) 72%, transparent); border: 1px solid color-mix(in srgb, var(--ink) 16%, transparent); border-radius: 99rem; background: color-mix(in srgb, var(--paper) 86%, transparent); box-shadow: 0 .7rem 1.8rem rgba(20,39,30,.1); backdrop-filter: blur(10px); font-size: .56rem; letter-spacing: .1em; pointer-events: none; }
  .series-swipe-hint i { position: relative; display: block; width: 2.5rem; height: 1px; overflow: visible; background: color-mix(in srgb, var(--ink) 24%, transparent); }
  .series-swipe-hint i::before, .series-swipe-hint i::after { position: absolute; top: 50%; width: .38rem; height: .38rem; border-top: 1px solid currentColor; border-right: 1px solid currentColor; content: ""; }
  .series-swipe-hint i::before { left: 0; transform: translateY(-50%) rotate(-135deg); }
  .series-swipe-hint i::after { right: 0; transform: translateY(-50%) rotate(45deg); }
  .series-swipe-hint span::after { display: inline-block; width: .28rem; height: .28rem; margin-left: .45rem; border-radius: 50%; background: var(--leaf); box-shadow: 0 0 .65rem var(--leaf); animation: series-swipe-pulse 1.8s ease-in-out infinite; content: ""; }
  .studio-grid { gap: 1rem; margin-top: 1rem; }
  .studio-copy > p { margin: .75rem 0 1rem; font-size: .78rem; line-height: 1.5; }
  .colour-choices { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .3rem .55rem; margin-top: .7rem; }
  .colour-choices button { grid-template-columns: 1.05rem minmax(0, 1fr); gap: .35rem; min-height: 2.45rem; padding: .25rem 0; font-size: .61rem; line-height: 1.15; }
  .colour-choices i { width: 1.05rem; }
  .studio-product { width: min(100%, 32rem); height: clamp(18rem, 70vw, 25rem); min-height: 0; margin: 0 auto; }
  .studio-product img { width: min(76%, 20rem); }
  .museum-window { aspect-ratio: 1.45; }
}
@keyframes series-swipe-pulse { 0%, 100% { opacity: .35; transform: translateX(-.15rem); } 50% { opacity: 1; transform: translateX(.15rem); } }
@media (max-width: 360px) { .home-hero-copy h1 { font-size: 2.75rem; }.museum-nodes { bottom: 7rem; }.museum-nodes a { font-size: .7rem; } }

/* Portrait phones use a compact rhythm while scrolling stays fully native. */
@media (max-width: 760px) and (min-height: 560px) {

  .home-hero { min-height: 100svh; }
  .home-hero-copy { margin-bottom: clamp(5.2rem, 10svh, 7rem); }
  .home-hero-copy h1 { font-size: clamp(2.8rem, 12.5vw, 4.2rem); }

  .materials-gallery, .series-stage, .harness-studio { padding: 4.45rem 1rem 1.1rem; }
  .section-kicker { font-size: .58rem; }
  .materials-head, .series-head { gap: .45rem; margin: .7rem 0 1rem; }
  .materials-head h2, .series-head h2, .studio-copy h2, .museum-copy h2, .final-content h2 { font-size: clamp(2.05rem, 9.5vw, 3rem); line-height: .96; }
  .materials-head > p { max-width: 32rem; font-size: .72rem; line-height: 1.45; }
  .materials-viewport { height: clamp(20rem, 52svh, 28rem); margin-right: 0; border-radius: 1rem; }
  .materials-track { height: 100%; }
  .material-slide { height: 100%; grid-template-rows: minmax(0, 1fr) auto; }
  .material-image { min-height: 0; aspect-ratio: auto; }
  .material-caption { min-height: 7.1rem; padding: 1rem 1.1rem; }
  .material-caption h3 { margin: .3rem 0; font-size: 1.55rem; }
  .material-caption p { font-size: .72rem; line-height: 1.4; }
  .materials-controls { height: 2.25rem; margin-top: .65rem; }
  .materials-controls > button { display: none; }

  .series-stage { padding-bottom: 1rem; }
  .series-head { margin-bottom: 1.1rem; }
  .series-head .text-link { width: fit-content; margin: 0; font-size: .72rem; }
  .series-cards { height: min(58svh, 30rem); margin-right: -1rem; padding: 0 1rem 0 0; gap: .65rem; background: transparent; scrollbar-width: none; }
  .series-cards::-webkit-scrollbar { display: none; }
  .series-card { flex-basis: min(72vw, 17rem); height: 100%; padding: .7rem .7rem 1rem; border-radius: 1rem; }
  .series-media { height: calc(100% - 5.3rem); aspect-ratio: auto; border-radius: .7rem; }
  .series-card > div { padding-top: .65rem; }
  .series-card h3 { margin: .3rem 0 .1rem; font-size: 1.3rem; }

  .studio-grid { gap: .55rem; margin-top: .7rem; }
  .studio-copy h2 { max-width: 12ch; }
  .studio-copy > p { margin: .55rem 0 .7rem; font-size: .7rem; line-height: 1.42; }
  .colour-choices { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .25rem .5rem; margin-top: .55rem; }
  .colour-choices button { grid-template-columns: 1.1rem minmax(0, 1fr); gap: .35rem; min-height: 2.45rem; padding: .25rem 0; font-size: .6rem; line-height: 1.15; }
  .colour-choices i { width: 1.1rem; }
  .studio-product { width: min(100%, 27rem); min-height: 0; height: clamp(18rem, 56svh, 30rem); margin: 0 auto; border-radius: 1.2rem; }
  .studio-product img { width: min(74%, 18rem); }
  .studio-readout { right: .55rem; bottom: .55rem; padding: .5rem .65rem; }
  .studio-readout p { margin-bottom: 0; font-size: .72rem; }
  .studio-readout span { font-size: .5rem; }

  .future-museum { height: 100svh; min-height: 100svh; max-height: 100svh; }
  .museum-sticky { position: relative; display: grid; height: 100%; min-height: 0; padding: 4.45rem 1rem 3.7rem; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; gap: .65rem; }
  .museum-copy { width: auto; margin: 0; padding: 0; }
  .museum-copy .eyebrow { margin-bottom: .4rem; font-size: .55rem; }
  .museum-copy h2 { max-width: 14ch; margin: .35rem 0 .5rem; }
  .museum-copy > p:last-child { font-size: .68rem; line-height: 1.4; }
  .museum-window { width: 100%; height: 100%; min-height: 0; margin: 0; aspect-ratio: auto; border-radius: 1rem; transform: none; }
  .museum-panel, .museum-panel.is-active { border-radius: 1rem; }
  .museum-panel > strong { font-size: clamp(5.2rem, 23vw, 7rem); }
  .museum-nodes { position: static; width: 100%; grid-template-columns: repeat(4, 1fr); }
  .museum-nodes button { min-height: 2.8rem; padding: .35rem .25rem; }
  .museum-link { bottom: 1.25rem; left: 1rem; font-size: .68rem; }
  .museum-detail { min-height: min(42svh, 22rem); }

  .home-final { height: 100svh; }
  .final-content h2 { font-size: clamp(2.65rem, 12vw, 4rem); }
}

@media (max-width: 760px) and (max-height: 559px) {
  .home-screen, .future-museum { max-height: none; }

  /* Short landscape-ish viewports: keep the hero copy clear of the overlaid header. */
  .home-hero { padding-top: calc(76px + env(safe-area-inset-top)); }
  .home-hero-copy { margin-bottom: clamp(1.1rem, 4svh, 2rem); }
  .home-hero-copy .eyebrow { margin-bottom: .55rem; }
  .home-hero-copy h1 { margin: .45rem 0 .85rem; font-size: clamp(2.45rem, 8.5vw, 3.5rem); line-height: 1.02; }
  .home-hero-copy p:not(.eyebrow) { font-size: .88rem; line-height: 1.55; }
  .home-hero-copy .button { min-height: 42px; margin-top: 1rem; padding: .6rem 1rem; }
  .home-hero-note { display: none; }
}

@media (max-width: 560px) and (max-height: 559px) {
  .home-hero { padding-top: calc(65px + env(safe-area-inset-top)); }
}

@media (max-width: 760px) and (min-height: 560px) and (max-height: 650px) {
  .series-cards { height: min(50svh, 18rem); }
  .series-media { height: calc(100% - 4.8rem); }
  .series-card > div { padding-top: .5rem; }
  .series-card h3 { margin: .22rem 0 .05rem; }
}

/* Immersive intelligence story: image-led, progressively enhanced and safe for static hosting. */
[data-loop-story], [data-intelligence-story] { --story-progress: 0; }
.loop-system[data-loop-story] { overflow: hidden; }
.system-orbit { isolation: isolate; overflow: hidden; }
.orbit-link { position: absolute; z-index: 0; inset: 5% 4%; width: 92%; height: 90%; overflow: visible; pointer-events: none; }
.orbit-link-base, .orbit-link-active { fill: none; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.orbit-link-base { stroke: color-mix(in srgb, var(--leaf) 32%, transparent); stroke-width: 1; }
.orbit-link-active { stroke: #d6f0d9; stroke-width: 2; stroke-dasharray: 2140; stroke-dashoffset: calc(2140 * (1 - var(--story-progress))); filter: drop-shadow(0 0 8px rgba(190, 244, 203, .7)); transition: stroke-dashoffset .1s linear; }
.system-orbit::before { content: ""; position: absolute; z-index: -1; inset: 14%; border-radius: 50%; background: radial-gradient(circle, rgba(189, 239, 202, .18), transparent 62%); transform: scale(calc(.85 + var(--story-progress) * .2)); opacity: calc(.3 + var(--story-progress) * .7); transition: transform .7s var(--ease-out), opacity .5s ease; }
.orbit-node { text-decoration: none; color: inherit; transition: transform .42s var(--ease-out), background .42s ease, border-color .42s ease; }
.orbit-node:hover, .orbit-node:focus-visible { transform: translateY(-7px) scale(1.02); background: color-mix(in srgb, var(--paper) 85%, var(--leaf)); border-color: color-mix(in srgb, var(--leaf) 65%, var(--line)); outline: none; }
.orbit-core { position: relative; z-index: 1; box-shadow: 0 0 0 1px rgba(219, 246, 224, .18), 0 0 60px rgba(166, 228, 180, .13); }

.living-loop { --living-progress: 0; position: relative; min-height: clamp(58rem, 92vw, 76rem); margin-top: clamp(1rem, 4vw, 4rem); overflow: clip; color: #14201c; background: linear-gradient(180deg, #eef2ed 0%, #e2ece7 47%, #b9cec4 82%, #0b1713 100%); }
.living-loop::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 12% 24%, rgba(255, 255, 255, .82), transparent 31%), radial-gradient(circle at 78% 44%, rgba(174, 217, 189, .45), transparent 34%), linear-gradient(115deg, transparent 20%, rgba(255, 255, 255, .24) 48%, transparent 72%); pointer-events: none; }
.living-loop-atmosphere, .living-loop-atmosphere span { position: absolute; inset: 0; pointer-events: none; }
.living-loop-atmosphere { opacity: calc(.35 + var(--living-progress) * .55); }
.living-loop-atmosphere span { width: 34rem; height: 34rem; border-radius: 50%; filter: blur(38px); mix-blend-mode: soft-light; }
.living-loop-atmosphere span:nth-child(1) { top: 8%; left: -12%; background: rgba(255, 255, 255, .72); transform: translate3d(calc(var(--living-progress) * 45px), 0, 0); }
.living-loop-atmosphere span:nth-child(2) { inset: 30% auto auto 43%; background: rgba(133, 196, 158, .42); transform: translate3d(0, calc(var(--living-progress) * -34px), 0); }
.living-loop-atmosphere span:nth-child(3) { inset: auto -14% 1% auto; background: rgba(33, 92, 69, .38); transform: translate3d(calc(var(--living-progress) * -38px), 0, 0); }
.living-loop-inner { position: relative; z-index: 1; width: min(1360px, calc(100% - 56px)); margin: 0 auto; padding: clamp(5rem, 10vw, 9rem) 0 0; }
.living-loop-copy { position: relative; z-index: 3; max-width: 46rem; }
.living-loop-copy .eyebrow { color: #416557; }
.living-loop-copy h2 { max-width: 11ch; margin: .85rem 0 1.35rem; font-size: clamp(3.3rem, 6.3vw, 7.1rem); }
.living-loop-copy > p:last-child { max-width: 40rem; color: rgba(20, 32, 28, .67); font-size: clamp(1rem, 1.3vw, 1.17rem); line-height: 1.8; }
.living-loop-stage { position: relative; min-height: clamp(38rem, 58vw, 49rem); margin-top: clamp(-3rem, -2vw, -1rem); }
.living-loop-map { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.living-loop-path-base, .living-loop-path-progress { fill: none; vector-effect: non-scaling-stroke; stroke-linecap: round; }
.living-loop-path-base { stroke: rgba(42, 77, 63, .2); stroke-width: 1.25; }
.living-loop-path-progress { stroke: #79a98b; stroke-width: 2.4; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--living-progress)); filter: drop-shadow(0 0 7px rgba(130, 194, 151, .72)); }
.living-loop-traveler { opacity: calc(.2 + var(--living-progress) * .8); filter: drop-shadow(0 0 10px rgba(184, 242, 198, .95)); }
.living-loop.is-active .traveler-halo { animation: living-loop-pulse 1.8s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.traveler-halo { fill: rgba(207, 246, 216, .18); stroke: rgba(206, 245, 216, .62); stroke-width: 1; vector-effect: non-scaling-stroke; }
.traveler-core { fill: #f2fff4; }
@keyframes living-loop-pulse { 0%, 100% { opacity: .46; transform: scale(.78); } 50% { opacity: 1; transform: scale(1.28); } }
.living-loop-node { position: absolute; z-index: 3; display: grid; grid-template-columns: 1rem auto; grid-template-rows: auto auto auto; column-gap: .75rem; width: min(18rem, 24vw); color: inherit; text-decoration: none; opacity: .38; transform: translateY(14px); transition: opacity .55s ease, transform .7s var(--ease-out), color .35s ease; }
.living-node-1 { top: 34%; left: 8%; }
.living-node-2 { top: 42%; left: 35%; }
.living-node-3 { top: 30%; right: 8%; }
.living-node-4 { top: 61%; right: 10%; }
.living-node-dot { grid-row: 1 / 4; align-self: start; width: .68rem; height: .68rem; margin-top: .18rem; border: 1px solid #5d8d70; border-radius: 50%; background: rgba(235, 246, 237, .72); box-shadow: 0 0 0 0 rgba(116, 175, 135, .26); transition: background .4s ease, box-shadow .6s ease, transform .4s var(--ease-out); }
.living-node-index { color: #527966; font-size: .62rem; letter-spacing: .15em; }
.living-loop-node strong { margin-top: .35rem; font-size: clamp(1.3rem, 2.3vw, 2.45rem); font-weight: 520; letter-spacing: -.045em; }
.living-loop-node small { max-width: 15rem; margin-top: .35rem; color: rgba(20, 32, 28, .56); font-size: .72rem; line-height: 1.55; }
.living-loop-node.is-reached { opacity: 1; transform: translateY(0); }
.living-loop-node.is-reached .living-node-dot { background: #dff5e4; box-shadow: 0 0 0 9px rgba(116, 175, 135, .12), 0 0 24px rgba(126, 191, 148, .5); transform: scale(1.08); }
.living-loop-node:hover, .living-loop-node:focus-visible { color: #315d47; }
.living-loop-node:hover .living-node-dot, .living-loop-node:focus-visible .living-node-dot { transform: scale(1.35); box-shadow: 0 0 0 12px rgba(116, 175, 135, .14), 0 0 28px rgba(126, 191, 148, .62); }

.intelligence-story { position: relative; margin-top: 0; overflow: clip; color: #f0f5ef; background: #0b1713; }
.intelligence-story::before, .intelligence-story::after { content: ""; position: absolute; z-index: 0; width: 46vw; aspect-ratio: 1; border-radius: 50%; filter: blur(12px); pointer-events: none; }
.intelligence-story::before { top: -11vw; left: -16vw; background: radial-gradient(circle, rgba(148, 222, 172, .22), transparent 66%); }
.intelligence-story::after { bottom: -15vw; right: -15vw; background: radial-gradient(circle, rgba(68, 147, 121, .22), transparent 67%); }
.intelligence-story-inner { position: relative; z-index: 1; width: min(1240px, calc(100% - 48px)); margin: 0 auto; padding: clamp(5rem, 11vw, 10rem) 0; }
.story-head { max-width: 52rem; margin: 0 0 clamp(3.8rem, 8vw, 8rem); }
.story-head .eyebrow, .scene-copy .eyebrow { color: #a6cdb0; }
.story-head h2 { max-width: 13ch; margin: .7rem 0 1.3rem; color: inherit; }
.story-head > p:last-child { max-width: 44rem; color: rgba(240, 245, 239, .7); }
.story-scene { position: relative; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(230px, .72fr); align-items: center; gap: clamp(2rem, 7vw, 8rem); min-height: clamp(34rem, 55vw, 48rem); padding: clamp(1.2rem, 3vw, 2.7rem) 0; border-top: 1px solid rgba(226, 246, 229, .16); }
.story-scene:nth-of-type(odd) .scene-media { order: 2; }
.story-scene:nth-of-type(odd) .scene-copy { order: 1; }
.scene-media { position: relative; overflow: hidden; aspect-ratio: 1.28 / 1; border-radius: 3px; background: #18251f; box-shadow: 0 34px 80px rgba(0, 0, 0, .3); }
.scene-media::after, .boundary-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(130deg, rgba(235, 255, 236, .16), transparent 36%, transparent 70%, rgba(8, 35, 25, .24)); mix-blend-mode: screen; }
.story-picture, .story-picture img { display: block; width: 100%; height: 100%; }
.story-picture img { object-fit: cover; transform: scale(1.045); transition: transform 1.3s var(--ease-out), filter .7s ease; }
.story-scene:nth-of-type(even) .story-picture img { transform: scale(1.045) translateX(-1.2%); }
.intelligence-story.is-active .story-picture img { transform: scale(1); }
.story-scene:nth-of-type(even) .story-picture img { transform: scale(1) translateX(0); }
.scene-copy { position: relative; max-width: 29rem; padding: 2.15rem 0; }
.scene-copy::before { content: ""; position: absolute; top: 0; left: 0; width: 2.6rem; height: 2px; background: #b8dfbf; transform-origin: left; transform: scaleX(calc(.2 + var(--story-progress) * .8)); }
.scene-index { display: block; margin-bottom: 2.9rem; color: #b8dfbf; font-size: .75rem; letter-spacing: .15em; }
.scene-copy h2 { margin: .8rem 0 1.1rem; color: inherit; font-size: clamp(2.2rem, 4.1vw, 4.45rem); }
.scene-copy > p:last-child { max-width: 27rem; color: rgba(240, 245, 239, .73); font-size: 1.04rem; }
.scene-aura { position: absolute; z-index: -1; width: 23rem; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(129, 212, 153, .14), transparent 68%); filter: blur(10px); opacity: calc(.25 + var(--story-progress) * .75); transform: translate3d(calc(var(--story-progress) * 18px), 0, 0); transition: opacity .5s ease; }
.scene-moments .scene-aura, .scene-reassurance .scene-aura { right: 8%; }
.scene-insight .scene-aura, .scene-explore .scene-aura { left: 8%; }

.intelligence-boundaries { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(1240px, calc(100% - 48px)); margin: clamp(4rem, 9vw, 9rem) auto; gap: 1.2rem; }
.intelligence-boundaries > article { overflow: hidden; display: flex; flex-direction: column; min-width: 0; background: var(--warm); border: 1px solid var(--line); }
.boundary-media { position: relative; aspect-ratio: 1.35 / 1; overflow: hidden; background: var(--mist); }
.boundary-media .story-picture, .boundary-media img { width: 100%; height: 100%; display: block; }
.boundary-media img { object-fit: cover; transition: transform .7s var(--ease-out); }
.intelligence-boundaries > article:hover .boundary-media img { transform: scale(1.035); }
.boundary-copy { padding: clamp(1.6rem, 3.5vw, 3rem); }
.boundary-copy h2 { margin: .72rem 0 1rem; }
.boundary-copy p:last-child { color: var(--muted); }

@media (max-width: 900px) {
  .living-loop { min-height: 66rem; margin-top: 0; }
  .living-loop-inner { width: min(100% - 40px, 700px); padding-top: 5.5rem; }
  .living-loop-copy h2 { font-size: clamp(3.3rem, 11vw, 5.4rem); }
  .living-loop-stage { min-height: 48rem; margin-top: 2rem; }
  .living-loop-map { left: -19%; width: 118%; }
  .living-loop-node { width: min(15rem, 37vw); }
  .living-node-1 { top: 25%; left: 3%; }
  .living-node-2 { top: 42%; left: 28%; }
  .living-node-3 { top: 29%; right: 0; }
  .living-node-4 { top: 65%; right: 5%; }
  .living-loop-atmosphere span { width: 22rem; height: 22rem; filter: blur(28px); }
  .intelligence-story-inner, .intelligence-boundaries { width: min(100% - 32px, 700px); }
  .story-scene, .story-scene:nth-of-type(odd) { grid-template-columns: 1fr; gap: 1.15rem; min-height: 0; padding: 2.1rem 0 3.6rem; }
  .story-scene .scene-media, .story-scene:nth-of-type(odd) .scene-media { order: 1; aspect-ratio: 1.34 / 1; }
  .story-scene .scene-copy, .story-scene:nth-of-type(odd) .scene-copy { order: 2; padding: .7rem 0 0; }
  .scene-index { margin-bottom: 1.7rem; }
  .scene-copy h2 { font-size: clamp(2.2rem, 8.5vw, 3.7rem); }
  .intelligence-boundaries { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .living-loop { min-height: 67rem; }
  .living-loop-inner { width: calc(100% - 32px); padding-top: 4.2rem; }
  .living-loop-copy h2 { font-size: clamp(3rem, 14vw, 4.1rem); }
  .living-loop-copy > p:last-child { font-size: .96rem; line-height: 1.72; }
  .living-loop-stage { min-height: 48rem; margin-top: 2.8rem; }
  .living-loop-map { inset: 0 auto 0 20px; width: 90%; transform: rotate(1deg); }
  .living-loop-node { left: 22% !important; right: auto !important; width: 70%; }
  .living-node-1 { top: 7%; }
  .living-node-2 { top: 29%; }
  .living-node-3 { top: 51%; }
  .living-node-4 { top: 73%; }
  .living-loop-node strong { font-size: 1.65rem; }
  .living-loop-node small { font-size: .7rem; }
  .intelligence-story-inner { padding: 4.1rem 0; }
  .story-head { margin-bottom: 3rem; }
  .story-head h2 { font-size: clamp(2.45rem, 11vw, 3.2rem); }
  .scene-copy > p:last-child { font-size: 1rem; }
  .scene-media { border-radius: 2px; }
  .intelligence-boundaries { width: min(100% - 32px, 700px); margin: 3.7rem auto; gap: .9rem; }
  .boundary-copy { padding: 1.45rem; }
  .orbit-link-active { stroke-dashoffset: 0; }
}

html[data-theme="dark"] .intelligence-boundaries > article { background: #1a2823; }
html[data-theme="dark"] .intelligence-story { background: #07100d; }
html[data-theme="dark"] .living-loop { color: #edf5ef; background: linear-gradient(180deg, #16211d 0%, #1c3028 48%, #1a3c2f 82%, #07100d 100%); }
html[data-theme="dark"] .living-loop::before { background: radial-gradient(circle at 12% 24%, rgba(174, 214, 188, .13), transparent 31%), radial-gradient(circle at 78% 44%, rgba(89, 157, 112, .18), transparent 34%), linear-gradient(115deg, transparent 20%, rgba(255, 255, 255, .04) 48%, transparent 72%); }
html[data-theme="dark"] .living-loop-copy .eyebrow { color: #a5cab0; }
html[data-theme="dark"] .living-loop-copy > p:last-child, html[data-theme="dark"] .living-loop-node small { color: rgba(237, 245, 239, .62); }
html[data-theme="dark"] .living-loop-path-base { stroke: rgba(199, 229, 208, .18); }
html[data-theme="dark"] .living-node-index { color: #9bc3a7; }
html[data-theme="dark"] .living-node-dot { border-color: #9bc3a7; background: rgba(19, 43, 33, .86); }

.back-to-top { position: fixed; z-index: 20; right: clamp(1rem, 2.4vw, 2.2rem); bottom: clamp(1rem, 2.4vw, 2.2rem); display: grid; width: 3rem; height: 3rem; place-items: center; padding: 0; border: 1px solid color-mix(in srgb, var(--ink) 30%, transparent); border-radius: 50%; color: var(--ink); background: color-mix(in srgb, var(--paper) 86%, transparent); box-shadow: 0 12px 28px rgba(13, 29, 23, .16); backdrop-filter: blur(12px); cursor: pointer; opacity: 0; pointer-events: none; transform: translateY(12px) scale(.94); transition: opacity .26s ease, transform .32s var(--ease-out), background .26s ease, border-color .26s ease; }
.back-to-top.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
.back-to-top span[aria-hidden="true"] { font-family: Georgia, serif; font-size: 1.45rem; line-height: 1; transform: translateY(1px); }
.back-to-top:hover { border-color: var(--leaf); color: var(--paper); background: var(--leaf); transform: translateY(-3px); }
.back-to-top:focus-visible { outline: 2px solid var(--leaf); outline-offset: 3px; }
html[data-theme="dark"] .back-to-top { border-color: rgba(237, 243, 238, .28); background: rgba(14, 27, 22, .86); box-shadow: 0 12px 28px rgba(0, 0, 0, .32); }
html[data-theme="dark"] .back-to-top:hover { color: #0d1a15; background: #b8dfbf; }

@media (prefers-reduced-motion: reduce) {
  .orbit-link-active { stroke-dashoffset: 0; transition: none; }
  .system-orbit::before, .story-picture img, .scene-aura, .scene-copy::before, .boundary-media img { transition: none; transform: none; }
  .back-to-top { transition: none; }
  .living-loop { --living-progress: 1; }
  .living-loop-atmosphere span, .living-loop-node { transition: none; transform: none; }
  .living-loop-node { opacity: 1; }
  .living-loop .traveler-halo { animation: none; }
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    --ink: #edf3ee;
    --muted: #a8b8b0;
    --paper: #121916;
    --warm: #202b27;
    --mist: #1b2926;
    --leaf: #a7c7b2;
    --line: rgba(237,243,238,.16);
    --dark: #08100e;
    color-scheme: dark;
  }
}

/* Interior gallery system — the homepage language, translated into quieter rooms. */
body:not([data-page="home"]):not([data-page="landing"]):not([data-page="404"]) main { overflow: clip; }
body:not([data-page="home"]):not([data-page="landing"]):not([data-page="404"]) .site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  height: 72px;
  color: var(--ink);
  background: color-mix(in srgb, var(--paper) 78%, transparent);
  border-color: color-mix(in srgb, var(--ink) 12%, transparent);
  backdrop-filter: blur(18px) saturate(1.2);
}

.page-intro {
  --intro-a: #e6f1ea;
  --intro-b: #d3e3dc;
  --intro-glow: rgba(103, 160, 126, .36);
  isolation: isolate;
  position: relative;
  display: grid;
  min-height: clamp(31rem, 62svh, 43rem);
  margin-top: clamp(1rem, 2vw, 1.75rem);
  margin-bottom: clamp(2.5rem, 6vw, 5rem);
  padding: clamp(3.25rem, 7vw, 6.5rem);
  align-items: end;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  border-radius: clamp(1.4rem, 2.2vw, 2.25rem);
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--intro-a) 92%, white), var(--intro-b));
  box-shadow: 0 28px 90px rgba(22, 52, 41, .08);
}
.page-intro::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image:
    linear-gradient(118deg, rgba(255,255,255,.46), transparent 37%),
    radial-gradient(circle at 78% 24%, var(--intro-glow), transparent 30%);
  background-size: auto, auto;
}
.page-intro::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: clamp(3.25rem, 7vw, 6.5rem);
  bottom: clamp(2.1rem, 4vw, 3.4rem);
  width: clamp(2.75rem, 5vw, 4.5rem);
  height: 1px;
  background: currentColor;
  opacity: .36;
}
.page-intro-copy { position: relative; z-index: 2; max-width: 61rem; padding-bottom: clamp(2.6rem, 5vw, 4rem); }
.page-intro .eyebrow { color: color-mix(in srgb, currentColor 72%, var(--leaf)); }
.page-intro h1 { max-width: 11.5em; margin: 0 0 1.5rem; font-size: clamp(3.8rem, 6.3vw, 7rem); line-height: .98; }
.page-intro .page-lead { max-width: 42rem; margin: 0; color: color-mix(in srgb, currentColor 66%, transparent); font-size: clamp(1rem, 1.35vw, 1.2rem); }
.page-intro-index { position: absolute; z-index: 2; top: clamp(2rem, 4vw, 3.5rem); right: clamp(2rem, 4vw, 3.5rem); margin: 0; color: currentColor; font-size: .75rem; letter-spacing: .18em; opacity: .55; }
.page-intro-atmosphere { position: absolute; z-index: -1; inset: 0; overflow: hidden; }
.page-intro-atmosphere span { position: absolute; display: block; border: 1px solid color-mix(in srgb, currentColor 18%, transparent); border-radius: 50%; }
.page-intro-atmosphere span:nth-child(1) { top: -42%; right: -8%; width: min(58vw, 50rem); aspect-ratio: 1.58; transform: rotate(-14deg); }
.page-intro-atmosphere span:nth-child(2) { top: -18%; right: 6%; width: min(43vw, 37rem); aspect-ratio: 1.58; transform: rotate(22deg); }
.page-intro-atmosphere span:nth-child(3) { right: 19%; bottom: 19%; width: .62rem; aspect-ratio: 1; border: 0; background: color-mix(in srgb, var(--leaf) 78%, var(--ink)); box-shadow: 0 0 0 .55rem color-mix(in srgb, var(--leaf) 11%, transparent), 0 0 2.8rem 1.1rem var(--intro-glow); animation: interior-traveler 8s var(--ease-out) infinite alternate; }
.page-intro-products { --intro-a: #e8f2ec; --intro-b: #cbded5; --intro-glow: rgba(103, 160, 126, .42); }
.page-intro-craft { --intro-a: #f0ece2; --intro-b: #d9ddd2; --intro-glow: rgba(151, 133, 90, .3); }
.page-intro-intelligence { --intro-a: #1c332b; --intro-b: #0d211b; --intro-glow: rgba(122, 205, 151, .32); color: #edf6ef; margin-bottom: 0; border-bottom-right-radius: .55rem; border-bottom-left-radius: .55rem; }
.page-intro-intelligence .page-lead { color: rgba(237,246,239,.68); }
.page-intro-about { --intro-a: #f0e7db; --intro-b: #d9e2d8; --intro-glow: rgba(194, 140, 91, .29); }
.page-intro-privacy { --intro-a: #e3eceb; --intro-b: #ccd9dc; --intro-glow: rgba(95, 139, 150, .27); }
@keyframes interior-traveler {
  0% { transform: translate3d(-12vw, 7rem, 0); }
  48% { transform: translate3d(4vw, -2rem, 0); }
  100% { transform: translate3d(13vw, 4rem, 0); }
}

.catalogue-controls { margin-bottom: clamp(3.5rem, 7vw, 6.5rem); }
.catalogue-controls a { padding: .65rem 1rem; background: color-mix(in srgb, var(--paper) 68%, transparent); transition: color .25s ease, background .25s ease, transform .3s var(--ease-out); }
.catalogue-controls a:hover { color: var(--paper); background: var(--ink); transform: translateY(-2px); }
.catalogue-group { margin-bottom: clamp(6rem, 12vw, 10rem); }
.catalogue-group .section-heading { align-items: end; padding-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.catalogue-grid { gap: clamp(1rem, 2vw, 1.75rem); }
.product-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: clamp(1.15rem, 1.8vw, 1.7rem);
  background: color-mix(in srgb, var(--warm) 72%, var(--paper));
}
.product-card .card-media { height: auto; aspect-ratio: .88; background: color-mix(in srgb, var(--mist) 72%, var(--paper)); }
.product-card-body { position: relative; min-height: 12.5rem; padding: 1.6rem 1.6rem 1.8rem; }
.product-card h3 { margin: .4rem 0 .1rem; font-size: clamp(1.75rem, 2.3vw, 2.45rem); }
.product-card .text-link { position: absolute; right: 1.6rem; bottom: 1.55rem; left: 1.6rem; justify-content: space-between; }

.product-hero {
  isolation: isolate;
  position: relative;
  min-height: calc(100svh - 104px);
  margin-top: clamp(1rem, 2vw, 1.75rem);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: clamp(1.4rem, 2.2vw, 2.25rem);
  background-image: linear-gradient(140deg, color-mix(in srgb, var(--warm) 82%, var(--paper)), color-mix(in srgb, var(--mist) 72%, var(--paper)));
  box-shadow: 0 28px 90px rgba(22, 52, 41, .09);
}
.product-hero::before { content: ""; position: absolute; z-index: -1; left: -12rem; bottom: -16rem; width: 34rem; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 50%; box-shadow: 0 0 0 5rem color-mix(in srgb, var(--leaf) 4%, transparent), 0 0 0 10rem color-mix(in srgb, var(--leaf) 3%, transparent); }
.product-hero > div:first-child { position: relative; z-index: 1; padding: clamp(3rem, 6.5vw, 7rem); }
.product-hero-image { margin: clamp(.75rem, 1.3vw, 1.25rem); overflow: hidden; border-radius: clamp(1rem, 1.7vw, 1.55rem); }
.product-hero-image img { transition: transform 1.2s var(--ease-out); }
.product-hero:hover .product-hero-image img { transform: scale(1.018); }
.anchor-nav { top: 72px; padding: 1.05rem max(1rem, calc((100vw - var(--wide))/2)); width: 100%; border-bottom: 1px solid var(--line); }
.product-section { padding-top: clamp(5rem, 9vw, 8rem); padding-bottom: clamp(5rem, 9vw, 8rem); }
.product-overview, .detail-section { position: relative; }
.feature-list.large, .detail-list { border-top-color: color-mix(in srgb, var(--ink) 26%, transparent); }
.feature-list.large li, .detail-list > div { transition: padding-left .3s var(--ease-out), background .3s ease; }
.feature-list.large li:hover, .detail-list > div:hover { padding-left: .75rem; background: color-mix(in srgb, var(--leaf) 8%, transparent); }
.product-design { gap: clamp(2rem, 6vw, 7rem); background: linear-gradient(135deg, color-mix(in srgb, var(--warm) 90%, var(--paper)), color-mix(in srgb, var(--mist) 54%, var(--paper))); }
.design-image { overflow: hidden; border-radius: 1.6rem; box-shadow: 0 24px 70px rgba(25, 45, 38, .1); }
.design-image .media-frame { height: 100%; }
.design-image img { height: 100%; object-fit: cover; transition: transform 1.1s var(--ease-out); }
.product-design:hover .design-image img { transform: scale(1.025); }
.visual-detail-section { display: grid; grid-template-columns: minmax(15rem, .68fr) minmax(0, 1.32fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.detail-heading { position: sticky; top: 9rem; }
.detail-visual-grid { display: grid; grid-template-columns: 1.18fr .82fr; gap: clamp(.75rem, 1.4vw, 1.25rem); min-width: 0; }
.product-visual { isolation: isolate; position: relative; min-width: 0; height: clamp(25rem, 43vw, 39rem); margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: clamp(1.15rem, 1.8vw, 1.7rem); background: color-mix(in srgb, var(--mist) 58%, var(--paper)); }
.product-visual:not(.product-visual-wide) { height: clamp(20rem, 34vw, 31rem); align-self: end; }
.product-visual .media-frame { display: block; width: 100%; height: 100%; }
.product-visual img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease-out), filter .5s ease; }
.product-visual::after { content: ""; position: absolute; inset: auto 0 0; height: 42%; background: linear-gradient(transparent, rgba(5, 18, 13, .72)); pointer-events: none; }
.product-visual figcaption { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; display: flex; align-items: end; min-height: 7.5rem; padding: 1.35rem; color: #f1f8f3; }
.product-visual figcaption span { max-width: 14rem; font-size: clamp(.86rem, 1.15vw, 1.05rem); font-weight: 650; letter-spacing: .01em; }
.product-visual:hover img { transform: scale(1.035); }
.visual-detail-section .detail-list { grid-column: 1 / -1; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: clamp(1rem, 2vw, 2rem); }
.visual-detail-section .detail-list > div { min-height: 5.2rem; padding-right: 1rem; }
.engineering-stage { overflow: hidden; border-radius: 1.7rem; box-shadow: 0 28px 80px rgba(8, 18, 15, .2); }

.craft-feature, .testing-grid, .about-origin, .legal-note {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: clamp(1.4rem, 2.2vw, 2.2rem);
  box-shadow: 0 24px 70px rgba(22, 52, 41, .07);
}
.craft-feature { background: linear-gradient(135deg, color-mix(in srgb, var(--mist) 88%, var(--paper)), color-mix(in srgb, var(--warm) 62%, var(--paper))); }
.craft-feature > div:first-child, .testing-grid > div:last-child { overflow: hidden; }
.craft-feature img, .testing-grid img { transition: transform 1.2s var(--ease-out); }
.craft-feature:hover img, .testing-grid:hover img { transform: scale(1.018); }
.testing-grid { margin-top: clamp(1.25rem, 2.4vw, 2.25rem); background: linear-gradient(135deg, color-mix(in srgb, var(--warm) 86%, var(--paper)), color-mix(in srgb, var(--mist) 45%, var(--paper))); }
.craft-material-library { width: var(--wide); margin: clamp(5rem, 10vw, 9rem) auto; }
.craft-process { width: var(--wide); margin: clamp(4rem, 8vw, 8rem) auto; }
.craft-process > header { display: grid; grid-template-columns: .55fr 1.45fr; gap: 2rem; align-items: end; margin-bottom: 2rem; }
.craft-process > header h2 { margin: 0; max-width: 14em; }
.craft-process-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.craft-process-card { background: var(--mist); border-radius: 1.1rem; overflow: hidden; }
.craft-process-image { aspect-ratio: 1.15; overflow: hidden; }
.craft-process-image img { width: 100%; height: 100%; object-fit: cover; }
.craft-process-copy { padding: 1.5rem; }
.craft-process-copy h3 { margin: .35rem 0 .8rem; font-size: clamp(1.25rem, 2vw, 1.8rem); }
.craft-process-copy p:last-child { color: var(--muted); }
.craft-material-library > header { display: grid; grid-template-columns: .55fr 1.45fr; gap: 2rem; align-items: end; margin-bottom: clamp(1.75rem, 4vw, 3rem); }
.craft-material-library > header h2 { max-width: 10em; margin: 0; }
.craft-material-grid { display: grid; grid-template-columns: 1.18fr .82fr .82fr; gap: clamp(.75rem, 1.4vw, 1.25rem); }
.craft-material-grid .product-visual { height: clamp(23rem, 37vw, 34rem); }
.craft-material-grid .product-visual:not(.product-visual-wide) { height: clamp(19rem, 30vw, 27rem); align-self: end; }
.craft-material-grid .product-visual figcaption { flex-direction: column; align-items: start; justify-content: end; gap: .4rem; }
.craft-material-grid .product-visual figcaption strong { font-size: clamp(.92rem, 1.25vw, 1.12rem); font-weight: 650; letter-spacing: .01em; }
.craft-material-grid .product-visual figcaption span { max-width: 22rem; font-weight: 420; font-size: clamp(.78rem, 1vw, .9rem); line-height: 1.45; color: rgba(241, 248, 243, .82); }
.partner-panel { position: relative; }
.partner-panel::before { content: ""; display: block; width: 4rem; height: 1px; margin-bottom: clamp(3rem, 6vw, 5rem); background: var(--leaf); }
.partner-names.large span { padding: .7rem 1.1rem; border: 1px solid var(--line); border-radius: 99rem; background: color-mix(in srgb, var(--paper) 82%, transparent); }

.about-origin { position: relative; background: linear-gradient(135deg, color-mix(in srgb, var(--warm) 90%, var(--paper)), color-mix(in srgb, var(--mist) 52%, var(--paper))); }
.about-origin::before { content: ""; position: absolute; right: -8rem; top: -10rem; width: 30rem; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 50%; box-shadow: 0 0 0 4rem color-mix(in srgb, var(--leaf) 5%, transparent); }
.about-origin > * { position: relative; z-index: 1; }
.origin-mark img { animation: origin-breathe 7s ease-in-out infinite; }
@keyframes origin-breathe { 50% { transform: rotate(6deg) scale(1.045); } }
.role-grid { gap: 1rem; background: transparent; }
.role-grid article { min-height: 16rem; border: 1px solid var(--line); border-radius: 1.35rem; background: color-mix(in srgb, var(--paper) 88%, var(--mist)); transition: transform .35s var(--ease-out), background .35s ease; }
.role-grid article:hover { transform: translateY(-5px); background: color-mix(in srgb, var(--mist) 55%, var(--paper)); }

.privacy-list { gap: clamp(3rem, 7vw, 7rem); }
.privacy-list > div { align-self: center; }
.privacy-list ul { overflow: hidden; border: 1px solid var(--line); border-radius: 1.5rem; background: color-mix(in srgb, var(--mist) 36%, var(--paper)); }
.privacy-list li { min-height: 4.4rem; padding: 1rem 1.35rem; border-bottom-color: var(--line); }
.privacy-list li:last-child { border-bottom: 0; }
.legal-note { position: relative; background: linear-gradient(135deg, color-mix(in srgb, var(--mist) 78%, var(--paper)), color-mix(in srgb, var(--warm) 52%, var(--paper))); }

.contact-block {
  isolation: isolate;
  position: relative;
  width: var(--wide);
  min-height: clamp(28rem, 58svh, 42rem);
  margin: clamp(3rem, 8vw, 8rem) auto 1.5rem;
  display: grid;
  align-content: center;
  overflow: hidden;
  border-radius: clamp(1.5rem, 2.5vw, 2.5rem);
  background:
    radial-gradient(circle at 76% 38%, rgba(120, 193, 144, .2), transparent 29%),
    linear-gradient(135deg, #142a22, #07130f);
}
.contact-block::before, .contact-block::after { content: ""; position: absolute; z-index: -1; border: 1px solid rgba(220,244,226,.19); border-radius: 50%; }
.contact-block::before { right: -5%; top: -30%; width: min(56vw, 47rem); aspect-ratio: 1.65; transform: rotate(-15deg); }
.contact-block::after { inset: 0; width: auto; aspect-ratio: auto; border: 0; border-radius: 0; background-color: transparent; background-image: var(--four-loop-texture); background-position: 50% 50%; background-size: var(--four-loop-pattern-size); background-repeat: repeat; opacity: 1; transform: none; animation: brand-pattern-drift 58s linear infinite reverse; }
.contact-block h2 { font-size: clamp(3rem, 6vw, 6.5rem); }
.contact-block .button { min-width: 10rem; }

.site-footer { width: var(--wide); margin: 0 auto 1.5rem; padding: clamp(2rem, 4vw, 3.5rem); border: 1px solid var(--line); border-radius: 1.5rem; background-color: color-mix(in srgb, var(--warm) 62%, var(--paper)); }

.language-landing, .not-found {
  background:
    radial-gradient(circle at 70% 28%, rgba(137, 196, 151, .36), transparent 28%),
    radial-gradient(circle at 18% 80%, rgba(174, 208, 190, .38), transparent 32%),
    #e7f0e8;
}
.landing-haze { box-shadow: 0 0 0 10vw rgba(174, 215, 184, .06), inset 0 0 4rem rgba(255,255,255,.35); }
.landing-copy, .not-found > div:last-child { padding: 2rem; border-radius: 2rem; background: rgba(244,250,245,.28); backdrop-filter: blur(7px); }

html[data-theme="dark"] .page-intro { --intro-a: #1a2b25; --intro-b: #101b17; color: #edf5ef; border-color: rgba(237,245,239,.12); box-shadow: 0 28px 90px rgba(0,0,0,.24); }
html[data-theme="dark"] .page-intro::before { background-image: linear-gradient(118deg, rgba(255,255,255,.035), transparent 37%), radial-gradient(circle at 78% 24%, var(--intro-glow), transparent 30%); }
html[data-theme="dark"] .page-intro-products { --intro-a: #193026; --intro-b: #0f1e19; }
html[data-theme="dark"] .page-intro-craft { --intro-a: #2b2a21; --intro-b: #17211d; }
html[data-theme="dark"] .page-intro-about { --intro-a: #302820; --intro-b: #17211d; }
html[data-theme="dark"] .page-intro-privacy { --intro-a: #1a292a; --intro-b: #101a18; }
html[data-theme="dark"] .product-card { background: linear-gradient(145deg, #1c2925, #17211e); }
html[data-theme="dark"] .craft-feature, html[data-theme="dark"] .testing-grid, html[data-theme="dark"] .about-origin, html[data-theme="dark"] .legal-note { background: linear-gradient(135deg, #1c2b26, #202821); }
html[data-theme="dark"] .privacy-list ul, html[data-theme="dark"] .role-grid article { background: #19241f; }
html[data-theme="dark"] .site-footer { background-color: #18231f; }
html[data-theme="dark"] .product-hero { background-image: linear-gradient(140deg, #222923, #182823); }
html[data-theme="dark"] .product-visual { background: #15231e; border-color: rgba(231, 243, 235, .13); }
html[data-theme="dark"] .language-landing, html[data-theme="dark"] .not-found { background: radial-gradient(circle at 70% 28%, rgba(84, 156, 104, .24), transparent 28%), radial-gradient(circle at 18% 80%, rgba(72, 125, 99, .2), transparent 32%), #0d1e16; }
html[data-theme="dark"] .landing-copy, html[data-theme="dark"] .not-found > div:last-child { background: rgba(8, 24, 16, .28); }
html[data-theme="dark"] .landing-brand img, html[data-theme="dark"] .not-found-brand img { filter: brightness(0) invert(1); }

@media (max-width: 900px) {
  .page-intro { min-height: min(70svh, 38rem); padding: 3.5rem; }
  .page-intro::after { left: 3.5rem; }
  .page-intro h1 { font-size: clamp(3.1rem, 9.5vw, 5.3rem); }
  .product-hero { grid-template-columns: 1fr; min-height: auto; }
  .product-hero-image { min-height: 52rem; }
  .visual-detail-section { grid-template-columns: 1fr; gap: 2.25rem; }
  .detail-heading { position: static; }
  .detail-visual-grid { grid-template-columns: 1.15fr .85fr; }
  .visual-detail-section .detail-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .craft-material-library > header, .craft-process > header { grid-template-columns: 1fr; gap: .65rem; }
  .craft-process-grid { grid-template-columns: 1fr; }
  .craft-material-grid { grid-template-columns: 1.1fr .9fr; }
  .craft-material-grid .product-visual-wide { grid-row: span 2; }
  .craft-feature, .testing-grid { gap: 0; }
}

@media (max-width: 560px) {
  body:not([data-page="home"]):not([data-page="landing"]):not([data-page="404"]) .site-header { height: 65px; }
  .page-intro, :lang(zh-CN) .page-intro {
    min-height: min(68svh, 35rem);
    margin-top: .8rem;
    margin-bottom: 2.5rem;
    padding: 2rem 1.4rem;
    border-radius: 1.45rem;
  }
  .page-intro-copy { padding-bottom: 2.35rem; }
  .page-intro::after { left: 1.4rem; bottom: 1.8rem; width: 2.8rem; }
  .page-intro h1, :lang(zh-CN) .page-intro h1 { max-width: 10em; margin-bottom: 1.1rem; font-size: clamp(2.55rem, 12.3vw, 3.35rem); line-height: 1.08; }
  .page-intro .page-lead, :lang(zh-CN) .page-intro .page-lead { font-size: .92rem; line-height: 1.72; }
  .page-intro-index { top: 1.5rem; right: 1.4rem; }
  .page-intro-atmosphere span:nth-child(1) { top: -5%; right: -70%; width: 32rem; }
  .page-intro-atmosphere span:nth-child(2) { top: 18%; right: -52%; width: 23rem; }
  .page-intro-atmosphere span:nth-child(3) { right: 30%; bottom: 30%; }
  .catalogue-controls { margin-bottom: 4rem; }
  .catalogue-group .section-heading { gap: .4rem; }
  .catalogue-group .section-heading h2 { font-size: 2.45rem; }
  .product-card .card-media { height: auto; aspect-ratio: .88; }
  .product-card-body { min-height: 11.6rem; }
  .product-hero { margin-top: .8rem; border-radius: 1.45rem; }
  .product-hero > div:first-child { padding: 3.4rem 1.45rem 2.75rem; }
  .product-hero-image { min-height: 0; margin: .55rem; aspect-ratio: .8; border-radius: 1.05rem; }
  .anchor-nav { top: 65px; }
  .product-design { padding-left: 16px; padding-right: 16px; }
  .design-image { min-height: 0; aspect-ratio: .86; border-radius: 1.25rem; }
  .detail-visual-grid { grid-template-columns: 1fr; gap: .75rem; }
  .detail-visual-grid .product-visual, .detail-visual-grid .product-visual:not(.product-visual-wide) { height: auto; aspect-ratio: 1.22; }
  .visual-detail-section .detail-list { grid-template-columns: 1fr 1fr; }
  .visual-detail-section .detail-list > div { min-height: 4.4rem; }
  .craft-material-library { margin-top: 4rem; margin-bottom: 4rem; }
  .craft-material-grid { grid-template-columns: 1fr 1fr; gap: .65rem; }
  .craft-material-grid .product-visual-wide { grid-column: 1 / -1; grid-row: auto; }
  .craft-material-grid .product-visual, .craft-material-grid .product-visual:not(.product-visual-wide) { height: auto; aspect-ratio: 1; }
  .craft-material-grid .product-visual-wide { aspect-ratio: 1.25; }
  .product-visual figcaption { min-height: 5.4rem; padding: 1rem; }
  .craft-feature, .testing-grid, .about-origin, .legal-note { border-radius: 1.35rem; }
  .craft-feature > div:first-child, .testing-grid > div:last-child { min-height: 0; aspect-ratio: .9; }
  .craft-feature > div:last-child, .testing-grid > div:first-child { padding: 2.2rem 1.4rem; }
  .about-origin { padding: 2.2rem 1.4rem; }
  .origin-mark { margin-top: 1rem; }
  .origin-mark img { width: 74px; }
  .role-grid { gap: .75rem; }
  .privacy-list { padding-top: 2.5rem; gap: 2rem; }
  .legal-note { margin-bottom: 3rem; padding: 2.2rem 1.4rem; }
  .contact-block { min-height: 30rem; margin-top: 4rem; margin-bottom: .8rem; padding: 3rem 1.45rem; border-radius: 1.45rem; }
  .contact-block h2 { font-size: clamp(2.8rem, 13vw, 3.8rem); }
  .contact-block::before { right: -65%; top: -10%; width: 33rem; }
  .contact-block::after { right: -48%; top: 10%; width: 26rem; }
  .site-footer { margin-bottom: .8rem; padding: 1.6rem; border-radius: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .page-intro-atmosphere span:nth-child(3), .origin-mark img { animation: none; }
  .product-hero-image img, .craft-feature img, .testing-grid img, .design-image img, .product-visual img { transition: none; transform: none; }
}

/* Craft & materials — an editorial atelier, built from supplied source media. */
.craft-atelier-hero,
.craft-touch-band,
.craft-colour-journey,
.craft-archive,
.craft-grid-study,
.craft-observation,
.craft-method,
.craft-standards { width: var(--wide); margin-left: auto; margin-right: auto; }
.craft-atelier-hero {
  --craft-copper: #a46f44;
  isolation: isolate;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(22rem, .82fr);
  min-height: min(790px, calc(100svh - 108px));
  margin-top: clamp(1rem, 2vw, 1.75rem);
  overflow: hidden;
  border: 1px solid rgba(74, 53, 33, .15);
  border-radius: clamp(1.4rem, 2.4vw, 2.5rem);
  background: linear-gradient(136deg, #e3dacd, #f5f1e9 57%, #ded8cb);
  box-shadow: 0 30px 90px rgba(51, 37, 22, .12);
}
.craft-atelier-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: var(--four-loop-texture);
  background-position: 140% -50%;
  background-size: clamp(20rem, 32vw, 34rem);
  background-repeat: repeat;
  opacity: .08;
}
.craft-atelier-hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 43%, rgba(250,247,240,.3) 58%, rgba(255,255,255,.28));
}
.craft-atelier-hero-media { min-height: 100%; overflow: hidden; }
.craft-atelier-hero-media .media-frame,
.craft-atelier-hero-media img { width: 100%; height: 100%; }
.craft-atelier-hero-media img { object-fit: cover; object-position: 50% 58%; filter: saturate(.9) contrast(1.04); }
.craft-atelier-hero-copy { position: relative; z-index: 2; align-self: end; padding: clamp(2rem, 5vw, 6rem); }
.craft-atelier-hero-copy h1 { max-width: 8.2em; margin-bottom: 1.5rem; font-size: clamp(3.35rem, 7.2vw, 7.7rem); }
.craft-atelier-hero-copy > p:not(.eyebrow) { max-width: 25rem; color: #52605a; font-size: clamp(1rem, 1.3vw, 1.16rem); line-height: 1.72; }
.craft-atelier-hero-copy > span { display: block; margin-top: 3.5rem; color: rgba(55, 41, 27, .65); font-size: .63rem; font-weight: 650; letter-spacing: .16em; }
.craft-touch-band {
  display: grid;
  grid-template-columns: minmax(19rem, .9fr) minmax(0, 1.1fr);
  min-height: 39rem;
  margin-top: clamp(4rem, 10vw, 10rem);
  overflow: hidden;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.craft-touch-copy { align-self: center; padding: clamp(2.5rem, 5.5vw, 6rem) clamp(1.5rem, 5vw, 5.5rem) clamp(2.5rem, 5.5vw, 6rem) 0; }
.craft-touch-copy h2 { margin-bottom: 1.45rem; }
.craft-touch-copy > p:not(.eyebrow), .craft-colour-copy > p:not(.eyebrow), .craft-grid-copy > p:not(.eyebrow), .craft-observation p, .craft-method p, .craft-standards > div > p { max-width: 32rem; color: var(--muted); }
.craft-touch-copy ul { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem 1.1rem; margin: 2.4rem 0 0; padding: 0; list-style: none; }
.craft-touch-copy li { display: flex; align-items: baseline; gap: .65rem; padding-top: .7rem; border-top: 1px solid var(--line); font-size: .84rem; }
.craft-touch-copy li span { color: var(--craft-copper); font-size: .65rem; font-weight: 700; letter-spacing: .12em; }
.craft-touch-image { min-height: 100%; overflow: hidden; background: #b9a58f; }
.craft-touch-image .media-frame, .craft-touch-image img { width: 100%; height: 100%; }
.craft-touch-image img { object-fit: cover; object-position: 50% 54%; filter: saturate(.8) contrast(1.06); }
.craft-colour-journey {
  display: grid;
  grid-template-columns: minmax(0, .75fr) minmax(25rem, 1.25fr);
  gap: clamp(2.5rem, 7vw, 8rem);
  align-items: center;
  padding: clamp(5rem, 11vw, 10rem) 0;
}
.craft-colour-image { min-height: 37rem; overflow: hidden; border-radius: 1.6rem 1.6rem 1.6rem 7rem; background: #efe8dc; box-shadow: 0 24px 60px rgba(49, 32, 16, .1); }
.craft-colour-image .media-frame, .craft-colour-image img { width: 100%; height: 100%; }
.craft-colour-image img { object-fit: cover; object-position: 50% 48%; }
.craft-colour-copy h2 { max-width: 10em; margin-bottom: 1.35rem; }
.craft-colour-stages { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .55rem; margin: 2.8rem 0 2rem; padding: 0; list-style: none; }
.craft-colour-stages li { min-height: 8.8rem; padding: 1rem .85rem; border-top: 1px solid var(--ink); background: linear-gradient(180deg, rgba(185, 140, 98, .12), transparent); transition: transform .35s var(--ease-out), background .35s ease; }
.craft-colour-stages li:nth-child(2) { background: linear-gradient(180deg, rgba(116, 132, 96, .15), transparent); }
.craft-colour-stages li:nth-child(3) { background: linear-gradient(180deg, rgba(118, 151, 170, .14), transparent); }
.craft-colour-stages li:nth-child(4) { background: linear-gradient(180deg, rgba(136, 104, 82, .16), transparent); }
.craft-colour-stages li:nth-child(5) { background: linear-gradient(180deg, rgba(103, 124, 110, .15), transparent); }
.craft-colour-stages li:hover { transform: translateY(-.45rem); }
.craft-colour-stages span, .craft-colour-stages small { display: block; }
.craft-colour-stages span { color: var(--craft-copper); font-size: .64rem; font-weight: 700; letter-spacing: .1em; }
.craft-colour-stages strong { display: block; margin: 2.1rem 0 .35rem; font-size: .94rem; font-weight: 650; }
.craft-colour-stages small { color: var(--muted); font-size: .7rem; line-height: 1.5; }
.craft-archive { padding: clamp(4.5rem, 9vw, 8rem) 0; border-top: 1px solid var(--line); }
.craft-archive > header { display: grid; grid-template-columns: .55fr 1.45fr; gap: 2rem; align-items: end; margin-bottom: clamp(2rem, 5vw, 4rem); }
.craft-archive h2 { margin: 0; }
.craft-archive-grid { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: clamp(.75rem, 1.4vw, 1.25rem); }
.craft-archive-card { position: relative; min-height: 28rem; margin: 0; overflow: hidden; border-radius: 1.5rem; background: #d8cdc0; }
.craft-archive-card.is-wide { min-height: 38rem; }
.craft-archive-card .media-frame, .craft-archive-card img { width: 100%; height: 100%; }
.craft-archive-card img { object-fit: cover; transition: transform 1.1s var(--ease-out), filter .45s ease; }
.craft-archive-card::after { content: ""; position: absolute; inset: auto 0 0; height: 47%; pointer-events: none; background: linear-gradient(transparent, rgba(18, 22, 19, .74)); }
.craft-archive-card figcaption { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: 2rem 1fr; gap: .55rem; padding: 1.45rem; color: #f4f0e8; }
.craft-archive-card figcaption > span { color: rgba(244,240,232,.72); font-size: .67rem; font-weight: 700; letter-spacing: .12em; }
.craft-archive-card figcaption strong { font-size: clamp(1.05rem, 1.6vw, 1.4rem); font-weight: 650; }
.craft-archive-card figcaption p { grid-column: 2; margin: .25rem 0 0; color: rgba(244,240,232,.78); font-size: .78rem; }
.craft-archive-card:hover img { transform: scale(1.035); filter: saturate(1.03); }
.craft-grid-study { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(22rem, .88fr); overflow: hidden; background: #17231e; color: #edf3e9; border-radius: clamp(1.5rem, 2.5vw, 2.5rem); box-shadow: 0 26px 70px rgba(11, 21, 17, .2); }
.craft-grid-media { isolation: isolate; position: relative; min-height: 43rem; overflow: hidden; background: #cbd0c8; }
.craft-grid-media .media-frame, .craft-grid-media img { width: 100%; height: 100%; }
.craft-grid-media img { object-fit: cover; object-position: 50% 28%; filter: saturate(.62) contrast(1.08); }
.craft-grid-media::before { content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(10,21,17,.05), rgba(10,21,17,.34)); mix-blend-mode: multiply; }
.craft-grid-scan { position: absolute; z-index: 2; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 42%, rgba(210, 188, 148, .52) 49%, transparent 56%) 0 0 / 240% 100%; animation: craft-grid-scan 8s ease-in-out infinite; }
@keyframes craft-grid-scan { 0%, 24% { background-position: 100% 0; } 64%, 100% { background-position: -100% 0; } }
.craft-grid-copy { align-self: center; padding: clamp(2.4rem, 5.5vw, 6rem); }
.craft-grid-copy h2 { margin-bottom: 1.35rem; }
.craft-grid-copy > p:not(.eyebrow) { color: rgba(237,243,233,.72); }
.craft-grid-nodes { display: grid; gap: .55rem; margin-top: 2.6rem; }
.craft-grid-node { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: .25rem .6rem; width: 100%; padding: .95rem 0; color: inherit; text-align: left; border: 0; border-top: 1px solid rgba(237,243,233,.2); background: transparent; cursor: pointer; transition: padding-left .3s var(--ease-out), color .3s ease; }
.craft-grid-node:hover, .craft-grid-node:focus-visible, .craft-grid-node.is-active { padding-left: .7rem; color: #e2c08d; outline: none; }
.craft-grid-node span { grid-row: span 2; font-size: .65rem; font-weight: 700; letter-spacing: .12em; }
.craft-grid-node strong { font-size: .92rem; font-weight: 650; }
.craft-grid-node small { color: rgba(237,243,233,.64); font-size: .76rem; line-height: 1.45; }
.motion-ready .craft-grid-study .craft-grid-node { opacity: .62; transform: translateY(.6rem); }
.motion-ready .craft-grid-study.is-in-view .craft-grid-node { opacity: 1; transform: none; }
.motion-ready .craft-grid-study.is-in-view .craft-grid-node:nth-child(2) { transition-delay: .07s; }
.motion-ready .craft-grid-study.is-in-view .craft-grid-node:nth-child(3) { transition-delay: .14s; }
.motion-ready .craft-grid-study.is-in-view .craft-grid-node:nth-child(4) { transition-delay: .21s; }
.craft-observation { display: grid; grid-template-columns: minmax(22rem, .85fr) minmax(0, 1.15fr); margin-top: clamp(4rem, 10vw, 10rem); overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.craft-observation > div:first-child { align-self: center; padding: clamp(3rem, 6vw, 6rem) clamp(2rem, 5vw, 5rem) clamp(3rem, 6vw, 6rem) 0; }
.craft-observation h2 { margin-bottom: 1.35rem; }
.craft-observation-image { min-height: 36rem; overflow: hidden; }
.craft-observation-image .media-frame, .craft-observation-image img { width: 100%; height: 100%; }
.craft-observation-image img { object-fit: cover; filter: saturate(.82) contrast(1.03); }
.craft-method { position: relative; display: grid; grid-template-columns: .45fr 1.55fr; gap: clamp(2rem, 7vw, 8rem); align-items: center; padding: clamp(5rem, 12vw, 11rem) clamp(1.5rem, 6vw, 7rem); background: radial-gradient(circle at 24% 57%, rgba(188, 143, 94, .22), transparent 29%), linear-gradient(135deg, #ece6da, #dfe8df); overflow: hidden; }
.craft-method::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: var(--four-loop-texture); background-size: clamp(18rem, 29vw, 28rem); background-position: 70% 30%; opacity: .08; }
.craft-method > * { position: relative; z-index: 1; }
.craft-method-mark { display: grid; place-items: center; width: clamp(7rem, 13vw, 13rem); aspect-ratio: 1; border: 1px solid rgba(69, 77, 65, .2); border-radius: 50%; box-shadow: 0 0 0 1.2rem rgba(255,255,255,.26), 0 0 0 3rem rgba(116, 101, 72, .05); }
.craft-method-mark img { width: 44%; animation: craft-mark-breathe 7s ease-in-out infinite; }
@keyframes craft-mark-breathe { 50% { transform: rotate(8deg) scale(1.06); } }
.craft-method h2 { margin-bottom: 1.35rem; }
.craft-standards { display: grid; grid-template-columns: minmax(22rem, 1fr) minmax(24rem, 1fr); gap: clamp(2.5rem, 8vw, 10rem); align-items: end; padding: clamp(5rem, 10vw, 9rem) 0; }
.craft-standards h2 { margin-bottom: 1.4rem; }
.craft-standards-groups { display: grid; gap: 2.2rem; }
.craft-standards-groups section { padding-top: 1rem; border-top: 1px solid var(--line); }
.craft-standards-groups section > p { margin-bottom: 1rem; color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.standards-badges, .standards-words { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.standards-badges span { display: inline-grid; min-width: 8.6rem; min-height: 3.2rem; place-items: center; padding: .7rem 1rem; border-radius: 999px; color: #f8f7f1; font-size: .78rem; font-weight: 750; letter-spacing: .06em; }
.badge-oeko { background: #0a7e69; }
.badge-grs { border-radius: 1.1rem !important; background: #3c8292; }
.standards-words span { padding: .55rem 0; margin-right: 1.1rem; color: var(--ink); font-size: clamp(1rem, 1.7vw, 1.35rem); font-weight: 700; letter-spacing: -.03em; }
html[data-theme="dark"] .craft-atelier-hero { background: linear-gradient(137deg, #202820, #1a211d 58%, #2b2720); border-color: rgba(231, 230, 218, .13); box-shadow: 0 30px 90px rgba(0,0,0,.34); }
html[data-theme="dark"] .craft-atelier-hero::before { opacity: .05; filter: invert(1); }
html[data-theme="dark"] .craft-atelier-hero::after { background: linear-gradient(90deg, transparent 42%, rgba(8, 13, 11, .23) 60%, rgba(7,12,10,.45)); }
html[data-theme="dark"] .craft-atelier-hero-copy > p:not(.eyebrow), html[data-theme="dark"] .craft-atelier-hero-copy > span { color: rgba(234,241,234,.7); }
html[data-theme="dark"] .craft-touch-band, html[data-theme="dark"] .craft-archive, html[data-theme="dark"] .craft-observation { border-color: rgba(236,243,235,.16); }
html[data-theme="dark"] .craft-colour-stages li { border-color: rgba(236,243,235,.45); background-color: rgba(255,255,255,.025); }
html[data-theme="dark"] .craft-archive-card { background: #1c2822; }
html[data-theme="dark"] .craft-method { background: radial-gradient(circle at 24% 57%, rgba(177, 127, 78, .18), transparent 29%), linear-gradient(135deg, #1c2821, #17251f); }
html[data-theme="dark"] .craft-method::after { opacity: .055; filter: invert(1); }
html[data-theme="dark"] .craft-method-mark { border-color: rgba(237,243,235,.18); box-shadow: 0 0 0 1.2rem rgba(255,255,255,.035), 0 0 0 3rem rgba(176, 133, 79, .07); }
html[data-theme="dark"] .craft-standards-groups section { border-color: rgba(236,243,235,.16); }
html[data-theme="dark"] .standards-words span { color: #f0f5ef; }
@media (max-width: 900px) {
  .craft-atelier-hero { grid-template-columns: 1fr; min-height: auto; }
  .craft-atelier-hero-media { min-height: 34rem; }
  .craft-atelier-hero-copy { padding-top: 3.25rem; }
  .craft-atelier-hero::after { background: linear-gradient(180deg, transparent 42%, rgba(249,246,238,.32)); }
  .craft-touch-band, .craft-grid-study, .craft-observation { grid-template-columns: 1fr; }
  .craft-touch-image, .craft-observation-image { min-height: 32rem; }
  .craft-colour-journey { grid-template-columns: .7fr 1.3fr; gap: 2.4rem; }
  .craft-colour-image { min-height: 33rem; }
  .craft-colour-stages { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .craft-archive > header { grid-template-columns: 1fr; gap: .7rem; }
  .craft-standards { grid-template-columns: 1fr; gap: 3rem; }
}
@media (max-width: 560px) {
  .craft-atelier-hero { margin-top: .8rem; border-radius: 1.45rem; }
  .craft-atelier-hero-media { min-height: 20rem; }
  .craft-atelier-hero-media img { object-position: 56% 58%; }
  .craft-atelier-hero-copy { min-height: 23rem; padding: 2rem 1.4rem 2.4rem; }
  .craft-atelier-hero-copy h1 { margin-bottom: 1rem; font-size: clamp(3.1rem, 14.8vw, 4.25rem); }
  .craft-atelier-hero-copy > p:not(.eyebrow) { font-size: .95rem; }
  .craft-atelier-hero-copy > span { margin-top: 2.2rem; }
  .craft-touch-band { min-height: 0; margin-top: 4rem; }
  .craft-touch-copy { padding: 2.8rem 0 2.5rem; }
  .craft-touch-copy ul { grid-template-columns: 1fr; margin-top: 1.8rem; }
  .craft-touch-image { min-height: 26rem; margin: 0 -16px; }
  .craft-colour-journey { grid-template-columns: 1fr; gap: 2rem; padding: 4.5rem 0; }
  .craft-colour-image { min-height: 17rem; border-radius: 1.2rem 1.2rem 1.2rem 4.8rem; }
  .craft-colour-stages { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; margin-top: 2rem; }
  .craft-colour-stages li { min-height: 7.3rem; padding: .8rem .72rem; }
  .craft-colour-stages strong { margin-top: 1.35rem; font-size: .84rem; }
  .craft-colour-stages small { font-size: .65rem; }
  .craft-archive { padding: 4rem 0; }
  .craft-archive-grid { grid-template-columns: 1fr 1fr; gap: .65rem; }
  .craft-archive-card, .craft-archive-card.is-wide { min-height: 15.5rem; border-radius: 1rem; }
  .craft-archive-card.is-wide { grid-column: 1 / -1; min-height: 21rem; }
  .craft-archive-card figcaption { grid-template-columns: 1.4rem 1fr; padding: 1rem; }
  .craft-archive-card figcaption p { font-size: .68rem; }
  .craft-grid-study { border-radius: 1.45rem; }
  .craft-grid-media { min-height: 15.5rem; }
  .craft-grid-copy { padding: 2.6rem 1.4rem; }
  .craft-grid-node { grid-template-columns: 1.65rem minmax(0, 1fr); }
  .craft-observation { margin-top: 4rem; }
  .craft-observation > div:first-child { padding: 2.8rem 0 2.4rem; }
  .craft-observation-image { min-height: 23rem; margin: 0 -16px; }
  .craft-method { grid-template-columns: 1fr; gap: 2.4rem; padding: 3.8rem 1.4rem; }
  .craft-method-mark { width: 7rem; }
  .craft-standards { gap: 2.4rem; padding: 4.5rem 0; }
  .standards-badges span { min-width: 7.3rem; min-height: 2.8rem; font-size: .66rem; }
  .standards-words { gap: .35rem 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .craft-grid-scan, .craft-method-mark img { animation: none; }
  .craft-archive-card img { transition: none; transform: none; }
}

/* Craft refresh — material studies are editorial, tactile and local-first. */
.craft-media-frame { display: block; }
.craft-colour-composition { position: relative; min-width: 0; }
.craft-colour-composition .craft-colour-image { min-height: clamp(31rem, 46vw, 42rem); }
.craft-colour-composition .craft-colour-image img { object-position: 50% 52%; }
.craft-colour-studies { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; width: calc(100% - 2.5rem); margin: -5.5rem 0 0 2.5rem; }
.craft-colour-studies figure { min-width: 0; margin: 0; overflow: hidden; border: 1px solid rgba(38, 44, 38, .14); border-radius: 1rem; background: #e9e2d6; box-shadow: 0 18px 35px rgba(28, 23, 16, .14); }
.craft-colour-studies .media-frame { display: block; aspect-ratio: .8; }
.craft-colour-studies img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease-out); }
.craft-colour-studies figure:hover img { transform: scale(1.05); }
.craft-colour-studies figcaption { display: grid; gap: .18rem; padding: .7rem .75rem .8rem; background: color-mix(in srgb, var(--paper) 88%, transparent); }
.craft-colour-studies strong { font-size: .74rem; font-weight: 720; }
.craft-colour-studies span { color: var(--muted); font-size: .64rem; line-height: 1.35; }
.craft-archive-card .craft-media-frame { width: 100%; height: 100%; }
.craft-archive-card--craft-archive-paint-palette img { object-position: 54% 52%; filter: saturate(.84) contrast(1.05); }
.craft-archive-card--craft-archive-painted-prototype img { object-position: 50% 50%; filter: saturate(.9) contrast(1.05); }
.craft-archive-card--craft-archive-breathability-grid img { object-position: 48% 34%; filter: saturate(.68) contrast(1.1); }
.craft-grid-media { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; align-content: center; padding: .75rem; background: #c7c1b5; }
.craft-grid-visual { position: relative; min-height: 21rem; margin: 0; overflow: hidden; border-radius: 1rem; background: #14231c; }
.craft-grid-visual .media-frame, .craft-grid-visual img { width: 100%; height: 100%; }
.craft-grid-visual img { display: block; object-fit: cover; object-position: 50% 50%; filter: saturate(.76) contrast(1.05); }
.craft-grid-visual figcaption { position: absolute; right: .9rem; bottom: .85rem; left: .9rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; color: #f5f3eb; text-shadow: 0 1px 8px rgba(0,0,0,.55); }
.craft-grid-visual figcaption span { font-size: .62rem; font-weight: 700; letter-spacing: .12em; }
.craft-grid-visual figcaption strong { font-size: .85rem; font-weight: 700; }
.craft-grid-media .craft-grid-scan { z-index: 4; }
.motion-ready .craft-grid-media { display: block; padding: 0; }
.motion-ready .craft-grid-visual { position: absolute; inset: 0; min-height: 0; border-radius: 0; opacity: 0; transform: scale(1.035); pointer-events: none; transition: opacity .55s ease, transform .8s var(--ease-out); }
.motion-ready .craft-grid-visual.is-active { opacity: 1; transform: none; pointer-events: auto; }
.motion-ready .craft-grid-visual:not(.is-active) { visibility: hidden; }
.craft-hand-finish { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(20rem, .8fr); gap: clamp(2rem, 7vw, 8rem); align-items: center; width: var(--wide); margin: clamp(4rem, 10vw, 9rem) auto; padding: clamp(1.2rem, 2vw, 2rem); overflow: hidden; border-radius: clamp(1.5rem, 2.6vw, 2.4rem); color: #f4f2eb; background: radial-gradient(circle at 84% 12%, rgba(187, 138, 85, .22), transparent 28%), #17241e; }
.craft-hand-finish-media { min-height: clamp(25rem, 40vw, 36rem); overflow: hidden; border-radius: 1.1rem; }
.craft-hand-finish-media .media-frame, .craft-hand-finish-media img { display: block; width: 100%; height: 100%; }
.craft-hand-finish-media img { object-fit: cover; object-position: 50% 48%; }
.craft-hand-finish > div:last-child { padding: clamp(1rem, 3vw, 3rem); }
.craft-hand-finish h2 { margin: .9rem 0 1.35rem; }
.craft-hand-finish p:not(.eyebrow) { max-width: 26rem; color: rgba(244, 242, 235, .72); }
.craft-standards-groups { gap: 2.5rem; }
.standards-source-tags { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.standards-source-tags figure { display: grid; grid-template-columns: 4.15rem minmax(0, 1fr); gap: .8rem; align-items: center; min-width: 0; margin: 0; padding: .55rem; border: 1px solid var(--line); border-radius: .9rem; background: color-mix(in srgb, var(--paper) 86%, transparent); }
.standards-source-tags .media-frame { display: block; aspect-ratio: 1; overflow: hidden; border-radius: .62rem; background: #f7f6f2; }
.standards-source-tags img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.standards-source-tags figcaption { display: grid; gap: .2rem; }
.standards-source-tags strong { font-size: .8rem; font-weight: 750; }
.standards-source-tags span { color: var(--muted); font-size: .6rem; line-height: 1.32; }
.standards-words { align-self: center; padding: .9rem .1rem .1rem; }
.mail-action { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; text-decoration: none; }
.mail-icon { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; }
.footer-contact .mail-action { color: var(--muted); font-size: .78rem; }
.button.mail-action .mail-icon { width: 1.2rem; height: 1.2rem; }
.legal-note .mail-action { margin-top: 1rem; }
.mail-feedback { position: fixed; z-index: 120; right: 50%; bottom: max(1.5rem, env(safe-area-inset-bottom)); max-width: min(22rem, calc(100% - 2rem)); padding: .72rem 1rem; color: #f1f8f1; font-size: .78rem; line-height: 1.35; text-align: center; border: 1px solid rgba(239,249,240,.2); border-radius: 99rem; background: rgba(18,48,35,.92); box-shadow: 0 .7rem 2rem rgba(5,20,13,.22); opacity: 0; pointer-events: none; transform: translate(50%, .85rem); transition: opacity .2s ease, transform .2s ease; }
.mail-feedback.is-visible { opacity: 1; transform: translate(50%, 0); }
html[data-theme="dark"] .craft-colour-studies figure, html[data-theme="dark"] .standards-source-tags figure { border-color: rgba(236,243,235,.16); background: rgba(255,255,255,.035); }
html[data-theme="dark"] .craft-colour-studies figcaption { background: rgba(20,35,29,.84); }
html[data-theme="dark"] .craft-colour-studies strong { color: #f0f5ef; }
html[data-theme="dark"] .craft-colour-studies span, html[data-theme="dark"] .standards-source-tags span { color: rgba(237,243,235,.64); }
html[data-theme="dark"] .standards-source-tags .media-frame { background: #e7e5df; }
html[data-theme="dark"] .standards-source-tags strong { color: #f0f5ef; }
@media (max-width: 900px) {
  .craft-colour-composition { align-self: start; }
  .craft-colour-composition .craft-colour-image { min-height: 33rem; }
  .craft-colour-studies { width: calc(100% - 1.5rem); margin: -4rem 0 0 1.5rem; }
  .craft-grid-media { min-height: 38rem; }
  .craft-hand-finish { grid-template-columns: 1.1fr .9fr; gap: 1rem; }
  .craft-hand-finish-media { min-height: 28rem; }
  .standards-source-tags { max-width: 35rem; }
}
@media (max-width: 560px) {
  .craft-colour-composition .craft-colour-image { min-height: 22rem; }
  .craft-colour-studies { gap: .5rem; width: calc(100% - 1rem); margin: -2.75rem 0 0 1rem; }
  .craft-colour-studies figure { border-radius: .75rem; }
  .craft-colour-studies figcaption { min-height: 4rem; padding: .55rem; }
  .craft-colour-studies strong { font-size: .65rem; }
  .craft-colour-studies span { font-size: .55rem; }
  .craft-grid-media { display: grid; grid-template-columns: 1fr; min-height: 0; padding: .55rem; }
  .craft-grid-visual { min-height: 17rem; border-radius: .9rem; }
  .motion-ready .craft-grid-media { min-height: 17rem; padding: 0; }
  .craft-hand-finish { grid-template-columns: 1fr; gap: 0; margin-top: 4rem; padding: .7rem; border-radius: 1.45rem; }
  .craft-hand-finish-media { min-height: 19rem; border-radius: .9rem; }
  .craft-hand-finish > div:last-child { padding: 2rem 1rem 1.5rem; }
  .standards-source-tags { grid-template-columns: 1fr 1fr; gap: .5rem; }
  .standards-source-tags figure { grid-template-columns: 2.95rem minmax(0, 1fr); gap: .5rem; padding: .45rem; border-radius: .7rem; }
  .standards-source-tags strong { font-size: .68rem; }
  .standards-source-tags span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .craft-colour-studies img, .motion-ready .craft-grid-visual { transition: none; }
  .craft-grid-scan { animation: none; }
}

/* Intelligence observatory — an ambient signal system, not another green card. */
.intelligence-hero,
.living-loop {
  --signal: #315f48;
  --signal-bright: #b8ee79;
  --signal-ink: #0b1d17;
  --signal-paper: #f0eee4;
}
.intelligence-hero {
  isolation: isolate;
  position: relative;
  display: grid;
  width: var(--wide);
  min-height: calc(100svh - 104px);
  margin: clamp(1rem, 2vw, 1.75rem) auto clamp(1.25rem, 2.5vw, 2rem);
  overflow: hidden;
  color: var(--signal-ink);
  border: 1px solid rgba(11, 29, 23, .16);
  border-radius: clamp(1.5rem, 2.4vw, 2.4rem);
  background: var(--signal-paper);
  box-shadow: 0 32px 100px rgba(16, 40, 31, .1);
}
.intelligence-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.7), transparent 45%),
    radial-gradient(circle at 76% 36%, rgba(184,238,121,.2), transparent 23%);
}
.intelligence-hero-field { position: absolute; z-index: -1; inset: 0; overflow: hidden; }
.signal-grid {
  position: absolute;
  inset: 0;
  opacity: .32;
  background-image:
    linear-gradient(rgba(28, 73, 55, .11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(28, 73, 55, .11) 1px, transparent 1px);
  background-size: clamp(46px, 5vw, 78px) clamp(46px, 5vw, 78px);
  mask-image: linear-gradient(90deg, transparent 18%, #000 48%, #000 100%);
}
.signal-wave { position: absolute; top: 27%; left: -4%; width: 108%; height: 52%; overflow: visible; }
.signal-wave path { fill: none; vector-effect: non-scaling-stroke; stroke-linecap: round; }
.signal-wave path:nth-child(1) { stroke: var(--signal); stroke-width: 2.3; stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 0 8px rgba(74, 137, 99, .38)); animation: signal-draw 2.4s .25s var(--ease-out) forwards; }
.signal-wave path:nth-child(2), .signal-wave path:nth-child(3) { stroke: rgba(49, 95, 72, .22); stroke-width: 1; stroke-dasharray: .06 .035; animation: signal-drift 9s linear infinite; }
.signal-wave path:nth-child(3) { animation-direction: reverse; animation-duration: 12s; }
.signal-scan {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 18%;
  width: min(22vw, 18rem);
  border-right: 1px solid color-mix(in srgb, var(--signal) 68%, transparent);
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--signal-bright) 10%, transparent));
  filter: drop-shadow(10px 0 16px color-mix(in srgb, var(--signal-bright) 14%, transparent));
  animation: intelligence-scan 7.5s ease-in-out infinite alternate;
}
@keyframes signal-draw { to { stroke-dashoffset: 0; } }
@keyframes signal-drift { to { stroke-dashoffset: -1; } }
@keyframes intelligence-scan { from { transform: translateX(-34vw); } to { transform: translateX(88vw); } }

.intelligence-hero-copy {
  position: relative;
  z-index: 2;
  align-self: end;
  width: min(48rem, 58%);
  padding: clamp(3rem, 7vw, 7rem);
}
.intelligence-hero-copy .eyebrow { color: var(--signal); }
.intelligence-hero-copy h1 { max-width: 9.5em; margin: .7rem 0 1.35rem; font-size: clamp(4rem, 6.8vw, 7.5rem); line-height: .98; }
.intelligence-hero-copy > p:last-child { max-width: 38rem; margin: 0; color: rgba(11,29,23,.64); font-size: clamp(1rem, 1.3vw, 1.2rem); line-height: 1.8; }
.intelligence-hero-console {
  position: absolute;
  z-index: 2;
  top: clamp(2rem, 4vw, 3.5rem);
  right: clamp(2rem, 4vw, 3.5rem);
  display: grid;
  justify-items: end;
  gap: 1.4rem;
  color: var(--signal);
}
.intelligence-hero-console > span { font-size: .61rem; letter-spacing: .16em; }
.intelligence-hero-console > p { display: grid; gap: .2rem; margin: 0; text-align: right; }
.intelligence-hero-console > p strong { font-size: .72rem; letter-spacing: .13em; }
.intelligence-hero-console > p small { color: rgba(11,29,23,.55); font-size: .66rem; }
.signal-orbit { position: relative; display: grid; width: clamp(12rem, 22vw, 21rem); aspect-ratio: 1; place-items: center; }
.signal-orbit i { position: absolute; border: 1px solid color-mix(in srgb, var(--signal) 34%, transparent); border-radius: 50%; animation: signal-orbit 14s linear infinite; }
.signal-orbit i:nth-child(1) { inset: 0; border-style: dashed; }
.signal-orbit i:nth-child(2) { inset: 17%; transform: rotate(34deg) scaleY(.63); animation-direction: reverse; animation-duration: 9s; }
.signal-orbit i:nth-child(3) { inset: 34%; background: color-mix(in srgb, var(--signal-bright) 32%, transparent); border-color: var(--signal); box-shadow: 0 0 0 1rem color-mix(in srgb, var(--signal-bright) 7%, transparent), 0 0 3rem color-mix(in srgb, var(--signal-bright) 28%, transparent); animation: signal-breathe 3.2s ease-in-out infinite; }
.signal-orbit b { z-index: 1; font-size: .62rem; letter-spacing: .16em; }
@keyframes signal-orbit { to { transform: rotate(360deg); } }
@keyframes signal-breathe { 50% { transform: scale(1.12); opacity: .72; } }

.living-loop {
  --living-progress: 0;
  isolation: isolate;
  position: relative;
  min-height: 340svh;
  margin: 0;
  overflow: visible;
  color: var(--signal-ink);
  background: var(--signal-paper);
}
.living-loop::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 100svh;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 49.9%, rgba(32,78,59,.1) 50%, transparent 50.1%),
    radial-gradient(circle at 78% 48%, rgba(184,238,121,.17), transparent 24%);
}
.living-loop::after { content: ""; position: absolute; z-index: 5; right: 0; bottom: 0; left: 0; height: 18svh; pointer-events: none; background: linear-gradient(transparent, #08130f); }
.living-loop-inner {
  position: sticky;
  top: 72px;
  display: grid;
  grid-template-columns: minmax(18rem, .72fr) minmax(0, 1.28fr);
  gap: clamp(2rem, 5vw, 6rem);
  width: min(1480px, calc(100% - 7vw));
  height: calc(100svh - 72px);
  margin: 0 auto;
  padding: clamp(2.5rem, 5vw, 5rem) 0;
  align-items: center;
  overflow: hidden;
}
.living-loop-atmosphere { position: absolute; inset: 0; opacity: 1; pointer-events: none; }
.living-loop-atmosphere span { position: absolute; width: auto; height: auto; border: 1px solid color-mix(in srgb, var(--signal) 18%, transparent); border-radius: 50%; background: transparent !important; filter: none; mix-blend-mode: normal; }
.living-loop-atmosphere span:nth-child(1) { top: 12%; right: -15%; bottom: 16%; left: 44%; transform: rotate(-12deg); }
.living-loop-atmosphere span:nth-child(2) { top: 24%; right: -4%; bottom: 27%; left: 55%; transform: rotate(18deg); }
.living-loop-atmosphere span:nth-child(3) { top: 38%; right: 12%; bottom: 40%; left: 66%; transform: rotate(-23deg); }
.living-loop-copy { position: relative; z-index: 7; max-width: 38rem; }
.living-loop-copy .eyebrow { color: var(--signal); }
.living-loop-copy h2 { max-width: 9ch; margin: .75rem 0 1.2rem; font-size: clamp(3.6rem, 5.6vw, 6.5rem); line-height: .98; }
.living-loop-copy > p:last-of-type { max-width: 34rem; color: rgba(11,29,23,.62); font-size: clamp(.95rem, 1.2vw, 1.1rem); line-height: 1.8; }
.living-loop-meter { display: grid; grid-template-columns: auto 1fr auto; gap: .75rem; align-items: center; width: min(24rem, 100%); margin-top: 2.4rem; color: var(--signal); font-size: .6rem; letter-spacing: .14em; }
.living-loop-meter i { height: 1px; overflow: hidden; background: color-mix(in srgb, var(--signal) 22%, transparent); }
.living-loop-meter b { display: block; width: calc(var(--living-progress) * 100%); height: 100%; background: var(--signal); transition: width .1s linear; }
.living-loop-stage { position: relative; min-height: 0; height: min(72vh, 47rem); margin: 0; }
.living-loop-map { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.living-loop-path-base, .living-loop-path-progress { fill: none; vector-effect: non-scaling-stroke; stroke-linecap: round; }
.living-loop-path-base { stroke: color-mix(in srgb, var(--signal) 21%, transparent); stroke-width: 1.2; stroke-dasharray: .015 .018; }
.living-loop-path-progress { stroke: var(--signal); stroke-width: 2.8; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--living-progress)); filter: drop-shadow(0 0 9px color-mix(in srgb, var(--signal-bright) 52%, transparent)); }
.living-loop-traveler { opacity: 1; filter: drop-shadow(0 0 13px color-mix(in srgb, var(--signal-bright) 78%, transparent)); }
.traveler-halo { fill: color-mix(in srgb, var(--signal-bright) 12%, transparent); stroke: var(--signal); }
.traveler-core { fill: var(--signal-bright); }
.living-loop-core { position: absolute; z-index: 2; top: 43%; left: 49%; display: grid; width: clamp(6rem, 9vw, 8.5rem); aspect-ratio: 1; place-items: center; overflow: hidden; color: #f5f7ec; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: #10291f; box-shadow: 0 0 0 1.2rem rgba(49,95,72,.07), 0 0 5rem rgba(81,140,105,.2); transform: translate(-50%, -50%); }
.living-loop-core span { position: absolute; top: 23%; font-size: .5rem; letter-spacing: .16em; opacity: .58; }
.living-loop-core b { font-size: clamp(.82rem, 1.2vw, 1rem); font-weight: 550; letter-spacing: -.05em; }
.living-loop-core i { position: absolute; bottom: 24%; width: .4rem; aspect-ratio: 1; border-radius: 50%; background: var(--signal-bright); box-shadow: 0 0 1rem var(--signal-bright); animation: signal-breathe 2.4s ease-in-out infinite; }
.living-loop-node {
  position: absolute;
  z-index: 4;
  display: grid;
  grid-template-columns: 1rem auto;
  grid-template-rows: auto auto auto;
  column-gap: .75rem;
  width: min(16rem, 25vw);
  padding: 1rem 1.05rem;
  color: inherit;
  border: 1px solid color-mix(in srgb, var(--signal) 18%, transparent);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--signal-paper) 72%, transparent);
  box-shadow: 0 12px 40px rgba(15,42,31,.05);
  backdrop-filter: blur(12px);
  opacity: .26;
  transform: translateY(12px) scale(.96);
  transition: opacity .45s ease, transform .55s var(--ease-out), border-color .4s ease, background .4s ease, box-shadow .4s ease;
}
.living-node-1 { top: 66%; left: 1%; }
.living-node-2 { top: 10%; left: 24%; }
.living-node-3 { top: 66%; right: 18%; }
.living-node-4 { top: 9%; right: 0; }
.living-node-dot { grid-row: 1 / 4; width: .64rem; height: .64rem; margin-top: .25rem; border: 1px solid var(--signal); border-radius: 50%; background: transparent; }
.living-node-index { color: var(--signal); font-size: .58rem; letter-spacing: .15em; }
.living-loop-node strong { margin-top: .2rem; font-size: clamp(1.25rem, 1.8vw, 1.8rem); }
.living-loop-node small { max-width: 14rem; margin-top: .25rem; color: rgba(11,29,23,.58); font-size: .68rem; line-height: 1.5; }
.living-loop-node.is-reached { opacity: .62; transform: translateY(0) scale(1); }
.living-loop-node.is-current { opacity: 1; border-color: color-mix(in srgb, var(--signal) 64%, transparent); background: color-mix(in srgb, var(--signal-paper) 90%, transparent); box-shadow: 0 18px 56px rgba(29,76,56,.16); transform: translateY(-4px) scale(1.025); }
.living-loop-node.is-current .living-node-dot { background: var(--signal-bright); box-shadow: 0 0 0 .48rem color-mix(in srgb, var(--signal-bright) 11%, transparent), 0 0 1.6rem color-mix(in srgb, var(--signal-bright) 68%, transparent); }

.intelligence-story { color: #f0f5ed; background: #08130f; }
.intelligence-story::before { background: radial-gradient(circle, rgba(184,238,121,.1), transparent 66%); }
.intelligence-story::after { background: radial-gradient(circle, rgba(73,130,101,.16), transparent 67%); }
.story-head .eyebrow, .scene-copy .eyebrow, .scene-index { color: var(--signal-bright); }
.story-scene { border-top-color: rgba(226,246,229,.12); }
.scene-media { border: 1px solid rgba(226,246,229,.11); border-radius: 1.65rem; box-shadow: 0 34px 90px rgba(0,0,0,.34); }
.scene-copy::before { background: var(--signal-bright); }
.scene-aura { background: radial-gradient(circle, rgba(184,238,121,.1), transparent 68%); }
.intelligence-boundaries { gap: 1rem; }
.intelligence-boundaries > article { border-color: var(--line); border-radius: 1.5rem; }
.boundary-media { border-bottom: 1px solid var(--line); }

html[data-theme="dark"] .intelligence-hero,
html[data-theme="dark"] .living-loop { --signal: #b8ee79; --signal-bright: #d8ff9b; --signal-ink: #eff4e9; --signal-paper: #071410; }
html[data-theme="dark"] .intelligence-hero { color: var(--signal-ink); border-color: rgba(224,246,213,.13); background: #071410; box-shadow: 0 32px 100px rgba(0,0,0,.32); }
html[data-theme="dark"] .intelligence-hero::before { background: linear-gradient(90deg, rgba(255,255,255,.018), transparent 45%), radial-gradient(circle at 76% 36%, rgba(184,238,121,.1), transparent 23%); }
html[data-theme="dark"] .signal-grid { opacity: .35; background-image: linear-gradient(rgba(184,238,121,.075) 1px, transparent 1px), linear-gradient(90deg, rgba(184,238,121,.075) 1px, transparent 1px); }
html[data-theme="dark"] .signal-wave path:nth-child(2), html[data-theme="dark"] .signal-wave path:nth-child(3) { stroke: rgba(184,238,121,.16); }
html[data-theme="dark"] .intelligence-hero-copy > p:last-child, html[data-theme="dark"] .intelligence-hero-console > p small { color: rgba(239,244,233,.62); }
html[data-theme="dark"] .living-loop { color: var(--signal-ink); background: #071410; }
html[data-theme="dark"] .living-loop::before { background: linear-gradient(90deg, transparent 49.9%, rgba(184,238,121,.07) 50%, transparent 50.1%), radial-gradient(circle at 78% 48%, rgba(184,238,121,.08), transparent 24%); }
html[data-theme="dark"] .living-loop-copy > p:last-of-type, html[data-theme="dark"] .living-loop-node small { color: rgba(239,244,233,.58); }
html[data-theme="dark"] .living-loop-atmosphere span { border-color: rgba(184,238,121,.1); }
html[data-theme="dark"] .living-loop-node { border-color: rgba(214,255,155,.12); background: rgba(14,36,28,.65); box-shadow: 0 12px 40px rgba(0,0,0,.13); }
html[data-theme="dark"] .living-loop-node.is-current { border-color: rgba(216,255,155,.52); background: rgba(20,48,38,.92); box-shadow: 0 18px 60px rgba(0,0,0,.3), 0 0 2.8rem rgba(184,238,121,.08); }

/* By day, the intelligence narrative becomes a softly lit gallery rather than a dark control room. */
html[data-theme="light"] .intelligence-story { color: #14271f; background: linear-gradient(145deg, #f2f3ec 0%, #e4eee8 52%, #c8ddd0 100%); }
html[data-theme="light"] .intelligence-story::before { background: radial-gradient(circle, rgba(161, 208, 171, .38), transparent 66%); }
html[data-theme="light"] .intelligence-story::after { background: radial-gradient(circle, rgba(73, 130, 101, .18), transparent 67%); }
html[data-theme="light"] .story-head .eyebrow, html[data-theme="light"] .scene-copy .eyebrow, html[data-theme="light"] .scene-index { color: #477b5b; }
html[data-theme="light"] .story-head > p:last-child, html[data-theme="light"] .scene-copy > p:last-child { color: rgba(20, 39, 31, .74); }
html[data-theme="dark"] .story-head > p:last-child, html[data-theme="dark"] .scene-copy > p:last-child { color: rgba(240, 245, 239, .73); }
html[data-theme="light"] .story-scene { border-top-color: rgba(30, 68, 49, .16); }
html[data-theme="light"] .scene-media { border-color: rgba(37, 74, 55, .16); box-shadow: 0 24px 70px rgba(26, 62, 45, .14); }
html[data-theme="light"] .scene-copy::before { background: #74a987; }
html[data-theme="light"] .scene-aura { background: radial-gradient(circle, rgba(112, 177, 133, .2), transparent 68%); }

@media (max-width: 900px) {
  .intelligence-hero { min-height: min(52rem, calc(100svh - 92px)); }
  .intelligence-hero-copy { width: 72%; padding: 3.5rem; }
  .intelligence-hero-copy h1 { font-size: clamp(3.3rem, 9vw, 5.4rem); }
  .living-loop { min-height: 320svh; }
  .living-loop-inner { grid-template-columns: 1fr; grid-template-rows: minmax(0, .43fr) minmax(0, .57fr); gap: .5rem; width: calc(100% - 40px); }
  .living-loop-copy { align-self: center; max-width: 42rem; }
  .living-loop-copy h2 { max-width: 10ch; font-size: clamp(3.2rem, 8vw, 4.8rem); }
  .living-loop-copy > p:last-of-type { max-width: 38rem; }
  .living-loop-stage { width: 100%; height: 100%; min-height: 0; }
  .living-loop-map { inset: -5% -5% 0; width: 110%; height: 108%; }
  .living-loop-core { top: 49%; left: 50%; width: 6.6rem; }
  .living-loop-node { width: min(13rem, 29vw); padding: .78rem; }
  .living-node-1 { top: 64%; left: 1%; }
  .living-node-2 { top: 3%; left: 13%; }
  .living-node-3 { top: 66%; right: 13%; }
  .living-node-4 { top: 6%; right: 0; }
}

@media (max-width: 560px) {
  .intelligence-hero { min-height: calc(100svh - 82px); margin-top: .8rem; border-radius: 1.45rem; }
  .intelligence-hero-copy { width: 100%; padding: 1.45rem; padding-bottom: 3rem; }
  .intelligence-hero-copy h1 { max-width: 9em; font-size: clamp(2.75rem, 12.5vw, 3.35rem); line-height: 1.05; }
  .intelligence-hero-copy > p:last-child { max-width: 20rem; font-size: .9rem; line-height: 1.68; }
  .intelligence-hero-console { top: 1.35rem; right: 1.35rem; gap: .6rem; }
  .intelligence-hero-console > p, .intelligence-hero-console > span { display: none; }
  .signal-orbit { width: 10.5rem; }
  .signal-wave { top: 22%; left: -38%; width: 176%; height: 50%; }
  .signal-grid { mask-image: linear-gradient(180deg, #000, transparent 82%); }
  .signal-scan { width: 7rem; }
  .living-loop { min-height: 300svh; }
  .living-loop::after { height: 12svh; }
  .living-loop-inner { top: 65px; grid-template-columns: 1fr; grid-template-rows: minmax(0, .42fr) minmax(0, .58fr); gap: .4rem; width: calc(100% - 32px); height: calc(100svh - 65px); padding: 1.45rem 0 1rem; }
  .living-loop-copy { align-self: center; }
  .living-loop-copy .eyebrow { margin-bottom: .65rem; font-size: .56rem; }
  .living-loop-copy h2 { max-width: 9ch; margin: .35rem 0 .65rem; font-size: clamp(2.55rem, 12vw, 3.2rem); line-height: 1.01; }
  .living-loop-copy > p:last-of-type { max-width: 22rem; margin-bottom: .8rem; font-size: .78rem; line-height: 1.56; }
  .living-loop-meter { margin-top: .9rem; }
  .living-loop-stage { height: 100%; min-height: 0; margin: 0; }
  .living-loop-map { inset: -5% -12% 0; width: 124%; height: 108%; }
  .living-loop-core { top: 48%; left: 50%; width: 5.2rem; }
  .living-loop-node { width: 46%; padding: .66rem .68rem; border-radius: .8rem; }
  .living-node-1 { top: 63%; left: 0 !important; right: auto !important; }
  .living-node-2 { top: 2%; left: 9% !important; right: auto !important; }
  .living-node-3 { top: 68%; right: 5% !important; left: auto !important; }
  .living-node-4 { top: 7%; right: 0 !important; left: auto !important; }
  .living-loop-node strong { font-size: 1.05rem; }
  .living-loop-node small { display: none; }
  .living-node-index { font-size: .51rem; }
  .living-node-dot { width: .5rem; height: .5rem; }
  .scene-media { border-radius: 1.2rem; }
  .intelligence-boundaries > article { border-radius: 1.2rem; }
}

@media (prefers-reduced-motion: reduce) {
  .signal-wave path, .signal-scan, .signal-orbit i, .living-loop-core i { animation: none; }
  .signal-wave path:nth-child(1) { stroke-dashoffset: 0; }
  .living-loop-node { transition: none; }
}