/*!
Theme Name: SWP Locksmith Pro
Theme URI:
Author: ScintillawpThemes
Author URI: https://scintillawpthemes.com/
Description: SWP Locksmith Pro is a fast, conversion-focused WordPress theme for locksmiths, key-cutting shops, auto locksmiths and door-hardware installers. Built on the Customizer with the Kirki framework, it ships with reorderable homepage sections, a Services custom post type, a WooCommerce storefront for lock hardware, a scroll-triggered promo popup, Contact Form 7 booking forms and a one-click demo importer.
Version: 2.0.0
Requires at least: 5.5
Requires PHP: 7.2
Tested up to: 7.0.1
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: swp-locksmith-pro
Tags: blog, e-commerce, two-columns, custom-background, custom-colors, full-width-template, custom-menu, custom-logo, featured-images, theme-options, threaded-comments, translation-ready
*/

/* ============================================================
   SWP LOCKSMITH — GLOBAL TOKENS
   Every colour here is driven by a Customizer control and
   re-declared as an inline :root block by the theme.
   ============================================================ */
:root{
	/* Colour */
	--primary:        #101915;   /* pine — filled cards, footer, top bar */
	--primary-dark:   #0A100D;   /* deepest pine — overlays, top bar */
	--primary-tint:   #DCF0E6;   /* pale mint — newsletter band */
	--accent:         #35C98A;   /* mint — FILLS only (buttons, discs, stats bar) */
	--accent-dark:    #22A46E;   /* fill hover */
	--accent-light:   #35C98A;   /* accent TEXT on pine panels */
	--accent-text:    #0E7A52;   /* accent TEXT on white — mint itself is unreadable there */
	--accent-ink:     #06301F;   /* text and icons sitting ON a mint fill */
	--accent-tint:    #DCF3E8;   /* icon disc backgrounds */
	--heading:        #0D1512;
	--body:           #5E6B64;
	--muted:          #93A099;
	--surface:        #FFFFFF;
	--surface-alt:    #EFF5F1;
	--line:           #DCE6E0;
	--line-dark:      rgba(255,255,255,.16);

	/* Type */
	--font-head: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif;
	--font-body: "DM Sans", "Helvetica Neue", Arial, sans-serif;

	--fs-h1:   clamp(2.2rem, 1.3rem + 3vw, 3.5rem);
	--fs-h2:   clamp(1.75rem, 1.2rem + 1.9vw, 2.6rem);
	--fs-h3:   clamp(1.1rem, 1rem + .45vw, 1.35rem);
	--fs-lead: 1rem;
	--fs-body: .95rem;
	--fs-sm:   .875rem;
	--fs-xs:   .78rem;

	/* Layout */
	--wrap: 1200px;
	--gutter: 20px;
	--section: clamp(64px, 5vw, 100px);
	--r-sm: 8px;
	--r-md: 14px;
	--r-lg: 20px;
	--r-pill: 999px;
	--shadow: 0 4px 30px rgba(12,20,17,.07);
	--shadow-lg: 0 18px 60px -20px rgba(12,20,17,.28);
}

/* ============================================================
   RESET / BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-body);font-size:var(--fs-body);line-height:1.8;color:var(--body);background:var(--surface);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video,iframe{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);color:var(--heading);line-height:1.25;letter-spacing:-.02em;margin:0 0 .5em;font-weight:700}
h1{font-size:var(--fs-h1);font-weight:800;line-height:1.16}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}
h4{font-size:1.05rem}
h5{font-size:.98rem}
h6{font-size:.9rem}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:3px}
hr{border:0;border-top:1px solid var(--line);margin:32px 0}

.sr-only,.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--accent);color:var(--accent-ink);padding:12px 22px;border-radius:0 0 var(--r-sm) 0;font-family:var(--font-head);font-weight:700}
.skip-link:focus{left:0;width:auto;height:auto;clip:auto;clip-path:none}

/* ============================================================
   SHARED UTILITIES
   ============================================================ */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.section,.pad{padding-block:var(--section)}
.section--alt{background:var(--surface-alt)}
.center{text-align:center}
.eyebrow{display:block;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:var(--accent-text);margin:0 0 12px;letter-spacing:.01em}
.head-lead,.lede{max-width:640px;margin-inline:auto;font-size:var(--fs-body)}
.sec-title{max-width:22ch}
.center .sec-title{margin-inline:auto}
.hl,.accent,.light{color:var(--accent-text)}
.hero .hl,.hero .accent,.hero .light,
.promo .hl,.promo .accent,.promo .light,
.discount .hl,.discount .accent,.discount .light,
.smart .hl,.smart .accent,.smart .light,
.why__media .hl,.why__media .accent,.why__media .light,
.page-banner.has-image .hl,.page-banner.has-image .accent,.page-banner.has-image .light{color:var(--accent-light)}
.ul{box-shadow:inset 0 -.28em 0 var(--accent-tint)}

/* Accent copy sitting on a pine panel needs the lighter mint. */
.hero .eyebrow,.promo .eyebrow,.discount .eyebrow,.smart .eyebrow,.why__media .eyebrow,
.page-banner.has-image .eyebrow{color:var(--accent-light)}

.icon{width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.icon--fill{fill:currentColor;stroke:none}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);padding:14px 26px;border-radius:var(--r-pill);transition:background-color .2s,color .2s,border-color .2s;text-align:center;cursor:pointer;border:0;line-height:1.3}
.btn .icon{width:16px;height:16px}
.btn--accent{background:var(--accent);color:var(--accent-ink)}
.btn--accent:hover,.btn--accent:focus{background:var(--accent-dark);color:var(--accent-ink)}
.btn--primary{background:var(--primary);color:#fff}
.btn--primary:hover,.btn--primary:focus{background:var(--primary-dark);color:#fff}
.btn--line{border:1.6px solid var(--line);color:var(--heading);background:#fff}
.btn--line:hover{border-color:var(--primary);color:var(--primary)}
.btn--ghost{border:1.6px solid var(--line-dark);color:#fff;background:transparent}
.btn--ghost:hover{background:#fff;color:var(--heading);border-color:#fff}
.btn--block{width:100%;justify-content:center}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- Call pill (hero + discount banner) ---------- */
.callpill{display:inline-flex;align-items:center;gap:12px;background:var(--accent);color:var(--accent-ink);padding:8px 26px 8px 8px;border-radius:var(--r-pill);transition:background-color .2s}
.callpill:hover{background:var(--accent-dark)}
.callpill__disc{width:42px;height:42px;border-radius:50%;background:var(--heading);color:var(--accent-light);display:grid;place-items:center;flex:none}
.callpill__disc .icon{width:18px;height:18px}
.callpill__label{display:block;font-size:var(--fs-xs);line-height:1.3;opacity:.85}
.callpill__num{display:block;font-family:var(--font-head);font-weight:700;font-size:1rem;line-height:1.35}

/* ---------- Preloader ---------- */
.swp-loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;transition:opacity .5s}
.swp-loader.loaded{opacity:0;pointer-events:none}
.swp-loader-logo{max-width:150px}
.swp-loader-mark .logo__mark{width:56px;height:56px}
.anim-pulse .swp-loader-inner{animation:swpPulse 1.2s ease-in-out infinite}
.anim-bounce .swp-loader-inner{animation:swpBounce 1s ease-in-out infinite}
.anim-spin .swp-loader-inner{animation:swpSpin 1.4s linear infinite}
.anim-fade .swp-loader-inner{animation:swpFade 1.3s ease-in-out infinite}
@keyframes swpPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes swpBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes swpSpin{to{transform:rotate(360deg)}}
@keyframes swpFade{0%,100%{opacity:1}50%{opacity:.3}}

/* ============================================================
   1. TOP BAR
   ============================================================ */
.topbar{background:var(--primary-dark);color:rgba(255,255,255,.8);font-size:var(--fs-xs)}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:42px;flex-wrap:wrap}
.topbar__social{display:flex;gap:14px}
.topbar__social a{opacity:.8;transition:opacity .2s,color .2s}
.topbar__social a:hover{opacity:1;color:var(--accent-light)}
.topbar__social .icon{width:13px;height:13px}
.topbar__meta{display:flex;gap:24px;flex-wrap:wrap}
.topbar__meta a,.topbar__meta span{display:inline-flex;align-items:center;gap:7px;transition:color .2s}
.topbar__meta a:hover{color:var(--accent-light)}
.topbar__meta .icon{width:13px;height:13px;color:var(--accent-light)}

/* ============================================================
   2. HEADER
   ============================================================ */
.header{position:sticky;top:0;z-index:80;background:#fff;box-shadow:0 1px 0 var(--line)}
.header.scrolled{box-shadow:0 6px 24px -14px rgba(12,20,17,.32)}
.header__inner{display:flex;align-items:center;gap:24px;min-height:76px}
.logo{display:inline-flex;align-items:center;gap:9px}
.logo__mark{width:36px;height:36px;flex:none}
.logo__text{font-family:var(--font-head);font-weight:800;font-size:1.32rem;letter-spacing:-.035em;color:var(--heading);line-height:1}
.logo__text em,.logo__text b{font-style:normal;font-weight:800;color:var(--primary)}
.logo img{max-height:52px;width:auto}

.nav{margin-left:auto}
.nav ul{margin:0;padding:0;list-style:none}
.nav__list{display:flex;align-items:center;gap:30px}
.nav__list li{position:relative}
.nav__list a{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:var(--heading);transition:color .2s;padding:8px 0}
.nav__list a:hover{color:var(--accent-text)}
.nav__list .current-menu-item>a,
.nav__list .current_page_item>a,
.nav__list .current-menu-ancestor>a,
.nav__list a[aria-current="page"]{color:var(--accent-text)}

/* Desktop dropdowns */
.nav__list .sub-menu{position:absolute;top:100%;left:-18px;min-width:230px;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-lg);padding:10px;display:grid;gap:2px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s;z-index:5}
.nav__list li:hover>.sub-menu,.nav__list li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.nav__list .sub-menu a{display:block;padding:9px 14px;border-radius:var(--r-sm);width:100%;font-weight:600}
.nav__list .sub-menu a:hover{background:var(--surface-alt)}
.nav__list .sub-menu .sub-menu{top:-11px;left:100%}
.nav__list .menu-item-has-children>a::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);flex:none}

.header__actions{display:flex;align-items:center;gap:12px;flex:none}
.iconbtn{width:42px;height:42px;border-radius:50%;border:1.6px solid var(--line);display:grid;place-items:center;color:var(--heading);transition:border-color .2s,color .2s,background-color .2s;position:relative}
.iconbtn:hover{border-color:var(--primary);color:var(--primary)}
.iconbtn .icon{width:18px;height:18px}
.iconbtn__count{position:absolute;top:-4px;right:-4px;min-width:19px;height:19px;padding:0 5px;border-radius:var(--r-pill);background:var(--accent);color:var(--accent-ink);font-family:var(--font-head);font-weight:700;font-size:.65rem;display:grid;place-items:center;line-height:1}

.navtoggle{display:none;width:42px;height:42px;border-radius:var(--r-sm);border:1.6px solid var(--line);align-items:center;justify-content:center}
.navtoggle .icon{width:20px;height:20px}
/* Only rendered inside the off-canvas panel. */
.nav__cta{display:none;gap:10px;margin-top:18px}

/* Header search drop */
.searchpop{position:absolute;top:100%;right:var(--gutter);width:min(380px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-lg);padding:16px;display:none;z-index:90}
.searchpop.open{display:block}
.search-form{display:flex;gap:8px}
.search-form label{flex:1}
.search-form .search-field{width:100%;font:inherit;font-size:var(--fs-sm);padding:12px 18px;border-radius:var(--r-pill);border:1.6px solid var(--line);background:#fff;color:var(--heading)}
.search-form .search-field:focus{outline:none;border-color:var(--accent)}
.search-form .search-submit{background:var(--accent);color:var(--accent-ink);border-radius:var(--r-pill);padding:12px 22px;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm)}

/* ============================================================
   3. HERO
   ============================================================ */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(560px,82vh,760px);display:flex;align-items:center}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 40%;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(95deg,rgba(10,16,13,.95) 0%,rgba(10,16,13,.88) 34%,rgba(10,16,13,.4) 64%,rgba(10,16,13,.1) 100%)}
.hero__inner{position:relative;width:100%;padding-block:clamp(64px,8vw,110px)}
.hero__body{max-width:600px;color:rgba(255,255,255,.78)}
.hero__body h1{color:#fff;margin-bottom:.45em}
.hero__body p{max-width:44ch;font-size:var(--fs-lead)}
.hero__body .callpill,.hero__body .btn-row{margin-top:26px}

.hero__trust{position:absolute;right:var(--gutter);bottom:clamp(26px,4vw,54px);text-align:right}
.hero__trust>span{display:block;font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:#fff;margin-bottom:12px}
.hero__trustrow{display:flex;align-items:center;gap:16px;justify-content:flex-end}
.avatars{display:flex}
.avatars svg,.avatars span,.avatars img{width:38px;height:38px;border-radius:50%;border:2px solid #fff;margin-left:-11px;object-fit:cover}
.avatars svg:first-child,.avatars span:first-child,.avatars img:first-child{margin-left:0}
.avatars span{background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-family:var(--font-head);font-weight:700;font-size:.9rem}
.hero__count{border-left:1px solid rgba(255,255,255,.28);padding-left:16px;text-align:left}
.hero__count b{display:block;font-family:var(--font-head);font-weight:800;font-size:1.3rem;color:#fff;line-height:1.2}
.hero__count span{font-size:var(--fs-xs);color:rgba(255,255,255,.65)}

/* ============================================================
   4. ABOUT
   ============================================================ */
.about{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:clamp(36px,5vw,70px);align-items:center}
.about__media{position:relative;isolation:isolate}
.about__media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-md)}
.about__dots{position:absolute;left:-26px;bottom:-26px;width:130px;height:130px;z-index:-1;background-image:radial-gradient(var(--line) 2.2px,transparent 2.2px);background-size:15px 15px}
.about__badge{position:absolute;top:-26px;right:-18px;width:104px;height:104px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-content:center;text-align:center;border:6px solid #fff}
.about__badge b{display:block;font-family:var(--font-head);font-weight:800;font-size:1.7rem;line-height:1}
.about__badge span{display:block;font-size:.6rem;line-height:1.35;opacity:.85;margin-top:5px}
.about__points{display:grid;gap:16px;margin:24px 0 0}
.about__points li{display:flex;gap:14px;align-items:flex-start}
.about__points .disc{width:44px;height:44px;border-radius:50%;background:var(--accent-tint);color:var(--accent-text);display:grid;place-items:center;flex:none}
.about__points .disc .icon{width:20px;height:20px}
.about__points b{display:block;font-family:var(--font-head);color:var(--heading);font-size:1rem;line-height:1.4}
.about__points p{font-size:var(--fs-sm);margin:2px 0 0}

/* ============================================================
   5. FEATURE CARDS
   ============================================================ */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.feature{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:36px 30px;text-align:center;transition:box-shadow .25s,transform .25s}
.feature:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.feature--on{background:var(--primary);border-color:var(--primary);color:rgba(255,255,255,.76)}
.feature__disc{width:62px;height:62px;border-radius:50%;margin:0 auto 20px;display:grid;place-items:center;background:var(--accent-tint);color:var(--accent-text)}
.feature--on .feature__disc{background:var(--accent);color:var(--accent-ink)}
.feature__disc .icon{width:26px;height:26px}
.feature h3{color:var(--accent-text);margin-bottom:.55em}
.feature--on h3{color:#fff}
.feature p{font-size:var(--fs-sm);margin:0}

/* ============================================================
   6. PARTNER STRIP
   ============================================================ */
.partners{display:flex;align-items:center;gap:clamp(28px,5vw,64px);flex-wrap:wrap;padding-block:38px;border-top:1px solid var(--line)}
.partners__label{font-family:var(--font-head);font-weight:700;color:var(--heading);font-size:1rem;line-height:1.5;max-width:200px;margin:0}
.partners__row{display:flex;align-items:center;justify-content:space-between;gap:clamp(24px,4vw,50px);flex-wrap:wrap;flex:1}
.partners__row svg{height:24px;width:auto;color:var(--muted);transition:color .25s}
.partners__row img{max-height:34px;width:auto;opacity:.55;filter:grayscale(1);transition:opacity .25s,filter .25s}
.partners__row svg:hover{color:var(--primary)}
.partners__row img:hover{opacity:1;filter:none}

/* ============================================================
   7. DARK CTA + STATS BAR
   ============================================================ */
.promo{position:relative;isolation:isolate;padding-top:clamp(72px,7vw,110px);color:rgba(255,255,255,.78);text-align:center}
.promo__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.promo::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(12,20,17,.82),rgba(10,42,30,.88))}
.promo h2{color:#fff;max-width:20ch;margin-inline:auto}
.promo p{max-width:56ch;margin-inline:auto}
.promo .btn{margin-top:22px}
.statsbar{display:grid;grid-template-columns:repeat(4,1fr);background:var(--accent);border-radius:var(--r-md);margin-top:clamp(46px,5vw,70px);transform:translateY(50%);overflow:hidden}
.statsbar div{padding:28px 18px;text-align:center;border-right:1px solid rgba(6,48,31,.18)}
.statsbar div:last-child{border-right:0}
.statsbar b{display:block;font-family:var(--font-head);font-weight:800;font-size:clamp(2rem,1.35rem + 1.9vw,2.9rem);color:var(--accent-ink);line-height:1.1;letter-spacing:-.03em}
.statsbar span{display:block;margin-top:4px;font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:rgba(6,48,31,.78)}
.statsbar-gap{height:clamp(52px,5.5vw,80px)}

/* ============================================================
   8. SERVICES
   ============================================================ */
.svchead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(24px,4vw,64px);align-items:end;margin-bottom:44px}
.svchead h2{margin:0;max-width:18ch}
.svchead p{font-size:var(--fs-sm);margin:0;padding-bottom:4px}
.svchead .btn{margin-top:16px}

.svcgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}

/* Card: photo on top, copy on a solid surface below. Text never sits on the
   photograph, so legibility does not depend on how busy the image is. */
.svc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column;transition:border-color .25s,box-shadow .25s,transform .25s}
.svc:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-4px)}
.svc__media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--surface-alt)}
.svc__bg{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,.68,.36,1)}
.svc:hover .svc__bg{transform:scale(1.05)}
.svc__disc{position:absolute;right:22px;top:-25px;width:50px;height:50px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;box-shadow:0 0 0 4px var(--surface)}
.svc__disc .icon{width:22px;height:22px}
.svc__body{position:relative;padding:32px 26px 28px;display:flex;flex-direction:column;flex:1;text-align:left}
/* No photo: the disc sits inside the panel instead of straddling a seam. */
.svc--nomedia .svc__body{padding-top:28px}
.svc--nomedia .svc__disc{position:static;margin-bottom:18px}
.svc h3{color:var(--heading);font-size:1.08rem;margin-bottom:.5em}
.svc h3 a{transition:color .2s}
.svc h3 a:hover{color:var(--accent-text)}
.svc p{font-size:var(--fs-sm);color:var(--body);margin:0 0 20px;flex:1}
.svc__btn{display:inline-flex;align-items:center;gap:9px;align-self:flex-start;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:var(--accent-text);padding-top:18px;border-top:1px solid var(--line);width:100%;transition:color .2s}
.svc__btn:hover{color:var(--accent-ink)}
.svc__btn .icon{width:17px;height:17px;margin-left:auto;transition:transform .2s}
.svc:hover .svc__btn .icon{transform:translateX(3px)}

/* ============================================================
   9. SMART SYSTEMS BANNER
   ============================================================ */
.smart{position:relative;isolation:isolate;min-height:480px;display:flex;align-items:center;color:rgba(255,255,255,.78)}
.smart__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.smart::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(95deg,rgba(12,20,17,.94) 0%,rgba(12,20,17,.8) 40%,rgba(12,20,17,.25) 72%,rgba(12,20,17,.05) 100%)}
.smart__inner{position:relative;padding-block:70px}
.smart h2{color:#fff;max-width:16ch}
.smart p{max-width:42ch;font-size:var(--fs-sm)}
.smart .btn{margin-top:22px}
.smart__play{position:absolute;top:50%;left:64%;transform:translate(-50%,-50%);width:74px;height:74px;border-radius:50%;background:#fff;color:var(--accent-text);display:grid;place-items:center;box-shadow:0 0 0 12px rgba(255,255,255,.16);transition:transform .25s}
.smart__play:hover{transform:translate(-50%,-50%) scale(1.06)}
.smart__play .icon{width:24px;height:24px}

/* Video lightbox */
.swp-video{position:fixed;inset:0;z-index:9998;background:rgba(6,12,9,.9);display:none;place-items:center;padding:20px}
.swp-video.is-open{display:grid}
.swp-video__frame{width:min(960px,100%);aspect-ratio:16/9;border-radius:var(--r-md);overflow:hidden;background:#000}
.swp-video iframe{width:100%;height:100%;border:0}
.swp-video__close{position:absolute;top:22px;right:22px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center}

/* ============================================================
   10. PRICING
   ============================================================ */
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px;align-items:start;text-align:left}
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:34px 30px;position:relative}
.plan--on{background:var(--primary);border-color:var(--primary);color:rgba(255,255,255,.76);box-shadow:var(--shadow-lg)}
.plan h3{text-align:center;font-size:1.35rem;margin-bottom:.4em}
.plan--on h3{color:#fff}
.plan__ribbon{position:absolute;top:16px;right:16px;background:var(--accent);color:var(--accent-ink);font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);padding:5px 13px;border-radius:var(--r-pill)}
.plan__note{text-align:center;font-size:var(--fs-xs);line-height:1.6;margin:0 0 24px}
.plan__price{display:flex;align-items:baseline;gap:6px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.plan--on .plan__price{border-color:rgba(255,255,255,.22)}
.plan__price b{font-family:var(--font-head);font-weight:800;font-size:2.5rem;color:var(--accent-text);line-height:1}
.plan--on .plan__price b{color:#fff}
.plan__price span{font-size:var(--fs-sm)}
.plan__lbl{font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:var(--heading);margin:20px 0 14px}
.plan--on .plan__lbl{color:#fff}
.plan ul{display:grid;gap:11px;margin:0 0 26px;padding:0;list-style:none}
.plan li{display:flex;gap:10px;align-items:flex-start;font-size:var(--fs-sm);line-height:1.6}
.plan li .icon{width:17px;height:17px;margin-top:5px;color:var(--accent-text)}
.plan li.off{color:var(--muted)}
.plan--on li.off{color:rgba(255,255,255,.42)}
.plan--on li .icon{color:var(--accent-light)}
.plan li.off .icon{color:currentColor}
.plan .btn{width:100%;justify-content:center}

/* ============================================================
   11. DISCOUNT BANNER
   ============================================================ */
.discount{position:relative;isolation:isolate;padding-block:clamp(70px,7vw,104px);text-align:center;color:rgba(255,255,255,.8)}
.discount__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.discount::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,42,30,.92),rgba(12,20,17,.78))}
.discount h2{color:#fff;max-width:24ch;margin-inline:auto}
.discount p{max-width:56ch;margin-inline:auto;font-size:var(--fs-sm)}
.discount .callpill{margin-top:24px}

/* ============================================================
   12. WHY CHOOSE US
   ============================================================ */
.why{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px;align-items:stretch}
.why__media{position:relative;isolation:isolate;border-radius:var(--r-md);overflow:hidden;min-height:400px;display:flex;align-items:flex-end;padding:30px}
.why__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.why__media::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(12,20,17,.2),rgba(12,20,17,.92))}
.why__media .eyebrow{margin-bottom:8px}
.why__media h3{color:#fff;font-size:clamp(1.3rem,1.05rem + .9vw,1.75rem);margin-bottom:.5em;max-width:16ch}
.why__media p{color:rgba(255,255,255,.75);font-size:var(--fs-sm);max-width:38ch;margin-bottom:20px}
.why__tag{position:absolute;top:24px;right:24px;background:var(--accent);color:var(--accent-ink);border-radius:var(--r-sm);padding:11px 17px;display:flex;align-items:baseline;gap:8px}
.why__tag b{font-family:var(--font-head);font-weight:800;font-size:1.5rem;line-height:1}
.why__tag span{font-size:var(--fs-xs);line-height:1.25;max-width:7ch}
.why__cards{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.wcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:28px 26px;transition:box-shadow .25s}
.wcard:hover{box-shadow:var(--shadow)}
.wcard--on{background:var(--primary);border-color:var(--primary);color:rgba(255,255,255,.76)}
.wcard--on h3{color:#fff}
.wcard__disc{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--accent-tint);color:var(--accent-text);margin-bottom:18px}
.wcard--on .wcard__disc{background:var(--accent);color:var(--accent-ink)}
.wcard__disc .icon{width:23px;height:23px}
.wcard h3{font-size:1.02rem;margin-bottom:.45em}
.wcard p{font-size:var(--fs-sm);margin:0}

/* ============================================================
   13. TESTIMONIALS (carousel)
   ============================================================ */
.reviews{position:relative;background:var(--surface-alt);overflow:hidden}
.reviews::before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--line) 2px,transparent 2px);background-size:22px 22px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 45%,#000 35%,transparent 78%);mask-image:radial-gradient(ellipse 70% 60% at 50% 45%,#000 35%,transparent 78%);pointer-events:none}
.reviews>.wrap{position:relative}
.quotes{margin-top:44px;text-align:left}
.quote{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:30px 28px;display:flex;flex-direction:column;height:auto}
.stars{display:flex;gap:3px;color:var(--accent-text);margin-bottom:16px}
.stars .icon{width:16px;height:16px}
.quote p{font-size:var(--fs-sm);flex:1;margin-bottom:22px}
.quote__by{display:flex;align-items:center;gap:12px;padding-top:20px;border-top:1px solid var(--line)}
.quote__by svg,.quote__by img{width:44px;height:44px;border-radius:50%;flex:none;object-fit:cover}
.quote__by b{display:block;font-family:var(--font-head);font-size:.95rem;color:var(--heading);line-height:1.3}
.quote__by span{font-size:var(--fs-xs);color:var(--muted)}

/* Swiper chrome */
.swp-carousel{overflow:hidden;padding-bottom:6px}
.swp-carousel .swiper-slide{height:auto;display:flex}
.swp-carousel .swiper-slide>*{width:100%}
.carousel-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:34px}
.carousel-btn{width:46px;height:46px;border-radius:50%;border:1.6px solid var(--line);background:#fff;color:var(--heading);display:grid;place-items:center;transition:background-color .2s,color .2s,border-color .2s}
.carousel-btn:hover,.carousel-btn:focus{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.carousel-btn.swiper-button-disabled{opacity:.4;cursor:default}
.carousel-btn .icon{width:18px;height:18px}
.swp-dots{display:flex;align-items:center;gap:8px;justify-content:center}
.swp-dots .swiper-pagination-bullet{width:9px;height:9px;border-radius:var(--r-pill);background:var(--muted);opacity:.45;transition:width .25s,opacity .25s,background-color .25s;margin:0!important}
.swp-dots .swiper-pagination-bullet-active{width:26px;opacity:1;background:var(--accent-dark)}

/* ============================================================
   14. NEWSLETTER
   ============================================================ */
.news{padding-block:var(--section)}
/* When the newsletter follows a tinted band the two backgrounds meet, so the
   band needs its own breathing room above as well as below. */
.section--alt + .news,.reviews + .news{padding-top:clamp(48px,4vw,72px)}
.news__inner{background:var(--primary-tint);border-radius:var(--r-md);padding:clamp(30px,3.5vw,44px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
.news h3{margin-bottom:.35em}
.news p{font-size:var(--fs-sm);margin:0}
.news form,.news .wpcf7-form{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
/* Contact Form 7 wraps its fields in <p> via wpautop — flatten that row so the
   field and the button sit side by side inside the newsletter pill. */
.news .wpcf7-form>p{display:flex;gap:10px;flex-wrap:wrap;align-items:center;width:100%;margin:0}
.news .wpcf7-form br{display:none}
.news input[type=email],.news input[type=text]{flex:1;min-width:210px;font:inherit;font-size:var(--fs-sm);padding:14px 20px;border-radius:var(--r-pill);border:1.6px solid transparent;background:#fff;color:var(--heading)}
.news input::placeholder{color:var(--muted)}
.news input:focus{outline:none;border-color:var(--primary)}
.news button[type=submit],.news input[type=submit],.news .wpcf7-submit{background:var(--accent);color:var(--accent-ink);border-radius:var(--r-pill);padding:14px 26px;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);border:0;cursor:pointer;transition:background-color .2s}
.news button[type=submit]:hover,.news .wpcf7-submit:hover{background:var(--accent-dark)}
.news .wpcf7-form-control-wrap{flex:1;min-width:210px}
.news .wpcf7-form-control-wrap input{width:100%}

/* ============================================================
   15. BLOG SECTION + POST CARDS
   ============================================================ */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:44px}
.post-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column;transition:border-color .25s,box-shadow .25s,transform .25s}
.post-card:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-4px)}
.post-card__media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--surface-alt)}
.post-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,.68,.36,1)}
.post-card:hover .post-card__media img{transform:scale(1.05)}
.post-card__tag{position:absolute;left:16px;top:16px;background:var(--accent);color:var(--accent-ink);font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);padding:5px 13px;border-radius:var(--r-pill);z-index:2}
/* Posts with no featured image keep the tag, inline above the meta row. */
.post-card__tag.is-inline{position:static;display:inline-block;align-self:flex-start;margin-bottom:14px}
.post-card__body{padding:26px 24px 24px;display:flex;flex-direction:column;flex:1}
.post-card__meta{display:flex;flex-wrap:wrap;gap:14px;font-size:var(--fs-xs);color:var(--muted);margin-bottom:12px}
.post-card__meta span{display:inline-flex;align-items:center;gap:6px}
.post-card__meta .icon{width:13px;height:13px;color:var(--accent-text)}
.post-card h3{font-size:1.08rem;margin-bottom:.5em}
.post-card h3 a{transition:color .2s}
.post-card h3 a:hover{color:var(--accent-text)}
.post-card p{font-size:var(--fs-sm);margin:0 0 20px;flex:1}
.post-card__more{display:inline-flex;align-items:center;gap:9px;align-self:flex-start;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:var(--accent-text);padding-top:18px;border-top:1px solid var(--line);width:100%;transition:color .2s}
.post-card__more .icon{width:17px;height:17px;margin-left:auto;transition:transform .2s}
.post-card:hover .post-card__more .icon{transform:translateX(3px)}

/* ============================================================
   16. PROJECTS / GALLERY
   ============================================================ */
.projects__filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:32px 0 40px}
.filter-pill{font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);padding:10px 22px;border-radius:var(--r-pill);border:1.6px solid var(--line);background:#fff;color:var(--heading);transition:background-color .2s,border-color .2s,color .2s}
.filter-pill:hover{border-color:var(--accent)}
.filter-pill.active{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.projects__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.project{position:relative;border-radius:var(--r-md);overflow:hidden;isolation:isolate;aspect-ratio:4/3;display:flex;align-items:flex-end;padding:24px}
.project.is-hidden{display:none}
.project img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .6s cubic-bezier(.22,.68,.36,1)}
.project:hover img{transform:scale(1.06)}
.project::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(12,20,17,0) 35%,rgba(12,20,17,.9))}
.project h3{color:#fff;font-size:1.05rem;margin:0}
.project span{display:block;font-size:var(--fs-xs);color:var(--accent-light);font-family:var(--font-head);font-weight:700;margin-bottom:4px}
.project__zoom{position:absolute;top:18px;right:18px;width:42px;height:42px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;opacity:0;transform:scale(.8);transition:opacity .25s,transform .25s}
.project:hover .project__zoom{opacity:1;transform:none}

/* Lightbox */
.swp-lb{position:fixed;inset:0;z-index:9997;display:none}
.swp-lb.is-open{display:block}
.swp-lb-backdrop{position:absolute;inset:0;background:rgba(6,12,9,.92)}
.swp-lb-stage{position:relative;height:100%;display:grid;place-items:center;padding:70px 20px}
.swp-lb-img{max-width:min(1100px,92vw);max-height:78vh;border-radius:var(--r-md);opacity:0;transition:opacity .3s}
.swp-lb-img.is-ready{opacity:1}
.swp-lb-caption{color:#fff;font-size:var(--fs-sm);margin-top:16px;text-align:center}
.swp-lb-counter{color:rgba(255,255,255,.6);font-size:var(--fs-xs);margin-top:6px}
.swp-lb-btn{position:absolute;z-index:2;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;transition:background-color .2s}
.swp-lb-btn:hover{background:var(--accent);color:var(--accent-ink)}
.swp-lb-close{top:22px;right:22px}
.swp-lb-prev{top:50%;left:22px;transform:translateY(-50%)}
.swp-lb-next{top:50%;right:22px;transform:translateY(-50%)}

/* ============================================================
   17. CONTACT SECTION + FORMS
   ============================================================ */
.contact__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:clamp(30px,4vw,56px);align-items:start}
.contact__info{display:grid;gap:16px;margin:26px 0 0;padding:0;list-style:none}
.contact__info li{display:flex;gap:14px;align-items:flex-start}
.contact__info .disc{width:46px;height:46px;border-radius:50%;background:var(--accent-tint);color:var(--accent-text);display:grid;place-items:center;flex:none}
.contact__info .disc .icon{width:20px;height:20px}
.contact__info b{display:block;font-family:var(--font-head);color:var(--heading);font-size:var(--fs-sm)}
.contact__info span,.contact__info a{font-size:var(--fs-sm);color:var(--body)}
.contact__info a:hover{color:var(--accent-text)}
.contact__map{margin-top:28px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line)}
.contact__map iframe{width:100%;height:260px;border:0;display:block}
.contact__form{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:clamp(26px,3vw,40px);box-shadow:var(--shadow)}
.section--alt .contact__form{background:#fff}

/* Form controls — styled once, used by CF7, comments, Woo and core blocks. */
.swp-form .row,.wpcf7-form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.swp-form .field,.wpcf7-form .field{margin-bottom:16px}
.swp-form label,.wpcf7-form label{display:block;font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:var(--heading);margin-bottom:7px}
input[type=text],input[type=email],input[type=url],input[type=tel],input[type=number],input[type=password],input[type=search],input[type=date],input[type=time],select,textarea{width:100%;font:inherit;font-size:var(--fs-sm);color:var(--heading);background:#fff;border:1.6px solid var(--line);border-radius:var(--r-sm);padding:13px 16px;transition:border-color .2s}
textarea{min-height:130px;resize:vertical}
select{appearance:none;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235E6B64' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6.5 9.5 5.5 5.5 5.5-5.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px;padding-right:42px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}
input::placeholder,textarea::placeholder{color:var(--muted)}
input[type=submit],button[type=submit],.wpcf7-submit{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--accent);color:var(--accent-ink);font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);padding:14px 30px;border-radius:var(--r-pill);border:0;cursor:pointer;transition:background-color .2s;width:auto}
input[type=submit]:hover,button[type=submit]:hover,.wpcf7-submit:hover{background:var(--accent-dark)}

/* Contact Form 7 messaging */
.wpcf7 form .wpcf7-response-output{border-radius:var(--r-sm);border-width:1.6px;font-size:var(--fs-sm);margin:18px 0 0;padding:12px 16px}
.wpcf7 form.sent .wpcf7-response-output{border-color:var(--accent-dark);background:var(--accent-tint);color:var(--accent-ink)}
.wpcf7-not-valid-tip{color:#B42318;font-size:var(--fs-xs);margin-top:6px}
.wpcf7-spinner{margin:0 0 0 10px}
.wpcf7 .wpcf7-form-control-wrap{display:block}

/* ============================================================
   18. FOOTER
   ============================================================ */
.footer{background:var(--primary);color:rgba(255,255,255,.7);font-size:var(--fs-sm)}
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.15fr;gap:clamp(26px,4vw,48px);padding-block:clamp(54px,5vw,74px)}
.footer .logo__text{color:#fff}
.footer .logo__text em,.footer .logo__text b{color:var(--accent-light)}
.footer__about p{margin:20px 0;max-width:32ch;font-size:var(--fs-sm)}
.footer h4{color:#fff;font-family:var(--font-head);font-size:1.02rem;margin:0 0 18px}
.footer ul{margin:0;padding:0;list-style:none}
.footer__links{display:grid;gap:10px}
.footer__links a{transition:color .2s;display:inline-block}
.footer__links a:hover{color:var(--accent-light)}
.footer__contact{display:grid;gap:14px}
.footer__contact li{display:flex;gap:10px;line-height:1.6}
.footer__contact .icon{width:16px;height:16px;color:var(--accent-light);margin-top:5px}
.footer__contact a:hover{color:var(--accent-light)}
.footer__social{display:flex;gap:8px;flex-wrap:wrap}
.footer__social a{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;transition:background-color .2s,color .2s}
.footer__social a:hover{background:var(--accent);color:var(--accent-ink)}
.footer__social .icon{width:14px;height:14px}
.footer__bar{border-top:1px solid var(--line-dark);padding-block:20px;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:var(--fs-xs)}
.footer__bar p{margin:0}
.footer__bar nav ul,.footer__legal{display:flex;gap:20px;flex-wrap:wrap;margin:0;padding:0;list-style:none}
.footer__bar a:hover{color:var(--accent-light)}
.footer .widget{margin-bottom:26px}
.footer .widget-title,.footer .widget .wp-block-heading,
.footer .widget h1,.footer .widget h2,.footer .widget h3,.footer .widget h4{
	color:#fff;font-family:var(--font-head);font-size:1.02rem;line-height:1.35;margin:0 0 18px}
.footer .widget a:hover{color:var(--accent-light)}

/* Back to top */
.totop{position:fixed;right:22px;bottom:22px;z-index:70;width:46px;height:46px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s,transform .25s,visibility .25s,background-color .2s}
.totop.show{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--accent-dark)}
.totop .icon{width:19px;height:19px}

/* ============================================================
   19. INNER PAGE BANNER
   ============================================================ */
.page-banner{position:relative;isolation:isolate;background:var(--surface-alt);padding-block:clamp(56px,6vw,88px);text-align:center}
.page-banner::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(var(--line) 2px,transparent 2px);background-size:22px 22px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 30%,transparent 76%);mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 30%,transparent 76%)}
.page-banner h1{margin:0 0 10px;max-width:20ch;margin-inline:auto}
.page-banner .lede{font-size:var(--fs-body);max-width:56ch}
.page-banner.has-image{background-size:cover;background-position:center}
.page-banner.has-image::before{display:none}
.page-banner.has-image h1{color:#fff}
.page-banner.has-image .lede{color:rgba(255,255,255,.8)}
.crumbs{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;font-family:var(--font-head);font-weight:600;font-size:var(--fs-xs);color:var(--muted);margin-bottom:14px}
.crumbs a{color:var(--accent-text);transition:color .2s}
.crumbs a:hover{color:var(--accent-ink)}
.page-banner.has-image .crumbs{color:rgba(255,255,255,.7)}
.page-banner.has-image .crumbs a{color:var(--accent-light)}

/* ============================================================
   20. EDITOR CONTENT / TYPOGRAPHY
   ============================================================ */
.entry-content{font-size:var(--fs-body)}
.entry-content>*+*{margin-top:1.1em}
/* The section already supplies the top padding — a leading heading must not
   add its own margin on top of it. */
.entry-content>:first-child{margin-top:0}
.woocommerce-notices-wrapper:empty{display:none}
.entry-content h2{font-size:clamp(1.45rem,1.15rem + 1vw,1.9rem);margin-top:1.6em}
.entry-content h3{font-size:var(--fs-h3);margin-top:1.5em}
.entry-content h4{margin-top:1.4em}
.entry-content a{color:var(--accent-text);text-decoration:underline;text-underline-offset:3px}
.entry-content a:hover{color:var(--accent-ink)}
.entry-content ul,.entry-content ol{padding-left:1.3em;margin-block:1.1em}
.entry-content ul{list-style:disc}
.entry-content ol{list-style:decimal}
.entry-content li{margin-bottom:.5em}
.entry-content li::marker{color:var(--accent-text)}
.entry-content img,.entry-content .wp-block-image img{border-radius:var(--r-md)}
.entry-content blockquote,.wp-block-quote{border-left:3px solid var(--accent);background:var(--surface-alt);padding:22px 26px;border-radius:0 var(--r-md) var(--r-md) 0;margin-block:1.6em;font-size:var(--fs-body)}
.entry-content blockquote p:last-child{margin-bottom:0}
.entry-content blockquote cite{display:block;margin-top:10px;font-style:normal;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:var(--heading)}
.entry-content code,.entry-content kbd{background:var(--surface-alt);padding:2px 7px;border-radius:5px;font-size:.85em}
.entry-content pre{background:var(--primary);color:rgba(255,255,255,.86);padding:22px;border-radius:var(--r-md);overflow-x:auto;font-size:var(--fs-sm)}
.entry-content pre code{background:none;padding:0;color:inherit}
.entry-content table,.wp-block-table table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:11px 14px;text-align:left}
.entry-content th{background:var(--surface-alt);font-family:var(--font-head);color:var(--heading)}
.entry-content figcaption,.wp-element-caption{font-size:var(--fs-xs);color:var(--muted);text-align:center;margin-top:9px}
.wp-block-button__link{background:var(--accent);color:var(--accent-ink);border-radius:var(--r-pill);font-family:var(--font-head);font-weight:700;padding:14px 28px;font-size:var(--fs-sm)}
.is-style-swp-locksmith-pro-outline-button .wp-block-button__link{background:transparent;border:1.6px solid var(--line);color:var(--heading)}
.is-style-swp-locksmith-pro-shadow-image img{box-shadow:var(--shadow-lg)}
.alignwide{max-width:min(1100px,100%)}
.alignfull{max-width:none}
.alignleft{float:left;margin:0 26px 20px 0}
.alignright{float:right;margin:0 0 20px 26px}
.aligncenter{margin-inline:auto;display:block}
.sticky .post-card{border-color:var(--accent)}

/* Content + sidebar layout */
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(30px,4vw,54px);align-items:start}
.entry-media{border-radius:var(--r-md);overflow:hidden;margin-bottom:30px}
.entry-media img{width:100%}
.entry-meta{display:flex;flex-wrap:wrap;gap:16px;font-size:var(--fs-xs);color:var(--muted);margin-bottom:20px}
.entry-meta span{display:inline-flex;align-items:center;gap:6px}
.entry-meta .icon{width:14px;height:14px;color:var(--accent-text)}
.entry-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}
.entry-tags a{font-size:var(--fs-xs);font-family:var(--font-head);font-weight:600;padding:6px 14px;border-radius:var(--r-pill);background:var(--surface-alt);color:var(--heading);transition:background-color .2s,color .2s}
.entry-tags a:hover{background:var(--accent);color:var(--accent-ink)}

.post-navigation{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px;padding-top:28px;border-top:1px solid var(--line)}
.post-navigation .nav-links{display:contents}
.post-navigation a{display:block}
.post-navigation .nav-subtitle{display:block;font-size:var(--fs-xs);color:var(--accent-text);font-family:var(--font-head);font-weight:700;margin-bottom:5px}
.post-navigation .nav-title{font-family:var(--font-head);font-weight:700;color:var(--heading);font-size:var(--fs-sm);line-height:1.4}
.post-navigation .nav-next{text-align:right}

/* Widgets / sidebar */
.widget-area{display:grid;gap:24px;position:sticky;top:100px}
.widget{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:26px 24px}
/* Since WP 5.8 the default widgets are blocks, so their heading is a plain
   core/heading and never receives the `widget-title` class from
   register_sidebar(). Without this it inherits the global h2 size. */
.widget-title,
.widget-area .wp-block-heading,
.widget h1,.widget h2,.widget h3,.widget h4,
.widget-area > .wp-block-group > .wp-block-heading{
	font-family:var(--font-head);font-size:1.02rem;line-height:1.35;
	margin:0 0 16px;color:var(--heading);letter-spacing:-.01em}
.widget ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.widget ul li{font-size:var(--fs-sm);line-height:1.6}
.widget ul a{transition:color .2s}
.widget ul a:hover{color:var(--accent-text)}
.widget ul ul{margin-top:10px;padding-left:14px}
.widget select{margin-top:4px}
.wp-block-tag-cloud a,.tagcloud a{display:inline-block;font-size:var(--fs-xs)!important;font-family:var(--font-head);font-weight:600;padding:6px 14px;border-radius:var(--r-pill);background:var(--surface-alt);margin:0 6px 8px 0;transition:background-color .2s,color .2s}
.wp-block-tag-cloud a:hover,.tagcloud a:hover{background:var(--accent);color:var(--accent-ink)}

/* Pagination */
.pagination,.woocommerce-pagination{margin-top:48px;display:flex;justify-content:center}
.pagination .nav-links,.pagination>ul,.woocommerce-pagination ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;border:0}
.woocommerce-pagination li{border:0!important;margin:0!important}
.page-numbers{display:grid;place-items:center;min-width:44px;height:44px;padding:0 12px;border-radius:var(--r-sm);border:1.6px solid var(--line);font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:var(--heading);background:#fff;transition:background-color .2s,border-color .2s,color .2s}
.page-numbers:hover,.page-numbers.current{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.page-numbers.dots{border-color:transparent;background:none}
.page-numbers .icon{width:16px;height:16px}

/* Comments */
.comments-area{margin-top:48px;padding-top:40px;border-top:1px solid var(--line)}
.comments-title,.comment-reply-title{font-size:1.3rem;margin-bottom:24px}
.comment-list{list-style:none;margin:0 0 36px;padding:0;display:grid;gap:20px}
.comment-list ol.children{list-style:none;margin:20px 0 0;padding-left:clamp(16px,3vw,40px);display:grid;gap:20px}
.comment-body{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:24px}
.comment-meta{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.comment-author img{border-radius:50%;width:44px;height:44px}
.comment-author .fn{font-family:var(--font-head);font-weight:700;color:var(--heading);font-style:normal;font-size:var(--fs-sm)}
.comment-metadata{font-size:var(--fs-xs);color:var(--muted)}
.comment-content{font-size:var(--fs-sm)}
.reply a,.comment-reply-link{font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);color:var(--accent-text)}
.comment-form{display:grid;gap:16px}
.comment-form p{margin:0}
.comment-form .comment-form-cookies-consent{display:flex;align-items:center;gap:9px}
.comment-form .comment-form-cookies-consent input{width:auto}
.comment-form label{font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:var(--heading);display:block;margin-bottom:7px}
.no-comments{font-size:var(--fs-sm);color:var(--muted)}

/* No results / 404 */
.no-results{text-align:center;padding-block:40px}
.error-404{text-align:center;padding-block:clamp(70px,8vw,120px)}
.error-404 .code{font-family:var(--font-head);font-weight:800;font-size:clamp(5rem,14vw,10rem);line-height:1;color:var(--accent-tint);letter-spacing:-.05em}
.error-404 h1{margin-top:-.2em}
.error-404 p{max-width:48ch;margin-inline:auto}
.error-404 .btn{margin-top:26px}

/* ============================================================
   21. SINGLE SERVICE
   ============================================================ */
.service-single{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(30px,4vw,54px);align-items:start}
.service-single__media{border-radius:var(--r-md);overflow:hidden;margin-bottom:30px;position:relative}
.service-single__media img{width:100%;aspect-ratio:16/9;object-fit:cover}
.service-single__disc{position:absolute;left:24px;bottom:24px;width:62px;height:62px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;box-shadow:0 0 0 5px rgba(255,255,255,.9)}
.service-single__disc .icon{width:27px;height:27px}
.service-aside{display:grid;gap:22px;position:sticky;top:100px}
.service-book{background:var(--primary);color:rgba(255,255,255,.76);border-radius:var(--r-md);padding:clamp(24px,3vw,32px)}
.service-book h3{color:#fff;font-size:1.15rem;margin-bottom:.4em}
.service-book p{font-size:var(--fs-sm);margin-bottom:20px}
.service-book label{color:rgba(255,255,255,.8);font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);margin-bottom:6px;display:block}
/* Fields on the pine panel invert; the submit button keeps the accent fill —
   :not() here so the generic submit rule is not overridden by source order. */
.service-book input:not([type=submit]),.service-book select,.service-book textarea{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18);color:#fff}
.service-book input::placeholder,.service-book textarea::placeholder{color:rgba(255,255,255,.45)}
.service-book input:focus,.service-book select:focus,.service-book textarea:focus{border-color:var(--accent)}
.service-book textarea{min-height:100px}
.service-book .wpcf7-submit,.service-book input[type=submit],.service-book button[type=submit]{width:100%;background:var(--accent);color:var(--accent-ink);border:0}
.service-book .wpcf7-submit:hover,.service-book input[type=submit]:hover,.service-book button[type=submit]:hover{background:var(--accent-dark)}
/* CF7 wraps each control in a <p>; collapse that to the form's own rhythm. */
.service-book .wpcf7-form p{margin:0 0 16px}
.service-book .wpcf7-form p:last-child{margin-bottom:0}
.service-book .wpcf7-not-valid-tip{color:#FFB4AB}
.service-book .row{grid-template-columns:1fr}
.service-book select{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6.5 9.5 5.5 5.5 5.5-5.5'/%3E%3C/svg%3E")}
.service-book select option{color:var(--heading)}
/* The browser draws the date/time picker glyph in near-black, which is
   invisible on the pine panel. Invert it to the panel's text colour. */
.service-book input[type=date]::-webkit-calendar-picker-indicator,
.service-book input[type=time]::-webkit-calendar-picker-indicator,
.service-book input[type=datetime-local]::-webkit-calendar-picker-indicator{
	filter:invert(1) opacity(.75);cursor:pointer}
.service-book input[type=date]::-webkit-calendar-picker-indicator:hover{filter:invert(1) opacity(1)}
.service-book input[type=date]{color-scheme:dark}
.service-list{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:26px 24px}
.service-list h3{font-size:1.05rem;margin-bottom:16px}
.service-list ul{margin:0;padding:0;list-style:none;display:grid;gap:4px}
.service-list a{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:var(--r-sm);font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:var(--heading);background:var(--surface-alt);transition:background-color .2s,color .2s}
.service-list a:hover,.service-list .is-current a{background:var(--accent);color:var(--accent-ink)}
.service-list .icon{width:16px;height:16px;margin-left:auto}
.service-help{background:var(--accent-tint);border-radius:var(--r-md);padding:26px 24px;text-align:center}
.service-help .disc{width:56px;height:56px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;margin:0 auto 16px}
.service-help .disc .icon{width:24px;height:24px}
.service-help h3{font-size:1.05rem;margin-bottom:.3em}
.service-help p{font-size:var(--fs-sm);margin-bottom:16px}

/* ============================================================
   22. WOOCOMMERCE
   ============================================================ */
.woocommerce .woocommerce-message,.woocommerce .woocommerce-info,.woocommerce .woocommerce-error{
	border-top:0;border-left:3px solid var(--accent);background:var(--surface-alt);border-radius:0 var(--r-sm) var(--r-sm) 0;
	font-size:var(--fs-sm);padding:16px 20px;list-style:none;margin:0 0 26px;display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.woocommerce .woocommerce-error{border-left-color:#B42318;background:#FEF3F2}
.woocommerce .woocommerce-message::before,.woocommerce .woocommerce-info::before,.woocommerce .woocommerce-error::before{display:none}

/* WooCommerce clearfixes several containers with ::before/::after. Those
   pseudo-elements become real children once the container is a grid or flex
   box, and they silently eat the first cell — which is why the order overview
   used to start one column in. */
.woocommerce ul.products::before,.woocommerce ul.products::after,
.woocommerce ul.order_details::before,.woocommerce ul.order_details::after,
.woocommerce .cart-collaterals::before,.woocommerce .cart-collaterals::after,
.woocommerce-page .cart-collaterals::before,.woocommerce-page .cart-collaterals::after,
.woocommerce .col2-set::before,.woocommerce .col2-set::after,
.woocommerce-page .col2-set::before,.woocommerce-page .col2-set::after,
.woocommerce form.checkout::before,.woocommerce form.checkout::after,
.woocommerce div.product::before,.woocommerce div.product::after,
.woocommerce .woocommerce-MyAccount-navigation ul::before,
.woocommerce .woocommerce-MyAccount-navigation ul::after,
.woocommerce-account .woocommerce::before,.woocommerce-account .woocommerce::after{content:none!important;display:none!important}
.woocommerce .woocommerce-message .button,.woocommerce .woocommerce-info .button{margin-left:auto}

/* Buttons — one look across the whole store */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,
.wc-block-components-button{
	display:inline-flex;align-items:center;justify-content:center;gap:9px;
	background:var(--accent);color:var(--accent-ink);
	font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);line-height:1.3;
	padding:14px 26px;border-radius:var(--r-pill);border:0;text-transform:none;
	transition:background-color .2s,color .2s}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,.wc-block-components-button:hover{background:var(--accent-dark);color:var(--accent-ink)}
.woocommerce a.button.wc-backward,.woocommerce .button.wc-forward{background:var(--primary);color:#fff}
.woocommerce a.button.wc-backward:hover,.woocommerce .button.wc-forward:hover{background:var(--primary-dark);color:#fff}
.woocommerce a.added_to_cart{display:inline-block;margin-top:10px;font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);color:var(--accent-text)}

/* Shop toolbar */
.shop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:30px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.woocommerce .woocommerce-result-count{margin:0;font-size:var(--fs-sm);color:var(--muted)}
.woocommerce .woocommerce-ordering{margin:0}
.woocommerce .woocommerce-ordering select{min-width:220px}

/* Product grid + card */
.woocommerce ul.products,.woocommerce-page ul.products{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin:0;padding:0;list-style:none}
/* WooCommerce stamps columns-N on the list — honour it so a shop set to three
   across does not leave a dead fourth column. */
.woocommerce ul.products.columns-1{grid-template-columns:1fr}
.woocommerce ul.products.columns-2{grid-template-columns:repeat(2,1fr)}
.woocommerce ul.products.columns-3{grid-template-columns:repeat(3,1fr)}
.woocommerce ul.products.columns-5{grid-template-columns:repeat(5,1fr)}
.woocommerce ul.products.columns-6{grid-template-columns:repeat(6,1fr)}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none}
.woocommerce ul.products li.product,.woocommerce-page ul.products li.product{
	width:auto!important;margin:0!important;float:none!important;clear:none!important;
	background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
	display:flex;flex-direction:column;text-align:left;
	transition:border-color .25s,box-shadow .25s,transform .25s}
.woocommerce ul.products li.product:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-4px)}
.woocommerce ul.products li.product a img,.woocommerce ul.products li.product img{
	width:100%;aspect-ratio:1/1;object-fit:cover;margin:0;border-radius:0;
	transition:transform .6s cubic-bezier(.22,.68,.36,1)}
.woocommerce ul.products li.product:hover img{transform:scale(1.05)}
.woocommerce ul.products li.product>a.woocommerce-LoopProduct-link{display:block;overflow:hidden;background:var(--surface-alt)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
	font-family:var(--font-head);font-weight:700;font-size:1.02rem;color:var(--heading);
	padding:0;margin:0 0 8px;line-height:1.4;transition:color .2s}
.woocommerce ul.products li.product:hover .woocommerce-loop-product__title{color:var(--accent-text)}
.woocommerce ul.products li.product .price{
	color:var(--accent-text);font-family:var(--font-head);font-weight:800;font-size:1.15rem;
	margin:0 0 16px;display:block}
.woocommerce ul.products li.product .price del{color:var(--muted);font-weight:600;font-size:.85em;margin-right:8px}
.woocommerce ul.products li.product .price ins{text-decoration:none}
.woocommerce ul.products li.product .star-rating{font-size:.8em;color:var(--accent-dark);margin:0 0 10px;float:none}
.woocommerce ul.products li.product .button{margin-top:auto;align-self:flex-start}
.swp-product-body{padding:24px 22px 22px;display:flex;flex-direction:column;flex:1}
.swp-product-cat{font-size:var(--fs-xs);font-family:var(--font-head);font-weight:700;color:var(--muted);margin-bottom:8px;display:block}
.woocommerce span.onsale,.woocommerce ul.products li.product .onsale{
	position:absolute;top:14px;left:14px;right:auto;margin:0;z-index:3;
	background:var(--accent);color:var(--accent-ink);
	font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);
	min-width:auto;min-height:auto;line-height:1;padding:7px 14px;border-radius:var(--r-pill)}
.woocommerce ul.products li.product{position:relative}
.swp-product-actions{position:absolute;top:14px;right:14px;z-index:3;display:grid;gap:8px;opacity:0;transform:translateX(10px);transition:opacity .25s,transform .25s}
.woocommerce ul.products li.product:hover .swp-product-actions{opacity:1;transform:none}
.swp-product-actions a,.swp-product-actions button{width:40px;height:40px;border-radius:50%;background:#fff;color:var(--heading);display:grid;place-items:center;box-shadow:var(--shadow);transition:background-color .2s,color .2s;padding:0;font-size:0}
.swp-product-actions a:hover,.swp-product-actions button:hover{background:var(--accent);color:var(--accent-ink)}
.swp-product-actions .icon{width:17px;height:17px}

/* Single product */
.woocommerce div.product{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,4vw,56px);align-items:start}
.woocommerce div.product div.images,.woocommerce div.product div.summary{width:auto!important;float:none!important;margin:0!important}
.woocommerce div.product div.images img{border-radius:var(--r-md)}
.woocommerce div.product div.images .flex-control-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px;padding:0;list-style:none}
.woocommerce div.product div.images .flex-control-thumbs li{width:auto;float:none;margin:0}
.woocommerce div.product .product_title{font-size:clamp(1.5rem,1.2rem + 1.1vw,2.1rem);margin-bottom:14px}
.woocommerce div.product p.price,.woocommerce div.product span.price{
	color:var(--accent-text);font-family:var(--font-head);font-weight:800;font-size:1.7rem;margin-bottom:18px}
.woocommerce div.product p.price del{color:var(--muted);font-size:.62em;font-weight:600}
.woocommerce div.product p.price ins{text-decoration:none}
.woocommerce div.product .woocommerce-product-rating{margin-bottom:16px;display:flex;align-items:center;gap:12px}
.woocommerce div.product .woocommerce-product-rating .woocommerce-review-link{font-size:var(--fs-sm);color:var(--muted)}
.woocommerce .star-rating{color:var(--accent-dark)}
.woocommerce div.product .woocommerce-product-details__short-description{font-size:var(--fs-body);margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.woocommerce div.product form.cart{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:26px}
.woocommerce div.product form.cart div.quantity{margin:0;float:none}
.woocommerce .quantity input.qty{width:88px;height:52px;text-align:center;border-radius:var(--r-pill);border:1.6px solid var(--line);padding:0 10px;font-family:var(--font-head);font-weight:700}
.woocommerce div.product form.cart .button{height:52px}
.woocommerce div.product .product_meta{font-size:var(--fs-sm);color:var(--muted);display:grid;gap:7px;padding-top:22px;border-top:1px solid var(--line)}
.woocommerce div.product .product_meta>span{display:block}
.woocommerce div.product .product_meta a{color:var(--accent-text)}
.woocommerce div.product .woocommerce-tabs{grid-column:1/-1;margin-top:clamp(30px,4vw,54px)}
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0;margin:0 0 26px;display:flex;flex-wrap:wrap;gap:10px;list-style:none}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:#fff;border:1.6px solid var(--line);border-radius:var(--r-pill);margin:0;padding:0;box-shadow:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{padding:11px 24px;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:var(--heading)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:var(--accent);border-color:var(--accent)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--accent-ink)}
.woocommerce div.product .woocommerce-tabs .panel{margin:0;padding:0;font-size:var(--fs-body)}
.woocommerce div.product .woocommerce-tabs h2{font-size:1.3rem}
.woocommerce table.shop_attributes{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;font-size:var(--fs-sm);width:100%;border-collapse:collapse}
.woocommerce table.shop_attributes th,.woocommerce table.shop_attributes td{border:0;border-bottom:1px solid var(--line);padding:12px 16px;font-style:normal}
.woocommerce table.shop_attributes th{background:var(--surface-alt);font-family:var(--font-head);color:var(--heading);width:210px}
.woocommerce .related.products,.woocommerce .upsells.products{grid-column:1/-1;margin-top:clamp(40px,5vw,70px)}
.woocommerce .related h2,.woocommerce .upsells h2,.woocommerce .cross-sells h2{font-size:var(--fs-h2);margin-bottom:32px}
.woocommerce #reviews #comments ol.commentlist{padding:0;margin:0 0 30px;display:grid;gap:18px}
.woocommerce #reviews #comments ol.commentlist li{margin:0}
.woocommerce #reviews #comments ol.commentlist li .comment-text{border:1px solid var(--line);border-radius:var(--r-md);padding:24px;margin:0 0 0 76px}
.woocommerce #reviews #comments ol.commentlist li img.avatar{width:56px;border:0;border-radius:50%;padding:0;position:absolute;top:0;left:0}
.woocommerce #review_form #respond textarea{min-height:120px}
.woocommerce p.stars a{color:var(--accent-dark)}

/* Cart */
.woocommerce table.shop_table{border:1px solid var(--line);border-radius:var(--r-md);border-collapse:separate;border-spacing:0;overflow:hidden;font-size:var(--fs-sm);width:100%;margin-bottom:26px}
.woocommerce table.shop_table th{background:var(--surface-alt);font-family:var(--font-head);font-weight:700;color:var(--heading);padding:15px 18px;border:0;font-size:var(--fs-sm)}
.woocommerce table.shop_table td{padding:18px;border:0;border-top:1px solid var(--line);vertical-align:middle}
.woocommerce table.shop_table tbody tr:first-child td{border-top:0}
.woocommerce table.cart img{width:74px;border-radius:var(--r-sm)}
.woocommerce table.cart .product-name a{font-family:var(--font-head);font-weight:700;color:var(--heading)}
.woocommerce table.cart .product-name a:hover{color:var(--accent-text)}
.woocommerce a.remove{width:28px;height:28px;line-height:26px;border-radius:50%;color:var(--muted)!important;background:var(--surface-alt);font-weight:400;font-size:1.1rem;text-align:center;display:inline-block}
.woocommerce a.remove:hover{background:#B42318;color:#fff!important}
/* The collaterals block holds only the totals (and cross-sells when enabled),
   so it is laid out as a right-aligned column rather than a two-up grid that
   would leave a dead half-width cell. */
.woocommerce .cart-collaterals,.woocommerce-page .cart-collaterals{display:grid;gap:clamp(24px,3vw,40px);align-items:start;justify-content:end}
.woocommerce .cart-collaterals .cart_totals,.woocommerce-page .cart-collaterals .cart_totals{width:min(430px,100%);float:none}
.woocommerce .cart-collaterals .cross-sells,.woocommerce-page .cart-collaterals .cross-sells{width:100%;float:none;grid-row:1}
.woocommerce .cart_totals{background:var(--surface-alt);border-radius:var(--r-md);padding:clamp(24px,3vw,32px)}
.woocommerce .cart_totals h2{font-size:1.2rem;margin-bottom:18px}
.woocommerce .cart_totals table.shop_table{background:#fff;margin-bottom:20px}
.woocommerce .cart_totals .order-total .amount{color:var(--accent-text);font-size:1.2rem}
.woocommerce .wc-proceed-to-checkout .button{width:100%}
.woocommerce .actions .coupon{display:flex;gap:10px;flex-wrap:wrap}
.woocommerce .actions .coupon .input-text{width:auto;flex:1;min-width:180px}
.woocommerce .cart-empty{font-family:var(--font-head);font-size:1.2rem;color:var(--heading);text-align:center}
.woocommerce .return-to-shop{text-align:center;margin-top:20px}

/* Checkout */
/* Two columns, with the billing form spanning both rows on the left so the
   order summary sits beside the "Your order" heading instead of dropping
   below the full height of the form. */
.woocommerce-checkout .woocommerce form.checkout{display:grid;grid-template-columns:minmax(0,1fr) 430px;grid-template-rows:auto 1fr;gap:clamp(26px,3vw,44px);align-items:start}
.woocommerce-checkout #customer_details{grid-column:1;grid-row:1/span 2;width:auto!important;float:none!important}
.woocommerce-checkout #customer_details .col-1,.woocommerce-checkout #customer_details .col-2{width:auto!important;float:none!important;margin-bottom:26px}
.woocommerce-checkout h3{font-size:1.2rem;margin-bottom:18px}
.woocommerce form .form-row{margin:0 0 16px;padding:0;display:block}
.woocommerce form .form-row label{font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:var(--heading);margin-bottom:7px;display:block}
.woocommerce form .form-row .required{color:#B42318;text-decoration:none}
.woocommerce form .form-row-first,.woocommerce form .form-row-last{width:calc(50% - 8px);float:left}
.woocommerce form .form-row-last{float:right}
.woocommerce .select2-container--default .select2-selection--single{height:auto;border:1.6px solid var(--line);border-radius:var(--r-sm);padding:9px 6px}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:1.8;color:var(--heading);font-size:var(--fs-sm)}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow{height:100%}
#order_review_heading{grid-column:2;grid-row:1;margin:0 0 18px}
.woocommerce-checkout #order_review{grid-column:2;grid-row:2;background:var(--surface-alt);border-radius:var(--r-md);padding:clamp(24px,3vw,32px);width:auto!important;float:none!important}
.woocommerce-checkout #order_review table.shop_table{background:#fff}
.woocommerce-checkout #payment{background:transparent;border-radius:0}
.woocommerce-checkout #payment ul.payment_methods{border:0;padding:0;margin:0 0 18px;list-style:none;display:grid;gap:10px}
.woocommerce-checkout #payment ul.payment_methods li{background:#fff;border:1.6px solid var(--line);border-radius:var(--r-sm);padding:14px 16px;margin:0}
.woocommerce-checkout #payment div.payment_box{background:var(--surface-alt);border-radius:var(--r-sm);font-size:var(--fs-sm);margin:12px 0 0;padding:14px 16px}
.woocommerce-checkout #payment div.payment_box::before{display:none}
.woocommerce-checkout #payment .form-row.place-order{padding:0;margin:0}
.woocommerce-checkout #payment #place_order{width:100%}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{font-size:var(--fs-sm);margin-bottom:16px}

/* Order received / thank you */
.woocommerce .woocommerce-order{max-width:820px;margin-inline:auto}
.swp-thankyou{text-align:center;margin-bottom:40px}
.swp-thankyou .disc{width:82px;height:82px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;margin:0 auto 22px}
.swp-thankyou .disc .icon{width:38px;height:38px;stroke-width:2}
.woocommerce ul.order_details{list-style:none;margin:0 0 34px;padding:24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;background:var(--surface-alt);border-radius:var(--r-md)}
.woocommerce ul.order_details li{border:0;padding:0;margin:0;float:none;font-size:var(--fs-xs);color:var(--muted);text-transform:uppercase;font-family:var(--font-head);font-weight:700;letter-spacing:.04em}
.woocommerce ul.order_details li strong{display:block;font-size:1.02rem;color:var(--heading);text-transform:none;letter-spacing:0;margin-top:5px}
.woocommerce-order-details,.woocommerce-customer-details{margin-bottom:34px}
.woocommerce .woocommerce-column__title,.woocommerce-order-details__title{font-size:1.2rem;margin-bottom:18px}
.woocommerce .woocommerce-customer-details address{border:1px solid var(--line);border-radius:var(--r-md);padding:22px;font-style:normal;font-size:var(--fs-sm)}

/* My account */
.woocommerce-account .woocommerce{display:grid;grid-template-columns:280px minmax(0,1fr);gap:clamp(24px,3vw,44px);align-items:start}
.woocommerce-account .woocommerce-MyAccount-navigation{width:auto;float:none;background:var(--surface-alt);border-radius:var(--r-md);padding:16px}
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.woocommerce-account .woocommerce-MyAccount-navigation li a{display:block;padding:12px 16px;border-radius:var(--r-sm);font-family:var(--font-head);font-weight:600;font-size:var(--fs-sm);color:var(--heading);transition:background-color .2s,color .2s}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{background:#fff}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{background:var(--accent);color:var(--accent-ink)}
.woocommerce-account .woocommerce-MyAccount-content{width:auto;float:none;font-size:var(--fs-body)}
.woocommerce-account .woocommerce-MyAccount-content a:not(.button){color:var(--accent-text)}
.woocommerce-account:not(.logged-in) .woocommerce{grid-template-columns:1fr;max-width:940px;margin-inline:auto}
.woocommerce-account .col2-set{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,40px)}
.woocommerce-account .col2-set .col-1,.woocommerce-account .col2-set .col-2{width:auto!important;float:none!important}
.woocommerce-account .u-columns form.login,.woocommerce-account .u-columns form.register,
.woocommerce form.login,.woocommerce form.register{border:1px solid var(--line);border-radius:var(--r-md);padding:clamp(24px,3vw,34px);margin:0}
.woocommerce form.lost_reset_password{border:1px solid var(--line);border-radius:var(--r-md);padding:clamp(24px,3vw,34px);max-width:520px;margin-inline:auto}
.woocommerce-form-login__rememberme{display:inline-flex;align-items:center;gap:8px}
.woocommerce-form-login__rememberme input{width:auto}
.woocommerce .woocommerce-form-login .woocommerce-LostPassword{margin-top:12px;font-size:var(--fs-sm)}

/* ---------- Cart & Checkout BLOCKS ----------
   The demo importer switches these pages to the classic shortcodes, which this
   theme styles fully. A site that keeps WooCommerce's block Cart/Checkout still
   picks up the palette, typography and control shapes here. */
.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout{max-width:none}
.wc-block-components-title,.wc-block-cart__submit-container+*,
.wp-block-woocommerce-checkout h2,.wp-block-woocommerce-cart h2{font-family:var(--font-head);color:var(--heading)}
.wc-block-cart__submit-container .wc-block-components-button,
.wc-block-components-checkout-place-order-button{width:100%}
.wc-block-components-sidebar,.wc-block-components-order-summary,
.wp-block-woocommerce-cart-order-summary-block{background:var(--surface-alt);border-radius:var(--r-md);padding:clamp(22px,3vw,30px)}
.wc-block-components-panel,.wc-block-components-totals-wrapper{border-color:var(--line)}
.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-block-components-combobox-control input.components-combobox-control__input,
.wc-block-components-form .wc-block-components-text-input input[type=text],
.wc-block-components-form .wc-block-components-text-input input[type=email],
.wc-block-components-form .wc-block-components-text-input input[type=tel]{
	border:1.6px solid var(--line)!important;border-radius:var(--r-sm)!important;
	font-family:var(--font-body);font-size:var(--fs-sm);color:var(--heading);background:#fff}
.wc-block-components-text-input.is-active input:focus,
.wc-block-components-text-input input:focus{outline:none;box-shadow:none;border-color:var(--accent)!important}
.wc-block-components-product-name{font-family:var(--font-head);font-weight:700;color:var(--heading)}
.wc-block-components-product-price__value,.wc-block-components-totals-item__value{
	font-family:var(--font-head);font-weight:700;color:var(--accent-text)}
.wc-block-cart-item__image img,.wc-block-components-order-summary-item__image img{border-radius:var(--r-sm)}
.wc-block-components-notice-banner{border-radius:var(--r-sm);font-size:var(--fs-sm)}
.wc-block-components-checkout-step__title{font-family:var(--font-head);color:var(--heading)}
.wc-block-components-radio-control__option,.wc-block-components-radio-control-accordion-option{
	border-radius:var(--r-sm)}
.wc-block-components-button:not(.is-link){border-radius:var(--r-pill)!important}

/* Shop banner search + widgets */
.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle{background:var(--accent)}
.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content{background:var(--line)}
.woocommerce ul.cart_list li,.woocommerce ul.product_list_widget li{padding:12px 0;border-bottom:1px solid var(--line);font-size:var(--fs-sm)}
.woocommerce ul.product_list_widget li img{width:56px;border-radius:var(--r-sm);float:left;margin-right:12px}

/* Mini cart drawer */
.swp-cart-drawer{position:fixed;top:0;right:0;bottom:0;width:min(400px,100%);background:#fff;z-index:95;transform:translateX(100%);transition:transform .3s cubic-bezier(.22,.68,.36,1);display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}
.swp-cart-drawer.open{transform:none}
.swp-cart-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:22px;border-bottom:1px solid var(--line)}
.swp-cart-drawer__head h3{margin:0;font-size:1.1rem}
.swp-cart-drawer__body{flex:1;overflow-y:auto;padding:22px}
.swp-cart-drawer .widget_shopping_cart_content{font-size:var(--fs-sm)}
.swp-cart-drawer .woocommerce-mini-cart__buttons{display:grid;gap:10px}
.swp-cart-drawer .woocommerce-mini-cart__buttons .button{width:100%}
.swp-overlay{position:fixed;inset:0;background:rgba(6,12,9,.55);z-index:94;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.swp-overlay.show{opacity:1;visibility:visible}

/* ============================================================
   23. SCROLL POPUP
   ============================================================ */
.swp-popup{position:fixed;inset:0;z-index:9996;display:none;place-items:center;padding:20px}
.swp-popup.is-open{display:grid}
.swp-popup__backdrop{position:absolute;inset:0;background:rgba(6,12,9,.7);animation:swpFadeIn .3s}
.swp-popup__box{position:relative;width:min(880px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:var(--r-lg);display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);box-shadow:var(--shadow-lg);animation:swpPopIn .35s cubic-bezier(.22,.68,.36,1)}
.swp-popup__box.no-media{grid-template-columns:1fr;max-width:520px;text-align:center}
.swp-popup__media{position:relative;isolation:isolate;min-height:300px}
.swp-popup__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.swp-popup__body{padding:clamp(28px,3.5vw,42px)}
.swp-popup__badge{display:inline-flex;align-items:center;gap:8px;background:var(--accent-tint);color:var(--accent-text);font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);padding:7px 15px;border-radius:var(--r-pill);margin-bottom:16px}
.swp-popup__badge .icon{width:14px;height:14px}
.swp-popup__box h3{font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem);margin-bottom:.4em}
.swp-popup__box p{font-size:var(--fs-sm);margin-bottom:22px}
.swp-popup__box .no-media .callpill{margin-inline:auto}
.swp-popup__close{position:absolute;top:14px;right:14px;z-index:4;width:38px;height:38px;border-radius:50%;background:#fff;color:var(--heading);display:grid;place-items:center;box-shadow:var(--shadow);transition:background-color .2s,color .2s}
.swp-popup__close:hover{background:var(--primary);color:#fff}
.swp-popup__close .icon{width:17px;height:17px}
.swp-popup__dismiss{display:block;margin-top:16px;font-size:var(--fs-xs);color:var(--muted);text-decoration:underline;text-underline-offset:3px;background:none;padding:0}
.swp-popup__dismiss:hover{color:var(--heading)}
@keyframes swpFadeIn{from{opacity:0}to{opacity:1}}
@keyframes swpPopIn{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}

/* ============================================================
   MOTION
   ============================================================ */
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero__body>*{animation:rise .6s cubic-bezier(.22,.68,.36,1) backwards}
.hero__body>*:nth-child(1){animation-delay:.05s}
.hero__body>*:nth-child(2){animation-delay:.12s}
.hero__body>*:nth-child(3){animation-delay:.19s}
.hero__body>*:nth-child(4){animation-delay:.26s}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.22,.68,.36,1),transform .6s cubic-bezier(.22,.68,.36,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
	.reveal{opacity:1;transform:none}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1200px){
	.woocommerce ul.products,.woocommerce-page ul.products,
	.woocommerce ul.products.columns-4,.woocommerce ul.products.columns-5,
	.woocommerce ul.products.columns-6{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1024px){
	.nav{position:fixed;inset:76px 0 auto;background:#fff;padding:16px var(--gutter) 22px;display:none;box-shadow:var(--shadow);max-height:calc(100vh - 76px);overflow-y:auto}
	.nav[data-open="true"]{display:block}
	.nav__list{flex-direction:column;align-items:stretch;gap:0}
	.nav__list a{display:flex;padding:12px 2px;border-bottom:1px solid var(--line)}
	.nav__list .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;border-radius:0;padding:0 0 0 16px;display:none}
	.nav__list li.open>.sub-menu{display:grid}
	.nav__list .menu-item-has-children>a::after{margin-left:auto;transition:transform .2s}
	.nav__list li.open>a::after{transform:rotate(-135deg) translateY(-2px)}
	.navtoggle{display:inline-flex}
	/* The CTA does not fit beside the logo — it moves into the panel. */
	.header__cta{display:none}
	.nav__cta{display:grid}
	.header__inner{gap:12px}
	/* Logo, then the icon buttons, then the burger hard right. */
	.header__actions{order:2;margin-left:auto}
	.navtoggle{order:3}
	.hero__trust{position:static;text-align:left;margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,255,255,.2)}
	.hero__trustrow{justify-content:flex-start}
	.about,.svchead,.news__inner,.why,.contact__grid,.content-grid,.service-single{grid-template-columns:1fr}
	.widget-area,.service-aside{position:static}
	.svchead{align-items:start;gap:14px}
	.features,.svcgrid,.pricing,.blog-grid,.projects__grid{grid-template-columns:1fr 1fr}
	.svchead h2{max-width:none}
	.feature--on,.plan--on{grid-column:span 2}
	.footer__grid{grid-template-columns:1fr 1fr}
	.smart__play{left:auto;right:8%;top:auto;bottom:14%;transform:none}
	.smart__play:hover{transform:scale(1.06)}
	.woocommerce div.product{grid-template-columns:1fr}
	.woocommerce .cart-collaterals,.woocommerce-page .cart-collaterals,
	.woocommerce-checkout .woocommerce form.checkout,
	.woocommerce-account .woocommerce{grid-template-columns:1fr}
	.woocommerce-checkout .woocommerce form.checkout{grid-template-rows:none}
	.woocommerce-checkout #customer_details,
	#order_review_heading,.woocommerce-checkout #order_review{grid-column:1;grid-row:auto}
	.woocommerce-account .woocommerce-MyAccount-navigation ul{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));display:grid}
	.swp-popup__box{grid-template-columns:1fr}
	.swp-popup__media{min-height:180px}
}
@media (max-width:820px){
	.woocommerce ul.products,.woocommerce-page ul.products,
	.woocommerce ul.products[class*="columns-"]{grid-template-columns:repeat(2,1fr)}
	.swp-form .row,.wpcf7-form .row{grid-template-columns:1fr}
	.woocommerce form .form-row-first,.woocommerce form .form-row-last{width:100%;float:none}
	.woocommerce-account .col2-set{grid-template-columns:1fr}
	.post-navigation{grid-template-columns:1fr}
	.post-navigation .nav-next{text-align:left}
}
@media (max-width:720px){
	:root{--gutter:16px}
	/* Stack the top bar rather than letting the address row overflow. */
	.topbar__inner{justify-content:center;gap:6px 18px;padding-block:8px}
	.topbar__meta{gap:14px;justify-content:center}
	.hero{min-height:0}
	.hero__inner{padding-block:48px 40px}
	.statsbar{grid-template-columns:1fr 1fr;transform:none;margin-top:38px}
	.statsbar div:nth-child(2){border-right:0}
	.statsbar div:nth-child(-n+2){border-bottom:1px solid rgba(6,48,31,.18)}
	.statsbar-gap{display:none}
	.promo{padding-bottom:var(--section)}
	.features,.svcgrid,.pricing,.blog-grid,.projects__grid,.why__cards,.footer__grid{grid-template-columns:1fr}
	.feature--on,.plan--on{grid-column:auto}
	.about__badge{width:86px;height:86px;top:-18px;right:-6px}
	.about__dots{left:-14px;bottom:-14px;width:90px;height:90px}
	.footer__bar{flex-direction:column;text-align:center}
	.woocommerce table.shop_table_responsive thead{display:none}
	.woocommerce table.shop_table_responsive tr{display:block;border-bottom:1px solid var(--line);padding:14px 0}
	.woocommerce table.shop_table_responsive td{display:flex;justify-content:space-between;gap:14px;align-items:center;border:0;padding:7px 16px;text-align:right}
	.woocommerce table.shop_table_responsive td::before{content:attr(data-title);font-family:var(--font-head);font-weight:700;color:var(--heading);text-align:left}
	/* The actions row is not a label/value pair — it holds the coupon field and
	   the update button, which the flex rule above squashes into one line. */
	.woocommerce table.shop_table_responsive td.actions{display:block;text-align:left;padding:16px}
	.woocommerce table.shop_table_responsive td.actions::before{display:none}
	/* WooCommerce floats the coupon block with a 4-class selector, so match it. */
	.woocommerce .cart .actions .coupon,
	.woocommerce-page .cart .actions .coupon{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 10px;float:none;width:100%;padding:0}
	.woocommerce .cart .actions .coupon .input-text{width:100%;flex:none;min-width:0}
	.woocommerce .cart .actions .coupon .button,
	.woocommerce table.shop_table_responsive td.actions>.button{width:100%;float:none;white-space:nowrap}

	/* The totals table already labels each row with a <th>, so the generated
	   data-title would print the same word twice. */
	.woocommerce .cart_totals table.shop_table_responsive tr{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:12px 16px}
	.woocommerce .cart_totals table.shop_table_responsive th,
	.woocommerce .cart_totals table.shop_table_responsive td{border:0;padding:0;background:none}
	.woocommerce .cart_totals table.shop_table_responsive th{text-align:left}
	.woocommerce .cart_totals table.shop_table_responsive td{display:block;text-align:right}
	.woocommerce .cart_totals table.shop_table_responsive td::before{display:none}
	.woocommerce .cart_totals table.shop_table_responsive tr+tr{border-top:1px solid var(--line);border-bottom:0}
	.woocommerce .cart_totals table.shop_table_responsive tr:first-child{border-bottom:0}
	.woocommerce table.cart .product-thumbnail{display:none}
	.swp-lb-prev{left:10px}
	.swp-lb-next{right:10px}
}
@media (max-width:560px){
	.woocommerce ul.products,.woocommerce-page ul.products,
	.woocommerce ul.products[class*="columns-"]{grid-template-columns:1fr}
	.header__actions .iconbtn.is-search{display:none}
}