/* ==========================================================================
   Plug & Invest Consulting Pvt. Ltd. — SEBI Research Analyst
   Premium accessible one-pager.  WCAG 2.2 AA.
   Palette: Deep navy #0B2A55 · Rich gold #C6A04A · Warm ivory #F7F5F0
   Contrast rules enforced: gold text ONLY on navy; body text navy-on-ivory.
   ========================================================================== */

:root{
  --navy:#0B2A55;
  --navy-2:#0A2148;
  --navy-3:#061730;
  --gold:#C6A04A;
  --gold-soft:#D9BE7E;     /* decorative gold on navy only */
  --gold-dk:#755B1D;       /* darker gold for small text/icons on light surfaces: >=4.8:1 on ivory, ivory-2, white and the gold tag tint */
  --ivory:#F7F5F0;
  --ivory-2:#EFEBE1;
  --white:#FFFFFF;
  --ink:#0B2A55;           /* primary text (13:1 on ivory) */
  --muted:#44506A;         /* secondary text on light (verified AA) */
  --line:#E3DECF;          /* hairline on light */
  --line-navy:rgba(214,190,126,.26);
  --shadow:0 18px 50px -24px rgba(11,42,85,.35);
  --shadow-sm:0 8px 24px -16px rgba(11,42,85,.4);
  --radius:16px;
  --radius-sm:10px;
  --maxw:1180px;
  --gut:clamp(18px,5vw,40px);
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --display:"Cinzel",Georgia,serif;
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top:104px; } /* WCAG 2.4.11: keep focused items clear of the sticky header */
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{
  font-family:var(--sans); color:var(--ink); background:var(--ivory);
  line-height:1.65; font-size:17px; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility; overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--navy); text-underline-offset:3px; }
h1,h2,h3,h4{ font-family:var(--serif); font-weight:600; line-height:1.14; color:var(--navy); letter-spacing:-.01em; }
ul{ padding-left:1.15em; }

/* ---------- accessibility helpers ---------- */
.skip-link{
  position:absolute; left:14px; top:-60px; z-index:2000;
  background:var(--navy); color:#fff; padding:12px 18px; border-radius:0 0 10px 10px;
  font-weight:600; transition:top .2s ease; text-decoration:none;
}
.skip-link:focus{ top:0; outline:3px solid var(--gold-soft); outline-offset:-6px; }
:focus-visible{ outline:3px solid var(--navy); outline-offset:3px; border-radius:4px; }  /* navy on light surfaces: >=13:1 */
/* gold focus ring only where the surface behind it is navy (5.8:1+) */
.hero :focus-visible,.reg-band :focus-visible,.contact :focus-visible,.site-footer :focus-visible,
.mobile-nav :focus-visible,.toast :focus-visible,.svc-visual :focus-visible{ outline-color:var(--gold-soft); }
main:focus{ outline:none; }  /* programmatic focus target for the skip link */
.acc-btn:focus-visible{ outline-offset:-3px; border-radius:var(--radius-sm); }  /* .acc clips overflow, so draw the ring inside */
.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;
}

/* ---------- layout ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut); }
section{ padding-block:clamp(44px,7vw,100px); position:relative; }
.eyebrow{
  display:inline-flex; align-items:center; gap:9px; font-family:var(--sans);
  font-size:13px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold-dk); margin-bottom:16px;
}
.section-title{ font-size:clamp(28px,4.4vw,46px); margin-bottom:14px; }
.section-lead{ font-size:clamp(17px,2vw,20px); color:var(--muted); max-width:62ch; }
.center{ text-align:center; }
.center .section-lead{ margin-inline:auto; }

/* ---------- buttons ---------- */
.btn{
  --bg:var(--gold); --fg:var(--navy);
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--sans); font-weight:700; font-size:16px; letter-spacing:.01em;
  background:var(--bg); color:var(--fg); border:2px solid var(--bg);
  padding:14px 26px; border-radius:999px; cursor:pointer; text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, filter .18s ease;
  box-shadow:0 10px 26px -12px rgba(198,160,74,.7);
}
.btn:hover{ transform:translateY(-2px); filter:brightness(1.04); box-shadow:0 16px 32px -14px rgba(198,160,74,.85); }
.btn:active{ transform:translateY(0); }
.btn--ghost{
  --bg:transparent; --fg:var(--navy); border-color:var(--navy); box-shadow:none;
}
.btn--ghost:hover{ background:var(--navy); color:#fff; }
.btn--on-navy{ box-shadow:0 10px 30px -12px rgba(0,0,0,.6); }
.btn--ghost-light{
  --bg:transparent; --fg:#fff; border-color:rgba(255,255,255,.6); box-shadow:none;
}
.btn--ghost-light:hover{ background:#fff; color:var(--navy); border-color:#fff; }
.btn svg{ width:18px; height:18px; }

/* ==========================================================================
   PRELOADER — logo-wheel opening animation
   ========================================================================== */
#preloader{
  position:fixed; inset:0; z-index:3000; display:grid; place-items:center;
  background:radial-gradient(120% 120% at 50% 35%,var(--navy) 0%,var(--navy-3) 100%);
}
#preloader .pl-inner{ display:grid; justify-items:center; gap:22px; }
#preloader .pl-wheel{
  width:clamp(120px,22vw,180px); height:auto; filter:drop-shadow(0 8px 30px rgba(0,0,0,.4));
  animation:plspin 1.5s cubic-bezier(.3,.7,.2,1) both;
}
#preloader .pl-word{
  height:clamp(40px,7vw,64px); width:auto; opacity:0;
  animation:plword .7s ease .95s both;
}
#preloader .pl-bar{
  width:140px; height:3px; border-radius:3px; overflow:hidden; background:rgba(255,255,255,.14);
}
#preloader .pl-bar i{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--gold),var(--gold-soft));
  animation:plbar 1.6s ease both; }
@keyframes plspin{ 0%{ opacity:0; transform:rotate(-140deg) scale(.5); } 60%{ opacity:1; } 100%{ opacity:1; transform:rotate(0) scale(1); } }
@keyframes plword{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } }
@keyframes plbar{ 0%{ width:0; } 80%{ width:100%; } 100%{ width:100%; } }
body.pl-done #preloader{ opacity:0; visibility:hidden; transition:opacity .6s ease,visibility .6s ease; }
body.pl-active{ overflow:hidden; }
@media (prefers-reduced-motion:reduce){
  #preloader .pl-wheel,#preloader .pl-word,#preloader .pl-bar i{ animation:none !important; opacity:1; transform:none; }
  #preloader .pl-bar{ display:none; }
}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:1000; background:rgba(247,245,240,.82);
  backdrop-filter:saturate(1.2) blur(12px); -webkit-backdrop-filter:saturate(1.2) blur(12px);
  border-bottom:1px solid transparent; transition:border-color .3s ease, box-shadow .3s ease, background .3s ease;
}
.site-header.scrolled{ border-bottom-color:var(--line); box-shadow:0 6px 24px -18px rgba(11,42,85,.5); }
.nav{ display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:76px; }
.brand{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; flex:0 0 auto; }
.brand img{ height:54px; width:auto; }
.nav-links{ display:flex; align-items:center; gap:28px; list-style:none; padding:0; margin:0; }
.nav-links a{
  font-weight:600; font-size:15.5px; color:var(--navy); text-decoration:none; position:relative; padding:6px 0;
}
.nav-links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:2px; background:var(--gold);
  transition:right .25s ease;
}
.nav-links a:hover::after,.nav-links a:focus-visible::after{ right:0; }
.nav-cta{ display:flex; align-items:center; gap:12px; flex:0 0 auto; }
.nav-cta .btn{ padding:11px 20px; font-size:15px; }
.nav-toggle{
  display:none; background:none; border:2px solid var(--navy); border-radius:10px;
  width:46px; height:42px; cursor:pointer; color:var(--navy);
}
.nav-toggle svg{ width:22px; height:22px; margin:auto; }

@media (max-width:1240px){ .nav-cta .btn--ghost{ display:none; } }  /* keep header on one line (1.4.10) */
@media (max-width:1100px){
  .nav-links,.nav-cta .btn--ghost{ display:none; }
  .nav-toggle{ display:grid; place-items:center; }
  .mobile-nav{ display:block; }
}

/* mobile drawer */
.mobile-nav{ display:none; position:fixed; inset:0; z-index:1100; visibility:hidden; }
@media (max-width:1100px){ .mobile-nav{ display:block; } }  /* must follow the base rule above or it never applies */
.mobile-nav[aria-hidden="false"]{ visibility:visible; }
.mobile-nav .mn-scrim{ position:absolute; inset:0; background:rgba(6,23,48,.5); opacity:0; transition:opacity .3s ease; }
.mobile-nav[aria-hidden="false"] .mn-scrim{ opacity:1; }
.mobile-nav .mn-panel{
  position:absolute; top:0; right:0; height:100%; width:min(86vw,360px);
  background:var(--navy); color:#fff; padding:26px 24px; transform:translateX(100%);
  transition:transform .32s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; gap:6px;
  box-shadow:-20px 0 60px -30px #000;
}
.mobile-nav[aria-hidden="false"] .mn-panel{ transform:translateX(0); }
.mobile-nav .mn-head{ display:flex; justify-content:space-between; align-items:center; gap:14px;
  padding-bottom:16px; margin-bottom:14px; border-bottom:1px solid var(--line-navy); }
.mobile-nav .mn-head img{ height:38px; width:auto; }
.mobile-nav .mn-close{ background:none; border:1px solid rgba(255,255,255,.4); color:#fff; border-radius:10px; width:42px; height:42px; cursor:pointer; }
.mobile-nav a.mn-link{ color:#fff; text-decoration:none; font-weight:600; font-size:18px; padding:13px 6px; border-bottom:1px solid rgba(255,255,255,.1); }
.mobile-nav a.mn-link:hover{ color:var(--gold-soft); }
.mobile-nav .btn{ margin-top:16px; }
@media (prefers-reduced-motion:reduce){
  .mobile-nav .mn-panel,.mobile-nav .mn-scrim{ transition:none; }
}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  background:
    radial-gradient(90% 120% at 82% -10%,rgba(198,160,74,.16),transparent 55%),
    linear-gradient(160deg,var(--navy) 0%,var(--navy-2) 55%,var(--navy-3) 100%);
  color:#fff; overflow:hidden; isolation:isolate; padding-block:0;
}
.hero::before{  /* faint compass watermark */
  content:""; position:absolute; z-index:-1; right:-8%; top:50%; transform:translateY(-50%);
  width:min(640px,70vw); aspect-ratio:1; background:url("logo/icon-white.png") center/contain no-repeat;
  opacity:.06; pointer-events:none;
}
.hero .wrap{ padding-block:clamp(38px,5.5vw,84px); }
.hero-grid{ display:grid; gap:40px; align-items:center; }
.hero h1{
  color:#fff; font-size:clamp(34px,6vw,62px); line-height:1.06; letter-spacing:-.02em; margin-bottom:20px;
}
.hero h1 .accent{ color:var(--gold-soft); font-style:italic; }
.hero .lede{ font-size:clamp(17px,2.2vw,21px); color:rgba(255,255,255,.86); max-width:58ch; margin-bottom:12px; }
.hero .reg{
  font-size:15px; color:rgba(255,255,255,.72); margin-bottom:28px;
}
.hero .reg b{ color:var(--gold-soft); font-weight:700; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:34px; }
.hero-actions .btn{ width:min(100%,380px); }
.cred-row{ display:flex; flex-wrap:wrap; gap:12px; }
.cred{
  display:inline-flex; align-items:center; gap:9px; background:rgba(255,255,255,.07);
  border:1px solid var(--line-navy); border-radius:999px; padding:9px 16px; font-size:13.5px;
  color:rgba(255,255,255,.9); font-weight:600;
}
.cred svg{ width:16px; height:16px; color:var(--gold-soft); flex:0 0 auto; }

/* ==========================================================================
   MANDATORY REGULATORY BAND  (SEBI required, min 10px — we use 14px)
   ========================================================================== */
.reg-band{ background:var(--navy-3); color:rgba(255,255,255,.9); padding-block:22px; }
.reg-band .wrap{ display:grid; gap:12px; }
.reg-note{ display:flex; gap:12px; align-items:flex-start; font-size:14px; line-height:1.6; }
.reg-note svg{ width:20px; height:20px; color:var(--gold-soft); flex:0 0 auto; margin-top:2px; }
.reg-note b{ color:#fff; }

/* ==========================================================================
   ABOUT
   ========================================================================== */
#about,#approach{ background:var(--white); }
.about-grid{ display:grid; grid-template-columns:1fr; gap:clamp(30px,5vw,60px); align-items:center; }
@media (min-width:860px){ .about-grid{ grid-template-columns:0.95fr 1.05fr; } }
.about-photo{
  position:relative; border-radius:var(--radius); overflow:hidden; background:var(--navy);
  aspect-ratio:4/5; box-shadow:var(--shadow); border:1px solid var(--line);
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.about-photo .ph-placeholder{
  position:absolute; inset:0; display:grid; place-content:center; gap:14px; text-align:center;
  color:rgba(255,255,255,.7); background:
    radial-gradient(80% 80% at 50% 30%,rgba(198,160,74,.14),transparent 60%),
    linear-gradient(160deg,var(--navy),var(--navy-3)); padding:24px;
}
.about-photo .ph-placeholder img{ width:92px; opacity:.8; margin-inline:auto; }
.about-photo .ph-placeholder span{ font-size:14px; letter-spacing:.04em; }
.about-photo .about-photo-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 22%; transition:transform .4s ease, filter .4s ease; }
.about-photo .ph-ring{ position:absolute; inset:14px; border:1px solid rgba(255,255,255,.28); border-radius:12px; pointer-events:none; transition:border-color .25s ease, inset .25s ease; }
@media (hover:hover){
  .about-photo.reveal.in:hover{ transform:translateY(-5px); }
  .about-photo:hover{ border-color:var(--gold); box-shadow:0 22px 48px -16px rgba(198,160,74,.8); }
  .about-photo:hover .about-photo-img{ transform:scale(1.08); filter:brightness(1.1) saturate(1.08); }
  .about-photo:hover .ph-ring{ inset:10px; border-color:var(--gold-soft); }
}
.about-body p{ color:var(--muted); margin-bottom:16px; font-size:17.5px; }
.about-body p strong{ color:var(--navy); }
.about-points{ list-style:none; padding:0; margin:22px 0 0; display:grid; gap:14px; }
.about-points li{ display:flex; gap:12px; align-items:flex-start; }
.about-points svg{ width:22px; height:22px; color:var(--gold-dk); flex:0 0 auto; margin-top:2px; }
.about-points b{ display:block; color:var(--navy); }
.about-points span{ color:var(--muted); font-size:15.5px; }

/* ==========================================================================
   SERVICES / MODEL PORTFOLIOS
   ========================================================================== */
.services{ background:var(--ivory-2); }
.svc-feature{
  display:grid; grid-template-columns:1fr; gap:0; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); background:var(--white); border:1px solid var(--line);
}
@media (min-width:880px){ .svc-feature{ grid-template-columns:1.1fr .9fr; } }
.svc-feature .svc-copy{ padding:clamp(28px,4vw,48px); }
.svc-feature .svc-tag{ display:inline-block; background:rgba(198,160,74,.16); color:var(--gold-dk);
  font-weight:700; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; padding:6px 13px; border-radius:999px; margin-bottom:16px; }
.svc-feature h3{ font-size:clamp(24px,3vw,32px); margin-bottom:14px; }
.svc-feature p{ color:var(--muted); margin-bottom:18px; }
.svc-list{ list-style:none; padding:0; margin:0 0 26px; display:grid; gap:12px; }
.svc-list li{ display:flex; gap:11px; align-items:flex-start; font-size:15.5px; color:var(--navy); }
.svc-list svg{ width:20px; height:20px; color:var(--gold-dk); flex:0 0 auto; margin-top:2px; }
.svc-feature .svc-visual{
  background:linear-gradient(160deg,var(--navy),var(--navy-3)); color:#fff;
  padding:clamp(28px,4vw,44px); display:grid; align-content:center; gap:18px; position:relative; overflow:hidden;
}
.svc-visual::after{ content:""; position:absolute; right:-36%; bottom:-36%; width:88%; aspect-ratio:1; z-index:0;
  background:url("logo/icon-white.png") center/contain no-repeat; opacity:.05; }
.svc-visual > *{ position:relative; z-index:1; }
.svc-visual .sv-stat{ font-family:var(--serif); font-size:clamp(26px,4vw,38px); color:var(--gold-soft); line-height:1; }
.svc-visual .sv-k{ font-size:14px; color:rgba(255,255,255,.82); }
.svc-visual .sv-divider{ height:1px; background:var(--line-navy); }
.svc-cta{ white-space:nowrap; }
.svc-visual .svc-note{ font-size:14px; color:rgba(255,255,255,.85); line-height:1.6; margin-bottom:0; }

/* ==========================================================================
   APPROACH
   ========================================================================== */
.approach-grid{ display:grid; gap:22px; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); margin-top:14px; }
.appr-card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px;
  box-shadow:var(--shadow-sm); transition:transform .25s ease, box-shadow .25s ease; position:relative; overflow:hidden;
}
.appr-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.appr-card .ac-ico{
  width:54px; height:54px; border-radius:14px; display:grid; place-items:center; margin-bottom:18px;
  background:linear-gradient(160deg,var(--navy),var(--navy-3)); color:var(--gold-soft);
}
.appr-card .ac-ico svg{ width:26px; height:26px; }
.appr-card h3{ font-size:21px; margin-bottom:9px; }
.appr-card p{ color:var(--muted); font-size:15.5px; }
.appr-card .ac-num{ position:absolute; right:18px; top:12px; font-family:var(--serif); font-size:44px; color:var(--ivory-2); z-index:0; }
/* purely decorative watermark numeral: rendered as generated content (not real text), aria-hidden, exempt from 1.4.3 */
.appr-card .ac-num::before{ content:attr(data-n); }

/* ==========================================================================
   COMPLIANCE HUB
   ========================================================================== */
.compliance{ background:var(--ivory-2); }
.comp-grid{ display:grid; gap:14px; margin-top:26px; }
.acc{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden;
  box-shadow:var(--shadow-sm);
}
.acc-btn{
  width:100%; display:flex; align-items:center; gap:14px; text-align:left; cursor:pointer;
  background:none; border:0; padding:20px 22px; font-family:var(--serif); font-size:19px; font-weight:600; color:var(--navy);
}
.acc-btn .acc-n{ font-size:13px; font-weight:700; color:var(--gold-dk); font-family:var(--sans); flex:0 0 auto;
  width:30px; height:30px; display:grid; place-items:center; border:1px solid var(--line); border-radius:8px; }
.acc-btn .acc-t{ flex:1; }
.acc-btn .acc-chev{ width:22px; height:22px; color:var(--navy); transition:transform .3s ease; flex:0 0 auto; }
.acc-btn[aria-expanded="true"] .acc-chev{ transform:rotate(180deg); }
.acc-btn:hover{ background:var(--ivory); }
.acc-panel{ display:none; padding:4px 22px 24px; border-top:1px solid var(--line); }
.acc-panel.open{ display:block; animation:accfade .3s ease; }
@keyframes accfade{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .acc-panel.open{ animation:none; } }
.acc-panel h4{ font-size:16px; margin:16px 0 8px; color:var(--navy); font-family:var(--sans); font-weight:700; }
.acc-panel p,.acc-panel li{ font-size:15px; color:var(--muted); line-height:1.7; }
.acc-panel p{ margin-bottom:10px; }
.acc-panel ul,.acc-panel ol{ margin:6px 0 14px; display:grid; gap:6px; }
.acc-panel a{ color:var(--navy); font-weight:600; overflow-wrap:anywhere; text-decoration:underline; }
.contacts-grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); margin-top:6px; }
.contact-card{ border:1px solid var(--line); border-radius:12px; padding:16px 18px; background:var(--ivory); }
.contact-card .cc-role{ font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-dk); margin-bottom:6px; }
.contact-card .cc-name{ font-weight:700; color:var(--navy); font-size:16px; }
.contact-card p{ font-size:14px; margin:4px 0 0; }
.contact-card a{ color:var(--navy); }

/* complaints table */
.table-scroll{ overflow-x:auto; margin:10px 0 6px; border:1px solid var(--line); border-radius:10px; }
table.data{ width:100%; border-collapse:collapse; min-width:560px; font-size:14px; }
table.data caption{ text-align:left; font-size:13px; color:var(--muted); padding:10px 12px; }
table.data th,table.data td{ padding:10px 12px; text-align:left; border-bottom:1px solid var(--line); }
table.data thead th{ background:var(--navy); color:#fff; font-weight:600; font-size:13px; }
table.data tbody tr:nth-child(even){ background:var(--ivory); }
table.data tfoot td{ font-weight:700; color:var(--navy); background:var(--ivory-2); }

/* ==========================================================================
   CONTACT
   ========================================================================== */
.contact{ background:linear-gradient(160deg,var(--navy),var(--navy-3)); color:#fff; }
.contact .section-title{ color:#fff; }
.contact .eyebrow{ color:var(--gold-soft); }
.contact-wrap{ display:grid; gap:34px; }
@media (min-width:860px){ .contact-wrap{ grid-template-columns:1fr 1fr; } }
.contact-info{ display:grid; gap:18px; align-content:start; }
.ci-item{ display:flex; gap:14px; align-items:flex-start; }
.ci-item svg{ width:24px; height:24px; color:var(--gold-soft); flex:0 0 auto; margin-top:3px; }
.ci-item .ci-k{ font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.6); }
.ci-item .ci-v{ font-size:17px; color:#fff; font-weight:500; overflow-wrap:anywhere; }
.ci-item > div{ min-width:0; }
.ci-item a{ color:#fff; text-decoration:none; }
.ci-item a:hover{ color:var(--gold-soft); text-decoration:underline; }
.social-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:8px; }
.social-row a{
  width:46px; height:46px; display:grid; place-items:center; border-radius:12px;
  background:rgba(255,255,255,.08); border:1px solid var(--line-navy); color:#fff; transition:all .2s ease;
}
.social-row a:hover{ background:var(--gold); color:var(--navy); border-color:var(--gold); transform:translateY(-2px); }
.social-row a svg{ width:22px; height:22px; }
.contact-cta{
  background:rgba(255,255,255,.05); border:1px solid var(--line-navy); border-radius:var(--radius); padding:clamp(24px,4vw,38px);
}
.contact-cta h3{ color:#fff; font-size:24px; margin-bottom:10px; }
.contact-cta p{ color:rgba(255,255,255,.8); margin-bottom:22px; font-size:16px; }
.contact-cta .btn{ width:100%; margin-bottom:12px; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{ background:var(--navy-3); color:rgba(255,255,255,.72); padding-block:56px 0; }
.foot-top{ display:grid; gap:34px; grid-template-columns:1fr; }
@media (min-width:760px){ .foot-top{ grid-template-columns:1.4fr 1fr 1fr; } }
.foot-brand img{ height:40px; width:auto; margin-bottom:16px; }
.foot-brand p{ font-size:14px; line-height:1.7; max-width:40ch; }
.foot-brand .reg-id{ color:var(--gold-soft); font-weight:600; margin-top:12px; font-size:14px; }
.foot-col h4{ color:#fff; font-size:14px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px; font-family:var(--sans); }
.foot-col ul{ list-style:none; padding:0; margin:0; display:grid; gap:9px; }
.foot-col a{ color:rgba(255,255,255,.72); text-decoration:none; font-size:14.5px; display:inline-block; padding:3px 0; }  /* >=24px tall target (2.5.8) */
.foot-col a:hover{ color:var(--gold-soft); text-decoration:underline; }
.foot-legal{ border-top:1px solid rgba(255,255,255,.1); margin-top:44px; padding-block:22px; }
.foot-legal .wrap{ display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center; }
.foot-legal p{ font-size:13px; color:rgba(255,255,255,.6); }
.foot-legal a{ color:var(--gold-soft); font-weight:600; text-decoration:underline; text-underline-offset:3px; display:inline-block; padding:3px 0; }  /* 1.4.1: link inside a text block must not rely on colour alone */
.foot-legal a:hover{ text-decoration-thickness:2px; }
.foot-disclaimer{ font-size:12.5px; color:rgba(255,255,255,.55); line-height:1.65; margin-top:14px; }

/* ==========================================================================
   SCROLL REVEAL
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; will-change:opacity,transform; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1 !important; transform:none !important; transition:none; } }

/* status toast */
.toast{
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(20px);
  background:var(--navy); color:#fff; padding:15px 22px; border-radius:12px; z-index:2500;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.6); border:1px solid var(--line-navy);
  opacity:0; pointer-events:none; transition:opacity .3s ease, transform .3s ease; max-width:min(92vw,420px);
  display:flex; gap:12px; align-items:center; font-size:15px;
}
.toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.toast svg{ width:22px; height:22px; color:var(--gold-soft); flex:0 0 auto; }

/* global reduced-motion safety net (WCAG 2.3.3 / user preference): no hover lifts, fades or slides */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .btn:hover,.appr-card:hover,.social-row a:hover{ transform:none; }
}

/* ---------- responsive tweaks ---------- */
@media (max-width:620px){
  body{ font-size:16px; }
  .nav-cta .btn{ padding:10px 16px; font-size:14px; }
  .brand img{ height:44px; }
}
/* 1.4.10 reflow: at very narrow widths the header CTA is dropped (the same link lives in the menu drawer) */
@media (max-width:540px){
  .nav-cta > .btn{ display:none; }
}

/* ---------- mobile polish: tighter rhythm, no wasted space ---------- */
@media (max-width:620px){
  /* hero */
  .hero h1{ font-size:clamp(31px,8.8vw,42px); margin-bottom:12px; }
  .hero .lede{ font-size:16.5px; line-height:1.55; margin-bottom:10px; }
  .hero .reg{ margin-bottom:20px; }
  .hero-actions{ margin-bottom:22px; gap:10px; }
  .hero-actions .btn{ width:100%; }
  .cred-row{ gap:8px; }
  .cred{ padding:7px 12px; font-size:12px; gap:7px; }
  .cred svg{ width:14px; height:14px; }
  .hero::before{ opacity:.045; }
  /* section headings */
  .eyebrow{ margin-bottom:12px; }
  .section-title{ font-size:clamp(26px,7.4vw,34px); }
  .section-lead{ font-size:16px; }
  /* about — compact, centred photo */
  .about-grid{ gap:26px; }
  .about-photo{ aspect-ratio:3/4; max-width:300px; margin-inline:auto; width:100%; }
  .about-body p{ font-size:16.5px; margin-bottom:14px; }
  /* services */
  .svc-feature .svc-copy{ padding:26px 22px; }
  .svc-cta{ width:100%; font-size:15px; padding-inline:18px; }
  .svc-feature .svc-visual{ padding:24px 22px; }
  /* approach */
  .approach-grid{ gap:16px; }
  .appr-card{ padding:24px 20px; }
  .appr-card .ac-num{ font-size:38px; }
  /* compliance */
  .comp-grid{ gap:12px; }
  .acc-btn{ padding:16px 15px; font-size:16.5px; gap:11px; }
  .acc-panel{ padding:2px 15px 18px; }
  /* contact */
  .contact-wrap{ gap:26px; }
  .contact-cta{ padding:24px 20px; }
  /* footer */
  .site-footer{ padding-top:44px; }
  .foot-top{ gap:26px; }
}

/* ==========================================================================
   SCROLL-REACTIVE COMPASS  (bottom-right, mirrors the accessibility button)
   ========================================================================== */
.scroll-compass{
  position:fixed; right:20px; bottom:calc(20px + env(safe-area-inset-bottom));
  z-index:950; width:52px; height:52px; border-radius:50%; padding:0; cursor:pointer;
  display:grid; place-items:center;
  background:radial-gradient(130% 130% at 30% 22%, var(--navy-2), var(--navy-3));
  border:1.5px solid rgba(214,190,126,.55);
  box-shadow:0 10px 30px -8px rgba(0,0,0,.55);
  opacity:0; visibility:hidden; transform:translateY(14px) scale(.85);
  transition:opacity .35s ease, transform .35s ease, box-shadow .2s ease, border-color .2s ease;
}
.scroll-compass.show{ opacity:1; visibility:visible; transform:none; }
.scroll-compass:hover{ box-shadow:0 16px 36px -8px rgba(0,0,0,.72); border-color:var(--gold); }
.scroll-compass:active{ transform:scale(.93); }
.scroll-compass .sc-icon{ width:34px; height:34px; display:block; will-change:transform; }
.scroll-compass:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }
@media (max-width:560px){ .scroll-compass{ right:16px; bottom:calc(18px + env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion:reduce){
  .scroll-compass{ transition:opacity .25s ease; transform:none; }
  .scroll-compass .sc-icon{ transform:none !important; }
}

/* ==========================================================================
   CARD ANIMATIONS
   ========================================================================== */
/* approach cards: staggered entrance + animated gold accent bar */
.appr-card::after{ content:""; position:absolute; left:0; top:0; height:3px; width:0; z-index:2;
  background:linear-gradient(90deg,var(--gold),var(--gold-soft)); transition:width .45s ease; }
.appr-card:hover::after,.appr-card:focus-within::after{ width:100%; }
@media (prefers-reduced-motion:no-preference){
  .approach-grid .appr-card:nth-child(2){ transition-delay:.12s; }
  .approach-grid .appr-card:nth-child(3){ transition-delay:.24s; }
  .appr-card .ac-ico{ transition:transform .35s ease; }
  .appr-card:hover .ac-ico{ transform:translateY(-3px) scale(1.06); }
}
/* compliance cards lift subtly */
.acc{ transition:box-shadow .25s ease, transform .2s ease; }
.acc:hover{ box-shadow:var(--shadow); }
/* contact officer cards lift + gold edge */
.contact-card{ transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.contact-card:hover{ transform:translateY(-3px); border-color:var(--gold); box-shadow:var(--shadow-sm); }
/* services feature card gentle lift */
.svc-feature{ transition:transform .3s ease, box-shadow .3s ease; }
.svc-feature:hover{ transform:translateY(-3px); box-shadow:var(--shadow); }
/* credential chips subtle hover on desktop */
@media (hover:hover){
  .cred{ transition:background .2s ease, border-color .2s ease; }
  .cred:hover{ background:rgba(255,255,255,.12); border-color:rgba(214,190,126,.5); }
}