/* ==========================================================================
   NZ Calculator — Shared Stylesheet
   Loaded on every page. Page-specific styles (e.g. calculator UI for a
   specific tool) stay scoped inside that page's own <style> block using a
   unique prefix (e.g. .td-scope for term deposit), same pattern as before.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root{
  --nzh-navy:#0f2a4a;
  --nzh-navy-2:#1c3d63;
  --nzh-teal:#0d7a6e;
  --nzh-teal-dark:#075f56;
  --nzh-teal-light:#e6f4f2;
  --nzh-sand:#f7f5f0;
  --nzh-white:#ffffff;
  --nzh-ink:#1a1f27;
  --nzh-muted:#5b6472;
  --nzh-line:#e3e0d8;
  --nzh-soft:#f3f6f7;
  --nzh-warn:#7b4c00;
  --nzh-warn-bg:#fff4dc;
  --nzh-radius:14px;
  --nzh-shadow:0 10px 28px rgba(15,42,74,.08);
}

*,*::before,*::after{box-sizing:border-box;}

html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{scroll-behavior:auto!important;transition:none!important;}
}

body{
  margin:0;
  background:var(--nzh-sand);
  color:var(--nzh-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.58;
}

h1,h2,h3{
  color:var(--nzh-navy);
  font-family:Georgia,"Times New Roman",serif;
  line-height:1.18;
}

a{color:var(--nzh-teal);}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{
  outline:3px solid rgba(13,122,110,.28);
  outline-offset:3px;
}

[hidden]{display:none!important;}

.nzh-wrap{width:min(1160px,calc(100% - 40px));margin:0 auto;}

/* ---- Site header / nav (shared across every page) ---- */
.nzh-site-header{
  background:var(--nzh-navy);
  padding:16px 0;
}
.nzh-site-header .nzh-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.nzh-site-logo{
  color:#fff!important;
  font-family:Georgia,serif;
  font-size:1.25rem;
  font-weight:700;
  text-decoration:none;
}
.nzh-site-nav{display:flex;gap:18px;list-style:none;margin:0;padding:0;}
.nzh-site-nav a{color:rgba(255,255,255,.88)!important;text-decoration:none;font-size:.92rem;font-weight:600;}
.nzh-site-nav a:hover{color:#fff!important;}

/* ---- Skip link ---- */
.nzh-skip{
  position:absolute;left:12px;top:-80px;z-index:9999;
  padding:11px 14px;border-radius:8px;
  background:var(--nzh-navy);color:#fff!important;font-weight:700;text-decoration:none;
}
.nzh-skip:focus{top:12px;}

/* ---- Site footer (shared across every page) ---- */
.nzh-site-footer{
  border-top:1px solid var(--nzh-line);
  background:var(--nzh-sand);
  color:var(--nzh-muted);
  font-size:.78rem;
  padding:26px 0 34px;
}
.nzh-site-footer p{margin:5px 0;}
.nzh-site-footer a{color:var(--nzh-navy);}

/* ---- Section rhythm helpers reused site-wide ---- */
.nzh-section{padding:64px 0;}
.nzh-section-white{background:#fff;}
.nzh-section-soft{background:var(--nzh-soft);}
.nzh-section-head{max-width:760px;margin:0 0 26px;}
.nzh-section-head.center{text-align:center;margin-left:auto;margin-right:auto;}
.nzh-eyebrow{
  margin:0 0 7px;color:var(--nzh-teal);font-size:.78rem;font-weight:800;
  letter-spacing:.09em;text-transform:uppercase;
}
.nzh-section h2{margin:0;font-size:clamp(1.7rem,3vw,2.55rem);}
.nzh-section-intro{margin:12px 0 0;color:var(--nzh-muted);font-size:1rem;}

/* ---- Related-calculator link pills (reused on every calculator page) ---- */
.nzh-related-links{display:flex;flex-wrap:wrap;gap:10px;}
.nzh-related-links a{
  display:inline-block;padding:9px 16px;background:#fff;border:1px solid var(--nzh-line);
  border-radius:99px;color:var(--nzh-navy);text-decoration:none;font-size:.88rem;font-weight:600;
}
.nzh-related-links a:hover{border-color:var(--nzh-teal);color:var(--nzh-teal);}

@media (max-width:680px){
  .nzh-wrap{width:min(100% - 24px,1160px);}
  .nzh-site-nav{display:none;} /* swap for a mobile menu when built */
}
