
/* D1: typographic modern editorial, with a product-agnostic identity. */
:root{--site-ink:#151820;--site-blue:#4d5eea;--site-line:#d5d9e1;--site-muted:#646c7b;--site-bg:#f6f7f9}
body{background:#f6f7f9;color:#151820}
.site-nav{background:#fafbfdeb;border-color:#dfe3eb}
.site-nav .site-brand{color:#151820}
.site-nav .site-brand span{color:#4d5eea!important}
.site-nav .site-links a{color:#455064}
.site-nav .site-links a:hover,.site-nav .site-links a[aria-current="page"]{color:#3648d4}
.d1-home{--ink:#151820;--muted:#646c7b;--accent:#4d5eea;--bg:#f6f7f9;background:#f6f7f9;color:#151820}
.d1-home .container{max-width:1210px}
.d1-home .eyebrow,.d1-home .overline{color:#4d5eea;font-size:11px;letter-spacing:.12em;font-weight:850}
.d1-home .d1-hero{padding:82px 0 22px}
.d1-home .d1-hero-grid{display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:clamp(25px,4vw,64px)}
.d1-home .hero h1{font-size:clamp(54px,6.1vw,90px);font-weight:860;line-height:1.08;letter-spacing:-.075em;margin:0 0 28px}
.d1-home .d1-line{display:block}
.d1-home .hero h1 .soft{color:#4d5eea}
.d1-home .d1-lead{font-size:clamp(17px,1.7vw,20px);font-weight:640;line-height:1.65;color:#262e3b;max-width:560px;margin:0 0 12px}
.d1-home .d1-context{font-size:14px;color:#636c7c;line-height:1.85;max-width:560px;margin:0 0 28px}
.d1-home .btn{border-radius:4px;background:#151820;border-color:#151820;color:white;padding:14px 21px;transition:background .22s,transform .22s}
.d1-home .btn.outline{background:transparent;color:#151820;border-color:#b3bccc}
.d1-home .btn:hover{background:#3749d4;border-color:#3749d4;box-shadow:none;transform:translateY(-2px)}
.d1-home .btn.outline:hover{background:#e6eaff;color:#2438b9}
.d1-home .d1-skills{display:flex;gap:11px 20px;flex-wrap:wrap;margin-top:32px;font-size:10px;letter-spacing:.055em;text-transform:uppercase;font-weight:780;color:#77808f}
.d1-home .d1-skills span+span:before{content:"/";padding-right:19px;color:#b5becf}
.d1-home .d1-hero-art{background:#e5ebfa;border:1px solid #d5def2;padding:22px 22px 16px;min-height:400px;box-shadow:12px 12px 0 #edf0f5}
.d1-home .d1-art-head,.d1-home .d1-decision-head{display:flex;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.1em;font-weight:800;color:#4a5778}
.d1-home .d1-art-canvas{height:300px;position:relative;isolation:isolate}
.d1-home .d1-node{position:absolute;z-index:2;padding:10px 14px;background:white;border:1px solid #d4dded;box-shadow:0 7px 20px #283c7519;font-size:12px;font-weight:780;color:#344360}
.d1-home .d1-n1{left:1%;top:16%;transform:rotate(-9deg)}
.d1-home .d1-n2{right:1%;top:13%;transform:rotate(8deg)}
.d1-home .d1-n3{left:0;bottom:22%;transform:rotate(5deg)}
.d1-home .d1-n4{right:0;bottom:15%;transform:rotate(-7deg)}
.d1-home .d1-art-screen{position:absolute;z-index:3;top:24%;left:17%;width:66%;background:white;border:1px solid #ccd5e8;padding:11px;box-shadow:0 15px 38px #203c7336;transform:perspective(700px) rotateY(-3deg)}
.d1-home .d1-window-top{display:flex;gap:4px;border-bottom:1px solid #e5e9f1;padding-bottom:9px;align-items:center}
.d1-home .d1-window-top i{width:6px;height:6px;background:#bec7d8;border-radius:50%}
.d1-home .d1-window-top b{font-size:8px;color:#6b7690;letter-spacing:.1em;margin-left:8px}
.d1-home .d1-window-body{display:grid;grid-template-columns:28% 1fr;gap:9px;height:141px;margin-top:9px}
.d1-home .d1-window-side{background:#e9effa;padding:11px 7px;display:flex;flex-direction:column;gap:9px}
.d1-home .d1-window-side i{height:7px;background:#bbc9e4}
.d1-home .d1-window-side i:first-child{background:#637adb}
.d1-home .d1-window-content{padding:9px 4px;display:flex;flex-direction:column;gap:10px}
.d1-home .d1-window-content b{height:9px;width:59%;background:#657ce0}
.d1-home .d1-window-content>i{height:8px;background:#dfe5f0}
.d1-home .d1-window-content>i:nth-child(3){width:71%}
.d1-home .d1-window-content div{display:flex;gap:6px;flex:1}
.d1-home .d1-window-content em{flex:1;background:#e8edf7}
.d1-home .d1-window-content em:nth-child(2){background:#cdd9f2}
.d1-home .d1-art-foot{border-top:1px solid #c0cbe4;padding-top:13px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:#263149}
.d1-home .d1-art-foot strong{font-size:12px}
.d1-home .d1-art-foot span{font-size:18px;color:#4d5eea}
.d1-home .d1-art-note{font-size:10px;color:#687792;margin-top:8px}
.d1-home .d1-hero-bottom{margin-top:82px;padding:18px 0;border-bottom:1px solid #ced5e2;display:flex;align-items:center;justify-content:space-between;gap:15px;color:#7a8391;font-size:11px;letter-spacing:.05em}
.d1-home .d1-hero-bottom a{color:#3549d3;font-weight:760}
.d1-home .d1-work{padding:75px 0 95px}
.d1-home .section-heading h2{font-size:clamp(36px,4vw,60px);letter-spacing:-.06em}
.d1-home .selected-description{max-width:760px;color:#626b7b;font-size:15px;line-height:1.8;margin:0 0 32px}
.d1-home .selected-view-all{color:#3447cd;font-weight:800;font-size:12px}
.d1-home .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 25px}
.d1-home .project{background:transparent;border:0;border-radius:0;overflow:visible;box-shadow:none;transition:none}
.d1-home .project:hover{transform:none;box-shadow:none}
.d1-home .project:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:stretch;gap:clamp(28px,3.2vw,48px)}
.d1-home .thumb{height:285px;border-radius:2px}
.d1-home .project:first-child .thumb{height:375px}
.d1-home .thumb.his{background:#dce5f4}
.d1-home .project .thumb img{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.d1-home .project:hover .thumb img{transform:scale(1.035)}
.d1-home .index-tag{background:#ffffffee;border:0;border-radius:0;color:#283c62}
.d1-home .project-info{padding:18px 4px 5px}
.d1-home .project:first-child .project-info{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-width:0;padding:28px 4px 5px 0}
.d1-home .project:first-child .project-info p{max-width:440px}
.d1-home .project:first-child .project-foot{width:100%;margin-top:auto}
.d1-home .project:not(:first-child){min-width:0}
.d1-home .project:not(:first-child) .project-info{display:flex;flex-direction:column;min-height:192px}
.d1-home .project:not(:first-child) .project-foot{margin-top:auto}
.d1-home .project-kicker{color:#4d5eea}
.d1-home .project h3{font-size:clamp(25px,2.9vw,38px);line-height:1.17;letter-spacing:-.045em;color:#151820}
.d1-home .project p{color:#626b7b;font-size:14px}
.d1-home .project-foot{border-top:1px solid #d5d9e1;padding-top:14px;color:#3548d2}
.d1-home .d1-approach{border-top:1px solid #d5d9e1;padding:89px 0}
.d1-home .d1-approach h2,.d1-home .d1-across h2,.d1-home .d1-contact h2{font-size:clamp(35px,4.5vw,62px);line-height:1.15;letter-spacing:-.06em;margin:11px 0 16px}
.d1-home .d1-section-lead{max-width:780px;color:#626b7b;font-size:16px;line-height:1.8;margin:0 0 36px}
.d1-home .d1-approach-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:53px;align-items:start}
.d1-home .d1-decision-visual{position:sticky;top:108px;background:#171d2b;color:white;padding:24px;min-height:385px}
.d1-home .d1-decision-head{color:#b4c1e2}
.d1-home .d1-decision-canvas{height:245px;position:relative;overflow:hidden}
.d1-home .d1-pane{position:absolute;inset:0;opacity:0;transform:translateY(14px) scale(.97);transition:opacity .45s ease,transform .55s ease;pointer-events:none}
.d1-home [data-stage="0"] .d1-pane[data-pane="0"],.d1-home [data-stage="1"] .d1-pane[data-pane="1"],.d1-home [data-stage="2"] .d1-pane[data-pane="2"]{opacity:1;transform:none}
.d1-home .d1-pane-messy span{position:absolute;padding:10px 15px;background:#2c3854;border:1px solid #586aa0;color:#edf2ff;font-size:13px;font-weight:700}
.d1-home .d1-pane-messy span:nth-child(1){top:15%;left:8%;transform:rotate(-8deg)}
.d1-home .d1-pane-messy span:nth-child(2){top:22%;right:10%;transform:rotate(7deg)}
.d1-home .d1-pane-messy span:nth-child(3){top:48%;left:30%;transform:rotate(-3deg)}
.d1-home .d1-pane-messy span:nth-child(4){bottom:13%;right:19%;transform:rotate(-7deg)}
.d1-home .d1-pane-messy span:nth-child(5){bottom:15%;left:2%;transform:rotate(9deg)}
.d1-home .d1-pane-structure{padding:36px 45px}
.d1-home .d1-structure-top{height:23px;width:23px;border-radius:50%;background:#91a7ff;margin:0 auto 18px}
.d1-home .d1-structure-columns{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.d1-home .d1-structure-columns>div{padding:20px;background:#2a3551;display:flex;flex-direction:column;gap:12px}
.d1-home .d1-structure-columns i{height:9px;background:#8696bd}
.d1-home .d1-structure-columns i:first-child{background:#748bea}
.d1-home .d1-structure-bottom{width:60%;height:4px;background:#8293ca;margin:17px auto}
.d1-home .d1-pane-product{display:grid;place-items:center;padding:18px 32px}
.d1-home .d1-product-window{width:100%;background:#fafbff;padding:13px;box-shadow:10px 10px 0 #3c4b73}
.d1-home .d1-product-bar{color:#b5bfd1;font-size:10px;letter-spacing:4px;border-bottom:1px solid #e3e7f1;padding-bottom:9px}
.d1-home .d1-product-body{height:139px;display:grid;grid-template-columns:26% 1fr;gap:12px;margin-top:10px}
.d1-home .d1-product-body>div:first-child{background:#e5ecfb;padding:12px 6px;display:flex;flex-direction:column;gap:13px}
.d1-home .d1-product-body i{height:8px;background:#c3cee3}
.d1-home .d1-product-body>div:first-child i:first-child{background:#6e84e7}
.d1-home .d1-product-body>div:last-child{display:flex;flex-direction:column;gap:12px;padding:9px}
.d1-home .d1-product-body b{height:9px;width:58%;background:#667ce0}
.d1-home .d1-product-body span{flex:1;background:#e8edf7}
.d1-home .d1-decision-foot{border-top:1px solid #485572;padding-top:13px;color:#b2c0df;font-size:11px;display:flex;justify-content:space-between;gap:12px}
.d1-home .d1-step-count{color:#9aafff;font-weight:800}
.d1-home .d1-decision-visual small{color:#a7b4cc;display:block;margin-top:8px;font-size:10px}
.d1-home .d1-decision-steps{display:flex;flex-direction:column}
.d1-home .d1-decision-step{text-align:left;border:0;border-top:1px solid #ccd4e1;background:transparent;color:#151820;padding:31px 8px 35px;cursor:pointer;display:flex;flex-direction:column;gap:13px;opacity:.64;transition:opacity .2s,padding-left .2s}
.d1-home .d1-decision-step[aria-pressed="true"]{border-top:2px solid #4d5eea;padding-left:18px;opacity:1}
.d1-home .d1-decision-step:hover{opacity:1}
.d1-home .d1-decision-step>span{color:#4d5eea;font-size:11px;font-weight:800;letter-spacing:.07em}
.d1-home .d1-decision-step strong{font-size:clamp(24px,2.8vw,34px);line-height:1.2;letter-spacing:-.05em}
.d1-home .d1-decision-step em{font-style:normal;color:#646c7b;font-size:14px;line-height:1.8}
.d1-home .d1-motion-control{text-align:right;margin-top:16px}
.d1-home .d1-motion-control button{border:1px solid #bbc5d4;background:transparent;padding:9px 13px;border-radius:4px;color:#485575;cursor:pointer;font-size:12px}
.d1-home .d1-motion-off{display:none}
.d1-home.is-paused .d1-motion-on{display:none}
.d1-home.is-paused .d1-motion-off{display:inline}
.d1-home .d1-across{border-top:1px solid #d5d9e1;padding:74px 0}
.d1-home .d1-across-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px}
.d1-home .d1-across-grid p{color:#626b7b;font-size:16px;line-height:1.8;margin:12px 0 20px}
.d1-home .d1-across-grid a{font-size:13px;font-weight:800;color:#3548d2;text-decoration:underline;text-underline-offset:4px}
.d1-home .d1-contact{border-top:1px solid #d5d9e1;padding:73px 0 92px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.d1-home .d1-contact>a{background:#151820;color:white;padding:15px 24px;font-size:13px;font-weight:780}
.d1-home .d1-contact>a:hover{background:#3548d2}
.d1-home.is-ready:not(.is-paused) .d1-line{animation:d1-enter .68s both}
.d1-home.is-ready:not(.is-paused) .d1-line:nth-child(2){animation-delay:.14s}
.d1-home.is-ready:not(.is-paused) .d1-node{animation:d1-node .6s .2s both}
.d1-home.is-ready:not(.is-paused) .d1-n2{animation-delay:.33s}
.d1-home.is-ready:not(.is-paused) .d1-n3{animation-delay:.44s}
.d1-home.is-ready:not(.is-paused) .d1-n4{animation-delay:.55s}
.d1-home.is-ready:not(.is-paused) .d1-art-screen{animation:d1-screen .8s .74s both}
@keyframes d1-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes d1-node{from{opacity:0;scale:.8}to{opacity:1;scale:1}}
@keyframes d1-screen{from{opacity:0;scale:.87;translate:0 22px}to{opacity:1;scale:1;translate:0 0}}
.d1-home.is-paused *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.d1-his-roles{margin:24px 0;padding:23px;background:#f3f6fe;border:1px solid #d6dff3}
.d1-his-roles>strong{display:block;font-size:19px;color:#263b79;margin-bottom:16px}
.d1-his-roles>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.d1-his-roles>div span{display:block;background:white;border:1px solid #d3def3;text-align:center;font-size:14px;font-weight:750;padding:18px 5px}
.d1-his-roles p{color:#5e6e87;font-size:13px;line-height:1.75;margin:14px 0 0}
@media(max-width:900px){
 .d1-home .d1-hero-grid{grid-template-columns:1fr;gap:35px}
 .d1-home .d1-hero{padding-top:55px}
 .d1-home .d1-hero-art{width:100%;max-width:650px;margin:auto}
 .d1-home .project:first-child{grid-template-columns:1fr}
 .d1-home .project:first-child .project-info{padding:18px 4px 5px}
 .d1-home .project:first-child .project-foot{margin-top:18px}
 .d1-home .project:first-child .thumb{height:330px}
 .d1-home .d1-approach-grid{gap:26px}
}
@media(max-width:700px){
 .d1-home .d1-hero{padding:48px 0 20px}
 .d1-home .hero h1{font-size:clamp(46px,10vw,64px)}
 html[lang="en"] .d1-home .hero h1{font-size:clamp(39px,9vw,58px);line-height:1.13}
 .d1-home .d1-lead{font-size:17px}
 .d1-home .d1-hero-art{min-height:340px;padding:17px}
 .d1-home .d1-art-canvas{height:260px}
 .d1-home .d1-art-screen{left:14%;width:72%}
 .d1-home .d1-node{font-size:11px;padding:8px 10px}
 .d1-home .d1-skills{gap:8px 13px}
 .d1-home .d1-skills span+span:before{padding-right:12px}
 .d1-home .d1-hero-bottom{margin-top:45px}
 .d1-home .d1-work{padding:58px 0 72px}
 .d1-home .section-heading h2{font-size:37px}
 .d1-home .grid{grid-template-columns:1fr;gap:29px}
 .d1-home .project:first-child{grid-column:auto}
 .d1-home .thumb,.d1-home .project:first-child .thumb{height:240px}
 .d1-home .project h3{font-size:26px}
 .d1-home .d1-approach{padding:61px 0}
 .d1-home .d1-approach-grid{grid-template-columns:1fr}
 .d1-home .d1-decision-visual{position:relative;top:auto;min-height:335px}
 .d1-home .d1-decision-canvas{height:204px}
 .d1-home .d1-decision-step{padding:20px 8px}
 .d1-home .d1-decision-step[aria-pressed="true"]{padding-left:13px}
 .d1-home .d1-across{padding:58px 0}
 .d1-home .d1-across-grid{grid-template-columns:1fr;gap:5px}
 .d1-home .d1-contact{padding:55px 0 70px;flex-direction:column;align-items:flex-start}
 .d1-his-roles{padding:17px}
 .d1-his-roles>div{grid-template-columns:repeat(2,minmax(0,1fr))}
 .d1-his-roles>div span{padding:12px 5px}
}
@media(prefers-reduced-motion:reduce){.d1-home *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Approved cinematic layout reference: bold type, immersive chapters, case images first. */
.d1-home .container{max-width:1380px;padding-left:clamp(24px,4.2vw,62px);padding-right:clamp(24px,4.2vw,62px)}
.d1-home .d1-hero{min-height:min(835px,calc(100svh - 78px));padding:95px 0 38px;display:flex;flex-direction:column;justify-content:center}
.d1-home .d1-hero-grid{grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(45px,5vw,96px)}
.d1-home .hero h1{font-size:clamp(59px,6.3vw,102px);line-height:1.01;letter-spacing:-.076em;margin-bottom:34px}
.d1-home .d1-lead{font-size:17px;line-height:1.75;color:#546278;max-width:450px}
.d1-home .d1-context{max-width:470px}
.d1-home .d1-hero-art{position:relative;min-height:430px;padding:24px;background:linear-gradient(135deg,#e8eeff,#f3f6ff 60%,#e7ecff);box-shadow:0 27px 75px #263d7a20;border:1px solid #d5def0}
.d1-home .d1-art-canvas{height:315px}
.d1-home .d1-art-screen{left:12%;width:76%;top:23%;box-shadow:0 25px 53px #273e7929}
.d1-home .d1-hero-motif{position:absolute;z-index:5;right:-22px;bottom:39px;background:#151b29;padding:18px 20px;box-shadow:0 16px 40px #1f2a4830;min-width:186px;color:#fff}
.d1-home .d1-hero-motif small{display:block;font-size:8px;letter-spacing:.14em;color:#b2bfd8;font-weight:790;margin-bottom:8px}
.d1-home .d1-hero-motif strong{font-size:18px;line-height:1.17;letter-spacing:-.035em}
.d1-home .d1-hero-motif strong span{color:#a4b3ff}
.d1-home .d1-hero-bottom{margin-top:auto;padding-top:61px}
.d1-home .d1-approach{padding:100px 0 105px}
.d1-home .d1-approach h2{font-size:clamp(47px,5.3vw,79px);line-height:1.03;letter-spacing:-.065em}
.d1-home .d1-section-lead{margin-bottom:50px}
.d1-home .d1-approach-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,5vw,83px)}
.d1-home .d1-decision-steps{grid-column:1;grid-row:1}
.d1-home .d1-decision-visual{grid-column:2;grid-row:1;position:sticky;top:92px;min-height:calc(100svh - 130px);background:linear-gradient(135deg,#eef2ff,#e5ebfa);color:#273653;border:1px solid #d6dfef;padding:30px;display:flex;flex-direction:column;justify-content:space-between}
.d1-home .d1-decision-head{color:#657cab}
.d1-home .d1-decision-canvas{height:clamp(300px,38vw,460px)}
.d1-home .d1-decision-foot{border-top:1px solid #c9d4e9;color:#65799d}
.d1-home .d1-step-count{color:#4d5eea}
.d1-home .d1-decision-visual small{color:#677ca5}
.d1-home .d1-pane-messy span{background:#fff;color:#394c78;border-color:#c6d2ed;box-shadow:0 8px 19px #26385f17}
.d1-home .d1-structure-columns>div{background:#cedaf4}
.d1-home .d1-structure-columns i{background:#9fadd1}
.d1-home .d1-structure-columns i:first-child{background:#6c81e8}
.d1-home .d1-product-window{box-shadow:14px 14px 0 #c3d0ed}
.d1-home .d1-decision-step{min-height:47vh;justify-content:center;gap:17px;padding:38px 10px}
.d1-home .d1-decision-step strong{font-size:clamp(30px,3.1vw,47px)}
.d1-home .d1-decision-step em{font-size:15px;max-width:400px}
.d1-home .d1-across{position:relative;left:50%;margin-left:-50vw;width:100vw;padding:clamp(85px,8.4vw,137px) max(24px,calc((100vw - 1240px)/2));background:#151c29;color:#fff;border:0;overflow:hidden}
.d1-home .d1-across:after{content:"";position:absolute;right:-210px;top:-280px;height:550px;width:550px;border-radius:50%;border:1px solid #384869;box-shadow:0 0 0 90px #8398e30a,0 0 0 180px #8398e308;pointer-events:none}
.d1-home .d1-across .overline{color:#b4bfff}
.d1-home .d1-across-grid{position:relative;z-index:1;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,100px)}
.d1-home .d1-across h2{font-size:clamp(47px,5.2vw,76px);color:#fff;line-height:1.06}
.d1-home .d1-across p{color:#b4c1d5;line-height:1.9;max-width:490px}
.d1-home .d1-across a{color:#b1bfff;font-size:15px}
.d1-home .d1-work{padding:110px 0 125px}
.d1-home .d1-work .section-heading h2{font-size:clamp(48px,5vw,76px);line-height:1.06}
.d1-home .d1-work .selected-description{margin:0 0 38px}
.d1-home .d1-work .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 34px}
.d1-home .d1-work .project:first-child{grid-column:auto;display:block;min-width:0}
.d1-home .d1-work .project:first-child .project-info{display:flex;flex-direction:column;align-items:stretch;padding:18px 4px 5px;min-height:198px}
.d1-home .d1-work .project:not(:first-child) .project-info{min-height:198px}
.d1-home .d1-work .project:first-child .project-foot{margin-top:auto}
.d1-home .d1-work .thumb,.d1-home .d1-work .project:first-child .thumb{height:320px;border-radius:0}
.d1-home .d1-work .thumb.his{padding:25px}
.d1-home .d1-work .thumb.his img{box-shadow:none;border-radius:0}
.d1-home .d1-work .project h3{font-size:clamp(26px,2.5vw,36px)}
.d1-home .d1-work .project-info p{font-size:13px;line-height:1.72}
.d1-home .d1-work .project:last-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);gap:clamp(28px,4vw,62px);align-items:center;border-top:1px solid #d4dce9;padding-top:50px}
.d1-home .d1-work .project:last-child .thumb{height:300px}
.d1-home .d1-work .project:last-child .project-info{min-height:0;max-width:500px;padding:16px 0}
.d1-home .d1-work .project:last-child .project-foot{margin-top:22px}
@media(max-width:900px){
 .d1-home .d1-hero{min-height:auto;padding:75px 0 33px}
 .d1-home .d1-hero-grid{grid-template-columns:1fr;gap:42px}
 .d1-home .d1-hero-bottom{margin-top:52px;padding-top:18px}
 .d1-home .d1-approach-grid{grid-template-columns:1fr;gap:24px}
 .d1-home .d1-decision-visual{grid-column:1;grid-row:1;position:relative;top:auto;min-height:430px}
 .d1-home .d1-decision-steps{grid-column:1;grid-row:2}
 .d1-home .d1-decision-step{min-height:0;padding:24px 10px}
 .d1-home .d1-across-grid{grid-template-columns:1fr}
 .d1-home .d1-work .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 .d1-home .container{padding-left:22px;padding-right:22px}
 .d1-home .d1-hero{padding:60px 0 30px}
 .d1-home .hero h1{font-size:clamp(48px,12vw,70px);line-height:1.05}
 html[lang="en"] .d1-home .hero h1{font-size:clamp(41px,10.5vw,61px)}
 .d1-home .d1-hero-art{min-height:350px;padding:17px}
 .d1-home .d1-hero-motif{right:-7px;bottom:34px;min-width:137px;padding:11px 13px}
 .d1-home .d1-hero-motif strong{font-size:13px}
 .d1-home .d1-art-canvas{height:267px}
 .d1-home .d1-approach{padding:65px 0}
 .d1-home .d1-approach h2{font-size:clamp(40px,10vw,56px)}
 .d1-home .d1-decision-visual{min-height:345px;padding:17px}
 .d1-home .d1-decision-canvas{height:226px}
 .d1-home .d1-decision-step{min-height:0;padding:20px 8px}
 .d1-home .d1-across{padding:80px 24px}
 .d1-home .d1-across h2{font-size:clamp(41px,10vw,58px)}
 .d1-home .d1-work{padding:75px 0 85px}
 .d1-home .d1-work .section-heading h2{font-size:44px}
 .d1-home .d1-work .grid{grid-template-columns:1fr;gap:33px}
 .d1-home .d1-work .project:first-child{grid-column:1}
 .d1-home .d1-work .thumb,.d1-home .d1-work .project:first-child .thumb{height:240px}
 .d1-home .d1-work .project:last-child{grid-column:1;display:block;padding-top:32px}
 .d1-home .d1-work .project:last-child .thumb{height:240px}
 .d1-home .d1-work .project:last-child .project-info{padding:18px 4px}
 .d1-home .d1-work .project:first-child .project-info,.d1-home .d1-work .project:not(:first-child) .project-info{min-height:0}
 .d1-home .d1-work .project:first-child .project-foot{margin-top:17px}
}

/* 2026-10-31: Compact sticky storytelling, based on the user's reference screenshot.
   Desktop: one active statement on the left and a 360px illustration on the right.
   A short scroll run changes three chapters; mobile uses explicit stage controls. */
.d1-home .d1-approach{padding-top:48px;padding-bottom:52px}
.d1-home .d1-approach h2{font-size:clamp(37px,4.2vw,59px);line-height:1.08;max-width:890px}
.d1-home .d1-section-lead{margin-bottom:23px}
.d1-home .d1-approach-grid{position:relative;height:540px;min-height:0;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,4vw,68px);align-items:start}
.d1-home .d1-decision-steps{grid-column:1;grid-row:1;position:sticky;top:105px;height:360px;min-height:0;display:block}
.d1-home .d1-decision-visual{grid-column:2;grid-row:1;position:sticky;top:105px;height:360px;min-height:0;padding:18px 20px}
.d1-home .d1-decision-canvas{height:247px;min-height:0;max-height:none}
.d1-home .d1-approach .d1-decision-step,
.d1-home .d1-approach .d1-decision-step[aria-pressed="true"]{
 position:absolute;inset:0 0 48px 0;width:100%;height:auto;min-height:0;
 padding:8px 0 0;border:0;background:transparent;
 display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;
 opacity:0;transform:translateY(13px);pointer-events:none;
 transition:opacity .33s ease,transform .35s ease;
}
.d1-home .d1-approach .d1-decision-step[aria-hidden="false"]{opacity:1;transform:none;pointer-events:auto}
.d1-home .d1-decision-step>span{font-size:11px;letter-spacing:.14em}
.d1-home .d1-decision-step strong{font-size:clamp(29px,2.6vw,38px);line-height:1.12;letter-spacing:-.055em}
.d1-home .d1-decision-step em{font-size:14px;line-height:1.7;max-width:420px;font-style:normal;color:#646c7b}
.d1-home .d1-decision-nav{position:absolute;bottom:12px;left:0;display:flex;gap:9px;z-index:6}
.d1-home .d1-decision-nav button{cursor:pointer;border:0;border-top:3px solid #c6cfdf;color:#78869f;background:transparent;min-width:53px;text-align:left;padding:10px 3px 3px;font-size:10px;font-weight:800;line-height:1.2;font-family:inherit;letter-spacing:.08em;transition:border-color .25s,color .25s}
.d1-home .d1-decision-nav button[aria-pressed="true"]{border-color:#4d5eea;color:#3546ce}
.d1-home .d1-decision-nav button:focus-visible{outline:3px solid #4d5eea;outline-offset:3px}
.d1-home .d1-motion-control{margin-top:8px;position:relative;text-align:right}
.d1-home.is-paused .d1-decision-step{transition:none!important}
@media(max-width:900px){
 .d1-home .d1-approach{padding:47px 0 51px}
 .d1-home .d1-approach-grid{height:auto;min-height:0;grid-template-columns:1fr;gap:18px}
 .d1-home .d1-decision-steps{position:relative;top:auto;grid-column:1;grid-row:1;height:210px}
 .d1-home .d1-decision-visual{position:relative;top:auto;grid-column:1;grid-row:2;height:305px;min-height:0;padding:17px 20px}
 .d1-home .d1-decision-canvas{height:205px}
 .d1-home .d1-approach .d1-decision-step{inset:0 0 45px 0;justify-content:center}
 .d1-home .d1-motion-control{margin-top:15px}
}
@media(max-width:700px){
 .d1-home .d1-approach{padding:41px 0}
 .d1-home .d1-approach h2{font-size:clamp(33px,8.5vw,45px)}
 .d1-home .d1-section-lead{margin-bottom:22px}
 .d1-home .d1-decision-steps{height:223px}
 .d1-home .d1-decision-step strong{font-size:28px}
 .d1-home .d1-decision-step em{font-size:14px;line-height:1.65}
 .d1-home .d1-decision-visual{height:277px;padding:13px}
 .d1-home .d1-decision-canvas{height:190px}
}
@media(prefers-reduced-motion:reduce){.d1-home .d1-decision-step{transition:none!important;transform:none!important}}

/* 2026-11-01: fix oversized separator and horizontal scroll.
   The scroll cue was between Hero and Design Approach (not Selected Work).
   Let the single approach border delineate the sections. */
.d1-home{max-width:100%;overflow-x:clip}
.d1-home .d1-hero{min-height:0;padding:clamp(52px,6vw,88px) 0 clamp(52px,6vw,85px);display:block}
.d1-home .d1-hero-grid{align-items:center}
.d1-home .d1-approach{border-top:1px solid #d6dce7;padding-top:clamp(42px,4.5vw,56px)}
.d1-home .d1-hero-motif{right:14px;bottom:64px;max-width:calc(100% - 28px);min-width:0}
.d1-home .d1-hero-art{min-width:0}
.d1-home .d1-across{max-width:none}
@media(max-width:900px){
 .d1-home .d1-hero{min-height:0;padding:58px 0 60px}
 .d1-home .d1-hero-motif{right:12px;bottom:63px}
}
@media(max-width:700px){
 .d1-home .d1-hero{padding:48px 0 52px}
 .d1-home .d1-approach{padding-top:41px}
 .d1-home .d1-hero-motif{right:10px;bottom:63px;max-width:45%}
}


/* WORK PAGE / THREE CARDS PER ROW
   Only the Work index changes. The three featured cards on Home retain their
   separate editorial layout; all five case studies remain visible. */
#work .page-projects .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
#work .page-projects .project{min-width:0;display:flex;flex-direction:column}
#work .page-projects .thumb{height:210px}
#work .page-projects .project-info{min-width:0;display:flex;flex:1;flex-direction:column;padding:21px 21px 23px}
#work .page-projects .project h3{font-size:22px;line-height:1.28;overflow-wrap:anywhere}
#work .page-projects .project p{font-size:12.5px;line-height:1.8}
#work .page-projects .project-foot{margin-top:auto;padding-top:15px;border-top:1px solid #e2e8ef}
@media(max-width:1099px) and (min-width:701px){
 #work .page-projects .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px}
 #work .page-projects .thumb{height:220px}
}
@media(max-width:700px){
 #work .page-projects .grid{grid-template-columns:1fr;gap:20px}
 #work .page-projects .thumb{height:235px}
 #work .page-projects .project-info{padding:22px}
 #work .page-projects .project h3{font-size:25px}
}

/* Navigation hierarchy: editorial section labels are quieter than numbered stages. */
.d1-home .d1-approach > .overline,
.d1-home .d1-work .overline,
.d1-home .d1-contact .overline{
 color:#798292;
 font-weight:650;
 letter-spacing:.16em;
}
.d1-home .d1-across > .overline{
 color:#aebacf;
 font-weight:650;
 letter-spacing:.16em;
}
.d1-home .d1-decision-step > span{
 color:#4d5eea;
 font-weight:840;
 letter-spacing:.14em;
}


/* HOMEPAGE FEATURED WORK — THREE UNIFORM CARDS
   Equal visual priority on desktop; 2 columns on tablet, 1 on mobile.
   Scope strictly to #home to preserve the independent five-case Work page. */
#home.d1-home .d1-work .grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:clamp(16px,2.15vw,30px);
 align-items:stretch;
}
#home.d1-home .d1-work .project,
#home.d1-home .d1-work .project:first-child,
#home.d1-home .d1-work .project:last-child{
 grid-column:auto;
 display:flex;
 flex-direction:column;
 align-items:stretch;
 gap:0;
 padding:0;
 border:0;
 min-width:0;
 max-width:none;
}
#home.d1-home .d1-work .thumb,
#home.d1-home .d1-work .project:first-child .thumb,
#home.d1-home .d1-work .project:last-child .thumb{
 width:100%;
 height:clamp(190px,16vw,238px);
 flex-shrink:0;
 border-radius:0;
}
#home.d1-home .d1-work .thumb.his{padding:17px}
#home.d1-home .d1-work .project-info,
#home.d1-home .d1-work .project:first-child .project-info,
#home.d1-home .d1-work .project:last-child .project-info,
#home.d1-home .d1-work .project:not(:first-child) .project-info{
 display:flex;
 flex:1;
 flex-direction:column;
 align-items:stretch;
 justify-content:flex-start;
 width:100%;
 max-width:none;
 min-width:0;
 min-height:0;
 padding:17px 2px 2px;
}
#home.d1-home .d1-work .project-kicker{
 font-size:10px;
 letter-spacing:.055em;
 line-height:1.5;
}
#home.d1-home .d1-work .project h3{
 font-size:clamp(21px,1.85vw,27px);
 line-height:1.22;
 letter-spacing:-.04em;
 margin:8px 0 10px;
}
#home.d1-home .d1-work .project p,
#home.d1-home .d1-work .project:first-child .project-info p{
 max-width:none;
 font-size:12.5px;
 line-height:1.72;
 margin:0 0 18px;
 display:-webkit-box;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:3;
 line-clamp:3;
 overflow:hidden;
}
#home.d1-home .d1-work .project-foot,
#home.d1-home .d1-work .project:first-child .project-foot,
#home.d1-home .d1-work .project:last-child .project-foot{
 width:100%;
 margin-top:auto;
 padding-top:14px;
}
@media(max-width:1099px) and (min-width:701px){
 #home.d1-home .d1-work .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 23px}
 #home.d1-home .d1-work .thumb,
 #home.d1-home .d1-work .project:first-child .thumb,
 #home.d1-home .d1-work .project:last-child .thumb{height:235px}
 #home.d1-home .d1-work .project h3{font-size:25px}
}
@media(max-width:700px){
 #home.d1-home .d1-work .grid{grid-template-columns:1fr;gap:33px}
 #home.d1-home .d1-work .thumb,
 #home.d1-home .d1-work .project:first-child .thumb,
 #home.d1-home .d1-work .project:last-child .thumb{height:240px}
 #home.d1-home .d1-work .project h3{font-size:26px}
 #home.d1-home .d1-work .project-info,
 #home.d1-home .d1-work .project:first-child .project-info,
 #home.d1-home .d1-work .project:last-child .project-info,
 #home.d1-home .d1-work .project:not(:first-child) .project-info{padding:17px 2px 2px}
 #home.d1-home .d1-work .project p{-webkit-line-clamp:4;line-clamp:4}
}
