/* EPC For Businesses — Certificate: theme layer (SEO Dons, 2026-10-22). Loaded after the template CSS; tokens + a few components only. */
@font-face{font-family:"Source Serif 4";src:url(/theme/fonts/source-serif-4-latin-wght-normal.woff2) format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
:root{--font-sans:"Inter Variable",system-ui,-apple-system,"Segoe UI",sans-serif;--font-display:"Source Serif 4","Inter Variable",system-ui,sans-serif;--color-brand-50:#f4f6f8;--color-brand-100:#e6eaef;--color-brand-200:#cbd3dc;--color-brand-300:#9aa8b8;--color-brand-500:#3d5068;--color-brand-600:#2c3d52;--color-brand-700:#1f2d3e;--color-brand-800:#16212e;--color-brand-900:#0e1620;--color-accent-300:#86efac;--color-accent-400:#4ade80;--color-accent-500:#12854f;--color-accent-600:#0b6b3f;--color-accent-700:#095c36;--color-surface-0:#fffdf8;--color-surface-50:#faf7ef;--color-surface-100:#f3eee2;--color-surface-200:#e5dfcf;--color-neutral-50:#faf7ef;--color-neutral-100:#f3eee2;--color-neutral-200:#e5dfcf;--color-text-primary:#121a23;--color-text-secondary:#465364;--color-text-muted:#636d7a;--radius-xs:2px;--radius-md:4px;--radius-lg:6px;--radius-xl:8px;--radius-2xl:10px;--gradient-accent:linear-gradient(135deg,#12854f 0%,#0b6b3f 100%);--gradient-hero-dark:linear-gradient(180deg,#1f2d3e 0%,#0e1620 100%);--gradient-mesh:radial-gradient(at 0% 0%,#1f2d3e 0%,transparent 50%),radial-gradient(at 100% 100%,#3d5068 0%,transparent 50%);--shadow-glow-accent:0 0 24px rgba(22,163,74,.35);}
h1,h2,h3,h4,h5,h6{letter-spacing:-.01em;font-weight:600;}
.text-display{letter-spacing:-.02em;font-weight:700;}
.eyebrow{color:#0b6b3f}
.bg-dark .eyebrow,.bg-mesh .eyebrow{color:#86efac}
.bg-dark .stat-value,.bg-mesh .stat-value{background:linear-gradient(135deg,#bbf7d0,#4ade80)!important;-webkit-background-clip:text!important;background-clip:text!important}
.btn{border-radius:4px}
.btn-primary{color:#ffffff}.btn-primary:hover{color:#ffffff}
header[data-mega-menu] a.btn{border-radius:4px;color:#ffffff!important;background:var(--gradient-accent)!important}
a{text-underline-offset:3px}
header[data-mega-menu]>.container-wide>a[href="/"]{display:inline-flex;align-items:center;gap:.55em;font-family:var(--font-display);letter-spacing:-.01em;text-decoration:none!important}
header[data-mega-menu]>.container-wide>a[href="/"]::before{content:"";flex:0 0 auto;width:1.65em;height:1.65em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='3' fill='%23fffdf8' stroke='%231f2d3e' stroke-width='1.5'/%3E%3Cg%3E%3Crect x='5' y='5' width='10' height='2.6' fill='%23008054'/%3E%3Crect x='5' y='8.6' width='12' height='2.6' fill='%2319b459'/%3E%3Crect x='5' y='12.2' width='14' height='2.6' fill='%238dce46'/%3E%3Crect x='5' y='15.8' width='16' height='2.6' fill='%23ffd500'/%3E%3Crect x='5' y='19.4' width='18' height='2.6' fill='%23fcaa65'/%3E%3Crect x='5' y='23' width='20' height='2.6' fill='%23ef8023'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
.timeline-number{border-color:#12854f!important;color:#1f2d3e!important}
footer a:not(.btn):not([class*="bg-"]){color:rgba(255,255,255,.86);text-decoration-color:rgba(255,255,255,.28)}
footer a:not(.btn):not([class*="bg-"]):hover{color:#fff;text-decoration-color:currentColor}
a[class*="bg-[var(--color-accent-"],button[class*="bg-[var(--color-accent-"]{color:#ffffff!important}
[class*="text-[var(--color-accent-"]:not(.bg-mesh *):not(.bg-dark *):not(footer *):not(header *):not([class*="bg-[var(--color-brand-7"] *):not([class*="bg-[var(--color-brand-8"] *):not([class*="bg-[var(--color-brand-9"] *){color:#0b6b3f}
.badge-accent{background:color-mix(in srgb,var(--color-accent-300) 45%%,#fff);color:var(--color-brand-900)}
:is([class*="bg-[var(--color-brand-7"],[class*="bg-[var(--color-brand-8"],[class*="bg-[var(--color-brand-9"]) :is(h2,h3,h4){color:#fff}
footer h2,footer h3,footer h4,footer .brand-word{color:#fff}
footer li>a{display:inline-block;margin-right:.7em}
.stat-value{font-size:clamp(1.05rem,8.4cqi,2.25rem);overflow-wrap:anywhere}
@media (max-width:1023px){header[data-mega-menu]>.container-wide>a[href="/"]{font-size:1rem;gap:.4em}header[data-mega-menu]>.container-wide>a[href="/"]::before{width:1.3em;height:1.3em}}
@media (max-width:480px){header[data-mega-menu]>.container-wide>a[href="/"]::before{display:none}}
header[data-mega-menu] a:not(.btn){text-decoration:none}header[data-mega-menu] a:not(.btn):hover{text-decoration:underline}
header[data-mega-menu]{background:#fffdf8!important;border-bottom:none!important;}

body{background:#fffdf8}
header[data-mega-menu]>.container-wide>a[href="/"]>svg{display:none}
@media (max-width:480px){header[data-mega-menu]>.container-wide>a[href="/"]::before{display:block;width:1.6em;height:1.6em}}
header[data-mega-menu]::after{content:"";display:block;height:6px;background:linear-gradient(90deg,#008054 0 14.28%,#19b459 0 28.57%,#8dce46 0 42.85%,#ffd500 0 57.14%,#fcaa65 0 71.42%,#ef8023 0 85.71%,#e9153b 0)}
.hero-split{background:linear-gradient(180deg,#faf7ef 0%,#fffdf8 100%)!important}
.hero-split::before{background:radial-gradient(circle,rgba(22,163,74,.10) 0%,transparent 70%)!important}
.hero-image-decor{background:linear-gradient(180deg,#008054,#19b459,#8dce46,#ffd500,#fcaa65,#ef8023,#e9153b)!important;opacity:.22!important;border-radius:4px!important}
.card-image-wrapper{border-radius:4px!important;box-shadow:0 0 0 1px #e5dfcf,0 18px 36px rgba(14,22,32,.12)!important}
.btn-primary{background:linear-gradient(135deg,#12854f,#0b6b3f)!important;color:#fff!important}
.btn-primary:hover{color:#fff!important}
.stat-value{background:linear-gradient(135deg,#0b6b3f,#12854f)!important;-webkit-background-clip:text!important;background-clip:text!important}
.card{border-radius:4px;border-color:#e5dfcf;box-shadow:none}
h1,h2,.text-display{font-optical-sizing:auto}

/* 2026-10-23 fixes from the phone, speed and accessibility checks */
/* speed: the first screen paints at once instead of fading in after JavaScript runs (the fade held back LCP on phones) */
.reveal-ready :is(.hero-split,.hero-fullbleed,main>section:first-child) :is(.reveal,.reveal-fade,.reveal-left,.reveal-right,.reveal-scale),.reveal-ready main>section:first-child:is(.reveal,.reveal-fade,.reveal-left,.reveal-right,.reveal-scale){opacity:1;transform:none;transition:none}
/* readability: small de-emphasised text was faded with opacity, which took it under the 4.5:1 contrast minimum */
nav.breadcrumbs,.iq-form .iq-gdpr{opacity:1}
main :is(p,span,small,li,caption,figcaption,dd,dt,label,time,cite,div.text-xs,div.text-sm):is(.opacity-60,.opacity-70,.opacity-75,.opacity-80){opacity:1}
.quick-answer .qa-label{font-size:.75rem}
/* tap targets: footer links at least 24px tall */
footer li>a{padding-block:2px}
/* phones: grid and fieldset contents could push the quote form and the calculators wider than the screen */
@media (max-width:1023px){main .grid>*,main fieldset{min-width:0}}
@media (max-width:767px){.prose-content table{display:block;max-width:100%;overflow-x:auto}}
.quote-progress{flex-wrap:wrap}
@media (max-width:480px){main dd.whitespace-nowrap{white-space:normal}}
/* phones: the "Get a quote" bar is always on screen, so the header button gives its room back to the site name */
@media (max-width:480px){header[data-mega-menu]>.container-wide>.shrink-0>a.btn{display:none}}
/* iPhones zoom into any form field under 16px when it is tapped */
.iq-form.iq-form :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:16px}
/* desktop: the phone-menu switch is not used there, so it leaves the keyboard order (its label is hidden on desktop) */
@media (min-width:1024px){#mobile-nav-toggle{display:none}}
