/* ZSS theme layer: fonts, accessibility and WP-specific additions.
   Loads after site.css (the ported v36 stylesheet) and overrides it. */

/* ── Neo Sans (WOFF2, was embedded OTF) ─────────────────────────────────── */
@font-face{font-family:'Neo Sans Std';src:url(../fonts/neo-sans-300.woff2) format('woff2');font-weight:300;font-display:swap;}
@font-face{font-family:'Neo Sans Std';src:url(../fonts/neo-sans-400.woff2) format('woff2');font-weight:400;font-display:swap;}
@font-face{font-family:'Neo Sans Std';src:url(../fonts/neo-sans-500.woff2) format('woff2');font-weight:500;font-display:swap;}
@font-face{font-family:'Neo Sans Std';src:url(../fonts/neo-sans-700.woff2) format('woff2');font-weight:700;font-display:swap;}
@font-face{font-family:'Neo Sans Std';src:url(../fonts/neo-sans-900.woff2) format('woff2');font-weight:900;font-display:swap;}

/* ── Utilities ──────────────────────────────────────────────────────────── */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:#0A2740;color:#fff;padding:10px 18px;border-radius:0 0 8px 0;font-weight:600;}
.skip-link:focus{left:0;}

/* ── Keyboard access (review F06) ───────────────────────────────────────── */
:focus-visible{outline:2px solid #F5A623;outline-offset:2px;border-radius:2px;}
nav a:focus-visible,.mnav a:focus-visible{outline-color:#F5A623;}

/* dropdowns: open on hover (as designed) AND on focus/explicit toggle */
.nitem{display:flex;align-items:center;gap:2px;}
.nitem:focus-within .dd,.nitem.open .dd{opacity:1;visibility:visible;transform:none;}
.ddbtn{background:transparent;border:0;padding:6px 4px;cursor:pointer;display:inline-flex;align-items:center;}
.ddbtn .chev{display:block;}
.nitem.open .ddbtn .chev{transform:rotate(225deg) translateY(-1px);}

/* burger + mobile close are now real buttons */
.burger{color:inherit;}
.mclose{background:transparent;border:0;cursor:pointer;font:inherit;color:#9fc2dd;display:block;margin-left:auto;padding:10px;}

/* ── AA link contrast in light content areas (review F18) ───────────────── */
.pbody a:not(.btn):not(.lm),.bsec a:not(.btn),main .container p a:not(.btn){
  color:#136297;text-decoration:underline;text-underline-offset:2px;}
.lm{color:#136297;}

/* ── Mobile conversion (review F15): keep the CTA at phone widths ───────── */
@media(max-width:540px){
  .navcta{display:inline-flex;padding:8px 12px;font-size:12.5px;letter-spacing:.3px;white-space:nowrap;}
  .navright{gap:8px;}
  .navlogo img{max-width:118px;height:auto;}
}
.heroctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;}
.heroctas .btn.pri{font-size:15px;}
.heroctas .ghost{display:inline-flex;align-items:center;padding:12px 22px;border:1px solid rgba(255,255,255,.35);border-radius:999px;color:#fff;font-weight:500;font-size:15px;}
.heroctas .ghost:hover{border-color:#fff;}

/* ── Search overlay as dialog ───────────────────────────────────────────── */
.sov[hidden]{display:none;}

/* ── Motion (review F06/F08) ────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none !important;transition:none !important;}
  html.js .rv{opacity:1;transform:none;}
}

/* ── Contact form (review F03) ──────────────────────────────────────────── */
.contact-body{max-width:860px;padding-top:34px;padding-bottom:70px;}
.cform{margin-top:26px;}
.cform .cgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;}
@media(max-width:640px){.cform .cgrid{grid-template-columns:1fr;}}
.cform label{display:block;font-weight:600;font-size:14px;color:#173B54;margin:14px 0 0;}
.cform input,.cform textarea{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:11px 13px;
  border:1px solid #C6D6E2;border-radius:8px;font:inherit;font-size:15px;color:#0F2C40;background:#fff;}
.cform input:focus,.cform textarea:focus{border-color:#136297;outline:2px solid rgba(19,98,151,.25);outline-offset:0;}
.cform button.btn{margin-top:20px;cursor:pointer;border:0;font:inherit;}
.cform-alt{margin-left:14px;font-size:14px;color:#4A6272;}
.cform-ok{background:#E8F4EE;border:1px solid #9CCDB4;color:#215C41;padding:12px 16px;border-radius:8px;}
.cform-err{background:#FAEDEC;border:1px solid #E0A9A4;color:#7C2D26;padding:12px 16px;border-radius:8px;}
.hp-field{position:absolute;left:-9999px;top:-9999px;}

/* ── WP admin bar coexistence ───────────────────────────────────────────── */
body.admin-bar nav{top:32px;}

/* Turnstile (only rendered when configured) */
.cf-turnstile{margin:14px 0 4px;}

/* ── V-family logo normalisation (interim until brand supplies normalised marks) ─
   Artwork ratios range 2.5:1–5.5:1; constrain every mark to the same box so tiles and
   the family strip read evenly, and pin tile links to the bottom (equal-height cards). */
a.icard{display:flex;flex-direction:column;}
a.icard p{flex:1 0 auto;}
a.icard .lm{margin-top:auto;padding-top:14px;align-self:flex-start;}
.vstile{height:56px;margin-bottom:16px;display:flex;align-items:center;}
.vstile img{height:44px;max-height:44px;width:auto;max-width:180px;object-fit:contain;object-position:left center;}
.vsfamily{padding:22px 28px;}
.vsrow{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 0;flex:none;width:100%;}
.vsrow img{flex:0 0 150px;width:150px;}
.vsrow img{height:26px;max-height:26px;max-width:150px;object-fit:contain;object-position:left center;}
@media(max-width:640px){.vsrow{grid-template-columns:repeat(3,1fr);} .vsrow img{height:22px;max-height:22px;}}

/* Readability (review F07/Codex #7): small card copy was 13.8px Light(300): under-weight on white.
   Cards go Regular 400 / 14.2px; large light lead paragraphs keep the design's light voice. */
a.icard p,.icard p{font-weight:400;font-size:14.2px;line-height:1.55;}
/* V-family marks are now normalised artwork (wp/content/media/normalised): uniform boxes suffice. */

/* Illustrated roundels on product tiles (owner-supplied artwork replaces the line icon) */
.ic.ic-img{background:none;overflow:hidden;}
.ic.ic-img img{width:54px;height:54px;display:block;border-radius:50%;}

/* zss-overrides */
/* ZSS Brand Manual 2023: ZSS Blue #1585C6, Grey #636363, White. Navy tones are shades of ZSS Blue; accents use a ZSS Blue tint. */
:root{--blue:#1585C6;--blue-d:#0F6EA6;--gold:#9FD3F3;}
.heromap{display:flex;flex-direction:column;align-items:center}
.zwmap{width:100%;max-width:520px;display:block;margin:10px auto 0;overflow:visible;filter:drop-shadow(0 12px 40px rgba(3,18,30,.35))}
.zwmap .dots circle{fill:rgba(255,255,255,.28)}
.zwmap .arcs path{fill:none;stroke:#fff;stroke-width:1.3;stroke-opacity:.75;stroke-dasharray:4 5;animation:zwflow 2.4s linear infinite}
.zwmap .agents circle{fill:#07253A;stroke:#9FD3F3;stroke-width:1.4}
.zwmap .towns circle{fill:#fff;stroke:#07253A;stroke-width:1.5}
.zwmap .hubdot{fill:#fff;stroke:#1585C6;stroke-width:3}
.zwmap .pulse{fill:none;stroke:#fff;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:zwpulse 2.4s ease-out infinite}
.zwmap text{fill:#fff;font-size:13px;font-weight:500;paint-order:stroke;stroke:rgba(7,37,58,.85);stroke-width:3px}
.zwmap text.hub{font-size:16px;font-weight:700}
@keyframes zwflow{to{stroke-dashoffset:-18}}
@keyframes zwpulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(3.4);opacity:0}}
@media(prefers-reduced-motion:reduce){.zwmap .arcs path,.zwmap .pulse{animation:none}}
@media(max-width:600px){.zwmap text{font-size:19px}.zwmap text.hub{font-size:22px}}
.maptag{text-wrap:balance;margin-top:12px;text-align:center;font-size:15px;font-weight:500;letter-spacing:.3px;color:#bfe0f4}
.maplegend{display:flex;gap:18px;justify-content:center;margin-top:10px;font-size:12px;color:#9cc4de;flex-wrap:wrap}
.maplegend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.lg-hub{background:#fff;border:2px solid #1585C6}.lg-town{background:#fff}.lg-agent{background:#07253A;border:1.5px solid #9FD3F3}
.assure{background:var(--mist);padding:72px 0}
.acreds{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
@media(max-width:860px){.acreds{grid-template-columns:1fr}}
.apo{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:22px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 22px}
.apo img{height:80px;width:auto;flex:none}
.apo p{margin:0;font-size:14px;color:var(--grey);max-width:420px}
@media(max-width:560px){.apo{flex-direction:column;text-align:center}}
/* Footer base: copyright left, legal links right; office below; regulatory small print full width under a hairline. */
.fbase{display:grid;grid-template-columns:1fr auto;gap:8px 32px;align-items:baseline;}
.fbase>span:first-child{grid-column:1;grid-row:1;}
.fbase .flegal{grid-column:2;grid-row:1;text-align:right;white-space:nowrap;font-size:12.5px;}
.fbase .flegal a{color:inherit;text-decoration:underline;text-underline-offset:3px;margin-left:22px;}
.fbase .flegal a:hover{color:#fff;}
.fbase>span:nth-child(2){grid-column:1/-1;grid-row:2;}
.fbase .freg{grid-column:1/-1;grid-row:3;margin-top:10px;padding-top:14px;border-top:1px solid rgba(255,255,255,.07);font-size:11.5px;line-height:1.6;opacity:.75;}
@media(max-width:760px){.fbase{grid-template-columns:1fr;}.fbase>span{grid-column:1 !important;grid-row:auto !important;}.fbase .flegal{text-align:left;white-space:normal;}.fbase .flegal a{margin:0 22px 0 0;}}
/* Logo: Colour-Background variant (white box, ZSS Blue letters) on the dark header and footer, per the
   ZSS Brand Manual 2023; true 2.06:1 proportions (site.css fixed the height against a fixed width and squashed it);
   40px tall = 82px wide, above the 80px screen minimum. */
.navlogo img,footer img{height:40px;width:auto;}
.sfzs img{height:36px;}
/* Legal pages (privacy, cookies, terms): readable prose column. */
.legal{max-width:780px;}
.legal .lupd{font-size:13.5px;color:var(--grey);margin-bottom:8px;}
.legal h2{font-weight:700;font-size:21px;color:var(--navy);margin:34px 0 10px;}
.legal p,.legal li{font-weight:300;font-size:16px;line-height:1.65;color:var(--ink);}
.legal p+p{margin-top:12px;}
.legal ul{margin:10px 0 0 22px;list-style:disc;}
.legal li{margin-top:6px;}
.legal a{color:var(--blue-d);text-decoration:underline;}
/* Accessibility (Lighthouse 15/10/2026): heading levels fixed without visual change; nav button text contrast 4.5:1+. */
.ecocard h3{font-weight:500;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:#7fc0ec;margin-bottom:10px;}
.pcase .ptop h3{font-size:12px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;color:#7fc0ec;}
.cap .capk,.natcard .capk{display:block;font-weight:500;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#7fc0ec;margin-bottom:12px;}
.natcard .capk{color:var(--blue-d);margin-bottom:10px;}
.cap h3{font-weight:700;font-size:16.5px;color:#fff;margin-bottom:4px;}
.natcard h3{font-weight:700;font-size:18px;color:var(--navy);margin-bottom:10px;}
footer h2{color:#fff;font-weight:500;font-size:13px;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;line-height:inherit;}
.navcta{background:var(--blue-d);}
.navcta:hover{background:var(--navy);}
