@charset "UTF-8";

/* Sector art directions for the editable services, story, contact and service pages. */
.inner-page .inner-heading { grid-area:heading; min-width:0; position:relative; z-index:2; }
.inner-page .inner-cover { grid-area:cover; min-width:0; width:100%; max-width:100%; position:relative; overflow:hidden; }
.inner-page .inner-stamp { grid-area:stamp; min-width:0; position:relative; z-index:1; overflow-wrap:anywhere; }
.inner-page .inner-hero { isolation:isolate; }
.inner-page .inner-hero h1 { overflow-wrap:anywhere; text-wrap:balance; }
.inner-page .inner-cover > img ,
.inner-page .inner-cover > picture.responsive-picture > img { border-radius:inherit; }
.inner-page :is(.inner-service-card,.inner-service-copy,.inner-story-content,.inner-story-aside,.inner-detail-reading,.inner-detail-aside,.inner-value,.inner-steps>li) { min-width:0; }
.inner-page :is(.inner-service-copy h3,.inner-section-heading h2,.inner-value h3,.inner-steps h3) { overflow-wrap:anywhere; }
.inner-page .inner-service-card:not(:has(.inner-service-image)) .inner-service-copy { grid-column:1/-1; }
.inner-page .inner-cover::after { pointer-events:none; }
.inner-page .inner-service-link { min-height:44px; }

/* 01 / ATELIER — a project folio with a title spread and numbered editorial rows. */
body.design-atelier .inner-hero { grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); grid-template-areas:"heading heading" "cover stamp"; gap:30px 45px; padding-block:48px; border-bottom:1px solid var(--primary); }
body.design-atelier .inner-heading { max-width:1100px; }
body.design-atelier .inner-hero h1 { font-size:clamp(48px,6.3vw,91px); font-weight:400; line-height:1.04; }
body.design-atelier .inner-intro { max-width:650px; }
body.design-atelier .inner-cover { min-height:330px; border-radius:0; }
body.design-atelier .inner-stamp { align-self:end; border-top:1px solid var(--primary); padding-top:20px; font-family:Georgia,serif; font-size:clamp(34px,4vw,58px); font-weight:400; }
body.design-atelier .inner-service-list { grid-template-columns:minmax(0,1fr); gap:0; }
body.design-atelier .inner-service-card { display:grid; grid-template-columns:minmax(0,.55fr) minmax(0,1.5fr); gap:35px; padding:30px 0; border:0; border-top:1px solid var(--primary); border-radius:0; background:transparent; }
body.design-atelier .inner-service-copy { padding:10px 0; }
body.design-atelier .inner-service-image { border-radius:0; min-height:220px; }
body.design-atelier .inner-about-story, body.design-atelier .inner-detail-body { grid-template-columns:minmax(0,1.6fr) minmax(0,.6fr); gap:8%; }
body.design-atelier .inner-story-aside, body.design-atelier .inner-detail-aside { border-left:1px solid var(--line); padding-left:30px; }
body.design-atelier .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:1px solid var(--primary); }
body.design-atelier .inner-value { background:transparent; border:0; border-right:1px solid var(--line); border-radius:0; }
body.design-atelier .inner-contact-layout { grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr); gap:8%; }
body.design-atelier .inner-contact-layout .contact-form { border:1px solid var(--primary); border-radius:0; background:transparent; box-shadow:none; }

/* 02 / TERRA — structural bands, solid columns and a drawing-office enquiry form. */
body.design-terra .inner-hero { width:100%; max-width:none; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); grid-template-areas:"heading cover" "stamp cover"; gap:0; padding:0 max(40px,calc((100vw - 1280px)/2)); background:var(--primary); color:var(--on-primary); }
body.design-terra .inner-heading { padding:55px 45px 30px 0; }
body.design-terra .inner-hero :is(h1,.inner-intro,.inner-kicker,.breadcrumb) { color:inherit; }
body.design-terra .inner-hero h1 { font-family:Arial,Helvetica,sans-serif; font-weight:750; font-size:clamp(45px,5vw,73px); line-height:1.03; }
body.design-terra .inner-cover { min-height:470px; border-radius:0; border-left:8px solid var(--accent); }
body.design-terra .inner-stamp { padding:20px 35px 25px 0; border-top:1px solid #ffffff40; font-family:monospace; font-size:25px; color:var(--on-primary); }
body.design-terra .inner-links a { border-color:currentColor; }
body.design-terra .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
body.design-terra .inner-service-card { border-radius:0; border:1px solid var(--line); border-bottom:5px solid var(--accent); }
body.design-terra .inner-service-copy h3 { font-weight:700; }
body.design-terra .inner-number { font-family:monospace; }
body.design-terra .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; border:1px solid var(--primary); background:var(--primary); }
body.design-terra .inner-value { border:0; border-radius:0; background:var(--paper); padding:35px; }
body.design-terra .inner-steps { gap:0; border-top:4px solid var(--accent); }
body.design-terra .inner-steps > li { border-right:1px solid var(--line); border-radius:0; }
body.design-terra .inner-contact-layout { grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:0; border:1px solid var(--line); margin-bottom:80px; padding-bottom:0; }
body.design-terra .inner-contact-layout .contact-details { padding:38px; background:var(--soft); }
body.design-terra .inner-contact-layout .contact-form { padding:38px; border:0; border-left:1px solid var(--line); border-top:5px solid var(--accent); border-radius:0; }

/* 03 / ESTATE — a property brochure with an inset heading and open listing cards. */
body.design-estate .inner-hero { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); grid-template-areas:"cover heading" "stamp stamp"; gap:25px 0; padding-block:30px 35px; }
body.design-estate .inner-cover { grid-column:1/-1; width:76%; min-height:510px; border-radius:8px; }
body.design-estate .inner-heading { align-self:center; margin-left:-50px; padding:38px; background:var(--paper); border:1px solid var(--line); border-radius:7px; box-shadow:0 20px 50px #234a4110; }
body.design-estate .inner-hero h1 { font-size:clamp(42px,4.5vw,66px); }
body.design-estate .inner-stamp { font-size:20px; text-align:right; font-family:Georgia,serif; letter-spacing:.07em; }
body.design-estate .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; }
body.design-estate .inner-service-card { border:1px solid var(--line); border-radius:8px; overflow:hidden; }
body.design-estate .inner-service-image { aspect-ratio:1.8; border-radius:0; }
body.design-estate .inner-about-story { grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr); gap:7%; }
body.design-estate .inner-side-note { border:1px solid var(--line); background:var(--soft); border-radius:8px; }
body.design-estate .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
body.design-estate .inner-value { border-radius:8px; border-top:3px solid var(--accent); }
body.design-estate .inner-contact-layout { grid-template-columns:minmax(0,1.35fr) minmax(0,.75fr); gap:45px; }
body.design-estate .inner-contact-layout .contact-form { grid-column:1; grid-row:1; border-radius:8px; box-shadow:0 15px 50px #234a410a; }
body.design-estate .inner-contact-layout .contact-details { grid-column:2; grid-row:1; padding:15px 0; }

/* 04 / LEX — restrained legal typography, ruled practice areas and a formal letter panel. */
body.design-lex .inner-hero { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); grid-template-areas:"heading cover" "stamp cover"; gap:20px 8%; padding-block:60px 45px; border-bottom:double 3px var(--accent); }
body.design-lex .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(45px,5.4vw,78px); font-weight:400; line-height:1.1; }
body.design-lex .inner-kicker { border-left:30px solid var(--accent); padding-left:15px; }
body.design-lex .inner-cover { min-height:460px; border-radius:140px 140px 0 0; outline:1px solid var(--accent); outline-offset:8px; margin:8px; width:calc(100% - 16px); }
body.design-lex .inner-stamp { border-top:1px solid var(--line); padding-top:20px; font-family:Georgia,serif; font-size:30px; letter-spacing:.08em; }
body.design-lex .inner-service-list { grid-template-columns:minmax(0,1fr); gap:0; }
body.design-lex .inner-service-card { display:grid; grid-template-columns:minmax(0,.45fr) minmax(0,1.6fr); gap:30px; border:0; border-bottom:1px solid var(--accent); border-radius:0; padding-block:28px; background:transparent; }
body.design-lex .inner-service-copy { padding:0; }
body.design-lex .inner-service-copy h3 { font-family:Georgia,serif; font-weight:400; }
body.design-lex .inner-about-story { grid-template-columns:minmax(0,1.6fr) minmax(0,.6fr); gap:8%; }
body.design-lex .inner-side-note { border:double 3px var(--accent); border-radius:0; background:transparent; }
body.design-lex .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; }
body.design-lex .inner-value { background:transparent; border-radius:0; border:0; border-top:2px solid var(--accent); }
body.design-lex .inner-contact-layout { grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:8%; }
body.design-lex .inner-contact-layout .contact-form { border-radius:0; border:1px solid var(--line); border-top:4px double var(--accent); background:var(--surface); }

/* 05 / LEDGER — a precise financial index and a two-column correspondence workspace. */
body.design-ledger .inner-hero { grid-template-columns:minmax(0,1.5fr) minmax(0,.75fr); grid-template-areas:"heading cover" "stamp stamp"; gap:25px 7%; padding-block:45px 30px; border-bottom:2px solid var(--primary); }
body.design-ledger .inner-hero h1 { font-size:clamp(44px,5vw,72px); font-weight:650; letter-spacing:-.055em; }
body.design-ledger .inner-cover { min-height:345px; border-radius:7px; border-bottom:10px solid var(--accent); }
body.design-ledger .inner-stamp { display:block; padding-top:18px; border-top:1px solid var(--line); font-family:monospace; font-size:18px; letter-spacing:.15em; }
body.design-ledger .inner-service-list { grid-template-columns:minmax(0,1fr); gap:16px; }
body.design-ledger .inner-service-card { display:grid; grid-template-columns:minmax(0,.5fr) minmax(0,1.7fr); gap:25px; border:1px solid var(--line); border-left:5px solid var(--accent); border-radius:5px; padding:24px; }
body.design-ledger .inner-service-copy { padding:0; }
body.design-ledger .inner-number { font-family:monospace; font-size:19px; }
body.design-ledger .inner-story-aside { border-left:1px solid var(--line); padding-left:25px; }
body.design-ledger .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; border:1px solid var(--line); }
body.design-ledger .inner-value { border:1px solid var(--line); border-radius:0; padding:32px; }
body.design-ledger .inner-steps > li { border:1px solid var(--line); border-radius:5px; }
body.design-ledger .inner-contact-layout { grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:30px; }
body.design-ledger .inner-contact-layout .contact-details { background:var(--soft); border:1px solid var(--line); border-radius:7px; padding:32px; }
body.design-ledger .inner-contact-layout .contact-form { border:1px solid var(--line); border-top:5px solid var(--accent); border-radius:7px; }

/* 06 / PERSPECTIVE — a centered manifesto, panoramic divider and open consulting panels. */
body.design-perspective .inner-hero { grid-template-columns:minmax(0,1fr); grid-template-areas:"heading" "cover" "stamp"; gap:28px; padding-block:45px 25px; text-align:center; }
body.design-perspective .inner-heading { max-width:1000px; justify-self:center; }
body.design-perspective .inner-hero h1 { font-size:clamp(48px,6.2vw,90px); line-height:1.04; }
body.design-perspective .inner-intro { margin-inline:auto; max-width:680px; }
body.design-perspective .inner-links { justify-content:center; }
body.design-perspective .inner-cover { height:285px; min-height:0; border-radius:130px 10px 10px 10px; }
body.design-perspective .inner-stamp { font-size:20px; letter-spacing:.15em; border-bottom:1px solid var(--line); padding-bottom:20px; }
body.design-perspective .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
body.design-perspective .inner-service-card { border-radius:20px; border:1px solid var(--line); background:var(--surface); }
body.design-perspective .inner-about-story { grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr); gap:7%; }
body.design-perspective .inner-side-note { border-radius:20px; border:0; background:var(--soft); }
body.design-perspective .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
body.design-perspective .inner-value { border-radius:20px; border:1px solid var(--line); }
body.design-perspective .inner-contact-layout { grid-template-columns:minmax(0,1fr); max-width:1000px; gap:35px; }
body.design-perspective .inner-contact-layout .contact-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px 35px; }
body.design-perspective .inner-contact-layout .contact-details > h2 { grid-column:1/-1; max-width:none; }
body.design-perspective .inner-contact-layout .contact-form { border-radius:22px; padding:45px; }

/* 07 / DENT — a clinical portrait circle and soft, easy-to-scan treatment cards. */
body.design-dent .inner-hero { grid-template-columns:minmax(0,1.3fr) minmax(0,.75fr); grid-template-areas:"heading cover" "stamp cover"; gap:25px 7%; padding-block:45px; }
body.design-dent .inner-hero h1 { font-size:clamp(44px,5vw,71px); font-weight:500; line-height:1.1; }
body.design-dent .inner-kicker { display:inline-block; border:1px solid var(--line); border-radius:30px; padding:8px 13px; }
body.design-dent .inner-cover { min-height:0; aspect-ratio:1; border-radius:50%; margin:12px; width:calc(100% - 24px); outline:1px solid var(--line); outline-offset:12px; align-self:center; }
body.design-dent .inner-cover figcaption { padding-bottom:30px; text-align:center; justify-content:center; }
body.design-dent .inner-stamp { font-size:19px; color:var(--primary); letter-spacing:.12em; }
body.design-dent .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
body.design-dent .inner-service-card { border:1px solid var(--line); border-radius:22px; overflow:hidden; }
body.design-dent .inner-service-image { border-radius:0; aspect-ratio:1.4; }
body.design-dent .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
body.design-dent .inner-value { border-radius:18px; background:var(--soft); border:0; }
body.design-dent .inner-side-note { border-radius:18px; background:var(--soft); border:1px solid var(--line); }
body.design-dent .inner-contact-layout { grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr); gap:5%; }
body.design-dent .inner-contact-layout .contact-form { border-radius:25px; border:1px solid var(--line); padding:40px; box-shadow:0 15px 55px #164c6009; }
body.design-dent .inner-contact-layout .contact-details { padding:20px 0; }

/* 08 / CARE — a gentle reverse composition and a calm, readable practice story. */
body.design-care .inner-hero { grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr); grid-template-areas:"cover heading" "cover stamp"; gap:25px 7%; padding-block:40px; }
body.design-care .inner-heading { padding-top:20px; align-self:end; }
body.design-care .inner-hero h1 { font-size:clamp(43px,4.8vw,69px); font-weight:450; line-height:1.12; }
body.design-care .inner-cover { min-height:455px; border-radius:12px 110px 12px 12px; }
body.design-care .inner-stamp { font-family:Georgia,serif; font-style:italic; font-size:32px; padding-bottom:15px; }
body.design-care .inner-service-list { grid-template-columns:minmax(0,1fr); gap:0; }
body.design-care .inner-service-card { display:grid; grid-template-columns:minmax(0,.6fr) minmax(0,1.6fr); gap:30px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; padding-block:28px; }
body.design-care .inner-service-image { border-radius:8px 65px 8px 8px; }
body.design-care .inner-service-copy { padding:5px 0; }
body.design-care .inner-about-story { grid-template-columns:minmax(0,1.6fr) minmax(0,.7fr); gap:8%; }
body.design-care .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
body.design-care .inner-value { border-radius:12px; background:var(--soft); border:0; }
body.design-care .inner-contact-layout { grid-template-columns:minmax(0,1.3fr) minmax(0,.75fr); gap:6%; }
body.design-care .inner-contact-layout .contact-form { grid-column:1; grid-row:1; border-radius:12px; border:1px solid var(--line); }
body.design-care .inner-contact-layout .contact-details { grid-column:2; grid-row:1; padding-top:20px; }

/* 09 / BALANCE — quiet arches, generous reading space and a low-pressure enquiry. */
body.design-balance .inner-hero { grid-template-columns:minmax(0,1.2fr) minmax(0,.7fr); grid-template-areas:"heading cover" "stamp cover"; gap:25px 10%; padding-block:55px; }
body.design-balance .inner-heading { align-self:end; }
body.design-balance .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(48px,5.7vw,82px); font-weight:400; }
body.design-balance .inner-cover { min-height:490px; border-radius:190px 190px 8px 8px; border:10px solid var(--paper); outline:1px solid var(--accent); }
body.design-balance .inner-stamp { font-family:Georgia,serif; font-style:italic; font-size:32px; border-top:1px solid var(--line); padding-top:20px; }
body.design-balance .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px; }
body.design-balance .inner-service-card { background:transparent; border:0; border-radius:0; text-align:center; }
body.design-balance .inner-service-image { border-radius:150px 150px 8px 8px; aspect-ratio:1.2; }
body.design-balance .inner-service-copy { padding-inline:20px; }
body.design-balance .inner-about-story { grid-template-columns:minmax(0,1fr); max-width:920px; gap:45px; }
body.design-balance .inner-story-aside { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px; }
body.design-balance .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
body.design-balance .inner-value { border-radius:50px 50px 10px 10px; background:var(--soft); text-align:center; padding-top:40px; }
body.design-balance .inner-contact-layout { grid-template-columns:minmax(0,.8fr) minmax(0,1.15fr); gap:8%; }
body.design-balance .inner-contact-layout .contact-form { border-radius:45px 45px 12px 12px; background:var(--soft); border:0; padding:42px; }

/* 10 / BLOOM — rose editorial geometry and beauty cards with sculpted corners. */
body.design-bloom .inner-hero { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); grid-template-areas:"heading cover" "stamp cover"; gap:25px 3%; padding-block:50px 35px; }
body.design-bloom .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(52px,6vw,87px); font-weight:400; line-height:1.04; }
body.design-bloom .inner-cover { min-height:490px; border-radius:160px 160px 0 90px; border:7px solid var(--paper); outline:1px solid var(--accent); }
body.design-bloom .inner-stamp { font-family:Georgia,serif; font-style:italic; font-size:40px; border-bottom:1px solid var(--accent); padding-bottom:20px; }
body.design-bloom .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
body.design-bloom .inner-service-card { border:0; border-bottom:1px solid var(--accent); border-radius:0; background:transparent; }
body.design-bloom .inner-service-image { border-radius:130px 130px 0 0; aspect-ratio:1; }
body.design-bloom .inner-service-copy { padding-inline:8px; }
body.design-bloom .inner-service-copy h3 { font-family:Georgia,serif; font-weight:400; }
body.design-bloom .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
body.design-bloom .inner-value { background:var(--soft); border:1px solid var(--line); border-radius:0 55px 0 0; padding:30px; }
body.design-bloom .inner-side-note { border:1px solid var(--accent); border-radius:0; background:transparent; }
body.design-bloom .inner-contact-layout { grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:5%; }
body.design-bloom .inner-contact-layout .contact-form { border-radius:0 70px 0 0; border:1px solid var(--accent); background:var(--surface); padding:42px; }

/* 11 / FORM — a barbershop poster, precise service ledger and square appointment-free form. */
body.design-form .inner-hero { grid-template-columns:minmax(0,1.5fr) minmax(0,.6fr); grid-template-areas:"heading stamp" "cover cover"; gap:30px; padding-block:45px 35px; border-bottom:1px solid var(--primary); }
body.design-form .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(49px,5.8vw,84px); font-weight:400; line-height:1.04; }
body.design-form .inner-cover { height:330px; min-height:0; border-block:1px solid var(--accent); border-radius:0; }
body.design-form .inner-cover > img ,
body.design-form .inner-cover > picture.responsive-picture > img { object-position:center 55%; }
body.design-form .inner-stamp { align-self:end; border-top:1px solid var(--accent); padding-block:20px; font-family:Georgia,serif; font-size:34px; letter-spacing:.06em; }
body.design-form .inner-service-list { grid-template-columns:minmax(0,1fr); gap:0; }
body.design-form .inner-service-card { display:grid; grid-template-columns:minmax(0,.5fr) minmax(0,1.6fr); gap:35px; padding-block:28px; background:transparent; border:0; border-top:1px solid var(--primary); border-radius:0; }
body.design-form .inner-service-copy { padding:0; }
body.design-form .inner-service-copy h3 { font-family:Georgia,serif; }
body.design-form .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-block:double 3px var(--accent); }
body.design-form .inner-value { background:transparent; border-radius:0; border:0; border-right:1px solid var(--line); }
body.design-form .inner-contact-layout { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:6%; }
body.design-form .inner-contact-layout .contact-form { grid-column:1; grid-row:1; border-radius:0; border:1px solid var(--primary); border-top:5px double var(--accent); }
body.design-form .inner-contact-layout .contact-details { grid-column:2; grid-row:1; }

/* 12 / TABLE — menu-paper typography beneath a dining-room photograph. */
body.design-table .inner-hero { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); grid-template-areas:"heading cover" "stamp stamp"; gap:28px 0; padding-block:30px; }
body.design-table .inner-cover { grid-column:1/-1; min-height:520px; border-radius:3px; }
body.design-table .inner-heading { padding:35px; margin:30px 0 30px 30px; background:var(--paper); border:1px solid var(--accent); outline:6px solid var(--paper); align-self:center; }
body.design-table .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(42px,4.6vw,67px); font-weight:400; }
body.design-table .inner-stamp { text-align:center; font-family:Georgia,serif; font-style:italic; font-size:32px; border-bottom:1px solid var(--accent); padding-bottom:20px; }
body.design-table .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 45px; }
body.design-table .inner-service-card { border:0; border-bottom:1px solid var(--accent); border-radius:0; background:transparent; padding-block:25px; }
body.design-table .inner-service-copy { padding-inline:0; }
body.design-table .inner-service-copy h3 { font-family:Georgia,serif; font-size:31px; }
body.design-table .inner-about-story { grid-template-columns:minmax(0,1fr); max-width:920px; gap:40px; }
body.design-table .inner-story-aside { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px; }
body.design-table .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-block:1px solid var(--accent); }
body.design-table .inner-value { border:0; border-right:1px solid var(--line); background:transparent; border-radius:0; text-align:center; }
body.design-table .inner-contact-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:8%; }
body.design-table .inner-contact-layout .contact-form { border:1px solid var(--accent); outline:5px solid var(--paper); outline-offset:3px; border-radius:0; background:var(--surface); }

/* 13 / STAY — a calm hotel cover and spacious editorial rooms-and-information pages. */
body.design-stay .inner-hero { width:100%; max-width:none; position:relative; grid-template-columns:minmax(0,1fr); grid-template-areas:"heading" "stamp"; gap:25px; padding:70px max(32px,calc((100vw - 1100px)/2)) 35px; background:#173b35; color:#fff; text-align:center; }
body.design-stay .inner-cover { position:absolute; inset:0; height:100%; min-height:0; z-index:0; border-radius:0; }
body.design-stay .inner-cover::after { content:""; position:absolute; inset:0; background:linear-gradient(#102f2bd9,#102f2bad 45%,#102f2be6); }
body.design-stay .inner-cover figcaption { display:none; }
body.design-stay .inner-heading { max-width:950px; justify-self:center; }
body.design-stay .inner-hero :is(h1,.inner-intro,.inner-kicker,.breadcrumb) { color:inherit; }
body.design-stay .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(49px,6.4vw,91px); font-weight:400; line-height:1.04; }
body.design-stay .inner-intro { margin-inline:auto; }
body.design-stay .inner-links { justify-content:center; }
body.design-stay .inner-links a { color:#fff; border-color:#ffffff80; }
body.design-stay .inner-stamp { font-family:Georgia,serif; font-style:italic; font-size:28px; padding-top:25px; border-top:1px solid #ffffff65; }
body.design-stay .inner-service-list { grid-template-columns:minmax(0,1fr); gap:35px; }
body.design-stay .inner-service-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:45px; background:transparent; border:0; border-bottom:1px solid var(--accent); border-radius:0; padding-bottom:35px; }
body.design-stay .inner-service-card:nth-child(even) .inner-service-image { grid-column:2; grid-row:1; }
body.design-stay .inner-service-card:nth-child(even) .inner-service-copy { grid-column:1; grid-row:1; }
body.design-stay .inner-service-copy { align-self:center; padding:15px 0; }
body.design-stay .inner-service-image { min-height:290px; border-radius:0; }
body.design-stay .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:1px solid var(--accent); }
body.design-stay .inner-value { background:transparent; border:0; border-right:1px solid var(--line); border-radius:0; }
body.design-stay .inner-contact-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:9%; }
body.design-stay .inner-contact-layout .contact-form { border:1px solid var(--accent); border-radius:0; background:var(--surface); padding:42px; }

/* 14 / ROUTE — a travel-journal panorama with a floating paper heading. */
body.design-route .inner-hero { grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr); grid-template-areas:"cover cover" "heading stamp"; gap:0 35px; padding-block:20px 35px; }
body.design-route .inner-cover { height:350px; min-height:0; border-radius:14px; }
body.design-route .inner-heading { margin:-65px 0 0 30px; background:var(--paper); padding:35px; border:1px solid var(--line); border-radius:9px; box-shadow:0 20px 50px #23485110; }
body.design-route .inner-hero h1 { font-size:clamp(43px,4.7vw,68px); font-weight:550; }
body.design-route .inner-stamp { align-self:end; padding:25px 0; font-family:Georgia,serif; font-style:italic; font-size:32px; }
body.design-route .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
body.design-route .inner-service-card { background:var(--surface); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
body.design-route .inner-service-image { aspect-ratio:1.6; border-radius:0; }
body.design-route .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
body.design-route .inner-value { border-radius:12px; border-top:4px solid var(--accent); }
body.design-route .inner-steps > li { border-bottom:3px solid var(--accent); border-radius:8px; }
body.design-route .inner-contact-layout { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:5%; }
body.design-route .inner-contact-layout .contact-form { grid-column:1; grid-row:1; border:1px solid var(--line); border-radius:14px; }
body.design-route .inner-contact-layout .contact-details { grid-column:2; grid-row:1; border-top:4px solid var(--accent); padding-top:25px; }

/* 15 / LEARN — a confident notebook, classroom window and program index. */
body.design-learn .inner-hero { grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr); grid-template-areas:"heading cover" "stamp cover"; gap:22px 28px; padding-block:35px; }
body.design-learn .inner-heading { background:var(--accent); color:var(--on-accent); padding:33px; border:2px solid var(--primary); border-radius:10px; box-shadow:5px 5px 0 var(--primary); margin:0 5px 5px 0; }
body.design-learn .inner-hero :is(h1,.inner-intro,.inner-kicker,.breadcrumb) { color:inherit; }
body.design-learn .inner-hero h1 { font-size:clamp(43px,4.9vw,70px); font-weight:700; line-height:1.05; }
body.design-learn .inner-cover { min-height:440px; border:2px solid var(--primary); border-radius:10px; }
body.design-learn .inner-stamp { font-size:25px; font-weight:700; border-bottom:2px solid var(--primary); padding-bottom:18px; }
body.design-learn .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
body.design-learn .inner-service-card { border:2px solid var(--primary); border-radius:10px; overflow:hidden; }
body.design-learn .inner-number { display:inline-grid; place-items:center; min-width:30px; height:30px; background:var(--accent); color:var(--on-accent); border-radius:50%; font-weight:700; }
body.design-learn .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
body.design-learn .inner-value { border:2px solid var(--primary); border-radius:10px; background:var(--soft); }
body.design-learn .inner-steps > li { border:1px dashed var(--primary); border-radius:8px; }
body.design-learn .inner-contact-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr); gap:35px; }
body.design-learn .inner-contact-layout .contact-details { padding:30px; border:2px solid var(--primary); border-radius:10px; background:var(--accent); color:var(--on-accent); align-self:start; }
body.design-learn .inner-contact-layout .contact-details :is(h2,p,.eyebrow,.contact-art) { color:inherit; }
body.design-learn .inner-contact-layout .contact-form { border:2px solid var(--primary); border-radius:10px; box-shadow:5px 5px 0 var(--primary); margin-right:5px; }

/* 16 / PULSE — dark software documentation, a console rail and light-readable forms. */
body.design-pulse .inner-page { --inner-paper:#17263b; --inner-line:#42536c; color:#e7effc; }
body.design-pulse .inner-hero { grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr); grid-template-areas:"heading cover" "stamp cover"; gap:28px 45px; padding-block:50px 40px; }
body.design-pulse .inner-hero h1 { color:#f1f6ff; font-family:Arial,Helvetica,sans-serif; font-size:clamp(44px,5.1vw,74px); font-weight:700; letter-spacing:-.065em; }
body.design-pulse .inner-kicker, body.design-pulse .inner-stamp { font-family:monospace; color:#a5c7ff; }
body.design-pulse .inner-cover { min-height:420px; border:1px solid #50627a; border-radius:12px; box-shadow:0 25px 60px #0004; }
body.design-pulse .inner-stamp { font-size:20px; letter-spacing:.12em; border-top:1px solid #42536c; padding-top:20px; }
body.design-pulse .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
body.design-pulse .inner-service-card { border:1px solid #42536c; border-radius:12px; background:#17263b; }
body.design-pulse .inner-number { color:#b0cdff; font-family:monospace; }
body.design-pulse .inner-about-story, body.design-pulse .inner-detail-body { grid-template-columns:minmax(0,1.6fr) minmax(0,.6fr); gap:45px; }
body.design-pulse .inner-side-note { background:#20334f; color:#edf4ff; border:1px solid #536782; border-radius:10px; }
body.design-pulse .inner-related { border-radius:10px; border-color:#42536c; background:#142238; }
body.design-pulse .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
body.design-pulse .inner-value { border:1px solid #42536c; border-radius:10px; background:#17263b; padding:30px; }
body.design-pulse .inner-contact-layout { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:35px; }
body.design-pulse .inner-contact-layout .contact-form { background:#17263b; color:#edf4ff; border:1px solid #536782; border-radius:12px; }
body.design-pulse .inner-page .contact-form :is(input,textarea) { background:#101e31; color:#edf4ff; border-color:#61748f; }
body.design-pulse .inner-page .contact-art { background:#142238; color:#adc8fa; border-color:#42536c; }
body.design-pulse .inner-page :is(h2,h3,.inner-intro,.breadcrumb) { color:#e3edfc; }
body.design-pulse .inner-page :is(.prose p,.inner-value p,.inner-service-copy p,.inner-steps p) { color:#b8c8dd; }
body.design-pulse .inner-page :where(a,button,input,textarea):focus-visible { outline-color:#b0cdff; }

/* 17 / SIGNAL — a bold agency poster with an image stripe and printed work sheets. */
body.design-signal .inner-hero { grid-template-columns:minmax(0,1fr); grid-template-areas:"heading" "cover" "stamp"; gap:28px; text-align:center; padding-block:45px 25px; }
body.design-signal .inner-heading { max-width:1100px; justify-self:center; }
body.design-signal .inner-hero h1 { font-size:clamp(53px,7.5vw,108px); font-weight:800; line-height:.98; letter-spacing:-.075em; }
body.design-signal .inner-intro { max-width:650px; margin-inline:auto; }
body.design-signal .inner-links { justify-content:center; }
body.design-signal .inner-cover { height:330px; min-height:0; border:5px solid var(--primary); border-radius:0; }
body.design-signal .inner-stamp { font-size:23px; font-weight:750; letter-spacing:.1em; border-block:2px solid var(--primary); padding:20px; }
body.design-signal .inner-service-list { grid-template-columns:minmax(0,1fr); gap:25px; }
body.design-signal .inner-service-card { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.35fr); gap:0; border:2px solid var(--primary); border-radius:0; background:var(--paper); box-shadow:5px 5px 0 var(--primary); margin-right:5px; }
body.design-signal .inner-service-image { border-right:2px solid var(--primary); min-height:260px; }
body.design-signal .inner-service-copy h3 { font-weight:750; font-size:32px; }
body.design-signal .inner-number { font-size:30px; font-weight:750; }
body.design-signal .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; border:2px solid var(--primary); }
body.design-signal .inner-value { border:0; border-right:1px solid var(--primary); border-bottom:1px solid var(--primary); border-radius:0; padding:30px; background:var(--soft); }
body.design-signal .inner-contact-layout { grid-template-columns:minmax(0,1fr); gap:35px; max-width:1080px; }
body.design-signal .inner-contact-layout .contact-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 40px; }
body.design-signal .inner-contact-layout .contact-details > h2 { grid-column:1/-1; max-width:none; }
body.design-signal .inner-contact-layout .contact-form { border:2px solid var(--primary); border-radius:0; box-shadow:6px 6px 0 var(--primary); margin-right:6px; }

/* 18 / CARGO — a dispatch cover and systematic route-information rows. */
body.design-cargo .inner-hero { width:100%; max-width:none; position:relative; grid-template-columns:minmax(0,1fr); grid-template-areas:"heading" "stamp"; gap:25px; padding:65px max(32px,calc((100vw - 1280px)/2)) 30px; background:#102f43; color:#fff; }
body.design-cargo .inner-heading { max-width:800px; }
body.design-cargo .inner-hero :is(h1,.inner-intro,.inner-kicker,.breadcrumb) { color:inherit; }
body.design-cargo .inner-hero h1 { font-size:clamp(47px,5.8vw,84px); font-weight:700; line-height:1.05; }
body.design-cargo .inner-cover { position:absolute; inset:0; height:100%; min-height:0; z-index:0; border-radius:0; }
body.design-cargo .inner-cover::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#0c2e43ef,#0c2e43c9 55%,#0c2e4355); }
body.design-cargo .inner-cover figcaption { display:none; }
body.design-cargo .inner-stamp { color:#fff; font-size:22px; font-family:monospace; letter-spacing:.12em; border-top:1px solid #ffffff65; padding-top:24px; }
body.design-cargo .inner-links a { color:#fff; border-color:#ffffff80; }
body.design-cargo .inner-service-list { grid-template-columns:minmax(0,1fr); gap:0; }
body.design-cargo .inner-service-card { display:grid; grid-template-columns:minmax(0,.65fr) minmax(0,1.4fr); gap:30px; border:0; border-top:1px solid var(--line); border-left:5px solid var(--accent); border-radius:0; padding:25px; background:var(--surface); }
body.design-cargo .inner-service-copy { padding:5px 0; }
body.design-cargo .inner-number { font-family:monospace; font-size:20px; }
body.design-cargo .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
body.design-cargo .inner-value { border:0; border-radius:0; background:var(--paper); padding:30px; }
body.design-cargo .inner-about-story { border-left:6px solid var(--accent); padding-left:35px; }
body.design-cargo .inner-contact-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr); gap:0; padding-bottom:0; margin-bottom:75px; border:1px solid var(--line); }
body.design-cargo .inner-contact-layout .contact-details { background:var(--primary); color:var(--on-primary); padding:35px; }
body.design-cargo .inner-contact-layout .contact-details :is(h2,p,.eyebrow,.contact-art) { color:inherit; }
body.design-cargo .inner-contact-layout .contact-form { padding:35px; border:0; border-top:6px solid var(--accent); border-radius:0; }

/* 19 / MOTION — angled workshop imagery and bold mechanical service tiles. */
body.design-motion .inner-hero { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); grid-template-areas:"heading cover" "stamp cover"; gap:25px 30px; padding-block:40px; }
body.design-motion .inner-hero h1 { font-size:clamp(46px,5.6vw,81px); font-weight:800; font-style:italic; line-height:1.02; }
body.design-motion .inner-cover { min-height:445px; border-radius:0; clip-path:polygon(12% 0,100% 0,100% 100%,0 100%); }
body.design-motion .inner-cover figcaption { padding-left:18%; }
body.design-motion .inner-stamp { font-size:27px; font-weight:750; font-style:italic; border-bottom:5px solid var(--accent); padding-bottom:20px; }
body.design-motion .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
body.design-motion .inner-service-card { border:0; border-bottom:5px solid var(--accent); border-radius:0; background:var(--surface); }
body.design-motion .inner-service-copy h3 { font-weight:700; }
body.design-motion .inner-number { font-size:28px; font-style:italic; font-weight:750; }
body.design-motion .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
body.design-motion .inner-value { border:0; border-left:5px solid var(--accent); background:var(--soft); border-radius:0; padding:30px; }
body.design-motion .inner-steps { border-top:4px solid var(--primary); }
body.design-motion .inner-contact-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr); gap:5%; }
body.design-motion .inner-contact-layout .contact-details { border-top:5px solid var(--accent); padding-top:28px; }
body.design-motion .inner-contact-layout .contact-form { border-radius:0; border:1px solid var(--line); border-top:5px solid var(--primary); }

/* 20 / FORGE — a factory specification sheet with ruled industrial columns. */
body.design-forge .inner-hero { grid-template-columns:minmax(0,1.5fr) minmax(0,.65fr); grid-template-areas:"heading stamp" "cover cover"; gap:30px; padding-block:40px 30px; }
body.design-forge .inner-hero h1 { font-size:clamp(46px,5.5vw,80px); font-weight:700; letter-spacing:-.06em; }
body.design-forge .inner-kicker { font-family:monospace; }
body.design-forge .inner-cover { height:340px; min-height:0; border:1px solid var(--primary); border-radius:0; }
body.design-forge .inner-stamp { align-self:end; font-family:monospace; font-size:26px; border-top:1px solid var(--primary); padding-top:23px; }
body.design-forge .inner-service-list { grid-template-columns:minmax(0,1fr); gap:0; border:1px solid var(--primary); }
body.design-forge .inner-service-card { display:grid; grid-template-columns:minmax(0,.55fr) minmax(0,1.5fr); border:0; border-bottom:1px solid var(--primary); border-radius:0; background:transparent; }
body.design-forge .inner-service-image { border-right:1px solid var(--primary); min-height:245px; }
body.design-forge .inner-number { font-family:monospace; }
body.design-forge .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border:1px solid var(--primary); }
body.design-forge .inner-value { background:transparent; border:0; border-right:1px solid var(--primary); border-radius:0; padding:30px; }
body.design-forge .inner-steps { grid-template-columns:minmax(0,1fr); }
body.design-forge .inner-steps > li { display:grid; grid-template-columns:65px minmax(0,1fr); gap:25px; border:0; border-bottom:1px solid var(--primary); padding:25px 0; }
body.design-forge .inner-contact-layout { grid-template-columns:minmax(0,1fr); gap:35px; }
body.design-forge .inner-contact-layout .contact-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px 35px; }
body.design-forge .inner-contact-layout .contact-details > h2 { grid-column:1/-1; max-width:none; }
body.design-forge .inner-contact-layout .contact-form { border:1px solid var(--primary); border-radius:0; background:var(--surface); padding:40px; }

/* 21 / VOLT — a solar-disc image and open, rounded energy-information cards. */
body.design-volt .inner-hero { grid-template-columns:minmax(0,.8fr) minmax(0,1.25fr); grid-template-areas:"cover heading" "cover stamp"; gap:25px 8%; padding-block:55px; }
body.design-volt .inner-cover { min-height:0; aspect-ratio:1; border-radius:50%; align-self:center; border:10px solid var(--soft); }
body.design-volt .inner-hero h1 { font-size:clamp(44px,5.1vw,73px); font-weight:600; line-height:1.09; }
body.design-volt .inner-stamp { font-size:26px; border-bottom:2px solid var(--accent); padding-bottom:18px; }
body.design-volt .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
body.design-volt .inner-service-card { border:1px solid var(--line); border-radius:25px; background:var(--surface); overflow:hidden; }
body.design-volt .inner-service-image { border-radius:0; aspect-ratio:1.6; }
body.design-volt .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
body.design-volt .inner-value { border:0; border-radius:25px; padding:30px; background:var(--soft); }
body.design-volt .inner-side-note { border-radius:25px; }
body.design-volt .inner-contact-layout { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:6%; }
body.design-volt .inner-contact-layout .contact-form { grid-column:1; grid-row:1; border:1px solid var(--line); border-radius:28px; padding:40px; }
body.design-volt .inner-contact-layout .contact-details { grid-column:2; grid-row:1; padding:20px 0; }

/* 22 / HARVEST — a field journal and broad, natural product-information panels. */
body.design-harvest .inner-hero { grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); grid-template-areas:"cover heading" "stamp heading"; gap:22px 7%; padding-block:45px; }
body.design-harvest .inner-cover { min-height:390px; border-radius:90px 0 0 0; border-bottom:10px solid var(--accent); }
body.design-harvest .inner-heading { padding-block:20px; }
body.design-harvest .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(47px,5.6vw,80px); font-weight:400; }
body.design-harvest .inner-stamp { font-family:Georgia,serif; font-style:italic; font-size:28px; border-top:0; padding-top:0; }
body.design-harvest .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; }
body.design-harvest .inner-service-card { border:0; border-bottom:1px solid var(--accent); border-radius:0; background:transparent; }
body.design-harvest .inner-service-image { aspect-ratio:1.5; border-radius:60px 0 0 0; }
body.design-harvest .inner-service-copy { padding-inline:5px; }
body.design-harvest .inner-service-copy h3 { font-family:Georgia,serif; font-size:30px; font-weight:400; }
body.design-harvest .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-block:1px solid var(--accent); }
body.design-harvest .inner-value { border:0; border-right:1px solid var(--line); background:transparent; padding:30px; }
body.design-harvest .inner-about-story { grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr); gap:8%; }
body.design-harvest .inner-contact-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr); gap:6%; }
body.design-harvest .inner-contact-layout .contact-form { border-radius:0; border:1px solid var(--accent); border-top:7px solid var(--primary); background:var(--surface); }

/* 23 / CLEAR — bright rounded service windows and a clean, balanced contact pair. */
body.design-clear .inner-hero { grid-template-columns:minmax(0,1fr); grid-template-areas:"heading" "cover" "stamp"; gap:25px; padding-block:42px 25px; text-align:center; }
body.design-clear .inner-heading { max-width:950px; justify-self:center; }
body.design-clear .inner-hero h1 { font-size:clamp(45px,5.8vw,83px); font-weight:600; line-height:1.07; }
body.design-clear .inner-intro { max-width:650px; margin-inline:auto; }
body.design-clear .inner-links { justify-content:center; }
body.design-clear .inner-cover { height:310px; min-height:0; border-radius:45px; border:10px solid var(--soft); }
body.design-clear .inner-stamp { font-size:23px; letter-spacing:.1em; border:0; padding-top:0; }
body.design-clear .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
body.design-clear .inner-service-card { border:1px solid var(--line); border-radius:22px; overflow:hidden; box-shadow:0 10px 30px #37757d08; }
body.design-clear .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
body.design-clear .inner-value { border:0; border-radius:22px; background:var(--soft); padding:30px; }
body.design-clear .inner-steps > li { border-radius:15px; border:1px solid var(--line); padding:25px; }
body.design-clear .inner-contact-layout { grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:25px; }
body.design-clear .inner-contact-layout .contact-details { border:1px solid var(--line); background:var(--soft); border-radius:23px; padding:33px; }
body.design-clear .inner-contact-layout .contact-form { border:1px solid var(--line); border-radius:23px; background:var(--surface); }

/* 24 / OCCASION — an elegant invitation spread with expressive serif details. */
body.design-occasion .inner-hero { grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr); grid-template-areas:"stamp heading" "cover cover"; gap:32px 7%; padding-block:50px 30px; }
body.design-occasion .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(49px,6vw,86px); font-weight:400; line-height:1.04; }
body.design-occasion .inner-cover { height:370px; min-height:0; border-radius:180px 180px 0 0; border:8px solid var(--soft); }
body.design-occasion .inner-stamp { font-family:Georgia,serif; font-size:40px; font-style:italic; align-self:end; padding-bottom:20px; border-top:0; border-bottom:1px solid var(--accent); }
body.design-occasion .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px; }
body.design-occasion .inner-service-card { border:0; border-bottom:1px solid var(--accent); border-radius:0; text-align:center; background:transparent; }
body.design-occasion .inner-service-image { aspect-ratio:1.25; border-radius:130px 130px 0 0; }
body.design-occasion .inner-service-copy h3 { font-family:Georgia,serif; font-size:31px; font-weight:400; }
body.design-occasion .inner-about-story { grid-template-columns:minmax(0,1fr); max-width:940px; gap:35px; }
body.design-occasion .inner-story-aside { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px; }
body.design-occasion .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
body.design-occasion .inner-value { border:1px solid var(--accent); border-radius:70px 70px 0 0; padding:40px 25px 25px; text-align:center; }
body.design-occasion .inner-contact-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.1fr); gap:8%; }
body.design-occasion .inner-contact-layout .contact-form { border:1px solid var(--accent); border-radius:60px 60px 0 0; padding:43px; }

/* 25 / ROADSIDE — a service dispatch panel with clear phone-first contact details. */
body.design-roadside .inner-hero { width:100%; max-width:none; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); grid-template-areas:"heading cover" "stamp cover"; gap:0; padding:0 max(32px,calc((100vw - 1280px)/2)); background:var(--primary); color:var(--on-primary); }
body.design-roadside .inner-heading { padding:50px 42px 30px 0; }
body.design-roadside .inner-hero :is(h1,.inner-intro,.inner-kicker,.breadcrumb) { color:inherit; }
body.design-roadside .inner-hero h1 { font-size:clamp(44px,5.2vw,75px); font-weight:800; line-height:1.02; }
body.design-roadside .inner-cover { min-height:460px; border-left:7px solid var(--accent); border-radius:0; }
body.design-roadside .inner-links a { color:inherit; border-color:currentColor; }
body.design-roadside .inner-stamp { font-size:22px; font-weight:750; padding:20px 25px; background:var(--accent); color:var(--on-accent); border:0; }
body.design-roadside .inner-service-list { grid-template-columns:minmax(0,1fr); gap:15px; }
body.design-roadside .inner-service-card { display:grid; grid-template-columns:minmax(0,.55fr) minmax(0,1.5fr); gap:25px; padding:25px; border:2px solid var(--primary); border-left:7px solid var(--accent); border-radius:5px; }
body.design-roadside .inner-service-copy { padding:0; }
body.design-roadside .inner-service-copy h3 { font-weight:750; }
body.design-roadside .inner-number { font-size:24px; font-weight:750; }
body.design-roadside .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
body.design-roadside .inner-value { border:0; border-left:5px solid var(--accent); border-radius:0; background:var(--soft); padding:28px; }
body.design-roadside .inner-contact-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:30px; }
body.design-roadside .inner-contact-layout .contact-details { background:var(--accent); color:var(--on-accent); border:2px solid var(--primary); border-radius:5px; padding:33px; align-self:start; }
body.design-roadside .inner-contact-layout .contact-details :is(h2,p,.eyebrow,.contact-art) { color:inherit; }
body.design-roadside .inner-contact-layout .contact-item a[href^="tel:"] { font-size:clamp(21px,2vw,29px); font-weight:750; line-height:1.4; }
body.design-roadside .inner-contact-layout .contact-form { border:2px solid var(--primary); border-radius:5px; }

/* 26 / AGGREGATE — a material index with earthy sheets and a clear delivery enquiry. */
body.design-aggregate .inner-hero { grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); grid-template-areas:"cover heading" "stamp heading"; gap:22px 6%; padding-block:40px; }
body.design-aggregate .inner-cover { min-height:390px; border-radius:0; border-bottom:12px solid var(--accent); }
body.design-aggregate .inner-hero h1 { font-size:clamp(44px,5vw,72px); font-weight:750; line-height:1.04; }
body.design-aggregate .inner-stamp { font-family:monospace; font-size:24px; border-top:0; padding-top:0; }
body.design-aggregate .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border:1px solid var(--line); }
body.design-aggregate .inner-service-card { border:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); border-radius:0; background:var(--surface); }
body.design-aggregate .inner-number { font-family:monospace; font-size:28px; }
body.design-aggregate .inner-service-copy h3 { font-weight:700; }
body.design-aggregate .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-block:1px solid var(--primary); }
body.design-aggregate .inner-value { border:0; border-right:1px solid var(--line); background:transparent; padding:30px; }
body.design-aggregate .inner-steps { grid-template-columns:minmax(0,1fr); }
body.design-aggregate .inner-steps > li { display:grid; grid-template-columns:65px minmax(0,1fr); gap:25px; border:0; border-bottom:1px solid var(--line); padding:25px 0; }
body.design-aggregate .inner-contact-layout { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:4%; }
body.design-aggregate .inner-contact-layout .contact-details { border-top:6px solid var(--accent); padding-top:28px; }
body.design-aggregate .inner-contact-layout .contact-form { border:1px solid var(--line); border-radius:0; background:var(--surface); padding:38px; }

/* 27 / REPAIR — a workshop specification page and an orderly technical enquiry. */
body.design-repair .inner-hero { grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr); grid-template-areas:"heading cover" "stamp stamp"; gap:25px 7%; padding-block:40px 30px; border-bottom:1px solid var(--primary); }
body.design-repair .inner-hero h1 { font-size:clamp(44px,5vw,72px); font-weight:650; line-height:1.08; }
body.design-repair .inner-kicker { font-family:monospace; }
body.design-repair .inner-cover { min-height:350px; border:1px solid var(--primary); border-radius:3px; border-top:6px solid var(--accent); }
body.design-repair .inner-stamp { font-family:monospace; font-size:20px; letter-spacing:.1em; border-top:1px dashed var(--primary); padding-top:20px; }
body.design-repair .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
body.design-repair .inner-service-card { border:1px solid var(--line); border-top:4px solid var(--primary); border-radius:3px; background:var(--surface); }
body.design-repair .inner-number { font-family:monospace; display:inline-block; background:var(--soft); padding:6px 10px; align-self:flex-start; }
body.design-repair .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
body.design-repair .inner-value { border:1px dashed var(--primary); border-top:4px solid var(--accent); border-radius:3px; padding:30px; }
body.design-repair .inner-detail-aside { border-left:1px solid var(--line); padding-left:25px; }
body.design-repair .inner-contact-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr); gap:35px; }
body.design-repair .inner-contact-layout .contact-details { background:var(--soft); border:1px dashed var(--primary); padding:30px; }
body.design-repair .inner-contact-layout .contact-form { border-radius:3px; border:1px solid var(--primary); border-top:5px solid var(--accent); }

/* 28 / CLIMATE — a soft appliance-showroom frame and rounded information islands. */
body.design-climate .inner-hero { grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr); grid-template-areas:"cover heading" "cover stamp"; gap:25px 5%; padding:40px; margin-top:30px; margin-bottom:35px; border-radius:35px; background:var(--soft); }
body.design-climate .inner-cover { min-height:400px; border-radius:45% 45% 20px 20px; border:10px solid var(--paper); }
body.design-climate .inner-hero h1 { font-size:clamp(44px,5vw,72px); font-weight:500; line-height:1.08; }
body.design-climate .inner-stamp { font-size:24px; border:0; padding-top:0; }
body.design-climate .inner-service-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:23px; }
body.design-climate .inner-service-card { border:1px solid var(--line); border-radius:24px; overflow:hidden; background:var(--surface); }
body.design-climate .inner-service-image { aspect-ratio:1.4; border-radius:0; }
body.design-climate .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
body.design-climate .inner-value { border:1px solid var(--line); border-radius:24px; background:var(--soft); padding:30px; }
body.design-climate .inner-side-note { border-radius:22px; }
body.design-climate .inner-contact-layout { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:5%; }
body.design-climate .inner-contact-layout .contact-form { grid-column:1; grid-row:1; border:1px solid var(--line); border-radius:25px; padding:40px; box-shadow:0 15px 45px #315d730a; }
body.design-climate .inner-contact-layout .contact-details { grid-column:2; grid-row:1; padding-top:20px; }

/* 29 / GARDEN — a botanical journal with a wide title and a leafy corner photograph. */
body.design-garden .inner-hero { grid-template-columns:minmax(0,1.5fr) minmax(0,.65fr); grid-template-areas:"heading heading" "cover stamp"; gap:30px 6%; padding-block:45px 30px; }
body.design-garden .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(50px,6.5vw,94px); font-weight:400; line-height:1.04; }
body.design-garden .inner-heading { max-width:1100px; }
body.design-garden .inner-cover { min-height:350px; border-radius:110px 0 0 0; border:8px solid var(--soft); }
body.design-garden .inner-stamp { font-family:Georgia,serif; font-size:35px; font-style:italic; align-self:end; border-top:1px solid var(--accent); padding-block:22px; }
body.design-garden .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; }
body.design-garden .inner-service-card { border:0; border-radius:70px 0 0 0; overflow:hidden; background:var(--soft); }
body.design-garden .inner-service-copy h3 { font-family:Georgia,serif; font-size:31px; font-weight:400; }
body.design-garden .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
body.design-garden .inner-value { border:0; border-bottom:1px solid var(--accent); background:transparent; border-radius:0; }
body.design-garden .inner-about-story { border-top:1px solid var(--accent); padding-top:40px; }
body.design-garden .inner-contact-layout { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:7%; }
body.design-garden .inner-contact-layout .contact-form { border-radius:70px 0 0 0; background:var(--soft); border:0; padding:45px 38px 38px; }

/* 30 / WOODWORK — a material gallery, framed object imagery and a craft workshop letter. */
body.design-woodwork .inner-hero { grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr); grid-template-areas:"cover heading" "stamp heading"; gap:22px 8%; padding-block:45px; }
body.design-woodwork .inner-cover { min-height:420px; border:12px solid var(--soft); border-radius:0; outline:1px solid var(--line); }
body.design-woodwork .inner-heading { padding-block:20px; }
body.design-woodwork .inner-hero h1 { font-family:Georgia,serif; font-size:clamp(47px,5.6vw,81px); font-weight:400; line-height:1.06; }
body.design-woodwork .inner-stamp { font-family:Georgia,serif; font-size:28px; letter-spacing:.08em; border:0; padding:0; text-align:center; }
body.design-woodwork .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
body.design-woodwork .inner-service-card { border:0; border-radius:0; background:var(--soft); }
body.design-woodwork .inner-service-image { border:10px solid var(--soft); border-bottom:0; aspect-ratio:1.3; }
body.design-woodwork .inner-service-copy h3 { font-family:Georgia,serif; font-size:31px; font-weight:400; }
body.design-woodwork .inner-about-story { grid-template-columns:minmax(0,1fr); max-width:960px; gap:35px; }
body.design-woodwork .inner-story-aside { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px; }
body.design-woodwork .inner-value-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-block:1px solid var(--accent); }
body.design-woodwork .inner-value { background:transparent; border:0; border-right:1px solid var(--line); border-radius:0; padding:30px; }
body.design-woodwork .inner-contact-layout { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:7%; }
body.design-woodwork .inner-contact-layout .contact-form { grid-column:1; grid-row:1; border:1px solid var(--accent); border-radius:0; background:var(--surface); }
body.design-woodwork .inner-contact-layout .contact-details { grid-column:2; grid-row:1; border-top:1px solid var(--accent); padding-top:25px; }

/* Notes placed on pale surfaces keep the matching dark foreground. */
body:is(.design-estate,.design-perspective,.design-dent,.design-lex,.design-bloom) .inner-side-note { color:var(--primary); }
body:is(.design-balance,.design-table,.design-occasion,.design-woodwork) .inner-story-aside:not(:has(.inner-story-image)) { grid-template-columns:minmax(0,1fr); }
/* Breadcrumbs inherit the actual heading surface instead of the brand's dark primary ink. */
body:is(.design-pulse,.design-terra,.design-stay,.design-cargo,.design-roadside,.design-learn) .inner-hero .breadcrumb :is([aria-current="page"],a:hover,a:focus-visible) { color:inherit; }
body.design-roadside:has(.inner-page) .site-footer .business-location .eyebrow { color:inherit; }

/* Tablet cards stay readable before the individual phone compositions take over. */
@media(min-width:761px) and (max-width:1100px) {
  body:has(.inner-page) .inner-service-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body:is(.design-atelier,.design-lex,.design-ledger,.design-care,.design-form,.design-stay,.design-signal,.design-cargo,.design-forge,.design-roadside) .inner-service-list { grid-template-columns:minmax(0,1fr); }
  body:has(.inner-page) .inner-value-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body:has(.inner-page) .inner-hero h1 { font-size:clamp(40px,5.4vw,60px); }
  body.design-climate .inner-hero { padding:28px; }
  body:is(.design-estate,.design-table) .inner-heading { padding:28px; }
  body.design-route .inner-heading { padding:28px; margin-left:22px; }
  body.design-learn .inner-heading { padding:26px; }
  body:has(.inner-page) .inner-contact-layout { gap:30px; }
  body:has(.inner-page) .inner-contact-layout .contact-form { padding:28px; }
  body:is(.design-terra,.design-cargo,.design-ledger,.design-clear,.design-repair,.design-learn,.design-roadside) .inner-contact-layout .contact-details { padding:27px; }
  body.design-forge .inner-contact-layout .contact-details { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Compact layouts keep each page's visual direction while following its content order. */
@media(max-width:760px) {
  body:has(.inner-page) .inner-hero { grid-template-columns:minmax(0,1fr); gap:24px; }
  body:has(.inner-page) .inner-heading { margin:0; padding:0; }
  body:has(.inner-page) .inner-hero h1 { font-size:clamp(35px,9.4vw,57px); line-height:1.08; }
  body:has(.inner-page) .inner-cover { min-height:0; height:auto; aspect-ratio:1.35; }
  body:has(.inner-page) .inner-stamp { font-size:clamp(23px,6.8vw,36px); }
  body:has(.inner-page) :is(.inner-service-list,.inner-value-list) { grid-template-columns:minmax(0,1fr); gap:20px; }
  body:has(.inner-page) .inner-service-card { grid-template-columns:minmax(0,1fr); gap:0; }
  body:has(.inner-page) .inner-service-image { min-height:0; aspect-ratio:1.5; height:auto; grid-column:auto; grid-row:auto; }
  body:has(.inner-page) .inner-service-copy { grid-column:auto; grid-row:auto; padding:25px; }
  body:has(.inner-page) .inner-service-copy h3 { font-size:27px; }
  body:has(.inner-page) :is(.inner-about-story,.inner-detail-body,.inner-contact-layout) { grid-template-columns:minmax(0,1fr); gap:30px; }
  body:has(.inner-page) :is(.inner-story-aside,.inner-detail-aside) { border-left:0; padding-left:0; }
  body:has(.inner-page) .inner-story-aside { grid-template-columns:minmax(0,1fr); }
  body:has(.inner-page) .inner-contact-layout :is(.contact-form,.contact-details) { grid-column:auto; grid-row:auto; min-width:0; }
  body:has(.inner-page) .inner-contact-layout .contact-form { padding:27px; }
  body:has(.inner-page) .inner-contact-layout .contact-details { grid-template-columns:minmax(0,1fr); }
  body:has(.inner-page) .inner-value { padding:27px; }
  body:has(.inner-page) .inner-steps { grid-template-columns:minmax(0,1fr); }
  body:has(.inner-page) .inner-steps > li { border-right:0; padding:24px 0; }

  body.design-atelier .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-atelier .inner-cover { aspect-ratio:1.6; }
  body.design-atelier .inner-stamp { border-top:0; padding-top:0; text-align:right; }
  body.design-atelier .inner-service-copy { padding:25px 0 0; }
  body.design-atelier .inner-value { border-right:0; border-top:1px solid var(--line); padding-inline:0; }
  body.design-atelier .inner-contact-layout .contact-form { padding:25px 22px; }

  body.design-terra .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding:32px 22px 0; gap:26px; }
  body.design-terra .inner-cover { border-left:0; border-top:6px solid var(--accent); aspect-ratio:1.45; }
  body.design-terra .inner-stamp { padding:20px 0; }
  body.design-terra .inner-service-list { gap:17px; }
  body.design-terra .inner-contact-layout { margin-bottom:45px; gap:0; }
  body.design-terra .inner-contact-layout .contact-details { padding:28px 24px; }
  body.design-terra .inner-contact-layout .contact-form { border-left:0; padding:28px 24px; }

  body.design-estate .inner-hero { grid-template-areas:"cover" "heading" "stamp"; gap:0; padding-top:18px; }
  body.design-estate .inner-cover { grid-area:cover; width:100%; aspect-ratio:1.3; }
  body.design-estate .inner-heading { margin:-35px 12px 0; padding:27px 23px; }
  body.design-estate .inner-hero h1 { font-size:clamp(34px,8.7vw,53px); }
  body.design-estate .inner-stamp { padding-top:25px; }
  body.design-estate .inner-contact-layout .contact-details { padding-top:0; }

  body.design-lex .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-lex .inner-cover { margin:8px; width:calc(100% - 16px); aspect-ratio:1.2; border-radius:130px 130px 0 0; }
  body.design-lex .inner-stamp { text-align:center; border-top:0; padding-top:10px; }
  body.design-lex .inner-service-copy { padding:23px 0 0; }
  body.design-lex .inner-value { padding-inline:0; }

  body.design-ledger .inner-hero { grid-template-areas:"heading" "stamp" "cover"; padding-block:30px; }
  body.design-ledger .inner-cover { aspect-ratio:1.65; border-bottom-width:7px; }
  body.design-ledger .inner-stamp { padding-top:15px; font-size:20px; }
  body.design-ledger .inner-service-card { padding:20px; }
  body.design-ledger .inner-service-copy { padding:23px 0 0; }
  body.design-ledger .inner-contact-layout .contact-details { padding:25px; }

  body.design-perspective .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-top:35px; }
  body.design-perspective .inner-cover { aspect-ratio:1.6; border-radius:70px 8px 8px 8px; }
  body.design-perspective .inner-stamp { font-size:21px; }
  body.design-perspective .inner-contact-layout .contact-details { display:block; }
  body.design-perspective .inner-contact-layout .contact-form { border-radius:20px; }

  body.design-dent .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; text-align:center; }
  body.design-dent .inner-links { justify-content:center; }
  body.design-dent .inner-cover { width:calc(100% - 24px); max-width:400px; margin:12px; aspect-ratio:1; justify-self:center; }
  body.design-dent .inner-stamp { font-size:21px; border-top:0; padding-top:0; }
  body.design-dent .inner-contact-layout .contact-form { border-radius:22px; }

  body.design-care .inner-hero { grid-template-areas:"cover" "heading" "stamp"; padding-top:20px; }
  body.design-care .inner-cover { aspect-ratio:1.45; border-radius:8px 65px 8px 8px; }
  body.design-care .inner-stamp { border-top:0; padding-top:0; font-size:28px; }
  body.design-care .inner-service-copy { padding:25px 0 0; }
  body.design-care .inner-contact-layout .contact-details { padding-top:0; }

  body.design-balance .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; text-align:center; }
  body.design-balance .inner-links { justify-content:center; }
  body.design-balance .inner-cover { aspect-ratio:1; width:calc(100% - 14px); max-width:410px; justify-self:center; border-width:8px; }
  body.design-balance .inner-stamp { padding-top:15px; }
  body.design-balance .inner-service-copy { padding-inline:14px; }
  body.design-balance .inner-value { border-radius:40px 40px 10px 10px; padding-top:35px; }
  body.design-balance .inner-contact-layout .contact-form { border-radius:35px 35px 12px 12px; }

  body.design-bloom .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-bloom .inner-cover { width:calc(100% - 20px); margin-left:20px; aspect-ratio:1.1; border-radius:130px 130px 0 75px; }
  body.design-bloom .inner-stamp { border-top:0; padding-top:0; }
  body.design-bloom .inner-service-copy { padding-inline:5px; }
  body.design-bloom .inner-contact-layout .contact-form { border-radius:0 45px 0 0; }

  body.design-form .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-form .inner-cover { aspect-ratio:1.15; }
  body.design-form .inner-stamp { border-top:0; padding-block:0; font-size:27px; }
  body.design-form .inner-service-copy { padding:25px 0 0; }
  body.design-form .inner-value { border-right:0; border-bottom:1px solid var(--line); }

  body.design-table .inner-hero { grid-template-areas:"cover" "heading" "stamp"; gap:0; padding-top:18px; }
  body.design-table .inner-cover { grid-area:cover; aspect-ratio:1.3; }
  body.design-table .inner-heading { margin:-35px 13px 0; padding:25px 21px; outline-width:4px; }
  body.design-table .inner-hero h1 { font-size:clamp(34px,8.5vw,54px); }
  body.design-table .inner-stamp { padding-top:25px; border-top:0; font-size:27px; }
  body.design-table .inner-service-copy { padding:25px 0 0; }
  body.design-table .inner-contact-layout .contact-form { outline:0; }

  body.design-stay .inner-hero { grid-template-areas:"heading" "stamp"; padding:45px 22px 28px; }
  body.design-stay .inner-cover { position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; }
  body.design-stay .inner-hero h1 { font-size:clamp(40px,10.1vw,61px); }
  body.design-stay .inner-stamp { font-size:26px; padding-top:22px; }
  body.design-stay .inner-service-card { padding-bottom:25px; }
  body.design-stay .inner-service-card:nth-child(even) :is(.inner-service-image,.inner-service-copy) { grid-column:auto; grid-row:auto; }
  body.design-stay .inner-service-copy { padding:25px 0 0; }
  body.design-stay .inner-value { border-right:0; border-bottom:1px solid var(--line); padding-inline:0; }

  body.design-route .inner-hero { grid-template-areas:"cover" "heading" "stamp"; gap:0; padding-top:18px; }
  body.design-route .inner-cover { aspect-ratio:1.2; }
  body.design-route .inner-heading { margin:-40px 12px 0; padding:26px 22px; }
  body.design-route .inner-hero h1 { font-size:clamp(34px,8.8vw,54px); }
  body.design-route .inner-stamp { padding-block:25px 0; }
  body.design-route .inner-contact-layout .contact-details { border-top-width:3px; padding-top:22px; }

  body.design-learn .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-top:23px; }
  body.design-learn .inner-heading { padding:26px 22px; margin-right:5px; margin-bottom:5px; }
  body.design-learn .inner-hero h1 { font-size:clamp(35px,8.7vw,54px); }
  body.design-learn .inner-cover { aspect-ratio:1.5; }
  body.design-learn .inner-stamp { border-top:0; padding-top:0; font-size:22px; }
  body.design-learn .inner-contact-layout .contact-details { padding:25px; }

  body.design-pulse .inner-hero { grid-template-areas:"heading" "stamp" "cover"; padding-block:30px; }
  body.design-pulse .inner-hero h1 { font-size:clamp(38px,9.5vw,58px); }
  body.design-pulse .inner-cover { aspect-ratio:1.4; border-radius:10px; }
  body.design-pulse .inner-stamp { font-size:19px; padding-top:16px; }
  body.design-pulse .inner-contact-layout .contact-form { border-radius:10px; }

  body.design-signal .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-top:32px; }
  body.design-signal .inner-hero h1 { font-size:clamp(44px,11.5vw,69px); line-height:1.02; }
  body.design-signal .inner-cover { aspect-ratio:1.4; border-width:4px; }
  body.design-signal .inner-stamp { padding:18px 8px; font-size:22px; }
  body.design-signal .inner-service-image { border-right:0; border-bottom:2px solid var(--primary); }
  body.design-signal .inner-contact-layout .contact-details { display:block; }

  body.design-cargo .inner-hero { grid-template-areas:"heading" "stamp"; padding:42px 22px 25px; }
  body.design-cargo .inner-cover { position:absolute; inset:0; height:100%; aspect-ratio:auto; }
  body.design-cargo .inner-cover::after { background:linear-gradient(#0c2e43e8,#0c2e43c7); }
  body.design-cargo .inner-stamp { font-size:20px; padding-top:22px; }
  body.design-cargo .inner-service-card { padding:22px; }
  body.design-cargo .inner-service-copy { padding:23px 0 0; }
  body.design-cargo .inner-about-story { border-left-width:4px; padding-left:20px; }
  body.design-cargo .inner-contact-layout { gap:0; margin-bottom:45px; }
  body.design-cargo .inner-contact-layout .contact-details { padding:27px 24px; }

  body.design-motion .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-motion .inner-hero h1 { font-size:clamp(40px,10.1vw,62px); }
  body.design-motion .inner-cover { aspect-ratio:1.4; clip-path:polygon(7% 0,100% 0,100% 100%,0 100%); }
  body.design-motion .inner-stamp { font-size:25px; border-top:0; padding-top:0; }
  body.design-motion .inner-contact-layout .contact-details { padding-top:22px; }

  body.design-forge .inner-hero { grid-template-areas:"heading" "stamp" "cover"; padding-block:30px; }
  body.design-forge .inner-cover { aspect-ratio:1.55; }
  body.design-forge .inner-stamp { font-size:23px; padding-top:17px; }
  body.design-forge .inner-service-list { gap:0; }
  body.design-forge .inner-service-image { border-right:0; border-bottom:1px solid var(--primary); }
  body.design-forge .inner-contact-layout .contact-details { display:block; }

  body.design-volt .inner-hero { grid-template-areas:"cover" "heading" "stamp"; padding-block:28px; }
  body.design-volt .inner-cover { aspect-ratio:1; max-width:390px; width:calc(100% - 16px); justify-self:center; border-width:8px; }
  body.design-volt .inner-stamp { font-size:24px; border-top:0; padding-top:0; }
  body.design-volt .inner-contact-layout .contact-details { padding-top:0; }

  body.design-harvest .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-harvest .inner-cover { aspect-ratio:1.35; border-radius:65px 0 0 0; border-bottom-width:8px; }
  body.design-harvest .inner-stamp { font-size:26px; }
  body.design-harvest .inner-service-copy { padding:24px 0 0; }
  body.design-harvest .inner-value { border-right:0; border-bottom:1px solid var(--line); padding-inline:0; }

  body.design-clear .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-clear .inner-cover { aspect-ratio:1.5; border-radius:28px; border-width:7px; }
  body.design-clear .inner-stamp { font-size:21px; }
  body.design-clear .inner-contact-layout .contact-details { padding:27px; border-radius:20px; }
  body.design-clear .inner-contact-layout .contact-form { border-radius:20px; }

  body.design-occasion .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; text-align:center; }
  body.design-occasion .inner-links { justify-content:center; }
  body.design-occasion .inner-cover { aspect-ratio:1.1; border-radius:140px 140px 0 0; border-width:6px; }
  body.design-occasion .inner-stamp { font-size:31px; }
  body.design-occasion .inner-value { border-radius:55px 55px 0 0; padding-top:35px; }
  body.design-occasion .inner-contact-layout .contact-form { border-radius:35px 35px 0 0; padding-top:34px; }

  body.design-roadside .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding:32px 22px 0; gap:25px; }
  body.design-roadside .inner-cover { aspect-ratio:1.3; border-left:0; border-top:6px solid var(--accent); }
  body.design-roadside .inner-stamp { padding:18px; font-size:20px; }
  body.design-roadside .inner-service-card { padding:21px; border-left-width:5px; }
  body.design-roadside .inner-service-copy { padding:23px 0 0; }
  body.design-roadside .inner-contact-layout .contact-details { padding:26px; }

  body.design-aggregate .inner-hero { grid-template-areas:"cover" "heading" "stamp"; padding-block:25px; }
  body.design-aggregate .inner-cover { aspect-ratio:1.4; border-bottom-width:8px; }
  body.design-aggregate .inner-stamp { font-size:22px; }
  body.design-aggregate .inner-service-list { gap:0; }
  body.design-aggregate .inner-value { border-right:0; border-bottom:1px solid var(--line); }
  body.design-aggregate .inner-contact-layout .contact-details { padding-top:22px; }

  body.design-repair .inner-hero { grid-template-areas:"heading" "stamp" "cover"; padding-block:30px; }
  body.design-repair .inner-cover { aspect-ratio:1.5; }
  body.design-repair .inner-stamp { font-size:19px; padding-top:17px; }
  body.design-repair .inner-contact-layout .contact-details { padding:25px; }

  body.design-climate .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding:26px 22px; border-radius:23px; margin-top:20px; margin-bottom:30px; }
  body.design-climate .inner-hero h1 { font-size:clamp(34px,8.8vw,54px); }
  body.design-climate .inner-cover { aspect-ratio:1.25; border-width:7px; border-radius:45% 45% 12px 12px; }
  body.design-climate .inner-stamp { font-size:22px; }
  body.design-climate .inner-contact-layout .contact-details { padding-top:0; }

  body.design-garden .inner-hero { grid-template-areas:"heading" "cover" "stamp"; padding-block:30px; }
  body.design-garden .inner-hero h1 { font-size:clamp(42px,10.4vw,64px); }
  body.design-garden .inner-cover { aspect-ratio:1.4; border-radius:75px 0 0 0; border-width:6px; }
  body.design-garden .inner-stamp { font-size:29px; padding-block:17px; }
  body.design-garden .inner-contact-layout .contact-form { border-radius:45px 0 0 0; padding-top:35px; }

  body.design-woodwork .inner-hero { grid-template-areas:"cover" "heading" "stamp"; padding-block:25px; }
  body.design-woodwork .inner-cover { aspect-ratio:1.15; border-width:9px; }
  body.design-woodwork .inner-stamp { font-size:26px; }
  body.design-woodwork .inner-value { border-right:0; border-bottom:1px solid var(--line); }
  body.design-woodwork .inner-contact-layout .contact-details { padding-top:22px; }
}

@media(max-width:360px) {
  body:has(.inner-page) .inner-hero h1 { font-size:34px; }
  body:has(.inner-page) .inner-contact-layout .contact-form { padding:22px 19px; }
  body:has(.inner-page) .inner-service-copy { padding-inline:21px; }
  body:has(.inner-page) .inner-side-note { padding:25px 21px; }
  body:is(.design-terra,.design-roadside,.design-cargo,.design-stay) .inner-hero { padding-inline:16px; }
  body:is(.design-estate,.design-table,.design-route) .inner-heading { margin-inline:8px; padding-inline:19px; }
  body.design-learn .inner-heading { padding-inline:19px; }
  body.design-climate .inner-hero { padding-inline:19px; }
  body:is(.design-atelier,.design-lex,.design-ledger,.design-care,.design-form,.design-table,.design-stay,.design-harvest,.design-cargo,.design-roadside) .inner-service-copy { padding-inline:0; }
}

/* Transitions are optional; native forms and article reading never require animation. */
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  body[data-motion="1"] .inner-page .inner-service-card { transition:box-shadow .2s,border-color .2s; }
  body[data-motion="1"] .inner-page .inner-service-card:hover { border-color:var(--accent); }
}
body[data-motion="0"] .inner-page .inner-service-image img { transition:none; }
@media(prefers-reduced-motion:reduce) { .inner-page .inner-service-image img { transition:none; } }