.direction-preview{--cream:#F5F3EE;--cream-line:#D9DDD8;--slate:#425564;--mint-dark:#087D5A}
.direction-preview .relaunch-hero{min-height:clamp(660px,94svh,880px)}
.direction-preview .hero-content h1{max-width:840px}
.direction-preview .hero-intro{max-width:580px}
.direction-preview .header-cta{white-space:nowrap}
.direction-preview .relaunch-text-link{color:var(--text)}
.worked-with{background:var(--cream);color:var(--ink);border-bottom:1px solid var(--cream-line)}
.worked-inner{display:grid;grid-template-columns:220px minmax(0,1fr);gap:35px;align-items:center;padding-block:27px}
.worked-label .eyebrow{color:var(--mint-dark);margin:0 0 5px}
.worked-label h2{font-size:18px;letter-spacing:-.02em;line-height:1.2;margin:0}
.worked-logos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;border-left:1px solid var(--cream-line)}
.worked-logo{height:72px;display:flex;align-items:center;justify-content:center;padding:10px 20px;border-right:1px solid var(--cream-line);overflow:hidden}
.worked-logo img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.worked-logo.im-el img{max-width:230px}
.worked-logo.soladria img{max-width:225px}
.worked-logo.refeel img{width:245px;max-width:none;max-height:none;mix-blend-mode:multiply}
.journey-intro{background:var(--cream);color:var(--ink);padding-block:clamp(90px,10vw,150px) clamp(55px,7vw,90px)}
.intro-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(30px,8vw,130px);align-items:end}
.journey-intro .eyebrow{color:var(--mint-dark);margin-bottom:19px}
.journey-intro h2{font-size:clamp(44px,5.8vw,78px);letter-spacing:-.055em;line-height:1.02;margin:0}
.journey-intro h2 em{font-style:normal;color:var(--mint-dark)}
.intro-grid>p{color:var(--slate);font-size:clamp(17px,1.7vw,21px);line-height:1.55;margin:0 0 5px;max-width:440px}
.journey-section{background:var(--ink);padding-block:0 clamp(85px,9vw,130px)}
.journey-tabs{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #38516A;border-bottom:0;background:var(--ink-deep);overflow:hidden}
.journey-tab{display:flex;align-items:center;gap:15px;min-height:74px;text-align:left;padding:17px 24px;background:transparent;color:#AEB9C2;border:0;border-right:1px solid #38516A;font-size:17px;font-weight:600;transition:background .2s,color .2s,box-shadow .2s}
.journey-tab:last-child{border-right:0}
.journey-tab span{font:500 12px 'IBM Plex Mono',monospace;letter-spacing:.08em}
.journey-tab:hover{color:#fff;background:#21394E}
.journey-tab[aria-selected=true]{background:#1A3344;color:#fff;box-shadow:inset 0 3px var(--mint)}
.journey-tab[aria-selected=true] span{color:var(--mint)}
.journey-panel{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(350px,.65fr);min-height:520px;border:1px solid #38516A}
.direction-preview.enhanced .journey-panel[hidden]{display:none}
.journey-visual{position:relative;overflow:hidden;min-height:520px;border-right:1px solid #38516A;background:#152B3A;isolation:isolate}
.visual-head{position:absolute;z-index:9;top:20px;left:22px;right:22px;display:flex;justify-content:space-between;gap:15px;color:#D2DBDE;font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.08em}
.visual-head span:last-child{color:#90ACB3}
.visual-stamp{position:absolute;z-index:9;left:22px;bottom:20px;padding:9px 11px;background:#0B1925EB;border:1px solid #527180;color:#DDE7E5;font:500 10px 'IBM Plex Mono',monospace;letter-spacing:.09em}
.visual-stamp b{color:var(--mint)}
.territory-visual{background:radial-gradient(circle at 65% 35%,#345460 0,#1C3846 36%,#102838 100%)}
.territory-grid{position:absolute;inset:-20%;transform:rotate(-14deg);background-image:linear-gradient(#8AAEAF16 1px,transparent 1px),linear-gradient(90deg,#8AAEAF16 1px,transparent 1px);background-size:56px 56px}
.territory-zone{position:absolute;left:16%;top:18%;width:67%;height:61%;border:2px dashed #56DAAC;clip-path:polygon(12% 7%,70% 0,100% 33%,90% 88%,26% 100%,0 57%);background:#31D59F16;transform:rotate(-7deg);box-shadow:0 0 0 28px #31D59F07}
.territory-road{position:absolute;width:120%;height:15px;left:-10%;top:55%;transform:rotate(-29deg);border-top:2px solid #A8C8C360;border-bottom:2px solid #A8C8C360;background:#59737B45}
.territory-road.road-two{top:38%;transform:rotate(24deg);height:8px;opacity:.55}
.site-pin{position:absolute;z-index:3;display:grid;place-items:center;width:46px;height:46px;background:#0B2330;color:#fff;border:2px solid var(--mint);border-radius:50%;box-shadow:0 0 0 10px #31D59F23;font:600 13px 'IBM Plex Mono',monospace}
.pin-a{left:30%;top:37%}.pin-b{left:61%;top:29%}.pin-c{left:68%;top:66%}
.roof-visual{background:radial-gradient(circle at 58% 42%,#456168 0,#243D4A 40%,#142B38 100%)}
.roof-visual:before{content:"";position:absolute;inset:-25%;transform:rotate(18deg);background-image:linear-gradient(#C3D2CD18 1px,transparent 1px),linear-gradient(90deg,#C3D2CD18 1px,transparent 1px);background-size:44px 44px}
.roof-block{position:absolute;transform:rotate(-16deg);background:repeating-linear-gradient(90deg,#96AEB440 0 6px,#66858D55 7px 45px);border:5px solid #97AEB1;box-shadow:24px 25px 0 #0A202B7A}
.roof-block.block-one{width:45%;height:38%;top:23%;left:26%;z-index:2}
.roof-block.block-two{width:30%;height:26%;top:60%;left:-6%;opacity:.55}
.roof-block.block-three{width:33%;height:23%;top:12%;right:-12%;opacity:.45}
.roof-focus{position:absolute;z-index:3;width:38%;height:29%;top:27%;left:29.5%;transform:rotate(-16deg);border:3px solid #79F3C5;background:#31D59F2F;box-shadow:0 0 0 12px #31D59F18,0 0 50px #31D59F45;display:flex;justify-content:space-around;padding:0 10px}
.roof-focus i{width:2px;height:100%;background:#B9F7D865}
.roof-callout{position:absolute;z-index:7;top:62%;left:48%;display:flex;flex-direction:column;gap:5px;padding:12px 15px;background:#0B1925E8;border-left:3px solid var(--mint);box-shadow:0 12px 25px #0004}
.roof-callout span{font:500 10px 'IBM Plex Mono',monospace;letter-spacing:.09em;color:var(--mint)}
.roof-callout b{font-size:15px;font-weight:500}
.dossier-visual{background:radial-gradient(circle at 50% 40%,#294B55,#142B38 70%)}
.dossier-visual:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#63818B15 1px,transparent 1px),linear-gradient(90deg,#63818B15 1px,transparent 1px);background-size:34px 34px}
.dossier-card{position:absolute;left:14%;right:14%;top:15%;bottom:14%;background:#F5F3EE;color:#12243A;box-shadow:20px 20px 0 #0A18225E;transform:rotate(-2deg);padding:25px 30px;display:flex;flex-direction:column}
.dossier-top{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:16px;border-bottom:1px solid #BECBC5;font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.06em}
.dossier-top b{font-size:10px;color:#087D5A;font-weight:500}
.dossier-card>strong{font-size:clamp(24px,2.7vw,36px);line-height:1.12;letter-spacing:-.035em;font-weight:600;padding:20px 0 15px}
.dossier-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid #D5DED7;font-size:14px}
.dossier-row b{font-weight:500;color:#526672;text-align:right}
.dossier-bottom{margin-top:auto;border-top:2px solid #087D5A;padding-top:11px;color:#087D5A;font:500 10px 'IBM Plex Mono',monospace;letter-spacing:.07em}
.journey-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,4vw,58px);background:#11263A}
.journey-copy .eyebrow{margin:0 0 18px}
.journey-copy h3{font-size:clamp(30px,3vw,44px);line-height:1.1;margin:0 0 25px}
.journey-copy>p:not(.eyebrow){font-size:17px;line-height:1.6;color:#D5DDE0;margin:0}
.journey-note{margin-top:34px;border-top:1px solid #38516A;padding-top:18px}
.journey-note>span{color:var(--mint);font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.09em}
.journey-note p{font-size:14px;color:#B9C7CE;margin:8px 0 0}
.method-section{background:var(--cream);color:var(--ink);padding-block:clamp(85px,9vw,130px)}
.method-heading{display:grid;grid-template-columns:220px minmax(0,800px);gap:35px;align-items:start;margin-bottom:55px}
.method-heading .eyebrow{color:var(--mint-dark);margin:10px 0 0}
.method-heading h2{font-size:clamp(36px,4.3vw,58px);line-height:1.08;margin:0;max-width:780px}
.method-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.method-grid article{border-top:2px solid #193245;padding-top:17px}
.method-grid article>span{font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.07em;color:var(--mint-dark)}
.method-grid h3{font-size:20px;line-height:1.18;margin:25px 0 12px}
.method-grid p{font-size:15px;line-height:1.55;color:var(--slate);margin:0}
.data-key{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:65px;padding:18px 0;border-top:1px solid var(--cream-line);border-bottom:1px solid var(--cream-line)}
.data-key span{display:inline-flex;align-items:center;gap:8px;font:500 12px 'IBM Plex Mono',monospace;color:#243B48}
.data-key i{display:inline-block;width:10px;height:10px;background:#243B48}
.data-key .key-estimated{background:#B68A34}.data-key .key-verified{background:#087D5A}
.data-key p{font-size:12px;color:#5B6871;margin:0 0 0 auto;max-width:370px}
.direction-cta{position:relative;overflow:hidden;background:#0A1622;color:#fff;padding-block:clamp(85px,9vw,130px)}
.direction-cta:before{content:"";position:absolute;width:55vw;height:55vw;max-width:800px;max-height:800px;right:-15%;top:-70%;border:1px solid #31D59F55;border-radius:50%;box-shadow:0 0 0 65px #31D59F08,0 0 0 130px #31D59F06}
.cta-inner{position:relative;display:flex;align-items:end;justify-content:space-between;gap:40px}
.cta-inner>div{max-width:730px}
.direction-cta .eyebrow{margin-bottom:20px}
.direction-cta h2{font-size:clamp(43px,5vw,70px);line-height:1.02;margin:0 0 22px}
.direction-cta p:not(.eyebrow){font-size:17px;color:#C9D3D7;margin:0;max-width:600px}
.direction-cta .button{flex:none;min-width:220px}
.direction-footer{background:#0A1622;color:#94A4AD;border-top:1px solid #293E4F;padding-block:23px;font-size:12px}
.direction-footer .relaunch-container{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.direction-footer a{color:#C9D3D7;text-decoration:underline;text-underline-offset:4px}
@media(max-width:1000px){
  .journey-panel{grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr)}
  .journey-copy{padding:30px}.journey-copy h3{font-size:34px}
  .method-grid{grid-template-columns:repeat(2,1fr);gap:34px}
  .data-key p{margin-left:0;flex-basis:100%}
}
@media(max-width:700px){
  .worked-inner{grid-template-columns:1fr;gap:18px;padding-block:28px}
  .worked-logos{border-top:1px solid var(--cream-line);border-left:0;padding-top:12px}
  .worked-logo{padding-inline:8px;height:64px}
  .worked-logo.refeel img{width:190px}
  .intro-grid{grid-template-columns:1fr;gap:28px}
  .journey-intro{padding-block:82px 60px}
  .journey-intro h2{font-size:clamp(45px,9vw,64px)}
  .journey-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .journey-tab{min-height:68px;gap:5px;padding:12px 9px;flex-direction:column;align-items:flex-start;font-size:13px;line-height:1.1}
  .journey-panel{grid-template-columns:1fr}
  .journey-visual{min-height:390px;border-right:0;border-bottom:1px solid #38516A}
  .journey-copy{min-height:350px;padding:32px 24px 36px}
  .journey-copy h3{font-size:34px;margin-bottom:17px}
  .journey-copy>p:not(.eyebrow){font-size:16px}
  .method-heading{grid-template-columns:1fr;gap:18px;margin-bottom:35px}
  .method-heading .eyebrow{margin:0}
  .method-grid{gap:27px 20px}
  .method-grid h3{margin-top:16px;font-size:18px}
  .cta-inner{align-items:flex-start;flex-direction:column;gap:30px}
}
@media(max-width:430px){
  .direction-preview .header-cta{font-size:12px!important;min-height:40px!important;padding:8px 10px!important}
  .worked-label h2{font-size:17px}
  .worked-logos{gap:6px}
  .worked-logo{height:53px;border-right:0;padding:4px}
  .worked-logo.im-el img{width:100%}
  .worked-logo.soladria img{width:100%}
  .worked-logo.refeel img{width:150px}
  .journey-intro h2{font-size:45px}
  .journey-visual{min-height:340px}
  .visual-head{top:15px;left:14px;right:14px;font-size:9px}
  .visual-stamp{left:14px;bottom:14px;font-size:9px;max-width:calc(100% - 28px)}
  .site-pin{width:37px;height:37px}
  .roof-callout{left:40%;top:62%;padding:9px}
  .roof-callout b{font-size:12px}
  .dossier-card{left:9%;right:9%;top:15%;bottom:13%;padding:15px 16px}
  .dossier-top{font-size:9px}
  .dossier-top b{font-size:8px}
  .dossier-card>strong{font-size:23px;padding:13px 0 10px}
  .dossier-row{font-size:11px;padding:7px 0}
  .dossier-bottom{font-size:8px}
  .method-grid{grid-template-columns:1fr}
  .method-grid article{padding-top:14px}
  .method-grid h3{margin:10px 0 6px}
  .direction-cta .button{width:100%}
}
@media(prefers-reduced-motion:reduce){.direction-preview *{animation:none!important;transition:none!important}}
