:root{--ink:#132329;--orange:#ff6d2d;--paper:#f4f0e8;--green:#526c58;--line:rgba(19,35,41,.18);--serif:"Noto Serif TC","Songti TC","PMingLiU",serif;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.7}img{display:block;width:100%}a{color:inherit;text-decoration:none}.site-header{position:absolute;z-index:10;top:0;left:0;width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:24px 3.2vw;color:white;border-bottom:1px solid rgba(255,255,255,.3);font-size:13px;letter-spacing:.08em}.brand{display:flex;align-items:center;gap:11px;font-weight:600}.brand-mark{display:grid;place-items:center;width:30px;height:30px;border:1px solid currentColor;border-radius:50%;font-family:var(--serif);font-size:15px}.site-header nav{display:flex;gap:34px}.site-header nav a,.contact-link{transition:opacity .25s}.site-header nav a:hover,.contact-link:hover{opacity:.6}.contact-link{justify-self:end}.contact-link span{margin-left:8px}.hero{height:100svh;min-height:680px;position:relative;color:white;overflow:hidden}.hero>img{height:100%;object-fit:cover;animation:heroScale 14s ease-out both}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,28,34,.64) 0%,rgba(10,28,34,.2) 58%,rgba(10,28,34,.06)),linear-gradient(0deg,rgba(10,28,34,.35),transparent 50%)}.hero-copy{position:absolute;left:8vw;bottom:16vh;max-width:960px}.eyebrow{text-transform:uppercase;letter-spacing:.19em;font-size:11px;font-weight:600}.hero h1,.section h2{font-family:var(--serif);font-weight:500;letter-spacing:.02em}.hero h1{margin:25px 0 28px;font-size:clamp(52px,7.5vw,116px);line-height:1.12}.hero-intro{font-size:clamp(15px,1.2vw,19px);letter-spacing:.08em}.scroll-cue{position:absolute;right:3.2vw;bottom:35px;font-size:10px;letter-spacing:.15em;text-transform:uppercase;display:flex;align-items:center;gap:12px}.scroll-cue span{display:block;width:54px;height:1px;background:white;animation:scrollLine 2s infinite}.section{padding:140px 7.5vw}.section-label{display:flex;align-items:center;gap:22px;font-size:11px;text-transform:uppercase;letter-spacing:.18em}.section-label span{color:var(--orange)}.statement{min-height:90vh;display:flex;flex-direction:column;justify-content:center}.statement-grid{margin-top:100px;display:grid;grid-template-columns:1.2fr .8fr;gap:10vw}.statement h2,.services h2,.projects h2,.systems h2{font-size:clamp(42px,5.5vw,84px);line-height:1.22;margin:0}.statement-copy{padding-top:18px;font-size:18px;max-width:520px}.statement-copy p+ p{margin-top:32px}.services{background:#ece6dc}.services-head{display:flex;justify-content:space-between;align-items:end;margin:90px 0 75px}.services-head p{text-transform:uppercase;letter-spacing:.16em;font-size:11px}.service-list{border-top:1px solid var(--line)}.service{display:grid;grid-template-columns:90px 1fr 1fr;gap:30px;align-items:center;padding:26px 0;border-bottom:1px solid var(--line);transition:padding .3s,background .3s}.service:hover{padding-left:18px;background:rgba(255,255,255,.25)}.service>span{font-size:11px;color:var(--orange)}.service h3{font-family:var(--serif);font-size:25px;font-weight:500;margin:0}.service p{margin:0;color:#5b6769}.material{padding:0;display:grid;grid-template-columns:1fr 1fr;min-height:850px;background:#213e3c;color:white}.material-visual{background:#f1eee7;display:grid;place-items:center;padding:10vw}.material-visual img{max-width:550px;mix-blend-mode:multiply}.material-copy{padding:120px 8vw;display:flex;flex-direction:column;justify-content:center}.section-label.light{color:rgba(255,255,255,.7);margin-bottom:90px}.material-copy h2{font-size:clamp(42px,5vw,76px);line-height:1.18;margin:18px 0 34px}.material-copy>p:not(.eyebrow){max-width:500px;color:rgba(255,255,255,.74)}.material dl{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:70px 0}.material dl div{border-top:1px solid rgba(255,255,255,.3);padding-top:18px}.material dt{font-family:var(--serif);font-size:42px;color:#ff8b55}.material dd{margin:8px 0 0;font-size:13px}.material small{color:rgba(255,255,255,.5)}.text-link{width:max-content;border-bottom:1px solid currentColor;padding-bottom:7px;font-size:13px}.text-link span{margin-left:40px}.systems{display:grid;grid-template-columns:.8fr 1.2fr;gap:9vw;align-items:center}.system-copy>p{max-width:520px;margin:40px 0 55px}.system-copy .section-label{margin-bottom:80px}.system-copy ol{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}.system-copy li{padding:15px 0;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:18px}.system-copy li span{display:inline-block;width:50px;font-family:var(--sans);font-size:10px;color:var(--orange)}.system-image{background:#ead9b4;padding:6vw}.projects{background:#192a30;color:white}.projects .section-label{color:rgba(255,255,255,.55)}.projects-title{display:flex;justify-content:space-between;align-items:end;margin:90px 0 70px}.projects-title p{font-size:12px;letter-spacing:.18em}.project-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:24px;align-items:start}.project{margin:0}.project img{aspect-ratio:4/3;object-fit:cover;filter:saturate(.5) contrast(.95);transition:filter .4s,transform .6s}.project-large img{aspect-ratio:16/10}.project:hover img{filter:saturate(.85);transform:scale(1.01)}.project figcaption{display:flex;gap:22px;padding-top:17px;font-family:var(--serif);font-size:17px}.project figcaption>span{font-family:var(--sans);font-size:10px;color:#ff8b55}.project figcaption small{display:block;font-family:var(--sans);color:rgba(255,255,255,.5);font-size:11px;margin-top:4px}.closing{text-align:center;min-height:90vh;display:flex;align-items:center;justify-content:center;flex-direction:column}.closing h2{font-size:clamp(54px,7vw,108px);line-height:1.18;margin:28px 0 60px}.contact-button{border:1px solid var(--ink);border-radius:50%;width:180px;height:180px;display:grid;place-content:center;font-size:13px;transition:background .3s,color .3s,transform .3s}.contact-button:hover{background:var(--orange);color:white;border-color:var(--orange);transform:rotate(-5deg)}.contact-button span{display:block;margin-top:8px}.closing-logo{margin-top:100px}.closing-logo img{width:72px;height:92px;object-fit:cover;object-position:top;margin:auto;mix-blend-mode:multiply}.closing-logo p{font-size:11px;letter-spacing:.22em}footer{display:flex;justify-content:space-between;padding:24px 3.2vw;border-top:1px solid var(--line);font-size:10px;letter-spacing:.12em;text-transform:uppercase}.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s ease,transform 1s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}@keyframes heroScale{from{transform:scale(1.06)}to{transform:scale(1)}}@keyframes scrollLine{0%,100%{transform:scaleX(.35);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}}@media(max-width:800px){.site-header{grid-template-columns:1fr auto;padding:18px 20px}.site-header nav{display:none}.contact-link{font-size:0}.contact-link span{font-size:16px}.hero{min-height:620px}.hero-copy{left:24px;right:24px;bottom:15vh}.hero h1{font-size:48px}.section{padding:95px 24px}.statement-grid,.material,.systems{grid-template-columns:1fr}.statement-grid{margin-top:55px;gap:35px}.statement h2,.services h2,.projects h2,.systems h2{font-size:40px}.services-head,.projects-title{display:block;margin:55px 0 40px}.services-head p,.projects-title p{margin-top:25px}.service{grid-template-columns:38px 1fr;padding:22px 0}.service p{grid-column:2}.material-visual{min-height:480px;padding:70px}.material-copy{padding:90px 24px}.section-label.light,.system-copy .section-label{margin-bottom:55px}.material dl{gap:10px;margin:50px 0}.material dt{font-size:30px}.systems{gap:65px}.system-image{grid-row:1;padding:60px}.project-grid{grid-template-columns:1fr}.closing h2{font-size:52px}.contact-button{width:150px;height:150px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero>img,.scroll-cue span{animation:none}.reveal{opacity:1;transform:none;transition:none}}

/* Header brand: symbol and wordmark are one flush-aligned unit. */
.site-header .brand{
  display:flex;
  width:auto;
  flex-direction:row;
  align-items:center;
  gap:0;
  line-height:0;
}
.site-header .brand img{
  display:block;
  margin:0;
  object-fit:contain;
}
.site-header .brand-combined{width:auto;height:40px}
.site-header nav{font-size:16px;letter-spacing:.08em}
.site-header{align-items:center;padding-bottom:24px}
.site-header>nav,.site-header>.contact-link,.site-header>.brand{transform:none}
.site-header>.contact-link{font-size:16px;line-height:1;letter-spacing:.08em}
.site-header{
  background:rgba(12,31,36,.30);
  border-bottom:0;
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
}
.site-header nav{line-height:1}
.site-header .brand-mark{display:none}
@media(max-width:800px){
  .site-header{padding-bottom:18px}
  .site-header .brand{width:auto;gap:0}
  .site-header .brand-combined{width:180px;height:auto}
  .site-header>.brand,.site-header>.contact-link{transform:none}
}

/* More visible, faster hero image movement. */
.hero>img{animation-duration:7s}
@keyframes heroScale{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero h1{font-size:80px;margin:15px 0;transform:translateX(-6px)}
@media(max-width:800px){.hero h1{transform:none}}

/* Hero photo carousel */
.hero-slides{position:absolute;inset:0;overflow:hidden}
.hero-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity 1.2s ease,transform 6s ease-out}
.hero-slide.active{opacity:1;transform:scale(1)}
@media(prefers-reduced-motion:reduce){.hero-slide{transition:none;transform:none}.hero-slide:not(:first-child){display:none}}

/* Desktop philosophy typography follows the Hero hierarchy. */
.statement>.section-label{font-size:11px}
.statement-grid{margin-top:12px}
.statement h2{font-size:60px;line-height:1.22}
.statement-copy{padding-top:0}
@media(min-width:801px){
  .statement-grid{grid-template-columns:minmax(0,1.1fr) 1px minmax(0,.9fr);column-gap:2vw}
  .statement-grid::before{content:"";grid-column:2;grid-row:1;width:1px;height:100%;background:rgba(19,35,41,.22);transform:translateX(-2.25vw)}
  .statement-grid>h2{grid-column:1;grid-row:1}
  .statement-copy{grid-column:3;grid-row:1;margin-left:0}
}
@media(max-width:800px){
  .statement-grid{margin-top:55px}
  .statement h2{font-size:40px}
}

/* Unified desktop section heading hierarchy: 11px / 60px / 12px. */
.section{padding-left:8vw;padding-right:8vw}
.section-label{font-size:11px;gap:10px}
.section-label span{font-size:12px}
.services h2,.material-copy h2,.systems h2,.projects h2,.closing h2{font-size:60px;line-height:1.22}
.services-head{margin-top:12px!important;margin-right:0;margin-bottom:75px;margin-left:0}
.material-copy .section-label.light{margin-bottom:0}
.material-copy>.eyebrow{margin:0}
.material-copy h2{margin:12px 0 25px}
.material-copy h2 .no-wrap{white-space:nowrap}
.material{display:flex;flex-direction:column;min-height:0;padding:0}
.material-copy{width:100%;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto auto;column-gap:7vw;align-items:start}
.material-heading{grid-column:1;grid-row:1 / span 2}
.material-heading>p{max-width:500px;margin:0;color:rgba(255,255,255,.74)}
.material-copy dl{grid-column:2;grid-row:1;margin:0;align-self:start}
.material-copy>.text-link{grid-column:2;grid-row:2;margin-top:40px}
.material .metric-up{display:inline-block;margin-left:8px;font-family:var(--sans);font-size:.45em;line-height:1;vertical-align:top;transform:translateY(.72em)}
@media(min-width:801px){
  .material-intro-line{white-space:nowrap}
  .material dl div{border-top:0;padding-top:0}
  .material dt{font-size:60px}
  .material dd{margin-top:8px;border-top:1px solid rgba(255,255,255,.3);padding-top:18px;font-size:25px}
  .material dd small{display:inline-block;font-size:18px;line-height:25px}
  .material-copy>.text-link{font-size:25px}
}
.material-visual{display:block;width:100%;min-height:0;padding:0;background:#f1eee7}
.material-visual img{width:100%;max-width:none;aspect-ratio:3/1;object-fit:cover;mix-blend-mode:normal}
.system-copy .section-label{margin-bottom:12px}
@media(min-width:801px){
  .system-copy>p{margin-top:25px}
  .system-copy li,.system-copy li span{font-size:25px}
}
.projects-title{margin:12px 0 70px}
.closing h2{margin:12px 0 60px}
.closing-logo img{width:105px;height:auto;object-fit:contain}
.closing-logo{position:relative;top:40px}
.closing-logo p{margin:3px 0 0;font-size:16px}
.contact-button{position:relative;width:150px;height:150px;display:grid;place-items:center;text-align:center;background:#ead9b4;border-color:transparent;color:var(--ink);font-size:16px}
.contact-button .contact-button-label{display:block;margin:0;color:var(--ink);font-size:16px;line-height:1.5;transform:translateY(-6px)}
.contact-button .contact-button-arrow{position:absolute;top:calc(50% + 14px);left:50%;display:block;margin:0;color:var(--ink);font-size:16px;line-height:1;transform:translateX(-50%)}
.contact-button:hover .contact-button-label,.contact-button:hover .contact-button-arrow{color:#fff}
.service>span{font-size:25px}
.service{grid-template-columns:max-content 1fr 1fr}
.service p{font-size:18px}
.system-method-list li{cursor:pointer;transition:color .25s ease,padding-left .25s ease}
.system-method-list li:hover,.system-method-list li:focus-visible{color:var(--orange);padding-left:10px;outline:none}
.system-image{--system-image-inset:clamp(16px,2vw,32px);position:relative;aspect-ratio:4/3;padding:0;overflow:hidden;background:#ead9b4}
.system-method-image{position:absolute;top:var(--system-image-inset);left:var(--system-image-inset);width:calc(100% - (var(--system-image-inset) * 2));height:calc(100% - (var(--system-image-inset) * 2));object-fit:cover;opacity:0;transition:opacity .4s ease}
.system-method-image[data-system-image="default"]{object-fit:contain}
.system-method-image.active{opacity:1}
@media(max-width:800px){
  .material-copy{display:flex;flex-direction:column}
  .section{padding-left:24px;padding-right:24px}
  .services h2,.systems h2,.projects h2{font-size:40px}
  .material-copy h2{font-size:42px;margin:18px 0 34px}
  .closing h2{font-size:52px;margin:28px 0 60px}
  .services-head,.projects-title{margin:55px 0 40px}
  .material-copy .section-label.light,.system-copy .section-label{margin-bottom:55px}
  .service{grid-template-columns:38px 1fr}
  .system-image{padding:0}
}
@media(prefers-reduced-motion:reduce){.system-method-image{transition:none}}
/* Strategy service brand-work carousel */
.brand-carousel{position:relative;width:100vw;margin-top:80px;margin-left:calc(50% - 50vw)}
.brand-carousel-stage{position:relative;width:100%;aspect-ratio:24/7;overflow:hidden;background:#ded8ce}
.brand-carousel-slide{position:absolute;inset:0;margin:0;display:grid;place-items:center;opacity:0;transform:translateX(24px);transition:opacity .65s ease,transform .65s ease;pointer-events:none}
.brand-carousel-slide.active{opacity:1;transform:none;pointer-events:auto}
.brand-carousel-slide picture{display:block;width:100%;height:100%}
.brand-carousel-slide img{width:100%;height:100%;object-fit:contain;object-position:center}
.brand-carousel-slide:nth-child(1){background:#f3e7d8}
.brand-carousel-slide:nth-child(2){background:#f7f7f7}
.brand-carousel-slide:nth-child(3){background:#4a5c91}
.brand-carousel-slide:nth-child(4){background:#293b78}
.brand-carousel-slide:nth-child(5){background:#eef1f0}
.brand-carousel-slide:nth-child(6){background:#f4f1eb}
.brand-carousel-slide:nth-child(7){background:#fff}
.brand-carousel-controls{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 24px;pointer-events:none}
.brand-carousel-button{width:42px;height:42px;border:0;border-radius:50%;background:rgba(244,240,232,.78);color:var(--ink);font:inherit;cursor:pointer;pointer-events:auto;transition:background .25s,color .25s}
.brand-carousel-button:hover,.brand-carousel-button:focus-visible{background:var(--ink);color:var(--paper)}
@media(max-width:800px){
  .brand-carousel{margin-top:55px}
  .brand-carousel-stage{aspect-ratio:1}
  .brand-carousel-slide img{object-fit:cover}
  .brand-carousel-controls{padding:0 14px}
}
@media(prefers-reduced-motion:reduce){.brand-carousel-slide{transition:none}}

/* Applications: 19-case image wall */
.projects{height:auto;min-height:0;padding-top:0;padding-right:0;padding-bottom:0;display:flex;align-items:stretch;overflow:hidden}
.projects-layout{width:100%;min-height:100%;display:grid;grid-template-columns:minmax(330px,.72fr) minmax(0,1.75fr);gap:5vw;align-items:stretch}
.projects-copy{width:max-content;max-width:100%;align-self:center;padding-right:1vw}
.projects-copy .section-label{color:rgba(255,255,255,.55)}
.projects-copy h2{margin:20px 0 32px}
.projects-copy>p{width:max-content;margin:0 6px 0 auto;font-size:12px;letter-spacing:.18em;color:rgba(255,255,255,.75)}
.case-panel{height:min(72vh,620px);min-height:540px;overflow-y:auto;overscroll-behavior:contain;background:#fff;color:var(--ink);padding:24px 18px 28px 24px;scrollbar-color:rgba(19,35,41,.32) transparent;scrollbar-width:thin}
.case-panel::-webkit-scrollbar{width:6px}
.case-panel::-webkit-scrollbar-track{background:transparent}
.case-panel::-webkit-scrollbar-thumb{background:rgba(19,35,41,.28)}
.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}
.case-card{margin:0;min-width:0;overflow:hidden}
.case-card img{aspect-ratio:1456/565;object-fit:cover;object-position:center;filter:saturate(.65) contrast(.96);transition:filter .35s ease,transform .45s ease}
.case-card:hover img{filter:saturate(.9) contrast(1);transform:scale(1.008)}
.case-card figcaption{display:block;padding-top:10px;border-top:1px solid var(--line);font-family:var(--serif);font-size:16px;line-height:1.45;color:var(--orange)}
.case-card figcaption>span{display:none}
.case-card figcaption>div{color:var(--orange)}
.case-card figcaption small{display:block;margin-top:2px;font-family:var(--sans);font-size:11px;font-weight:400;color:#687274}
@media(max-width:800px){
  .projects{display:block;height:auto;min-height:0;padding-top:95px;padding-right:24px;padding-bottom:95px;overflow:visible}
  .projects-layout{grid-template-columns:1fr;gap:45px}
  .projects-copy{padding-right:0}
  .projects-copy>p{margin-left:0;margin-right:6px}
  .case-panel{height:auto;min-height:0;max-height:none;padding:14px}
  .case-grid{grid-template-columns:1fr;gap:28px}
}
@media(prefers-reduced-motion:reduce){.case-card img{transition:none}}

/* Floating back-to-top shortcut */
.floating-back-to-top{position:fixed;z-index:20;right:28px;bottom:28px;width:62px;height:62px;border:1px solid rgba(19,35,41,.18);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:rgba(244,240,232,.94);color:var(--ink);box-shadow:0 8px 24px rgba(19,35,41,.10);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px);transition:opacity .25s ease,visibility .25s ease,transform .25s ease,background .25s ease,color .25s ease}
.floating-back-to-top.visible{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.floating-back-to-top:hover,.floating-back-to-top:focus-visible{background:var(--orange);color:#fff;border-color:var(--orange);outline:none}
.floating-back-to-top span{font-size:18px;line-height:1}
.floating-back-to-top small{font-size:8px;line-height:1;letter-spacing:.12em}
@media(max-width:800px){.floating-back-to-top{right:16px;bottom:16px;width:52px;height:52px}}
@media(prefers-reduced-motion:reduce){.floating-back-to-top{transition:none}}

/* Responsive phase 1: navigation and hero */
.header-actions{display:contents}
.menu-toggle{display:none}
@media(min-width:801px) and (max-width:1199px){
  .site-header{padding:20px 3vw}
  .site-header .brand-combined{height:36px}
  .site-header nav{gap:20px;font-size:14px}
  .site-header>.header-actions>.contact-link{font-size:14px}
  .hero-copy{left:6vw;right:6vw;bottom:13vh}
  .hero h1{font-size:clamp(56px,7vw,70px)}
  .hero-intro{font-size:16px}
  .material-copy{grid-template-columns:1fr;grid-template-rows:auto;padding:90px 6vw}
  .material-heading{grid-column:1;grid-row:auto}
  .material-copy h2{font-size:52px}
  .material-copy dl{grid-column:1;grid-row:auto;margin-top:56px}
  .material-copy>.text-link{grid-column:1;grid-row:auto;margin-top:36px}
}
@media(max-width:800px){
  body.mobile-nav-open{overflow:hidden}
  .site-header{grid-template-columns:1fr auto;padding:15px 20px;min-height:64px}
  .site-header .brand-combined{width:auto;height:32px}
  .header-actions{position:absolute;z-index:-1;top:100%;left:0;width:100%;display:flex;flex-direction:column;align-items:stretch;padding:18px 20px 28px;background:rgba(12,31,36,.97);opacity:0;visibility:hidden;transform:translateY(-10px);pointer-events:none;transition:opacity .25s ease,visibility .25s ease,transform .25s ease}
  .site-header.menu-open .header-actions{opacity:1;visibility:visible;transform:none;pointer-events:auto}
  .site-header .header-actions nav{display:flex;flex-direction:column;gap:0;font-size:16px;line-height:1.4}
  .site-header .header-actions nav a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.16)}
  .site-header>.header-actions>.contact-link{display:flex;justify-content:space-between;align-items:center;padding-top:18px;font-size:16px;line-height:1.4}
  .site-header>.header-actions>.contact-link span{font-size:16px}
  .menu-toggle{justify-self:end;width:42px;height:42px;padding:0;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:transparent;color:#fff;cursor:pointer}
  .menu-toggle span{width:24px;height:1px;background:currentColor;transition:transform .25s ease}
  .site-header.menu-open .menu-toggle span:first-child{transform:translateY(4px) rotate(45deg)}
  .site-header.menu-open .menu-toggle span:last-child{transform:translateY(-4px) rotate(-45deg)}
  .hero{height:100svh;min-height:640px;max-height:900px}
  .hero-copy{left:20px;right:20px;bottom:13vh;max-width:none}
  .hero-copy .eyebrow{font-size:9px;line-height:1.5;letter-spacing:.13em}
  .hero h1{max-width:10em;margin:14px 0 20px;font-size:clamp(34px,9.5vw,42px);line-height:1.18;letter-spacing:.01em}
  .hero-intro{max-width:24em;font-size:14px;line-height:1.8;letter-spacing:.035em}
  .hero-shade{background:linear-gradient(90deg,rgba(10,28,34,.72) 0%,rgba(10,28,34,.3) 75%,rgba(10,28,34,.18)),linear-gradient(0deg,rgba(10,28,34,.48),transparent 58%)}
  .scroll-cue{right:20px;bottom:20px;font-size:8px;gap:8px}
  .scroll-cue span{width:36px}
}
@media(prefers-reduced-motion:reduce){.header-actions,.menu-toggle span{transition:none}}

/* Responsive systems: keep the selected image next to the touch controls. */
.system-image-mobile{display:none}
@media(max-width:800px){
  .systems>.system-image{display:none}
  .system-copy .section-label{margin-bottom:12px}
  .system-copy>p{margin:25px 0 20px}
  .system-image-mobile{display:block;width:100%;margin:0 0 16px;aspect-ratio:4/3}
  .system-copy ol{margin-top:0}
}

/* One shared responsive heading scale prevents accidental single-character wraps. */
@media(min-width:801px) and (max-width:1199px){
  :root{--responsive-heading-size:clamp(46px,5vw,60px)}
  .hero h1,.statement h2,.services h2,.material-copy h2,.systems h2,.projects h2,.closing h2{max-width:none;font-size:var(--responsive-heading-size);white-space:nowrap}
}
@media(max-width:800px){
  :root{--responsive-heading-size:clamp(26px,calc(9.52vw - 3.81px),52px)}
  .hero h1,.statement h2,.services h2,.material-copy h2,.systems h2,.projects h2,.closing h2{max-width:none;font-size:var(--responsive-heading-size);white-space:nowrap}
}

/* Keep every responsive eyebrow-to-heading gap on the same 12px rhythm. */
@media(max-width:1199px){
  :root{--responsive-label-title-gap:12px}
  .hero-copy>.eyebrow,.statement>.section-label,.services>.section-label,.material-heading>.section-label,.system-copy>.section-label,.projects-copy>.section-label,.closing>.eyebrow{margin:0}
  .hero h1{margin-top:var(--responsive-label-title-gap)}
  .statement-grid{margin-top:var(--responsive-label-title-gap)}
  .services-head{margin-top:var(--responsive-label-title-gap)!important}
  .material-copy h2{margin-top:var(--responsive-label-title-gap)}
  .system-copy h2{margin-top:var(--responsive-label-title-gap)}
  .projects-copy h2{margin-top:var(--responsive-label-title-gap)}
  .closing h2{margin-top:var(--responsive-label-title-gap)}
}

/* Responsive decorative-rule policy: stack content when a vertical divider compresses it. */
@media(max-width:1199px){
  .statement{min-height:0}
  .statement-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
  .statement-grid>h2{grid-column:1;grid-row:1}
  .statement-grid::before{content:"";grid-column:1;grid-row:2;width:100%;height:1px;margin:32px 0;background:rgba(19,35,41,.22);transform:none}
  .statement-copy{grid-column:1;grid-row:3;max-width:none;padding-top:0;margin-left:0}
  .statement-copy p:first-child{margin-top:0}
  .service{row-gap:6px;padding-top:16px;padding-bottom:16px}
  .material-intro-line{white-space:normal}
  .material-heading>p{width:100%;max-width:none}
  .material-heading>p br{display:none}
  .material{padding-left:0;padding-right:0}
  .material-copy{padding-bottom:30px}
  .material-visual{width:100vw;margin-left:calc(50% - 50vw)}
}

/* Tablet systems: full-width introduction, then image left and controls right. */
@media(min-width:801px) and (max-width:1199px){
  .systems{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:40px;row-gap:0;align-items:start;padding:90px 6vw}
  .system-copy{display:contents}
  .system-copy .section-label{grid-column:1 / -1;grid-row:1}
  .system-copy h2{grid-column:1 / -1;grid-row:2}
  .system-copy>p{grid-column:1 / -1;grid-row:3;max-width:760px;margin:25px 0 45px}
  .systems>.system-image{grid-column:1;grid-row:4;width:100%;align-self:start}
  .system-copy ol{grid-column:2;grid-row:4;width:100%;align-self:start;margin:0}
}

/* Mobile applications become a finite horizontal swipe carousel. */
@media(max-width:800px){
  .projects{padding-left:0;padding-right:0}
  .projects-copy{width:100%;padding-left:24px;padding-right:24px}
  .case-panel{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .case-panel{width:100vw;padding:0}
  .case-grid{display:flex;width:max-content;gap:0}
  .case-card{flex:0 0 100vw;width:100vw;scroll-snap-align:start}
  .case-card figcaption{padding:2px 20px 4px;line-height:1.25}
  .case-card figcaption small{margin-top:0;line-height:1.3}
  .case-card-clone{display:none}
}
@media(max-width:800px){
  .material dl div{border-top:0;padding-top:0}
  .material dt{font-size:clamp(44px,9vw,60px)}
  .material dd{margin-top:8px;border-top:1px solid rgba(255,255,255,.3);padding-top:14px;font-size:clamp(16px,2.7vw,22px);line-height:1.5}
  .material dd small{font-size:clamp(13px,2vw,16px);line-height:1.6}
  .material-copy>.text-link{font-size:clamp(16px,2.7vw,22px)}
}