/*
Theme Name: Dynamic Maritime - Multipage (Phase II v2.0.0)
Theme URI: https://www.dynamicmaritime.net
Author: Havilah Design
Author URI: https://havilahdesign.com
Description: Full multi-page corporate website for Dynamic Maritime Ltd - a wholly indigenous Ghanaian-owned marine assurance and offshore technical consultancy. v2.0 "Chart Room" redesign: Archivo / Instrument Sans / IBM Plex Mono typography, deep marine navy with amber signal accents, chart-graticule textures, ledger-style listings and refined motion. Same content, structure and Customizer options as v1.8.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dynamic-maritime-multipage
*/

/* ================================================================
   DESIGN TOKENS — "Chart Room"
   ================================================================ */
:root{
  --navy:#0B1D3A;          /* customizer default key — deep marine */
  --navy-950:#040B18;
  --navy-900:#071223;
  --navy-800:#0C1E36;
  --navy-700:#1A3352;
  --brand:#2472E6; --brand-dk:#1257BE; --brand-soft:#8CC9F5;
  --amber:#EFA33B; --amber-soft:#F6C77E;
  --ink:#0D1A2B; --body:#3E4E66; --muted:#68788F; --line:#DFE6EF;
  --line-d:rgba(140,190,240,.16);
  --bg:#FFFFFF; --bg-alt:#F2F5FA; --on-dark:#B9C8DD; --on-dark-soft:#7E90AB;
  --f-head:'Archivo','Montserrat',-apple-system,sans-serif;
  --f-body:'Instrument Sans','Open Sans',-apple-system,sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',monospace;
  --wide:112%;
  --container:1220px; --rad:3px; --rad-lg:10px;
  --ease:cubic-bezier(.22,.75,.25,1);
  --shadow-soft:0 2px 6px rgba(11,26,48,.05),0 18px 40px -24px rgba(11,26,48,.18);
  --shadow-card:0 24px 48px -20px rgba(11,26,48,.22),0 8px 18px -10px rgba(11,26,48,.10);
  --grad-deep:linear-gradient(150deg,#0C1E36 0%,#071223 60%,#040B18 100%);
  --grad-brand:linear-gradient(120deg,var(--brand) 0%,var(--brand-dk) 100%);
  /* chart graticule tiles (crosshair + edge ruler ticks) */
  --tex-cross:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cg stroke='%238CC9F5' stroke-width='1' opacity='.35'%3E%3Cline x1='70' y1='63' x2='70' y2='77'/%3E%3Cline x1='63' y1='70' x2='77' y2='70'/%3E%3C/g%3E%3C/svg%3E");
  --tex-cross-ink:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cg stroke='%230B1D3A' stroke-width='1' opacity='.5'%3E%3Cline x1='70' y1='63' x2='70' y2='77'/%3E%3Cline x1='63' y1='70' x2='77' y2='70'/%3E%3C/g%3E%3C/svg%3E");
  --tex-ruler:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='10'%3E%3Cline x1='12' y1='0' x2='12' y2='7' stroke='%238CC9F5' stroke-width='1' opacity='.5'/%3E%3C/svg%3E");
}

/* ================================================================
   BASE
   ================================================================ */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--f-body);color:var(--body);background:var(--bg);font-size:16.5px;line-height:1.72;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,h5{font-family:var(--f-head);color:var(--ink);line-height:1.12;font-weight:700;text-wrap:balance}
a{color:inherit;text-decoration:none}
img{max-width:100%}
p{text-wrap:pretty}
.container{max-width:var(--container);margin:0 auto;padding:0 28px}
::selection{background:var(--brand);color:#fff}

/* section rhythm */
section.block{padding:clamp(68px,9vw,120px) 0;position:relative}
.bg-alt{background:var(--bg-alt)}
.bg-navy{background:var(--navy-900);color:var(--on-dark);position:relative}
.bg-navy h2,.bg-navy h3,.bg-navy h4{color:#fff}

/* the mono "surveyor's register" voice — eyebrows */
.eyebrow{font-family:var(--f-mono);font-size:.72rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--brand-dk);display:inline-flex;align-items:center;gap:12px;margin-bottom:20px}
.eyebrow:before{content:"";width:22px;height:1px;background:var(--amber);flex-shrink:0}
.eyebrow.on-dark{color:var(--brand-soft)}
h2.title{font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:680;font-stretch:var(--wide);letter-spacing:-.022em;margin-bottom:18px}
.lead{font-size:1.1rem;color:var(--muted);max-width:660px;line-height:1.75}

/* icons: thin, precise strokes */
.icn{width:24px;height:24px;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* ================================================================
   BUTTONS — engineered, sentence case, sharp
   ================================================================ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-head);font-size:.95rem;font-weight:600;letter-spacing:.01em;padding:15px 27px;border-radius:var(--rad);cursor:pointer;border:1px solid transparent;transition:all .28s var(--ease);white-space:nowrap;position:relative;overflow:hidden}
.btn .icn{width:17px;height:17px;stroke-width:1.8;transition:transform .28s var(--ease)}
.btn:hover .icn{transform:translateX(4px)}
.btn-brand{background:var(--brand);color:#fff;border-color:var(--brand);box-shadow:0 10px 24px -12px rgba(36,114,230,.65)}
.btn-brand:hover{background:var(--brand-dk);border-color:var(--brand-dk);transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(18,87,190,.6)}
.btn-ghost-l{background:rgba(255,255,255,.02);color:#fff;border-color:rgba(255,255,255,.32);backdrop-filter:blur(3px)}
.btn-ghost-l:hover{border-color:var(--brand-soft);color:var(--brand-soft);transform:translateY(-2px)}
.btn-ghost-d{background:transparent;color:var(--ink);border-color:#C4D0E0}
.btn-ghost-d:hover{border-color:var(--brand);color:var(--brand-dk);transform:translateY(-2px)}
.btn-white{background:#fff;color:var(--navy);border-color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}

/* ================================================================
   TOPBAR — mono utility strip
   ================================================================ */
.topbar{background:var(--navy-950);color:#8FA2BE;transition:height .3s ease,opacity .3s ease;overflow:hidden;border-bottom:1px solid rgba(140,190,240,.08)}
.topbar .in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:40px}
.topbar a{color:#AFC1DA;transition:.15s}
.topbar a:hover{color:#fff}
.topbar .tb-l{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:.72rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
.topbar .tb-l:before{content:"";width:7px;height:7px;border-radius:50%;background:#43D17C;box-shadow:0 0 0 3px rgba(67,209,124,.18);animation:dmlPing 2.4s ease-out infinite}
@keyframes dmlPing{0%,100%{box-shadow:0 0 0 3px rgba(67,209,124,.18)}50%{box-shadow:0 0 0 6px rgba(67,209,124,.06)}}
.topbar .tb-l .icn{width:14px;height:14px;stroke:var(--brand-soft)}
.topbar .tb-l b{color:var(--brand-soft);font-weight:600}
.topbar .tb-r{display:inline-flex;align-items:center;gap:24px;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.02em}
.topbar .tb-r span{display:inline-flex;align-items:center;gap:8px}
.topbar .tb-r .icn{width:13px;height:13px;stroke:currentColor;opacity:.7}
header.scrolled .topbar{height:0;opacity:0;pointer-events:none}

/* ================================================================
   HEADER / NAV
   ================================================================ */
header{position:fixed;top:0;left:0;right:0;z-index:100;transition:.35s var(--ease);background:#fff;border-bottom:1px solid #E7ECF3}
header.scrolled{box-shadow:0 12px 34px -18px rgba(11,26,48,.28);background:rgba(255,255,255,.88);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;position:relative}
.brand{display:flex;align-items:center;cursor:pointer}
.logo-img{height:46px;width:auto;display:block;transition:height .3s var(--ease)}
header.scrolled .logo-img{height:40px}
.logo-img-f{height:56px;width:auto;display:block;margin-bottom:2px}
@media(max-width:560px){.logo-img{height:36px}}
.menu{display:flex;align-items:center;gap:2px;list-style:none}
.menu a{font-family:var(--f-head);font-size:.93rem;font-weight:560;color:var(--ink);padding:10px 14px;border-radius:var(--rad);transition:.18s;cursor:pointer;position:relative}
.menu a:hover,.menu a.active{color:var(--brand-dk)}
.menu a.active:after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;background:var(--amber)}
.has-sub{position:relative}
.has-sub>a:after{display:none}
.submenu{position:absolute;top:calc(100% + 6px);left:0;background:#fff;border:1px solid var(--line);border-radius:6px;min-width:264px;padding:8px;opacity:0;visibility:hidden;transform:translateY(10px);transition:.24s var(--ease);box-shadow:0 30px 60px -20px rgba(11,26,48,.3),0 4px 14px -6px rgba(11,26,48,.12)}
.has-sub:hover .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.submenu a{display:block;padding:11px 13px;font-size:.86rem;font-weight:500;color:var(--body);border-radius:4px}
.submenu a:hover{background:var(--bg-alt);color:var(--brand-dk)}
.submenu a:after{display:none}
.nav-cta{margin-left:12px;padding:12px 20px;font-size:.86rem}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.burger span{width:24px;height:2px;background:var(--ink);transition:.25s}

/* ================================================================
   HERO — cinematic chart-plot
   ================================================================ */
.hero{position:relative;background:var(--navy-950);color:#fff;overflow:hidden;padding-top:116px}
/* graticule overlay: crosshair grid + edge ruler + corner coordinates */
.hero-grid{position:absolute;inset:0;pointer-events:none;background-image:var(--tex-cross);background-size:140px 140px;opacity:.5;mask-image:radial-gradient(120% 120% at 78% 30%,#000 30%,transparent 78%);-webkit-mask-image:radial-gradient(120% 120% at 78% 30%,#000 30%,transparent 78%)}
.hero-grid:before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background-image:var(--tex-ruler);background-repeat:repeat-x;opacity:.5}
.hero-grid:after{content:"05°38′N · 000°01′W — TEMA ANCHORAGE, GHANA";position:absolute;right:30px;bottom:26px;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.22em;color:var(--brand-soft);opacity:.6;white-space:nowrap}
.hero-arcs{position:absolute;right:-180px;top:50%;transform:translateY(-50%);width:760px;height:760px;opacity:.35;pointer-events:none}
.hero-inner{position:relative;z-index:2;padding:clamp(44px,5.5vw,78px) 0 clamp(64px,7vw,96px);max-width:900px}
.hero h1{color:#fff;font-size:clamp(2.5rem,5.4vw,4.35rem);font-weight:740;font-stretch:var(--wide);letter-spacing:-.028em;line-height:1.04}
.hero .sub{font-size:clamp(1.05rem,1.5vw,1.22rem);color:var(--on-dark);margin-top:26px;max-width:640px;line-height:1.7}
.hero .eyebrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:26px;color:var(--brand-soft)}
.hero .eyebrow:before{background:var(--amber);width:30px}
.hero .eyebrow span{display:inline-flex;align-items:center;gap:14px}
.dot{width:4px;height:4px;border-radius:50%;background:var(--amber)}
/* scroll cue */
.hero:after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:64px;background:linear-gradient(var(--brand-soft),transparent);opacity:.55;animation:dmlPlumb 2.6s var(--ease) infinite;z-index:3}
@keyframes dmlPlumb{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ================================================================
   KPI BAND — instrument readout
   ================================================================ */
.kpi{background:var(--navy-900);border-top:1px solid var(--line-d);position:relative;overflow:hidden}
.kpi:before{content:"";position:absolute;inset:0;background-image:var(--tex-cross);background-size:140px 140px;opacity:.22;pointer-events:none}
.kpi .grid{display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.kpi .cell{padding:52px 34px 46px;text-align:left;border-right:1px solid var(--line-d);position:relative}
.kpi .cell:before{content:"";position:absolute;top:0;left:34px;width:30px;height:2px;background:var(--amber)}
.kpi .cell:last-child{border-right:0}
.kpi .ic{display:none}
.kpi .num{font-family:var(--f-head);font-size:clamp(2.9rem,4vw,3.9rem);font-weight:760;font-stretch:var(--wide);color:#fff;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kpi .lab{font-family:var(--f-mono);font-size:.72rem;color:var(--on-dark-soft);margin-top:14px;letter-spacing:.14em;text-transform:uppercase;line-height:1.6}

/* ================================================================
   GRIDS & CARDS — typographic-first, mono indices, no icon tiles
   ================================================================ */
/* lifecycle cards */
.feature-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:18px;counter-reset:feat}
.feat{flex:1 1 300px;max-width:380px;padding:30px 28px 28px;background:var(--bg);border:1px solid var(--line);border-radius:var(--rad-lg);transition:.3s var(--ease);position:relative;overflow:hidden;counter-increment:feat}
.feat:before{content:"0" counter(feat);position:absolute;top:26px;right:26px;font-family:var(--f-mono);font-size:.74rem;letter-spacing:.1em;color:var(--muted);opacity:.75;transition:.3s}
.feat:after{content:"";position:absolute;top:0;left:0;width:100%;height:2px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.feat:hover{border-color:#C9D7EA;transform:translateY(-4px)}
.feat:hover:after{transform:scaleX(1)}
.feat:hover:before{color:var(--brand-dk)}
.bg-alt .feat{background:#fff}
.feat .ic{width:30px;height:30px;border-radius:0;background:none;color:var(--brand-dk);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.feat .ic .icn{width:26px;height:26px;stroke-width:1.4}
.feat h4{font-size:1.06rem;font-weight:640;margin-bottom:8px;color:var(--ink);padding-right:40px}
.feat p{font-size:.92rem;color:var(--muted);margin:0;line-height:1.66}

/* discipline cards — flagship, navy sweep on hover */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:18px;counter-reset:svc}
.svc{background:#fff;border:1px solid var(--line);border-radius:var(--rad-lg);overflow:hidden;display:flex;flex-direction:column;transition:.34s var(--ease);position:relative;counter-increment:svc}
.svc:before{content:"";position:absolute;inset:0;background:var(--grad-deep);transform:translateY(101%);transition:transform .42s var(--ease);z-index:0}
.svc:hover{border-color:var(--navy-700);transform:translateY(-6px);box-shadow:var(--shadow-card)}
.svc:hover:before{transform:translateY(0)}
.svc .top{height:0;background:none}
.svc a.svc-link{color:inherit;display:flex;flex-direction:column;flex:1;position:relative;z-index:1}
.svc .bd{padding:28px 26px 26px;display:flex;flex-direction:column;flex:1}
.svc .bd:before{content:"0" counter(svc);font-family:var(--f-mono);font-size:.76rem;letter-spacing:.12em;color:var(--brand-dk);margin-bottom:44px;transition:.3s}
.svc .ic{width:44px;height:44px;color:var(--brand-dk);margin-bottom:18px;transition:.3s}
.svc .ic .icn{width:38px;height:38px;stroke-width:1.3;stroke:currentColor}
.svc h3{font-size:1.14rem;font-weight:640;margin-bottom:10px;transition:.3s}
.svc p{font-size:.9rem;color:var(--muted);flex:1;margin-bottom:20px;line-height:1.66;transition:.3s}
.svc .more{font-family:var(--f-mono);font-size:.7rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-dk);display:inline-flex;align-items:center;gap:8px;transition:.3s}
.svc .more .icn{transition:transform .3s var(--ease)}
.svc:hover .bd:before{color:var(--amber)}
.svc:hover .ic{color:var(--brand-soft)}
.svc:hover h3{color:#fff}
.svc:hover p{color:var(--on-dark)}
.svc:hover .more{color:var(--amber)}
.svc:hover .more .icn{transform:translateX(5px)}

/* who-we-support — ruled ledger rows on navy */
.sup-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:26px;border-top:1px solid var(--line-d);border-left:1px solid var(--line-d)}
.sup{display:flex;align-items:flex-start;gap:16px;padding:26px 26px 24px;background:transparent;border:0;border-right:1px solid var(--line-d);border-bottom:1px solid var(--line-d);border-radius:0;transition:background .3s}
.sup:hover{background:rgba(140,190,240,.05)}
.sup .ic{width:24px;height:24px;flex-shrink:0;color:var(--brand-soft);display:flex;align-items:center;justify-content:center;margin-top:2px}
.sup .ic .icn{width:22px;height:22px;stroke-width:1.4}
.sup .txt{display:flex;flex-direction:column}
.sup span{font-family:var(--f-head);font-weight:600;font-size:1rem;color:#EAF0F8}
.sup .txt em{font-style:normal;font-size:.84rem;color:var(--on-dark-soft);margin-top:6px;line-height:1.6}

/* checklist */
.checks{display:grid;grid-template-columns:1fr 1fr;gap:14px 34px;margin-top:8px}
.check{display:flex;gap:14px;align-items:flex-start}
.check .ic{flex-shrink:0;width:20px;height:20px;color:var(--amber);margin-top:4px}
.check .ic .icn,.check .icn{width:19px;height:19px;stroke-width:2}
.check p{margin:0;font-size:.97rem;color:var(--body);line-height:1.6}

/* split + panel */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.split .panel{background:var(--grad-deep);border:1px solid var(--line-d);border-radius:var(--rad-lg);padding:44px 42px;color:#fff;position:relative;overflow:hidden}
.split .panel:before{content:"";position:absolute;right:-70px;bottom:-70px;width:260px;height:260px;border:1px solid rgba(140,190,240,.16);border-radius:50%}
.split .panel:after{content:"";position:absolute;right:-20px;bottom:-20px;width:150px;height:150px;border:1px dashed rgba(140,190,240,.22);border-radius:50%}
.split .panel h3{color:#fff;font-size:1.3rem;font-weight:640;font-stretch:var(--wide);margin-bottom:20px}
.split .panel .mv{margin-bottom:22px}
.split .panel .mv .k{font-family:var(--f-mono);font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin-bottom:7px}
.split .panel .mv p{color:var(--on-dark);font-size:.96rem;margin:0}
.split .panel .check .ic{color:var(--amber)}
.split .panel .check p{color:var(--on-dark)}

/* quote band — editorial */
.band{background:var(--navy-900);color:#fff;text-align:center;overflow:hidden;position:relative}
.band:before{content:"";position:absolute;inset:0;background-image:var(--tex-cross);background-size:140px 140px;opacity:.16;pointer-events:none}
.band .container{max-width:920px;position:relative}
.band p{font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.55;color:#E9EFF8;font-family:var(--f-head);font-weight:520;font-stretch:105%;letter-spacing:-.01em;text-wrap:balance}
.band .mk{width:34px;height:2px;background:var(--amber);margin:0 auto 30px}
.band .w{display:inline-block}

/* logos — hairline strip (JS upgrades to marquee) */
.logos{display:flex;flex-wrap:wrap;justify-content:center;gap:0;margin-top:26px;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;overflow:hidden}
.logos .lg{flex:1 1 16.66%;min-width:158px;text-align:center;padding:30px 22px;font-family:var(--f-head);font-weight:600;font-size:.92rem;color:#8595AC;border:0;letter-spacing:.3px}
.logos .lg{display:flex;align-items:center;justify-content:center;min-height:104px}
.logos .lg img{max-width:132px;max-height:52px;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.5;transition:filter .3s,opacity .3s,transform .3s var(--ease)}
.logos .lg:hover img{filter:grayscale(0);opacity:1;transform:scale(1.05)}
/* marquee mode (applied by JS: track duplicated) */
.logos.mq{flex-wrap:nowrap;justify-content:flex-start;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logos.mq .mq-track{display:flex;align-items:center;flex-shrink:0;animation:dmlMarquee var(--mq-dur,36s) linear infinite}
.logos.mq .lg{flex:0 0 auto;min-width:0;padding:26px 38px}
.logos.mq:hover .mq-track{animation-play-state:paused}
@keyframes dmlMarquee{to{transform:translateX(-100%)}}

/* ================================================================
   CLOSING CTA — three customizer themes
   ================================================================ */
.cta-final{text-align:center;position:relative;overflow:hidden}
.cta-final .container{position:relative;z-index:2;max-width:860px}
.cta-final h2{font-size:clamp(1.85rem,3.2vw,2.7rem);font-weight:680;font-stretch:var(--wide);letter-spacing:-.02em;margin-bottom:16px}
.cta-final p{font-size:1.06rem;max-width:640px;margin:0 auto;line-height:1.72}
.cta-final .btn-row{justify-content:center}
.cta-final.is-light{background:#fff;border-top:1px solid var(--line)}
.cta-final.is-light:before{content:"";position:absolute;inset:0;background:radial-gradient(58% 90% at 50% 0%,rgba(36,114,230,.06),transparent 62%)}
.cta-final.is-light h2{color:var(--navy)}
.cta-final.is-light p{color:var(--muted)}
.cta-final.is-light .btn-ghost-l{background:transparent;color:var(--ink);border-color:#C4D0E0;backdrop-filter:none}
.cta-final.is-light .btn-ghost-l:hover{border-color:var(--brand);color:var(--brand-dk)}
.cta-final.is-brand{background:var(--grad-brand);color:#fff}
.cta-final.is-brand:before{content:"";position:absolute;inset:0;background-image:var(--tex-cross);background-size:140px 140px;opacity:.35;mask-image:radial-gradient(circle at 50% 25%,#000,transparent 72%);-webkit-mask-image:radial-gradient(circle at 50% 25%,#000,transparent 72%)}
.cta-final.is-brand h2{color:#fff}
.cta-final.is-brand p{color:#EAF2FF}
.cta-final.is-brand .btn-brand{background:#fff;color:var(--brand-dk);border-color:#fff;box-shadow:none}
.cta-final.is-brand .btn-brand:hover{background:#EAF2FF;color:var(--brand-dk)}
.cta-final.is-brand .btn-ghost-l:hover{border-color:#fff;color:#fff}
.cta-final.is-navy{background:var(--grad-deep);color:#fff;border-top:2px solid var(--amber)}
.cta-final.is-navy:before{content:"";position:absolute;inset:0;background-image:var(--tex-cross);background-size:140px 140px;opacity:.3;mask-image:radial-gradient(circle at 50% 30%,#000,transparent 78%);-webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 78%)}
.cta-final.is-navy h2{color:#fff}
.cta-final.is-navy p{color:var(--on-dark)}
.cta-final.is-navy .btn-brand{background:#fff;color:var(--navy);border-color:#fff;box-shadow:none}
.cta-final.is-navy .btn-brand:hover{background:#EAF2FF;color:var(--navy)}
.cta-final.is-navy .btn-ghost-l:hover{border-color:#fff;color:#fff}

/* values (about) */
.values{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:14px}
.val{text-align:center;padding:26px 14px;background:#fff;border:1px solid var(--line);border-radius:var(--rad-lg);transition:.28s var(--ease)}
.val:hover{border-color:#C9D7EA;transform:translateY(-3px)}
.val .ic{width:30px;height:30px;margin:0 auto 12px;color:var(--brand-dk)}
.val .ic .icn{width:26px;height:26px;stroke-width:1.4}
.val span{font-family:var(--f-head);font-weight:600;font-size:.84rem;color:var(--ink);line-height:1.3;display:block}

/* ================================================================
   PAGE HERO (inner pages)
   ================================================================ */
.phero{background:var(--navy-950);color:#fff;padding:calc(76px + 76px) 0 78px;position:relative;overflow:hidden}
.phero:after{content:"";position:absolute;inset:0;background-image:var(--tex-cross);background-size:140px 140px;opacity:.4;mask-image:radial-gradient(110% 130% at 82% 20%,#000 25%,transparent 72%);-webkit-mask-image:radial-gradient(110% 130% at 82% 20%,#000 25%,transparent 72%);pointer-events:none}
.phero .hero-arcs{width:520px;height:520px;right:-140px;opacity:.3}
.phero h1{color:#fff;font-size:clamp(2.1rem,4.2vw,3.3rem);font-weight:720;font-stretch:var(--wide);letter-spacing:-.024em;position:relative;z-index:2}
.phero p{color:var(--on-dark);margin-top:18px;max-width:640px;font-size:1.1rem;position:relative;z-index:2}
.crumb{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--brand-soft);margin-bottom:20px;position:relative;z-index:2}

/* prose lists for service pages */
.two-list{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:10px}
.li-head{font-family:var(--f-head);font-weight:640;color:var(--ink);font-size:1.06rem;margin-bottom:16px;padding-bottom:10px;border-bottom:2px solid var(--amber);display:inline-block}
.ticks{list-style:none}
.ticks li{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px;font-size:.97rem;color:var(--body)}
.ticks li .ic{flex-shrink:0;width:18px;height:18px;color:var(--amber);margin-top:4px}
.ticks li .ic .icn,.ticks li .icn{width:17px;height:17px;stroke-width:2.2}

/* ================================================================
   CONTACT (legacy grid kept for compatibility)
   ================================================================ */
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--rad-lg);padding:36px;box-shadow:var(--shadow-soft)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{margin-bottom:16px}
.field label{display:block;font-family:var(--f-mono);font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin-bottom:7px}
.field input,.field select,.field textarea{width:100%;padding:13px 15px;border:1px solid #CFDAE8;border-radius:var(--rad);font-family:var(--f-body);font-size:.95rem;color:var(--ink);background:#FBFCFE;transition:.18s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(36,114,230,.14)}
.field textarea{resize:vertical;min-height:110px}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.85rem;color:var(--muted);margin-bottom:20px}
.consent input{margin-top:4px}
.cinfo{display:flex;flex-direction:column;height:100%}
.cinfo .ci{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line)}
.cinfo .ci .ic{width:42px;height:42px;flex-shrink:0;border-radius:var(--rad);background:var(--navy-900);color:var(--brand-soft);display:flex;align-items:center;justify-content:center}
.cinfo .ci .ic .icn{width:19px;height:19px}
.cinfo .ci .k{font-family:var(--f-mono);font-size:.66rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.cinfo .ci .v{color:var(--ink);font-weight:600;font-size:.98rem}
.map{margin-top:24px;flex:1 1 auto;min-height:280px;border-radius:var(--rad-lg);background:var(--navy-900);position:relative;overflow:hidden;border:1px solid var(--navy-700)}
.map .mg{position:absolute;inset:0;background-image:var(--tex-cross);background-size:120px 120px;opacity:.5}
.map .pin{position:absolute;top:50%;left:50%;transform:translate(-50%,-100%);color:var(--amber);text-align:center}
.map .pin .icn{width:32px;height:32px;stroke-width:1.8}
.map .lbl{position:absolute;bottom:14px;left:16px;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;color:#fff;background:rgba(4,11,24,.75);padding:7px 12px;border-radius:var(--rad);border:1px solid var(--line-d)}
.map iframe,.map-frame{position:absolute;top:0;left:0;width:100%;height:100%;border:0;margin:0;display:block}

/* ================================================================
   FOOTER
   ================================================================ */
footer{background:var(--navy-950);color:var(--on-dark-soft);padding-top:72px;position:relative}
footer:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(140,190,240,.35),transparent)}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1.2fr 1.4fr;gap:44px;padding-bottom:52px;border-bottom:1px solid rgba(140,190,240,.1)}
.fcol h5{font-family:var(--f-mono);font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-soft);margin-bottom:20px}
.fcol .blurb{font-size:.9rem;line-height:1.75;color:var(--on-dark-soft);margin-top:16px}
.fcol ul{list-style:none}
.fcol ul li{margin-bottom:11px}
.fcol ul a{font-size:.9rem;color:var(--on-dark-soft);transition:.15s;position:relative;display:inline-block}
.fcol ul a:hover{color:#fff}
.fcol ul a:after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--amber);transition:width .28s ease}
.fcol ul a:hover:after{width:100%}
.fcol .ci{display:flex;gap:11px;margin-bottom:13px;font-size:.88rem;line-height:1.5;color:var(--on-dark-soft)}
.fcol .ci .icn{width:16px;height:16px;flex-shrink:0;margin-top:3px;stroke:var(--brand-soft);opacity:.8}
.fbrand{display:flex;align-items:center;gap:11px}
.fbrand .mark{width:38px;height:38px}
.fbrand .bt{font-family:var(--f-head);color:#fff;font-weight:700;font-size:.98rem;letter-spacing:.4px;line-height:1.1}
.fbrand .bs{display:block;font-size:.6rem;letter-spacing:1px;text-transform:uppercase;color:var(--brand-soft);margin-top:2px}
.ftag{font-family:var(--f-mono);font-size:.68rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-top:18px;line-height:1.7}
.f24{margin-top:4px;padding-top:14px;border-top:1px solid rgba(140,190,240,.1)}
.f24 .k{font-family:var(--f-mono);font-size:.62rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--brand-soft);margin-bottom:4px}
.f24 .v{font-family:var(--f-head);font-weight:700;font-size:1.05rem;color:#fff}
.fsoc{display:flex;gap:10px;margin-top:22px}
.fsoc a{width:38px;height:38px;border:1px solid rgba(140,190,240,.18);border-radius:var(--rad);display:flex;align-items:center;justify-content:center;color:var(--on-dark-soft);transition:.24s var(--ease)}
.fsoc a:hover{border-color:var(--amber);color:var(--amber);transform:translateY(-2px)}
.fsoc .icn{width:17px;height:17px}
.fbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding:24px 0}
.fbar .tag{font-family:var(--f-mono);font-size:.7rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-soft)}
.fbar .cp{font-size:.8rem;color:#54678A}
.logo-img-f{filter:drop-shadow(0 1px 10px rgba(210,230,255,.3))}

/* ================================================================
   REVEAL & MOTION FOUNDATION
   ================================================================ */
.js-on .rv{opacity:0;transform:translateY(30px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.js-on .rv.in{opacity:1;transform:none}
/* section-head rule draw */
.sec-head .title{position:relative;padding-bottom:0}
/* hero entrance */
.js-on .hero .hero-inner>*{animation:dmlRise 1s var(--ease) both}
.js-on .hero .hero-inner>*:nth-child(2){animation-delay:.14s}
.js-on .hero .hero-inner>*:nth-child(3){animation-delay:.28s}
.js-on .hero .hero-inner>*:nth-child(4){animation-delay:.42s}
.js-on .hero .hero-inner>*:nth-child(5){animation-delay:.56s}
@keyframes dmlRise{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
/* ambient drift in hero graticule */
.hero-grid{animation:dmlDrift 60s linear infinite}
@keyframes dmlDrift{to{background-position:140px 140px}}
.hero-arcs{animation:dmlSpin 140s linear infinite}
@keyframes dmlSpin{to{transform:translateY(-50%) rotate(1turn)}}
/* staggered child reveal for grids (JS adds .stg / .in) */
.js-on .stg>*{opacity:0;transform:translateY(22px)}
.stg.in>*{opacity:1;transform:none;transition:opacity .7s ease,transform .7s var(--ease);transition-delay:calc(var(--ri,0)*.07s)}
/* parallax layers (JS sets --par) */
.js-on .hero{--par:0}
.js-on .hero .hero-inner{transform:translateY(calc(var(--par)*.16px));will-change:transform}
.js-on .hero .hero-grid{transform:translateY(calc(var(--par)*.3px))}

/* scroll progress hairline */
.scrollbar{position:fixed;top:0;left:0;height:2px;width:0;z-index:2000;background:linear-gradient(90deg,var(--brand),var(--amber));will-change:width}

/* focus */
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.wm-pin:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:3px}

/* tel reveal */
.tel-reveal{font-family:inherit;font-size:inherit;font-weight:600;background:none;border:0;padding:0;color:var(--brand);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;cursor:pointer}
.topbar .tel-reveal,.f24 .tel-reveal{color:var(--brand-soft)}
.tel-shown{font-weight:600;color:var(--brand)}
.topbar .tel-shown,.f24 .tel-shown{color:#fff}
.f24 .tel-reveal,.f24 .tel-shown{font-size:1.02rem}

/* ================================================================
   HOMEPAGE v3.7 SECTIONS — restyled
   ================================================================ */
.nav{position:relative}
.hero{padding-top:116px}
/* DML Advantage — ledger register (was pills) */
.adv-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:30px;counter-reset:adv;border-top:1px solid #CBD6E4;max-width:1020px;margin-left:auto;margin-right:auto}
.adv{max-width:none;display:flex;align-items:center;gap:20px;padding:21px 18px 21px 8px;background:transparent;border:0;border-bottom:1px solid #CBD6E4;border-radius:0;transition:background .3s,padding .3s var(--ease);counter-increment:adv;position:relative}
.adv:before{content:"0" counter(adv);font-family:var(--f-mono);font-size:.74rem;font-weight:500;color:var(--amber);letter-spacing:.08em;flex-shrink:0;width:30px}
.adv:hover{background:#fff;padding-left:16px}
.adv .ic{width:22px;height:22px;flex-shrink:0;border-radius:0;background:none;color:var(--brand-dk);display:flex;align-items:center;justify-content:center}
.adv .ic .icn{width:20px;height:20px;stroke-width:1.5}
.adv span{font-family:var(--f-head);font-weight:600;font-size:1rem;color:var(--ink);line-height:1.35}
.adv-note{max-width:780px;margin:40px auto 0;text-align:center;color:var(--body);font-size:1.06rem;line-height:1.75}
/* Assets — index tiles with ghost icon */
.asset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px;counter-reset:asset}
.asset{text-align:left;padding:30px 26px 26px;background:#fff;border:1px solid var(--line);border-radius:var(--rad-lg);transition:.3s var(--ease);position:relative;overflow:hidden;counter-increment:asset}
.asset:after{content:"0" counter(asset);position:absolute;top:24px;right:24px;font-family:var(--f-mono);font-size:.74rem;color:var(--muted);opacity:.7}
.asset:hover{transform:translateY(-4px);border-color:#C9D7EA;box-shadow:var(--shadow-soft)}
.asset .ic{width:34px;height:34px;margin:0 0 44px;border-radius:0;background:none;color:var(--brand-dk);display:flex;align-items:flex-start;justify-content:flex-start}
.asset .ic .icn{width:30px;height:30px;stroke-width:1.3}
.asset span{font-family:var(--f-head);font-weight:640;font-size:1.05rem;color:var(--ink)}
/* Who-we-support band seam */
section.bg-navy:has(.sup-grid){padding-bottom:0;z-index:1}
.band{padding:clamp(64px,8vw,100px) 0;margin-top:-1px}
.band .mk{margin:0 auto 30px}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media(max-width:1060px){
  .menu a{padding:10px 10px;font-size:.88rem}
  .nav-cta{display:none}
}
@media(max-width:980px){
  .menu,.nav-cta{display:none}
  .burger{display:flex}
  .kpi .grid{grid-template-columns:1fr 1fr}
  .kpi .cell{border-bottom:1px solid var(--line-d)}
  .kpi .cell:nth-child(2n){border-right:0}
  .feature-grid{gap:12px}
  .svc-grid{grid-template-columns:1fr 1fr}
  .sup-grid{grid-template-columns:1fr 1fr}
  .split,.contact-grid{grid-template-columns:1fr;gap:36px}
  .values{grid-template-columns:repeat(3,1fr)}
  .checks,.two-list,.frow{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr;gap:34px}
  .adv-grid{grid-template-columns:1fr}
  .asset-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .topbar .tb-r{display:none}
  .topbar .in{justify-content:center}
  .topbar .tb-l{font-size:.66rem}
  .hero-grid:after{display:none}
}
@media(max-width:560px){
  .kpi .grid,.feature-grid,.svc-grid,.sup-grid,.values,.fgrid,.asset-grid{grid-template-columns:1fr}
  .kpi .cell{border-right:0}
  .btn{width:100%;justify-content:center}
  .btn-row{flex-direction:column}
  .hero{padding-top:100px}
  .hero:after{display:none}
}

/* ================================================================
   MOBILE NAV
   ================================================================ */
@media(max-width:980px){
  .menu.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#fff;padding:10px 12px 14px;gap:0;border-top:1px solid var(--line);box-shadow:0 24px 40px rgba(11,29,58,.16);max-height:80vh;overflow-y:auto;-webkit-overflow-scrolling:touch;animation:dmlMenuDrop .22s ease both}
  .menu.open>li{width:100%;border-bottom:1px solid #EEF2F7}
  .menu.open>li:last-child{border-bottom:0}
  .menu.open>li>a{display:block;width:100%;padding:14px 12px;color:var(--ink);font-size:.98rem;font-weight:600;border-radius:6px}
  .menu.open>li>a:after{display:none}
  .menu.open .current-menu-item>a,.menu.open .current_page_item>a,.menu.open a.active{color:var(--brand-dk)}
  .menu.open .sub-menu,.menu.open .submenu{display:block;position:static;opacity:1;visibility:visible;transform:none;background:#F4F7FB;border:0;box-shadow:none;border-radius:8px;margin:2px 0 8px;padding:4px;min-width:0}
  .menu.open .sub-menu a,.menu.open .submenu a{display:block;padding:11px 14px;color:#33415A;font-size:.9rem;font-weight:500;border-radius:6px}
  .menu.open .sub-menu a:after,.menu.open .submenu a:after{display:none}
  .menu.open .sub-menu a:hover,.menu.open .submenu a:hover{background:#E7F0FB;color:var(--brand-dk)}
}
@keyframes dmlMenuDrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ================================================================
   WORDPRESS NAV ADAPTIONS
   ================================================================ */
.menu li{position:relative;list-style:none}
.menu .sub-menu{position:absolute;top:calc(100% + 6px);left:0;background:#fff;border:1px solid var(--line);border-radius:6px;min-width:264px;padding:8px;opacity:0;visibility:hidden;transform:translateY(10px);transition:.24s var(--ease);box-shadow:0 30px 60px -20px rgba(11,26,48,.3),0 4px 14px -6px rgba(11,26,48,.12);list-style:none}
.menu .menu-item-has-children:hover .sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.menu .sub-menu a{display:block;padding:11px 13px;font-size:.86rem;font-weight:500;color:var(--body);border-radius:4px}
.menu .sub-menu a:hover{background:var(--bg-alt);color:var(--brand-dk)}
.menu .sub-menu a:after{display:none}
.menu .current-menu-item>a,.menu .current_page_item>a{color:var(--brand-dk)}
.menu .current-menu-item>a:after,.menu .current_page_item>a:after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;background:var(--amber)}
.menu .menu-item-has-children>a:after{display:none}
@media(max-width:980px){.menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;background:transparent;border:0;box-shadow:none;padding:0 0 0 14px;min-width:0}}

section[id]{scroll-margin-top:88px}

/* ================================================================
   WPFORMS SKIN
   ================================================================ */
.form .wpforms-form .wpforms-field{padding:0 0 16px}
.form .wpforms-form .wpforms-field-label{font-family:var(--f-mono);font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin-bottom:7px}
.form .wpforms-form input[type=text],.form .wpforms-form input[type=email],.form .wpforms-form input[type=tel],.form .wpforms-form input[type=url],.form .wpforms-form input[type=number],.form .wpforms-form select,.form .wpforms-form textarea{width:100%;padding:13px 15px;border:1px solid #CFDAE8;border-radius:var(--rad);font-family:var(--f-body);font-size:.95rem;color:var(--ink);background:#FBFCFE}
.form .wpforms-form input:focus,.form .wpforms-form select:focus,.form .wpforms-form textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(36,114,230,.14)}
.form .wpforms-form textarea{min-height:110px;resize:vertical}
.form .wpforms-form .wpforms-submit{background:var(--brand);color:#fff;font-family:var(--f-head);font-weight:600;font-size:.95rem;border:none;border-radius:var(--rad);padding:14px 28px;cursor:pointer;transition:background .2s}
.form .wpforms-form .wpforms-submit:hover{background:var(--brand-dk)}

/* ================================================================
   REDUCED MOTION
   ================================================================ */
@media(prefers-reduced-motion:reduce){
  .js-on .rv{transition:none;opacity:1;transform:none}
  *{scroll-behavior:auto}
  .scrollbar{display:none}
  .js-on .hero .hero-inner>*{animation:none}
  .hero-grid,.hero-arcs,.hero:after{animation:none}
  .js-on .stg>*{opacity:1;transform:none}
  .btn:hover .icn{transform:none}
  .logos.mq .mq-track{animation:none}
  .topbar .tb-l:before{animation:none}
}