:root{--navy:#061a32;--navy2:#0b2542;--ink:#142230;--paper:#f2f1ec;--white:#fff;--mist:#e8ebe9;--cyan:#4ac5d7;--line:rgba(20,34,48,.14);font-family:Inter,"Helvetica Neue","PingFang SC","Microsoft YaHei",Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizeLegibility}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink)}body,button,a{font:inherit}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button{color:inherit}.container{width:min(100% - 64px,1320px);margin-inline:auto}.section{padding:112px 0}.eyebrow{margin:0 0 21px;font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#16849a}.lead{font-size:17px;line-height:1.82;color:rgba(20,34,48,.62)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:520;letter-spacing:-.04em}h2{font-size:clamp(38px,4.25vw,62px);line-height:1.08}.reveal{opacity:0;transform:translateY(20px);transition:opacity .75s ease,transform .75s ease}.reveal.visible{opacity:1;transform:none}
.site-header{position:fixed;inset:0 0 auto;z-index:50;color:white;transition:.35s}.header-inner{width:min(100% - 64px,1360px);height:78px;margin:auto;display:flex;align-items:center;gap:34px;border-bottom:1px solid rgba(255,255,255,.1)}.site-header.scrolled,.site-header.menu-open{background:rgba(6,26,50,.94);backdrop-filter:blur(14px);box-shadow:0 8px 35px rgba(1,14,29,.12)}.logo span,.footer-logo{display:inline-flex;padding:9px 13px;border-radius:5px;background:#f8f7f3}.logo img{height:21px;width:auto}.desktop-nav{margin-left:auto;display:flex;gap:23px;align-items:center}.desktop-nav a{font-size:11px;color:rgba(255,255,255,.7);white-space:nowrap;transition:.25s}.desktop-nav a:hover{color:white}.header-actions{display:flex;align-items:center;gap:18px}.lang{display:flex;align-items:center;gap:8px;padding:0;border:0;background:none;cursor:pointer}.lang span{font-size:10px;letter-spacing:.12em;opacity:.4}.lang span.active{opacity:1}.lang i{width:1px;height:12px;background:rgba(255,255,255,.3)}.header-cta{padding:11px 15px;border-radius:4px;background:white;color:var(--navy);font-size:11px;white-space:nowrap}.menu-button{display:none;width:40px;height:40px;border:0;background:transparent;position:relative}.menu-button span{position:absolute;left:9px;width:22px;height:1px;background:white;transition:.25s}.menu-button span:first-child{top:15px}.menu-button span:last-child{top:24px}.menu-open .menu-button span:first-child{top:20px;transform:rotate(45deg)}.menu-open .menu-button span:last-child{top:20px;transform:rotate(-45deg)}.mobile-menu{display:none}
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:var(--navy);color:white}.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.hero-wash{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,20,39,.9) 0%,rgba(3,20,39,.62) 38%,rgba(3,20,39,.12) 75%),linear-gradient(0deg,rgba(3,20,39,.62) 0%,transparent 42%)}.hero-content{position:relative;padding:128px 0 72px;transform:translateY(4vh)}.hero-eyebrow{color:var(--cyan)}.hero h1{max-width:880px;margin:0;font-size:clamp(48px,5.45vw,78px);line-height:1.02;letter-spacing:-.058em;text-wrap:balance}.hero-body{max-width:650px;margin:26px 0 0;font-size:16px;line-height:1.85;color:rgba(255,255,255,.72)}.hero-actions{display:flex;gap:12px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 23px;border-radius:4px;font-size:12px;font-weight:600;transition:.25s}.button.light{background:white;color:var(--navy)}.button.light:hover{background:var(--cyan)}.button.ghost{border:1px solid rgba(255,255,255,.38);color:white}.button.ghost:hover{border-color:var(--cyan);color:var(--cyan)}.hero-note{display:flex;align-items:center;gap:15px;margin:52px 0 0;font-size:9px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.48)}.hero-note span{width:48px;height:1px;background:var(--cyan)}html[lang^="zh"] .hero h1{max-width:820px;font-size:clamp(46px,5vw,72px);line-height:1.05;letter-spacing:-.055em}
.position{background:#f7f6f2}.position-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:9vw;align-items:center}.position-copy h2{max-width:650px}.position-copy .lead{max-width:680px;margin-top:34px}.position-images{position:relative;min-height:720px}.position-images figure{margin:0;position:absolute}.position-images img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(.98)}.position-images figcaption{position:absolute;left:18px;bottom:16px;padding:9px 12px;background:rgba(6,26,50,.82);color:white;font-size:10px;letter-spacing:.12em;text-transform:uppercase;backdrop-filter:blur(8px)}.position-exterior{left:0;top:0;width:76%;height:70%}.position-interior{right:0;bottom:0;width:58%;height:47%;box-shadow:-18px -18px 0 #f7f6f2}
.work{background:var(--paper)}.section-heading{display:flex;justify-content:space-between;gap:72px;align-items:flex-end}.section-heading>div:first-child{max-width:760px}.section-heading h2{margin-bottom:24px}.section-heading .lead{max-width:700px}.filters{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0;max-width:470px;border-bottom:1px solid var(--line)}.filters button{padding:10px 13px 9px;border:0;border-bottom:2px solid transparent;background:transparent;font-size:11px;color:rgba(20,34,48,.5);cursor:pointer;transform:translateY(1px)}.filters button.active,.filters button:hover{background:transparent;border-color:var(--navy);color:var(--navy)}
.masonry{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:28px;row-gap:76px;margin-top:86px;align-items:start}.case-card{margin:0;min-width:0;transition:opacity .35s,transform .35s}.case-card.is-hidden{display:none}.case-1{grid-column:1/8}.case-2{grid-column:8/13;margin-top:96px}.case-3{grid-column:1/6}.case-4{grid-column:6/13}.case-5{grid-column:1/7}.case-6{grid-column:8/13;margin-top:72px}.case-7{grid-column:1/6}.case-8{grid-column:6/13}.case-media{overflow:hidden;border-radius:5px;background:#dfe3e2}.case-media img{width:100%;height:100%;object-fit:cover;transition:transform .65s ease}.case-1 .case-media{aspect-ratio:16/10}.case-2 .case-media{aspect-ratio:1/1}.case-3 .case-media{aspect-ratio:3/2}.case-4 .case-media{aspect-ratio:16/10}.case-5 .case-media{aspect-ratio:16/10}.case-6 .case-media{aspect-ratio:4/3}.case-7 .case-media{aspect-ratio:4/3}.case-8 .case-media{aspect-ratio:16/10}.case-1 img{object-position:50% 50%}.case-2 img{object-position:64% 48%}.case-3 img{object-position:50% 50%}.case-4 img{object-position:50% 50%}.case-5 img{object-position:50% 56%}.case-6 img{object-position:52% 50%}.case-7 img{object-position:58% 50%}.case-8 img{object-position:50% 54%}.case-card:hover img{transform:scale(1.018)}.case-copy{display:flex;justify-content:space-between;gap:24px;padding-top:17px}.case-title{margin:0;font-size:21px;font-weight:560;line-height:1.25;letter-spacing:-.035em}.case-meta{margin:7px 0 0;color:rgba(20,34,48,.48);font-size:11px;line-height:1.6}.case-index{padding-top:4px;font-size:9px;letter-spacing:.14em;color:rgba(20,34,48,.34)}.masonry.is-filtered{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;row-gap:70px}.masonry.is-filtered .case-card{grid-column:auto;margin-top:0}.masonry.is-filtered .case-media{aspect-ratio:16/10}
.services{background:var(--navy);color:white}.services .eyebrow{color:var(--cyan)}.services-intro{display:grid;grid-template-columns:1fr 1.15fr;gap:8vw;align-items:end}.services-intro .lead{color:rgba(255,255,255,.58)}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:76px;border-top:1px solid rgba(255,255,255,.16);border-left:1px solid rgba(255,255,255,.16)}.service-card{min-height:330px;padding:30px;border-right:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16);transition:background .3s}.service-card:hover{background:rgba(255,255,255,.055)}.service-card span{font-size:11px;color:var(--cyan);letter-spacing:.18em}.service-card h3{margin:84px 0 20px;font-size:28px;line-height:1.15}.service-card p{margin:0;color:rgba(255,255,255,.56);font-size:14px;line-height:1.8}
.rd{background:#e9ecea}.rd-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:7vw;align-items:center}.rd-copy .lead{margin:28px 0}.rd-copy ol{list-style:none;padding:0;margin:38px 0}.rd-copy li{counter-increment:rd;padding:13px 0;border-bottom:1px solid rgba(20,34,48,.13);font-size:14px}.rd-copy ol{counter-reset:rd}.rd-copy li:before{content:"0" counter(rd);display:inline-block;width:42px;color:#16849a;font-size:10px;letter-spacing:.12em}.text-link{display:inline-block;padding-bottom:6px;border-bottom:1px solid currentColor;font-size:13px;font-weight:650}.text-link:after{content:" ↗";color:#16849a}.rd-image{position:relative;display:block;overflow:hidden;border-radius:8px;box-shadow:0 26px 70px rgba(6,26,50,.18)}.rd-image img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .7s}.rd-image:hover img{transform:scale(1.025)}.rd-image>span{position:absolute;right:18px;top:18px;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:white;color:var(--navy);font-size:22px}
.collaboration{background:#f7f6f2}.collaboration-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.collab-card{min-height:500px;padding:58px;display:flex;flex-direction:column;justify-content:flex-end;background:#dfe7e5}.collab-card.dark{background:var(--navy2);color:white}.collab-card h2{font-size:clamp(36px,4vw,58px)}.collab-card>p:last-child{max-width:640px;margin:22px 0 0;font-size:16px;line-height:1.8;color:rgba(20,34,48,.65)}.collab-card.dark>p:last-child{color:rgba(255,255,255,.6)}
.ecosystem{background:var(--paper)}.ecosystem-grid{display:grid;grid-template-columns:1fr 1fr;gap:9vw}.ecosystem .lead{margin:35px 0}.contact{padding:130px 0;background:linear-gradient(115deg,#061a32,#0d3151);color:white}.contact-inner{max-width:980px}.contact .eyebrow{color:var(--cyan)}.contact h2{max-width:900px}.contact p:not(.eyebrow){max-width:700px;margin:30px 0;color:rgba(255,255,255,.62);font-size:17px;line-height:1.8}.contact .button{margin-top:12px}
footer{padding:76px 0 32px;background:#031327;color:white}.footer-grid{display:grid;grid-template-columns:1.15fr .72fr 1fr;gap:48px 70px;align-items:start}.footer-logo img{height:22px}.footer-brand>p{max-width:270px;margin:20px 0 0;color:rgba(255,255,255,.48);font-size:12px;line-height:1.65}.footer-nav{display:grid;grid-template-columns:repeat(2,max-content);gap:12px 30px}.footer-nav a,.footer-social a{font-size:12px;color:rgba(255,255,255,.62);transition:color .25s}.footer-nav a:hover,.footer-social a:hover{color:var(--cyan)}.footer-contact{border-left:1px solid rgba(255,255,255,.14);padding-left:32px}.footer-label{margin:0 0 13px;color:var(--cyan);font-size:9px;font-weight:700;letter-spacing:.19em;text-transform:uppercase}.footer-email{display:inline-flex;gap:11px;padding-bottom:7px;border-bottom:1px solid rgba(255,255,255,.3);font-size:15px;letter-spacing:-.015em;color:white;transition:border-color .25s,color .25s}.footer-email span,.footer-social span{color:var(--cyan)}.footer-email:hover{border-color:var(--cyan);color:var(--cyan)}.footer-social{margin-top:31px}.footer-social>div{display:flex;flex-wrap:wrap;gap:10px 22px}.footer-social a{display:inline-flex;gap:7px}.footer-meta{grid-column:1/-1;display:flex;justify-content:space-between;gap:24px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12)}.footer-meta p{margin:0;color:rgba(255,255,255,.42);font-size:10px;letter-spacing:.02em}

/* Chinese typography uses its own rhythm instead of inheriting English display scale. */
html[lang^="zh"] body{font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Inter,Arial,sans-serif;word-break:normal;line-break:strict;overflow-wrap:break-word}
html[lang^="zh"] h1,html[lang^="zh"] h2,html[lang^="zh"] h3{font-weight:500;letter-spacing:-.03em;text-wrap:balance}
html[lang^="zh"] p{orphans:2;widows:2;text-wrap:pretty}
html[lang^="zh"] h2{font-size:clamp(36px,3.65vw,52px);line-height:1.14}
html[lang^="zh"] .desktop-nav a{font-size:12px}
html[lang^="zh"] .lang span{font-size:11px}
html[lang^="zh"] .header-cta{font-size:12px}
html[lang^="zh"] .eyebrow{font-size:11px;letter-spacing:.16em}
html[lang^="zh"] .lead{font-size:16px;line-height:1.9}
html[lang^="zh"] .hero h1{max-width:800px;font-size:clamp(44px,4.55vw,64px);line-height:1.08;letter-spacing:-.04em}
html[lang^="zh"] .hero-body{max-width:620px;font-size:16px;line-height:1.9}
html[lang^="zh"] .hero-note{font-size:11px;line-height:1.7;letter-spacing:.1em}
html[lang^="zh"] .button{font-size:13px}
html[lang^="zh"] .filters button{font-size:12px}
html[lang^="zh"] .position-images figcaption{font-size:11px;letter-spacing:.08em}
html[lang^="zh"] .case-title{font-size:20px;font-weight:560;letter-spacing:-.02em}
html[lang^="zh"] .case-meta{font-size:12px;line-height:1.65}
html[lang^="zh"] .services-intro h2{font-size:clamp(36px,3.55vw,50px);line-height:1.15}
html[lang^="zh"] .service-card h3{font-size:25px;line-height:1.25;letter-spacing:-.02em}
html[lang^="zh"] .service-card p{font-size:15px;line-height:1.9}
html[lang^="zh"] .rd-copy h2{font-size:clamp(36px,3.55vw,50px);line-height:1.16}
html[lang^="zh"] .rd-copy li{font-size:15px;line-height:1.65}
html[lang^="zh"] .collab-card h2{font-size:clamp(32px,3vw,42px);line-height:1.2}
html[lang^="zh"] .collab-card>p:last-child{font-size:16px;line-height:1.9}
html[lang^="zh"] .ecosystem h2{font-size:clamp(36px,3.55vw,50px);line-height:1.15}
html[lang^="zh"] .contact h2{max-width:820px;font-size:clamp(38px,3.85vw,54px);line-height:1.14}
html[lang^="zh"] .contact p:not(.eyebrow){font-size:16px;line-height:1.9}
html[lang^="zh"] .text-link{font-size:14px}
@media(max-width:1180px){.desktop-nav{gap:15px}.desktop-nav a{font-size:11px}.header-cta{display:none}.position-grid{gap:6vw}.service-grid{grid-template-columns:repeat(2,1fr)}.masonry{column-gap:22px;row-gap:66px}.case-2{margin-top:76px}.case-6{margin-top:56px}}
@media(max-width:900px){.container{width:min(100% - 36px,1320px)}.section{padding:88px 0}.desktop-nav,.header-cta{display:none}.menu-button{display:block;margin-left:auto}.header-actions{margin-left:auto}.header-inner{width:min(100% - 36px,1360px);height:74px}.mobile-menu{display:block;max-height:0;overflow:hidden;background:var(--navy);transition:max-height .4s}.menu-open .mobile-menu{max-height:620px}.mobile-menu nav{padding:16px 18px 30px}.mobile-menu a{display:block;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:26px}.hero-content{padding:126px 0 54px;transform:translateY(3vh)}.hero h1,html[lang^="zh"] .hero h1{max-width:700px;font-size:clamp(46px,8vw,68px)}.hero-body{font-size:15px}.hero-note{margin-top:44px}.position-grid,.rd-grid,.ecosystem-grid{grid-template-columns:1fr}.position-images{min-height:600px}.section-heading{display:block}.filters{justify-content:flex-start;max-width:none;margin-top:30px}.services-intro{grid-template-columns:1fr}.collaboration-grid{grid-template-columns:1fr}.collab-card{min-height:420px;padding:42px}.footer-grid{grid-template-columns:1fr 1fr;gap:44px}.footer-contact{padding-left:24px}.footer-meta{grid-column:1/-1;text-align:left}.masonry,.masonry.is-filtered{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;row-gap:58px}.masonry .case-card,.masonry.is-filtered .case-card{grid-column:auto;margin-top:0}.masonry .case-media,.masonry.is-filtered .case-media{aspect-ratio:4/3}.masonry .case-1,.masonry .case-4,.masonry .case-5,.masonry .case-8{grid-column:1/-1}.masonry .case-1 .case-media,.masonry .case-4 .case-media,.masonry .case-5 .case-media,.masonry .case-8 .case-media{aspect-ratio:16/9}}
@media(max-width:600px){.container{width:min(100% - 28px,1320px)}.eyebrow{margin-bottom:18px}.section{padding:72px 0}h2{font-size:38px}.header-inner{width:min(100% - 28px,1360px)}.logo img{height:18px}.logo span{padding:8px 11px}.lang{gap:6px}.hero{min-height:760px;align-items:flex-end}.hero-image{object-position:59% center}.hero-wash{background:linear-gradient(0deg,rgba(3,20,39,.94) 0%,rgba(3,20,39,.66) 60%,rgba(3,20,39,.18))}.hero-content{padding:128px 0 44px;transform:none}.hero h1,html[lang^="zh"] .hero h1{max-width:520px;font-size:clamp(42px,12vw,54px);line-height:1.06}.hero-body{margin-top:22px;line-height:1.72}.hero-actions{flex-direction:column;align-items:stretch}.hero-note{align-items:flex-start;line-height:1.7;margin-top:38px}.position-images{min-height:500px}.position-exterior{width:86%;height:66%}.position-interior{width:64%;height:46%}.masonry,.masonry.is-filtered{display:block;margin-top:54px}.masonry .case-card,.masonry.is-filtered .case-card{margin-bottom:52px}.masonry .case-media,.masonry.is-filtered .case-media,.masonry .case-1 .case-media,.masonry .case-2 .case-media,.masonry .case-3 .case-media,.masonry .case-4 .case-media,.masonry .case-5 .case-media,.masonry .case-6 .case-media,.masonry .case-7 .case-media,.masonry .case-8 .case-media{aspect-ratio:4/3}.case-title{font-size:20px}.services-intro{gap:10px}.service-grid{grid-template-columns:1fr;margin-top:50px}.service-card{min-height:auto;padding:28px}.service-card h3{margin:44px 0 16px}.rd-grid{gap:48px}.collab-card{min-height:430px;padding:30px}.footer-grid{grid-template-columns:1fr;gap:35px}.footer-nav{grid-template-columns:repeat(2,1fr);max-width:270px}.footer-contact{border-left:0;border-top:1px solid rgba(255,255,255,.14);padding:28px 0 0}.footer-meta{grid-column:auto;display:block;padding-top:21px}.footer-meta p+p{margin-top:9px}.contact{padding:88px 0}}
@media(max-width:1180px){html[lang^="zh"] .desktop-nav a{font-size:12px}}
@media(max-width:900px){html[lang^="zh"] h2{font-size:clamp(34px,5.8vw,46px)}html[lang^="zh"] .mobile-menu a{font-size:24px}html[lang^="zh"] .hero h1{font-size:clamp(42px,7.2vw,58px);line-height:1.1}html[lang^="zh"] .collab-card h2{font-size:clamp(32px,5vw,40px)}}
@media(max-width:600px){html[lang^="zh"] h2,html[lang^="zh"] .services-intro h2,html[lang^="zh"] .rd-copy h2,html[lang^="zh"] .ecosystem h2{font-size:34px;line-height:1.18}html[lang^="zh"] .hero h1{font-size:clamp(38px,10.5vw,42px);line-height:1.1;letter-spacing:-.03em}html[lang^="zh"] .lead,html[lang^="zh"] .hero-body,html[lang^="zh"] .contact p:not(.eyebrow),html[lang^="zh"] .collab-card>p:last-child{font-size:15px;line-height:1.85}html[lang^="zh"] .collab-card h2{font-size:32px;line-height:1.2}html[lang^="zh"] .contact h2{font-size:36px;line-height:1.17}html[lang^="zh"] .service-card h3{font-size:24px}html[lang^="zh"] .case-title{font-size:20px}html[lang^="zh"] .case-meta{font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.case-media img,.rd-image img{transition:none}}
.designer-latest-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px}
.designer-card{display:block;color:inherit;text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.designer-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(6,26,50,.12)}
.designer-card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.designer-card h3{font-size:20px;line-height:1.35;padding:0 22px;margin:4px 0 10px}
.designer-card>p:last-child{padding:0 22px 22px;font-size:14px;line-height:1.7;color:rgba(20,34,48,.72);margin:0}
.designer-card-meta{padding:18px 22px 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#16849a;margin:0}
html[lang^="zh"] .designer-card-meta{letter-spacing:.14em}
@media(max-width:900px){.designer-latest-grid{grid-template-columns:1fr}}

/* ===== 案例卡片可点击（5 个真实案例） ===== */
a.case-card{display:block;-webkit-tap-highlight-color:transparent}
a.case-card .case-title{transition:color .3s}
a.case-card:hover .case-title{color:#0e6b7d}
.case-index{display:inline-flex;align-items:center;gap:6px;transition:color .3s}
.case-index::after{content:"→";opacity:0;transform:translateX(-4px);transition:.35s}
a.case-card:hover .case-index::after{opacity:1;transform:translateX(0)}
@media(min-width:1181px){
  .masonry .case-1{grid-column:1/8;margin-top:0}
  .masonry .case-1 .case-media{aspect-ratio:16/10}
  .masonry .case-2{grid-column:8/13;margin-top:96px}
  .masonry .case-2 .case-media{aspect-ratio:1/1}
  .masonry .case-3{grid-column:1/6;margin-top:0}
  .masonry .case-3 .case-media{aspect-ratio:3/2}
  .masonry .case-4{grid-column:6/13;margin-top:0}
  .masonry .case-4 .case-media{aspect-ratio:16/10}
  .masonry .case-5{grid-column:8/13;margin-top:0}
  .masonry .case-5 .case-media{aspect-ratio:4/3}
}

/* ===== 案例详情页 /case/:slug ===== */
.casepage{background:var(--paper);padding-bottom:0}
.casepage-hero{position:relative;min-height:78vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--navy);color:#fff}
.casepage-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.casepage-hero-wash{position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,20,39,.94) 0%,rgba(3,20,39,.52) 55%,rgba(3,20,39,.18))}
.casepage-hero-inner{position:relative;padding:128px 0 56px}
.casepage-back{display:inline-block;color:rgba(255,255,255,.72);font-size:13px;transition:color .25s}
.casepage-back:hover{color:#fff}
.casepage-hero-type{color:var(--cyan);margin:34px 0 0}
.casepage-hero h1{margin:18px 0 0;font-size:clamp(40px,5vw,72px);line-height:1.04;letter-spacing:-.05em;max-width:980px;text-wrap:balance;color:#fff}
.casepage-tagline{margin:18px 0 0;font-size:18px;line-height:1.7;color:rgba(255,255,255,.82);max-width:720px}
.casepage-hero-meta{margin:22px 0 0;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.casepage-overview{display:grid;grid-template-columns:5fr 7fr;gap:64px;padding:96px 0 40px;align-items:start}
.casepage-lead-text{margin:24px 0 0;font-size:19px;line-height:1.9;color:rgba(20,34,48,.78)}
.casepage-specs{border-top:1px solid var(--line);padding-top:26px}
.casepage-specs-title{margin:0 0 22px;font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:rgba(20,34,48,.45)}
.casepage-spec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.casepage-spec{background:var(--paper);padding:20px 22px}
.casepage-spec-label{margin:0;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(20,34,48,.45)}
.casepage-spec-value{margin:9px 0 0;font-size:14px;line-height:1.55;color:var(--ink);font-weight:550}
.casepage-sec{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:28px;align-items:center;padding:64px 0}
.casepage-sec-left .casepage-figure{grid-column:1/8}
.casepage-sec-left .casepage-sec-text{grid-column:9/13}
.casepage-sec-right .casepage-figure{grid-column:6/13}
.casepage-sec-right .casepage-sec-text{grid-column:1/5}
.casepage-sec-text h2{margin:18px 0 0;font-size:clamp(26px,2.4vw,36px);line-height:1.18;letter-spacing:-.035em;color:var(--ink)}
.casepage-sec-text .lead{margin:22px 0 0}
.casepage-figure{margin:0;overflow:hidden;border-radius:5px;background:#dfe3e2}
.casepage-figure img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.casepage-sec-full{padding:64px 0}
.casepage-sec-full .casepage-figure img{aspect-ratio:16/8.5}
.casepage-sec-full .casepage-sec-text{max-width:860px;margin-top:40px}
.casepage-sec-full .casepage-sec-text h2{margin:18px 0 0;font-size:clamp(28px,2.8vw,42px);line-height:1.15;letter-spacing:-.04em}
.casepage-gallery{padding:72px 0 96px}
.casepage-gallery .eyebrow{margin-bottom:34px}
.casepage-shot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.casepage-shot{margin:0;min-width:0}
.casepage-shot:nth-child(3n+1){grid-column:1/-1}
.casepage-shot:nth-child(3n+1) img{aspect-ratio:16/8}
.casepage-shot img{display:block;width:100%;object-fit:cover;aspect-ratio:4/3;border-radius:5px;background:#dfe3e2}
.casepage-shot figcaption{margin-top:10px;font-size:12px;color:rgba(20,34,48,.5);letter-spacing:.02em}
.casepage-pager{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:40px 0 104px;border-top:1px solid var(--line)}
.casepage-pager-item{display:block;padding:30px 32px;border:1px solid var(--line);border-radius:8px;transition:border-color .3s,background .3s}
.casepage-pager-item:hover{border-color:rgba(22,132,154,.5);background:#fff}
.casepage-pager-item span{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(20,34,48,.45)}
.casepage-pager-item strong{display:block;margin-top:12px;font-size:20px;font-weight:560;letter-spacing:-.02em;line-height:1.3;color:var(--ink)}
.casepage-pager-next{text-align:right}
@media(max-width:900px){
  .casepage-overview{grid-template-columns:1fr;gap:44px;padding:76px 0 32px}
  .casepage-sec{grid-template-columns:1fr;gap:28px;padding:48px 0}
  .casepage-sec-left .casepage-figure,.casepage-sec-left .casepage-sec-text,
  .casepage-sec-right .casepage-figure,.casepage-sec-right .casepage-sec-text{grid-column:1/-1}
}
@media(max-width:600px){
  .casepage-hero{min-height:70vh}
  .casepage-hero-inner{padding:112px 0 40px}
  .casepage-tagline{font-size:16px}
  .casepage-lead-text{font-size:17px;line-height:1.85}
  .casepage-spec-grid{grid-template-columns:1fr}
  .casepage-shot-grid{grid-template-columns:1fr;gap:18px}
  .casepage-shot:nth-child(3n+1){grid-column:auto}
  .casepage-shot:nth-child(3n+1) img{aspect-ratio:4/3}
  .casepage-pager{grid-template-columns:1fr;gap:14px;padding:28px 0 72px}
  .casepage-pager-next{text-align:left}
  .casepage-pager-item{padding:24px}
  .casepage-pager-item strong{font-size:18px}
  .casepage-sec,.casepage-sec-full{padding:40px 0}
  .casepage-gallery{padding:56px 0 72px}
}