/* astra1 2026-11-03 — original interactive design story, no recycled page artwork. */
.design-story{background:#06110c;color:#e0e9df;overflow:clip}.design-story section{padding:clamp(65px,7vw,200px) var(--pad)}.design-story .design-hero{padding-top:calc(var(--nav-height) + 60px)}.design-hero .section-label{margin-bottom:65px}.design-hero-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:6vw;align-items:center}.design-story h1{font-size:clamp(68px,8vw,250px);line-height:.93;letter-spacing:-.065em}.design-story h2{font-size:clamp(48px,5.5vw,170px);line-height:1.02}.design-story i,.design-story em{color:#ff2424!important;-webkit-text-fill-color:#ff2424!important;background:none!important}.design-story p{color:#b7c8bd;max-width:42em}.design-hero-grid p{margin-top:30px;font-size:clamp(17px,1.15vw,28px)}.design-hero-grid .design-lead{font-size:clamp(23px,1.8vw,48px);line-height:1.4;color:#d5e7dc}.design-intro-art{position:relative;align-self:stretch;min-height:460px}.design-intro-art img{height:100%;object-fit:cover;border-radius:48% 48% 4px 4px;mask-image:linear-gradient(#000 85%,transparent)}.design-intro-art>span{position:absolute;bottom:20px;left:25px;font-size:10px;letter-spacing:.16em}.design-cta{display:inline-flex;align-items:center;gap:35px;margin-top:35px;padding:18px 27px;border:1px solid #ff344872;border-radius:60px;box-shadow:0 15px 32px #e00a1c19;font-size:clamp(14px,1vw,23px)}.design-cta:hover{background:#7b091b;box-shadow:0 15px 40px #e00a1c40}.design-demo-section{background:#0c201a}.design-section-top{display:grid;grid-template-columns:1fr 2fr;gap:35px 7vw;align-items:start}.design-section-top>p{grid-column:2;font-size:clamp(18px,1.25vw,29px)}.design-story .eyebrow{color:#9ec8b5;display:block}.design-section-top .eyebrow{padding-top:15px}.demo-controls{display:flex;justify-content:center;gap:8px;margin:55px 0 30px}.demo-controls button{border:1px solid #9ccfb43b;border-radius:30px;padding:12px 25px;font-size:16px;min-height:46px}.demo-controls button[aria-pressed=true]{background:#c4e3d3;color:#082017;border-color:#c4e3d3}.demo-floor{position:relative;min-height:540px;padding:20px 0 100px;perspective:1300px;background:radial-gradient(ellipse at 50% 88%,#b9142645,transparent 55%);display:flex;justify-content:center;align-items:start}.demo-device{width:90%;max-width:1800px;border:clamp(5px,.7vw,18px) solid #82b29d;border-bottom-width:14px;border-radius:24px;background:#06130d;box-shadow:0 25px 40px #0008,0 0 0 1px #d4ecdf90;overflow:hidden;transition:width .7s cubic-bezier(.2,.7,.2,1);-webkit-box-reflect:below 10px linear-gradient(transparent 75%,#ffffff16);container-type:inline-size}.demo-chrome{display:flex;gap:6px;padding:12px 16px;background:#162b23;align-items:center}.demo-chrome>span{width:5px;height:5px;border-radius:50%;background:#8fae9e}.demo-chrome small{font-size:9px;letter-spacing:.12em;margin-left:12px}.demo-site-nav{display:flex;justify-content:space-between;align-items:center;padding:22px 4%;font-size:12px;border-bottom:1px solid #ffffff24}.demo-site-nav b{letter-spacing:.1em}.demo-site-nav>span{color:#c4d5cb}.demo-content{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:3%;padding:5%}.demo-content h3{font-size:clamp(24px,4.4cqw,105px);line-height:1.04;letter-spacing:-.04em;margin:20px 0}.demo-content p{font-size:clamp(12px,1.2cqw,23px)}.demo-eyebrow{font-size:clamp(8px,.8cqw,15px);letter-spacing:.13em;color:#a1c8b5}.demo-content img{aspect-ratio:1.12;object-fit:cover;border-radius:45% 45% 3px 3px}.demo-fake-button{display:inline-block;border:1px solid #ff394b;padding:12px 18px;margin-top:22px;border-radius:30px;font-size:clamp(10px,1cqw,18px)}.demo-strip{display:flex;justify-content:space-between;border-top:1px solid #ffffff25;padding:20px 5%;font-size:clamp(10px,1cqw,18px);color:#9cbaaa}.demo-device[data-size=tablet]{width:62%}.demo-device[data-size=phone]{width:30%;min-width:260px}.demo-device[data-size=phone] .demo-content{grid-template-columns:1fr;padding:8%}.demo-device[data-size=phone] .demo-content h3{font-size:10cqw}.demo-device[data-size=phone] .demo-content img{aspect-ratio:1.8;margin-top:20px;border-radius:40px 40px 3px 3px}.demo-device[data-size=phone] .demo-site-nav>span{display:none}.demo-device[data-size=phone] .demo-strip{flex-wrap:wrap;gap:10px}.demo-caption{text-align:center;margin:10px auto;font-size:17px}.demo-note{text-align:center;margin:15px auto 0;font-size:12px!important;color:#89a596!important}.design-journey{display:grid;grid-template-columns:1fr 1fr;gap:10vw}.design-journey h2{margin:30px 0}.journey-rail{list-style:none;padding:0;margin:20px 0;display:flex;flex-direction:column;justify-content:center}.journey-rail li{display:flex;gap:35px;padding:40px 0;border-bottom:1px solid #a6d5bd30}.journey-rail li>span{font-family:Georgia,serif;color:#ff2437;font-size:40px}.journey-rail h3,.foundation-grid h3{font-size:clamp(28px,2.4vw,65px);letter-spacing:-.04em;margin-bottom:16px;line-height:1.15}.design-foundations{background:#10241d}.foundation-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5vw;margin-top:80px}.foundation-grid article{border-top:1px solid #ff263f70;padding-top:28px}.foundation-grid article>span{font-size:11px;color:#acd4bd;letter-spacing:.15em}.foundation-grid h3{margin-top:30px}.design-partnership h2{margin:35px 0 50px}.design-partnership-copy{display:grid;grid-template-columns:1fr 1fr;gap:9vw}.design-partnership-copy p{margin:0}.design-path-links{display:flex;flex-wrap:wrap;gap:30px;margin-top:45px;font-size:clamp(14px,1vw,23px)}.design-path-links a,.design-more{text-decoration:underline;text-underline-offset:7px}.design-next{background:#0c1c16}.design-next h2{margin:35px 0}.design-more{display:inline-block;margin:25px;font-size:16px}@media(max-width:900px){.design-hero-grid,.design-journey{grid-template-columns:1fr}.design-intro-art{min-height:0;max-height:550px;margin-top:30px}.design-intro-art img{aspect-ratio:1.4}.design-section-top{grid-template-columns:1fr}.design-section-top>p{grid-column:1}.foundation-grid{gap:25px}.design-hero .section-label span:last-child{display:none}.demo-device{width:100%}.demo-device[data-size=tablet]{width:80%}.demo-device[data-size=phone]{width:45%}.demo-floor{min-height:400px}}@media(max-width:550px){.design-story h1{font-size:18vw}.design-story h2{font-size:12vw}.design-story .design-hero{padding-top:140px}.foundation-grid,.design-partnership-copy{grid-template-columns:1fr;gap:35px}.demo-controls{gap:5px}.demo-controls button{padding:11px 18px;font-size:14px}.demo-device[data-size=tablet]{width:92%}.demo-device[data-size=phone]{width:85%;min-width:0}.demo-device .demo-site-nav{font-size:8px}.demo-chrome small{font-size:6px}.demo-content h3{font-size:23px}.demo-content p{font-size:10px}.demo-content .demo-fake-button{padding:8px;font-size:9px}.demo-strip{font-size:8px}.demo-floor{min-height:0}.demo-caption{font-size:15px}.design-more{margin-left:0}.journey-rail li{gap:20px}.design-cta{gap:15px}}@media(prefers-reduced-motion:reduce){.demo-device{transition:none}}.no-motion .demo-device{transition:none}

/* astra1 2026-11-03 — real homepage composition, distinct device dimensions. */
.demo-device{width:100%;max-width:1500px;transition:width .45s ease,max-width .45s ease;border-radius:18px}.demo-device[data-size=tablet]{width:72%;max-width:820px;border-radius:28px}.demo-device[data-size=phone]{width:38%;max-width:390px;min-width:250px;border-radius:38px;border-width:9px}.demo-website{max-height:700px;overflow:auto;scrollbar-width:thin;scrollbar-color:#658d7b #10251b}.demo-site-nav{background:#10271d;padding:24px 5%;font-size:clamp(10px,1.3cqw,18px);position:sticky;top:0;z-index:1}.demo-menu-icon{display:none}.demo-content{background:linear-gradient(120deg,#19392a,#06130e);padding:6% 5%;min-height:340px}.demo-content img{border-radius:5px;aspect-ratio:1;box-shadow:0 20px 35px #0006}.demo-content h3{font-size:clamp(27px,5.4cqw,82px)}.demo-home-bottom{display:grid;grid-template-columns:1fr 1fr;gap:26px;padding:35px 5%;background:#d0dfd4;color:#11291d}.demo-home-bottom h4{font-size:clamp(22px,3cqw,40px);line-height:1.1;margin-top:12px}.demo-home-bottom p{color:#324f3c;font-size:clamp(12px,1.3cqw,18px)}.demo-home-bottom .demo-eyebrow{color:#3f6550}.demo-project{grid-column:1/-1;position:relative;height:150px;overflow:hidden;border-radius:4px}.demo-project img{width:100%;height:100%;object-fit:cover;object-position:50% 64%}.demo-project>span{position:absolute;bottom:12px;left:14px;color:white;font-size:10px;letter-spacing:.12em}.demo-device[data-size=tablet] .demo-content{gap:20px}.demo-device[data-size=phone] .demo-menu-icon{display:block}.demo-device[data-size=phone] .demo-site-nav>.demo-nav-links{display:none}.demo-device[data-size=phone] .demo-website{height:620px}.demo-device[data-size=phone] .demo-home-bottom{grid-template-columns:1fr}.demo-device[data-size=phone] .demo-content{min-height:0}.demo-device[data-size=phone] .demo-content img{border-radius:4px;aspect-ratio:1.5}.demo-controls button{cursor:pointer}.demo-controls button:hover{border-color:#ff2439}.demo-controls button:focus-visible{outline:2px solid #ff2439;outline-offset:4px}@media(max-width:550px){.demo-device[data-size=tablet]{width:92%}.demo-device[data-size=phone]{width:80%;min-width:0}.demo-content{min-height:240px}.demo-site-nav{padding:16px 4%}.demo-device[data-size=phone] .demo-site-nav{font-size:10px}.demo-home-bottom{gap:15px;padding:22px 5%}.demo-home-bottom h4{font-size:19px}.demo-project{height:100px}}@media(prefers-reduced-motion:reduce){.demo-device{transition:none}}
.demo-device[data-size=phone] .demo-site-nav>.demo-menu-icon{display:block;color:#d4eadc}
/* astra1 2026-11-03 — crimson response on the three customer-journey titles. */
.journey-rail li h3{transition:color .18s ease}
.journey-rail li:hover h3,.journey-rail li:focus-within h3{color:#ff2424}
@media(prefers-reduced-motion:reduce){.journey-rail li h3{transition:none}}
/* astra1 2026-11-03 — keep the gallery exhibits fully visible. */
.design-intro-art{align-self:center;min-height:0}.design-intro-art img{width:100%;height:auto;aspect-ratio:1.5;object-fit:contain;border-radius:28px;mask-image:none}.design-intro-art>span{display:none}
