/* WebDrawn's experience layer. All information remains in the generated HTML.
   Layout and deliberate motion are independent of the content and form logic. */
:root{--paper:#f5f3ee;--ink:#13151a;--muted:#5b5f64;--blue:#3157ff;--line:#d0d1cd;--ease:cubic-bezier(.22,1,.36,1)}
html{scroll-padding-top:100px}
body{overflow-x:clip}
.wrap{width:min(1440px,calc(100% - 112px))}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
.button{font-size:13px;min-height:54px;padding:16px 25px}
.text-link{font-size:13px;gap:14px}
.eyebrow,.small-label{font-size:10px;letter-spacing:.13em}
.header{background:#f5f3ee;border-bottom:1px solid #d0d1cd80}
.header-inner{height:86px}
.header .brand{width:208px;transition:transform .45s var(--ease);transform-origin:left center}
.header.is-scrolled .brand{transform:scale(.9)}
.header-actions{display:flex;align-items:center;gap:34px}
.header .motion-toggle{margin:0;border:0;font-size:10px;min-height:44px;letter-spacing:.03em}
.header .menu{border:0;gap:20px;min-height:48px;font-size:13px}
.menu-icon{width:26px}
.menu-icon i{height:1px}
.site-menu{background:var(--paper)}
.site-menu .menu-main-links>a{letter-spacing:-.065em;font-size:clamp(38px,5.5vw,76px)}
.site-menu .menu-main-links>a:hover{padding-left:12px}
.site-menu .menu-main-links>a{transition:color .2s,padding .35s var(--ease)}
.menu-services{border-left:1px solid var(--line);padding-left:8vw}
.site-menu .menu-services h3{font-family:Georgia,serif;font-style:italic;font-size:34px}
.site-menu-bottom{padding-bottom:45px}
.opening{min-height:calc(100svh - 113px);position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:center;overflow:clip;padding-top:55px}
.opening-content{position:relative;z-index:1;text-align:center;padding-block:20px 68px}
.opening .eyebrow{justify-content:center;font-size:10px;margin-bottom:38px}
.opening h1{font-size:clamp(74px,10.1vw,166px);line-height:.91;letter-spacing:-.076em;margin:0 auto 35px;max-width:1320px}
.opening h1>span,.opening h1 em{display:block}
.opening h1 em{color:var(--blue);font-weight:400;line-height:1.02}
.opening-copy{font-size:18px;line-height:1.55;color:var(--ink);margin-bottom:26px}
.opening .actions{justify-content:center;gap:28px}
.opening-frame{position:absolute;inset:0;z-index:-1;pointer-events:none;transform:translateY(var(--opening-y,0px)) scale(var(--opening-scale,1));transform-origin:center 60%}
.opening-frame svg{width:100%;height:100%;overflow:visible;fill:none;stroke:var(--blue);stroke-width:1.5}
.frame-path{stroke-dasharray:1;stroke-dashoffset:0;opacity:.24}
.frame-echo{opacity:.08;stroke-width:1}
.frame-node{position:absolute;width:9px;height:9px;background:var(--blue);border:3px solid var(--paper)}
.node-a{top:16.7%;left:11.8%}.node-b{right:11.8%;bottom:20%}
.js:not(.motion-paused) .frame-path{animation:draw-frame 2.2s var(--ease) both}
@keyframes draw-frame{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.opening-foot{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:auto;padding-block:21px 27px;border-top:1px solid var(--line);font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.opening-foot>span:nth-child(2){color:var(--muted);text-transform:none;letter-spacing:.02em}
.opening-foot a{display:inline-flex;gap:25px;align-items:center;min-height:44px;text-decoration:none}
.possibility{background:#15171c;color:var(--paper);padding-block:125px 65px;overflow:clip}
.possibility .eyebrow,.possibility p{color:#b7bbc5}
.scene-heading h2{font-size:clamp(40px,5.7vw,88px);max-width:1190px}
.scene-heading h2 em{color:#b9c5ff}
.scene-intro{display:flex;justify-content:flex-end;gap:65px;margin:40px 0 70px}
.scene-intro p:first-child{max-width:450px;font-size:17px}
.scene-intro p:last-child{max-width:170px;align-self:flex-end;font-size:12px}
.clarity-demo{border:1px solid #ffffff2c;transform:scale(var(--study-scale,1));transform-origin:center top;background:#f5f3ee;color:var(--ink)}
.clarity-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:15px 24px;border-bottom:1px solid #d0d1cd;font-size:10px;color:#585c65}
.clarity-toolbar>div{display:flex;gap:4px}
.clarity-toolbar button{background:none;border:1px solid transparent;min-height:40px;padding:8px 18px;font-size:11px;color:#4f535b}
.clarity-toolbar button[aria-pressed=true]{background:var(--ink);color:white}
.clarity-canvas{position:relative;height:560px;padding:45px 5%;overflow:clip}
.clarity-grid{position:absolute;inset:0;background-image:linear-gradient(#3157ff09 1px,transparent 1px),linear-gradient(90deg,#3157ff09 1px,transparent 1px);background-size:70px 70px}
.clarity-identity{position:absolute;top:35px;left:5%;display:flex;gap:18px;align-items:center;font-size:10px;line-height:1.4}
.study-mark{font-size:52px;font-weight:700;line-height:1;letter-spacing:-.1em;color:var(--blue)}
.clarity-nav{position:absolute;right:5%;top:48px;font-size:10px;display:flex;gap:25px}
.clarity-message{position:absolute;top:160px;left:5%;z-index:2;max-width:58%}
.clarity-message strong{display:block;font-size:clamp(36px,4.6vw,72px);font-weight:500;letter-spacing:-.06em;line-height:1.03;margin:20px 0}
.clarity-message strong em{color:var(--blue)}
.clarity-message p{font-size:13px;color:var(--muted)}
.study-action{display:inline-flex;align-items:center;gap:40px;background:var(--blue);color:white;font-size:11px;padding:15px 18px;margin-top:25px}
.study-action b{font-size:20px}
.clarity-image{position:absolute;width:32%;right:5%;top:110px;bottom:65px;background:var(--blue);color:var(--paper);display:flex;flex-direction:column;justify-content:center;padding:24px;transform:rotate(-4deg)}
.clarity-image svg{width:100%;max-height:300px;filter:drop-shadow(12px 13px 0 #1737b1)}
.clarity-image>span{font-size:9px;letter-spacing:.15em;padding-left:8%;line-height:1.5}
.clarity-baseline{position:absolute;bottom:20px;left:5%;right:5%;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px;font-size:9px;color:var(--muted)}
.clarity-caption{padding:15px 5%;background:#e9e8e2;font-size:12px!important;color:#474c57!important;min-height:50px}
.clarity-identity,.clarity-nav,.clarity-message,.clarity-image,.clarity-baseline{transition:transform 1s var(--ease),opacity .7s var(--ease)}
[data-clarity=scattered] .clarity-identity{transform:translate(60%,50px) rotate(-10deg)}
[data-clarity=scattered] .clarity-nav{transform:translate(-35%,130px) rotate(11deg)}
[data-clarity=scattered] .clarity-message{transform:translate(-6%,35px) rotate(-7deg)}
[data-clarity=scattered] .clarity-image{transform:translate(16%,-65px) rotate(18deg)}
[data-clarity=scattered] .clarity-baseline{transform:translate(12%,-25px) rotate(4deg);opacity:.4}
.illustration-note{font-size:10px;text-align:right;margin-top:18px}
.story-scene{background:var(--ink);color:var(--paper);padding-block:65px 90px;overflow:clip}
.story-heading{display:grid;grid-template-columns:1fr 370px;gap:10px 50px;align-items:end;margin-bottom:40px}
.story-heading .eyebrow{grid-column:1/-1;color:#a6b8ff}
.story-heading h2{font-size:clamp(44px,5.4vw,80px)}
.story-heading h2 em{color:#bac5ff}
.story-heading>p:last-child{font-size:15px;color:#b7bbc5}
.story-scene .drawing-story{width:100%;max-width:1600px}
.story-scene .drawing-stage{background:none;padding:0}
.story-scene .stage-top{display:none}
.story-scene .drawing-story.is-3d .drawing-viewport{height:clamp(500px,47vw,650px);perspective:1500px;background:none}
.story-scene .drawing-slide{color:var(--ink);border:1px solid #999cbd;background:#eeede8;border-radius:0!important}
.story-scene .drawing-story.is-3d .drawing-slide{width:min(65%,750px);top:32px;height:calc(100% - 64px);box-shadow:0 25px 70px #0005}
.story-scene .drawing-caption{text-align:left;padding:28px 35px 12px}
.story-scene .drawing-caption h3{font-size:clamp(28px,3vw,44px)}
.story-scene .drawing-caption>p:last-child{margin:0;color:#565b65;font-size:14px}
.story-scene .drawing-caption .small-label{color:#3157ff}
.story-scene .drawing-board{--sage:#e1e4f4}
.story-scene .drawing-window{box-shadow:0 18px 30px #17214a14}
.story-scene .sketch-composition{background:#d9e0ff}
.story-scene .composition-word,.story-scene .sketch-heading i{color:var(--blue)}
.story-scene .sketch-cta{background:var(--blue)}
.story-scene .stage-controls button,.story-scene .stage-controls button span,.story-scene .drawing-story-tools p,.story-scene .drawing-story-tools>a{color:#b9bcc7}
.story-scene .stage-controls button[aria-pressed=true] span{color:#b2bfff}
.story-scene .drawing-progress{background:#474b57}
.story-scene .carousel-playback button{background:transparent;border-color:#575c68;color:var(--paper);border-radius:0}
.story-scene .carousel-playback button:hover{background:#303645}
.story-scene .drawing-progress>span{background:#a4b5ff}
.offering-statement{display:grid;grid-template-columns:1.1fr 1fr;gap:0 10%;padding-block:140px 80px}
.offering-statement>.eyebrow{grid-column:1/-1}
.offering-statement h2{font-size:clamp(48px,5.2vw,83px)}
.offering-statement h2 em{color:var(--blue)}
.offering-statement .lead{font-size:20px;line-height:1.65;color:var(--ink);margin-bottom:25px}
.offering-statement>div>p:not(.lead){font-size:15px}
.offering-statement .text-link{margin-top:20px}
.connected-narrative{background:var(--paper);padding-bottom:60px;overflow:clip}
.narrative-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:10%;align-items:start}
.narrative-visual{position:sticky;top:calc(50vh - 200px);height:400px;max-width:580px;isolation:isolate;color:var(--blue);transition:color .5s}
.narrative-art{position:relative;height:100%}
.narrative-core{position:absolute;inset:27% 10%;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1;text-align:center}
.narrative-core>span{font-size:clamp(32px,4vw,63px);line-height:.98;font-weight:600;letter-spacing:-.07em}
.narrative-core>i{font:italic 18px Georgia,serif;margin-top:16px}
.narrative-orbit{position:absolute;border:1px solid currentColor;inset:11% 0;border-radius:50%;transform:rotate(-28deg);transition:transform 1.1s var(--ease),border-radius 1.1s var(--ease)}
.orbit-two{inset:11% 0;transform:rotate(28deg)}
.orbit-label{position:absolute;z-index:2;background:var(--paper);padding:7px 12px;font-size:11px;color:var(--ink)}
.label-one{top:15%;left:0}.label-two{top:15%;right:0}.label-three{bottom:15%;left:38%}
.narrative-index{position:absolute;bottom:0;left:0;font-size:9px;letter-spacing:.12em;color:var(--muted)}
[data-active-narrative="1"] .orbit-one{transform:rotate(90deg);border-radius:8%}
[data-active-narrative="1"] .orbit-two{transform:rotate(0deg);border-radius:8%}
[data-active-narrative="2"] .orbit-one{transform:rotate(145deg);border-radius:30%}
[data-active-narrative="2"] .orbit-two{transform:rotate(35deg);border-radius:30%}
.narrative-step{min-height:75vh;padding-block:90px;display:flex;flex-direction:column;justify-content:center;border-top:1px solid var(--line)}
.narrative-step h2{font-size:clamp(40px,4.5vw,68px);margin-bottom:25px}
.narrative-step h2 em{color:var(--blue)}
.narrative-step p{font-size:15px;line-height:1.75}
.narrative-step .lead{font-size:20px;color:var(--ink);margin-bottom:16px}
.narrative-step p+p{margin-top:14px}
.discipline-links{display:flex;flex-direction:column;margin-top:30px;gap:5px}
.discipline-links a{font-size:13px;min-height:44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);text-decoration:none}
.discipline-links a:hover{color:var(--blue)}
.manifesto{padding-block:115px;background:#dde3f4;overflow:clip}
.manifesto h2{font-size:clamp(72px,11vw,165px);line-height:.95;letter-spacing:-.075em;transform:translateX(var(--manifesto-x,0px))}
.manifesto h2 em{color:var(--blue)}.blue-period{color:var(--blue)}
.manifesto-bottom{display:flex;align-items:center;justify-content:flex-end;gap:10%;margin-top:75px}
.manifesto-bottom p{max-width:500px;font-size:18px;color:#444d60}
.round-link{display:flex;justify-content:center;text-align:center;align-items:center;gap:35px;border:1px solid #93a0c1;border-radius:50%;width:170px;height:170px;flex-shrink:0;padding:30px;text-decoration:none;line-height:1.3;font-size:15px;transition:background .3s,color .3s}

.round-link:hover{background:var(--blue);color:white;border-color:var(--blue)}
.collaboration-scene{display:grid;grid-template-columns:1fr 1fr;gap:10%;padding-block:130px}
.collaboration-intro h2{font-size:clamp(43px,4.5vw,66px);margin-bottom:28px}
.collaboration-intro>p:not(.eyebrow){font-size:16px;max-width:440px}
.collaboration-intro>.text-link{margin-top:20px}
.collaboration-steps{list-style:none;padding:0;margin:0}
.collaboration-steps li{display:flex;gap:30px;padding:28px 0 40px;border-top:1px solid var(--line)}
.collaboration-steps li>span{font-size:11px;color:var(--blue);padding-top:6px}
.collaboration-steps h3{font-size:29px;margin-bottom:15px}
.collaboration-steps p{font-size:15px}
.reading-scene{padding-block:60px 120px;border-top:1px solid var(--line)}
.reading-scene>div:first-of-type{display:flex;justify-content:space-between;align-items:end;gap:10%;margin-bottom:50px}
.reading-scene h2{font-size:clamp(43px,4.8vw,70px)}
.reading-scene>div>p{max-width:340px;font-size:15px}
.reading-links{display:block}
.reading-links a{display:grid;grid-template-columns:230px 1fr;gap:30px;align-items:center;font-size:26px;line-height:1.25;letter-spacing:-.03em;min-height:110px;padding-block:25px;border-top:1px solid var(--line);text-decoration:none}
.reading-links a>span{font-size:10px;letter-spacing:.05em}

.reading-links a:hover{color:var(--blue)}
.closing{position:relative;background:var(--blue);padding-block:100px 75px;color:white;overflow:clip}
.closing-inner{display:block}
.closing .eyebrow{color:#dbe1ff;margin-bottom:40px}
.closing-inner>div{display:flex;justify-content:space-between;align-items:end;gap:60px}
.closing h2{font-size:clamp(62px,8.5vw,136px);max-width:1000px;line-height:.97}
.closing h2 em{color:white}
.closing p{color:#e2e7ff;max-width:365px;font-size:16px}
.closing-link{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-top:65px;padding-top:26px;border-top:1px solid #ffffff75;font-size:clamp(24px,3vw,45px);text-decoration:none;letter-spacing:-.035em;min-height:85px}


/* Dedicated pages retain rich text, with a distinct reading and wayfinding layer. */
.page-intro{position:relative;padding-block:35px 75px;min-height:70svh;display:flex;flex-direction:column;justify-content:center;overflow:clip}
.breadcrumb{margin-bottom:48px;font-size:10px;flex-wrap:wrap}
.page-intro h1{font-size:clamp(56px,7.8vw,122px);max-width:1210px;line-height:1;letter-spacing:-.065em}
.intro-bottom{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:start;margin-top:45px}

.page-intro .lead{grid-column:2;font-size:18px;line-height:1.75;margin:0;max-width:680px}
.intro-rule{position:absolute;bottom:0;left:0;width:100%;height:1px;background:var(--line)}
.service-ribbon{padding-block:35px;font-size:15px;border-bottom:1px solid var(--line)}
.detail-grid{padding-block:100px;gap:10%;grid-template-columns:1fr 1fr}
.detail-grid>div:first-child:has(h2){align-self:start;position:sticky;top:130px}
.detail-grid h2{font-size:clamp(37px,4.2vw,63px)}
.prose{font-size:16px;line-height:1.85}
.prose h3{font-size:26px;line-height:1.2;margin-top:30px}
.service-overview .direct-answer{font-size:21px;line-height:1.7;margin-bottom:30px}
.topic-detail,.deliverable-detail{border-top:1px solid var(--line);padding:20px 0}
.topic-detail summary,.deliverable-detail summary{display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;min-height:44px;list-style:none}
.topic-detail summary::-webkit-details-marker,.deliverable-detail summary::-webkit-details-marker{display:none}
.topic-detail summary::after,.deliverable-detail summary::after{content:"+";color:var(--blue);font-size:24px}
.topic-detail[open] summary::after,.deliverable-detail[open] summary::after{content:"−"}
.topic-detail summary h3,.deliverable-detail summary h3{font-size:23px;margin:0;line-height:1.3;letter-spacing:-.025em}
.topic-detail p{padding-top:18px}
.deliverable-detail{margin-top:30px}
.starting-points{padding-top:90px}
.starting-points .section-heading h2{font-size:clamp(45px,6vw,86px)}
.rail-tools{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}
.rail-tools p{font-size:11px}.rail-tools>div{display:flex;gap:10px}
.rail-tools button{background:transparent;border:1px solid var(--line);width:46px;height:46px;font-size:22px}
.rail-tools button:disabled{opacity:.35}
.starting-point-grid{display:flex;gap:32px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:35px;scrollbar-width:thin;scrollbar-color:var(--blue) #dde0e8}
.starting-point-grid article{flex:0 0 43%;scroll-snap-align:start;padding:40px 30px;min-height:365px;background:#e7e9f0;border:0;position:relative;display:flex;flex-direction:column}
.starting-point-grid article:nth-child(2n){background:#dce2fc}
.starting-point-grid h3{font-size:37px;line-height:1.06;margin-bottom:20px}
.starting-point-grid p{font-size:15px}
.starting-point-grid .text-link{margin-top:auto;padding-top:20px}
.starting-point-grid article:has(.text-link+.text-link) .text-link{margin-top:0}
.expertise-directory .section-heading{margin-bottom:70px}
.service-grid{display:block;border:0}
.service-card{display:grid;grid-template-columns:50px 1.15fr 1fr;align-items:start;gap:25px;padding:36px 0;border:0;border-top:1px solid var(--line);background:none;min-height:0;transition:color .3s,background .3s}
.service-card h3{font-size:clamp(28px,3vw,44px);margin:0;line-height:1.1}
.service-card p{font-size:14px;max-width:450px}
.service-card .section-number{padding-top:5px}
.service-card .small-label{font-size:0;margin:0;text-align:right}

.service-card:hover{background:#e9ecf7;color:var(--blue)}
.dual-grid{border:0;gap:8%;padding-block:40px}
.dual-panel{padding:0;border:0!important;background:none}
.dual-panel h3{font-size:38px;margin-top:20px}
.dual-panel ul{list-style:none;padding:0}
.dual-panel li{border-bottom:1px solid var(--line);padding:15px 0;font-size:15px}
.position-statement{font-size:clamp(40px,5vw,74px);color:var(--blue);border-top:1px solid var(--line);padding-top:70px;margin-top:55px}
.studio-summary{padding-block:80px;max-width:900px;margin-right:56px}
.studio-summary h2{font-size:clamp(38px,4.2vw,60px)}
.why-grid{display:block;border-top:1px solid var(--line)}
.why-grid article{display:grid;grid-template-columns:1fr 1fr;gap:10%;padding:35px 0;border-bottom:1px solid var(--line)}
.why-grid h3{font-size:clamp(30px,4vw,52px)}
.why-grid p{font-size:16px}
.drawn-section{padding-block:130px}
.drawn-section .intro-copy{font-size:18px;max-width:720px}
.attention-path{margin-top:75px}
.attention-path h3{font-size:24px}.attention-path p{font-size:13px}
.attention-path li:nth-child(1){--path-fill:20%;--path-delay:0s}
.attention-path li:nth-child(2){--path-fill:40%;--path-delay:.3s}
.attention-path li:nth-child(3){--path-fill:60%;--path-delay:.6s}
.attention-path li:nth-child(4){--path-fill:80%;--path-delay:.9s}
.attention-path li:nth-child(5){--path-fill:100%;--path-delay:1.2s}
.attention-path .path-point{position:relative;isolation:isolate;overflow:hidden;background:#172032;color:#fff;border-color:#7c8daa;cursor:default}
.attention-path .path-point::before{content:"";position:absolute;inset:0;z-index:-1;background:#3157ff;transform:translateY(calc(100% - var(--path-fill)));pointer-events:none}
.attention-path.is-enhanced .path-point::before{transition:transform 2.6s cubic-bezier(.4,0,.2,1) var(--path-delay)}
.attention-path.is-enhanced .path-point:not(.is-filled)::before{transform:translateY(100%)}
@media(prefers-reduced-motion:reduce){.attention-path.is-enhanced .path-point::before{transition:none!important;transform:translateY(calc(100% - var(--path-fill)))!important}}
html.motion-paused .attention-path.is-enhanced .path-point::before{transition:none;transform:translateY(calc(100% - var(--path-fill)))}
#process{padding-block:120px}
.process-grid{display:block;border:0;counter-reset:process}
.process-step{display:grid;grid-template-columns:60px 1fr 1.2fr 1fr;gap:35px;border:0;border-top:1px solid #ffffff35;padding:36px 0;align-items:start}
.process-step h3{font-size:40px;margin:0}.process-step p{font-size:15px}
.process-step .process-review{margin:0;border:0;padding:0;font-size:12px}
.process-step .section-number{color:#b3c2ff}
.benefit-row{padding-block:38px}.benefit-row h3{font-size:40px}.benefit-row p{font-size:16px}
.faq-list summary{font-size:19px;line-height:1.4;padding-block:25px}
.faq-list p{font-size:15px}
.insight-grid{display:block}
.insight-card{display:grid;grid-template-columns:170px 1.4fr 1fr;gap:25px 45px;padding:45px 0;border-top:1px solid var(--line)}
.insight-card h3{font-size:clamp(30px,4vw,54px);margin:0}
.insight-card p{font-size:15px}
.insight-card>.text-link{grid-column:2}
.article.prose{max-width:820px;font-size:18px;line-height:1.9;padding-block:70px 100px}
.article.prose h2{font-size:39px;margin-top:60px}
.article-takeaways{padding:30px;background:#e4e8f5;border-color:var(--blue)}
.article-takeaways h2{margin-top:0!important}
.contact-grid{padding-block:85px}
.contact-grid>div:first-child{position:sticky;top:120px;align-self:start}
.contact-grid .lead{font-size:18px}
.contact-prep{font-size:15px}
.contact-grid .inquiry-form{border:1px solid var(--line);background:#eeeFEB;padding:35px}
.field label{font-size:13px}
.related-content{padding-block:85px}
.resource-links{gap:45px}
.resource-links li>a{font-size:22px}
.resource-links li>p{font-size:14px}
.footer{padding-top:75px}
.footer-grid>div:first-child>p{font-size:14px;max-width:350px}
.footer-grid h2{font-size:11px}
.footer-grid li a{font-size:13px;line-height:2}
.footer-bottom{margin-top:70px;padding-bottom:35px}
@media(min-width:1700px){.opening{min-height:850px}.opening-content{padding-bottom:100px}}
@media(max-width:1000px){
 .wrap{width:calc(100% - 64px)}
 .opening h1{font-size:10.2vw}
 .opening-foot>span:nth-child(2){display:none}
 .story-heading{grid-template-columns:1fr;gap:20px}
 .story-heading>p:last-child{max-width:520px}
 .offering-statement,.narrative-layout,.collaboration-scene{gap:6%}
 .narrative-visual{height:350px;top:calc(50vh - 160px)}
 .narrative-step{min-height:650px}
 .service-card{grid-template-columns:35px 1fr 1fr;gap:20px}
 .process-step{grid-template-columns:35px 1fr 1.3fr;gap:25px}
 .process-step .process-review{grid-column:3}
 .reading-links a{grid-template-columns:170px 1fr}
 .insight-card{grid-template-columns:130px 1fr;gap:20px 35px}
 .insight-card p{grid-column:2}
}
@media(max-width:700px){
 .wrap{width:calc(100% - 40px)}
 .header-inner{height:72px}.header .brand{width:160px}.header-actions{gap:12px}
 .header .motion-toggle{font-size:9px;max-width:65px;line-height:1.4;padding:5px}
 .header .menu{gap:12px;min-width:65px;padding:5px;font-size:12px}.menu-icon{width:22px}
 .preview-strip{font-size:8px;padding-block:5px}
 .menu-services{padding:0;border:0}.site-menu .menu-main-links>a{font-size:30px}
 .opening{min-height:calc(90svh - 93px);padding-top:40px}
 .opening-content{padding-block:25px 65px}
 .opening .eyebrow{font-size:8px;letter-spacing:.06em;gap:7px;margin-bottom:40px}
 .opening h1{font-size:clamp(50px,11.6vw,82px);line-height:.97;letter-spacing:-.065em;margin-bottom:28px}
 .opening-copy{font-size:15px}
 .opening .actions{gap:12px 22px}
 .opening .button{font-size:12px;min-height:50px;padding:13px 19px}
 .opening .text-link{font-size:11px}
 .opening-frame{inset:5% -25% 2%;opacity:.85}
 .opening-foot{font-size:8px;gap:20px;padding-block:10px 15px}
 .opening-foot a{gap:12px}
 .possibility{padding-block:75px 40px}
 .scene-heading h2{font-size:clamp(36px,7.8vw,53px)}
 .scene-intro{display:block;margin:28px 0 38px}
 .scene-intro p:first-child{font-size:15px;max-width:540px}
 .scene-intro p:last-child{margin-top:15px;max-width:none;font-size:11px}
 .clarity-demo{width:calc(100% - 24px)}
 .clarity-toolbar{padding:12px 15px;flex-wrap:wrap;gap:10px}
 .clarity-toolbar>span{font-size:8px}
 .clarity-toolbar button{font-size:10px;min-height:44px;padding:8px 15px}
 .clarity-canvas{height:570px}
 .clarity-identity{top:25px;left:7%;font-size:9px;gap:14px}
 .study-mark{font-size:40px}
 .clarity-nav{display:none}
 .clarity-message{left:7%;top:102px;max-width:88%}
 .clarity-message>.small-label{font-size:7px}
 .clarity-message strong{font-size:clamp(30px,7vw,47px);margin:16px 0}
 .clarity-message p{font-size:10px;max-width:240px}
 .study-action{font-size:9px;padding:10px 13px;margin-top:14px}
 .clarity-image{top:330px;bottom:50px;width:45%;right:9%;padding:10px;transform:rotate(-7deg)}
 .clarity-image svg{max-height:130px}
 .clarity-image>span{font-size:6px}
 .clarity-baseline{font-size:6px;bottom:16px}
 .clarity-caption{font-size:10px!important;min-height:62px;padding:14px 7%}
 [data-clarity=scattered] .clarity-identity{transform:translate(15%,20px) rotate(-10deg)}
 [data-clarity=scattered] .clarity-message{transform:translate(-3%,45px) rotate(-6deg)}
 [data-clarity=scattered] .clarity-image{transform:translate(7%,-40px) rotate(18deg)}
 .illustration-note{font-size:9px;text-align:left}
 .story-scene{padding-block:50px 70px}
 .story-heading{margin-bottom:22px}
 .story-heading h2{font-size:clamp(36px,8vw,54px)}
 .story-heading>p:last-child{font-size:14px}
 .story-scene .drawing-story.is-3d .drawing-viewport{height:490px;perspective:950px}
 .story-scene .drawing-story.is-3d .drawing-slide{width:84%;top:24px;height:calc(100% - 48px)}
 .story-scene .drawing-caption{padding:24px 20px 10px}
 .story-scene .drawing-caption h3{font-size:27px}
 .story-scene .drawing-caption>p:last-child{font-size:13px}
 .story-scene .drawing-story .stage-controls{padding-inline:8px}
 .story-scene .drawing-story .stage-controls button span{font-size:9px}
 .story-scene .drawing-story .stage-controls button{font-size:8px}
 .offering-statement{display:block;padding-block:75px 35px}
 .offering-statement h2{font-size:clamp(42px,9vw,61px);margin-bottom:30px}
 .offering-statement .lead{font-size:18px}
 .offering-statement>div>p:not(.lead){font-size:14px}
 .connected-narrative{--mobile-diagram-height:clamp(196px,29svh,246px);overflow:visible}
 .narrative-layout{display:block;width:100%}
 .narrative-visual{position:sticky;top:73px;z-index:4;height:var(--mobile-diagram-height);width:100%;max-width:none;margin:0;background:var(--paper)}
 .narrative-art{width:min(calc(100% - 40px),calc(var(--mobile-diagram-height) * 1.45),360px);margin-inline:auto}
 .narrative-orbit{inset:29% 20%}
 .narrative-core{inset:26% 8% 24%}
 .narrative-core>span{font-size:clamp(25px,7.5vw,32px)}
 .narrative-core>i{font-size:13px;margin-top:8px}
 .narrative-art .orbit-label{font-size:10px;padding:4px 7px}
 .narrative-art .label-one{top:10%;left:0}
 .narrative-art .label-two{top:10%;right:0}
 .narrative-art .label-three{bottom:10%;left:50%;transform:translateX(-50%)}
 .narrative-index{bottom:3px;font-size:8px}
 .narrative-steps{padding-inline:20px}
 .narrative-step{scroll-margin-top:calc(90px + var(--mobile-diagram-height))}
 .narrative-step a{scroll-margin-top:calc(90px + var(--mobile-diagram-height));scroll-margin-bottom:90px}
 .narrative-step{min-height:0;padding-block:45px}
 .narrative-step h2{font-size:44px}
 .narrative-step .lead{font-size:18px}
 .narrative-step p{font-size:14px}
 .narrative-step .eyebrow{font-size:9px}
 .manifesto{padding-block:70px}
 .manifesto h2{font-size:clamp(51px,10.9vw,76px)}
 .manifesto-bottom{display:block;margin-top:35px}
 .manifesto-bottom p{font-size:16px}
 .round-link{width:auto;height:auto;display:inline-flex;border-radius:0;border:0;border-bottom:1px solid #93a0c1;padding:14px 0;margin-top:20px;gap:35px}
 .round-link>span br{display:none}
 .collaboration-scene{display:block;padding-block:80px}
 .collaboration-intro h2{font-size:42px}
 .collaboration-intro>p:not(.eyebrow){font-size:15px}
 .collaboration-steps{margin-top:40px}
 .collaboration-steps li{gap:20px;padding-block:25px 32px}
 .collaboration-steps h3{font-size:27px}
 .collaboration-steps p{font-size:14px}
 .reading-scene{padding-block:45px 75px}
 .reading-scene>div:first-of-type{display:block;margin-bottom:30px}
 .reading-scene h2{font-size:41px}
 .reading-scene>div>p{margin-top:22px;font-size:14px}
 .reading-links a{grid-template-columns:1fr;gap:13px;font-size:23px;min-height:130px}
 .reading-links a>span{grid-column:1/-1;font-size:9px}
 
 .closing{padding-block:65px 55px}
 .closing .eyebrow{font-size:9px;max-width:250px}
 .closing-inner>div{display:block}
 .closing h2{font-size:clamp(54px,12vw,83px)}
 .closing p{font-size:15px;margin-top:28px}
 .closing-link{font-size:27px;margin-top:40px;min-height:75px}
 .page-intro{min-height:0;padding-block:27px 50px}
 .breadcrumb{font-size:9px;margin-bottom:38px}
 .page-intro h1{font-size:clamp(44px,9.7vw,68px)}
 .intro-bottom{grid-template-columns:1fr;gap:20px;margin-top:30px}
 
 .page-intro .lead{grid-column:1;font-size:15px;line-height:1.75}
 .service-ribbon{padding-block:25px;font-size:13px}
 .detail-grid{grid-template-columns:1fr;gap:28px;padding-block:55px}
 .detail-grid>div:first-child:has(h2){position:static}
 .detail-grid h2{font-size:38px}
 .service-overview .direct-answer{font-size:18px}
 .prose{font-size:15px}
 .topic-detail summary h3,.deliverable-detail summary h3{font-size:21px}
 .starting-points{padding-top:55px}
 .starting-points .section-heading h2{font-size:43px}
 .starting-point-grid{gap:16px}
 .starting-point-grid article{flex-basis:88%;padding:25px 22px;min-height:420px}
 .starting-point-grid h3{font-size:31px}
 .starting-point-grid p{font-size:14px}
 .service-card{grid-template-columns:25px 1fr;gap:17px;padding-block:28px}
 .service-card h3{font-size:28px}
 .service-card p{grid-column:2;grid-row:2;font-size:14px}
 .service-card .small-label{grid-column:3;grid-row:1}
 
 .dual-grid{gap:35px;padding-block:15px}
 .dual-panel h3{font-size:31px}
 .dual-panel li{font-size:14px}
 .position-statement{font-size:35px;padding-top:40px}
 .studio-summary{padding-block:50px;margin-inline:auto}
 .studio-summary h2{font-size:36px}
 .why-grid article{display:block;padding-block:28px}
 .why-grid h3{font-size:33px;margin-bottom:18px}
 .why-grid p{font-size:15px}
 .drawn-section{padding-block:70px}
 .drawn-section h2{font-size:43px}
 .drawn-section .intro-copy{font-size:16px}
 .attention-path{margin-top:40px}.attention-path p{font-size:14px}
 #process{padding-block:70px}
 .process-step{grid-template-columns:25px 1fr;gap:15px 20px;padding-block:30px}
 .process-step h3{font-size:33px}
 .process-step p,.process-step .process-review{grid-column:2}
 .process-step p{font-size:14px}
 .benefit-row h3{font-size:32px}.benefit-row p{font-size:15px}
 .insight-card{display:block;padding-block:35px}
 .insight-card h3{font-size:35px;margin-block:22px}
 .insight-card p{font-size:15px}
 .insight-card .text-link{margin-top:15px}
 .article.prose{padding-block:45px 65px;font-size:16px;width:calc(100% - 40px)}
 .article.prose h2{font-size:32px}
 .contact-grid{padding-block:50px}
 .contact-grid>div:first-child{position:static}
 .contact-grid .lead{font-size:16px}
 .contact-grid .inquiry-form{padding:23px 18px}
 .related-content{padding-block:55px}
 .resource-links li>a{font-size:20px}
 .footer{padding-top:55px}
 .footer-grid>div:first-child>p{font-size:13px}
 .footer-grid li a{font-size:12px}
 .footer-bottom{padding-bottom:95px}
}
@media(max-width:360px){
 .header .brand{width:135px}.header-actions{gap:3px}
 .header .motion-toggle{font-size:8px;max-width:48px}
 .header .menu{min-width:60px;gap:9px}
 .opening h1{font-size:11.4vw}
 .opening .eyebrow{font-size:7px}
 .opening-foot{font-size:7px}
 .opening .actions{gap:9px}
 .clarity-toolbar{padding-inline:10px}
 .manifesto h2{font-size:10.5vw}
 .contact-launcher{right:14px;bottom:14px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .opening-frame,.clarity-demo,.manifesto h2{transform:none!important}
 .frame-path{animation:none!important}
 .clarity-identity,.clarity-nav,.clarity-message,.clarity-image,.clarity-baseline,.narrative-orbit{transition:none!important}
}
html.motion-paused{scroll-behavior:auto}
/* Short landscape screens keep enough room for reading with a normal-flow diagram. */
@media(max-width:700px) and (max-height:480px){.narrative-visual{position:relative;top:auto}.narrative-step,.narrative-step a{scroll-margin-top:90px}}
html.motion-paused .opening-frame,html.motion-paused .clarity-demo,html.motion-paused .manifesto h2{transform:none!important}
html.motion-paused .frame-path{animation:none!important}
html.motion-paused .clarity-identity,html.motion-paused .clarity-nav,html.motion-paused .clarity-message,html.motion-paused .clarity-image,html.motion-paused .clarity-baseline,html.motion-paused .narrative-orbit{transition:none!important}
@media print{
 .opening,.page-intro{min-height:0}
 .opening-frame,.clarity-grid,.narrative-visual,.rail-tools{display:none!important}
 .clarity-demo,.manifesto h2{transform:none!important}
 .narrative-layout{display:block}
 .narrative-step{min-height:0}
 .starting-point-grid{display:block;overflow:visible}
 .starting-point-grid article{min-height:0;margin-bottom:20px}
 .detail-grid>div:first-child:has(h2),.contact-grid>div:first-child{position:static}
 .story-scene .drawing-story.is-3d .drawing-viewport{height:auto;overflow:visible}
 .story-scene .drawing-story.is-3d .drawing-slide{position:static;width:100%;height:auto}
}
.closing :focus-visible,.story-scene :focus-visible{outline-color:#dce4ff}
@media(min-width:701px) and (max-width:800px){
 .contact-grid>div:first-child{position:static}
}
