/*
 * Elite Construction Logistics theme styles.
 *
 * Design direction: industrial workhorse premium. A dark steel base with a
 * hi-vis safety amber accent drawn from plant livery and hazard markings. The
 * signature is a diagonal hi-vis hazard stripe, used sparingly at the top of
 * heroes and section edges. Colour variables are injected inline from Welch
 * Settings (see inc/setup.php). This file provides the full system fallback
 * font stack behind DM Sans and Inter, so the site stays clean even before the
 * self hosted woff2 files are added to assets/fonts.
 *
 * No em dashes or en dashes anywhere in this file.
 */

/* -------------------------------------------------------------------------
 * Tokens
 * ---------------------------------------------------------------------- */
:root{
	--font-display:'DM Sans',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
	--font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;

	--wrap:1200px;
	--wrap-narrow:820px;
	--gap:clamp(1.25rem,3vw,2.5rem);
	--radius:14px;
	--radius-sm:10px;
	--radius-lg:22px;

	--shadow-sm:0 1px 2px rgba(16,24,28,.06),0 2px 8px rgba(16,24,28,.05);
	--shadow:0 10px 30px rgba(16,24,28,.10),0 2px 8px rgba(16,24,28,.06);
	--shadow-lg:0 30px 60px rgba(16,24,28,.16);

	--speed:.2s;
}

/* -------------------------------------------------------------------------
 * Reset and base
 * ---------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
	margin:0;
	font-family:var(--font-body);
	font-size:17px;
	line-height:1.65;
	color:var(--ink);
	background:var(--paper);
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
	overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;cursor:pointer}
button{font-family:inherit;cursor:pointer}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.12;letter-spacing:-.02em;margin:0 0 .5em}
p{margin:0 0 1rem}
ul{margin:0;padding:0;list-style:none}
strong{font-weight:700}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
hr{border:0;border-top:1px solid var(--line);margin:1.5rem 0}

.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.skip-link{position:absolute;left:-999px;top:0;z-index:1000;background:var(--accent);color:var(--brand);padding:.75rem 1.25rem;border-radius:0 0 8px 0;font-weight:700}
.skip-link:focus{left:0}

/* -------------------------------------------------------------------------
 * Layout helpers
 * ---------------------------------------------------------------------- */
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 clamp(1.35rem,4vw,2rem)}
.wrap--narrow{max-width:var(--wrap-narrow)}
.section{padding:clamp(3.5rem,7vw,6rem) 0}
.section__head{max-width:720px;margin:0 auto clamp(2rem,4vw,3rem);text-align:center}
.section__head--left{margin-left:0;margin-right:0;text-align:left}
.section__title{font-size:clamp(1.7rem,3.6vw,2.6rem);color:var(--brand)}
.section__lead{font-size:1.075rem;color:var(--muted);margin:0}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-display);font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);margin:0 0 .9rem}
.section__head .eyebrow{justify-content:center}
.section__head--left .eyebrow,.hero .eyebrow{justify-content:flex-start}

.prose p{margin:0 0 1.15rem;color:#2a3339}
.prose h2{font-size:1.5rem;color:var(--brand);margin-top:2rem}
.prose h3{font-size:1.2rem;color:var(--brand);margin-top:1.5rem}
.prose a{color:var(--accent-2);text-decoration:underline;text-underline-offset:2px}
.prose ul{margin:0 0 1.15rem;padding-left:0}
.prose li{position:relative;padding-left:1.6rem;margin:.4rem 0}
.prose li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:.5rem;background:var(--accent);border-radius:2px;transform:rotate(45deg)}

/* -------------------------------------------------------------------------
 * Buttons
 * ---------------------------------------------------------------------- */
.btn{
	display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
	font-family:var(--font-display);font-weight:700;font-size:.98rem;line-height:1;
	padding:.95rem 1.5rem;border-radius:999px;border:2px solid transparent;
	cursor:pointer;transition:transform var(--speed) ease,box-shadow var(--speed) ease,background var(--speed) ease,color var(--speed) ease,border-color var(--speed) ease;
	white-space:nowrap;
}
.btn .ecl-icon svg{width:18px;height:18px}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--accent{background:var(--accent);color:#20160a;box-shadow:0 8px 20px rgba(0,0,0,.14)}
.btn--accent:hover{background:var(--accent-2);color:#1c1305;box-shadow:var(--shadow)}
.btn--ghost{background:transparent;color:var(--brand);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--brand);background:var(--brand);color:#fff}
.btn--ghost-light{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.34)}
.btn--ghost-light:hover{background:#fff;color:var(--brand);border-color:#fff}

/* -------------------------------------------------------------------------
 * Icons. Every inline SVG icon is constrained so it can never balloon.
 * ---------------------------------------------------------------------- */
.ecl-icon{display:inline-flex;line-height:0;flex:none}
.ecl-icon svg{width:24px;height:24px;display:block}

/* -------------------------------------------------------------------------
 * Header and top bar
 * ---------------------------------------------------------------------- */
.site-header{position:sticky;top:0;z-index:200;background:var(--brand);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.topbar{background:var(--brand);color:#dfe7ec;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:40px;font-size:.85rem}
.topbar__msg{display:inline-flex;align-items:center;gap:.5rem;margin:0;color:#c7d3da}
.topbar__msg .ecl-icon svg{width:16px;height:16px;color:var(--accent)}
.topbar__contact{display:flex;align-items:center;gap:1.25rem}
.topbar__link{display:inline-flex;align-items:center;gap:.4rem;color:#eaf0f4;font-weight:600}
.topbar__link .ecl-icon svg{width:16px;height:16px;color:var(--accent)}
.topbar__link:hover{color:#fff}

.header__inner{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:114px;position:relative}

/* Logo */
.ecl-logo{display:inline-flex;align-items:center;gap:.7rem}
.ecl-logo__mark{display:inline-flex;line-height:0}
.ecl-mark{width:44px;height:44px;display:block;border-radius:9px}
.ecl-logo__word{display:flex;flex-direction:column;line-height:1}
.ecl-logo__l1{font-family:var(--font-display);font-weight:700;font-size:1.18rem;letter-spacing:.02em;color:#fff}
.ecl-logo__l2{font-family:var(--font-display);font-weight:600;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.ecl-logo--img img{max-height:52px;width:auto}
.ecl-logo--header.ecl-logo--img img{max-height:92px;width:auto}
.ecl-logo--footer.ecl-logo--img{margin-bottom:.1rem}
.ecl-logo--footer.ecl-logo--img img{max-height:60px;width:auto}
.ecl-logo--footer .ecl-logo__l1{color:#fff}
.ecl-logo--footer .ecl-logo__l2{color:var(--accent)}

/* -------------------------------------------------------------------------
 * Primary navigation. Desktop first, then the pure CSS mobile menu.
 * ---------------------------------------------------------------------- */
.nav-toggle{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.nav-burger,.nav-close{display:none}

.primary-nav{display:flex;align-items:center;gap:1.5rem}
.primary-nav .menu{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}
.primary-nav .menu li{position:relative}
.primary-nav .menu a{
	display:inline-flex;align-items:center;gap:.35rem;
	font-family:var(--font-display);font-weight:600;font-size:.96rem;color:#fff;
	padding:.55rem .7rem;border-radius:8px;transition:color var(--speed),background var(--speed);
}
.primary-nav .menu a:hover,.primary-nav .menu .current-menu-item>a,.primary-nav .menu .current-menu-parent>a{color:var(--accent);background:rgba(255,255,255,.08)}

/* Submenu (Services) */
.primary-nav .menu .sub-menu{
	position:absolute;top:calc(100% + 8px);left:0;min-width:250px;
	background:#fff;border:1px solid var(--line);border-radius:var(--radius);
	box-shadow:var(--shadow);padding:.4rem;display:flex;flex-direction:column;gap:.1rem;
	opacity:0;visibility:hidden;transform:translateY(6px);transition:all var(--speed);z-index:50;
}
.primary-nav .menu .menu-item-has-children:hover>.sub-menu,.primary-nav .menu .menu-item-has-children:focus-within>.sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.primary-nav .menu .sub-menu a{width:100%;font-weight:600;font-size:.9rem;color:var(--brand)}
.primary-nav .menu .sub-menu a:hover{color:var(--accent-2);background:rgba(0,0,0,.05)}
.primary-nav .menu .menu-item-has-children>a::after{content:"";width:.44rem;height:.44rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-left:.15rem;margin-top:-.2rem;opacity:.6}
.nav-cta{margin-left:.25rem;padding:.7rem 1.15rem;font-size:.9rem}

/* -------------------------------------------------------------------------
 * Hero and the hazard stripe signature
 * ---------------------------------------------------------------------- */
.hero{position:relative;background:var(--brand);color:#fff;overflow:hidden;isolation:isolate}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 85% -10%,rgba(239,156,17,.20),transparent 55%),linear-gradient(180deg,var(--brand),var(--brand-2));z-index:-1}
.hero__stripe{position:absolute;top:0;left:0;right:0;height:8px;background-image:repeating-linear-gradient(-45deg,var(--accent) 0 22px,#1c130a 22px 44px);opacity:.95}
.hero__inner{padding-top:clamp(3rem,7vw,5.5rem);padding-bottom:clamp(3rem,6vw,5rem)}
.hero--home .hero__inner{padding-top:clamp(3.5rem,8vw,6rem);padding-bottom:clamp(3.5rem,7vw,5.5rem)}
.hero--slim .hero__inner{padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:clamp(2.5rem,5vw,4rem)}
.hero .eyebrow{color:var(--accent)}
.hero__title{font-size:clamp(2.05rem,5vw,3.7rem);max-width:16ch;margin:0 0 1rem}
.hero--home .hero__title{max-width:20ch}
.hero--slim .hero__title,.hero--service .hero__title{max-width:24ch}
.hero__sub{font-size:clamp(1.05rem,2vw,1.28rem);color:#cfdae1;max-width:60ch;margin:0 0 1.75rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:.85rem;align-items:center}
.hero__actions .btn .ecl-icon svg{width:18px;height:18px}
.hero__svc-icon{display:inline-flex}.hero__svc-icon .ecl-icon svg{width:20px;height:20px;color:var(--accent)}
.hero__badges{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin-top:2rem}
.hero__badges li{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.92rem;color:#e7eef2}
.hero__badges .ecl-icon svg{width:16px;height:16px;color:var(--accent)}

/* Breadcrumbs */
.crumbs{background:var(--brand-2);color:#b9c6ce}
.crumbs ol{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;padding:.7rem 0;margin:0;font-size:.85rem}
.crumbs li{display:inline-flex;align-items:center;gap:.4rem}
.crumbs li:not(:last-child)::after{content:"/";opacity:.5;margin-left:.4rem}
.crumbs a{color:#d7e0e6}
.crumbs a:hover{color:#fff;text-decoration:underline}
.crumbs [aria-current="page"]{color:var(--accent)}

/* -------------------------------------------------------------------------
 * Cards (services)
 * ---------------------------------------------------------------------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.cards--services{grid-template-columns:repeat(3,1fr)}
.card{
	display:flex;flex-direction:column;gap:.65rem;background:#fff;border:1px solid var(--line);
	border-radius:var(--radius);padding:1.6rem;position:relative;overflow:hidden;
	transition:transform var(--speed),box-shadow var(--speed),border-color var(--speed);
}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform var(--speed)}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:transparent}
.card:hover::before{transform:scaleY(1)}
.card__icon{display:inline-flex;width:56px;height:56px;align-items:center;justify-content:center;border-radius:12px;background:var(--brand);color:var(--accent);margin-bottom:.3rem}
.card__icon .ecl-icon svg{width:28px;height:28px}
.card__title{font-size:1.22rem;color:var(--brand);margin:0}
.card__text{color:var(--muted);font-size:.98rem;margin:0;flex:1}
.card__more{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-display);font-weight:700;font-size:.9rem;color:var(--accent-2);margin-top:.35rem}
.card__more .ecl-icon svg{width:16px;height:16px;transition:transform var(--speed)}
.card:hover .card__more .ecl-icon svg{transform:translateX(4px)}

/* -------------------------------------------------------------------------
 * Why choose pillars
 * ---------------------------------------------------------------------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.25rem,2.5vw,2rem)}
.pillar{position:relative;padding:1.9rem 1.6rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.pillar__num{position:absolute;top:.5rem;right:1rem;font-family:var(--font-display);font-weight:700;font-size:3.4rem;color:var(--paper);z-index:0;letter-spacing:-.04em}
.pillar__icon{position:relative;z-index:1;display:inline-flex;width:52px;height:52px;align-items:center;justify-content:center;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#20160a;margin-bottom:.9rem}
.pillar__icon .ecl-icon svg{width:26px;height:26px}
.pillar__title{position:relative;z-index:1;font-size:1.25rem;color:var(--brand)}
.pillar__text{position:relative;z-index:1;color:var(--muted);margin:0}

/* -------------------------------------------------------------------------
 * Trust strip
 * ---------------------------------------------------------------------- */
.trust-strip{background:var(--brand);padding:clamp(1.5rem,3vw,2.25rem) 0}
.trust-strip__inner{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 2.25rem}
.trust-strip__item{display:inline-flex;align-items:center;gap:.6rem;color:#eaf1f5;font-family:var(--font-display);font-weight:600;font-size:.98rem}
.trust-strip__item .ecl-icon svg{width:20px;height:20px;color:var(--accent)}

/* -------------------------------------------------------------------------
 * Reviews
 * ---------------------------------------------------------------------- */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.reviews--all{grid-template-columns:repeat(3,1fr)}
.review{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;display:flex;flex-direction:column;gap:.85rem;height:100%;min-height:14rem}
.review__stars{display:inline-flex;gap:.15rem;color:var(--accent)}
.review__stars .ecl-icon svg{width:18px;height:18px}
.review__text{margin:0;font-size:1.02rem;color:#2a3339;line-height:1.6}
.review__by{font-family:var(--font-display);font-weight:700;color:var(--brand);font-size:.95rem;margin-top:auto;padding-top:.5rem}
.review__by span{color:var(--muted);font-weight:600}
.reviews__cta{text-align:center;margin-top:2rem}

.empty-reviews{text-align:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(2rem,4vw,3rem)}
.empty-reviews__h{font-size:1.6rem;color:var(--brand)}
.empty-reviews__list{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem 1.5rem;margin:1.5rem 0}
.empty-reviews__list li{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;color:var(--brand)}
.empty-reviews__list .ecl-icon svg{width:20px;height:20px;color:var(--accent)}

/* -------------------------------------------------------------------------
 * FAQ
 * ---------------------------------------------------------------------- */
.faq-block__inner{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.faqs{display:flex;flex-direction:column;gap:.75rem}
.faq{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.faq__q{display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;padding:1.1rem 1.35rem;font-family:var(--font-display);font-weight:700;color:var(--brand);font-size:1.03rem;list-style:none}
.faq__q::-webkit-details-marker{display:none}
.faq__mark{position:relative;flex:none;width:18px;height:18px}
.faq__mark::before,.faq__mark::after{content:"";position:absolute;background:var(--accent-2);border-radius:2px;transition:transform var(--speed)}
.faq__mark::before{top:8px;left:0;width:18px;height:2px}
.faq__mark::after{top:0;left:8px;width:2px;height:18px}
.faq[open] .faq__mark::after{transform:scaleY(0)}
.faq__a{padding:0 1.35rem 1.2rem;color:var(--muted)}
.faq__a p{margin:0}

/* -------------------------------------------------------------------------
 * CTA band
 * ---------------------------------------------------------------------- */
.ctaband{position:relative;background:var(--brand-2);color:#fff;overflow:hidden}
.ctaband::before{content:"";position:absolute;top:0;left:0;right:0;height:8px;background-image:repeating-linear-gradient(-45deg,var(--accent) 0 22px,#1c130a 22px 44px)}
.ctaband__inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-top:clamp(2.5rem,5vw,3.75rem);padding-bottom:clamp(2.5rem,5vw,3.75rem)}
.ctaband__h{font-size:clamp(1.5rem,3vw,2.1rem);margin:0 0 .35rem;color:#fff}
.ctaband__p{margin:0;color:#cfdae1;max-width:52ch}
.ctaband__actions{display:flex;flex-wrap:wrap;gap:.75rem;flex:none}

/* -------------------------------------------------------------------------
 * Aside cards: fact, feature, contact
 * ---------------------------------------------------------------------- */
.about-block__grid,.service-body__grid,.location-intro__grid,.contact-block__grid{
	display:grid;grid-template-columns:1.6fr 1fr;gap:clamp(1.5rem,3.5vw,3rem);align-items:start;
}
.factcard,.featurecard,.contactcard{background:var(--brand);color:#fff;border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.1rem);position:sticky;top:96px}
.factcard__h,.featurecard__h,.contactcard__h{color:#fff;font-size:1.3rem;margin-bottom:1.1rem}
.factcard__list,.featurecard__list{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.5rem}
.factcard__list li,.featurecard__list li{display:flex;align-items:flex-start;gap:.6rem;color:#dbe4ea;font-size:.98rem}
.factcard__list .ecl-icon svg,.featurecard__list .ecl-icon svg{width:18px;height:18px;color:var(--accent);margin-top:.15rem;flex:none}
.factcard__cta,.featurecard__cta{width:100%;margin-bottom:.85rem}
.factcard__tel,.featurecard__tel{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;width:100%;color:#fff;font-family:var(--font-display);font-weight:700}
.factcard__tel .ecl-icon svg,.featurecard__tel .ecl-icon svg{width:18px;height:18px;color:var(--accent)}

.contactcard__row{display:flex;align-items:center;gap:.6rem;padding:.55rem 0;color:#dbe4ea;font-weight:600}
.contactcard__row .ecl-icon svg{width:18px;height:18px;color:var(--accent);flex:none}
.contactcard__link{display:inline-flex;align-items:center;gap:.6rem;color:#fff;font-weight:700}
.contactcard__link:hover{color:var(--accent)}
.contactcard__rule{border-top:1px solid rgba(255,255,255,.16);margin:1rem 0}
.contactcard__sub{color:#fff;font-size:1.02rem;margin:0 0 .35rem}
.contactcard__areas{color:#cfdae1;margin:0;font-size:.95rem}

/* About extras */
.who-block{background:#fff;border-top:1px solid var(--line)}
.who-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.5rem)}
.who-grid__item{padding:1.5rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)}
.who-grid__item .ecl-icon svg{width:26px;height:26px;color:var(--accent-2)}
.who-grid__item h3{font-size:1.1rem;color:var(--brand);margin:.75rem 0 .4rem}
.who-grid__item p{margin:0;color:var(--muted);font-size:.94rem}

/* Related services on service pages */
.related-block{background:#fff;border-top:1px solid var(--line)}

/* -------------------------------------------------------------------------
 * Placeholders (clearly marked, never a broken image)
 * ---------------------------------------------------------------------- */
.ph{
	position:relative;border:2px dashed color-mix(in srgb,var(--brand) 25%,transparent);
	border-radius:var(--radius);background:
		repeating-linear-gradient(-45deg,rgba(27,42,51,.035) 0 12px,transparent 12px 24px),var(--paper);
	display:flex;align-items:center;justify-content:center;text-align:center;color:var(--muted);
	min-height:230px;margin:1.75rem 0;
}
.ph--wide{min-height:280px}
.ph__label{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--font-display);font-weight:700;font-size:.95rem;color:var(--brand);background:#fff;border:1px solid var(--line);padding:.6rem 1rem;border-radius:999px;box-shadow:var(--shadow-sm)}
.ph__label .ecl-icon svg{width:20px;height:20px;color:var(--accent-2)}

/* Uploaded images (set via Welch Settings, Images tab) */
.svc-photo,.about-photo{margin:1.75rem 0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.svc-photo img,.about-photo img{width:100%;height:auto;display:block}
.about-photo{margin-top:0}
.hero--home.has-photo{background-size:cover;background-position:center}
.hero--home.has-photo::after{background:linear-gradient(180deg,rgba(20,31,37,.80),rgba(20,31,37,.90))}

/* Branded service graphic (shown by default when no photo is uploaded) */
.svc-graphic{position:relative;overflow:hidden;isolation:isolate;border-radius:var(--radius);min-height:300px;margin:1.75rem 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1rem;text-align:center;background:linear-gradient(150deg,var(--brand),var(--brand-2))}
.svc-graphic::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 90% at 82% 12%,rgba(239,156,17,.22),transparent 55%)}
.svc-graphic__badge{display:inline-flex;align-items:center;justify-content:center;width:120px;height:120px;border-radius:26px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:var(--accent)}
.svc-graphic__badge .ecl-icon svg{width:64px;height:64px}
.svc-graphic__name{font-family:var(--font-display);font-weight:700;font-size:1.3rem;color:#fff;letter-spacing:-.01em;max-width:22ch;padding:0 1.25rem;margin:0}
.svc-graphic__stripe{position:absolute;left:0;right:0;bottom:0;height:10px;background-image:repeating-linear-gradient(-45deg,var(--accent) 0 20px,#1c130a 20px 40px)}

/* -------------------------------------------------------------------------
 * Areas
 * ---------------------------------------------------------------------- */
.area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.4rem)}
.area-card{display:flex;flex-direction:column;gap:.4rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;transition:transform var(--speed),box-shadow var(--speed)}
.area-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.area-card__pin{display:inline-flex;width:46px;height:46px;align-items:center;justify-content:center;border-radius:11px;background:var(--brand);color:var(--accent);margin-bottom:.4rem}
.area-card__pin .ecl-icon svg{width:24px;height:24px}
.area-card__name{font-size:1.2rem;color:var(--brand);margin:0}
.area-card__pc{font-size:.85rem;color:var(--muted);margin:0}
.area-card__more{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-display);font-weight:700;font-size:.85rem;color:var(--accent-2);margin-top:.5rem}
.area-card__more .ecl-icon svg{width:16px;height:16px}
.area-note{text-align:center;color:var(--muted);margin-top:2rem}

.location-services{background:#fff;border-top:1px solid var(--line)}

/* -------------------------------------------------------------------------
 * 404 links grid
 * ---------------------------------------------------------------------- */
.links-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.links-grid__item{display:flex;flex-direction:column;align-items:center;gap:.6rem;text-align:center;padding:1.6rem 1rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);font-family:var(--font-display);font-weight:700;color:var(--brand);transition:transform var(--speed),box-shadow var(--speed)}
.links-grid__item:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.links-grid__item .ecl-icon svg{width:22px;height:22px;color:var(--accent-2)}

/* -------------------------------------------------------------------------
 * Contact form
 * ---------------------------------------------------------------------- */
.cform{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.25rem)}
.cform__h{font-size:1.4rem;color:var(--brand);margin-bottom:1.25rem}
.cform__form{display:flex;flex-direction:column;gap:1rem}
.cform__grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}
.cform label{display:flex;flex-direction:column;gap:.4rem;font-family:var(--font-display);font-weight:600;font-size:.9rem;color:var(--brand)}
.cform__lbl{display:block;line-height:1.2}
.cform__req{color:var(--accent-2)}
.cform input,.cform textarea{
	font-family:var(--font-body);font-size:1rem;color:var(--ink);cursor:text;
	padding:.8rem .95rem;border:1.5px solid var(--line);border-radius:10px;background:var(--paper);
	transition:border-color var(--speed),box-shadow var(--speed);width:100%;
}
.cform input:focus,.cform textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(239,156,17,.18)}
.cform textarea{resize:vertical;min-height:120px}
.cform__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cform__submit{align-self:flex-start;margin-top:.25rem}
.cform__note{font-size:.85rem;color:var(--muted);margin:.35rem 0 0}
.cform__ok,.cform__err{padding:.9rem 1.1rem;border-radius:10px;font-weight:600;margin-bottom:1rem}
.cform__ok{background:#eaf6ec;color:#1f6b32;border:1px solid #c3e6cb}
.cform__err{background:#fdecea;color:#a3312a;border:1px solid #f5c6c0}

/* -------------------------------------------------------------------------
 * Blog
 * ---------------------------------------------------------------------- */
.posts{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.15rem,2.5vw,1.75rem)}
.post-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.75rem;display:flex;flex-direction:column;gap:.6rem;transition:transform var(--speed),box-shadow var(--speed)}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.post-card__date{font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-2);margin:0}
.post-card__title{font-size:1.3rem;color:var(--brand);margin:0}
.post-card__title a:hover{color:var(--accent-2)}
.post-card__excerpt{color:var(--muted);margin:0;flex:1}
.post-card__more{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-display);font-weight:700;color:var(--accent-2);font-size:.9rem}
.post-card__more .ecl-icon svg{width:16px;height:16px}

.page-single__title,.post-single__title{font-size:clamp(1.8rem,4vw,2.6rem);color:var(--brand)}
.post-single__date{font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-2);margin:0 0 .5rem}
.post-single__head,.page-single__head{margin-bottom:1.75rem}
.post-single__foot{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.pagination{margin-top:2.5rem}
.pagination .nav-links{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}
.pagination a,.pagination .current{display:inline-flex;padding:.6rem .95rem;border-radius:8px;border:1px solid var(--line);font-weight:700;color:var(--brand)}
.pagination .current{background:var(--brand);color:#fff;border-color:var(--brand)}
.pagination a:hover{border-color:var(--brand)}
.empty{color:var(--muted)}

/* -------------------------------------------------------------------------
 * Footer
 * ---------------------------------------------------------------------- */
.site-footer{background:var(--brand);color:#c4d0d8;margin-top:0}
.footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:clamp(1.5rem,3vw,2.5rem);padding-top:clamp(3rem,5vw,4.5rem);padding-bottom:clamp(2rem,3vw,3rem);align-items:stretch}
.footer__col--about{display:flex;flex-direction:column;align-items:flex-start}
.footer__blurb{margin:auto 0 1.25rem;color:#a9b8c1;font-size:.95rem;max-width:38ch}
.footer__trust{display:flex;flex-direction:column;gap:.5rem}
.footer__trust li{display:flex;align-items:flex-start;gap:.5rem;font-size:.9rem;color:#c4d0d8}
.footer__trust .ecl-icon svg{width:16px;height:16px;color:var(--accent);margin-top:.15rem;flex:none}
.footer__h{font-family:var(--font-display);font-size:.82rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin:0 0 1.1rem}
.footer__menu,.footer__areas{display:flex;flex-direction:column;gap:.55rem}
.footer__menu a,.footer__areas a{color:#c4d0d8;font-size:.95rem}
.footer__menu a:hover,.footer__areas a:hover{color:var(--accent)}
.footer__contact{display:flex;flex-direction:column;gap:.55rem;margin-bottom:1.25rem}
.footer__link{display:inline-flex;align-items:center;gap:.5rem;color:#e7eef2;font-weight:600}
.footer__link .ecl-icon svg{width:18px;height:18px;color:var(--accent)}
.footer__link:hover{color:var(--accent)}
.footer__addr,.footer__hours{display:flex;align-items:flex-start;gap:.5rem;margin:0;color:#c4d0d8;font-size:.92rem}
.footer__addr .ecl-icon svg,.footer__hours .ecl-icon svg{width:18px;height:18px;color:var(--accent);flex:none}
.footer__cta{margin-top:.25rem}
.footer__bar{border-top:1px solid rgba(255,255,255,.12)}
.footer__bar-inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;padding-top:1.5rem;padding-bottom:1.5rem;font-size:.85rem;color:#93a4ae}
.footer__bar-inner p{margin:0}
.footer__credit a{color:#c4d0d8}
.footer__credit a:hover{color:var(--accent)}

/* -------------------------------------------------------------------------
 * Responsive
 * ---------------------------------------------------------------------- */
@media (max-width:1040px){
	.cards,.cards--services,.reviews,.reviews--all,.pillars{grid-template-columns:repeat(2,1fr)}
	.who-grid,.area-grid,.links-grid{grid-template-columns:repeat(2,1fr)}
	.footer__grid{grid-template-columns:1fr 1fr}
	.faq-block__inner{grid-template-columns:1fr}
}

@media (max-width:900px){
	.about-block__grid,.service-body__grid,.location-intro__grid,.contact-block__grid{grid-template-columns:1fr}
	.factcard,.featurecard,.contactcard{position:static}
	.ctaband__inner{flex-direction:column;align-items:flex-start;gap:1.25rem}
	.topbar__msg{display:none}
	.topbar__inner{justify-content:center}
}

/* -------------------------------------------------------------------------
 * Mobile navigation. Pure CSS: a hidden checkbox toggles the menu. Works with
 * zero JavaScript. The header drops backdrop-filter here so a position:fixed
 * menu is never trapped inside it (a fixed element is confined by any ancestor
 * that uses backdrop-filter, filter, transform, perspective or contain).
 * ---------------------------------------------------------------------- */
@media (max-width:860px){
	.site-header{backdrop-filter:none}

	.nav-burger{
		display:inline-flex;align-items:center;gap:.55rem;cursor:pointer;
		font-family:var(--font-display);font-weight:700;color:#fff;
		border:1.5px solid rgba(255,255,255,.34);border-radius:10px;padding:.55rem .85rem;background:rgba(255,255,255,.06);
	}
	.nav-burger__box{position:relative;width:20px;height:14px;display:inline-block}
	.nav-burger__line,.nav-burger__line::before,.nav-burger__line::after{position:absolute;left:0;width:20px;height:2px;background:#fff;border-radius:2px;content:"";transition:transform var(--speed),opacity var(--speed)}
	.nav-burger__line{top:6px}
	.nav-burger__line::before{top:-6px}
	.nav-burger__line::after{top:6px}

	.primary-nav{
		display:none;position:fixed;inset:0;z-index:300;
		background:var(--brand);color:#fff;
		flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;
		padding:5rem 1.5rem 2rem;overflow-y:auto;
	}
	.nav-toggle:checked ~ .primary-nav{display:flex}
	body:has(.nav-toggle:checked){overflow:hidden}

	.nav-close{display:inline-flex;position:absolute;top:1rem;right:1.25rem;width:44px;height:44px;align-items:center;justify-content:center;font-size:2rem;line-height:1;color:#fff;cursor:pointer;border-radius:10px}
	.nav-close:hover{background:rgba(255,255,255,.1)}

	.primary-nav .menu{flex-direction:column;align-items:stretch;gap:.15rem;width:100%}
	.primary-nav .menu a{color:#fff;font-size:1.1rem;padding:.85rem .5rem;border-radius:8px}
	.primary-nav .menu a:hover,.primary-nav .menu .current-menu-item>a,.primary-nav .menu .current-menu-parent>a{color:var(--accent);background:rgba(255,255,255,.06)}
	.primary-nav .menu .menu-item-has-children>a::after{margin-left:auto}

	.primary-nav .menu .sub-menu{
		position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
		background:rgba(255,255,255,.05);border:none;border-radius:8px;
		padding:.15rem .25rem .35rem 1rem;margin:.15rem 0 .35rem;
	}
	.primary-nav .menu .sub-menu a{color:#cfdae1;font-size:1rem;padding:.6rem .5rem}
	.nav-cta{margin:1.25rem 0 0;width:100%}
}

@media (max-width:560px){
	.cards,.cards--services,.reviews,.reviews--all,.pillars,.who-grid,.area-grid,.links-grid,.posts,.cform__grid,.footer__grid{grid-template-columns:1fr}
	.topbar__contact{gap:.85rem;font-size:.8rem}
	.topbar__link--mail{display:none}
	body{font-size:16px}
	.hero__title{max-width:100%}
	.header__inner{min-height:76px}
	.ecl-logo--header.ecl-logo--img img{max-height:60px}
}

/* -------------------------------------------------------------------------
 * Motion preference
 * ---------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
	*{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
}

/* -------------------------------------------------------------------------
 * Cookie consent banner
 * ---------------------------------------------------------------------- */
.ecl-cookie{position:fixed;left:0;right:0;bottom:0;z-index:900;background:var(--brand);color:#e7eef2;box-shadow:0 -8px 30px rgba(0,0,0,.22)}
.ecl-cookie[hidden]{display:none}
.ecl-cookie__inner{max-width:var(--wrap);margin:0 auto;padding:clamp(1.1rem,3vw,1.6rem) clamp(1.35rem,4vw,2rem);display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);flex-wrap:wrap}
.ecl-cookie__text{flex:1 1 340px}
.ecl-cookie__title{font-family:var(--font-display);font-weight:700;font-size:1.05rem;color:#fff;margin:0 0 .35rem}
.ecl-cookie__body{margin:0;font-size:.92rem;line-height:1.6;color:#c4d0d8}
.ecl-cookie__body a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.ecl-cookie__actions{display:flex;gap:.75rem;flex:0 0 auto}
.ecl-cookie__btn{font-family:var(--font-display);font-weight:700;font-size:.95rem;line-height:1;padding:.85rem 1.6rem;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:transform var(--speed),background var(--speed),color var(--speed),border-color var(--speed)}
.ecl-cookie__btn:hover{transform:translateY(-2px)}
.ecl-cookie__btn--accept{background:var(--accent);color:#20160a}
.ecl-cookie__btn--accept:hover{background:var(--accent-2)}
.ecl-cookie__btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.34)}
.ecl-cookie__btn--ghost:hover{background:#fff;color:var(--brand);border-color:#fff}
.ecl-cookie-open{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;text-decoration:none}
.ecl-cookie-open:hover{color:var(--accent);text-decoration:underline}
@media (max-width:640px){
	.ecl-cookie__actions{flex:1 1 100%}
	.ecl-cookie__btn{flex:1 1 auto;text-align:center}
}