/* astra1 2026-11-03 — every page gets deliberate visual pacing. */
.visual-art{margin:clamp(40px,6vw,130px) 0;position:relative;isolation:isolate}
.visual-art img{display:block;width:100%;height:auto;max-height:980px;object-fit:cover;border-radius:24px;box-shadow:0 35px 80px #0006}
.visual-art figcaption{display:flex;justify-content:space-between;gap:24px;margin-top:22px;padding-top:18px;border-top:1px solid #9fc5b133;color:#b3cabd;font-size:clamp(13px,1vw,22px)}
.visual-art figcaption>span,.visual-kicker,.reading-title>span{font-size:11px;letter-spacing:.16em;color:#ff3943}
.visual-art:after{content:'';position:absolute;left:12%;right:12%;bottom:20px;height:20%;background:radial-gradient(ellipse,#d0182430,transparent 70%);z-index:-1;filter:blur(30px)}
.blog-story>h1{max-width:13ch}.blog-story>.lead{max-width:40ch;font-size:clamp(23px,2vw,46px)}
.blog-story>.visual-art{width:88%;margin-left:auto}.blog-story>.visual-art img{aspect-ratio:3/2;max-height:1100px}
.blog-story .visual-reading{max-width:none}.reading-chapter{display:grid;grid-template-columns:1fr 1.15fr;gap:9vw;padding:clamp(40px,5vw,120px) 0;border-top:1px solid #aac9bb30}
.reading-title h2{font-size:clamp(32px,3.6vw,85px)!important;line-height:1.1!important;margin-top:25px!important;max-width:15ch}.reading-copy p{max-width:42em}.reading-chapter:nth-child(even) .reading-title{padding-left:4vw}.reading-chapter:hover h2{color:#ff2938}
.utility-opening{display:grid;grid-template-columns:.8fr 1.2fr;gap:7vw;align-items:center}.utility-opening h1{font-size:clamp(58px,7vw,190px);margin-top:35px;max-width:10ch}.utility-opening .visual-art{margin:0}.utility-page>.article-body{max-width:1000px;margin:clamp(50px,7vw,150px) auto 0}.utility-page .article-body h2{margin-top:65px;border-top:1px solid #a3c7b536;padding-top:35px;color:#ff2938}
.answers-hero>.visual-art{margin:50px 0 70px}.answers-hero>.visual-art img{aspect-ratio:2/1;object-fit:cover}.topic-signal{height:180px;position:relative;width:min(100%,390px);margin:10px 0 35px;background:radial-gradient(ellipse at 50% 85%,#c7192733,transparent 65%)}.topic-signal b{position:absolute;left:18%;top:15px;width:50%;height:95px;border:1px solid #afd7c766;background:linear-gradient(135deg,#b4daca22,#08271c);border-radius:14px;transform:skewY(-9deg);box-shadow:0 15px 30px #0006,inset 0 -2px #ed2438}.topic-signal b:nth-child(2){left:25%;top:30px}.topic-signal b:nth-child(3){left:32%;top:45px}.topic-signal>span{position:absolute;bottom:0;left:0;font-size:10px;letter-spacing:.13em;color:#a1c3b2}.topic-signal.performance b{border-radius:50%;width:95px;left:25%}.topic-signal.visibility b{border-radius:50% 50% 8px 8px}.topic-signal.care b{border-color:#ed243877}.topic-signal.marketing b{border-radius:30px 30px 30px 0}
.about-page .visual-art{max-width:2100px;margin-left:auto;margin-right:auto}.about-page .visual-art img{aspect-ratio:2/1;object-position:center}.about-page #my-bugatti .visual-art{width:88%;margin-left:auto;margin-right:0}
@media(min-width:1000px){.social-story .story-hero{display:grid;grid-template-columns:1fr 1.05fr;gap:4vw;align-items:center}.social-story .story-hero>.section-label{grid-column:1/-1;width:100%}.social-story .social-opening{margin:0}.social-story .story-hero>.story-art{margin:0;max-width:none}.social-story h1{font-size:clamp(62px,6.1vw,185px)}.story-hero-split{gap:4vw}.service-story .story-hero{padding-bottom:90px}}
@media(max-width:750px){.utility-opening,.reading-chapter{grid-template-columns:1fr;gap:25px}.utility-opening h1{max-width:13ch}.utility-opening .visual-art{margin-top:20px}.visual-art img{border-radius:18px}.visual-art figcaption{flex-direction:column;gap:10px}.blog-story>.visual-art,.about-page #my-bugatti .visual-art{width:100%}.reading-chapter:nth-child(even) .reading-title{padding-left:0}.reading-title h2{max-width:22ch}.answers-hero>.visual-art img,.about-page .visual-art img{aspect-ratio:3/2}.topic-signal{height:150px;width:250px}.utility-page .article-body h2{margin-top:40px}}
/* Real work, treated as a considered presentation rather than a lone screenshot. */
.case-study-page>h1{max-width:15ch;font-size:clamp(65px,9vw,260px)}.case-study-page>.lead{max-width:40ch;margin-top:35px}.case-device-pair{position:relative;padding:65px 10% 90px 0;margin-top:65px;background:radial-gradient(ellipse at 50% 88%,#bf152433,transparent 65%)}.case-device-pair .case-desktop{margin:0;max-height:1000px;overflow:auto;border:10px solid #9bbfae;border-bottom-width:20px;border-radius:22px;box-shadow:0 45px 80px #0008;scrollbar-width:thin;scrollbar-color:#c42334 #082016}.case-device-pair .case-desktop img{display:block;width:100%;max-height:none;object-fit:contain;border-radius:0}.case-device-pair .case-desktop figcaption{background:#0a2117;padding:20px;font-size:12px}.case-phone{position:absolute;right:0;bottom:0;width:24%;margin:0;border:6px solid #82b9a2;border-radius:30px;background:#06110c;overflow:hidden;box-shadow:0 30px 60px #0009;transform:rotate(3deg)}.case-phone img{width:100%;display:block}.case-phone figcaption{font-size:8px;letter-spacing:.12em;padding:14px;color:#c2dbce;text-align:center}.case-story-note{display:grid;grid-template-columns:1fr 1fr;gap:9vw;margin:clamp(80px,10vw,240px) 0;padding-top:50px;border-top:1px solid #a8caba38}.case-story-note h2{font-size:clamp(40px,4.7vw,120px);line-height:1.05;margin-top:30px;max-width:15ch}.case-story-note h3{font-size:clamp(25px,2.3vw,55px);color:#ff303c;margin:45px 0 20px}.case-story-note p{max-width:40em}.case-story-note .case-archive-note{font-size:13px;color:#90aa9d;margin-top:35px}.case-device-pair:after{content:'';position:absolute;bottom:0;left:5%;width:80%;height:80px;z-index:-1;background:radial-gradient(ellipse,#fd173c33,transparent 70%)}
@media(max-width:750px){.case-device-pair{padding-top:10px;padding-bottom:65px;margin-top:40px}.case-device-pair .case-desktop{border-width:4px;border-bottom-width:10px;border-radius:12px;max-height:500px}.case-phone{width:30%;border-width:3px;border-radius:15px}.case-phone figcaption{display:none}.case-story-note{grid-template-columns:1fr;gap:30px;margin:70px 0}.case-study-page>h1{font-size:14vw}}
.utility-page h1 i,.blog-story h1 i{font-family:Georgia,serif;font-weight:400;color:#ff2638}.utility-page h1{letter-spacing:-.06em}.blog-story>h1{max-width:20ch}
/* astra1 2026-11-03 — editorial openings hold an image and an idea together. */
@media(min-width:901px){
.blog-story{display:grid;grid-template-columns:1fr 1.12fr;column-gap:5vw;align-items:center}
.blog-story>.section-label{grid-column:1/-1}.blog-story>h1{grid-column:1;font-size:clamp(55px,5.5vw,160px)!important;max-width:14ch;line-height:1.03}.blog-story>.lead{grid-column:1;align-self:start;font-size:clamp(18px,1.4vw,34px);max-width:30em}.blog-story>.visual-art{grid-column:2;grid-row:2/4;width:100%;margin:25px 0 70px}.blog-story>.visual-art img{aspect-ratio:1.1;object-fit:cover;border-radius:40% 40% 24px 24px}.blog-story>.editorial-diagram,.blog-story>.article-body{grid-column:1/-1;width:100%}
.answers-hero{display:grid;grid-template-columns:1fr 1fr;gap:0 5vw}.answers-hero>.section-label{grid-column:1/-1}.answers-hero>h1{grid-column:1;font-size:clamp(58px,5.8vw,170px);line-height:1.05}.answers-hero>.answers-intro{grid-column:1;display:block;margin:30px 0}.answers-intro>div{margin-top:25px}.answers-hero>.visual-art{grid-column:2;grid-row:2/4;margin:0;align-self:center}.answers-hero>.visual-art img{aspect-ratio:1.1;border-radius:50% 50% 18px 18px}.answers-hero>.answers-index{grid-column:1/-1;margin-top:60px}
.about-hero{display:grid;grid-template-columns:1fr 1fr;gap:0 5vw}.about-hero>.section-label{grid-column:1/-1}.about-hero>.about-kicker{grid-column:1;align-self:end}.about-hero>h1{grid-column:1;font-size:clamp(60px,6vw,180px);line-height:1.05;align-self:start}.about-hero>.about-opening-art{grid-column:2;grid-row:2/4;margin:30px 0 60px;width:100%}.about-hero>.about-opening-art img{aspect-ratio:1.1;object-fit:cover;border-radius:45% 45% 20px 20px}.about-hero>.about-hero-bottom{grid-column:1/-1;padding-top:55px;border-top:1px solid #a6c5b233}
.blog-editorial>h1{font-size:clamp(58px,6vw,180px);line-height:1.05}.blog-editorial>.lead{margin:25px 0 45px}.blog-feature{margin-top:35px}.case-study-page>h1{font-size:clamp(55px,6vw,180px);line-height:1.05}.case-device-pair{margin-top:35px;padding-top:15px}
}
.utility-opening .visual-art,.blog-story>.visual-art,.answers-hero>.visual-art,.about-hero>.about-opening-art{opacity:1!important;transform:none!important;animation:none!important}
.utility-opening .visual-art img{border-radius:50% 50% 18px 18px}
@media(max-width:900px){.about-hero>.about-opening-art{margin:40px 0}.about-hero>.about-opening-art img{aspect-ratio:1.15;border-radius:40% 40% 18px 18px}.blog-story>h1{font-size:13vw;line-height:1.03}.blog-story>.visual-art{margin:35px 0}.answers-hero>.visual-art{margin:35px 0}.answers-hero>.visual-art img{aspect-ratio:1.25}.utility-opening{gap:20px}.utility-opening h1{margin-bottom:0}}
.blog-story{display:block}.editorial-opening{display:grid;grid-template-columns:1fr 1.12fr;gap:5vw;align-items:center;margin-bottom:70px}.editorial-opening h1{font-size:clamp(55px,5.5vw,160px);line-height:1.06;max-width:14ch;margin-bottom:30px}.editorial-opening .lead{font-size:clamp(18px,1.4vw,34px);max-width:30em}.editorial-opening>.visual-art{margin:25px 0;width:100%;opacity:1!important;transform:none!important;animation:none!important}.editorial-opening>.visual-art img{aspect-ratio:1.1;object-fit:cover;border-radius:40% 40% 24px 24px}
.about-hero>.about-introduction{grid-column:1;align-self:center}.about-introduction>h1{font-size:clamp(60px,6vw,180px);line-height:1.05;margin:25px 0 35px}.about-introduction>.about-lead{font-size:clamp(21px,1.7vw,42px);max-width:25em;line-height:1.4}.about-hero>.about-opening-art{grid-row:2;grid-column:2}.about-introduction>.about-kicker{margin:0}
@media(max-width:900px){.editorial-opening{display:block;margin-bottom:40px}.editorial-opening h1{font-size:13vw}.editorial-opening>.visual-art{margin:35px 0}.about-introduction>h1{font-size:13vw}.about-introduction>.about-lead{font-size:22px}}
