/* Self-hosted Poppins (latin subset) — no external requests */
@font-face{
  font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap;
  src:url('assets/fonts/poppins-regular.woff2') format('woff2');
}
@font-face{
  font-family:'Poppins'; font-style:normal; font-weight:500; font-display:swap;
  src:url('assets/fonts/poppins-medium.woff2') format('woff2');
}
@font-face{
  font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap;
  src:url('assets/fonts/poppins-semibold.woff2') format('woff2');
}
@font-face{
  font-family:'Poppins'; font-style:normal; font-weight:700; font-display:swap;
  src:url('assets/fonts/poppins-bold.woff2') format('woff2');
}
@font-face{
  font-family:'Poppins'; font-style:normal; font-weight:800; font-display:swap;
  src:url('assets/fonts/poppins-extrabold.woff2') format('woff2');
}
@font-face{
  font-family:'Poppins'; font-style:normal; font-weight:900; font-display:swap;
  src:url('assets/fonts/poppins-black.woff2') format('woff2');
}

/* ==========================================================================
   AH SEND Consultancy — website styles
   Brand colours, type and layout carried over from the print booklet.
   ========================================================================== */
:root{
  --blue:#1A3FA2;
  --navy:#122B6E;
  --gold:#F3C143;
  --gold-dark:#8A6100;
  --sand:#FDF6E7;
  --tint:#EEF2FB;
  --ink:#141B33;
  --grey:#5B6584;
  --line:#E3E9F6;
  --white:#ffffff;
  --radius:18px;
  --radius-sm:12px;
  --shadow:0 18px 50px -24px rgba(18,43,110,.35);
  --shadow-sm:0 8px 24px -14px rgba(18,43,110,.30);
  --container:1180px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--ink); background:var(--white); line-height:1.6;
  font-weight:400; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ line-height:1.12; letter-spacing:-.02em; color:var(--navy); font-weight:900; }
p{ color:var(--grey); }

.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 24px; }
.eyebrow{
  display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.22em;
  text-transform:uppercase; color:var(--blue);
}
.section{ padding:96px 0; position:relative; }
.section--tint{ background:var(--tint); }
.section--sand{ background:var(--sand); }
.rule{ width:64px; height:5px; border-radius:4px; background:var(--gold); margin:14px 0 26px; }
.center{ text-align:center; }
.center .rule{ margin-left:auto; margin-right:auto; }
.lead{ font-size:1.06rem; max-width:60ch; }
.center .lead{ margin-left:auto; margin-right:auto; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55em; font-weight:700; font-size:.98rem;
  padding:.85em 1.5em; border-radius:999px; cursor:pointer; border:2px solid transparent;
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), background .18s;
  white-space:nowrap;
}
.btn svg{ width:1.05em; height:1.05em; }
.btn--gold{ background:var(--gold); color:#4a3500; box-shadow:0 10px 24px -12px rgba(243,193,67,.9); }
.btn--gold:hover{ transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(243,193,67,.95); }
.btn--navy{ background:var(--navy); color:#fff; }
.btn--navy:hover{ transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.btn--ghost{ background:transparent; color:var(--navy); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--blue); color:var(--blue); }
.btn--white{ background:#fff; color:var(--navy); }
.btn--white:hover{ transform:translateY(-2px); box-shadow:var(--shadow-sm); }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50; background:rgba(255,255,255,.88);
  backdrop-filter:saturate(150%) blur(10px); border-bottom:1px solid var(--line);
}
.nav{ display:flex; align-items:center; justify-content:space-between; height:76px; }
.nav__brand{ display:flex; align-items:center; gap:12px; }
.nav__brand img{ height:44px; width:auto; }
.nav__links{ display:flex; align-items:center; gap:30px; list-style:none; }
.nav__links a{ font-weight:600; font-size:.95rem; color:var(--navy); position:relative; padding:4px 0; }
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0; background:var(--gold);
  transition:width .2s var(--ease);
}
.nav__links a:hover::after{ width:100%; }
.nav__cta{ display:flex; align-items:center; gap:14px; }
.nav__toggle{ display:none; background:none; border:0; cursor:pointer; padding:8px; }
.nav__toggle span{ display:block; width:26px; height:2.5px; background:var(--navy); border-radius:2px; margin:5px 0; transition:.25s var(--ease); }

/* ---------- Hero ---------- */
.hero{ position:relative; background:var(--blue); color:#fff; overflow:hidden; }
.hero::before{
  content:""; position:absolute; right:-140px; top:-160px; width:520px; height:520px;
  border-radius:50%; background:rgba(243,193,67,.14);
}
.hero__inner{ display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; padding:74px 0 86px; position:relative; }
.hero__eyebrow{ color:var(--gold); }
.hero h1{ color:#fff; font-size:clamp(2.1rem,4.6vw,3.5rem); margin:16px 0 20px; }
.hero h1 .hl{ color:var(--gold); }
.hero__lead{ color:rgba(255,255,255,.9); font-size:1.12rem; max-width:52ch; }
.hero__loc{ display:inline-flex; align-items:center; gap:9px; margin-top:18px; padding:9px 15px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.16); border-radius:999px;
  font-size:.92rem; color:rgba(255,255,255,.92); }
.hero__loc svg{ width:18px; height:18px; color:var(--gold); flex:0 0 auto; }
.hero__loc strong{ color:#fff; font-weight:700; }
.hero__tags{ display:flex; flex-wrap:wrap; gap:10px; margin:28px 0 34px; }
.hero__tags span{ font-size:.8rem; font-weight:700; padding:.5em 1em; border-radius:999px; background:rgba(255,255,255,.12); color:#fff; }
.hero__tags span.gold{ background:var(--gold); color:#4a3500; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; }
.hero__media{ position:relative; }
.hero__media img{ width:100%; height:100%; max-height:460px; object-fit:cover; border-radius:22px; box-shadow:0 30px 60px -30px rgba(0,0,0,.55); }
.hero__badge{
  position:absolute; left:-22px; bottom:-22px; background:#fff; color:var(--navy);
  border-radius:16px; padding:16px 20px; box-shadow:var(--shadow); display:flex; align-items:center; gap:12px; max-width:260px;
}
.hero__badge .ic{ width:40px; height:40px; border-radius:50%; background:var(--tint); color:var(--blue); display:grid; place-items:center; flex:0 0 auto; }
.hero__badge b{ display:block; color:var(--navy); font-weight:800; font-size:.98rem; }
.hero__badge small{ color:var(--grey); font-size:.76rem; }

/* trust strip */
.trust{ background:var(--navy); color:#fff; }
.trust__inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; padding:20px 0; }
.trust__item{ display:flex; align-items:center; gap:12px; font-size:.92rem; color:rgba(255,255,255,.9); }
.trust__item svg{ width:22px; height:22px; color:var(--gold); flex:0 0 auto; }
.trust__item b{ color:#fff; }

/* ---------- About / Vision ---------- */
.about__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
.quote{
  background:var(--sand); border-radius:var(--radius); padding:30px 32px; margin:0 0 22px; border-left:6px solid var(--gold);
}
.quote p{ font-size:1.5rem; font-weight:900; color:var(--navy); letter-spacing:-.02em; line-height:1.2; }
.quote .qm{ color:var(--gold); }
.quote small{ display:block; margin-top:10px; color:var(--grey); font-weight:500; font-size:.9rem; }
.about__body p+p{ margin-top:14px; }
.about__media{ position:relative; }
.about__media img{ width:100%; height:100%; max-height:440px; object-fit:cover; border-radius:var(--radius); box-shadow:var(--shadow); }
.about__media figcaption{
  position:absolute; left:0; right:0; bottom:0; color:#fff; font-size:.82rem; font-weight:600;
  padding:44px 20px 16px; border-radius:0 0 var(--radius) var(--radius);
  background:linear-gradient(180deg,rgba(18,43,110,0),rgba(18,43,110,.9));
}
.stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:56px; }
.stat{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px 24px; box-shadow:var(--shadow-sm); }
.stat .ic{ width:46px; height:46px; border-radius:12px; background:var(--tint); color:var(--blue); display:grid; place-items:center; margin-bottom:14px; }
.stat h3{ font-size:1.05rem; margin-bottom:6px; }
.stat p{ font-size:.9rem; }

/* ---------- Areas of need ---------- */
.areas{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:52px; }
.area{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .2s var(--ease), box-shadow .2s var(--ease); }
.area:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.area__img{ height:180px; position:relative; }
.area__img img{ width:100%; height:100%; object-fit:cover; }
.area__body{ padding:26px 24px 28px; position:relative; }
.area__ic{ width:52px; height:52px; border-radius:50%; background:var(--blue); color:#fff; display:grid; place-items:center; position:absolute; top:-26px; left:24px; border:3px solid #fff; }
.area h3{ font-size:1.18rem; margin:12px 0 14px; }
.area ul{ list-style:none; }
.area li{ position:relative; padding-left:20px; margin-bottom:9px; font-size:.92rem; color:var(--grey); }
.area li::before{ content:""; position:absolute; left:0; top:.55em; width:7px; height:7px; border-radius:50%; background:var(--gold); }

/* ---------- Services (wheel-inspired) ---------- */
.services__hub{ display:flex; flex-direction:column; align-items:center; text-align:center; margin-bottom:8px; }
.hub-mark{ width:112px; height:112px; border-radius:50%; background:#fff; border:5px solid var(--gold); display:grid; place-items:center; box-shadow:var(--shadow-sm); margin-bottom:22px; }
.hub-mark img{ width:74px; height:auto; }
.svc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:52px; }
.svc{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:28px 26px 30px; box-shadow:var(--shadow-sm); transition:transform .2s var(--ease), box-shadow .2s var(--ease); }
.svc:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.svc__ic{ width:56px; height:56px; border-radius:16px; background:var(--blue); color:#fff; display:grid; place-items:center; margin-bottom:18px; }
.svc:nth-child(even) .svc__ic{ background:var(--gold); color:var(--navy); }
.svc h3{ font-size:1.16rem; margin-bottom:10px; }
.svc p{ font-size:.94rem; }
.svc--wide{ grid-column:1 / -1; display:grid; grid-template-columns:auto 1fr; gap:24px; align-items:center; background:var(--navy); color:#fff; }
.svc--wide .svc__ic{ background:var(--gold); color:var(--navy); margin-bottom:0; }
.svc--wide h3{ color:#fff; }
.svc--wide p{ color:rgba(255,255,255,.85); }

/* ---------- Steps ---------- */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:52px; }
.step{ background:#fff; border-radius:var(--radius); padding:30px 28px; border:1px solid var(--line); position:relative; box-shadow:var(--shadow-sm); }
.step__n{ font-size:2.2rem; font-weight:900; color:var(--gold); line-height:1; margin-bottom:12px; }
.step h3{ font-size:1.12rem; margin-bottom:8px; }
.step p{ font-size:.94rem; }
.steps__line{ display:none; }

/* ---------- Contact ---------- */
.contact__grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:48px; align-items:start; }
.contact__info h2{ color:#fff; font-size:clamp(1.8rem,3.2vw,2.4rem); }
.contact__info .lead{ color:rgba(255,255,255,.85); }
.contact__list{ list-style:none; margin-top:30px; display:flex; flex-direction:column; gap:18px; }
.contact__list li{ display:flex; align-items:center; gap:14px; }
.contact__list .ic{ width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.12); color:var(--gold); display:grid; place-items:center; flex:0 0 auto; }
.contact__list .k{ font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.55); font-weight:700; }
.contact__list .v{ font-size:1.02rem; font-weight:700; color:#fff; }
.contact__list a.v:hover{ color:var(--gold); }

.form-card{ background:#fff; border-radius:var(--radius); padding:34px; box-shadow:var(--shadow); }
.form-card h3{ font-size:1.25rem; margin-bottom:6px; }
.form-card .muted{ font-size:.9rem; margin-bottom:22px; }
.field{ margin-bottom:18px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
label{ display:block; font-size:.82rem; font-weight:700; color:var(--navy); margin-bottom:7px; }
label .req{ color:var(--blue); }
.input,.textarea,.select{
  width:100%; font:inherit; font-size:.95rem; color:var(--ink); background:#fff;
  border:1.5px solid var(--line); border-radius:12px; padding:.8em .9em; transition:border-color .15s, box-shadow .15s;
}
.input:focus,.textarea:focus,.select:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 4px rgba(26,63,162,.12); }
.textarea{ min-height:130px; resize:vertical; }
.hp{ position:absolute; left:-9999px; }
.form-actions{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:8px; }
.form-note{ font-size:.78rem; color:var(--grey); }

/* ---------- Footer ---------- */
.footer{ background:var(--navy); color:#fff; padding:60px 0 0; }
.footer__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding-bottom:44px; }
.footer__brand img{ height:52px; margin-bottom:16px; }
.footer__brand p{ color:rgba(255,255,255,.7); font-size:.92rem; max-width:36ch; }
.footer h4{ color:#fff; font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:16px; font-weight:800; }
.footer ul{ list-style:none; display:flex; flex-direction:column; gap:10px; }
.footer a{ color:rgba(255,255,255,.78); font-size:.94rem; }
.footer a:hover{ color:var(--gold); }
.footer__bar{ border-top:1px solid rgba(255,255,255,.12); padding:20px 0; display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between; align-items:center; }
.footer__bar small{ color:rgba(255,255,255,.6); font-size:.82rem; }
.footer__strip{ background:var(--gold); color:#4a3500; text-align:center; font-weight:700; letter-spacing:.08em; font-size:.8rem; padding:12px; }

/* section heading helper */
.sec-head{ max-width:64ch; }
.sec-head.center{ margin-left:auto; margin-right:auto; }

/* reveal on scroll */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .section{ padding:72px 0; }
  .hero__inner{ grid-template-columns:1fr; gap:36px; padding:56px 0 64px; }
  .hero__media{ order:-1; }
  .about__grid{ grid-template-columns:1fr; gap:36px; }
  .about__media{ order:-1; }
  .areas,.svc-grid,.steps,.stats{ grid-template-columns:1fr 1fr; }
  .contact__grid{ grid-template-columns:1fr; gap:32px; }
  .footer__grid{ grid-template-columns:1fr 1fr; }
  .svc--wide{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .nav__links, .nav__cta .btn{ display:none; }
  .nav__toggle{ display:block; }
  .nav__links a::after{ display:none; }              /* no underline on mobile */
  .nav[data-open="true"] .nav__links{
    display:flex; position:absolute; top:76px; left:0; right:0; flex-direction:column; gap:0;
    background:#fff; border-bottom:1px solid var(--line); padding:8px 0; box-shadow:var(--shadow-sm);
  }
  .nav[data-open="true"] .nav__links li{ width:100%; border-bottom:1px solid var(--line); }
  .nav[data-open="true"] .nav__links li:last-child{ border-bottom:0; }
  .nav[data-open="true"] .nav__links a{
    display:block; padding:16px 24px; font-size:1.02rem; color:var(--navy);
    border-left:4px solid transparent;
    transition:background .15s var(--ease), color .15s var(--ease), border-color .15s var(--ease);
  }
  /* whole-row highlight on hover / tap / current section */
  .nav[data-open="true"] .nav__links a:hover,
  .nav[data-open="true"] .nav__links a:focus,
  .nav[data-open="true"] .nav__links a:active,
  .nav[data-open="true"] .nav__links a.is-current{
    background:var(--blue); color:#fff; border-left-color:var(--gold);
  }
  .areas,.svc-grid,.steps,.stats,.field-row,.footer__grid{ grid-template-columns:1fr; }
  .stats{ margin-top:40px; }
  .hero__badge{ position:static; margin-top:16px; max-width:none; }
  .section{ padding:60px 0; }
  .form-card{ padding:24px; }
}

@media (prefers-reduced-motion:reduce){
  *{ scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; transition:none; }
}
