/* WC Forged — shared stylesheet. Brand rules live in CLAUDE.md. */

/* ---- Base ---- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{--accent:#D9FF3D;--gx:40px;--line:rgba(242,239,233,0.12);--ground:radial-gradient(ellipse at 50% 42%,#f7f4ee 0%,#ddd8ce 62%,#a8a296 100%);background:#0f0e10;color:#f2efe9;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}
img{display:block;max-width:100%}
button{font-family:inherit}
[hidden]{display:none!important}
@keyframes wcspin{to{transform:rotate(360deg)}}
@keyframes run{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.spin{animation:none!important}}

/* ---- Shell: grain, nav, footer ---- */
.grain{position:fixed;inset:0;z-index:200;pointer-events:none;opacity:0.4;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");background-size:160px 160px}
.wordmark{font-family:'Anton',sans-serif;font-size:22px;letter-spacing:0.08em;text-transform:uppercase;color:#f2efe9;line-height:34px;white-space:nowrap;display:inline-block}
.wordmark:hover{color:#f2efe9}
.logo{display:inline-block;line-height:0}
.logo img{height:60px;width:auto;display:block}
.logo-foot img{height:110px;margin-bottom:22px}
.h-display .acc,.h2 .acc,.h2 .outline{white-space:nowrap}
.nav{position:fixed;top:0;left:0;right:0;z-index:60;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:rgba(15,14,16,0.5);border-bottom:1px solid rgba(242,239,233,0);transition:background .4s ease,border-color .4s ease}
.nav.scrolled,.nav.open{background:rgba(15,14,16,0.92);border-color:var(--line)}
.nav-in{max-width:1360px;margin:0 auto;padding:0 var(--gx);display:flex;align-items:center;justify-content:space-between;height:76px;gap:32px}
.nav-links{display:flex;gap:34px;align-items:center}
.nav-links a{font-size:11px;letter-spacing:0.22em;text-transform:uppercase;color:#8d887f}
.nav-links a.on{color:#f2efe9}
.nav-links a:hover{color:var(--accent)}
.nav-links .menu-only{display:none}
.nav-right{display:flex;gap:26px;align-items:center}
.nav-phone{font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:#8d887f}
.cta-nav{display:inline-block;white-space:nowrap;padding:11px 22px;background:var(--accent);color:#0f0e10;font-family:'Anton',sans-serif;font-size:13px;letter-spacing:0.1em;text-transform:uppercase;transform:rotate(-1deg);transition:transform .2s}
.cta-nav:hover{transform:rotate(0deg) scale(1.04);color:#0f0e10}
.nav-toggle{display:none;background:none;border:1px solid rgba(242,239,233,0.25);color:#f2efe9;font-size:11px;letter-spacing:0.22em;text-transform:uppercase;padding:10px 14px;cursor:pointer}
.foot{background:#0b0a0c;border-top:1px solid var(--line);padding:76px var(--gx) 46px}
.foot-in{max-width:1360px;margin:0 auto}
.foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.1fr;gap:44px;margin-bottom:48px}
.foot-col{display:flex;flex-direction:column;gap:13px}
.foot-col h5{font-family:'Permanent Marker',cursive;font-size:15px;color:var(--accent);margin-bottom:6px;font-weight:400;transform:rotate(-1deg)}
.foot-col a,.foot-col span,.foot-blurb{font-size:13.5px;font-weight:300;color:#8d887f}
.foot-blurb{line-height:1.75;max-width:300px;margin-bottom:24px}
.cta-foot{display:inline-block;padding:12px 24px;background:var(--accent);color:#0b0a0c;font-family:'Anton',sans-serif;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;transform:rotate(-1deg)}
.cta-foot:hover{color:#0b0a0c}
.foot-links{display:flex;flex-wrap:wrap;gap:14px 28px;padding:22px 0;border-top:1px solid var(--line)}
.foot-links a{font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;color:#8d887f}
.foot-bar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:26px}
.foot-bar .copy{font-size:11px;letter-spacing:0.14em;color:#6b665e}
.foot-bar .sign{font-family:'Permanent Marker',cursive;font-size:13px;color:var(--accent);transform:rotate(-1deg)}

/* ---- Hover / focus states shared with the homepage ---- */
.cta{transform:rotate(-1deg);transition:transform .2s}
.cta:hover{transform:rotate(0deg);color:#0f0e10}
.cta-hero{transform:rotate(-1deg);box-shadow:6px 6px 0 rgba(242,239,233,0.12);transition:transform .2s,box-shadow .2s}
.cta-hero:hover{transform:rotate(0deg) translate(-2px,-2px);box-shadow:9px 9px 0 rgba(242,239,233,0.18);color:#0f0e10}
.submit{transition:transform .2s}
.submit:hover{transform:translate(-2px,-2px)}
.card{border:1px solid var(--line);transition:border-color .3s}
.card-dash{border:1px dashed rgba(242,239,233,0.3);transition:border-color .3s}
.card:hover,.card-dash:hover{border-color:var(--accent)}
.step{background:#0f0e10;transition:background .3s}
.step:hover{background:#141316}
.swatch{width:38px;height:38px;border-radius:50%;cursor:pointer;padding:0;border:1px solid rgba(242,239,233,0.25);outline:2px solid transparent;outline-offset:3px;transition:outline-color .25s,transform .2s}
.swatch:hover{transform:scale(1.12)}
.swatch.on{outline-color:var(--accent)}
.chip{background:transparent;border:1px solid rgba(242,239,233,0.2);color:#8d887f;cursor:pointer;padding:10px 20px;font-family:'Anton',sans-serif;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;transition:all .25s}
.chip.on{background:var(--accent);border-color:var(--accent);color:#0f0e10}
.fld{background:#0f0e10;border:1px solid rgba(242,239,233,0.16);padding:13px 15px;font-family:inherit;font-size:14px;color:#f2efe9;outline:none;width:100%}
.fld:focus{border-color:var(--accent)}

/* ---- Homepage grid columns (index.html keeps its inline styles) ---- */
.g-hero{grid-template-columns:1.15fr 1fr}
.g-philo{grid-template-columns:1fr 1.1fr}
.g-stats{grid-template-columns:repeat(4,1fr)}
.g-panel{grid-template-columns:1.05fr 1fr}
.g-panel-r{grid-template-columns:1fr 1.05fr}
.g-cards{grid-template-columns:repeat(2,1fr)}
.g-builds{grid-template-columns:repeat(4,1fr)}
.g-process{grid-template-columns:repeat(4,1fr)}
.g-assure{grid-template-columns:1fr 1.25fr}
.g-assure-list{grid-template-columns:1fr 1fr}
.g-enquire{grid-template-columns:1fr 1.1fr}
.g-form2{grid-template-columns:1fr 1fr}
.hero{padding:170px var(--gx) 0}
.hero-img{width:min(560px,44vw)}
.hero-tag{left:-8%}
.panel-img{min-height:600px}
.panel-img-sm{min-height:440px}

/* ---- Inner-page components (same tokens as the homepage) ---- */
.wrap{max-width:1360px;margin:0 auto}
.sec{padding:clamp(90px,10vw,150px) var(--gx)}
.sec-b{padding:0 var(--gx) clamp(90px,10vw,150px)}
.sec-line{border-bottom:1px solid rgba(242,239,233,0.1)}
.sec-raised{background:#141316;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.page-hero{position:relative;overflow:hidden;padding:150px var(--gx) clamp(48px,5vw,72px)}
.page-hero .glow{position:absolute;top:-10%;right:-12%;width:60vw;height:60vw;border-radius:50%;background:radial-gradient(circle,var(--accent) 0%,transparent 62%);opacity:0.12;filter:blur(40px);pointer-events:none}
.eyebrow{font-family:'Permanent Marker',cursive;font-size:16px;color:var(--accent);transform:rotate(-2deg);display:inline-block;margin-bottom:18px}
.h-display{font-family:'Anton',sans-serif;font-size:clamp(56px,8vw,128px);line-height:0.92;text-transform:uppercase;letter-spacing:0.005em}
.h2{font-family:'Anton',sans-serif;font-size:clamp(48px,5.4vw,88px);line-height:0.96;text-transform:uppercase}
.h3{font-family:'Anton',sans-serif;font-size:clamp(28px,3vw,42px);line-height:1;text-transform:uppercase}
.h4{font-family:'Anton',sans-serif;font-size:21px;text-transform:uppercase}
.outline{color:transparent;-webkit-text-stroke:2px var(--accent)}
.outline-t{color:transparent;-webkit-text-stroke:1.5px #f2efe9}
.acc{color:var(--accent)}
.lead{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(22px,2.2vw,30px);color:#cfc9bf;line-height:1.35;max-width:560px;margin-top:22px}
.lead-s{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:23px;line-height:1.5;color:#cfc9bf;max-width:540px}
.body{font-size:15px;font-weight:300;line-height:1.8;color:#8d887f;max-width:540px}
.body+.body{margin-top:16px}
.small{font-size:13px;font-weight:300;line-height:1.7;color:#8d887f}
.label{font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:#6b665e}
.tag{font-size:10px;letter-spacing:0.22em;text-transform:uppercase;color:var(--accent)}
.btn{display:inline-block;padding:15px 30px;background:var(--accent);color:#0f0e10;font-family:'Anton',sans-serif;font-size:14px;letter-spacing:0.08em;text-transform:uppercase;box-shadow:5px 5px 0 rgba(242,239,233,0.12)}
.btn-lg{padding:17px 34px;font-size:15px}
.link-u{font-size:11px;letter-spacing:0.24em;text-transform:uppercase;border-bottom:1px solid var(--accent);padding-bottom:6px;display:inline-block}
.link-s{font-size:11px;letter-spacing:0.2em;text-transform:uppercase;border-bottom:1px solid var(--accent);padding-bottom:4px;align-self:flex-start;display:inline-block}
.row{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:40px}
.head-row p{font-size:14px;font-weight:300;line-height:1.75;color:#8d887f;max-width:320px}
.split{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(40px,6vw,110px);align-items:start}
.split-w{grid-template-columns:1fr 1.25fr}
.panel{display:grid;grid-template-columns:1.05fr 1fr;border:1px solid var(--line);position:relative}
.panel-r{grid-template-columns:1fr 1.05fr}
.panel-tag{position:absolute;top:-16px;left:36px;font-family:'Permanent Marker',cursive;font-size:17px;color:var(--accent);transform:rotate(-2deg);background:#0f0e10;padding:0 12px;z-index:2}
.ground{background:var(--ground);display:flex;align-items:center;justify-content:center;padding:40px;min-height:600px}
.ground img{mix-blend-mode:multiply;width:82%}
.ground-sm{min-height:440px}
.panel-body{padding:clamp(44px,5vw,72px);display:flex;flex-direction:column;justify-content:center;background:#141316}
.panel-body .h2{margin-bottom:18px}
.panel-body .body{max-width:430px;margin-bottom:30px}
.finish-line{display:flex;align-items:baseline;gap:14px;margin-bottom:16px}
.finish-name{font-family:'Permanent Marker',cursive;font-size:20px;color:var(--accent);line-height:1}
.finish-desc{font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:#8d887f}
.swatches{display:flex;flex-wrap:wrap;gap:13px;margin-bottom:14px}
.spec-row{display:flex;gap:40px;border-top:1px solid var(--line);padding-top:24px;margin-bottom:36px;flex-wrap:wrap}
.spec-row .v{font-family:'Anton',sans-serif;font-size:19px;letter-spacing:0.03em;text-transform:uppercase;margin-top:8px}
.spec{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.spec>div{background:#0f0e10;padding:26px 22px}
.spec .v{font-family:'Anton',sans-serif;font-size:21px;line-height:1.1;letter-spacing:0.02em;text-transform:uppercase;margin-top:10px}
.spec .v.big{font-size:42px;line-height:1;color:var(--accent);letter-spacing:0}
.spec .n{font-size:12px;font-weight:300;line-height:1.6;color:#8d887f;margin-top:8px}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.cards-3{grid-template-columns:repeat(3,1fr)}
.cards-4{grid-template-columns:repeat(4,1fr);gap:22px}
.mcard{display:flex;flex-direction:column;background:#141316}
.mcard .ph{aspect-ratio:16/10;background:var(--ground);display:flex;align-items:center;justify-content:center;overflow:hidden}
.mcard .ph img{mix-blend-mode:multiply;height:86%;object-fit:contain}
.mcard .ph.car img{width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.mcard .ph.none{background:transparent;border-bottom:0}
.mcard .ph.none span{font-family:'Permanent Marker',cursive;font-size:22px;color:var(--accent);transform:rotate(-4deg)}
.mcard .bd{padding:26px 30px 30px;display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);flex:1}
.mcard .ttl{display:flex;justify-content:space-between;align-items:baseline}
.mcard .ttl > :first-child{font-family:'Anton',sans-serif;font-size:30px;text-transform:uppercase}
.mcard .ttl > span:last-child{font-family:'Permanent Marker',cursive;font-size:15px;color:#6b665e}
.mcard p{font-size:13.5px;font-weight:300;line-height:1.7;color:#8d887f;flex:1}
.mcard .links{display:flex;gap:22px;flex-wrap:wrap;margin-top:8px}
.pcard{display:flex;flex-direction:column;gap:13px;background:#141316;padding:14px 14px 22px}
.pcard.card-dash{background:transparent}
.pcard .ph{aspect-ratio:4/3;overflow:hidden;display:flex;align-items:center;justify-content:center}
.pcard .ph img{width:100%;height:100%;object-fit:cover}
.pcard .ph span{font-family:'Permanent Marker',cursive;font-size:22px;color:var(--accent);transform:rotate(-4deg)}
.pcard h3{font-family:'Anton',sans-serif;font-size:20px;line-height:1.1;text-transform:uppercase;padding:0 8px}
.pcard p{font-size:13px;font-weight:300;line-height:1.65;color:#8d887f;flex:1;padding:0 8px}
.pcard .link-s{margin:0 8px;font-size:10.5px;letter-spacing:0.18em}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.gal figure{border:1px solid var(--line);background:#141316;transition:border-color .3s}
.gal figure:hover{border-color:var(--accent)}
.gal .ph{aspect-ratio:4/3;overflow:hidden;display:flex;align-items:center;justify-content:center}
.gal .ph.studio{background:var(--ground)}
.gal .ph.studio img{mix-blend-mode:multiply;height:86%;object-fit:contain}
.gal .ph.car img{width:100%;height:100%;object-fit:cover}
.gal figcaption{padding:16px 18px;display:flex;justify-content:space-between;gap:12px;align-items:baseline;border-top:1px solid var(--line)}
.gal .cap-t{font-family:'Anton',sans-serif;font-size:15px;letter-spacing:0.03em;text-transform:uppercase}
.gal .cap-s{font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;color:#6b665e;text-align:right}
.fin{display:flex;flex-direction:column;background:#141316;border:1px solid var(--line);transition:border-color .3s}
.fin:hover{border-color:var(--accent)}
.fin .ph{aspect-ratio:1/1;background:var(--ground);display:flex;align-items:center;justify-content:center;overflow:hidden}
.fin .ph img{mix-blend-mode:multiply;width:84%}
.fin .bd{padding:22px 26px 26px;display:flex;gap:16px;align-items:flex-start;border-top:1px solid var(--line)}
.fin .sw{width:38px;height:38px;border-radius:50%;border:1px solid rgba(242,239,233,0.25);flex:none;margin-top:2px}
.fin .nm{font-family:'Permanent Marker',cursive;font-size:22px;color:var(--accent);line-height:1;transform:rotate(-2deg);display:inline-block}
.fin .ds{font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:#8d887f;margin-top:8px}
.fin p{font-size:13px;font-weight:300;line-height:1.65;color:#8d887f;margin-top:10px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.steps .step{padding:34px 28px 40px}
.steps .num{font-family:'Anton',sans-serif;font-size:38px;color:transparent;-webkit-text-stroke:1.5px var(--accent)}
.steps h4{font-family:'Anton',sans-serif;font-size:21px;text-transform:uppercase;margin:18px 0 10px}
.steps p{font-size:13px;font-weight:300;line-height:1.7;color:#8d887f}
.assure{display:grid;grid-template-columns:1fr 1fr;column-gap:52px}
.assure>div{padding:20px 0;border-bottom:1px solid var(--line)}
.assure .t{font-family:'Anton',sans-serif;font-size:17px;letter-spacing:0.03em;text-transform:uppercase;margin-bottom:6px}
.assure p{font-size:12.5px;font-weight:300;color:#8d887f}
.cta-band{border:1px solid var(--line);background:#141316;padding:clamp(44px,6vw,80px);display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;position:relative;overflow:hidden}
.cta-band .glow{position:absolute;top:-40%;right:-10%;width:40vw;height:40vw;border-radius:50%;background:radial-gradient(circle,var(--accent) 0%,transparent 62%);opacity:0.1;filter:blur(50px);pointer-events:none}
.cta-band>div{position:relative}
.cta-band .actions{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:22px 0;display:flex;justify-content:space-between;gap:20px;align-items:baseline;font-family:'Anton',sans-serif;font-size:19px;letter-spacing:0.03em;text-transform:uppercase}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-family:'Permanent Marker',cursive;font-size:24px;color:var(--accent);flex:none}
.faq details[open] summary::after{content:'–'}
.faq .a{padding:0 0 26px;max-width:640px}
.faq .a p{font-size:14.5px;font-weight:300;line-height:1.8;color:#8d887f}
.faq .a p+p{margin-top:12px}
.form{border:1px solid rgba(242,239,233,0.15);background:#141316;padding:clamp(32px,3.4vw,46px);position:relative}
.form .stamp{position:absolute;top:-14px;right:30px;font-family:'Permanent Marker',cursive;font-size:15px;color:#0f0e10;background:var(--accent);padding:3px 14px;transform:rotate(2deg)}
.form .ft{font-family:'Anton',sans-serif;font-size:28px;line-height:1.05;text-transform:uppercase;margin-bottom:8px}
.form .fs{font-size:13px;font-weight:300;color:#8d887f;margin-bottom:28px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f{display:flex;flex-direction:column;margin-bottom:16px}
.f label{font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:#6b665e;margin-bottom:8px}
.form .submit{width:100%;padding:17px;background:var(--accent);color:#0f0e10;border:none;cursor:pointer;font-family:'Anton',sans-serif;font-size:16px;letter-spacing:0.08em;text-transform:uppercase;box-shadow:5px 5px 0 rgba(242,239,233,0.12)}
.form .note{text-align:center;font-size:12px;font-weight:300;color:#6b665e;margin-top:16px}
.done{border:1px solid rgba(242,239,233,0.15);background:#141316;padding:80px 40px;text-align:center}
.done .mk{font-family:'Permanent Marker',cursive;font-size:30px;color:var(--accent);transform:rotate(-3deg);margin-bottom:22px}
.done h3{font-family:'Anton',sans-serif;font-size:30px;text-transform:uppercase;margin-bottom:14px}
.done p{font-size:14px;font-weight:300;line-height:1.75;color:#8d887f;max-width:340px;margin:0 auto}
.contact-list{border-top:1px solid var(--line);max-width:440px}
.contact-list>div{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line)}
.contact-list .k{font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:#6b665e}
.contact-list .v{font-size:13.5px}
.contact-list a.v{color:var(--accent)}
.price-note{border-left:2px solid var(--accent);padding:4px 0 4px 22px;margin:34px 0 38px;max-width:440px}
.price-note .t{font-family:'Anton',sans-serif;font-size:21px;letter-spacing:0.03em;text-transform:uppercase;margin-bottom:6px}
.notice{border:1px dashed rgba(242,239,233,0.3);padding:22px 26px;max-width:640px;display:flex;gap:18px;align-items:baseline}
.notice .mk{font-family:'Permanent Marker',cursive;font-size:18px;color:var(--accent);white-space:nowrap;transform:rotate(-2deg)}
.notice p{font-size:13.5px;font-weight:300;line-height:1.7;color:#8d887f}
.pill-list{display:flex;flex-wrap:wrap;gap:12px}
.pill-list a{border:1px solid rgba(242,239,233,0.2);color:#8d887f;padding:10px 20px;font-family:'Anton',sans-serif;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;transition:all .25s}
.pill-list a:hover{border-color:var(--accent);color:var(--accent)}
.err-hero{min-height:70vh;display:flex;align-items:center}

/* ---- Responsive. Desktop above 1024px is untouched. ---- */
@media (max-width:1180px){
  .nav-phone{display:none}
}
@media (max-width:1023px){
  .nav-toggle{display:inline-block}
  .nav-links{display:none;position:absolute;top:76px;left:0;right:0;height:calc(100vh - 76px);height:calc(100dvh - 76px);flex-direction:column;align-items:stretch;gap:0;padding:12px var(--gx) 40px;background:#0f0e10;overflow-y:auto}
  .nav.open .nav-links{display:flex}
  .nav-links a{font-family:'Anton',sans-serif;font-size:34px;letter-spacing:0.02em;color:#f2efe9;padding:18px 0;border-bottom:1px solid var(--line)}
  .nav-links a.on{color:var(--accent)}
  .nav-links .menu-only{display:block}
  .nav-links a.menu-phone{font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:13px;letter-spacing:0.16em;text-transform:uppercase;color:#8d887f;border:0;padding:26px 0 0}
  body.menu-open{overflow:hidden}
  .g-builds,.g-process,.cards-4,.cards-3,.gal,.steps{grid-template-columns:repeat(2,1fr)}
  .spec{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  body{--gx:24px}
  .g-hero,.g-philo,.g-panel,.g-panel-r,.g-assure,.g-enquire,.split,.split-w,.panel,.panel-r,.cta-band{grid-template-columns:1fr}
  .g-panel-r>div:first-child,.panel-r>div:first-child{order:2}
  .g-stats,.g-foot,.foot-grid{grid-template-columns:1fr 1fr}
  .hero{padding-bottom:48px}
  .hero-img{width:min(560px,100%)}
  .hero-tag{left:0}
  .panel-img,.panel-img-sm,.ground,.ground-sm{min-height:360px}
  .page-hero{padding-top:124px}
}
@media (max-width:640px){
  .nav-in{gap:12px}
  .nav-right{gap:10px}
  .wordmark{font-size:19px;letter-spacing:0.06em}
  .logo img{height:50px}
  .cta-nav{padding:10px 14px;font-size:12px}
  .nav-toggle{padding:9px 12px;font-size:10px;letter-spacing:0.18em}
  .g-cards,.g-builds,.g-process,.g-assure-list,.g-form2,.g-foot,.foot-grid,.cards,.cards-3,.cards-4,.gal,.steps,.assure,.f-row{grid-template-columns:1fr}
  .spec{grid-template-columns:1fr 1fr}
  .spec .v.big{font-size:34px}
  .mcard .bd{padding:22px 22px 26px}
  .notice{flex-direction:column;gap:8px}
}