@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600&display=swap');
/* ═══════════════════════════════════════════
1 · DMC DESIGN TOKENS
═══════════════════════════════════════════ */
.dmc-page, .dmc-hd, .dmc-ft{
--n-950:#000A33; /* deepest royal · footer depth, overlays */
--n-900:#000F47; /* dark section backgrounds */
--n-800:#00155D; /* THE brand navy */
--n-700:#082068; /* elevated surfaces on navy */
--n-600:#102A78; /* card gradient tops */
--sky-300:#D6E9FF;
--sky-400:#A8D0FF; /* accents ON DARK backgrounds */
--sky-500:#71B6FF; /* THE brand light blue · buttons */
--sky-600:#2273CE; /* accents/links ON LIGHT backgrounds */
--sky-700:#155693;
--ink:#071233; /* headings on light */
--ink-soft:#45557E; /* body on light */
--soft:#C2CEEC; /* body on navy */
--soft-2:#8FA0CB;
--line:rgba(113,182,255,.16);
--line-strong:rgba(113,182,255,.36);
--line-light:#E1E9F7;
--bg-light:#F3F7FD;
--grad-rise:linear-gradient(120deg,#2273CE 0%,#71B6FF 50%,#B9DBFF 100%);
--rad-lg:36px; --rad:28px; --rad-sm:16px;
--wrap:1400px;
--font-d:'Montserrat',sans-serif;
--font-b:'Plus Jakarta Sans',sans-serif;
}
/* ═══════════════════════════════════════════
2 · PAGE BASE
═══════════════════════════════════════════ */
.dmc-page{
font-family:var(--font-b); font-size:17px; line-height:1.75;
background:var(--n-900); color:var(--soft);
-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
overflow-x:hidden;
}
.dmc-page *, .dmc-page *::before, .dmc-page *::after{ box-sizing:border-box; margin:0; padding:0; }
.dmc-page img{ display:block; max-width:100%; height:auto; }
.dmc-page a{ text-decoration:none; color:inherit; }
.dmc-page ul{ list-style:none; }
.dmc-page button{ background:none; border:none; font:inherit; color:inherit; cursor:pointer; }
.dmc-page ::selection{ background:#71B6FF; color:#000A33; }
.dmc-page a:focus-visible, .dmc-page button:focus-visible{ outline:2px solid var(--sky-500); outline-offset:3px; border-radius:6px; }
.dmc-container{ max-width:var(--wrap); margin:0 auto; padding:0 48px; }
/* ═══════════════════════════════════════════
3 · TYPOGRAPHY
═══════════════════════════════════════════ */
.dmc-h1{ font-family:var(--font-d); font-weight:300; line-height:1.16; color:#fff;
font-size:clamp(2.15rem,3.6vw,3.8rem); text-transform:uppercase; letter-spacing:.05em; }
.dmc-h1__strong{ font-weight:700; color:var(--sky-400); }
.dmc-h2{ font-family:var(--font-d); font-weight:300; line-height:1.18; color:#fff;
font-size:clamp(2rem,3.3vw,3.15rem); }
.dmc-h3{ font-family:var(--font-d); font-weight:600; line-height:1.3; letter-spacing:.01em; color:#fff;
font-size:clamp(1.25rem,1.6vw,1.55rem); }
.dmc-em{ font-weight:500; color:var(--sky-400); }
/* heading accent. NEVER italic. */
.dmc-lead{ font-size:clamp(1.05rem,1.35vw,1.22rem); line-height:1.8; color:var(--soft); }
.dmc-lead strong, .dmc-page .dmc-dark p strong{ color:#EAF2FE; font-weight:600; }
.dmc-eyebrow{
display:inline-flex; align-items:flex-start; gap:11px;
font-family:var(--font-b); font-size:16px; font-weight:500; font-style:italic;
letter-spacing:.01em; color:var(--sky-400);
margin-bottom:22px; line-height:1.55;
}
.dmc-page img.dmc-eyebrow__ico{ height:26px; width:auto; flex:none; margin-top:-1px; }
/* LIGHT sections */
.dmc-page .dmc-light{ background:var(--bg-light); color:var(--ink-soft); }
.dmc-page .dmc-white{ background:#fff; color:var(--ink-soft); }
.dmc-page .dmc-light .dmc-h2, .dmc-page .dmc-white .dmc-h2,
.dmc-page .dmc-light .dmc-h3, .dmc-page .dmc-white .dmc-h3{ color:var(--ink); }
.dmc-page .dmc-light .dmc-em, .dmc-page .dmc-white .dmc-em{ color:var(--sky-600); }
.dmc-page .dmc-light .dmc-lead, .dmc-page .dmc-white .dmc-lead{ color:var(--ink-soft); }
.dmc-page .dmc-light p strong, .dmc-page .dmc-white p strong{ color:var(--ink); font-weight:600; }
.dmc-page .dmc-light .dmc-eyebrow, .dmc-page .dmc-white .dmc-eyebrow{ color:var(--sky-600); }
/* ═══════════════════════════════════════════
4 · BUTTONS + LINKS
HARD RULE: sky buttons ALWAYS carry deep navy text.
═══════════════════════════════════════════ */
.dmc-btn{
display:inline-flex; align-items:center; justify-content:center; gap:12px;
font-family:var(--font-d); font-size:15px; font-weight:600;
letter-spacing:.02em; text-align:center;
padding:17px 34px; border-radius:999px; border:1.5px solid transparent;
cursor:pointer; white-space:nowrap; max-width:100%;
transition:transform .35s cubic-bezier(.2,.7,.3,1),background .35s,border-color .35s,color .35s,box-shadow .35s;
}
.dmc-btn svg{ flex:none; transition:transform .35s cubic-bezier(.2,.7,.3,1); }
.dmc-btn:hover svg{ transform:translateX(5px); }
.dmc-page .dmc-btn--primary, .dmc-hd .dmc-btn--primary{ background:var(--sky-500); color:var(--n-950); }
.dmc-page .dmc-btn--primary:hover, .dmc-hd .dmc-btn--primary:hover{ background:var(--sky-400); color:var(--n-950); transform:translateY(-2px); box-shadow:0 18px 40px -12px rgba(113,182,255,.45); }
.dmc-page .dmc-btn--ghost{ border-color:rgba(255,255,255,.35); color:#fff; background:transparent; }
.dmc-page .dmc-btn--ghost:hover{ border-color:var(--sky-400); color:var(--sky-300); transform:translateY(-2px); }
.dmc-page .dmc-btn--ink{ background:var(--n-800); color:#fff; }
.dmc-page .dmc-btn--ink:hover{ background:var(--n-700); transform:translateY(-2px); box-shadow:0 18px 40px -14px rgba(0,21,93,.4); }
.dmc-page .dmc-arrow-link{
display:inline-flex; align-items:center; gap:10px;
font-family:var(--font-b); font-size:15.5px; font-weight:600;
letter-spacing:.01em; color:var(--sky-500); transition:color .3s; text-align:left;
}
.dmc-page .dmc-arrow-link svg{ flex:none; transition:transform .35s cubic-bezier(.2,.7,.3,1); }
.dmc-page .dmc-arrow-link:hover{ color:var(--sky-300); }
.dmc-page .dmc-arrow-link:hover svg{ transform:translateX(5px); }
.dmc-page .dmc-light .dmc-arrow-link, .dmc-page .dmc-white .dmc-arrow-link{ color:var(--sky-600); }
.dmc-page .dmc-light .dmc-arrow-link:hover, .dmc-page .dmc-white .dmc-arrow-link:hover{ color:var(--sky-700); }
/* ═══════════════════════════════════════════
5 · SCROLL REVEAL (class "dmc-reveal", stagger with style="--rd:.1s")
═══════════════════════════════════════════ */
.dmc-reveal{
opacity:0; transform:translateY(34px);
transition:opacity .9s cubic-bezier(.2,.65,.3,1),transform .9s cubic-bezier(.2,.65,.3,1);
transition-delay:var(--rd,0s);
}
.dmc-reveal.is-in{ opacity:1; transform:none; }
/* ═══════════════════════════════════════════
6 · SHARED SMALL COMPONENTS
═══════════════════════════════════════════ */
.dmc-checks li{
display:flex; gap:16px; align-items:flex-start; padding:15px 0;
border-top:1px solid var(--line-light);
font-size:15px; line-height:1.6; color:var(--ink-soft);
}
.dmc-checks li:last-child{ border-bottom:1px solid var(--line-light); }
.dmc-checks svg{ flex:none; margin-top:3px; }
.dmc-page .dmc-dark .dmc-checks li{ border-top-color:var(--line); color:var(--soft); }
.dmc-page .dmc-dark .dmc-checks li:last-child{ border-bottom-color:var(--line); }
.dmc-trust-item{
display:inline-flex; align-items:center; gap:10px;
font-family:var(--font-b); font-size:14px; font-weight:500;
letter-spacing:.01em; color:rgba(255,255,255,.92);
}
.dmc-trust-item svg{ flex:none; }
/* Overflow guards: stop long content blowing out grid columns */
.dmc-hero__inner > *, .dmc-intro__grid > *, .dmc-serv-row > *,
.dmc-consult__grid > *, .dmc-serve__grid > *, .dmc-ft__inner > *{ min-width:0; }
.dmc-page .dmc-consult__contact a, .dmc-ft__contact-item span{ overflow-wrap:anywhere; }
/* ═══════════════════════════════════════════════════════════════════════════
GLOBAL HEADER (.dmc-hd)
V1: lives inside this file. Later: its own Theme Builder header template.
═══════════════════════════════════════════════════════════════════════════ */
.dmc-hd{ position:relative; z-index:2000; font-family:var(--font-b); color:var(--soft); -webkit-font-smoothing:antialiased; }
.dmc-hd *,.dmc-hd *::before,.dmc-hd *::after{ box-sizing:border-box; margin:0; padding:0; }
.dmc-hd a{ text-decoration:none; color:inherit; }
.dmc-hd ul{ list-style:none; }
.dmc-hd button{ background:none; border:none; font:inherit; color:inherit; cursor:pointer; }
.dmc-hd a:focus-visible,.dmc-hd button:focus-visible{ outline:2px solid var(--sky-400); outline-offset:3px; border-radius:6px; }
.dmc-lock{ overflow:hidden !important; }
/* ── Utility top bar ── */
.dmc-hd__top{ background:var(--n-950); border-bottom:1px solid rgba(113,182,255,.1); }
.dmc-hd__top-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 clamp(20px,3vw,48px); height:42px; }
.dmc-hd__top-note{ font-family:var(--font-d); font-size:10.5px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--soft-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dmc-hd__top-links{ display:flex; align-items:center; gap:28px; flex:none; }
.dmc-hd__top-links a{ display:inline-flex; align-items:center; gap:9px; font-family:var(--font-d); font-size:11.5px; font-weight:600; letter-spacing:.1em; color:var(--sky-300); transition:color .3s; white-space:nowrap; }
.dmc-hd__top-links a:hover{ color:#fff; }
.dmc-hd__top-links svg{ flex:none; }
/* ── Main bar ── */
.dmc-hd__bar{ position:relative; background:var(--n-800); border-bottom:1px solid var(--line); transition:background .35s,box-shadow .35s; }
.dmc-hd__bar-inner{ display:flex; align-items:center; gap:clamp(20px,2.5vw,44px); padding:0 clamp(20px,3vw,48px); height:86px; transition:height .35s; }
.dmc-hd.is-stuck .dmc-hd__bar{ position:fixed; top:0; left:0; right:0; z-index:2000; background:rgba(0,14,62,.94); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:0 18px 50px -20px rgba(0,5,24,.75); }
.dmc-hd.is-stuck .dmc-hd__bar-inner{ height:74px; }
.dmc-hd__spacer{ height:0; }
.dmc-hd__logo{ display:inline-flex; align-items:center; flex:none; }
.dmc-hd__logo img{ display:block; height:46px; width:auto; transition:height .35s; }
.dmc-hd.is-stuck .dmc-hd__logo img{ height:40px; }
/* ── Desktop nav ── */
.dmc-hd__nav{ flex:1; display:flex; justify-content:center; }
.dmc-hd__nav > ul{ display:flex; align-items:center; gap:clamp(4px,1vw,14px); }
.dmc-hd__item{ position:relative; }
.dmc-hd .dmc-hd__link{
display:inline-flex; align-items:center; gap:8px;
font-family:var(--font-d); font-size:12.5px; font-weight:600;
letter-spacing:.15em; text-transform:uppercase; color:#D3E1F5;
padding:14px 16px; position:relative; transition:color .3s; white-space:nowrap;
}
.dmc-hd__link::after{ content:''; position:absolute; left:16px; right:16px; bottom:6px; height:2px; background:var(--sky-500); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .35s cubic-bezier(.2,.7,.3,1); }
.dmc-hd__link:hover,.dmc-hd__link.is-current{ color:var(--sky-400); }
.dmc-hd__link:hover::after,.dmc-hd__link.is-current::after{ transform:scaleX(1); }
.dmc-hd__chev{ transition:transform .3s; flex:none; }
.dmc-hd__item.is-open .dmc-hd__chev{ transform:rotate(180deg); }
.dmc-hd__item.is-open > .dmc-hd__link{ color:var(--sky-400); }
.dmc-hd__item.is-open > .dmc-hd__link::after{ transform:scaleX(1); }
/* ── Dropdown (Our Specialties) ── */
.dmc-hd__drop{
position:absolute; top:100%; left:50%; transform:translate(-50%,14px);
width:380px; background:linear-gradient(180deg,#0A2270 0%,#041653 100%);
border:1px solid var(--line); border-radius:16px; padding:10px;
box-shadow:0 40px 80px -25px rgba(0,5,24,.85);
opacity:0; visibility:hidden; pointer-events:none;
transition:opacity .3s cubic-bezier(.2,.7,.3,1),transform .3s cubic-bezier(.2,.7,.3,1),visibility 0s .3s;
}
.dmc-hd__item.is-open .dmc-hd__drop{ opacity:1; visibility:visible; transform:translate(-50%,0); pointer-events:auto; transition:opacity .3s cubic-bezier(.2,.7,.3,1),transform .3s cubic-bezier(.2,.7,.3,1),visibility 0s 0s; }
.dmc-hd__drop a{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 16px; border-radius:12px; font-size:14.5px; font-weight:500; color:#C9D8F2; transition:background .25s,color .25s; }
.dmc-hd__drop a svg{ flex:none; color:var(--sky-500); opacity:0; transform:translateX(-6px); transition:opacity .3s,transform .3s; }
.dmc-hd__drop a:hover{ background:rgba(113,182,255,.08); color:var(--sky-300); }
.dmc-hd__drop a:hover svg{ opacity:1; transform:none; }
.dmc-hd .dmc-hd__drop-all{ margin-top:4px; border-top:1px solid var(--line); border-radius:0 0 12px 12px; font-family:var(--font-d); font-size:13.5px; font-weight:600; letter-spacing:.02em; color:var(--sky-500); }
.dmc-hd .dmc-hd__drop-all:hover{ color:var(--sky-300); background:rgba(113,182,255,.06); }
/* ── Actions ── */
.dmc-hd__actions{ display:flex; align-items:center; gap:16px; flex:none; margin-left:auto; }
.dmc-hd .dmc-hd__btn{
display:inline-flex; align-items:center; gap:11px;
font-family:var(--font-d); font-size:14px; font-weight:600;
letter-spacing:.02em;
background:var(--sky-500); color:var(--n-950);
padding:15px 28px; border-radius:999px; white-space:nowrap;
transition:background .3s,transform .3s,box-shadow .3s;
}
.dmc-hd__btn svg{ flex:none; transition:transform .3s; }
.dmc-hd__btn:hover{ background:var(--sky-400); transform:translateY(-1px); box-shadow:0 14px 30px -12px rgba(113,182,255,.5); }
.dmc-hd__btn:hover svg{ transform:translateX(4px); }
/* ── Burger ── */
.dmc-hd__burger{ display:none; width:46px; height:46px; border-radius:12px; border:1px solid var(--line); position:relative; flex:none; transition:border-color .3s,background .3s; }
.dmc-hd__burger:hover{ border-color:var(--line-strong); background:rgba(113,182,255,.06); }
.dmc-hd__burger span{ position:absolute; left:13px; right:13px; height:1.8px; border-radius:2px; background:var(--sky-300); transition:transform .35s,opacity .3s,top .35s; }
.dmc-hd__burger span:nth-child(1){ top:16px; }
.dmc-hd__burger span:nth-child(2){ top:22px; }
.dmc-hd__burger span:nth-child(3){ top:28px; }
.dmc-hd__burger.is-open span:nth-child(1){ top:22px; transform:rotate(45deg); }
.dmc-hd__burger.is-open span:nth-child(2){ opacity:0; }
.dmc-hd__burger.is-open span:nth-child(3){ top:22px; transform:rotate(-45deg); }
/* ── Off-canvas mobile menu ── */
.dmc-hd__scrim{ position:fixed; inset:0; z-index:2900; background:rgba(0,6,26,.62); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); opacity:0; pointer-events:none; transition:opacity .4s; }
.dmc-hd__scrim.is-open{ opacity:1; pointer-events:auto; }
.dmc-hd__mnav{ position:fixed; top:0; right:0; bottom:0; z-index:3000; width:min(400px,90vw); background:linear-gradient(180deg,#071E63 0%,#000C38 100%); border-left:1px solid var(--line); transform:translateX(105%); transition:transform .45s cubic-bezier(.2,.7,.25,1); display:flex; flex-direction:column; padding:22px 26px 30px; overflow-y:auto; }
.dmc-hd__mnav.is-open{ transform:none; }
.dmc-hd__mnav-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; }
.dmc-hd__mnav-top img{ height:38px; width:auto; display:block; }
.dmc-hd__close{ width:44px; height:44px; border-radius:12px; border:1px solid var(--line); position:relative; transition:border-color .3s,background .3s; flex:none; }
.dmc-hd__close:hover{ border-color:var(--line-strong); background:rgba(113,182,255,.06); }
.dmc-hd__close::before,.dmc-hd__close::after{ content:''; position:absolute; left:13px; right:13px; top:21px; height:1.8px; border-radius:2px; background:var(--sky-300); }
.dmc-hd__close::before{ transform:rotate(45deg); }
.dmc-hd__close::after{ transform:rotate(-45deg); }
.dmc-hd .dmc-hd__mlink,.dmc-hd .dmc-hd__macc{
display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%;
font-family:var(--font-d); font-size:14px; font-weight:600;
letter-spacing:.12em; text-transform:uppercase; color:#E0EBFA;
padding:19px 2px; border-bottom:1px solid rgba(113,182,255,.12);
transition:color .3s; text-align:left;
}
.dmc-hd__mlink:hover,.dmc-hd__macc:hover{ color:var(--sky-400); }
.dmc-hd__macc svg{ transition:transform .35s; flex:none; color:var(--sky-500); }
.dmc-hd__macc.is-open svg{ transform:rotate(180deg); }
.dmc-hd__mnav > *{ flex:0 0 auto; }
.dmc-hd__mpanel{ max-height:0; overflow:hidden; transition:max-height .5s cubic-bezier(.2,.7,.3,1); }
.dmc-hd__mpanel-in{ padding:14px 2px 20px; border-bottom:1px solid rgba(113,182,255,.12); }
.dmc-hd__mpanel-in a{ display:block; font-size:15px; font-weight:500; color:#BCCDEA; padding:9px 0; transition:color .3s,padding-left .3s; }
.dmc-hd__mpanel-in a:hover{ color:var(--sky-300); padding-left:8px; }
.dmc-hd .dmc-hd__mbtn{ display:flex; align-items:center; justify-content:center; gap:11px; font-family:var(--font-d); font-size:14px; font-weight:600; letter-spacing:.02em; background:var(--sky-500); color:var(--n-950); padding:18px 28px; border-radius:999px; margin-top:28px; transition:background .3s,transform .3s; }
.dmc-hd__mbtn:hover{ background:var(--sky-400); transform:translateY(-1px); }
.dmc-hd__mcontact{ margin-top:26px; display:flex; flex-direction:column; gap:14px; }
.dmc-hd__mcontact a{ display:inline-flex; align-items:center; gap:11px; font-family:var(--font-d); font-size:12.5px; font-weight:600; letter-spacing:.08em; color:var(--sky-300); transition:color .3s; }
.dmc-hd__mcontact a:hover{ color:#fff; }
@media (max-width:1180px){
.dmc-hd__nav{ display:none; }
.dmc-hd__burger{ display:block; }
.dmc-hd__bar-inner{ height:76px; justify-content:space-between; }
.dmc-hd.is-stuck .dmc-hd__bar-inner{ height:68px; }
.dmc-hd__logo img{ height:40px; }
.dmc-hd.is-stuck .dmc-hd__logo img{ height:38px; }
}
@media (max-width:760px){
.dmc-hd__top-note{ display:none; }
.dmc-hd__top-inner{ justify-content:center; }
}
@media (max-width:640px){
.dmc-hd__actions .dmc-hd__btn{ display:none; }
.dmc-hd__bar-inner{ height:70px; }
.dmc-hd.is-stuck .dmc-hd__bar-inner{ height:64px; }
.dmc-hd__logo img{ height:36px; }
.dmc-hd.is-stuck .dmc-hd__logo img{ height:34px; }
}
@media (max-width:420px){
.dmc-hd__top-links{ gap:18px; }
.dmc-hd__top-links a span{ display:none; }
}
/* ═══════════════════════════════════════════════════════════════════════════
HOMEPAGE COMPONENTS
═══════════════════════════════════════════════════════════════════════════ */
/* ── Hero (framed gradient card + transparent hero image) ── */
.dmc-hero{ padding:0; background:var(--n-900); }
.dmc-hero__media{
position:relative; overflow:hidden;
min-height:min(86vh,880px); display:flex; align-items:center;
background:
radial-gradient(1100px 640px at 80% 12%, rgba(34,115,206,.32) 0%, rgba(34,115,206,0) 58%),
radial-gradient(760px 560px at 10% 32%, rgba(16,42,120,.5) 0%, rgba(16,42,120,0) 62%),
linear-gradient(to bottom,#041A66 0%,#00155D 52%,#000A33 100%);
}
.dmc-hero__lines{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.dmc-hero__inner{
position:relative; z-index:2; width:100%;
max-width:calc(var(--wrap) + 96px); margin:0 auto;
padding:clamp(72px,8vw,116px) 48px clamp(100px,10vw,150px);
display:grid; grid-template-columns:minmax(0,1fr) 520px;
gap:clamp(44px,5vw,88px); align-items:center;
}
.dmc-hero .dmc-eyebrow{ margin-bottom:26px; }
.dmc-hero .dmc-h1{ margin:0 0 28px; }
.dmc-hero__lead{ max-width:760px; font-size:clamp(1.05rem,1.3vw,1.22rem); line-height:1.8; color:var(--sky-300); }
.dmc-hero__lead strong{ color:#fff; font-weight:600; }
.dmc-hero__cta{ display:flex; flex-wrap:wrap; gap:18px; margin-top:42px; }
.dmc-hero__trust{ display:flex; flex-wrap:wrap; gap:14px 38px; margin-top:48px; padding-top:32px; border-top:1px solid rgba(255,255,255,.14); }
.dmc-hero__content > *{ opacity:0; transform:translateY(26px); animation:dmcRise 1s cubic-bezier(.2,.65,.3,1) forwards; }
.dmc-hero__content > *:nth-child(1){ animation-delay:.15s; }
.dmc-hero__content > *:nth-child(2){ animation-delay:.28s; }
.dmc-hero__content > *:nth-child(3){ animation-delay:.41s; }
.dmc-hero__content > *:nth-child(4){ animation-delay:.54s; }
.dmc-hero__content > *:nth-child(5){ animation-delay:.67s; }
@keyframes dmcRise{ to{ opacity:1; transform:none; } }
.dmc-hero__form{
opacity:0; transform:translateY(26px);
animation:dmcRise 1s cubic-bezier(.2,.65,.3,1) .5s forwards;
}
.dmc-form-card--compact .dmc-form__sub{ margin-bottom:18px; }
/* ── Stats band (overlaps hero) ── */
.dmc-stats{ padding:0 28px; position:relative; z-index:5; }
.dmc-stats__card{
max-width:var(--wrap); margin:-78px auto 0;
background:linear-gradient(180deg,var(--n-600) 0%,#0A2064 100%);
border:1px solid var(--line); border-radius:var(--rad);
padding:56px 64px 50px; display:grid; grid-template-columns:repeat(4,1fr);
box-shadow:0 40px 80px -30px rgba(0,4,18,.7);
}
.dmc-stat{ padding:0 36px; border-left:1px solid var(--line); }
.dmc-stat:first-child{ border-left:none; padding-left:0; }
.dmc-stat__num{ font-family:var(--font-d); font-weight:300; font-size:clamp(2.7rem,3.9vw,4rem); line-height:1; color:#fff; display:flex; align-items:baseline; gap:6px; white-space:nowrap; }
.dmc-stat__pre{ font-size:.5em; font-weight:400; color:var(--sky-500); }
.dmc-stat__suffix{ font-size:.38em; font-weight:600; letter-spacing:.12em; color:var(--sky-500); text-transform:uppercase; }
.dmc-stat__label{ margin-top:14px; font-size:13.5px; line-height:1.6; color:var(--soft-2); }
.dmc-stat__src{ margin-top:20px; display:flex; align-items:center; min-height:38px; }
.dmc-stat__src img{ height:34px; max-width:200px; width:auto; object-fit:contain; opacity:.88; }
.dmc-stats__note{ max-width:var(--wrap); margin:18px auto 0; padding:0 8px; font-size:11.5px; color:rgba(143,160,203,.55); line-height:1.6; }
/* ── Intro (dark editorial, follows the stats band) ── */
.dmc-intro{ position:relative; padding:clamp(110px,12vw,175px) 0; background:var(--n-900); overflow:hidden; }
.dmc-intro__wm{
position:absolute; top:50%; right:-7%; transform:translateY(-50%);
width:clamp(320px,34vw,600px); opacity:.05;
user-select:none; pointer-events:none;
}
.dmc-intro__lines{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.dmc-intro__grid{ position:relative; display:grid; grid-template-columns:minmax(0,5.5fr) minmax(0,6.5fr); gap:clamp(48px,6vw,96px); align-items:start; }
.dmc-intro__head .dmc-h2{ margin:0 0 34px; }
.dmc-intro__copy .dmc-lead{ margin-bottom:22px; }
.dmc-intro__copy .dmc-lead:last-child{ margin-bottom:0; }
/* ── Core services (white, alternating rows) ── */
.dmc-serv{ padding:clamp(100px,11vw,170px) 0; }
.dmc-serv__head{ text-align:center; max-width:860px; margin:0 auto clamp(64px,7vw,96px); }
.dmc-serv__head .dmc-h2{ margin:0; }
.dmc-serv-row{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(48px,6vw,100px); align-items:center; }
.dmc-serv-row + .dmc-serv-row{ margin-top:clamp(88px,9vw,140px); }
.dmc-serv-row__media{ display:flex; align-items:center; justify-content:center; }
.dmc-serv-row__media img{ max-height:520px; width:auto; max-width:100%; object-fit:contain; }
.dmc-serv-row__body{ max-width:600px; }
.dmc-serv-row--flip .dmc-serv-row__media{ order:2; }
.dmc-serv-row--flip .dmc-serv-row__body{ order:1; }
.dmc-serv-row__body .dmc-h3{ font-size:clamp(1.5rem,2vw,1.9rem); margin-bottom:18px; }
.dmc-serv-row__body > p{ font-size:16px; line-height:1.8; color:var(--ink-soft); margin-bottom:26px; }
.dmc-serv-row__body > p strong{ color:var(--ink); }
.dmc-serv-row .dmc-checks{ margin-bottom:28px; }
.dmc-serv-note{
font-size:14.5px; line-height:1.75; color:var(--ink);
background:#fff; border:1px solid #DCE8F8; border-radius:16px;
padding:20px 26px; margin-bottom:28px;
}
.dmc-serv-note a{ color:var(--sky-600); text-decoration:underline; text-underline-offset:3px; }
.dmc-serv-note a:hover{ color:var(--sky-700); }
/* ── Who we serve (dark, 9 specialty cards) ── */
.dmc-serve{ padding:clamp(100px,11vw,165px) 0; background:var(--n-900); }
.dmc-serve__top{ display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:clamp(36px,5vw,72px); }
.dmc-serve__intro{ flex:1 1 460px; max-width:880px; min-width:0; }
.dmc-serve__intro .dmc-h2{ margin:0; }
.dmc-serve__art{ width:clamp(200px,23vw,350px); max-width:100%; height:auto; flex:0 0 auto; margin-top:4px; }
.dmc-serve__lead{ max-width:1080px; margin:26px 0 34px; }
.dmc-serve__cta{ display:flex; flex-wrap:wrap; align-items:center; gap:16px 22px; margin-bottom:clamp(56px,6vw,80px); }
.dmc-serve__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.dmc-spec-card{
position:relative; display:flex; flex-direction:column;
background:linear-gradient(180deg,rgba(16,42,120,.5) 0%,rgba(8,32,104,.22) 100%);
border:1px solid var(--line); border-radius:var(--rad); overflow:hidden;
transition:transform .45s cubic-bezier(.2,.7,.3,1),border-color .45s,background .45s;
}
.dmc-spec-card::after{
content:''; position:absolute; left:0; right:0; top:0; height:3px;
background:var(--grad-rise); opacity:0; transform:scaleX(.3); transform-origin:left;
transition:opacity .45s,transform .55s cubic-bezier(.2,.7,.3,1);
}
.dmc-spec-card:hover{ transform:translateY(-6px); border-color:var(--line-strong); background:linear-gradient(180deg,rgba(16,42,120,.72) 0%,rgba(8,32,104,.36) 100%); }
.dmc-spec-card:hover::after{ opacity:1; transform:scaleX(1); }
.dmc-spec-card__media{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.dmc-spec-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.3,1); }
.dmc-spec-card:hover .dmc-spec-card__media img{ transform:scale(1.05); }
.dmc-spec-card__media::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(0,10,51,.42) 0%,rgba(0,10,51,0) 45%); }
.dmc-spec-card__body{ display:flex; flex-direction:column; flex:1; padding:30px 32px 32px; }
.dmc-spec-card__body .dmc-h3{ font-size:1.16rem; margin-bottom:13px; }
.dmc-spec-card__body p{ font-size:14.5px; line-height:1.75; color:var(--soft-2); margin-bottom:22px; }
.dmc-spec-card__body .dmc-arrow-link{ margin-top:auto; font-size:14.5px; }
/* ── Final CTA panel + lead form ── */
.dmc-consult{ padding:clamp(90px,9vw,130px) 28px; background:var(--n-900); }
.dmc-consult__panel{
position:relative; max-width:var(--wrap); margin:0 auto;
border-radius:var(--rad-lg); overflow:hidden;
padding:clamp(48px,5.5vw,84px) clamp(28px,5vw,84px);
border:1px solid rgba(113,182,255,.16);
box-shadow:0 60px 120px -50px rgba(0,0,0,.85);
}
.dmc-consult__bg{ position:absolute; inset:0; }
.dmc-consult__bg img{ width:100%; height:100%; object-fit:cover; }
.dmc-consult__overlay{ position:absolute; inset:0; background:linear-gradient(120deg,rgba(0,10,51,.97) 0%,rgba(0,21,93,.93) 55%,rgba(13,54,128,.88) 100%); }
.dmc-consult__lines{ position:absolute; inset:0; pointer-events:none; }
.dmc-consult__grid{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(40px,5vw,72px); align-items:center; }
.dmc-consult__info .dmc-eyebrow{ font-size:15px; margin-bottom:18px; }
.dmc-consult__info .dmc-h2{ margin:0 0 20px; font-size:clamp(1.6rem,2.3vw,2.3rem); line-height:1.28; }
.dmc-consult__info .dmc-lead{ margin-bottom:28px; color:var(--sky-300); font-size:.99rem; line-height:1.75; }
.dmc-consult__info .dmc-lead a{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.dmc-consult__contact{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 32px; margin-bottom:26px; }
.dmc-page .dmc-consult__contact a{ display:inline-flex; align-items:center; gap:11px; font-family:var(--font-d); font-size:13.5px; font-weight:600; letter-spacing:.08em; color:var(--sky-300); transition:color .3s; }
.dmc-page .dmc-consult__contact a:hover{ color:#fff; }
.dmc-consult__assure{ display:flex; flex-wrap:wrap; gap:12px 30px; }
/* ── Shared form styles (both lead forms) ── */
.dmc-vh{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.dmc-hp{ position:absolute; left:-5000px; width:1px; height:1px; opacity:0; overflow:hidden; }
.dmc-form-card{ position:relative; background:#fff; border-radius:26px; padding:clamp(28px,3.2vw,44px); box-shadow:0 50px 100px -40px rgba(0,4,20,.85); }
.dmc-light .dmc-form-card, .dmc-white .dmc-form-card{ border:1px solid #E3ECF8; box-shadow:0 44px 90px -44px rgba(7,18,51,.28); }
.dmc-form__title{ font-family:var(--font-d); font-weight:600; font-size:clamp(1.35rem,1.8vw,1.65rem); color:var(--ink); margin-bottom:10px; }
.dmc-form__sub{ font-size:14.5px; line-height:1.7; color:var(--ink-soft); margin-bottom:24px; }
.dmc-form__sub strong{ color:var(--ink); }
.dmc-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.dmc-field{ margin-bottom:14px; }
.dmc-flabel{ display:block; font-family:var(--font-b); font-size:13px; font-weight:600; letter-spacing:.01em; color:var(--ink); margin:0 0 7px 2px; }
.dmc-input,.dmc-select,.dmc-textarea{
width:100%; font-family:var(--font-b); font-size:15.5px; color:var(--ink);
background:#F7FAFE; border:1.5px solid #DFE9F6; border-radius:14px;
padding:15px 17px; appearance:none; -webkit-appearance:none;
transition:border-color .25s,box-shadow .25s,background .25s;
}
.dmc-input::placeholder,.dmc-textarea::placeholder{ color:#93A2C2; }
.dmc-input:focus,.dmc-select:focus,.dmc-textarea:focus{ outline:none; border-color:var(--sky-600); background:#fff; box-shadow:0 0 0 4px rgba(34,115,206,.12); }
.dmc-select{
background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%232273CE' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat; background-position:right 18px center; padding-right:46px; cursor:pointer;
}
.dmc-select:invalid{ color:#93A2C2; }
.dmc-select option{ color:var(--ink); }
.dmc-textarea{ min-height:104px; resize:vertical; }
.dmc-form__kicker{ font-family:var(--font-b); font-size:13px; font-weight:600; letter-spacing:.01em; color:var(--ink); margin:6px 0 10px; }
.dmc-pills{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:16px; }
.dmc-pill{
font-family:var(--font-b); font-size:13.5px; font-weight:500; color:var(--ink-soft);
background:#fff; border:1.5px solid #DFE9F6; border-radius:12px;
padding:13px 6px; text-align:center; cursor:pointer;
transition:border-color .25s,background .25s,color .25s;
}
.dmc-pill:hover{ border-color:var(--sky-500); color:var(--sky-700); }
.dmc-pill.is-on{ border-color:var(--sky-600); background:rgba(113,182,255,.14); color:var(--sky-700); font-weight:600; }
.dmc-form__submit{ width:100%; justify-content:center; margin-top:4px; font-size:14.5px; padding:16px 24px; }
.dmc-form__submit:disabled{ opacity:.55; cursor:not-allowed; transform:none !important; box-shadow:none !important; }
.dmc-field.has-error .dmc-input,.dmc-field.has-error .dmc-select,.dmc-field.has-error .dmc-textarea{ border-color:#D9646C; box-shadow:none; background:#FEF7F7; }
.dmc-error-msg{ display:none; font-size:12.5px; line-height:1.4; color:#C0505A; margin:7px 2px 0; }
.dmc-field.has-error .dmc-error-msg{ display:block; }
.dmc-form__status{ display:none; margin-top:14px; font-size:14px; line-height:1.55; border-radius:12px; padding:13px 16px; }
.dmc-form__status.is-error{ display:block; background:#FCEEEF; color:#9E3E47; }
.dmc-form__fineprint{ margin-top:16px; text-align:center; font-size:12.5px; line-height:1.5; color:#8494B5; }
.dmc-form-success{ display:none; text-align:center; padding:44px 12px; }
.dmc-form-success h3{ font-family:var(--font-d); font-weight:600; font-size:1.4rem; color:var(--ink); margin:22px 0 12px; }
.dmc-form-success p{ font-size:15px; line-height:1.7; color:var(--ink-soft); max-width:400px; margin:0 auto; }
.dmc-page .dmc-form-success a{ color:var(--sky-700); font-weight:600; }
.dmc-form-card.is-done form{ display:none; }
.dmc-form-card.is-done .dmc-form-success{ display:block; }
/* Compact variant · final CTA form */
.dmc-form-card--compact{ padding:clamp(24px,2.6vw,36px); }
.dmc-form-card--compact .dmc-field{ margin-bottom:12px; }
.dmc-form-card--compact .dmc-flabel{ font-size:12.5px; margin-bottom:6px; }
.dmc-form-card--compact .dmc-input,.dmc-form-card--compact .dmc-select{ padding:13px 15px; font-size:15px; }
.dmc-form-card--compact .dmc-textarea{ min-height:80px; padding:13px 15px; font-size:15px; }
.dmc-form-card--compact .dmc-pills{ margin-bottom:14px; }
.dmc-form-card--compact .dmc-pill{ padding:11px 6px; }
.dmc-form-card--compact .dmc-form__kicker{ margin:4px 0 8px; }
.dmc-consult .dmc-trust-item{ font-size:13px; }
/* ═══════════════════════════════════════════════════════════════════════════
GLOBAL FOOTER (.dmc-ft)
V1: lives inside this file. Later: its own Theme Builder footer template.
═══════════════════════════════════════════════════════════════════════════ */
.dmc-ft{
position:relative; overflow:hidden; font-family:var(--font-b);
background:
radial-gradient(900px 500px at 85% 0%, rgba(16,42,120,.5) 0%, rgba(0,10,51,0) 60%),
var(--n-950);
border-top:1px solid var(--line); color:var(--soft);
-webkit-font-smoothing:antialiased;
}
.dmc-ft *,.dmc-ft *::before,.dmc-ft *::after{ box-sizing:border-box; margin:0; padding:0; }
.dmc-ft a{ text-decoration:none; color:inherit; }
.dmc-ft ul{ list-style:none; }
.dmc-ft img{ max-width:100%; }
.dmc-ft a:focus-visible{ outline:2px solid var(--sky-400); outline-offset:3px; border-radius:6px; }
.dmc-ft__lines{ position:absolute; inset:0; pointer-events:none; }
.dmc-ft__main{ position:relative; }
.dmc-ft__inner{
max-width:1400px; margin:0 auto;
padding:clamp(72px,8vw,110px) 48px clamp(48px,5vw,64px);
display:grid; grid-template-columns:4.4fr 2.4fr 2.8fr 3.2fr;
gap:clamp(36px,4vw,72px);
}
.dmc-ft__brand img{ display:block; height:46px; width:auto; margin-bottom:26px; }
.dmc-ft__brand p{ font-size:14.5px; line-height:1.8; color:var(--soft-2); max-width:380px; margin-bottom:18px; }
.dmc-ft__brand p strong{ color:#B9C8EC; font-weight:600; }
.dmc-ft__brand p a{ color:var(--sky-300); }
.dmc-ft__head{ font-family:var(--font-d); font-size:15px; font-weight:600; letter-spacing:.02em; color:var(--sky-400); margin-bottom:22px; }
.dmc-ft__col ul li a{ display:inline-block; font-size:15px; color:#A2B2DA; padding:8px 0; transition:color .3s,padding-left .3s; }
.dmc-ft__col ul li a:hover{ color:var(--sky-300); padding-left:8px; }
.dmc-ft__contact-item{ display:flex; align-items:flex-start; gap:14px; padding:10px 0; font-size:15px; color:#A2B2DA; line-height:1.6; }
.dmc-ft__contact-item svg{ flex:none; margin-top:4px; color:var(--sky-500); }
.dmc-ft__contact-item a{ color:var(--sky-300); transition:color .3s; }
.dmc-ft__contact-item a:hover{ color:#fff; }
.dmc-ft .dmc-ft__btn{
display:inline-flex; align-items:center; gap:11px; margin-top:20px;
font-family:var(--font-d); font-size:14px; font-weight:600;
letter-spacing:.02em;
background:var(--sky-500); color:var(--n-950);
padding:15px 28px; border-radius:999px;
transition:background .3s,transform .3s,box-shadow .3s;
}
.dmc-ft__btn svg{ flex:none; transition:transform .3s; }
.dmc-ft__btn:hover{ background:var(--sky-400); transform:translateY(-1px); box-shadow:0 14px 30px -12px rgba(113,182,255,.5); }
.dmc-ft__btn:hover svg{ transform:translateX(4px); }
/* Specialties strip (becomes the pillar-page link hub later) */
.dmc-ft__specs{ position:relative; border-top:1px solid var(--line); }
.dmc-ft__specs-inner{ max-width:1400px; margin:0 auto; padding:34px 48px 38px; }
.dmc-ft__specs-inner .dmc-ft__head{ margin-bottom:18px; }
.dmc-ft__specs-list{ display:flex; flex-wrap:wrap; gap:10px; }
.dmc-ft__specs-list li span, .dmc-ft__specs-list li a{
display:inline-block; font-size:12.5px; font-weight:500; letter-spacing:.03em;
color:#9FB0DA; border:1px solid var(--line); border-radius:999px; padding:9px 18px;
transition:color .3s,border-color .3s;
}
.dmc-ft__specs-list li a:hover{ color:var(--sky-300); border-color:var(--line-strong); }
/* Geo SEO block · verbatim from the current footer */
.dmc-ft__geo{ position:relative; border-top:1px solid var(--line); }
.dmc-ft__geo-inner{ max-width:1400px; margin:0 auto; padding:30px 48px 34px; font-size:12.5px; line-height:1.9; color:rgba(143,160,203,.75); }
.dmc-ft__geo-inner strong{ color:#AEBEE6; font-weight:600; }
/* Giant watermark */
.dmc-ft__wm{ position:relative; overflow:hidden; height:clamp(70px,9vw,130px); pointer-events:none; user-select:none; }
.dmc-ft__wm span{
position:absolute; left:50%; top:0; transform:translateX(-50%);
font-family:var(--font-d); font-weight:800; letter-spacing:.08em;
font-size:clamp(110px,15vw,230px); line-height:1; white-space:nowrap;
color:transparent; -webkit-text-stroke:1px rgba(113,182,255,.07);
}
/* Bottom bar */
.dmc-ft__bottom{ position:relative; border-top:1px solid var(--line); }
.dmc-ft__bottom-inner{
max-width:1400px; margin:0 auto; padding:24px 48px 28px;
display:flex; align-items:center; justify-content:space-between; gap:16px 36px; flex-wrap:wrap;
}
.dmc-ft__copy{ font-size:13px; color:var(--soft-2); }
.dmc-ft__badge img{ height:44px; width:auto; opacity:.92; }
/* ── Footer responsive ── */
@media (max-width:1080px){
.dmc-ft__inner{ grid-template-columns:1fr 1fr; gap:52px 44px; }
}
@media (max-width:680px){
.dmc-ft__inner{ grid-template-columns:1fr; gap:44px; padding:64px 24px 44px; text-align:center; }
.dmc-ft__brand img{ margin-left:auto; margin-right:auto; }
.dmc-ft__brand p{ margin-left:auto; margin-right:auto; }
.dmc-ft__contact-item{ justify-content:center; text-align:left; }
.dmc-ft__specs-inner{ padding:30px 24px 34px; text-align:center; }
.dmc-ft__specs-list{ justify-content:center; }
.dmc-ft__geo-inner{ padding:26px 24px 30px; text-align:center; }
.dmc-ft__bottom-inner{ flex-direction:column; text-align:center; padding:22px 24px 26px; }
}
/* ═══════════════════════════════════════════════════════════════════════════
RESPONSIVE · everything centres at <=768px
═══════════════════════════════════════════════════════════════════════════ */
@media (max-width:1240px){
.dmc-stats__card{ padding:48px 44px 42px; }
.dmc-stat{ padding:0 26px; }
.dmc-hero__inner{ grid-template-columns:minmax(0,1fr) 470px; }
}
@media (max-width:1080px){
.dmc-hero__inner{ grid-template-columns:1fr; gap:56px; padding-top:clamp(56px,7vw,88px); padding-bottom:clamp(104px,12vw,150px); }
.dmc-hero__form{ width:100%; max-width:560px; margin:0 auto; }
.dmc-stats__card{ grid-template-columns:repeat(2,1fr); row-gap:44px; }
.dmc-stat:nth-child(3){ border-left:none; padding-left:0; }
.dmc-intro__grid{ grid-template-columns:1fr; gap:44px; }
.dmc-serv-row{ grid-template-columns:1fr; gap:44px; }
.dmc-serv-row--flip .dmc-serv-row__media{ order:0; }
.dmc-serv-row--flip .dmc-serv-row__body{ order:1; }
.dmc-serv-row__media{ max-width:680px; margin:0 auto; }
.dmc-serve__art{ width:clamp(190px,24vw,280px); }
.dmc-serve__grid{ grid-template-columns:repeat(2,1fr); }
.dmc-consult__grid{ grid-template-columns:1fr; gap:44px; }
}
@media (max-width:900px){
.dmc-serve__grid{ gap:20px; }
.dmc-serve__art{ display:none; }
}
@media (max-width:768px){
.dmc-container{ padding:0 24px; }
.dmc-btn{ white-space:normal; line-height:1.45; }
.dmc-hero{ padding:0; }
.dmc-hero__inner{ padding:56px 26px 64px; }
.dmc-hero__content{ text-align:center; }
.dmc-hero .dmc-eyebrow{ justify-content:center; }
.dmc-hero__lead{ margin-left:auto; margin-right:auto; }
.dmc-hero__cta{ justify-content:center; }
.dmc-hero__cta .dmc-btn{ width:100%; justify-content:center; }
.dmc-hero__trust{ justify-content:center; }
.dmc-hero .dmc-form-card{ padding:24px 18px; }
.dmc-stats{ padding:0 20px; }
.dmc-stats__card{ grid-template-columns:1fr; margin-top:-54px; padding:14px 30px; row-gap:0; }
.dmc-stat{ border-left:none; padding:26px 0; border-top:1px solid var(--line); text-align:center; }
.dmc-stat:first-child{ border-top:none; }
.dmc-stat__num{ justify-content:center; }
.dmc-stat__src{ justify-content:center; }
.dmc-stats__note{ text-align:center; }
.dmc-intro__head, .dmc-intro__copy{ text-align:center; }
.dmc-intro__head .dmc-eyebrow{ justify-content:center; }
.dmc-intro__wm{ right:-32%; opacity:.04; }
.dmc-serv__head{ text-align:center; }
.dmc-serv-row__body{ text-align:center; }
.dmc-serv-row__body .dmc-checks{ max-width:460px; margin-left:auto; margin-right:auto; text-align:left; }
.dmc-serv-note{ text-align:left; }
.dmc-serve__top{ justify-content:center; }
.dmc-serve__intro{ text-align:center; max-width:none; }
.dmc-serve__intro .dmc-eyebrow{ justify-content:center; }
.dmc-serve__lead{ margin-left:auto; margin-right:auto; text-align:center; }
.dmc-serve__cta{ justify-content:center; }
.dmc-serve__grid{ grid-template-columns:1fr; }
.dmc-spec-card__body{ text-align:center; }
.dmc-spec-card__body .dmc-arrow-link{ justify-content:center; }
.dmc-consult{ padding:64px 14px 72px; }
.dmc-consult__panel{ padding:44px 20px 40px; }
.dmc-consult__info{ text-align:center; }
.dmc-consult__info .dmc-eyebrow{ justify-content:center; }
.dmc-consult__contact{ align-items:center; }
.dmc-consult__assure{ justify-content:center; }
.dmc-form__row{ grid-template-columns:1fr; }
}
@media (max-width:520px){
.dmc-container{ padding:0 20px; }
.dmc-hero .dmc-h1{ letter-spacing:.03em; }
.dmc-form-card{ padding:26px 18px; }
.dmc-stats__card{ padding:10px 24px; }
}
/* ═══════════════════════════════════════════
REDUCED MOTION
═══════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
.dmc-page *, .dmc-page *::before, .dmc-page *::after,
.dmc-hd *, .dmc-hd *::before, .dmc-hd *::after,
.dmc-ft *, .dmc-ft *::before, .dmc-ft *::after{
animation-duration:.01ms !important;
animation-iteration-count:1 !important;
transition-duration:.01ms !important;
}
.dmc-reveal{ opacity:1; transform:none; }
.dmc-hero__content > *, .dmc-hero__form{ opacity:1; transform:none; animation:none; }
}
/* ── Pillar link strip, additive. Gives every service pillar a homepage link
without another image grid. New classes, so nothing existing is touched. ── */
.dmc-pillars{ margin-top:clamp(44px,5vw,72px); }
.dmc-pillars__head{ font-family:var(--font-d); font-weight:600; font-size:15px;
color:#fff; margin:0 0 18px; }
.dmc-pillars__list{ display:flex; flex-wrap:wrap; gap:10px 12px; list-style:none;
padding:0; margin:0; }
.dmc-pillars__list a{ display:inline-flex; align-items:center; gap:8px;
padding:10px 16px; border-radius:999px; text-decoration:none;
border:1px solid var(--line); background:rgba(16,42,120,.42);
font-family:var(--font-b); font-size:13.5px; font-weight:600; color:var(--soft);
transition:border-color .2s ease, color .2s ease, transform .2s ease; }
.dmc-pillars__list a:hover{ border-color:var(--line-strong); color:#fff;
transform:translateY(-2px); }
@media (max-width:600px){ .dmc-pillars__list a{ font-size:12.5px; padding:9px 13px; } }
/* ═══ PILLAR PAGE · ORAL & MAXILLOFACIAL SURGERY ═══ */
.dmc-page--pillar .dmc-h1{ font-size:clamp(1.85rem,2.9vw,3.05rem); }
.dmc-crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-size:13.5px; color:var(--soft-2); margin-bottom:22px; }
.dmc-crumbs a{ color:var(--sky-400); transition:color .3s; }
.dmc-crumbs a:hover{ color:#fff; }
.dmc-crumbs svg{ opacity:.55; flex:none; }
.dmc-hero--pillar .dmc-hero__inner{
grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
padding-bottom:clamp(76px,8vw,120px); /* no stats band straddling on pillar pages */
}
.dmc-phero-art{ width:100%; max-width:560px; justify-self:center; opacity:0; transform:translateY(26px); animation:dmcRise 1s cubic-bezier(.2,.65,.3,1) .45s forwards; }
.dmc-phero-art > img{ width:100%; height:auto; }
.dmc-sec-head{ max-width:900px; margin:0 auto clamp(52px,6vw,80px); text-align:center; }
.dmc-sec-head .dmc-h2{ margin:0 0 18px; }
.dmc-sec-head p{ font-size:16px; line-height:1.8; }
.dmc-proc-sec{ padding:clamp(96px,10vw,150px) 0; }
.dmc-proc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.dmc-proc-grid > *, .dmc-sys-grid > *, .dmc-ref__grid > *{ min-width:0; }
.dmc-proc{ background:#fff; border:1px solid #E1EAF7; border-radius:var(--rad); padding:34px 32px 32px; transition:transform .4s cubic-bezier(.2,.7,.3,1),border-color .4s,box-shadow .4s; }
.dmc-proc:hover{ transform:translateY(-5px); border-color:rgba(34,115,206,.35); box-shadow:0 30px 60px -30px rgba(7,18,51,.25); }
.dmc-proc__ico{ width:56px; height:56px; border-radius:16px; background:rgba(113,182,255,.15); color:var(--sky-600); display:flex; align-items:center; justify-content:center; margin-bottom:20px; flex:none; }
.dmc-proc__ico svg{ display:block; }
.dmc-proc h3{ font-family:var(--font-d); font-weight:600; font-size:1.1rem; line-height:1.35; color:var(--ink); margin-bottom:12px; }
.dmc-proc p{ font-size:14.5px; line-height:1.75; color:var(--ink-soft); }
.dmc-sys-sec{ padding:clamp(96px,10vw,150px) 0; background:var(--n-900); }
.dmc-sys-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.dmc-sys{ position:relative; display:flex; flex-direction:column; background:linear-gradient(180deg,rgba(16,42,120,.5) 0%,rgba(8,32,104,.22) 100%); border:1px solid var(--line); border-radius:var(--rad); padding:30px 28px; overflow:hidden; transition:transform .45s cubic-bezier(.2,.7,.3,1),border-color .45s; }
.dmc-sys::after{ content:''; position:absolute; left:0; right:0; top:0; height:3px; background:var(--grad-rise); opacity:0; transform:scaleX(.3); transform-origin:left; transition:opacity .45s,transform .55s cubic-bezier(.2,.7,.3,1); }
.dmc-sys:hover{ transform:translateY(-6px); border-color:var(--line-strong); }
.dmc-sys:hover::after{ opacity:1; transform:scaleX(1); }
.dmc-sys__num{ font-family:var(--font-d); font-weight:300; font-size:3.2rem; line-height:1; color:transparent; -webkit-text-stroke:1px rgba(168,208,255,.34); margin-bottom:20px; }
.dmc-sys h3{ font-family:var(--font-d); font-weight:600; font-size:1.06rem; line-height:1.4; color:#fff; margin-bottom:12px; }
.dmc-sys p{ font-size:14px; line-height:1.75; color:var(--soft-2); margin-bottom:20px; }
.dmc-sys .dmc-arrow-link{ margin-top:auto; font-size:14px; }
.dmc-ref{ padding:clamp(96px,10vw,150px) 0; }
.dmc-ref__grid{ display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:clamp(48px,6vw,96px); align-items:start; }
.dmc-ref__copy .dmc-h2{ margin:0 0 24px; }
.dmc-ref__copy p{ font-size:16px; line-height:1.85; color:var(--ink-soft); margin-bottom:20px; }
.dmc-ref__copy p strong{ color:var(--ink); }
.dmc-ref__side .dmc-checks{ margin-bottom:28px; }
.dmc-faq-sec{ padding:clamp(96px,10vw,150px) 0; }
.dmc-faq{ max-width:920px; margin:0 auto; }
.dmc-faq__item{ border-top:1px solid var(--line-light); padding:30px 6px; }
.dmc-faq__item:last-child{ border-bottom:1px solid var(--line-light); }
.dmc-faq__item h3{ font-family:var(--font-d); font-weight:600; font-size:1.08rem; color:var(--ink); margin-bottom:12px; line-height:1.4; }
.dmc-faq__item p{ font-size:15px; line-height:1.8; color:var(--ink-soft); }
.dmc-faq__item p a{ color:var(--sky-600); text-decoration:underline; text-underline-offset:3px; }
@media (max-width:1080px){
.dmc-proc-grid{ grid-template-columns:repeat(2,1fr); }
.dmc-sys-grid{ grid-template-columns:repeat(2,1fr); }
.dmc-ref__grid{ grid-template-columns:1fr; gap:44px; }
.dmc-phero-art{ max-width:480px; margin:0 auto; }
}
@media (max-width:768px){
.dmc-proc-grid{ grid-template-columns:1fr; }
.dmc-sys-grid{ grid-template-columns:1fr; }
.dmc-proc, .dmc-sys{ text-align:center; }
.dmc-proc__ico{ margin-left:auto; margin-right:auto; }
.dmc-sys .dmc-arrow-link{ justify-content:center; }
.dmc-crumbs{ justify-content:center; }
.dmc-ref__copy{ text-align:center; }
.dmc-ref__copy .dmc-eyebrow{ justify-content:center; }
.dmc-ref__side .dmc-checks{ text-align:left; }
}
/* ═══ GROWTH PLATFORM · live dashboard ═══ */
.dmc-plat{ padding:clamp(96px,10vw,150px) 0; }
.dmc-plat__grid{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:clamp(48px,6vw,90px); align-items:center; }
.dmc-plat__grid > *{ min-width:0; }
.dmc-plat__copy .dmc-h2{ margin:0 0 22px; }
.dmc-plat__copy p{ font-size:16px; line-height:1.85; color:var(--ink-soft); margin-bottom:24px; }
.dmc-plat__copy p strong{ color:var(--ink); }
.dmc-plat__copy .dmc-checks{ margin-bottom:26px; }
.dmc-dash-wrap{ perspective:1600px; }
.dmc-dash{ background:#fff; border:1px solid #E1EAF7; border-radius:22px; box-shadow:0 60px 110px -48px rgba(7,18,51,.4); transform:rotateY(-9deg) rotateX(4deg); transition:transform .9s cubic-bezier(.2,.7,.3,1); overflow:hidden; }
.dmc-dash-wrap:hover .dmc-dash{ transform:rotateY(-3deg) rotateX(1deg); }
.dmc-dash__bar{ display:flex; align-items:center; gap:12px; padding:13px 18px; background:#F4F8FE; border-bottom:1px solid #E4EDF9; }
.dmc-dash__dots{ display:flex; gap:6px; }
.dmc-dash__dots i{ width:9px; height:9px; border-radius:50%; background:#D6E2F3; }
.dmc-dash__url{ font-size:11.5px; font-weight:600; color:#7C8CB0; background:#fff; border:1px solid #E4EDF9; border-radius:999px; padding:5px 15px; }
.dmc-dash__body{ padding:22px 22px 18px; }
.dmc-dash__head{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:12px; color:#7C8CB0; margin-bottom:16px; }
.dmc-dash__head strong{ color:var(--ink); font-weight:600; font-size:13px; }
.dmc-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:12px; }
.dmc-kpi{ background:#F7FAFE; border:1px solid #E4EDF9; border-radius:14px; padding:14px 14px 12px; min-width:0; }
.dmc-kpi b{ display:block; font-family:var(--font-d); font-weight:600; font-size:1.45rem; color:var(--ink); line-height:1.1; }
.dmc-kpi span{ display:block; margin-top:5px; font-size:11px; color:#7C8CB0; line-height:1.4; }
.dmc-dash__row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.dmc-dash__row > *{ min-width:0; }
.dmc-ring-card{ display:flex; align-items:center; gap:13px; background:#F7FAFE; border:1px solid #E4EDF9; border-radius:14px; padding:13px; }
.dmc-ring{ position:relative; width:72px; height:72px; flex:none; }
.dmc-ring svg{ display:block; transform:rotate(-90deg); }
.dmc-ring circle{ fill:none; stroke-width:7; }
.dmc-ring .bg{ stroke:#E4EDF9; }
.dmc-ring .fg{ stroke:#2273CE; stroke-linecap:round; stroke-dasharray:204; stroke-dashoffset:204; transition:stroke-dashoffset 1.7s cubic-bezier(.2,.65,.3,1) .35s; }
.dmc-ring .fg--b{ stroke:#71B6FF; }
.dmc-reveal.is-in .dmc-ring .fg--a{ stroke-dashoffset:37; }
.dmc-reveal.is-in .dmc-ring .fg--b{ stroke-dashoffset:11; }
.dmc-ring b{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:var(--font-d); font-weight:600; font-size:.92rem; color:var(--ink); }
.dmc-ring-card > span{ font-size:11.5px; line-height:1.5; color:#7C8CB0; }
.dmc-bar-card{ background:#F7FAFE; border:1px solid #E4EDF9; border-radius:14px; padding:13px; display:flex; flex-direction:column; }
.dmc-bar-card > span{ font-size:11.5px; line-height:1.4; color:#7C8CB0; margin-bottom:10px; }
.dmc-bars{ display:flex; align-items:flex-end; gap:5px; height:64px; flex:1; }
.dmc-bars i{ flex:1; border-radius:4px 4px 2px 2px; background:linear-gradient(180deg,#71B6FF,#2273CE); transform:scaleY(.08); transform-origin:bottom; transition:transform .9s cubic-bezier(.2,.65,.3,1); }
.dmc-reveal.is-in .dmc-bars i:nth-child(1){ transition-delay:.15s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(2){ transition-delay:.21s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(3){ transition-delay:.27s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(4){ transition-delay:.33s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(5){ transition-delay:.39s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(6){ transition-delay:.45s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(7){ transition-delay:.51s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(8){ transition-delay:.57s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(9){ transition-delay:.63s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(10){ transition-delay:.69s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(11){ transition-delay:.75s; }
.dmc-reveal.is-in .dmc-bars i:nth-child(12){ transition-delay:.81s; }
.dmc-reveal.is-in .dmc-bars i{ transform:none; }
.dmc-plat__note{ margin-top:14px; font-size:11px; line-height:1.6; color:#9AA8C6; }
/* ═══ WHY DMC · leader statement + ecosystem wheel ═══ */
.dmc-lead-sec{ position:relative; padding:clamp(100px,11vw,165px) 0; background:var(--n-900); overflow:hidden; }
.dmc-lead-sec__lines{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.dmc-lead-sec .dmc-statement{ position:relative; font-family:var(--font-d); font-weight:300; line-height:1.2; color:#fff; font-size:clamp(1.8rem,3.4vw,3.3rem); text-align:center; max-width:1020px; margin:0 auto clamp(70px,8vw,110px); padding:0 24px; }
.dmc-lead-sec .dmc-statement .dmc-em{ font-weight:500; }
.dmc-lead__grid{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(48px,6vw,96px); align-items:center; }
.dmc-lead__grid > *{ min-width:0; }
.dmc-lead__copy .dmc-h2{ margin:0 0 22px; }
.dmc-lead__copy .dmc-lead{ margin-bottom:20px; }
.dmc-lead__copy .dmc-arrow-link{ margin-top:6px; }
.dmc-wheel{ position:relative; width:min(520px,100%); aspect-ratio:1/1; margin:20px auto 44px; }
.dmc-wheel__rings{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.dmc-wheel__spin{ transform-box:fill-box; transform-origin:center; animation:dmcSpin 110s linear infinite; }
@keyframes dmcSpin{ to{ transform:rotate(360deg); } }
.dmc-wheel__core{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:31%; height:31%; border-radius:50%; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 34% 30%, #12307E 0%, #071C5E 58%, #041447 100%); border:1px solid var(--line-strong); box-shadow:0 0 0 12px rgba(113,182,255,.05), 0 0 70px rgba(113,182,255,.2); }
.dmc-page .dmc-wheel__core img{ width:44%; height:auto; }
/* Node = dot + label, centred on its orbit point. Class-only selectors so
nothing in the base reset can out-specify the flex centring. */
.dmc-node{ position:absolute; width:112px; transform:translate(-50%,-50%); text-align:center; }
.dmc-node__dot{ display:flex; align-items:center; justify-content:center; width:54px; height:54px; margin:0 auto 10px; border-radius:17px; background:linear-gradient(180deg,rgba(18,46,128,.95),rgba(6,24,84,.96)); border:1px solid var(--line-strong); color:var(--sky-400); box-shadow:0 16px 34px -14px rgba(0,4,20,.85); }
.dmc-node__dot svg{ display:block; }
.dmc-node__label{ display:block; font-size:11.5px; font-weight:600; line-height:1.35; color:var(--soft-2); }
.dmc-node--1{ left:50%; top:10%; }
.dmc-node--2{ left:78.3%; top:21.7%; }
.dmc-node--3{ left:90%; top:50%; }
.dmc-node--4{ left:78.3%; top:78.3%; }
.dmc-node--5{ left:50%; top:90%; }
.dmc-node--6{ left:21.7%; top:78.3%; }
.dmc-node--7{ left:10%; top:50%; }
.dmc-node--8{ left:21.7%; top:21.7%; }
.dmc-wheel__cap{ text-align:center; font-size:13px; line-height:1.6; color:var(--soft-2); margin-top:-14px; }
.dmc-wgrid{ display:none; grid-template-columns:1fr 1fr; gap:12px; list-style:none; padding:0; margin:0 0 22px; }
.dmc-wgrid li{ display:flex; align-items:center; gap:12px; background:linear-gradient(180deg,rgba(16,42,120,.5),rgba(8,32,104,.22)); border:1px solid var(--line); border-radius:16px; padding:14px 16px; font-size:12.5px; font-weight:600; line-height:1.35; color:var(--soft); min-width:0; }
.dmc-wgrid svg{ flex:none; color:var(--sky-400); }
@media (max-width:1080px){
/* Pillar hero stacking lives HERE, in the last block of the stylesheet.
.dmc-hero--pillar .dmc-hero__inner is two classes, same as its base rule
below the homepage breakpoints, and media queries add no specificity,
so an override placed earlier in the file would silently lose. */
.dmc-hero--pillar .dmc-hero__inner{ grid-template-columns:1fr; gap:52px; padding-bottom:clamp(72px,9vw,110px); }
.dmc-phero-art{ max-width:460px; margin:0 auto; }
.dmc-plat__grid{ grid-template-columns:1fr; gap:48px; }
.dmc-dash-wrap{ max-width:640px; margin:0 auto; width:100%; }
.dmc-lead__grid{ grid-template-columns:1fr; gap:52px; }
}
@media (max-width:768px){
.dmc-hero--pillar .dmc-hero__inner{ grid-template-columns:1fr; padding:48px 24px 60px; gap:40px; }
.dmc-phero-art{ max-width:340px; }
.dmc-crumbs{ font-size:12.5px; }
.dmc-lead-sec .dmc-statement{ margin-bottom:56px; }
.dmc-plat__copy{ text-align:center; }
.dmc-plat__copy .dmc-eyebrow{ justify-content:center; }
.dmc-plat__copy .dmc-checks{ text-align:left; }
.dmc-dash{ transform:none; }
.dmc-lead__copy{ text-align:center; }
.dmc-lead__copy .dmc-eyebrow{ justify-content:center; }
}
/* Below 900px the orbit gets too tight for legible labels: swap to chips. */
@media (max-width:900px){
.dmc-wheel, .dmc-wheel__cap{ display:none; }
.dmc-wgrid{ display:grid; }
}
@media (max-width:640px){
.dmc-kpis{ gap:9px; }
.dmc-kpi{ padding:12px 10px 10px; }
.dmc-kpi b{ font-size:1.15rem; }
.dmc-kpi span{ font-size:10.5px; }
.dmc-dash__row{ grid-template-columns:1fr; }
.dmc-dash__bar{ padding:11px 13px; }
.dmc-dash__url{ font-size:10.5px; padding:5px 11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dmc-dash__body{ padding:16px 14px 14px; }
.dmc-dash__head{ flex-direction:column; gap:4px; }
.dmc-ring-card{ padding:12px; gap:11px; }
.dmc-wgrid{ grid-template-columns:1fr; }
.dmc-lead-sec .dmc-statement{ padding:0 4px; }
}
/* ── Consultation modal ───────────────────────────────────────────────────────
THE BUTTON RENDERED RED IN PRODUCTION. `.dmc-btn--primary` is defined as
`.dmc-page .dmc-btn--primary`, and this modal is injected at body level,
OUTSIDE `.dmc-page`, so none of those rules applied and the theme's own link
colour won. Every rule here that styles a control is therefore scoped to
`.dmc-modal` and stated in full rather than inherited. */
.dmc-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;
justify-content:center;padding:20px;
font-family:'Plus Jakarta Sans',system-ui,sans-serif;}
.dmc-modal[hidden]{display:none;}
.dmc-modal__scrim{position:absolute;inset:0;background:rgba(0,10,51,.78);
backdrop-filter:blur(4px);}
/* The panel echoes the lead form card on the homepage: white, navy type, a sky
blue action. A dark panel was considered and rejected, the site already
establishes white as the colour of "a form you fill in". */
.dmc-modal__panel{position:relative;z-index:1;background:#fff;border-radius:22px;
width:100%;max-width:540px;max-height:calc(100vh - 40px);overflow-y:auto;
padding:40px 38px 32px;
box-shadow:0 40px 90px rgba(0,10,51,.5);
border-top:4px solid #71B6FF;}
.dmc-modal__x{position:absolute;top:14px;right:16px;width:38px;height:38px;
border:0;background:transparent;font-size:26px;line-height:1;cursor:pointer;
color:#8494AD;border-radius:50%;transition:background .2s ease,color .2s ease;}
.dmc-modal__x:hover{background:#EEF4FD;color:#00155D;}
.dmc-modal__eyebrow{display:flex;align-items:center;gap:9px;margin:0 0 12px;
font-size:14px;font-style:italic;color:#2273CE;}
.dmc-modal__icon{flex:0 0 auto;}
.dmc-modal__title{margin:0 0 10px;font-family:Montserrat,system-ui,sans-serif;
font-weight:700;font-size:clamp(1.55rem,3vw,2rem);line-height:1.14;color:#00155D;}
.dmc-modal__lead{margin:0 0 24px;font-size:15px;line-height:1.65;color:#45557E;}
/* controls, fully stated because nothing cascades in here */
.dmc-modal .dmc-field{margin-bottom:14px;}
.dmc-modal .dmc-flabel{display:block;margin:0 0 6px;font-size:13px;font-weight:600;
color:#071233;}
.dmc-modal .dmc-input{width:100%;box-sizing:border-box;padding:13px 15px;
font-family:inherit;font-size:15px;color:#071233;background:#F7FAFF;
border:1px solid #D8E3F5;border-radius:12px;outline:none;
transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;}
.dmc-modal .dmc-input:focus{border-color:#71B6FF;background:#fff;
box-shadow:0 0 0 4px rgba(113,182,255,.22);}
.dmc-modal .dmc-field.has-error .dmc-input{border-color:#D9646C;background:#FEF7F7;}
.dmc-modal .dmc-error-msg{display:none;margin:6px 0 0;font-size:12.5px;color:#C2545C;}
.dmc-modal .dmc-field.has-error .dmc-error-msg{display:block;}
.dmc-modal .dmc-form__submit{width:100%;margin-top:6px;
display:inline-flex;align-items:center;justify-content:center;gap:10px;
padding:16px 24px;border:0;border-radius:999px;cursor:pointer;
font-family:Montserrat,system-ui,sans-serif;font-weight:600;font-size:15px;
color:#00155D;background:#71B6FF;
box-shadow:0 16px 34px -14px rgba(113,182,255,.75);
transition:background .2s ease,transform .2s ease,box-shadow .2s ease;}
.dmc-modal .dmc-form__submit:hover{background:#A8D0FF;transform:translateY(-2px);}
.dmc-modal .dmc-form__submit:disabled{opacity:.6;cursor:default;transform:none;}
.dmc-modal .dmc-submit-label{color:inherit;}
.dmc-modal .dmc-form__status{margin-top:12px;font-size:13.5px;line-height:1.55;
color:#45557E;}
.dmc-modal .dmc-form__status.is-error{color:#C2545C;}
.dmc-modal .dmc-form__fineprint{margin:14px 0 0;font-size:12.5px;line-height:1.55;
color:#8494AD;text-align:center;}
@media (max-width:520px){
.dmc-modal{padding:12px;}
.dmc-modal__panel{padding:32px 22px 24px;border-radius:16px;}
}
body.dmc-modal-open{overflow:hidden;}
/* ── Referral network graphic ──────────────────────────────────────────────
Used in the dmc-ref__side column. Pure SVG + CSS, no JS, no dependencies.
Scales on its viewBox so it is responsive by construction. Motion is
decorative only and is disabled under prefers-reduced-motion. */
.dmc-refnet{position:relative;width:min(560px,100%);margin:0 auto 26px;}
.dmc-refnet__svg{display:block;width:100%;height:auto;overflow:visible;}
/* faint base spokes */
.dmc-refnet__spoke{stroke:rgba(113,182,255,.22);stroke-width:1.2;}
/* the flowing pulse that travels inward along each spoke */
.dmc-refnet__flow{
stroke:#71B6FF;stroke-width:1.8;stroke-linecap:round;
stroke-dasharray:14 132;stroke-dashoffset:146;
animation:dmcFlow 3.4s linear infinite;
}
.dmc-refnet__ring{fill:none;stroke:rgba(113,182,255,.14);stroke-width:1;}
.dmc-refnet__ring--slow{
stroke-dasharray:3 9;transform-origin:160px 160px;
animation:dmcRingSpin 90s linear infinite;
}
/* outer office nodes */
.dmc-refnet__node{fill:#0A2160;stroke:#71B6FF;stroke-width:1.6;}
.dmc-refnet__node--quiet{stroke:rgba(113,182,255,.34);}
.dmc-refnet__node--won{
fill:#71B6FF;stroke:#BFE0FF;stroke-width:2;
animation:dmcWon 3.4s ease-in-out infinite;
}
.dmc-refnet__dot{fill:#71B6FF;}
.dmc-refnet__dot--quiet{fill:rgba(113,182,255,.38);}
.dmc-refnet__dot--won{fill:#00155D;}
/* centre: the practice */
.dmc-refnet__core{fill:url(#dmcRefCore);stroke:rgba(113,182,255,.5);stroke-width:1.4;}
.dmc-refnet__halo{fill:none;stroke:#71B6FF;stroke-width:1.4;opacity:0;
transform-origin:160px 160px;animation:dmcHalo 3.4s ease-out infinite;}
.dmc-refnet__corelabel{fill:#fff;font:600 12px/1 Montserrat,system-ui,sans-serif;
text-anchor:middle;letter-spacing:.02em;}
@keyframes dmcFlow{to{stroke-dashoffset:0;}}
@keyframes dmcWon{0%,100%{opacity:1;}50%{opacity:.72;}}
@keyframes dmcHalo{0%{transform:scale(.72);opacity:.55;}70%{opacity:0;}100%{transform:scale(1.25);opacity:0;}}
@keyframes dmcRingSpin{to{transform:rotate(360deg);}}
/* legend */
.dmc-refnet__key{
display:flex;flex-wrap:wrap;gap:10px 20px;justify-content:center;
margin-top:4px;font-size:12.5px;color:var(--soft-2,#8FA3C8);
}
.dmc-refnet__key span{display:inline-flex;align-items:center;gap:7px;}
.dmc-refnet__key i{width:9px;height:9px;border-radius:50%;flex:0 0 auto;}
.dmc-refnet__key i.is-active{background:#71B6FF;}
.dmc-refnet__key i.is-quiet{background:transparent;border:1.5px solid rgba(113,182,255,.4);}
.dmc-refnet__key i.is-won{background:#71B6FF;box-shadow:0 0 0 3px rgba(113,182,255,.25);}
@media (max-width:600px){
.dmc-refnet{width:min(340px,100%);}
.dmc-refnet__key{font-size:11.5px;gap:8px 14px;}
}
@media (prefers-reduced-motion:reduce){
.dmc-refnet__flow,.dmc-refnet__won,.dmc-refnet__halo,
.dmc-refnet__ring--slow,.dmc-refnet__node--won{animation:none;}
.dmc-refnet__flow{stroke-dashoffset:0;stroke-dasharray:none;opacity:.5;}
}
/* ── Anatomy of a converting dental page ───────────────────────────────────
Used in the dmc-ref__side column of the dental-website-design page. Pure
SVG + CSS, no JS. A scan travels down a wireframe and each converting
element lights as it is reached. Labels states, never quantities. Motion is
decorative and is disabled under prefers-reduced-motion. */
.dmc-anat{position:relative;width:min(560px,100%);margin:0 auto 26px;}
.dmc-anat__svg{display:block;width:100%;height:auto;overflow:visible;}
.dmc-anat__frame{fill:url(#dmcAnatBg);stroke:rgba(113,182,255,.45);stroke-width:1.4;}
.dmc-anat__chrome{fill:rgba(113,182,255,.10);}
.dmc-anat__dot{fill:rgba(113,182,255,.45);}
/* inert page furniture */
.dmc-anat__line{fill:rgba(113,182,255,.20);}
.dmc-anat__block{fill:rgba(113,182,255,.07);stroke:rgba(113,182,255,.16);stroke-width:1;}
/* the elements that actually convert */
/* The rest state must already read as "this one converts", because the page is
screenshotted, printed and viewed under prefers-reduced-motion. The animation
sharpens an existing contrast, it does not create it. */
.dmc-anat__hot{
fill:rgba(113,182,255,.17);stroke:#71B6FF;stroke-width:1.5;stroke-opacity:.62;
animation:dmcAnatHot 5s ease-in-out infinite;animation-delay:var(--ad,0s);
}
.dmc-anat__pill{fill:rgba(113,182,255,.34);}
.dmc-anat__star{fill:#71B6FF;opacity:.65;}
/* the travelling scan */
.dmc-anat__scan{fill:url(#dmcAnatScan);animation:dmcAnatScan 5s ease-in-out infinite;}
/* right-hand annotations */
.dmc-anat__lead{stroke:rgba(0,21,93,.22);stroke-width:1;stroke-dasharray:2 3;}
.dmc-anat__badge{fill:#00155D;}
.dmc-anat__num{fill:#fff;font:600 9px/1 Montserrat,system-ui,sans-serif;text-anchor:middle;}
.dmc-anat__label{fill:#00155D;font:600 11.5px/1 'Plus Jakarta Sans',system-ui,sans-serif;}
@keyframes dmcAnatHot{
0%,100%{fill:rgba(113,182,255,.17);stroke-opacity:.62;}
4%{fill:rgba(113,182,255,.38);stroke-opacity:1;}
16%{fill:rgba(113,182,255,.17);stroke-opacity:.62;}
}
@keyframes dmcAnatScan{
0%{transform:translateY(0);opacity:0;}
4%{opacity:.9;}
10%{transform:translateY(25px);}
30%{transform:translateY(88px);}
50%{transform:translateY(123px);}
70%{transform:translateY(159px);}
92%{transform:translateY(233px);opacity:.9;}
100%{transform:translateY(268px);opacity:0;}
}
.dmc-anat__key{
display:flex;flex-wrap:wrap;gap:10px 20px;justify-content:center;
margin-top:4px;font-size:12.5px;color:var(--soft-2,#8FA3C8);
}
.dmc-anat__key span{display:inline-flex;align-items:center;gap:7px;}
.dmc-anat__key i{width:9px;height:9px;border-radius:2px;flex:0 0 auto;
background:#71B6FF;}
.dmc-anat__key i.is-plain{background:transparent;border:1.5px solid rgba(113,182,255,.4);}
@media (max-width:600px){
.dmc-anat{width:min(360px,100%);}
.dmc-anat__key{font-size:11.5px;gap:8px 14px;}
.dmc-anat__label{font-size:12.5px;}
}
@media (prefers-reduced-motion:reduce){
.dmc-anat__hot,.dmc-anat__scan{animation:none;}
.dmc-anat__scan{opacity:0;}
.dmc-anat__hot{fill:rgba(113,182,255,.28);stroke-opacity:1;}
}
/* ── Hero subheading ───────────────────────────────────────────────────────
The live dental-website-design page carries a sky italic subheading between
the H1 and the lead. It was missing from the first rebuild. Sentence case is
not forced here because the live text is title case and is a ranking asset.
Never letterspaced, never all caps: that reads as AI generated. */
.dmc-hero__sub{
margin:-4px 0 16px;font-family:'Plus Jakarta Sans',system-ui,sans-serif;
font-style:italic;font-weight:700;color:#71B6FF;
font-size:clamp(1.02rem,1.55vw,1.28rem);line-height:1.34;
}
@media (max-width:768px){
.dmc-hero__sub{font-size:1.05rem;margin-bottom:14px;}
}
/* A serv-row placed inside a dark section: the component was authored for the
light homepage band, so the body copy needs the dark palette restated.
Uses --soft, the same token as .dmc-lead, not the dimmer --soft-2. At 16px
on navy the dimmer token read as unreadable next to a large mockup. */
.dmc-dark .dmc-serv-row__body p{color:var(--soft,#C2CEEC);}
.dmc-dark .dmc-serv-row__body .dmc-checks li{color:#E6EDFA;}
/* Serv-row body copy carrying a live page's own paragraphs is lead copy, not a
caption, and must match .dmc-lead exactly (19.44px at 1440, the size used in
the endodontist "Why DMC" section).
CASCADE NOTE, this is the trap in this component: the base rule is
`.dmc-serv-row__body > p` at specificity (0,1,1), which OUTRANKS a bare
`.dmc-lead` at (0,1,0). Adding class="dmc-lead" to the markup alone does
nothing. The override has to carry both classes and the element to win at
(0,2,1). Verified by measuring computed styles, not by eye. */
.dmc-serv-row__body > p.dmc-lead{
font-size:clamp(1.05rem,1.35vw,1.22rem);line-height:1.8;
}
/* The live pages carry an H3 subheading under the H2 and a paragraph under
that. Without this the subheading sits flush on the paragraph and stops
reading as a subheading. Class-only selectors, per the cascade rules. */
.dmc-sec-head .dmc-h3,
.dmc-serv__head .dmc-h3,
.dmc-ref__copy .dmc-h3,
.dmc-lead__copy .dmc-h3{margin-top:14px;margin-bottom:12px;}
.dmc-sec-head p + .dmc-h3{margin-top:18px;}
/* ── Dashboard components, figures removed ────────────────────────────────
DASH and DASH_SEO displayed invented statistics: 41 keywords in the top
three, 63% organic share, 4.2x traffic growth, 11.6x return on SEO
investment, and on the client dashboard 164 inquiries, 96 booked consults,
81% show rate, 28.8x and 179.9x return on ad spend attributed to an "Oral
Surgery Client".
None appears anywhere on the live site, so the caption claiming the figures
"mirror the client dashboards already published across dentalmarketing.ca"
was false. The claims policy forbids invented statistics outright, caption or
no caption. Operator approved removal on 2026-08-07.
Both panels now show WHICH metrics the report carries. Values are replaced by
a neutral placeholder, and the rings and bars are levelled so that no shape
asserts a quantity either. The approved figures on the homepage stats band
(50%+, 71%, +$60K, one clinic per city) are untouched: those are evidenced. */
.dmc-kpi__blank{
display:block;width:46px;height:11px;border-radius:6px;
background:linear-gradient(90deg,rgba(113,182,255,.42),rgba(113,182,255,.16));
margin-bottom:2px;
}
.dmc-dash .dmc-ring .fg,
.dmc-dash .dmc-ring .fg--a,
.dmc-dash .dmc-ring .fg--b{stroke:rgba(113,182,255,.34);stroke-dasharray:150 54;}
.dmc-dash .dmc-bars{align-items:flex-end;min-height:44px;}
.dmc-dash .dmc-bars i{
height:38% !important;
background:linear-gradient(180deg,rgba(113,182,255,.38),rgba(113,182,255,.14));
border-radius:3px 3px 0 0;
}
@media (prefers-reduced-motion:reduce){
.dmc-dash .dmc-ring .fg{animation:none;}
}
/* ══ per-page graphic: _hero-hub ══ */
/* ── Hero hub ──────────────────────────────────────────────────────────────
The per-page hero graphic, second direction. Dean's brief: put the DMC mark
in the centre like the ecosystem wheel, branch out from it, but structure
the branches differently and make every branch specific to the avatar of
that landing page. Less "our services", more "what we will do for you".
HOW THIS DIFFERS FROM THE ECOSYSTEM WHEEL, deliberately, because both sit
on the same page and must not read as the same graphic twice:
ecosystem wheel (section 8) hero hub (this file)
------------------------------ ------------------------------
what DMC is what DMC does for this reader
square, 1:1 landscape, matches the hero slot
8 nodes, rigid 45 degree spokes 6 branches, curved, elliptical orbit
one service name per node a claim plus a qualifier per branch
constant slow rotation a signal travelling out each branch
identical on all 26 pages different words on every page
NO NUMBERS. ANYWHERE. Same rule as the hero stage. A graphic with invented
figures is a claim a prospect can challenge. One with none says "this is
what we do" and asserts nothing that is not already on the page.
NO ALL-CAPS LETTERSPACED LABELS. House rule.
EVERY BRANCH MUST BE TRACEABLE TO COPY ALREADY ON THAT PAGE. The graphic is
not a place to introduce a new promise.
THE PREFIX IS dmc-hhub. Checked against the generated stylesheet before
use. `.dmc-hp` is the lead form honeypot (left:-5000px) and a panel using
that prefix once rendered perfectly alone and was invisible in the page.
FOUR THINGS THAT ARE REQUIRED, NOT DECORATIVE:
1. aspect-ratio on the svg. The hero slot is a grid child with
indeterminate height; an ![]()
self sizes, an inline