/* ===========================================================
   CSC Partners — site styles
   Palette: teal #0A3B40 · cream #F6F2EC · amber #E8965A
            blue #2F9BD6 · green #8DC63F
   =========================================================== */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:#0A3B40;
  font-family:'Hanken Grotesk',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  color:#16302F;
  overflow-x:hidden;
}
img{max-width:100%}
::selection{background:#E8965A;color:#0A3B40}
::placeholder{color:#8aa0a0}
input:focus,textarea:focus,select:focus{outline:none}
/* Visible keyboard-focus indicator (WCAG 2.4.7) — shows only for keyboard/AT users, not mouse clicks */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #E8965A;outline-offset:2px;border-radius:4px}

/* Make the [hidden] attribute authoritative even on elements that carry an
   inline display value (modals, the chat panel, the mobile menu). Without
   !important their inline display:flex overrides [hidden]{display:none}. */
[hidden]{display:none !important}

/* ---------- keyframes ---------- */
@keyframes cscPulse{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(1.5);opacity:0}}
@keyframes cscFadeIn{from{opacity:0}to{opacity:1}}
@keyframes cscReveal{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

/* ---------- film-grain / noise overlay ---------- */
.noise{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

/* ---------- scroll reveal ----------
   Hidden state is scoped to html.js so the page stays fully readable
   if JavaScript is disabled or fails to load (progressive enhancement). */
html.js [data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)}
html.js [data-reveal].csc-in{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important}
  .ai-orbit,[style*="cscPulse"]{animation:none !important}
}

/* ===========================================================
   NAV
   =========================================================== */
.nav-link{
  padding:9px 14px;color:rgba(255,255,255,0.82);text-decoration:none;
  font-size:14.5px;font-weight:500;border-radius:8px;transition:color .18s,background .18s;
}
.nav-link:hover{color:#fff;background:rgba(255,255,255,0.08)}

.nav-cta{
  margin-left:8px;padding:11px 22px;background:#E8965A;color:#0A3B40;text-decoration:none;
  font-size:14.5px;font-weight:700;border-radius:99px;box-shadow:0 6px 18px rgba(232,150,90,0.32);
  transition:background .18s,transform .18s;
}
.nav-cta:hover{background:#f0a972;transform:translateY(-1px)}

.m-link{color:#fff;text-decoration:none;font-family:'Newsreader',serif;font-size:30px;padding:10px}

/* ===========================================================
   Buttons / links (base styles live inline; hover here)
   =========================================================== */
.btn-amber{transition:background .18s,transform .18s}
.btn-amber:hover{background:#f0a972 !important}

.btn-amber-sq{transition:background .18s}
.btn-amber-sq:hover{background:#f0a972}

.btn-outline{transition:background .18s}
.btn-outline:hover{background:rgba(255,255,255,0.08)}

.btn-ghost{transition:background .18s,border-color .18s}
.btn-ghost:hover{background:rgba(255,255,255,0.07);border-color:rgba(255,255,255,0.4)}

.btn-dark{transition:background .18s,color .18s}
.btn-dark:hover{background:#E8965A;color:#0A3B40}

.link-underline{transition:gap .18s}
.link-underline:hover{gap:13px}

.office-link{transition:color .18s}
.office-link:hover{color:#E8965A}

.foot-link{transition:color .18s}
.foot-link:hover{color:#E8965A}

.social{
  width:42px;height:42px;border-radius:11px;border:1px solid rgba(255,255,255,0.18);
  display:flex;align-items:center;justify-content:center;transition:background .18s,border-color .18s;
}
.social:hover{background:#E8965A;border-color:#E8965A}

/* ===========================================================
   Service cards (tilt) + generic card hovers
   =========================================================== */
.service-card:hover{border-color:rgba(232,150,90,0.5)}

.biz-item{transition:background .2s,border-color .2s}
.biz-item:hover{background:#0A3B40;border-color:#0A3B40}
.biz-item:hover .biz-t{color:#fff}
.biz-item:hover .biz-d{color:rgba(255,255,255,0.78)}

.article-card:hover{transform:translateY(-5px);box-shadow:0 22px 46px rgba(10,59,64,0.13)}

.job-card{transition:transform .2s,box-shadow .2s}
.job-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(10,59,64,0.12)}

.journey-box{transition:transform .2s}
.journey-box:hover{transform:translateY(-2px)}

.tnav{transition:border-color .18s}
.tnav:hover{border-color:#E8965A}

.cv-drop{transition:border-color .18s}
.cv-drop:hover{border-color:#E8965A}

/* ===========================================================
   Job filter chips
   =========================================================== */
.chip{
  cursor:pointer;border:1px solid rgba(10,59,64,0.15);background:#fff;color:#3a4f4e;
  padding:8px 16px;border-radius:99px;font-size:13.5px;font-weight:600;font-family:inherit;transition:all .18s;
}
.chip:hover{border-color:#0A3B40}
.chip.active{background:#0A3B40;color:#fff;border-color:#0A3B40}

/* ===========================================================
   Recruitment journey toggle
   =========================================================== */
.jt-btn{
  border:none;cursor:pointer;padding:11px 26px;border-radius:99px;font-weight:700;
  font-size:14.5px;font-family:inherit;transition:all .2s;background:transparent;color:#3a4f4e;
}
.jt-btn.active{background:#0A3B40;color:#fff}

/* form fields */
.field:focus{border-color:#E8965A !important}

/* ---- My Story (About section) ---- */
.story-milestones{list-style:none;margin:0;padding:0;border-left:2px solid rgba(232,150,90,0.35)}
.story-milestones li{position:relative;padding:0 0 18px 24px;font-size:15px;line-height:1.5;color:#5a6e6d}
.story-milestones li:last-child{padding-bottom:0}
.story-milestones li::before{content:"";position:absolute;left:-7px;top:5px;width:12px;height:12px;border-radius:50%;background:#F6F2EC;border:2px solid #E8965A}
.story-milestones span{display:block;font-family:'Newsreader',serif;font-size:21px;font-weight:600;color:#0A3B40;line-height:1.1;margin-bottom:3px}
.story-body{background:#fff;border-radius:22px;padding:clamp(28px,4.5vw,56px);border:1px solid rgba(10,59,64,0.06);box-shadow:0 10px 40px rgba(10,59,64,0.07)}
.story-body p{font-size:17px;line-height:1.75;color:#3a4f4e;margin:0 0 20px}
.story-quote{margin:32px 0;padding:4px 0 4px 24px;border-left:3px solid #E8965A;font-family:'Newsreader',serif;font-style:italic;font-size:clamp(22px,2.6vw,28px);line-height:1.35;color:#0A3B40}
.story-sign{font-family:'Newsreader',serif;font-style:italic;font-size:30px;color:#E8965A;margin-top:8px}

/* ===========================================================
   Responsive breakpoints (carried over from the design)
   =========================================================== */
@media (min-width:880px){
  [data-hero-grid]{grid-template-columns:1.08fr 0.92fr !important;align-items:center}
  [data-about-grid]{grid-template-columns:1.05fr 0.95fr !important;align-items:center}
  [data-biz-grid]{grid-template-columns:0.95fr 1.05fr !important;align-items:start}
  [data-train-head]{grid-template-columns:1fr 1fr !important;align-items:end}
  [data-story-grid]{grid-template-columns:0.8fr 1.2fr !important}
  [data-story-aside]{position:sticky;top:120px}
}
@media (max-width:879px){
  [data-journey-grid]{grid-template-columns:1fr !important}
  [data-contact-grid]{grid-template-columns:1fr !important}
  [data-footer-grid]{grid-template-columns:1fr !important;gap:36px !important}
}
@media (max-width:1040px){
  [data-desktop-nav]{display:none !important}
  [data-mobile-burger]{display:block !important}
}

/* ===========================================================
   Team cards (team.html)
   =========================================================== */
.team-card{background:#fff;border-radius:20px;overflow:hidden;border:1px solid rgba(10,59,64,0.07);box-shadow:0 8px 30px rgba(10,59,64,0.06);transition:transform .2s,box-shadow .2s}
.team-card:hover{transform:translateY(-5px);box-shadow:0 22px 46px rgba(10,59,64,0.13)}
.team-photo{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 28%;background:#dfe7e3}
.team-ph{display:flex;align-items:center;justify-content:center;aspect-ratio:4/5;font-family:'Newsreader',serif;font-weight:600;color:#fff;letter-spacing:1px}
.team-ph span{font-size:clamp(46px,9vw,64px);opacity:.92}

/* ===========================================================
   Client forms (forms.html + forms/*.html)
   =========================================================== */
.form-wrap{max-width:840px;margin:0 auto}
.form-card{background:#fff;border-radius:22px;border:1px solid rgba(10,59,64,0.07);box-shadow:0 12px 44px rgba(10,59,64,0.07);padding:clamp(24px,4vw,44px)}
.form-section{padding:26px 0;border-top:1px solid rgba(10,59,64,0.09)}
.form-section:first-of-type{border-top:0;padding-top:0}
.form-section h2{font-family:'Newsreader',serif;font-size:21px;color:#0A3B40;margin:0 0 4px;font-weight:600}
.form-section .hint{font-size:13.5px;color:#6a7d7c;margin:0 0 18px}
.form-row{margin-bottom:16px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:620px){.form-grid{grid-template-columns:1fr}}
.form-label{display:block;font-size:13px;font-weight:700;color:#0A3B40;margin-bottom:7px}
.req{color:#E8965A}
.form-field{width:100%;padding:13px 15px;border-radius:11px;border:1.5px solid rgba(10,59,64,0.15);background:#fff;font-size:15px;font-family:inherit;color:#16302F}
.form-field:focus{border-color:#E8965A}
select.form-field{cursor:pointer}
textarea.form-field{resize:vertical}
.form-check{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;line-height:1.5;color:#3a4f4e;cursor:pointer}
.form-check input{margin-top:2px;width:18px;height:18px;accent-color:#E8965A;flex:none}
.form-err{font-size:12.5px;color:#c1502f;margin-top:6px}
.form-note{font-size:13.5px;line-height:1.6;color:#5a6e6d;background:#F6F2EC;border:1px solid rgba(10,59,64,0.08);border-radius:14px;padding:16px 18px}
.seg{display:inline-flex;background:#F6F2EC;padding:5px;border-radius:99px;border:1px solid rgba(10,59,64,0.1);gap:4px;flex-wrap:wrap}
.seg-btn{border:none;cursor:pointer;padding:10px 22px;border-radius:99px;font-weight:700;font-size:14px;font-family:inherit;background:transparent;color:#3a4f4e;transition:all .2s}
.seg-btn.active{background:#0A3B40;color:#fff}
.form-card-link{display:block;text-decoration:none;background:#fff;border-radius:20px;border:1px solid rgba(10,59,64,0.08);box-shadow:0 8px 30px rgba(10,59,64,0.05);padding:28px 26px;transition:transform .2s,box-shadow .2s,border-color .2s}
.form-card-link:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(10,59,64,0.12);border-color:rgba(232,150,90,0.5)}

/* ===========================================================
   Client forms — advanced controls (Aran-parity)
   Pills · repeaters · sub-panels · stepper · callouts
   =========================================================== */

/* Optional field hint under the section heading already uses .hint.
   Small helper for a required-fields legend at the top of a form. */
.form-lead{font-size:13.5px;color:#6a7d7c;margin:0 0 4px}

/* Label kept for screen readers where the surrounding copy is the visible label. */
.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}

/* ---- Pill toggles (Yes / No / multi-choice) ---- */
.pill-group{display:flex;flex-wrap:wrap;gap:9px;margin-top:2px}
.pill{
  border:1.5px solid rgba(10,59,64,0.18);cursor:pointer;background:#fff;color:#3a4f4e;
  padding:9px 18px;border-radius:99px;font-size:14px;font-weight:600;font-family:inherit;
  transition:background .18s,color .18s,border-color .18s;
}
.pill:hover{border-color:rgba(232,150,90,0.55)}
.pill.active{background:#0A3B40;color:#fff;border-color:#0A3B40}
.pill-sm .pill{padding:7px 15px;font-size:13.5px}
.pill-group.pill-err .pill{border-color:#c1502f}

/* A yes/no question laid out inline (label left, pills right) */
.qrow{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid rgba(10,59,64,0.12);border-radius:14px;padding:15px 16px;background:#fff}
.qrow .qlabel{font-size:14.5px;font-weight:600;color:#274a49;flex:1;line-height:1.4}
@media (max-width:560px){.qrow{flex-direction:column;align-items:flex-start;gap:12px}}

/* ---- Sub-panel (grouped conditional block) ---- */
.form-subpanel{border:1px solid rgba(10,59,64,0.14);border-radius:16px;padding:20px;background:#FBF9F5;margin-top:4px}
.form-subpanel > h3,.form-subpanel > h4{font-family:'Newsreader',serif;font-weight:600;color:#0A3B40;margin:0 0 14px;font-size:17px}
.form-subpanel .form-row:last-child,.form-subpanel .form-grid:last-child{margin-bottom:0}
.reveal-l{border-left:2px solid rgba(232,150,90,0.4);padding-left:16px;margin-top:4px}

/* ---- Repeaters (directors / shareholders / members / dependants) ---- */
.repeat-item{border:1px solid rgba(10,59,64,0.14);border-radius:14px;padding:16px;background:#FBF9F5;margin-bottom:12px}
.repeat-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.repeat-title{font-size:13px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:#0A3B40}
.btn-add{
  display:inline-flex;align-items:center;gap:7px;border:1.5px solid rgba(10,59,64,0.22);background:#fff;color:#0A3B40;
  cursor:pointer;padding:10px 18px;border-radius:99px;font-size:14px;font-weight:700;font-family:inherit;transition:border-color .18s,background .18s;
}
.btn-add:hover{border-color:#0A3B40;background:#F6F2EC}
.btn-remove{
  display:inline-flex;align-items:center;gap:6px;border:none;background:none;cursor:pointer;
  color:#c1502f;font-size:13px;font-weight:700;font-family:inherit;padding:4px 6px;border-radius:8px;transition:background .18s;
}
.btn-remove:hover{background:rgba(193,80,47,0.09)}

/* ---- Callout boxes (info / warning / documents) ---- */
.callout{border-radius:14px;padding:15px 17px;font-size:13.5px;line-height:1.6;margin-top:4px}
.callout p{margin:0}
.callout p + p{margin-top:7px}
.callout strong{font-weight:700}
.callout-blue{background:#EAF4FB;border:1px solid rgba(47,155,214,0.28);color:#1c4a63}
.callout-blue strong{color:#12384d}
.callout-amber{background:#FCF3E8;border:1px solid rgba(232,150,90,0.35);color:#7a4a1e}
.callout-amber strong{color:#5e3712}
.callout-green{background:#F0F7E6;border:1px solid rgba(141,198,63,0.4);color:#3f5720}

/* ---- CRO register lookup ---- */
.cro-bar{display:flex;gap:9px;align-items:stretch}
.cro-bar .form-field{flex:1;min-width:0}
.cro-bar .btn-add{white-space:nowrap;padding:0 20px}
.cro-bar .btn-add:disabled{opacity:.6;cursor:progress}
.cro-hint-err{color:#c1502f !important}
.cro-hint-ok{color:#4a7020 !important}
.cro-card{border:1px solid rgba(10,59,64,0.14);border-radius:14px;padding:15px 17px;background:#FBF9F5;margin-top:10px}
.cro-card-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.cro-name{font-size:15px;font-weight:700;color:#0A3B40}
.cro-badge{font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;padding:4px 9px;border-radius:99px}
.cro-badge-ok{background:#F0F7E6;color:#3f5720;border:1px solid rgba(141,198,63,0.45)}
.cro-badge-warn{background:#FCF3E8;color:#7a4a1e;border:1px solid rgba(232,150,90,0.45)}
.cro-meta{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:0;font-size:13.5px}
.cro-meta dt{font-weight:700;color:#0A3B40;white-space:nowrap}
.cro-meta dd{margin:0;color:#3a4f4e}
.cro-warn{margin:11px 0 0;font-size:13px;line-height:1.6;color:#7a4a1e;background:#FCF3E8;border:1px solid rgba(232,150,90,0.35);border-radius:11px;padding:10px 13px}
.cro-applied{margin:11px 0 0;font-size:12.5px;color:#6a7d7c}
.cro-count{margin:10px 0 0;font-size:13px;font-weight:700;color:#0A3B40}
.cro-pick{margin-top:12px;padding:8px 16px;font-size:13px}
.cro-filled{border-color:#8DC63F !important;background:#F7FBF0 !important;transition:background .5s,border-color .5s}

/* ---- Proposed-name availability hint ---- */
.cro-name-status{margin-top:7px;font-size:12.5px;line-height:1.6}
.cro-name-status p{margin:6px 0 2px}
.cro-name-status strong{font-weight:700}
.cro-ns-list{margin:0;padding-left:18px}
.cro-ns-list li{margin:2px 0}
.cro-ns-foot{color:#6a7d7c}
.cro-ns-busy{color:#6a7d7c}
.cro-ns-free{color:#4a7020}
.cro-ns-taken{color:#c1502f}
.cro-ns-similar{color:#7a4a1e}
@media (max-width:640px){
  .cro-bar{flex-direction:column}
  .cro-meta{grid-template-columns:1fr;gap:2px 0}
  .cro-meta dd{margin-bottom:6px}
}

/* ---- File upload widget ---- */
.upload{margin-top:2px}
.upload-zone{
  width:100%;display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer;font-family:inherit;
  border:1.5px dashed rgba(10,59,64,0.28);background:#fff;border-radius:12px;padding:15px 16px;
  transition:border-color .18s,background .18s;
}
.upload-zone:hover{border-color:#E8965A;background:#FBF9F5}
.upload-zone svg{flex:none;color:#0A3B40}
.upload.drag .upload-zone{border-color:#E8965A;background:#FCF3E8}
.upload.has-files .upload-zone{border-style:solid;border-color:rgba(141,198,63,0.55)}
.upload.upload-err .upload-zone{border-color:#c1502f;background:rgba(193,80,47,0.04)}
.upload-cta{font-size:13.5px;color:#6a7d7c;line-height:1.4}
.upload-list{margin-top:8px;display:flex;flex-direction:column;gap:6px}
.upload-file{display:flex;align-items:center;gap:10px;font-size:13px;color:#274a49;background:#F6F2EC;border:1px solid rgba(10,59,64,0.1);border-radius:9px;padding:7px 10px}
.upload-file svg{flex:none;color:#6ba32a}
.upload-file .uf-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upload-file .uf-size{color:#8aa0a0;flex:none}
.upload-file .uf-x{border:none;background:none;cursor:pointer;color:#c1502f;font-size:13px;font-weight:700;line-height:1;padding:3px 5px;border-radius:6px;flex:none}
.upload-file .uf-x:hover{background:rgba(193,80,47,0.1)}

/* Live camera capture (AML identity photo) — no upload fallback by design */
.camera-capture{
  margin-top:2px;border:1.5px dashed rgba(10,59,64,0.28);background:#fff;border-radius:12px;
  padding:16px;transition:border-color .18s,background .18s;
}
.camera-capture.has-photo{border-style:solid;border-color:rgba(141,198,63,0.55)}
.camera-capture.upload-err{border-color:#c1502f;background:rgba(193,80,47,0.04)}
.cam-stage{display:flex;flex-direction:column;align-items:center;gap:11px;text-align:center}
.cam-stage[hidden]{display:none}
.cam-stage svg{color:#0A3B40}
.cam-text{margin:0;font-size:13.5px;color:#6a7d7c;line-height:1.55;max-width:420px}
.cam-subtle{margin:0;font-size:12px;color:#8aa0a0;line-height:1.5;max-width:380px}
.cam-stage video{width:100%;max-width:400px;border-radius:10px;background:#04191b;display:block}
.cam-stage img{width:100%;max-width:400px;border-radius:10px;display:block}
.cam-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}
.cam-btn{
  display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;background:#0A3B40;color:#fff;
  padding:11px 22px;border-radius:99px;font-size:14px;font-weight:700;font-family:inherit;transition:background .18s;
}
.cam-btn:hover{background:#116066}
.cam-btn svg{color:#fff}
.cam-btn-ghost{
  display:inline-flex;align-items:center;gap:7px;border:1.5px solid rgba(10,59,64,0.22);background:#fff;color:#0A3B40;
  cursor:pointer;padding:9px 18px;border-radius:99px;font-size:13.5px;font-weight:700;font-family:inherit;transition:border-color .18s,background .18s;
}
.cam-btn-ghost:hover{border-color:#0A3B40;background:#F6F2EC}
.cam-ok{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:#6ba32a}

/* Document-request note (kept for informational rows) */
.doc-note{background:#F6F2EC;border:1px solid rgba(10,59,64,0.1);border-radius:14px;padding:15px 17px;font-size:13.5px;line-height:1.6;color:#5a6e6d}
.doc-note .doc-note-t{font-weight:700;color:#0A3B40;display:flex;align-items:center;gap:8px;margin-bottom:8px}
.doc-note ul{margin:0;padding-left:20px}
.doc-note li{margin:0 0 5px}
.doc-note li:last-child{margin-bottom:0}

/* ===========================================================
   Multi-step wizard (income tax checklist)
   =========================================================== */
.wiz-progress-head{max-width:900px;margin:0 auto 20px;text-align:center}
.wiz-progress-head .wiz-sub{font-size:14px;color:#6a7d7c;margin:6px 0 0}

/* Desktop stepper */
.stepper{display:flex;align-items:flex-start;max-width:960px;margin:0 auto 30px}
.stepper .step{display:flex;flex-direction:column;align-items:center;flex:1;min-width:0}
.stepper .step-dot{
  width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  border:2px solid rgba(10,59,64,0.2);background:#fff;color:#8aa0a0;font-weight:700;font-size:14px;transition:all .2s;
}
.stepper .step-label{margin-top:8px;font-size:12px;font-weight:600;color:#8aa0a0;text-align:center;line-height:1.2}
.stepper .step.done .step-dot{background:#8DC63F;border-color:#8DC63F;color:#123}
.stepper .step.current .step-dot{background:#0A3B40;border-color:#0A3B40;color:#fff}
.stepper .step.current .step-label{color:#0A3B40}
.stepper .step.err .step-dot{background:rgba(193,80,47,0.12);border-color:#c1502f;color:#c1502f}
.stepper .step.err .step-label{color:#c1502f}
.stepper .step.clickable{cursor:pointer}
.stepper .step-conn{flex:1;height:2px;background:rgba(10,59,64,0.15);margin:19px -6px 0;min-width:8px}
.stepper .step-conn.done{background:#8DC63F}
@media (max-width:900px){.stepper{display:none}}

/* Mobile progress */
.wiz-mobile{max-width:640px;margin:0 auto 22px}
@media (min-width:901px){.wiz-mobile{display:none}}
.wiz-mobile-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.wiz-mobile-step{font-size:14px;font-weight:700;color:#0A3B40}
.wiz-bar{height:6px;background:rgba(10,59,64,0.12);border-radius:99px;overflow:hidden}
.wiz-bar > span{display:block;height:100%;background:#0A3B40;border-radius:99px;transition:width .3s}
.wiz-dots{display:flex;justify-content:center;gap:7px;margin-top:12px}
.wiz-dots button{width:10px;height:10px;border-radius:50%;border:none;background:rgba(10,59,64,0.2);padding:0;cursor:default}
.wiz-dots button.done{background:#8DC63F}
.wiz-dots button.current{background:#0A3B40}
.wiz-dots button.err{background:#c1502f}
.wiz-dots button.clickable{cursor:pointer}

/* Steps + nav */
.wiz-step{display:none}
.wiz-step.active{display:block;animation:cscFadeIn .3s ease}
.wiz-step > h2.step-h{font-family:'Newsreader',serif;font-size:23px;color:#0A3B40;font-weight:600;margin:0 0 6px;padding-bottom:12px;border-bottom:1px solid rgba(10,59,64,0.1)}
.wiz-step .step-intro{font-size:14px;color:#6a7d7c;margin:0 0 20px;line-height:1.6}
.wiz-nav{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:26px}
.wiz-count{font-size:13.5px;color:#8aa0a0;font-weight:600}
@media (max-width:560px){.wiz-count{display:none}}
.btn-back{
  display:inline-flex;align-items:center;gap:8px;border:1.5px solid rgba(10,59,64,0.22);background:#fff;color:#0A3B40;
  cursor:pointer;padding:13px 22px;border-radius:99px;font-size:15px;font-weight:700;font-family:inherit;transition:border-color .18s,background .18s;
}
.btn-back:hover{border-color:#0A3B40;background:#F6F2EC}
.btn-back:disabled{opacity:.4;cursor:not-allowed}
.btn-next{
  display:inline-flex;align-items:center;gap:8px;border:none;background:#E8965A;color:#0A3B40;cursor:pointer;
  padding:14px 30px;border-radius:99px;font-size:15px;font-weight:700;font-family:inherit;box-shadow:0 12px 30px rgba(232,150,90,0.3);transition:background .18s;
}
.btn-next:hover{background:#f0a972}
.btn-next:disabled{opacity:.6;cursor:progress}

/* Trust badges on the wizard landing */
.trust-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:6px}
.trust-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.18);border-radius:99px;padding:9px 16px;color:#fff;font-size:13.5px;font-weight:600}
.trust-badge svg{flex:none}

/* "How it works" mini-cards */
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;max-width:900px;margin:0 auto}
@media (max-width:760px){.how-grid{grid-template-columns:1fr;gap:22px}}
.how-card{text-align:center}
.how-ic{width:56px;height:56px;border-radius:50%;background:rgba(10,59,64,0.08);display:flex;align-items:center;justify-content:center;color:#0A3B40;margin:0 auto 14px}
.how-card h3{font-family:'Newsreader',serif;font-size:19px;color:#0A3B40;margin:0 0 6px;font-weight:600}
.how-card p{font-size:14px;color:#5a6e6d;line-height:1.55;margin:0}

/* Reference number chip on success */
.ref-box{background:#F6F2EC;border:1px solid rgba(10,59,64,0.1);border-radius:16px;padding:20px;margin:20px auto 0;max-width:360px}
.ref-box .ref-lbl{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#6a7d7c;font-weight:700;margin:0 0 6px}
.ref-box .ref-num{font-family:'Newsreader',serif;font-size:27px;font-weight:600;color:#0A3B40;letter-spacing:1px;margin:0}

/* ===========================================================
   Blog / Insights articles
   =========================================================== */
.article-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.prose{font-size:17px;line-height:1.75;color:#3a4f4e;max-width:720px}
.prose > *:first-child{margin-top:0}
.prose p{margin:0 0 20px}
.prose h2,.prose h3,.prose h4{font-family:'Newsreader',serif;color:#0A3B40;line-height:1.2;margin:36px 0 14px;font-weight:600}
.prose h2{font-size:28px}
.prose h3{font-size:23px}
.prose h4{font-size:20px}
.prose a{color:#0A3B40;font-weight:600;text-decoration:underline;text-decoration-color:#E8965A;text-underline-offset:2px}
.prose img{max-width:100%;height:auto;border-radius:16px;margin:10px 0 22px;display:block}
.prose ul,.prose ol{margin:0 0 20px;padding-left:22px}
.prose li{margin:0 0 8px}
.prose blockquote{margin:24px 0;padding:6px 0 6px 22px;border-left:3px solid #E8965A;font-family:'Newsreader',serif;font-style:italic;font-size:20px;color:#0A3B40}
.prose strong{color:#0A3B40}