/* MB Design & Build - mobile-first conversion system v4 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  /* v6, Burgundy / White / Grey rebrand (May 2026) */
  --ink:#1a1a1a;
  --coal:#262626;
  --paper:#f4f5f7;
  --paper-2:#e8eaee;
  --white:#fff;
  --brass:#5a0f1f;            /* burgundy primary (matches new logo) */
  --brass-dark:#5a0f1f;       /* deep burgundy */
  --sage:#6b7280;             /* repurposed: neutral grey */
  --clay:#5a0f1f;             /* legacy alias → burgundy */
  --text:#1a1a1a;
  --muted:#5b6470;
  --soft:#d7dade;
  --line:rgba(26,26,26,.12);
  --dark-line:rgba(255,255,255,.14);
  --shadow:0 18px 42px rgba(26,26,26,.12);
  --max:1180px;
  --pad:20px;
  --radius:8px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--paper);color:var(--text);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased;padding-bottom:72px}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer;border:0;background:none;color:inherit}
:focus-visible{outline:3px solid rgba(90,15,31,.42);outline-offset:3px}
.container{width:min(100% - (var(--pad) * 2),var(--max));margin-inline:auto}
section,.section{padding:58px 0}.section-light{background:var(--paper)}.section-muted{background:var(--paper-2)}.section-dark{background:var(--ink);color:#fff}.section-dark p{color:rgba(255,255,255,.76)}
h1,h2,h3{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:900;line-height:1.1;letter-spacing:-.02em;color:var(--ink)}
h1{font-size:3rem;max-width:14ch}h2{font-size:2.3rem;max-width:16ch}h3{font-size:1.45rem;font-weight:700;letter-spacing:-.01em}p{font-size:1rem;color:var(--muted)}
.eyebrow,.kicker{display:inline-flex;align-items:center;gap:10px;font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:0;color:var(--brass-dark);margin-bottom:14px}.eyebrow::before,.kicker::before{content:"";width:26px;height:2px;background:currentColor}.section-dark .eyebrow,.section-dark .kicker{color:var(--brass)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:14px 20px;border-radius:6px;font-weight:800;text-transform:uppercase;font-size:.86rem;letter-spacing:0;transition:transform .2s ease,background .2s ease,border-color .2s ease,color .2s ease}.btn:hover{transform:translateY(-2px)}.btn-primary,.btn-accent,.btn-dark{background:var(--ink);color:#fff;border:1px solid var(--ink)}.section-dark .btn-primary,.lead-hero .btn-primary{background:var(--brass);border-color:var(--brass);color:#fff}.btn-primary:hover,.btn-accent:hover,.btn-dark:hover{background:var(--brass-dark);border-color:var(--brass-dark);color:#fff}.btn-secondary,.btn-ghost,.btn-light{background:rgba(255,255,255,.82);border:1px solid var(--line);color:var(--ink)}.btn-secondary:hover,.btn-ghost:hover,.btn-light:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.site-nav,.nav{position:fixed;top:0;left:0;right:0;z-index:50;min-height:72px;padding:12px var(--pad);display:flex;align-items:center;justify-content:space-between;background:rgba(244,245,247,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.site-nav.scrolled,.nav.scrolled,.nav.transparent.scrolled{box-shadow:0 8px 24px rgba(26,26,26,.08)}.brand{display:flex;align-items:center;gap:10px;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:uppercase;font-size:1.05rem;color:var(--ink);letter-spacing:0}.brand img{width:64px;height:64px;object-fit:contain;background:transparent;border:0;border-radius:6px;padding:0}.brand-text{display:flex;flex-direction:column}.brand-tag{display:none}.nav-links,.links,.nav-actions{display:none}.menu-btn{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--ink);border-radius:6px;background:transparent}.menu-btn span{display:block;width:20px;height:2px;background:var(--ink);margin:2px 0}.menu-btn svg{width:22px;height:22px}.mobile-menu{position:fixed;inset:0;z-index:80;display:none;flex-direction:column;gap:18px;padding:88px 24px 40px;background:var(--ink);color:#fff}.mobile-menu.open{display:flex}.mobile-menu .close{position:absolute;top:18px;right:20px;width:46px;height:46px;border:1px solid var(--dark-line);border-radius:6px;color:#fff;font-size:1.8rem}.mobile-menu a{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:uppercase;font-size:2rem;line-height:1;color:#fff}.mobile-menu .btn{font-family:Inter,sans-serif;font-size:.9rem;color:#fff;background:var(--brass);margin-top:8px}
.lead-hero{position:relative;min-height:680px;display:flex;align-items:flex-end;padding:130px 0 42px;background:var(--ink);color:#fff;overflow:hidden}.hero-media{position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,26,26,.38),rgba(26,26,26,.92)),url('../MB%20Design%20and%20Build%20Website%20Images/new%20project%20photos%201.jpeg') center/cover no-repeat}.hero-media.commercial{background:linear-gradient(180deg,rgba(26,26,26,.32),rgba(26,26,26,.92)),url('../MB%20Design%20and%20Build%20Website%20Images/IMG_0024.jpg') center/cover no-repeat}.hero-inner{position:relative;z-index:1}.lead-hero h1{color:#fff}.hero-sub{color:rgba(255,255,255,.82);font-size:1.08rem;margin-top:18px;max-width:36rem}.hero-actions{display:grid;gap:10px;margin-top:26px}.hero-proof{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.hero-proof span{padding:8px 10px;border:1px solid var(--dark-line);border-radius:6px;background:rgba(255,255,255,.08);font-size:.78rem;font-weight:800;color:rgba(255,255,255,.9)}.hero,.page-hero{padding:122px 0 50px;background:var(--paper-2);border-bottom:1px solid var(--line)}.page-hero.compact{padding-top:120px}.hero h1,.page-hero h1{font-size:2.8rem}.lead{margin-top:18px;max-width:42rem;font-size:1.08rem}.contact-hero{background:var(--ink);color:#fff}.contact-hero h1{color:#fff}.contact-hero .lead{color:rgba(255,255,255,.78)}
.conversion-strip{background:var(--coal);color:#fff;padding:10px 0}.strip-grid{display:grid;gap:8px}.strip-grid a{display:block;padding:16px;border:1px solid var(--dark-line);border-radius:8px;background:rgba(255,255,255,.05)}.strip-grid strong{display:block;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:uppercase;font-size:1.25rem;color:#fff}.strip-grid span{display:block;color:rgba(255,255,255,.72);font-size:.9rem;margin-top:2px}.split{display:grid;gap:28px}.align-start{align-items:start}.copy-stack{display:grid;gap:16px}.section-head{margin-bottom:28px}.row-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}.text-link{font-weight:800;color:var(--brass-dark);text-transform:uppercase}.service-cards{display:grid;gap:12px}.service-card,.card-tile{display:block;background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;box-shadow:none}.service-card.featured{background:var(--ink);color:#fff}.service-card.featured h3,.service-card.featured p{color:#fff}.service-card span{display:inline-block;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--brass-dark);font-size:1.25rem;margin-bottom:16px}.service-card.featured span{color:var(--brass)}.service-card p{margin-top:10px}.service-card em{display:inline-block;margin-top:18px;font-style:normal;font-weight:800;color:var(--brass-dark);text-transform:uppercase}.service-card:hover{border-color:var(--brass);box-shadow:var(--shadow)}.tight{gap:10px}.proof-list,.timeline{display:grid;gap:12px}.proof-list div,.timeline div{padding:18px;border:1px solid var(--dark-line);border-radius:8px;background:rgba(255,255,255,.05)}.proof-list strong,.timeline strong{display:block;color:#fff;font-size:1rem}.proof-list span,.timeline span{display:block;color:rgba(255,255,255,.72);font-size:.94rem;margin-top:6px}.light-list div{border-color:var(--line);background:#fff}.light-list strong{color:var(--ink)}.light-list span{color:var(--muted)}.proof-section .btn{margin-top:22px}
.project-grid{display:grid;gap:12px}.project-card{position:relative;display:block;min-height:220px;border-radius:8px;overflow:hidden;background:#111;border:1px solid var(--line)}.project-card img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.project-card span{position:absolute;left:14px;right:14px;bottom:14px;color:#fff;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:uppercase;font-size:1.35rem;line-height:1;padding-top:80px;text-shadow:0 2px 18px rgba(0,0,0,.55)}.project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.82))}.project-card span{z-index:1}.project-card.large{min-height:280px}
.quote{display:grid;gap:14px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;color:var(--ink);box-shadow:var(--shadow)}.quote h3{font-size:1.55rem}.quote label{display:grid;gap:6px;font-size:.82rem;font-weight:800;color:var(--muted);text-transform:uppercase}.quote input,.quote select,.quote textarea{width:100%;border:1px solid var(--line);border-radius:6px;background:var(--paper);padding:14px;color:var(--ink)}.quote textarea{min-height:120px;resize:vertical}.quote input:focus,.quote select:focus,.quote textarea:focus{outline:0;border-color:var(--brass);background:#fff}.quote .row2{display:grid;gap:12px}.quote .note{font-size:.86rem}.quote .note a{color:var(--brass-dark);font-weight:800}.compact-form{box-shadow:none}.contact-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.contact-pills a{padding:10px 12px;border:1px solid var(--dark-line);border-radius:6px;background:rgba(255,255,255,.08);color:#fff;font-weight:800}.faq-list{display:grid;gap:10px}.faq-item{border:1px solid var(--line);border-radius:8px;background:#fff;overflow:hidden}.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;text-align:left;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:uppercase;font-size:1.2rem;color:var(--ink)}.faq-q span,.faq-q .plus{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line);border-radius:6px;color:var(--brass-dark);transition:transform .2s ease}.faq-a{max-height:0;overflow:hidden;transition:max-height .24s ease}.faq-a p,.faq-a div{padding:0 18px 18px;color:var(--muted)}.faq-item.open .faq-a{max-height:240px}.faq-item.open .faq-q span,.faq-item.open .plus{transform:rotate(45deg);background:var(--brass);color:#fff}.svc-grid{display:grid;gap:12px}.svc,.proj,.t-card,.step{background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px}.svc h3,.step h3{font-size:1.35rem}.svc .num,.step .n,.stats .n{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--brass-dark)}.svc .more{display:inline-block;margin-top:14px;color:var(--brass-dark);font-weight:800;text-transform:uppercase}.grid-2{display:grid;gap:24px}.imgwrap{border-radius:8px;overflow:hidden;border:1px solid var(--line);background:#111}.imgwrap img{width:100%;height:100%;object-fit:cover}.imgwrap .badge{padding:12px;background:#fff;color:var(--ink);font-weight:800}.checklist{list-style:none;display:grid;gap:10px;margin-top:20px}.checklist li{display:flex;gap:10px}.area-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.area-list span{padding:8px 12px;border:1px solid var(--line);border-radius:6px;background:#fff;font-weight:700}.map-wrap{display:none}.trust{background:var(--ink);color:#fff;padding:18px 0}.trust .row{display:flex;flex-wrap:wrap;gap:10px}.trust span{padding:8px 10px;border:1px solid var(--dark-line);border-radius:6px}.fab{display:none}
footer{background:#161616;color:rgba(255,255,255,.72);padding:54px 0 92px}.footer-grid{display:grid;gap:28px}.footer-brand{display:flex;align-items:center;gap:12px;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:uppercase;font-size:1.3rem;color:#fff}.footer-brand img{width:58px;height:58px;background:transparent;border-radius:8px;padding:0}.footer-grid h4{color:var(--brass);text-transform:uppercase;font-size:.85rem;margin-bottom:12px}.footer-grid a,.footer-grid span{display:block;color:rgba(255,255,255,.74);padding:5px 0}.footer-grid a:hover{color:var(--brass)}.footer-grid p{color:rgba(255,255,255,.68);margin-top:14px}.footer-bottom{display:grid;gap:6px;margin-top:34px;padding-top:18px;border-top:1px solid var(--dark-line);font-size:.82rem;color:rgba(255,255,255,.55)}.mobile-leadbar{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-template-columns:1fr 1.2fr;gap:8px;padding:10px;background:rgba(244,245,247,.96);border-top:1px solid var(--line);backdrop-filter:blur(12px)}.mobile-leadbar a{display:grid;place-items:center;min-height:48px;border:1px solid var(--ink);border-radius:6px;font-weight:900;text-transform:uppercase;color:var(--ink)}.mobile-leadbar a.primary{background:var(--ink);color:#fff}.reveal{opacity:1;transform:none}
@media (min-width:700px){:root{--pad:28px}body{padding-bottom:0}section,.section{padding:82px 0}h1{font-size:4.6rem}h2{font-size:3.35rem}.lead-hero{min-height:760px;padding-bottom:78px}.hero-sub{font-size:1.2rem}.hero-actions{display:flex;flex-wrap:wrap}.hero-proof span{font-size:.84rem}.strip-grid{grid-template-columns:repeat(3,1fr)}.split,.grid-2{grid-template-columns:1fr 1fr;align-items:center}.reverse-mobile>div:first-child{order:0}.service-cards{grid-template-columns:repeat(2,1fr)}.project-grid.compact{grid-template-columns:2fr 1fr 1fr}.project-card.large{grid-row:span 2;min-height:440px}.quote .row2{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.5fr 1fr 1fr 1fr}.footer-bottom{grid-template-columns:1fr 1fr}.mobile-leadbar{display:none}.map-wrap{display:block}.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}.reveal.in{opacity:1;transform:none}}
@media (min-width:1000px){:root{--pad:40px}.site-nav,.nav{padding-inline:40px;min-height:82px}.brand img{width:80px;height:80px}.brand span{display:inline}.nav-links,.links{display:flex;align-items:center;gap:24px;font-weight:800;text-transform:uppercase;font-size:.84rem}.nav-links a,.links a{color:var(--muted)}.nav-links a:hover,.nav-links a.active,.links a:hover,.links a.active{color:var(--ink)}.nav-cta,.links .cta{padding:12px 16px;border-radius:6px;background:var(--ink);color:#fff!important}.menu-btn{display:none}.mobile-menu.open{display:none}.lead-hero h1{font-size:5.7rem}.page-hero h1{font-size:4.7rem}.service-cards{grid-template-columns:repeat(4,1fr)}.service-cards.tight{grid-template-columns:repeat(2,1fr)}.svc-grid{grid-template-columns:repeat(3,1fr)}.project-grid{grid-template-columns:repeat(3,1fr)}footer{padding-bottom:34px}}
@media (max-width:380px){h1{font-size:2.62rem}h2{font-size:2.05rem}.brand span{display:none}.lead-hero{min-height:650px}.service-card,.quote{padding:18px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.reveal{opacity:1;transform:none}}


/* ===== v5 PRE-LAUNCH POLISH PASS ===== */
/* Premium typography (Fraunces serif + Inter), softens previous Anton stack.
   Loaded after the v4 minified bundle so values cascade-override cleanly. */
:root{--accent:var(--brass);--mute:var(--muted);--brand:var(--brass);--brand-dark:var(--brass-dark)}

/* --- Headings: Inter sans, heavy weight, tight letter-spacing (Spray Vision-inspired) --- */
h1,h2,h3,h4{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:none;letter-spacing:-.02em;color:var(--ink)}
h1{font-size:clamp(2.4rem,6.4vw,3.4rem);line-height:1.1;max-width:20ch;font-weight:900}
h2{font-size:clamp(1.95rem,4.8vw,2.55rem);line-height:1.15;max-width:22ch;font-weight:800}
h3{font-weight:700;font-size:1.18rem;line-height:1.3;letter-spacing:-.01em;color:var(--ink)}
h4{font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.78rem;color:var(--brass)}
.lead-hero h1{font-weight:900;letter-spacing:-.025em;max-width:22ch}
.lead-hero h2,.section-dark h2{color:#fff}
.page-hero h1{font-size:clamp(2.2rem,5.6vw,3rem);line-height:1.1;max-width:22ch;font-weight:900}
p{line-height:1.62}
.hero-sub,.lead{line-height:1.55;color:rgba(255,255,255,.86)}
.section-light .lead,.page-hero .lead{color:var(--muted)}

/* --- Eyebrow / kicker: refined uppercase --- */
.eyebrow,.kicker{font-family:'Inter',sans-serif;font-weight:700;font-size:.74rem;letter-spacing:.18em;color:var(--brass-dark)}
.section-dark .eyebrow,.section-dark .kicker{color:var(--brass)}

/* --- Buttons: lighter, tighter, more clickable on mobile --- */
.btn{font-family:'Inter',sans-serif;font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;border-radius:6px;padding:15px 22px;min-height:52px}
.btn-dark,.btn-primary{background:var(--ink);color:#fff;border:1px solid var(--ink)}
.btn-dark:hover,.btn-primary:hover{background:var(--brass-dark);border-color:var(--brass-dark);color:#fff}
.btn-ghost,.btn-light,.btn-secondary{background:transparent;border:1px solid var(--ink);color:var(--ink)}
.btn-ghost:hover,.btn-light:hover,.btn-secondary:hover{background:var(--ink);color:#fff}
.section-dark .btn-ghost,.section-dark .btn-light,.section-dark .btn-secondary,.lead-hero .btn-secondary,.contact-hero .btn-secondary{border-color:rgba(255,255,255,.6);color:#fff;background:rgba(255,255,255,.08)}
.section-dark .btn-ghost:hover,.section-dark .btn-light:hover,.section-dark .btn-secondary:hover,.lead-hero .btn-secondary:hover{background:#fff;color:var(--ink);border-color:#fff}

/* --- Brand wordmark: Fraunces, mixed case, refined --- */
.brand,.footer-brand{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:none;font-weight:500;letter-spacing:-.01em;font-size:1.12rem}
.brand img,.footer-brand img{border-radius:6px}

/* --- Mobile menu items: less shouty --- */
.mobile-menu a{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:none;font-size:1.7rem;font-weight:700;letter-spacing:-.015em}

/* --- Hero polish: refined gradient on Knightcott photo --- */
.lead-hero{min-height:640px}
.hero-media{background:linear-gradient(180deg,rgba(26,26,26,.18) 0%,rgba(26,26,26,.55) 55%,rgba(26,26,26,.92) 100%),url('../MB%20Design%20and%20Build%20Website%20Images/new%20project%20photos%201.jpeg') center/cover no-repeat}
.hero-media.commercial{background:linear-gradient(180deg,rgba(26,26,26,.22) 0%,rgba(26,26,26,.6) 55%,rgba(26,26,26,.92) 100%),url('../MB%20Design%20and%20Build%20Website%20Images/IMG_0024.jpg') center/cover no-repeat}
.hero-proof span{font-weight:600;letter-spacing:.04em;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18)}

/* --- LEGACY-STYLE PAGES: missing classes, now defined --- */
.crumb{display:inline-flex;flex-wrap:wrap;gap:6px;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
.crumb a{color:var(--brass-dark);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.crumb a:hover{border-color:var(--brass-dark)}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.actions .btn{flex:0 0 auto}
.arr{display:inline-block;margin-left:6px;transition:transform .2s ease}
.btn:hover .arr,a:hover .arr{transform:translateX(4px)}

/* Footer (legacy) */
.grid-f{display:grid;gap:30px;grid-template-columns:1fr;padding:0}
.brand-f{display:flex;align-items:center;gap:12px;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:none;font-size:1.2rem;font-weight:500;color:#fff;margin-bottom:16px}
.brand-f img{width:54px;height:54px;background:transparent;padding:0;border-radius:8px;object-fit:contain}
.grid-f h4{color:var(--brass);font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin:0 0 14px}
.grid-f a,.grid-f span{display:block;color:rgba(255,255,255,.74);padding:5px 0;font-size:.92rem;line-height:1.5;text-decoration:none;transition:color .2s}
.grid-f a:hover{color:var(--brass)}
.copy{display:grid;gap:8px;margin-top:36px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);font-size:.8rem;color:rgba(255,255,255,.55)}
.copy span{color:rgba(255,255,255,.5)}
footer{padding-bottom:108px}

/* CTA banner */
.cta-banner{background:var(--ink);color:#fff;padding:72px 0;text-align:center}
.cta-banner h2{color:#fff;margin-inline:auto}
.cta-banner p{color:rgba(255,255,255,.78);margin:14px auto 0;max-width:50ch;font-size:1.02rem}
.cta-banner .actions{justify-content:center;margin-top:34px}
.cta-banner .eyebrow{color:var(--brass)!important}

/* Stats */
.stats{display:grid;gap:24px;grid-template-columns:1fr;margin-top:30px}
.stats > div{padding:24px;border:1px solid var(--line);background:#fff;border-radius:8px;text-align:left}
.stats .n{display:block;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-size:2.6rem;font-weight:700;color:var(--brass-dark);letter-spacing:-.02em;line-height:1}
.stats .l{display:block;margin-top:8px;font-size:.86rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

/* Process steps */
.steps{display:grid;gap:18px;margin-top:40px}
.step{padding:28px;border:1px solid var(--line);background:#fff;border-radius:8px}
.step .n{display:inline-block;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--brass-dark);font-size:1.4rem;font-weight:400;letter-spacing:-.01em;margin-bottom:12px}
.step h3{margin-bottom:10px}

/* Inline-styled .grid (process.html, about.html) */
.grid{display:grid;gap:20px}

/* Projects grid (legacy projects.html) */
.proj-grid{display:grid;gap:14px;grid-template-columns:1fr}
.proj{position:relative;display:block;border-radius:8px;overflow:hidden;background:#111;border:1px solid var(--line);min-height:260px;color:#fff;text-decoration:none}
.proj img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .6s ease}
.proj:hover img{transform:scale(1.04)}
.proj::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.78))}
.proj .caption{position:absolute;left:18px;right:18px;bottom:18px;display:flex;align-items:flex-end;justify-content:space-between;gap:14px;z-index:1}
.proj .caption .s{font-size:.74rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.proj .caption .t{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-size:1.25rem;font-weight:400;line-height:1.15;color:#fff;margin-top:6px;letter-spacing:-.01em}
.proj .tag{flex:0 0 auto;padding:5px 10px;border:1px solid rgba(255,255,255,.4);border-radius:999px;font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.25);backdrop-filter:blur(6px)}

/* Lead copy */
.lead-copy{font-size:1.05rem;line-height:1.6;color:var(--text)}

/* FAQ block */
.faq-block{padding:60px 0;background:var(--paper)}

/* Page hero refinement */
.page-hero{padding-top:118px}
.page-hero .lead{font-size:1.08rem;margin-top:18px;max-width:54ch;color:var(--muted)}
.page-hero em{font-style:italic;color:var(--ink);font-weight:500}

/* Image polish, every image responsive + lazy + fade in */
img{max-width:100%;height:auto;display:block}
.imgwrap{position:relative;border-radius:10px;overflow:hidden;background:#0e1210;aspect-ratio:4/3}
.imgwrap img{width:100%;height:100%;object-fit:cover}
.imgwrap .badge{position:absolute;left:14px;bottom:14px;padding:8px 12px;background:rgba(255,255,255,.94);color:var(--ink);font-size:.78rem;font-weight:600;letter-spacing:.04em;border-radius:6px;backdrop-filter:blur(6px)}
.imgwrap .badge em{font-style:normal;font-weight:400;color:var(--muted)}

/* Service-card numbers as serif accents */
.service-card span{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:700;font-size:1.5rem;letter-spacing:-.01em}
.svc .num{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:700;font-size:1.5rem}
.svc h3{margin-top:6px;font-size:1.15rem}
.svc p{margin-top:10px;font-size:.95rem;line-height:1.55}

/* Project card label - softer */
.project-card span{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:400;text-transform:none;font-size:1.4rem;letter-spacing:-.01em;line-height:1.1}

/* FAQ refinement */
.faq-q{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:none;font-weight:400;font-size:1.08rem;letter-spacing:-.005em}

/* Strip-grid label refinement */
.strip-grid strong{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;text-transform:none;font-weight:400;font-size:1.15rem;letter-spacing:-.005em}

/* Hero proof spans, softer */
.hero-proof span{text-transform:uppercase}

/* Section heading hierarchy */
.section-head h2{margin-top:8px}

/* Conversion strip nicer spacing on mobile */
.conversion-strip{padding:14px 0}

/* Form input focus */
.quote input,.quote select,.quote textarea{font-size:1rem;line-height:1.4}
.quote input:focus,.quote select:focus,.quote textarea:focus{outline:0;border-color:var(--brass);box-shadow:0 0 0 3px rgba(90,15,31,.15)}

/* Floating action button (legacy), restore on small screens */
.fab{position:fixed;right:14px;bottom:78px;display:flex;flex-direction:column;gap:10px;z-index:60}
.fab a{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:var(--ink);color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.25);transition:transform .2s,background .2s}
.fab a:hover{transform:translateY(-2px);background:var(--brass-dark)}
.fab a.wa{background:#25D366}
.fab a.wa:hover{background:#1ebe5a}

/* --- MOBILE, nav + safety --- */
body{overflow-x:hidden;-webkit-text-size-adjust:100%}
img,svg,video,canvas{max-width:100%}
section,.section{overflow-x:clip}
.brand span{display:inline-block!important;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:500;font-size:1.05rem;letter-spacing:-.005em}
@media (max-width:380px){.brand span{font-size:.95rem}.btn{padding:13px 16px;font-size:.78rem;min-height:48px}h1{font-size:2.4rem}}
@media (max-width:480px){.hero-media{background-position:center 30%}.lead-hero{min-height:580px;padding:118px 0 36px}.hero-actions .btn{width:100%}.hero-actions{display:grid;gap:10px}}

/* --- TABLET+ refinements --- */
@media (min-width:700px){
  h1{font-size:clamp(3rem,5.4vw,4.4rem);max-width:18ch}
  h2{font-size:clamp(2.3rem,3.8vw,3.1rem)}
  .lead-hero{min-height:760px}
  .lead-hero h1{font-size:clamp(3.4rem,6vw,5.2rem)}
  .page-hero h1{font-size:clamp(2.6rem,4.8vw,3.8rem)}
  .grid-f{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:42px}
  .copy{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}
  .stats{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(4,1fr)}
  .proj-grid{grid-template-columns:repeat(6,1fr);grid-auto-flow:dense}
  .proj.wide{grid-column:span 4}
  .proj.tall{grid-column:span 2;grid-row:span 2;min-height:540px}
  .proj.half{grid-column:span 3}
  .proj.third{grid-column:span 2}
  .actions{margin-top:32px}
  .conversion-strip{padding:16px 0}
  footer{padding-bottom:54px}
  .fab{display:flex}
}

/* --- DESKTOP --- */
@media (min-width:1000px){
  .lead-hero{min-height:800px}
  .lead-hero h1{font-size:clamp(4rem,5.4vw,5.6rem)}
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap}
  .grid-f{grid-template-columns:1.5fr 1fr 1fr 1fr;gap:60px;padding:0}
  .nav-links a,.links a{font-size:.82rem;letter-spacing:.06em;font-weight:600;text-transform:uppercase}
  .nav-cta,.links .cta{padding:11px 16px;font-size:.78rem;letter-spacing:.08em}
  .service-card{padding:28px}
  .container{--max:1200px}
}

/* --- Reduced motion safety --- */
@media (prefers-reduced-motion:reduce){.proj img,.btn:hover .arr,a:hover .arr{transform:none!important}.proj:hover img{transform:none!important}}

/* --- Print/SEO friendly: ensure no invisible text --- */
.reveal{opacity:1!important;transform:none!important}
@media (min-width:700px){.reveal{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}.reveal.in{opacity:1;transform:none}}

/* --- Cookie banner sits above mobile leadbar --- */
/* (cookie banner position handled by cookies.css v6.5+) */

/* Tables in legal pages, responsive */
table{width:100%;border-collapse:collapse;font-size:.92rem;margin:14px 0 24px;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
table thead th{background:var(--paper-2);text-align:left;padding:12px 14px;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--line)}
table tbody td{padding:14px;border-bottom:1px solid var(--line);color:var(--text);vertical-align:top}
table tbody tr:last-child td{border-bottom:0}

/* Legal page typography */
main h2:not(.cta-banner h2){margin-top:32px}
main h3{margin-top:24px;margin-bottom:8px}
main p+p{margin-top:12px}

/* ===== v5.1 MOBILE HERO POLISH ===== */
/* 1) Darker hero overlay so white headline text reads cleanly on the photo */
.hero-media{background:linear-gradient(180deg,rgba(20,20,20,.55) 0%,rgba(20,20,20,.78) 55%,rgba(20,20,20,.96) 100%),url('../MB%20Design%20and%20Build%20Website%20Images/new%20project%20photos%201.jpeg') center/cover no-repeat}
.hero-media.commercial{background:linear-gradient(180deg,rgba(20,20,20,.55) 0%,rgba(20,20,20,.78) 55%,rgba(20,20,20,.96) 100%),url('../MB%20Design%20and%20Build%20Website%20Images/IMG_0024.jpg') center/cover no-repeat}
.lead-hero{background:#141414}
.lead-hero h1,.lead-hero .hero-sub,.lead-hero .kicker{text-shadow:0 2px 24px rgba(0,0,0,.45)}

/* 2) Mobile menu button: ensure it sits above everything and child spans don't swallow taps */
.menu-btn{position:relative;z-index:60}
.menu-btn span,.menu-btn svg{pointer-events:none}
.mobile-menu{z-index:90}

/* 3) Declutter the hero on mobile, hide conversion strip + tighten the proof row */
@media (max-width:699px){
  .conversion-strip{display:none}
  .hero-proof{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px;justify-content:flex-start}
  .hero-proof span{font-size:.66rem;font-weight:600;letter-spacing:.06em;padding:6px 9px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:999px;color:rgba(255,255,255,.82)}
  .lead-hero{min-height:auto;padding:120px 0 44px}
  .hero-actions{margin-top:22px}
}

/* 4) Tablet+, keep everything but make sure the strip looks intentional */
@media (min-width:700px){
  .conversion-strip{display:block}
  .hero-proof{margin-top:26px}
}

/* ===== v5.2 HERO KICKER + GUARDS ===== */
/* White kicker on dark hero, was orange, hard to read against the photo */
.lead-hero .kicker,
.contact-hero .kicker{color:#fff;font-weight:700;letter-spacing:.18em;opacity:.92}
.lead-hero .kicker::before,
.contact-hero .kicker::before{background:rgba(255,255,255,.55)}

/* Make sur

/* ===== v6.1, Burgundy keyword highlight in hero headings ===== */
/* Single burgundy across the whole site, light or dark backgrounds. */
.hl{color:var(--brass);font-weight:inherit}


/* ===== v6.2, Burgundy top nav with white menu (May 2026) ===== */
/* Nav bar background = brand burgundy */
.site-nav,.nav{
  background:var(--brass);
  border-bottom:1px solid rgba(255,255,255,.10);
  backdrop-filter:none;
}
.site-nav.scrolled,.nav.scrolled,.nav.transparent.scrolled{
  background:var(--brass-dark);
  box-shadow:0 8px 24px rgba(26,26,26,.18);
}

/* Brand wordmark, white on burgundy */
.brand{color:#fff}
.brand span{color:#fff}
.brand img{width:46px;height:46px;object-fit:contain;background:transparent;border:0;padding:0}

/* Desktop nav links, white, with subtle dim default + full white on hover/active */
.nav-links a,.links a{color:rgba(255,255,255,.82);font-weight:600}
.nav-links a:hover,.nav-links a.active,
.links a:hover,.links a.active{color:#fff}

/* Primary "Get quote" CTA in nav, invert: white pill, burgundy text */
.nav-cta,.links .cta{
  background:#fff!important;
  color:var(--brass)!important;
  border:1px solid #fff;
}
.nav-cta:hover,.links .cta:hover{
  background:var(--brass-dark)!important;
  color:#fff!important;
  border-color:var(--brass-dark);
}

/* Mobile menu button, white outline + bars */
.menu-btn{border:1px solid rgba(255,255,255,.65);background:transparent}
.menu-btn span{background:#fff}

/* Mobile slide-in menu, deeper burgundy so the open state reads as the same brand */
.mobile-menu{background:var(--brass-dark)}
.mobile-menu .close{border-color:rgba(255,255,255,.4);color:#fff}
.mobile-menu a{color:#fff}
.mobile-menu .btn{background:#fff;color:var(--brass)}


/* ===== v6.4, Slimmer nav, larger logo (May 2026) ===== */
/* Logo dominates a tighter nav strip; minimal vertical padding. */
.site-nav,.nav{min-height:72px;padding-top:4px;padding-bottom:4px}
.brand img{width:92px;height:68px}
@media (min-width:1000px){
  .site-nav,.nav{min-height:92px;padding-top:4px;padding-bottom:4px}
  .brand img{width:108px;height:80px}
}


/* ===== v6.5, WhatsApp floating button (May 2026) ===== */
/* Replaces the old .mobile-leadbar Call/Get Quote sticky bar. */
.mobile-leadbar{display:none!important}
.fab{display:none!important}
body{padding-bottom:0!important}

.wa-fab{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:90;
  width:60px;
  height:60px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--brass);
  box-shadow:0 10px 24px rgba(90,15,31,.45),0 2px 6px rgba(0,0,0,.18);
  transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
}
.wa-fab svg{width:32px;height:32px;display:block}
.wa-fab:hover,.wa-fab:focus-visible{
  transform:translateY(-2px);
  background:var(--brass-dark);
  box-shadow:0 14px 30px rgba(90,15,31,.55),0 2px 6px rgba(0,0,0,.22);
}
.wa-fab:active{transform:translateY(0)}

/* (cookie banner position handled in cookies.css; no override needed here) */
@media (min-width:700px){
  .wa-fab{width:68px;height:68px;right:28px;bottom:28px}
  .wa-fab svg{width:36px;height:36px}
}


/* ===== v6.6, Cleaner desktop gallery layout (May 2026) ===== */
/* Mobile (single col) and tablet (2 col) keep the existing block sizing.
   Desktop switches to a 3-col magazine grid with consistent aspect ratios
   and proper feature spans, packing densely so there are no gaps. */

@media (min-width:700px){
  .proj-grid{
    grid-template-columns:repeat(2,1fr);
    grid-auto-flow:dense;
    gap:16px;
  }
  .proj{aspect-ratio:4/3;min-height:0;height:auto}
  .proj.wide{grid-column:span 2;aspect-ratio:16/8}
  .proj.tall{grid-column:span 1;grid-row:span 2;aspect-ratio:3/4}
  .proj.half{grid-column:span 1;aspect-ratio:4/3}
  .proj.third{grid-column:span 1;aspect-ratio:4/3}
}

@media (min-width:1000px){
  .proj-grid{
    grid-template-columns:repeat(3,1fr);
    gap:20px;
  }
  /* Reset all to default 1-col tile, then re-apply features for rhythm. */
  .proj{aspect-ratio:4/3}
  .proj.wide{grid-column:span 2;grid-row:span 1;aspect-ratio:16/9}
  .proj.tall{grid-column:span 1;grid-row:span 2;aspect-ratio:3/5}
  .proj.half{grid-column:span 1;grid-row:span 1;aspect-ratio:4/3}
  .proj.third{grid-column:span 1;grid-row:span 1;aspect-ratio:4/3}
}

/* Refined hover, image zooms, caption lifts, border picks up burgundy */
.proj{transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}
.proj:hover{border-color:var(--brass);box-shadow:0 14px 36px rgba(26,26,26,.18);transform:translateY(-2px)}
.proj img{transition:transform .8s cubic-bezier(.25,.1,.25,1)}
.proj:hover img{transform:scale(1.06)}

/* Slightly stronger caption gradient so the text reads cleanly on any photo */
.proj::after{background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.45) 70%,rgba(0,0,0,.85) 100%)}
.proj .caption{padding:4px 0}
.proj .caption .t{font-weight:700;letter-spacing:-.01em}
.proj .tag{background:rgba(90,15,31,.85);border-color:rgba(255,255,255,.18);font-weight:700;letter-spacing:.1em}


/* ===== v6.7, Polished hamburger button (May 2026) ===== */
/* Drops the visible box border on burgundy nav; cleaner white lines.
   Lines slightly thicker with rounded caps. Subtle hover lift.
   Animates into an X when the mobile menu is open. */
.menu-btn{
  width:48px;
  height:48px;
  border:0;
  border-radius:10px;
  background:transparent;
  display:grid;
  place-items:center;
  gap:5px;
  grid-template-rows:auto auto auto;
  transition:background .2s ease,transform .15s ease;
}
.menu-btn:hover{background:rgba(255,255,255,.12)}
.menu-btn:active{transform:scale(.94)}

.menu-btn span{
  display:block;
  width:24px;
  height:2.5px;
  background:#fff;
  border-radius:2px;
  margin:0;
  transition:transform .25s ease,opacity .2s ease,background .2s ease;
  transform-origin:center;
}

/* Slight asymmetry — middle line a touch shorter, makes it feel intentional */
.menu-btn span:nth-child(2){width:18px;justify-self:end}

/* When the mobile menu is open, morph the lines into an X */
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg);width:24px}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(0)}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);width:24px}

/* Close (×) button in the open mobile menu — round it off to match */
.mobile-menu .close{
  width:48px;
  height:48px;
  border-radius:10px;
  border:0;
  background:rgba(255,255,255,.10);
  transition:background .2s ease,transform .15s ease;
}
.mobile-menu .close:hover{background:rgba(255,255,255,.20)}
.mobile-menu .close:active{transform:scale(.94)}


/* ===== v6.8, Refined full-screen mobile menu drawer (May 2026) ===== */
.mobile-menu{
  background:var(--brass-dark);
  background-image:radial-gradient(circle at 110% -20%,rgba(255,255,255,.10),transparent 55%),radial-gradient(circle at -20% 120%,rgba(0,0,0,.30),transparent 60%);
  padding:96px 28px 40px;
  gap:0;
  overflow-y:auto;
}

/* "Menu" eyebrow at the top */
.mobile-menu::before{
  content:"Menu";
  position:absolute;
  top:34px;
  left:28px;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:rgba(255,255,255,.55);
  pointer-events:none;
}

/* Refined close button — circular, soft white-translucent, hover lifts */
.mobile-menu .close{
  position:absolute;
  top:24px;
  right:24px;
  width:44px;
  height:44px;
  border-radius:50%;
  border:0;
  background:rgba(255,255,255,.10);
  color:#fff;
  font-size:1.4rem;
  line-height:1;
  display:grid;
  place-items:center;
  transition:background .2s ease,transform .15s ease;
}
.mobile-menu .close:hover{background:rgba(255,255,255,.22)}
.mobile-menu .close:active{transform:scale(.92)}

/* Menu links — primary stack */
.mobile-menu a{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 4px;
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-size:1.85rem;
  font-weight:700;
  letter-spacing:-.015em;
  text-transform:none;
  line-height:1.1;
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.12);
  transition:padding-left .25s ease,color .2s ease,opacity .2s ease;
}
.mobile-menu a:hover,.mobile-menu a:focus-visible{padding-left:12px;outline:none}

/* Right-arrow indicator that slides on hover */
.mobile-menu a::after{
  content:"";
  width:24px;
  height:24px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 5l7 7-7 7'/%3E%3C/svg%3E") no-repeat center/contain;
  opacity:.45;
  transition:opacity .22s ease,transform .22s ease;
}
.mobile-menu a:hover::after,.mobile-menu a:focus-visible::after{opacity:1;transform:translateX(5px)}

/* "Get quote" — promote to a CTA pill (it's the 5th link in the stack) */
.mobile-menu a[href$="contact.html"]:not([href^="tel:"]){
  margin-top:18px;
  padding:18px 22px;
  background:#fff;
  color:var(--brass);
  border-radius:10px;
  border-bottom:0;
  font-weight:800;
  font-size:1.1rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-align:left;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.mobile-menu a[href$="contact.html"]:not([href^="tel:"])::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a0f1f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 5l7 7-7 7'/%3E%3C/svg%3E");
  opacity:1;
}
.mobile-menu a[href$="contact.html"]:not([href^="tel:"]):hover{
  background:#fff;
  color:var(--brass-dark);
  padding-left:22px;
  transform:translateY(-1px);
}

/* WhatsApp secondary contact link at the very bottom, small + iconified */
.mobile-menu a[href*="wa.me"]{
  margin-top:24px;
  padding:14px 4px;
  font-size:.95rem;
  font-weight:600;
  letter-spacing:.04em;
  color:rgba(255,255,255,.78);
  border-bottom:0;
  border-top:1px solid rgba(255,255,255,.15);
}
.mobile-menu a[href*="wa.me"]:hover{color:#fff;padding-left:8px}
.mobile-menu a[href*="wa.me"]::before{
  content:"WA";
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  margin-right:10px;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  font-size:.55rem;
  font-weight:800;
  letter-spacing:0;
  flex-shrink:0;
}
.mobile-menu a[href*="wa.me"]::after{display:none}

/* Slide-in animation for the drawer */
.mobile-menu.open{display:flex;animation:mmSlideIn .28s ease-out}
@keyframes mmSlideIn{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:none}
}


/* ===== v6.9, Clients + accreditations section on home (May 2026) ===== */
.clients-section{background:var(--paper-2)}
.clients-lead{max-width:60ch;color:var(--muted);font-size:1.02rem;margin-top:8px;margin-bottom:30px}

.clients-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px 14px;
  margin-bottom:36px;
}
.client-chip{
  position:relative;
  padding:14px 18px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:8px;
  font-weight:700;
  font-size:.95rem;
  color:var(--ink);
  letter-spacing:-.005em;
  text-align:left;
  transition:border-color .2s ease,transform .15s ease,box-shadow .2s ease;
}
.client-chip::before{
  content:"";
  position:absolute;
  left:0;
  top:14px;
  bottom:14px;
  width:3px;
  background:var(--brass);
  border-radius:0 2px 2px 0;
  opacity:.85;
}
.client-chip{padding-left:22px}
.client-chip:hover{border-color:var(--brass);transform:translateY(-1px);box-shadow:0 6px 18px rgba(26,26,26,.06)}

.accred-row{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  padding-top:30px;
  border-top:1px solid var(--line);
}
.accred{
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  padding:20px 22px;
}
.accred strong{
  display:block;
  font-size:1.02rem;
  font-weight:800;
  color:var(--brass);
  letter-spacing:-.005em;
  margin-bottom:6px;
}
.accred span{
  display:block;
  font-size:.93rem;
  color:var(--muted);
  line-height:1.55;
}

@media (min-width:700px){
  .clients-grid{grid-template-columns:repeat(3,1fr);gap:12px 16px}
  .accred-row{grid-template-columns:repeat(3,1fr);gap:18px}
}
@media (min-width:1000px){
  .clients-grid{grid-template-columns:repeat(5,1fr)}
}