/* ==========================================================================
   Grivaa Legal — upgrade layer
   Loaded last on every page. Fixes contrast, layout and accessibility
   without touching the original rule set.
   ========================================================================== */

/* ---------- 1. Buttons: navy ink on saffron (6.2–7.7:1 instead of 2.80:1) --- */
.btn-primary,
a.btn-primary,
button.btn-primary{
  background:linear-gradient(135deg,var(--orange-light) 0%,var(--orange) 100%);
  color:var(--btn-ink);
  font-weight:750;
  border:1.5px solid #E06A10;
  box-shadow:0 8px 22px rgba(185,58,10,.28);
}
.btn-primary:hover,a.btn-primary:hover,button.btn-primary:hover{
  background:linear-gradient(135deg,#FCA55B 0%,#FB8A2E 100%);
  color:var(--btn-ink);
  box-shadow:0 16px 34px rgba(185,58,10,.34);
}
.btn-primary::after,.btn-blue::after{background:linear-gradient(120deg,transparent,rgba(255,255,255,.28),transparent)}

/* WhatsApp: navy on #25D366 is ~8:1; white was 1.98:1 */
.btn-wa,.btn-wa:hover,.fab .wa,.float-wa,.contact__channel--wa .contact__channel-icon{
  color:var(--wa-ink);
}
.btn-wa{background:var(--wa);font-weight:750}
.btn-wa:hover{background:#1DB757}
.float-wa,.fab .wa{box-shadow:0 10px 28px rgba(18,140,74,.38)}

/* ---------- 2. Number badges: navy plate, gold numeral (8.36:1) ------------- */
.why-card:nth-child(odd) .why-card__num,
.process-step:nth-child(even) .process-step__num{
  background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);
  color:#D4AF5A;
  box-shadow:0 4px 14px rgba(8,26,51,.28);
}
.process-step__num{background:linear-gradient(135deg,var(--navy-2) 0%,var(--navy-3) 100%);color:#FFFFFF}
[data-theme="dark"] .why-card:nth-child(odd) .why-card__num,
[data-theme="dark"] .process-step:nth-child(even) .process-step__num{
  background:var(--surface-3);color:#E2BC6A;border:1px solid var(--border-strong);
}
[data-theme="dark"] .process-step__num{background:var(--surface-3);color:#FFFFFF;border:1px solid var(--border-strong)}

/* ---------- 3. Remaining white-on-orange spots ----------------------------- */
.modal__close:hover{background:var(--orange);color:var(--btn-ink)}
[data-theme="dark"] .tab-btn[aria-selected="true"].tab-btn--tax{background:var(--orange);color:var(--btn-ink)}

/* ---------- 4. Depth: the ivory page, white cards, parchment bands ---------- */
.section--ivory,.trust,.section--alt{background:var(--surface-2)}
[data-theme="dark"] .section--ivory,[data-theme="dark"] .trust,[data-theme="dark"] .section--alt{background:var(--surface-2)}
/* cards that sit on the ivory page — not the ones inside a navy band, which
   keep their translucent white-on-navy treatment */
.card,.pillar,.why-card,.help-card,.mvp-card,
.diligence-card,.docs-card,.tech-card,.hero__card,.modal__card,.form-card{
  background:var(--surface);
}
.pillar:hover,.why-card:hover,.help-card:hover{border-color:var(--gold)}
/* one dark-theme definition only (the old file had two that fought each other) */
html[data-theme="dark"] .process-step,
html[data-theme="dark"] .problem-card,
html[data-theme="dark"] .nri-card,
html[data-theme="dark"] .process-step:hover,
html[data-theme="dark"] .problem-card:hover,
html[data-theme="dark"] .nri-card:hover{background:var(--surface)}
html[data-theme="dark"] .why-card__num{background:var(--surface-3)}
html[data-theme="dark"] .footer,html[data-theme="dark"] .closing{background:var(--surface-2)}
[data-theme="dark"] .form-aside{background:var(--surface-3);border-right:1px solid var(--border)}

/* gold hairline ornament on feature bands */
.contact,.nri,.closing{position:relative}
.contact::after,.nri::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.65}

/* ---------- 5. Eyebrows, tags and small gold text -------------------------- */
.eyebrow{background:var(--blue-soft);color:var(--blue-deep)}
.eyebrow.eyebrow--gold{background:rgba(201,162,77,.14);color:var(--gold-ink)}
[data-theme="dark"] .eyebrow.eyebrow--gold{color:var(--gold)}
.snap-pill,.hero-badge b,.pillar__go,.hero h1 .hl{color:var(--orange-deep)}
[data-theme="dark"] .snap-pill,[data-theme="dark"] .hero-badge b,[data-theme="dark"] .hero h1 .hl{color:var(--orange-light)}

/* ---------- 5b. Saffron sitting ON navy needs the light saffron ------------
   Re-pointing the tokens inside the navy surfaces means every descendant
   inherits the readable value, whatever a page's own selector specificity is. */
.footer,.foot-contact,.closing,.contact__info,.form-aside,
.problem,.callout,.nri,.section--dark,.lp-alert--navy,
.prose .cta-box,[class*="--navy"],[class*="--dark"]{
  --orange-deep:#FB923C;
  --blue-deep:#8FB3FF;
  --blue-bright:#8FB3FF;
  --gold-ink:#E2BC6A;
  --gold-icon:#E2BC6A;
  --text-mute:#A9B6CC;
  --text-soft:#C6D0E0;
}

/* light panels nested inside a navy band take the light-surface tokens back */
.nextstrip,.contact__info .nextstrip,
.footer .box,.closing .card,.contact__info .card{
  --orange-deep:#B93A0A;
  --blue-deep:#1E40AF;
  --blue-bright:#1E40AF;
  --gold-ink:#7A5B14;
  --gold-icon:#9C7A28;
  --text-soft:#44526B;
  --text-mute:#5F6B80;
}
.nextstrip,.nextstrip strong,.nextstrip div{color:var(--text)}
.nextstrip__head{color:var(--blue-deep)}
.nextstrip__steps span{background:var(--blue-fill);color:#FFFFFF}
/* in the dark theme that panel is dark too, so it keeps the dark tokens */
[data-theme="dark"] .nextstrip,[data-theme="dark"] .contact__info .nextstrip{
  --orange-deep:#FB923C;
  --blue-deep:#8FB3FF;
  --blue-bright:#8FB3FF;
  --gold-ink:#E2BC6A;
  --gold-icon:#E2BC6A;
  --text-soft:#B4BFD3;
  --text-mute:#8794AB;
}
[data-theme="dark"] .nextstrip,[data-theme="dark"] .nextstrip strong,
[data-theme="dark"] .nextstrip div{color:var(--text)}
.nextstrip__note{color:var(--text-mute)}

/* numbers on a saffron plate need navy ink; the blue ones keep white */
.flow-step:nth-child(2n) .flow-num,
.step-num--saffron,.tl-num--saffron{color:#081A33}

/* ---------- 6. Form fields need a 3:1 border ------------------------------- */
input,select,textarea{border-color:var(--input-bd)!important}
input::placeholder,textarea::placeholder{color:var(--text-mute);opacity:1}

/* ---------- 7. Visible keyboard focus (WCAG 2.4.7) ------------------------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--blue-deep);
  outline-offset:2px;
  border-radius:4px;
}
[data-theme="dark"] a:focus-visible,[data-theme="dark"] button:focus-visible,
[data-theme="dark"] input:focus-visible,[data-theme="dark"] select:focus-visible,
[data-theme="dark"] textarea:focus-visible,[data-theme="dark"] summary:focus-visible{
  outline-color:#E2BC6A;
}

/* ---------- 8. Skip link ---------------------------------------------------- */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--navy);color:#FFFFFF;padding:12px 20px;border-radius:0 0 8px 0;
  font-weight:700;font-size:.95rem;
}
.skip-link:focus{left:0}

/* ---------- 9. Header: no overflow between 769px and 940px ----------------- */
@media (max-width:1024px){
  .nav__links,.nav__cta,.nav__phone{display:none!important}
  .nav__toggle{display:flex!important}
}
.nav__right{min-width:0;flex-shrink:1}
.nav__inner,.nav .container{min-width:0}

/* ---------- 10. No sideways scroll on small phones ------------------------- */
@media (max-width:520px){
  .container{padding-left:18px;padding-right:18px}
  .contact__info,.form-aside,.form-card,.hero__card,.contact__form,
  .grid>*,[class*="grid"]>*,[class*="cols"]>*{min-width:0;max-width:100%}
  .btn,.btn-primary,.btn-outline,.btn-wa{white-space:normal;max-width:100%}
  table{display:block;overflow-x:auto}
}

/* ---------- 11. Readable small text and 44px tap targets ------------------- */
.eyebrow,.pillar__kicker,.tag,.chip,small,.note,.footer small{font-size:max(.75rem,12px)}
@media (max-width:520px){
  body{font-size:16px}
  .eyebrow,.pillar__kicker,.tag,.chip{font-size:12px;letter-spacing:.10em}
  p,li{font-size:max(1rem,16px)}
}
.btn,.btn-primary,.btn-outline,.btn-wa,.nav__toggle,.theme-toggle,.float-wa{
  min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;
}
.nav__toggle,.theme-toggle{min-width:44px}
.footer__links a,.footer a{display:inline-block;padding:6px 0}
.footer__links{display:flex;flex-wrap:wrap;gap:4px 18px}

/* ---------- 12. One floating action on phones ------------------------------ */
@media (max-width:860px){
  .social-strip{display:none}
}

/* ---------- 13. Form status messages --------------------------------------- */
.form-status{margin-top:12px;font-size:.92rem;font-weight:600;line-height:1.5}
.form-status:empty{display:none}
.form-status[data-state="ok"]{color:var(--green)}
.form-status[data-state="error"]{color:var(--red)}
.form-status a{text-decoration:underline;font-weight:700}
.consent-row{display:flex;gap:10px;align-items:flex-start;margin:14px 0 4px;font-size:.86rem;line-height:1.5;color:var(--text-soft)}
.consent-row input[type=checkbox]{width:18px;height:18px;margin-top:2px;flex:0 0 18px;accent-color:var(--blue-deep)}
.consent-row a{color:var(--blue-deep);text-decoration:underline}

/* ---------- 13b. Footer address, hours and social row ---------------------- */
.foot-address{
  font-style:normal;
  font-size:max(.82rem,13px);
  line-height:1.6;
  color:#C6D0E0;
  margin:14px 0 0;
}
.foot-hours{display:block;margin-top:6px;color:#A9B6CC;font-size:max(.78rem,12px)}
.foot-socials{display:flex;gap:10px;margin-top:16px}
.foot-socials a{
  width:38px;height:38px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(251,248,241,.07);
  border:1px solid rgba(226,188,106,.45);
  color:#E2BC6A;
  transition:background .25s var(--ease),transform .25s var(--ease),color .25s var(--ease);
}
.foot-socials a:hover{background:#E2BC6A;color:#081A33;transform:translateY(-2px)}
.foot-socials a:focus-visible{outline:3px solid #E2BC6A;outline-offset:3px}
@media (max-width:520px){.foot-socials a{width:44px;height:44px}}

/* ---------- 14. Cookie consent banner -------------------------------------- */
.cookie-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:300;
  background:var(--navy);color:#F4EFE3;
  border-top:2px solid var(--gold);
  padding:16px 20px;
  display:none;
  box-shadow:0 -10px 34px rgba(0,0,0,.28);
}
.cookie-bar[data-show="1"]{display:block}
.cookie-bar__in{max-width:var(--container);margin:0 auto;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.cookie-bar p{margin:0;font-size:.9rem;line-height:1.55;flex:1 1 320px;color:#F4EFE3}
.cookie-bar a{color:#E2BC6A;text-decoration:underline}
.cookie-bar__btns{display:flex;gap:10px;flex-wrap:wrap}
.cookie-bar button{
  min-height:44px;padding:0 20px;border-radius:10px;font-weight:750;font-size:.9rem;
  font-family:inherit;cursor:pointer;
}
.cookie-accept{background:var(--orange-light);color:#081A33;border:1.5px solid #E06A10}
.cookie-decline{background:transparent;color:#F4EFE3;border:1.5px solid rgba(244,239,227,.55)}
.cookie-accept:hover{background:#FCA55B}
.cookie-decline:hover{background:rgba(255,255,255,.08)}
@media (max-width:620px){
  .cookie-bar__in{flex-direction:column;align-items:stretch}
  .cookie-bar__btns button{flex:1}
}

/* ---------- 14b. Related-links band --------------------------------------- */
.relnav{background:var(--surface-2);border-top:1px solid var(--border);padding:56px 0}
.relnav__h{
  font-family:var(--font-serif);
  font-size:clamp(1.35rem,2.4vw,1.75rem);
  color:var(--ink);margin:0 0 24px;
}
.relnav__list{list-style:none;margin:0;padding:0;display:grid;gap:18px;grid-template-columns:repeat(3,1fr)}
.relnav__card{
  display:flex;flex-direction:column;gap:7px;height:100%;
  background:var(--surface);
  border:1px solid var(--border);
  border-left:3px solid var(--gold);
  border-radius:var(--radius);
  padding:20px 22px;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease);
}
.relnav__card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-left-color:var(--orange)}
.relnav__kind{
  font-family:'Manrope',sans-serif;font-size:max(.68rem,12px);font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);
}
.relnav__card strong{font-size:max(1rem,16px);line-height:1.35;color:var(--ink)}
.relnav__d{font-size:max(.88rem,14px);line-height:1.55;color:var(--text-soft)}
@media (max-width:900px){.relnav__list{grid-template-columns:1fr}.relnav{padding:40px 0}}

/* ---------- 15. Legal document pages (privacy, terms, disclaimer) ---------- */
.legal-wrap{max-width:820px;margin:0 auto;padding:56px 24px 80px}
.legal-wrap h1{font-family:var(--font-serif);font-size:clamp(2rem,4.5vw,2.8rem);line-height:1.15;margin-bottom:10px;color:var(--ink)}
.legal-wrap .updated{color:var(--text-mute);font-size:.9rem;margin-bottom:34px}
.legal-wrap h2{font-family:var(--font-serif);font-size:1.4rem;margin:38px 0 12px;color:var(--ink)}
.legal-wrap h3{font-size:1.05rem;margin:24px 0 8px;color:var(--ink)}
.legal-wrap p,.legal-wrap li{color:var(--text);line-height:1.72;margin-bottom:12px}
.legal-wrap ul,.legal-wrap ol{padding-left:22px;margin-bottom:14px}
.legal-wrap a{color:var(--blue-deep);text-decoration:underline}
.legal-wrap .box{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--gold);border-radius:12px;padding:18px 20px;margin:22px 0}
.legal-wrap table{width:100%;border-collapse:collapse;margin:18px 0;font-size:.94rem}
.legal-wrap th,.legal-wrap td{border:1px solid var(--border);padding:10px 12px;text-align:left;vertical-align:top}
.legal-wrap th{background:var(--surface-3);font-weight:700;color:var(--ink)}

/* ---------- 16. Decorative icons should not be announced ------------------- */
[aria-hidden="true"]{pointer-events:none}

@media (prefers-reduced-motion:reduce){
  .float-wa::before,.fab .wa::before{animation:none}
}


/* ---------- 17. Promoted headings keep their original look ------------- */
/* heading order was repaired for accessibility; these twins keep the
   visual result identical to before the change. */
.hero-card h2{font-family:'Manrope',sans-serif;font-weight:800;font-size:0.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);margin-bottom:16px}
.hero__mini-head h2{font-size:1.02rem;font-weight:800;color:var(--ink);margin:0}
.hubcard h2{font-size:1.12rem;margin:8px 0 8px;font-weight:800}
.mcheck h3{font-family:'Manrope',sans-serif;font-size:0.75rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--text-mute);margin-bottom:12px}
.nri-card h3{font-size:.97rem;margin-bottom:6px;font-weight:800;color:#fff}
.problem-card__text h3{color:#fff;font-size:.98rem;margin-bottom:4px;font-weight:700}
.process-step h3{font-size:1rem;margin-bottom:8px;font-weight:700;color:#fff}
.tech-card h3{color:var(--ink);font-size:1rem;margin-bottom:6px}
.value-card h3{font-size:1rem;font-weight:800;margin-bottom:8px}