/* Our Roots. One road, from the country to the work we do. */
.roots-page { --field-paper:#f3f0e7; --field-ink:#173c2e; --field-muted:#5d695f; --field-dark:#102d25; --field-line:#ccd1c2; --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace; --story-nav-height:68px; background:#e7e9df; }
.roots-page main { max-width:1800px; margin-inline:auto; background:var(--field-paper); }
.roots-page .wrap { width:calc(100% - clamp(40px,9vw,160px)); max-width:1560px; }
.roots-page .site-header,.roots-page .site-footer { background:#fbfaf6; }
.roots-page .reading-progress { display:none; }
html:has(.roots-page) { scroll-padding-top:0; }
#story { scroll-margin-top:calc(var(--header) + var(--story-nav-height)); }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.roots-page main h1,.roots-page main h2,.roots-page main h3 { text-wrap:balance; }
.roots-page main em { font-weight:400; }
.field-label,.chapter-mark,.atlas-topline,.atlas-bottomline,.hero-footnote,.story-navigation { font-family:var(--mono); font-size:11px; line-height:1.5; }
.field-label,.chapter-mark { letter-spacing:.1em; text-transform:uppercase; }
.field-label { display:flex; align-items:center; gap:14px; }

/* The familiar truck, with a quieter hint of the precision to come. */
.roots-hero { position:relative; isolation:isolate; overflow:hidden; min-height:700px; min-height:clamp(660px,80svh,850px); color:#fbf5e8; background:#27271c; }
.roots-hero picture { position:absolute; inset:0; z-index:-3; }
.roots-hero-image { width:100%; height:100%; object-fit:cover; object-position:65% center; transform:scale(var(--hero-scale,1)) translate3d(0,var(--hero-y,0px),0); transform-origin:66% 58%; }
.roots-hero-shade { position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,#0c1c16e8,#1420179c 36%,#121d1230 65%,#131b160a),linear-gradient(0deg,#10251fc2,transparent 22%); }
.roots-hero-layout { padding-block:clamp(50px,6vw,96px) 100px; display:grid; grid-template-columns:1.05fr 1fr; }
.hero-label { margin-bottom:28px; color:#e9e7d8; font-size:10px; gap:12px; }
.signal-dot { width:6px; height:6px; border-radius:50%; background:var(--orange); box-shadow:0 0 0 5px #f18a4318; flex-shrink:0; }
.label-rule { height:1px; width:28px; background:currentColor; opacity:.45; }
.roots-hero h1 { font-size:clamp(50px,5.55vw,90px); line-height:1.08; letter-spacing:-.055em; margin:0 0 28px; color:#fbf5e8; }
.hero-line { display:block; letter-spacing:inherit; }
.roots-hero-accent { font-size:.81em; color:#f8a66a; margin-top:10px; }
.roots-hero-accent em { letter-spacing:-.055em; }
.roots-hero-copy .hero-introduction { font-size:16px; line-height:1.8; color:#f1eee3; margin:0 0 28px; }
.story-invitation { display:inline-flex; align-items:center; gap:14px; font-size:13px; font-weight:700; padding:2px 12px 2px 0; min-height:48px; }
.invitation-icon { display:grid; place-items:center; width:42px; height:42px; border:1px solid #dddccc60; border-radius:50%; font-size:23px; font-weight:400; transition:background .25s,color .25s,transform .25s; }
.story-invitation:hover .invitation-icon { background:var(--orange); color:var(--ink); border-color:var(--orange); transform:translateY(3px); }
.hero-footnote { position:absolute; bottom:24px; left:clamp(20px,4.5vw,80px); right:clamp(20px,4.5vw,80px); display:flex; justify-content:space-between; align-items:center; color:#f2eee1ca; border-top:1px solid #fbf5e82e; padding-top:18px; font-size:10px; }
.hero-footnote>span:last-child { display:flex; align-items:center; gap:20px; text-transform:uppercase; letter-spacing:.12em; }
.hero-survey { position:absolute; inset:18% 5.5% 21% 54%; z-index:-1; opacity:.5; pointer-events:none; }
.survey-corner { position:absolute; width:28px; height:28px; border:solid #f7f3d578; }
.survey-corner-a { top:0; left:0; border-width:1px 0 0 1px; }
.survey-corner-b { bottom:0; right:0; border-width:0 1px 1px 0; }
.survey-line { position:absolute; top:50%; right:-12px; width:20px; height:1px; background:#f7f3d578; }
.survey-line::after { content:""; position:absolute; width:1px; height:20px; right:9px; top:-10px; background:inherit; }

/* A usable chapter index doubles as the story's instrument panel. */
.story-navigation { position:sticky; top:var(--header); z-index:30; background:#f8f6efef; backdrop-filter:blur(14px); border-bottom:1px solid var(--field-line); }
.story-navigation-inner { min-height:var(--story-nav-height); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.route-label { display:flex; gap:12px; align-items:center; text-transform:uppercase; letter-spacing:.08em; white-space:nowrap; }
.route-label svg { width:30px; height:22px; stroke:#bd642f; stroke-width:1.5; overflow:visible; }
.story-stops { display:flex; gap:clamp(16px,2.5vw,42px); align-items:center; }
.story-stops a { position:relative; min-height:54px; display:flex; align-items:center; gap:9px; color:#5c695f; transition:color .2s; }
.story-stops a>span { font-size:10px; opacity:.58; }
.story-stops a::after { content:""; position:absolute; height:2px; bottom:9px; left:0; right:0; background:#b95c29; transform:scaleX(0); transform-origin:left; transition:transform .3s; }
.story-stops a:hover,.story-stops a[aria-current] { color:#163b2a; }
.story-stops a[aria-current]::after { transform:scaleX(1); }
.roots-motion { flex-shrink:0; display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:8px 9px; background:none; border:1px solid #173c2e25; color:#324e3f; font-family:var(--mono); font-size:10px; border-radius:3px; }
.roots-motion svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.6; }
.roots-motion .play-glyph { display:none; }
.roots-motion[aria-pressed="true"] .pause-glyph { display:none; }
.roots-motion[aria-pressed="true"] .play-glyph { display:block; }
.roots-motion:hover { background:#173c2e0a; }
.story-progress { position:absolute; height:2px; background:var(--orange); inset:auto 0 -1px; transform-origin:left; transform:scaleX(var(--story-progress,0)); }

/* A contour drawing becomes a circuit, then serves the store. */
.roots-story { background-color:var(--field-paper); color:var(--field-ink); transition:background-color .8s ease,color .8s ease; }
.roots-story-layout { display:grid; grid-template-columns:.94fr 1.06fr; gap:clamp(50px,7vw,120px); align-items:stretch; }
.atlas-column { position:relative; padding-block:80px; min-width:0; }
.roots-atlas { position:sticky; top:calc(var(--header) + var(--story-nav-height) + 34px); }
.atlas-topline { display:flex; align-items:center; justify-content:space-between; padding-bottom:15px; border-bottom:1px solid #173c2e33; color:#526754; text-transform:uppercase; font-size:10px; }
.atlas-kicker { letter-spacing:.12em; }
.atlas-index { opacity:.7; }
.atlas-drawing { margin-top:26px; }
.road-atlas { width:100%; height:auto; max-height:calc(100svh - var(--header) - var(--story-nav-height) - 170px); display:block; overflow:visible; }
.road-atlas path { vector-effect:non-scaling-stroke; }
.atlas-contours { stroke:#9da996; stroke-width:.65; opacity:.48; transition:opacity .9s; }
.atlas-grid { color:#c0d4c3; opacity:0; transition:opacity 1s; }
.atlas-dot-field { color:#4d6c50; opacity:.38; }
.atlas-registration { color:#607d62; stroke-width:.8; opacity:.5; }
.road-bed { stroke:#b98553; stroke-width:22; stroke-linecap:round; stroke-linejoin:round; opacity:.18; transition:stroke-width .9s,opacity .9s; }
.road-line { stroke:url(#road-ink); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.atlas-layer { transition:opacity .65s,transform .8s; }
.atlas-layer circle { fill:var(--field-paper); stroke:#bc622f; stroke-width:2; }
.atlas-layer path { stroke:#b87645; stroke-width:1; }
.atlas-layer text { fill:#3e5945; font-family:var(--mono); font-size:9px; letter-spacing:.065em; }
.atlas-layer .atlas-name { font-family:var(--serif); font-size:23px; letter-spacing:-.03em; fill:#eceddf; }
.atlas-origin-labels path { stroke:#a7b09e; stroke-width:.6; }
.atlas-network-labels,.atlas-store-labels { opacity:0; transform:translateY(12px); }
.atlas-network-labels circle,.atlas-store-labels circle { fill:#102d25; }
.atlas-network-labels text,.atlas-store-labels text { fill:#b3c5b8; }
/* Four kinds of work meet at a shared project. */
.atlas-network-labels .team-field { fill:#456448; stroke:none; opacity:.1; }
.atlas-network-labels .team-field-line { stroke:#7b9974; stroke-width:.6; opacity:.2; }
.atlas-network-labels .team-cable { stroke:#6f8d72; stroke-width:1.2; }
.atlas-network-labels .team-signal { stroke:#ffbb7c; stroke-width:2.7; stroke-linecap:round; stroke-dasharray:.12 .88; stroke-dashoffset:calc(var(--team-progress,.65) * -2 + var(--team-shift,0)); }
.team-signal:nth-of-type(3) { --team-shift:.3; }
.team-signal:nth-of-type(4) { --team-shift:.6; }
.team-signal:nth-of-type(5) { --team-shift:.8; }
.team-desk { transform:translateY(var(--team-lift,0px)); }
.atlas-network-labels .team-shadow,.atlas-network-labels .team-core-shadow { fill:#041b14; stroke:none; opacity:.45; }
.atlas-network-labels .team-desk-legs { fill:#334c38; stroke:#84936b; stroke-width:.7; }
.atlas-network-labels .team-desk-edge { fill:#775432; stroke:#cb9c68; stroke-width:.65; }
.atlas-network-labels .team-desk-top { fill:#af8551; stroke:#d9ba83; stroke-width:.75; }
.atlas-network-labels .team-woodgrain { stroke:#e0b67c; stroke-width:.7; opacity:.35; }
.atlas-network-labels .team-monitor-frame { fill:#557562; stroke:#a8bca0; stroke-width:.8; }
.atlas-network-labels .team-monitor-screen { fill:#112e25; }
.atlas-network-labels .team-monitor-foot { fill:#4c6a53; stroke:#a5b38c; stroke-width:.75; }
.atlas-network-labels .team-monitor-stand { fill:#304e3b; stroke:#93a984; stroke-width:.65; }
.atlas-network-labels .team-power { fill:#fbc17b; stroke:none; }
.atlas-network-labels .team-keyboard { fill:#d4cfac; stroke:#e6dcbc; stroke-width:.6; }
.atlas-network-labels .team-keys { stroke:#5d7559; stroke-width:.6; }
.atlas-network-labels .team-ui-soft { fill:#41654b; }
.atlas-network-labels .team-ui-line { stroke:#b6c299; stroke-width:1.3; }
.atlas-network-labels .team-ui-dark { stroke:#6a7954; stroke-width:1; }
.atlas-network-labels .team-bubble { fill:#c4ce9f; stroke:none; }
.atlas-network-labels .team-notepad-shadow,.atlas-network-labels .team-plan-shadow { fill:#4d462c; opacity:.3; }
.atlas-network-labels .team-notepad { fill:#e2d7b0; stroke:#f4e7c6; stroke-width:.5; }
.atlas-network-labels .team-paper-line { stroke:#84916b; stroke-width:1; }
.atlas-network-labels .team-contact-head,.atlas-network-labels .team-contact-body { fill:#779168; stroke:none; }
.atlas-network-labels .team-phone { fill:#264d38; stroke:#a4b58e; stroke-width:.8; }
.atlas-network-labels .team-plan { fill:#2f5540; stroke:#b5c19b; stroke-width:.75; }
.atlas-network-labels .team-plan-grid { stroke:#7d9a71; stroke-width:.5; opacity:.4; }
.atlas-network-labels .team-flight-route { stroke:#efb779; stroke-width:1.5; stroke-dasharray:.18 .04; stroke-dashoffset:calc(var(--team-progress,.65) * -.5); }
.atlas-network-labels .team-plan-point { fill:#ecbe86; stroke:#385c42; stroke-width:1; }
.team-drone { translate:0 calc(var(--team-progress,.65) * -9px); }
.atlas-network-labels .team-drone-shadow { fill:#051b13; opacity:.28; }
.atlas-network-labels .team-drone-arms { stroke:#d5d3af; stroke-width:4; }
.atlas-network-labels .team-drone-body { fill:#b3b994; stroke:#e3dfb9; stroke-width:.8; }
.atlas-network-labels .team-drone-top { fill:#ebe1b7; stroke:#f4ebce; stroke-width:.6; }
.atlas-network-labels .team-drone-camera { fill:#244e39; stroke:#a0b58a; stroke-width:.8; }
.atlas-network-labels .team-rotor-ring { stroke:#b8c69b; stroke-width:.7; fill:#34594255; }
.atlas-network-labels .team-rotor { stroke:#ebd9a9; stroke-width:1.6; stroke-dasharray:12 3; stroke-dashoffset:calc(var(--team-progress,.65) * -24); }
.atlas-network-labels .team-clipboard { fill:#708365; }
.atlas-network-labels .team-checks { stroke:#48684a; stroke-width:1; }
.atlas-network-labels .team-mug { fill:#e1c996; stroke:#f0dfb1; stroke-width:.7; }
.atlas-network-labels .team-mug-handle { stroke:#e1c996; stroke-width:2; }
.atlas-network-labels .team-mug-rim { fill:#6e5334; stroke:#e5d0a3; stroke-width:.8; }
.atlas-network-labels .team-browser-bar { stroke:#6a8c6a; stroke-width:.6; }
.atlas-network-labels .team-ui-dot { fill:#b8c7a2; stroke:none; }
.atlas-network-labels .team-ui-mountain { fill:#a5b78a; stroke:none; }
.atlas-network-labels .team-ui-button { fill:#e69b60; }
.atlas-network-labels .team-chart { stroke:#c68148; stroke-width:3; }
.atlas-network-labels .team-code-bracket { stroke:#efb477; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.atlas-network-labels .team-code-lines { stroke:#97b486; stroke-width:1.5; }
.atlas-network-labels .team-server { fill:#345a44; stroke:#a3b490; stroke-width:.7; }
.atlas-network-labels .team-server-side { fill:#264b36; stroke:#a3b490; stroke-width:.7; }
.atlas-network-labels .team-server-top { fill:#61816a; stroke:#bdc7a1; stroke-width:.6; }
.atlas-network-labels .team-server-slots { stroke:#b3bf96; stroke-width:1.2; }
.atlas-network-labels .team-core-base { fill:#274c38; stroke:#84a17a; stroke-width:1; }
.atlas-network-labels .team-core-layer { stroke:#7c9b75; stroke-width:.75; }
.atlas-network-labels .team-core-top { fill:#bd7d47; stroke:#f3ba80; stroke-width:1; }
.atlas-network-labels .team-core-inset { fill:#163c2c; stroke:#e4ad76; stroke-width:.8; }
.atlas-network-labels .team-project-shadow { fill:#071f16; opacity:.5; }
.team-project-sheet { translate:0 calc((1 - var(--team-progress,.65)) * -6px); }
.atlas-network-labels .team-project-paper { fill:#dbd5b1; stroke:#f0e5c8; stroke-width:.7; }
.atlas-network-labels .team-project-rule { stroke:#6f8766; stroke-width:1; }
.atlas-network-labels .team-project-block { fill:#9eaf80; }
.atlas-network-labels .team-core-light { stroke:#ffd29b; stroke-width:2; stroke-dasharray:.2 .8; stroke-dashoffset:calc(var(--team-progress,.65) * -2); }
.atlas-network-labels .team-core-port { fill:#f3c18a; stroke:#244c35; stroke-width:1.4; }
.atlas-network-labels .team-name { fill:#ece9d4; font:22px var(--serif); letter-spacing:-.5px; }
.atlas-network-labels .team-role { fill:#b9c7ae; font:9px var(--mono); letter-spacing:.65px; }
.atlas-network-labels .team-label-rule { stroke:#bbab75; stroke-width:.7; opacity:.6; }
.roots-story[data-scene="network"] .atlas-column .road-stroke,.roots-story[data-scene="network"] .atlas-column .road-traveler,.roots-story[data-scene="network"] .atlas-column .road-traveler-halo,.mobile-atlas[data-scene="network"] .road-stroke { opacity:0; }
.atlas-store-labels .store-aura { fill:#dca76b; opacity:.075; filter:blur(18px); }
.atlas-store-labels .store-wire { stroke:#66826d; stroke-width:1; }
.atlas-store-labels .store-signal { stroke:#ffb477; stroke-width:2.5; stroke-linecap:round; stroke-dasharray:.09 .91; stroke-dashoffset:calc(var(--store-progress,.65) * -2 + var(--signal-shift,0)); }
.store-signal[data-store-signal="1"] { --signal-shift:.35; }
.store-signal[data-store-signal="2"] { --signal-shift:.65; }
.store-signal[data-store-signal="3"] { --signal-shift:.1; }
.atlas-store-labels .store-port { fill:#efb880; stroke:#173a2d; stroke-width:1.5; }
.store-world { transform:translateY(var(--store-lift,0px)); }
.atlas-store-labels .store-ground-edge { fill:#253e2f; stroke:#6f7d51; stroke-width:.7; }
.atlas-store-labels .store-ground { fill:#344b35; stroke:#93a373; stroke-width:.8; }
.atlas-store-labels .store-survey { stroke:#96ac78; stroke-width:.5; opacity:.24; }
.atlas-store-labels .store-road-shoulder { fill:#706345; stroke:none; }
.atlas-store-labels .store-dirt-road { fill:#ba8658; stroke:none; }
.atlas-store-labels .store-tire-tracks { stroke:#e4b27c; stroke-width:1.2; opacity:.55; }
.atlas-store-labels .store-ground-detail { stroke:#9caa77; opacity:.3; }
.atlas-store-labels .store-building-shadow { fill:#081c16; opacity:.45; stroke:none; }
.atlas-store-labels .store-wall-side { fill:#456152; stroke:#abc09c; stroke-width:.8; }
.atlas-store-labels .store-siding-side { stroke:#182f25; stroke-width:1; opacity:.4; }
.atlas-store-labels .store-wall-front { fill:#99a07d; stroke:#bfc6a5; stroke-width:.8; }
.atlas-store-labels .store-gable { fill:#84906f; stroke:none; }
.atlas-store-labels .store-siding-front { stroke:#5e7259; stroke-width:.6; }
.atlas-store-labels .store-roof { fill:#bf713e; stroke:#f3bc7f; stroke-width:.8; }
.atlas-store-labels .store-roof-seams { stroke:#e9a56b; stroke-width:.7; }
.atlas-store-labels .store-roof-rim { fill:#804a2d; stroke:none; }
.atlas-store-labels .store-roof-ridge { stroke:#ffd09a; stroke-width:1.4; }
.atlas-store-labels .store-sign { fill:#193c2d; stroke:#e0c690; stroke-width:.7; }
.atlas-store-labels .store-sign-type { fill:#f7e9b9; font:7px var(--mono); letter-spacing:1px; }
.atlas-store-labels .store-window-frame,.atlas-store-labels .store-door-frame { fill:#e8d0a1; }
.atlas-store-labels .store-window { fill:#eeb86d; }
.atlas-store-labels .store-window-bars { stroke:#45614b; stroke-width:1.2; }
.atlas-store-labels .store-door { fill:#244b36; }
.atlas-store-labels .store-door-handle { stroke:#f9d796; stroke-width:1.5; }
.atlas-store-labels .store-side-window { fill:#d3b97c; stroke:#e5cf9e; stroke-width:2; }
.atlas-store-labels .store-porch { fill:#b8a073; stroke:#debd8b; stroke-width:.5; }
.atlas-store-labels .store-porch-edge { fill:#796342; stroke:none; }
.atlas-store-labels .store-awning { fill:#d6bd88; stroke:#e5cf9e; stroke-width:.5; }
.atlas-store-labels .store-awning-stripes { fill:#ba713f; stroke:none; }
.atlas-store-labels .store-awning-edge { fill:#9c653b; stroke:#d9a467; stroke-width:.5; }
.atlas-store-labels .store-porch-posts { stroke:#f1d5a2; stroke-width:2; }
.atlas-store-labels .store-feed-bag { fill:#decd9c; stroke:#7f7854; stroke-width:.6; }
.atlas-store-labels .store-bag-label { fill:#66805c; stroke:none; }
.atlas-store-labels .store-bag-seam { stroke:#a2966c; stroke-width:.5; }
.atlas-store-labels .store-tank-body { fill:#647d70; stroke:#b4c2a5; stroke-width:.7; }
.atlas-store-labels .store-tank-top { fill:#9eaf95; stroke:#c4cdb1; stroke-width:.7; }
.atlas-store-labels .store-tank-rings { stroke:#a0b298; stroke-width:.8; }
.atlas-store-labels .store-fence { stroke:#bfbd8b; stroke-width:1.6; }
.atlas-store-labels .store-grass { stroke:#a3b578; stroke-width:1.2; }
.atlas-store-labels .store-tech-outline { stroke:#fbc387; stroke-width:1; stroke-dasharray:.17 .83; stroke-dashoffset:calc(var(--store-progress,.65) * -1); opacity:.55; }
.atlas-store-labels .store-panel-shadow { fill:#061b15; opacity:.5; }
.atlas-store-labels .store-panel-face { fill:#183b30; stroke:#688471; stroke-width:.8; }
.atlas-store-labels .store-panel-rule { stroke:#607760; stroke-width:.65; opacity:.65; }
.atlas-store-labels .store-panel-status { fill:#f3af71; stroke:none; }
.atlas-store-labels .store-panel-name { fill:#f1ecd7; font:12px var(--sans); font-weight:600; letter-spacing:0; }
.atlas-store-labels .store-panel-purpose { fill:#b9c9b4; font:8px var(--mono); letter-spacing:.35px; }
.atlas-store-labels .store-panel-icon { stroke:#9aaf91; stroke-width:.9; }
.atlas-store-labels .store-panel-arrow { stroke:#e7a768; stroke-width:1; }
.atlas-store-labels .store-ui-surface { fill:#294c3d; }
.atlas-store-labels .store-ui-bag { fill:#c9c19b; stroke:#ded5ae; stroke-width:.5; }
.atlas-store-labels .store-ui-stroke { stroke:#698465; stroke-width:1.5; }
.atlas-store-labels .store-ui-line { stroke:#869d7b; stroke-width:3; stroke-linecap:round; opacity:.6; }
.atlas-store-labels .store-ui-button { fill:#d99259; }
.atlas-store-labels .store-ui-tick { stroke:#dfb978; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.atlas-store-labels .store-ui-avatar { fill:#3b5c46; stroke:none; }
.atlas-store-labels .store-ui-person { fill:#a7b78a; stroke:none; }
.atlas-store-labels .store-ui-boxes path { fill:#37543b; stroke:#acba84; stroke-width:.8; }
.atlas-store-labels .store-ui-boxes path+path { fill:none; }
.roots-story[data-scene="store"] .atlas-column .road-stroke,.roots-story[data-scene="store"] .atlas-column .road-traveler,.roots-story[data-scene="store"] .atlas-column .road-traveler-halo,.mobile-atlas[data-scene="store"] .road-stroke { opacity:0; }
.road-stroke,.road-traveler,.road-traveler-halo { transition:opacity .4s; }
.road-traveler { fill:#f3a05d; stroke:var(--field-paper); stroke-width:2; }
.road-traveler-halo { fill:#f1a36324; stroke:#f1a36350; stroke-width:1; }
.atlas-bottomline { margin-top:22px; border-top:1px solid #173c2e33; padding-top:16px; display:flex; justify-content:space-between; gap:14px; color:#526754; font-size:10px; }
.atlas-compass { white-space:nowrap; }
.roots-story[data-scene="network"],.roots-story[data-scene="store"] { background:var(--field-dark); color:#f2f0e2; }
.roots-story:not([data-scene="origins"]) .atlas-topline,.roots-story:not([data-scene="origins"]) .atlas-bottomline { color:#b3c5b8; border-color:#cadbce33; }
.roots-story:not([data-scene="origins"]) .atlas-contours { opacity:.08; }
.roots-story:not([data-scene="origins"]) .atlas-grid { opacity:.12; }
.roots-story:not([data-scene="origins"]) .atlas-dot-field { color:#b3d1b8; opacity:.4; }
.roots-story:not([data-scene="origins"]) .atlas-origin-labels { opacity:0; transform:translateY(-12px); }
.roots-story:not([data-scene="origins"]) .road-bed { stroke-width:9; opacity:.12; }
.roots-story[data-scene="network"] .atlas-network-labels,.roots-story[data-scene="store"] .atlas-store-labels { opacity:1; transform:none; }
.story-chapter { padding-block:92px; min-height:780px; scroll-margin-top:calc(var(--header) + var(--story-nav-height) + 35px); }
.story-chapter+.story-chapter { border-top:1px solid #7c92784a; }
.chapter-mark { display:flex; align-items:center; gap:18px; color:#65725f; margin-bottom:28px; font-size:10px; }
.chapter-number { display:grid; place-items:center; border:1px solid #a7b19c90; border-radius:50%; height:31px; width:31px; font-size:10px; letter-spacing:0; flex-shrink:0; }
.story-chapter h3 { font-family:var(--serif); font-size:clamp(34px,3.65vw,59px); font-weight:400; line-height:1.2; letter-spacing:-.045em; color:inherit; margin-bottom:32px; }
.story-chapter h3 em { color:#ad572a; letter-spacing:inherit; }
.chapter-text p { font-size:clamp(16px,1.17vw,19px); line-height:1.85; margin-bottom:23px; color:#4b5c4e; transition:color .8s; }
.chapter-text p:last-child { margin-bottom:0; }
.roots-story:not([data-scene="origins"]) .chapter-mark { color:#a8bcaa; }
.roots-story:not([data-scene="origins"]) .chapter-text p { color:#c5d0c4; }
.roots-story:not([data-scene="origins"]) .story-chapter h3 em { color:#f1a267; }
.roots-story:not([data-scene="origins"]) .chapter-number { border-color:#b4c6ad55; }

/* The story's premise becomes the transition into its people. */
.roots-conviction { position:relative; padding-block:100px 110px; background:#e5e9d9; overflow:hidden; }
.conviction-layout { display:grid; grid-template-columns:1fr 1fr; gap:0 8%; position:relative; }
.conviction-label { grid-column:1 / -1; margin-bottom:50px; font-size:10px; color:#536546; }
.conviction-line { margin:0; font-family:var(--serif); font-size:clamp(42px,4.7vw,76px); line-height:1.2; letter-spacing:-.05em; color:#173c2e; }
.conviction-line em { letter-spacing:inherit; }
.conviction-second { padding-top:115px; }
.conviction-second em { color:#af5529; }
.conviction-connection { position:absolute; top:200px; width:120px; height:110px; left:40%; color:#b76532; }
.conviction-connection svg { width:100%; height:100%; stroke:currentColor; stroke-width:1.2; }
.conviction-connection span { position:absolute; width:9px; height:9px; background:currentColor; border-radius:50%; left:-3px; top:7px; }
.roots-motion-ready .conviction-connection { clip-path:inset(0 calc(100% - var(--conviction-progress,1) * 100%) 0 0); }

/* The people are the interface. Native details need no JavaScript. */
.roots-people { padding-block:100px 110px; background:#f3f0e7; scroll-margin-top:calc(var(--header) + var(--story-nav-height) + 20px); }
.people-heading { display:grid; grid-template-columns:1.2fr .8fr; gap:0 8%; align-items:end; margin-bottom:54px; }
.people-heading .chapter-mark { grid-column:1 / -1; }
.people-heading h2 { font-size:clamp(34px,3.9vw,62px); line-height:1.22; letter-spacing:-.045em; margin:0; }
.people-heading h2 em { color:#a8562d; letter-spacing:inherit; }
.people-hint { margin:0 0 4px; color:#62705d; font-size:13px; line-height:1.8; }
.people-roster { border-top:1px solid #b7c0ad; }
.person { border-bottom:1px solid #b7c0ad; transition:background .25s; }
.person summary { list-style:none; display:grid; grid-template-columns:66px 1.15fr 1fr 44px; align-items:center; gap:30px; padding:29px 14px 29px 0; cursor:pointer; }
.person summary::-webkit-details-marker { display:none; }
.person-initials { font-family:var(--mono); font-size:14px; width:56px; height:56px; display:grid; place-items:center; background:#e4e8d9; border:1px solid #b4c0a760; border-radius:50%; transition:background .3s,color .3s,border-color .3s; }
.person h3 { margin:0; font-family:var(--serif); font-size:clamp(24px,2.65vw,40px); font-weight:400; letter-spacing:-.04em; line-height:1.3; }
.person-role { color:#56674f; font-size:12px; line-height:1.6; }
.person-toggle { display:grid; place-items:center; height:42px; width:42px; border:1px solid #c4ccba; border-radius:50%; transition:transform .3s,background .3s; transform:rotate(45deg); }
.person-toggle svg { width:18px; height:18px; stroke:currentColor; }
.person[open] .person-toggle { transform:rotate(-45deg); background:#173c2e; color:#f3f0e7; border-color:#173c2e; }
.person[open] .person-initials,.person summary:hover .person-initials { background:#e3975e; border-color:#e3975e; color:#172f23; }
.person-body { display:grid; grid-template-columns:66px 1fr; gap:30px; padding:0 90px 36px 0; }
.person-rule { align-self:stretch; display:flex; justify-content:center; color:#99a18d; font-family:var(--mono); font-size:10px; }
.person-rule span { padding-top:15px; border-top:1px solid #a0ae95; }
.person-body p { font-size:16px; line-height:1.9; color:#4b5c4e; margin:0; }
@supports (interpolate-size:allow-keywords) {
  .person { interpolate-size:allow-keywords; }
  .person::details-content { block-size:0; overflow:hidden; transition:block-size .45s ease,content-visibility .45s allow-discrete; }
  .person[open]::details-content { block-size:auto; }
}
.roots-final { position:relative; isolation:isolate; overflow:hidden; background:#15392d; color:#f1f0e2; padding-block:110px; }
.roots-final-layout { display:grid; grid-template-columns:1fr 1fr; gap:10%; align-items:start; }
.roots-final .field-label { color:#adc1aa; font-size:10px; margin-bottom:30px; }
.roots-final h2 { font-size:clamp(38px,4.1vw,66px); letter-spacing:-.045em; line-height:1.2; margin:0; }
.roots-final h2 em { color:#f2a168; letter-spacing:inherit; }
.roots-final-copy { padding-top:47px; }
.roots-final-copy p { font-size:17px; color:#c9d2c5; line-height:1.85; margin-bottom:30px; }
.roots-contact { display:flex; justify-content:space-between; gap:30px; padding:18px 24px; border-radius:2px; }
.roots-contact svg { stroke:currentColor; width:24px; height:24px; }
.closing-road { position:absolute; width:65%; top:0; bottom:0; left:-8%; z-index:-1; opacity:.22; }
.closing-road svg { height:100%; width:100%; }
.closing-route { stroke:#93ab75; stroke-width:1; stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--closing-progress,1)); }
.closing-route-halo { stroke:#93ab75; stroke-width:28; opacity:.06; }

/* Finite entrance motion. All content is visible before JavaScript. */
@media (prefers-reduced-motion:no-preference) {
  .roots-motion-ready:not(.roots-motion-paused) .hero-line { animation:roots-type-in .9s cubic-bezier(.2,.7,.2,1) both; }
  .roots-motion-ready:not(.roots-motion-paused) .hero-line:nth-child(2) { animation-delay:.12s; }
  .roots-motion-ready:not(.roots-motion-paused) .hero-line:nth-child(3) { animation-delay:.24s; }
  @keyframes roots-type-in { from { opacity:0; transform:translateY(24px); clip-path:inset(0 0 100% 0); } to { opacity:1; transform:none; clip-path:inset(0); } }
}
.roots-motion-paused .roots-hero-image { transform:none; }
.roots-motion-paused .roots-story,.roots-motion-paused .atlas-layer,.roots-motion-paused .atlas-grid,.roots-motion-paused .road-bed,.roots-motion-paused .atlas-contours,.roots-motion-paused .chapter-text p { transition:none; }
.roots-motion-paused .conviction-connection { clip-path:none; }
.roots-motion-paused .hero-line { animation:none; }
.roots-motion-paused .person::details-content { transition:none; }
html:has(.roots-motion-paused) { scroll-behavior:auto; }
.roots-motion-paused *,.roots-motion-paused *::before,.roots-motion-paused *::after { animation:none!important; transition:none!important; }
.mobile-atlas { display:none; }
@media (min-width:1600px) { .roots-hero-layout { grid-template-columns:1fr 1.2fr; } }
@media (max-width:1100px) {
  .roots-page .wrap { width:calc(100% - 80px); }
  .route-label { display:none; }
  .story-navigation-inner { gap:15px; }
  .story-stops { flex:1; justify-content:space-between; gap:18px; }
  .roots-story-layout { grid-template-columns:.85fr 1.15fr; gap:46px; }
  .atlas-topline,.atlas-bottomline { font-size:9px; }
  .story-chapter { min-height:760px; padding-block:70px; }
  .person summary { gap:20px; grid-template-columns:58px 1.1fr 1fr 42px; }
  .person-role { font-size:11px; }
  .person-body { gap:20px; grid-template-columns:58px 1fr; padding-right:62px; }
}
@media (max-width:760px) {
  .roots-page { --story-nav-height:59px; }
  .roots-page .wrap { width:calc(100% - 40px); }
  .roots-hero { min-height:760px; min-height:max(760px,108svh); }
  .roots-hero-image { object-position:center bottom; }
  .roots-hero-shade { background:linear-gradient(180deg,#101d18cf,#101d18c9 34%,#12261a30 62%,#13251e0a 73%,#10251fa6); }
  .roots-hero-layout { display:block; padding:38px 0 180px; }
  .hero-label { font-size:9px; gap:9px; margin-bottom:28px; }
  .hero-label .label-rule { width:15px; }
  .roots-hero h1 { font-size:clamp(45px,10.5vw,72px); line-height:1.05; margin-bottom:25px; }
  .roots-hero-accent { margin-top:13px; }
  .roots-hero-copy .hero-introduction { font-size:15px; line-height:1.8; margin-bottom:21px; }
  .hero-survey { inset:57% 7% 17% 8%; opacity:.5; }
  .hero-footnote { font-size:9px; bottom:21px; }
  .hero-footnote>span:last-child { gap:10px; }
  .story-navigation-inner { gap:8px; }
  .story-stops { gap:0; }
  .story-stops a { font-size:10px; min-height:58px; min-width:44px; gap:5px; }
  .story-stops a>span { display:none; }
  .roots-motion { border:0; padding:8px; min-width:44px; justify-content:center; }
  .roots-motion>span { display:none; }
  .roots-motion svg { width:18px; height:18px; }
  .roots-story-layout { display:block; position:relative; }
  .atlas-column { padding-block:36px 10px; }
  .roots-atlas { position:relative; top:auto; }
  .atlas-drawing { margin-top:15px; }
  .road-atlas { height:min(390px,83vw); max-height:none; width:100%; }
  .atlas-topline { font-size:9px; }
  .atlas-bottomline { margin-top:10px; padding-top:12px; }
  .story-chapter { padding-block:46px 58px; min-height:0; }
  .chapter-mark { margin-bottom:22px; gap:12px; }
  .story-chapter h3 { font-size:clamp(34px,8vw,48px); line-height:1.22; margin-bottom:26px; }
  .chapter-text p { font-size:16px; line-height:1.85; margin-bottom:22px; }
  .mobile-atlas { display:block; margin:0 0 32px; background:#102d25; --branch-progress:1; }
  .mobile-atlas .road-atlas { height:auto; max-height:380px; }
  .mobile-atlas .atlas-origin-labels { display:none; }
  .mobile-atlas .atlas-contours { opacity:.08; }
  .mobile-atlas .atlas-grid { opacity:.12; }
  .mobile-atlas .atlas-dot-field { color:#b3d1b8; opacity:.4; }
  .mobile-atlas .road-bed { stroke-width:9; opacity:.12; }
  .mobile-atlas[data-scene="network"] .atlas-network-labels,.mobile-atlas[data-scene="store"] .atlas-store-labels { opacity:1; transform:none; }
  .mobile-atlas[data-scene="network"] .atlas-store-labels,.mobile-atlas[data-scene="store"] .atlas-network-labels { display:none; }
  .mobile-atlas .atlas-layer .atlas-name { font-size:26px; }
  .roots-conviction { padding-block:62px 70px; }
  .conviction-layout { display:block; }
  .conviction-label { margin-bottom:32px; }
  .conviction-line { font-size:clamp(36px,8.8vw,58px); line-height:1.23; }
  .conviction-second { padding-top:72px; text-align:right; }
  .conviction-connection { top:160px; left:12px; height:60px; width:80px; }
  .roots-people { padding-block:62px 72px; }
  .people-heading { display:block; margin-bottom:32px; }
  .people-heading h2 { font-size:clamp(31px,7.5vw,47px); margin-bottom:24px; }
  .people-hint { font-size:12px; }
  .person summary { grid-template-columns:42px 1fr 32px; gap:5px 14px; padding:24px 0; }
  .person-initials { grid-row:1 / 3; height:42px; width:42px; font-size:11px; }
  .person h3 { font-size:clamp(21px,5.5vw,28px); grid-column:2; }
  .person-role { grid-column:2; font-size:10px; }
  .person-toggle { grid-column:3; grid-row:1 / 3; height:32px; width:32px; }
  .person-toggle svg { height:15px; width:15px; }
  .person-body { display:block; padding:0 0 28px; }
  .person-rule { display:none; }
  .person-body p { font-size:15px; line-height:1.9; }
  .roots-final { padding-block:65px 72px; }
  .roots-final-layout { display:block; }
  .roots-final .field-label { margin-bottom:25px; }
  .roots-final h2 { font-size:clamp(36px,8.5vw,55px); }
  .roots-final-copy { padding-top:28px; }
  .roots-final-copy p { font-size:16px; }
  .closing-road { width:100%; left:-20%; opacity:.15; }
}
@media (max-width:360px) {
  .roots-page .wrap { width:calc(100% - 32px); }
  .hero-label { font-size:8px; }
  .roots-hero h1 { font-size:44px; }
  .story-stops a { font-size:9px; }
  .story-navigation-inner { gap:4px; }
  .person summary { column-gap:10px; }
}
@media (max-height:730px) and (min-width:761px) {
  .roots-atlas { top:calc(var(--header) + var(--story-nav-height) + 20px); }
  .atlas-drawing { margin-top:12px; }
  .atlas-bottomline { margin-top:10px; padding-top:10px; }
}
@media (prefers-reduced-motion:reduce) {
  html:has(.roots-page) { scroll-behavior:auto; }
  .roots-page { scroll-behavior:auto; }
  .roots-page *,.roots-page *::before,.roots-page *::after,.roots-page ::details-content { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .roots-hero-image { transform:none!important; }
  .conviction-connection { clip-path:none!important; }
}
@media print {
  .story-navigation,.hero-survey,.hero-footnote,.atlas-column,.closing-road { display:none; }
  .roots-page .roots-story,.roots-conviction,.roots-final,.roots-people { background:white!important; color:black!important; }
  .roots-page .roots-story-layout,.roots-final-layout { display:block; }
  .story-chapter { min-height:0; padding-block:30px; }
  .chapter-text p,.roots-final-copy p { color:#222!important; }
  .person::details-content { display:block!important; content-visibility:visible!important; block-size:auto!important; }
}
