/* ================= Navy & Gold brand palette ================= */
/* Layout unchanged; palette re-graded from the logo: navy ink, gold accent, jewel-tone service grades */
:root{
  --paper:#F6F5F1; --surface:#FFFFFF; --ink:#1E2A3A; --muted:#5D6573; --line:#E5E1D8;
  --coral:#B8894D; --magenta:#9E4F5E; --sun:#D9B47A; --teal:#2E7D74; --cobalt:#2F5D7C; --violet:#4C3A5E;
  --gold:#B8894D; --gold-hi:#D9B47A; --gold-deep:#8F6230; --navy:#1E2A3A; --navy-2:#2C3E57;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#0F141D; --surface:#171E2A; --ink:#EEF0F4; --muted:#A3AAB7; --line:#263041;
  --coral:#D2A86F; --magenta:#C47A88; --sun:#E3C08A; --teal:#55A99E; --cobalt:#6E9CC0; --violet:#9C86B8;
  --gold:#D2A86F; --gold-hi:#E8C994; --gold-deep:#B5864C; --navy:#0B1018; --navy-2:#1A2434; color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#0F141D; --surface:#171E2A; --ink:#EEF0F4; --muted:#A3AAB7; --line:#263041;
  --coral:#D2A86F; --magenta:#C47A88; --sun:#E3C08A; --teal:#55A99E; --cobalt:#6E9CC0; --violet:#9C86B8;
  --gold:#D2A86F; --gold-hi:#E8C994; --gold-deep:#B5864C; --navy:#0B1018; --navy-2:#1A2434; color-scheme:dark}

/* service colour grades: a family of blues that sits with navy + gold */
.g-web{--g1:#2D6CB5;--g2:#15294B}
.g-seo{--g1:#2479B8;--g2:#0F3557}
.g-ppc{--g1:#3A73C9;--g2:#1E2F6E}
.g-social{--g1:#4A5FC1;--g2:#23285A}
.g-brand{--g1:#1E2A3A;--g2:#4A6F96}
.g-content{--g1:#237F9C;--g2:#163E5C}

/* gold call-to-action with navy text (strong contrast) */
.btn-primary{background:linear-gradient(135deg,var(--gold-hi),var(--gold));color:#1E2A3A;box-shadow:0 10px 24px -14px rgba(143,98,48,.9)}
.btn-primary:hover{background:linear-gradient(135deg,#E6C893,var(--gold-hi))}

/* headline highlight in graded gold */
.hero h1 .hl{background:linear-gradient(100deg,var(--gold-hi),var(--gold) 45%,var(--gold-deep));-webkit-background-clip:text;background-clip:text;color:transparent}

/* "Why" rules, process step labels */
.why > div:nth-child(1){border-color:var(--gold)}
.why > div:nth-child(2){border-color:var(--cobalt)}
.why > div:nth-child(3){border-color:var(--teal)}
.band{background:var(--navy);color:#EEF0F4}
.band .eyebrow,.band .lead{color:rgba(238,240,244,.7)}
.steps li{border-color:rgba(217,180,122,.25)}
.steps li::before{color:var(--gold-hi)}
.steps p{color:rgba(238,240,244,.72)}

/* consultation banner: deep navy with a gold glow */
.cta-band{background:radial-gradient(120% 140% at 100% 0%,rgba(217,180,122,.35),transparent 55%),linear-gradient(120deg,#1E2A3A,#2C3E57);color:#fff;border:1px solid rgba(217,180,122,.25)}
.cta-band h2{color:#fff}
.cta-band .btn-white{background:linear-gradient(135deg,#D9B47A,#B8894D);color:#1E2A3A}

/* footer always navy, bottom bar in gold */
footer{background:var(--navy);color:#EEF0F4}
footer .foot h4{color:rgba(238,240,244,.55)}
footer .foot a{color:rgba(238,240,244,.85)}
footer .foot a:hover{color:var(--gold-hi)}
footer .foot p,footer .foot li{color:rgba(238,240,244,.72)}
footer .foot-bottom{color:rgba(238,240,244,.55);border-top-color:rgba(238,240,244,.12)}
.foot .logo-word{color:#EEF0F4}
.colorbar{height:5px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-hi),var(--gold),var(--gold-deep))}
/* footer is navy in both themes, so it always uses the light mark */
footer .inverse .mark-navy{display:none!important}
footer .inverse .mark-light{display:block!important}

/* small details */
.ticks li::before{color:var(--gold)}
.svc-card:hover{border-color:var(--g1)}
.contact-grid .side .box.grade{color:#fff}
.chips input:checked + span{background:var(--navy);color:#fff;border-color:var(--navy)}
:root[data-theme="dark"] .chips input:checked + span{background:var(--gold);color:#1E2A3A;border-color:var(--gold)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .chips input:checked + span{background:var(--gold);color:#1E2A3A;border-color:var(--gold)}}
.success{border-color:var(--gold)}
:focus-visible{outline-color:var(--gold)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold)}
.logo-stage{background:radial-gradient(circle at 50% 52%,color-mix(in srgb,var(--gold) 20%,transparent),transparent 62%)}


/* v2.4: blue chip on the services "not sure" card */
.svc-card-cta .svc-chip{background:linear-gradient(135deg,#4F8FD6,#1F4E8C);color:#fff}
.svc-card-cta:hover{border-color:#4F8FD6}