/*
Theme Name: 613 Living
Theme URI: https://613living.com.au
Author: 613 Living
Author URI: https://613living.com.au
Description: A fast, modern, conversion-focused WordPress theme built for 613 Living, Sydney's custom security screen specialists. Ships with a full set of bundled photography, a product range custom post type, an AJAX quote request system with lead capture, a one-click starter site importer that also populates the media library, full theme customiser controls and a charcoal + electric blue design system tuned for premium Australian trade brands.
Version: 1.2.2
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: six13
Tags: business, portfolio, custom-colors, custom-logo, custom-menu, featured-images, full-width-template, responsive-layout, theme-options, translation-ready
*/

/* =========================================================================
   613 LIVING — DESIGN SYSTEM
   1.  Tokens
   2.  Reset & base
   3.  Layout primitives
   4.  Typography
   5.  Buttons & links
   6.  Header / navigation
   7.  Hero
   8.  Sections & components
   9.  Product cards & grids
   10. Forms & quote flow
   11. Footer
   12. Editor / WP core blocks
   13. Utilities & motion
   14. Responsive
   ========================================================================= */

/* ------------------------------ 1. TOKENS ------------------------------ */
:root{
  /* Brand — charcoal + electric blue */
  --c-ink:        #0A0D12;
  --c-charcoal:   #11161E;
  --c-graphite:   #19202B;
  --c-slate:      #263141;
  --c-line:       #2E3A4B;
  --c-muted:      #8A98AB;
  --c-soft:       #C4D0DF;
  --c-paper:      #FFFFFF;
  --c-mist:       #F3F6FA;
  --c-mist-2:     #E7EDF5;

  --c-brand:      #1D5FFF;
  --c-brand-600:  #0F4BE0;
  --c-brand-400:  #4F86FF;
  --c-brand-200:  #A9C4FF;
  --c-brand-050:  #EDF3FF;
  --c-glow:       #5BE9FF;
  --c-success:    #17B26A;
  --c-warn:       #F5A524;

  /* Typography */
  --f-head: 'Sora', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --f-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  --fs-xs: .75rem;
  --fs-sm: .875rem;
  --fs-base: 1rem;
  --fs-md: 1.0625rem;
  --fs-lg: 1.25rem;
  --fs-xl: 1.5rem;
  --fs-2xl: 2rem;
  --fs-3xl: 2.5rem;
  --fs-4xl: 3.25rem;
  --fs-5xl: 4rem;

  /* Space */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;    --sp-7: 3rem;    --sp-8: 4rem;
  --sp-9: 6rem;    --sp-10: 8rem;

  /* Shape */
  --r-sm: 8px; --r-md: 14px; --r-lg: 22px; --r-xl: 32px; --r-pill: 999px;

  /* Elevation */
  --sh-1: 0 1px 2px rgba(10,13,18,.06), 0 4px 12px rgba(10,13,18,.05);
  --sh-2: 0 2px 6px rgba(10,13,18,.07), 0 12px 32px rgba(10,13,18,.09);
  --sh-3: 0 8px 20px rgba(10,13,18,.10), 0 32px 64px rgba(10,13,18,.14);
  --sh-brand: 0 10px 30px rgba(29,95,255,.28);

  --wrap: 1240px;
  --wrap-narrow: 820px;
  --header-h: 84px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

/* --------------------------- 2. RESET & BASE --------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{
  -webkit-text-size-adjust:100%; scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h) + 20px);
  overflow-x:hidden; overflow-x:clip;
}
body{
  margin:0;
  font-family:var(--f-body);
  font-size:var(--fs-md);
  line-height:1.65;
  color:var(--c-charcoal);
  background:var(--c-paper);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img,svg,video{ max-width:100%; height:auto; display:block; }
a{ color:var(--c-brand); text-decoration:none; transition:color .2s var(--ease); }
a:hover{ color:var(--c-brand-600); }
button{ font:inherit; }
ul,ol{ padding-left:1.15rem; }
figure{ margin:0; }
hr{ border:0; border-top:1px solid var(--c-mist-2); margin:var(--sp-7) 0; }
::selection{ background:var(--c-brand); color:#fff; }

:focus-visible{ outline:3px solid var(--c-brand-400); outline-offset:2px; border-radius:4px; }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:9999;
  background:var(--c-brand); color:#fff; padding:.75rem 1.25rem; border-radius:0 0 var(--r-sm) 0;
}
.skip-link:focus{ left:0; color:#fff; }

.screen-reader-text{
  border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%);
  height:1px; width:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; word-wrap:normal!important;
}

/* ------------------------ 3. LAYOUT PRIMITIVES ------------------------ */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(1.15rem,4vw,2rem); }
.wrap--narrow{ max-width:var(--wrap-narrow); }
.section{ padding-block:clamp(3.5rem,7vw,6.5rem); position:relative; }
.section--tight{ padding-block:clamp(2.5rem,5vw,4rem); }
.section--dark{ background:var(--c-ink); color:var(--c-soft); }
.section--charcoal{ background:var(--c-charcoal); color:var(--c-soft); }
.section--mist{ background:var(--c-mist); }
.section--dark h1,.section--dark h2,.section--dark h3,.section--dark h4,
.section--charcoal h1,.section--charcoal h2,.section--charcoal h3,.section--charcoal h4{ color:#fff; }

.grid{ display:grid; gap:var(--sp-5); }
.g-2{ grid-template-columns:repeat(2,1fr); }
.g-3{ grid-template-columns:repeat(3,1fr); }
.g-4{ grid-template-columns:repeat(4,1fr); }
.g-auto{ grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); }
.flex{ display:flex; gap:var(--sp-4); }
.flex-between{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); }
.flex-center{ display:flex; align-items:center; gap:var(--sp-3); }
.flex-wrap{ flex-wrap:wrap; }

/* --------------------------- 4. TYPOGRAPHY --------------------------- */
h1,h2,h3,h4,h5,h6{
  font-family:var(--f-head);
  color:var(--c-ink);
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.022em;
  margin:0 0 var(--sp-4);
  text-wrap:balance;
}
h1{ font-size:clamp(2.25rem,5.4vw,var(--fs-5xl)); }
h2{ font-size:clamp(1.85rem,3.9vw,var(--fs-3xl)); }
h3{ font-size:clamp(1.3rem,2.2vw,var(--fs-xl)); }
h4{ font-size:var(--fs-lg); }
p{ margin:0 0 var(--sp-4); }
p:last-child{ margin-bottom:0; }

.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--f-head); font-size:var(--fs-xs); font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--c-brand);
  margin-bottom:var(--sp-3);
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--c-brand); border-radius:2px; }
.section--dark .eyebrow,.section--charcoal .eyebrow{ color:var(--c-glow); }
.section--dark .eyebrow::before,.section--charcoal .eyebrow::before{ background:var(--c-glow); }

.lead{ font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--c-slate); line-height:1.6; }
.section--dark .lead,.section--charcoal .lead{ color:var(--c-soft); }
.muted{ color:var(--c-muted); }
.section-head{ max-width:720px; margin-bottom:clamp(2rem,4vw,3.25rem); }
.section-head--center{ margin-inline:auto; text-align:center; }

/* ------------------------ 5. BUTTONS & BADGES ------------------------ */
.btn{
  --btn-bg:var(--c-brand); --btn-fg:#fff; --btn-bd:var(--c-brand);
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  font-family:var(--f-head); font-weight:600; font-size:var(--fs-base); line-height:1;
  padding:1rem 1.6rem; border-radius:var(--r-pill);
  background:var(--btn-bg); color:var(--btn-fg); border:1.5px solid var(--btn-bd);
  cursor:pointer; text-align:center; white-space:nowrap;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease);
  box-shadow:var(--sh-brand);
}
.btn:hover{ color:var(--btn-fg); transform:translateY(-2px); box-shadow:0 14px 38px rgba(29,95,255,.36); background:var(--c-brand-600); border-color:var(--c-brand-600); }
.btn:active{ transform:translateY(0); }
.btn svg{ width:18px; height:18px; flex:none; }

.btn--ghost{ --btn-bg:transparent; --btn-fg:var(--c-ink); --btn-bd:var(--c-mist-2); box-shadow:none; }
.btn--ghost:hover{ background:var(--c-ink); border-color:var(--c-ink); color:#fff; box-shadow:var(--sh-2); }
.btn--outline-light{ --btn-bg:transparent; --btn-fg:#fff; --btn-bd:rgba(255,255,255,.32); box-shadow:none; }
.btn--outline-light:hover{ background:#fff; color:var(--c-ink); border-color:#fff; }
.btn--light{ --btn-bg:#fff; --btn-fg:var(--c-ink); --btn-bd:#fff; box-shadow:var(--sh-2); }
.btn--light:hover{ background:var(--c-mist); border-color:var(--c-mist); color:var(--c-ink); }
.btn--lg{ padding:1.15rem 2.1rem; font-size:var(--fs-md); }
.btn--sm{ padding:.7rem 1.15rem; font-size:var(--fs-sm); }
.btn--block{ width:100%; }

.badge{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:var(--fs-xs); font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  padding:.4rem .75rem; border-radius:var(--r-pill);
  background:var(--c-brand-050); color:var(--c-brand-600);
}
.badge--dark{ background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.14); }
.badge--glow{ background:rgba(91,233,255,.12); color:var(--c-glow); border:1px solid rgba(91,233,255,.28); }

.arrow-link{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--f-head); font-weight:600; color:var(--c-brand);
}
.arrow-link svg{ width:16px; height:16px; transition:transform .22s var(--ease); }
.arrow-link:hover svg{ transform:translateX(4px); }

/* ------------------------- 6. HEADER / NAV ------------------------- */
.topbar{
  background:var(--c-ink); color:var(--c-soft);
  font-size:var(--fs-sm); border-bottom:1px solid rgba(255,255,255,.07);
}
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); min-height:44px; }
.topbar a{ color:var(--c-soft); }
.topbar a:hover{ color:#fff; }
.topbar__marquee{ display:flex; align-items:center; gap:.5rem; font-weight:500; }
.topbar__marquee svg{ width:15px; height:15px; color:var(--c-glow); }
.topbar__links{ display:flex; align-items:center; gap:var(--sp-5); }

.site-header{
  position:sticky; top:0; z-index:900;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--c-mist-2);
  transition:box-shadow .25s var(--ease), background .25s var(--ease);
}
.site-header.is-stuck{ box-shadow:var(--sh-2); background:rgba(255,255,255,.96); }
.site-header .wrap{ display:flex; align-items:center; gap:var(--sp-5); min-height:var(--header-h); }

.brand{ display:flex; align-items:center; gap:.7rem; flex:none; }
.brand img{ max-height:52px; width:auto; }
.brand__mark{ width:42px; height:42px; flex:none; }
.brand__text{ display:flex; flex-direction:column; line-height:1.05; gap:.38rem; }
.brand__name{ font-family:var(--f-head); font-weight:800; font-size:1.28rem; letter-spacing:-.03em; color:var(--c-ink); }
.brand__name span{ color:var(--c-brand); }
.brand__tag{ font-size:.66rem; letter-spacing:.19em; text-transform:uppercase; color:var(--c-muted); font-weight:600; }

.nav{ margin-left:auto; }
.nav ul{ list-style:none; display:flex; align-items:center; gap:.35rem; margin:0; padding:0; }
.nav li{ position:relative; }
.nav a{
  display:flex; align-items:center; gap:.3rem; white-space:nowrap;
  font-family:var(--f-head); font-weight:600; font-size:.925rem; color:var(--c-charcoal);
  padding:.6rem .7rem; border-radius:var(--r-sm); transition:background .2s var(--ease), color .2s var(--ease);
}
@media (min-width:961px) and (max-width:1180px){
  .nav a{ font-size:.86rem; padding:.55rem .5rem; }
  .header-phone span{ display:none; }
}
.nav a:hover,.nav .current-menu-item>a,.nav .current_page_item>a,.nav .current-menu-ancestor>a{ color:var(--c-brand); background:var(--c-brand-050); }
.nav .menu-item-has-children>a::after{
  content:""; width:7px; height:7px; margin-left:.15rem;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px); opacity:.6;
}
.nav .sub-menu{
  position:absolute; top:calc(100% + 10px); left:0; min-width:262px;
  background:#fff; border:1px solid var(--c-mist-2); border-radius:var(--r-md);
  box-shadow:var(--sh-3); padding:.5rem; flex-direction:column; align-items:stretch; gap:0;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
}
.nav li:hover>.sub-menu,.nav li:focus-within>.sub-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.nav .sub-menu a{ padding:.7rem .8rem; font-weight:500; font-size:.92rem; border-radius:var(--r-sm); }
.nav .sub-menu .sub-menu{ top:0; left:calc(100% + 6px); }

.header-cta{ display:flex; align-items:center; gap:var(--sp-3); flex:none; }
.header-phone{ display:flex; align-items:center; gap:.5rem; font-family:var(--f-head); font-weight:700; color:var(--c-ink); }
.header-phone svg{ width:19px; height:19px; color:var(--c-brand); }

.nav-toggle{
  display:none; width:46px; height:46px; border:1px solid var(--c-mist-2); background:#fff;
  border-radius:var(--r-sm); cursor:pointer; align-items:center; justify-content:center; margin-left:auto;
}
.nav-toggle span{ display:block; width:20px; height:2px; background:var(--c-ink); border-radius:2px; position:relative; transition:all .25s var(--ease); }
.nav-toggle span::before,.nav-toggle span::after{ content:""; position:absolute; left:0; width:20px; height:2px; background:var(--c-ink); border-radius:2px; transition:all .25s var(--ease); }
.nav-toggle span::before{ top:-6px; } .nav-toggle span::after{ top:6px; }
.nav-toggle[aria-expanded="true"] span{ background:transparent; }
.nav-toggle[aria-expanded="true"] span::before{ top:0; transform:rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after{ top:0; transform:rotate(-45deg); }

/* ------------------------------ 7. HERO ------------------------------ */
.hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(900px 520px at 78% 12%, rgba(29,95,255,.30), transparent 62%),
    radial-gradient(700px 460px at 8% 88%, rgba(91,233,255,.14), transparent 60%),
    linear-gradient(165deg,#0A0D12 0%,#11161E 48%,#151D29 100%);
  color:#fff;
  padding-block:clamp(3.5rem,8vw,7rem);
}
.hero__bg{
  position:absolute; inset:0; z-index:0;
  background-size:cover; background-position:62% center; background-repeat:no-repeat;
}
.hero__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(96deg, rgba(8,11,16,.95) 0%, rgba(8,11,16,.84) 32%, rgba(8,11,16,.48) 62%, rgba(8,11,16,.58) 100%),
    linear-gradient(0deg, rgba(8,11,16,.55) 0%, transparent 42%),
    radial-gradient(820px 520px at 80% 14%, rgba(29,95,255,.26), transparent 62%);
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.4;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:radial-gradient(ellipse 90% 70% at 50% 40%,#000 25%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 40%,#000 25%,transparent 78%);
}
.hero .wrap{ position:relative; z-index:2; }
.hero__grid{ display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.hero h1{ color:#fff; margin-bottom:var(--sp-5); }
.hero h1 em{ font-style:normal; color:var(--c-glow); }
.hero__sub{ font-size:clamp(1.05rem,1.7vw,1.3rem); color:#C9D5E4; max-width:36em; margin-bottom:var(--sp-6); }
.hero__actions{ display:flex; flex-wrap:wrap; gap:var(--sp-3); margin-bottom:var(--sp-6); }
.hero__proof{ display:flex; flex-wrap:wrap; gap:var(--sp-5) var(--sp-6); padding-top:var(--sp-5); border-top:1px solid rgba(255,255,255,.12); }
.hero__proof-item{ display:flex; align-items:center; gap:.65rem; font-size:var(--fs-sm); color:#C9D5E4; font-weight:500; }
.hero__proof-item svg{ width:20px; height:20px; color:var(--c-glow); flex:none; }

.hero__panel{
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-xl);
  padding:clamp(1.5rem,3vw,2.25rem);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  box-shadow:0 30px 70px rgba(0,0,0,.42);
}
.hero__panel h3{ color:#fff; font-size:1.35rem; margin-bottom:.4rem; }
.hero__panel p{ color:#A9B8CB; font-size:var(--fs-sm); margin-bottom:var(--sp-5); }

.page-hero{
  background:linear-gradient(150deg,var(--c-ink) 0%,var(--c-charcoal) 60%,#182231 100%);
  color:#fff; padding-block:clamp(3rem,6vw,5rem); position:relative; overflow:hidden;
}
.page-hero::after{
  content:""; position:absolute; right:-8%; top:-40%; width:560px; height:560px; border-radius:50%;
  background:radial-gradient(circle,rgba(29,95,255,.35),transparent 66%);
}
.page-hero .wrap{ position:relative; z-index:2; }
.page-hero h1{ color:#fff; max-width:16ch; }
.page-hero p{ color:#B9C6D6; max-width:60ch; font-size:1.1rem; }

.breadcrumbs{ font-size:var(--fs-sm); color:#8FA0B5; margin-bottom:var(--sp-4); }
.breadcrumbs a{ color:#C9D5E4; }
.breadcrumbs a:hover{ color:#fff; }
.breadcrumbs span{ opacity:.5; margin-inline:.45rem; }

/* --------------------- 8. SECTIONS & COMPONENTS --------------------- */
.trust-strip{ background:var(--c-ink); border-top:1px solid rgba(255,255,255,.07); padding-block:var(--sp-5); }
.trust-strip .wrap{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-5); }
.trust-item{ text-align:center; }
.trust-item strong{ display:block; font-family:var(--f-head); font-size:clamp(1.5rem,3vw,2.1rem); color:#fff; letter-spacing:-.03em; }
.trust-item span{ font-size:var(--fs-sm); color:#8FA0B5; }

.card{
  background:#fff; border:1px solid var(--c-mist-2); border-radius:var(--r-lg);
  padding:clamp(1.4rem,2.4vw,1.9rem);
  transition:transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease);
  height:100%;
}
.card:hover{ transform:translateY(-4px); box-shadow:var(--sh-2); border-color:var(--c-brand-200); }
.card h3{ margin-bottom:var(--sp-2); }
.card p{ color:var(--c-slate); font-size:var(--fs-base); }
.card--dark{ background:var(--c-graphite); border-color:var(--c-line); color:var(--c-soft); }
.card--dark h3{ color:#fff; }
.card--dark p{ color:#A9B8CB; }
.card--flat:hover{ transform:none; }

.icon-badge{
  width:54px; height:54px; border-radius:var(--r-md);
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(140deg,var(--c-brand),#0F4BE0);
  color:#fff; margin-bottom:var(--sp-4); box-shadow:var(--sh-brand);
}
.icon-badge svg{ width:26px; height:26px; }
.icon-badge--soft{ background:var(--c-brand-050); color:var(--c-brand); box-shadow:none; }
.icon-badge--glow{ background:rgba(91,233,255,.12); color:var(--c-glow); box-shadow:none; border:1px solid rgba(91,233,255,.25); }

.step{ position:relative; padding-left:0; }
.step__num{
  font-family:var(--f-head); font-size:.8rem; font-weight:700; letter-spacing:.1em;
  color:var(--c-brand); display:block; margin-bottom:.75rem;
}
.steps{ counter-reset:step; }

.feature-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.feature-split--rev .feature-split__media{ order:2; }
.feature-split__media{ border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sh-3); background:var(--c-graphite); }
.feature-split__media img,.feature-split__media svg{ width:100%; display:block; }

.check-list{ list-style:none; margin:0; padding:0; display:grid; gap:.85rem; }
.check-list li{ display:flex; gap:.75rem; align-items:flex-start; font-size:var(--fs-base); }
.check-list li::before{
  content:""; flex:none; width:22px; height:22px; margin-top:2px; border-radius:50%;
  background:var(--c-brand-050) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D5FFF' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/13px no-repeat;
}
.section--dark .check-list li::before,.section--charcoal .check-list li::before{
  background:rgba(91,233,255,.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235BE9FF' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/13px no-repeat;
}

.stat-tile{ background:var(--c-graphite); border:1px solid var(--c-line); border-radius:var(--r-lg); padding:var(--sp-5); }
.stat-tile strong{ display:block; font-family:var(--f-head); font-size:2.4rem; color:var(--c-glow); letter-spacing:-.03em; line-height:1; margin-bottom:.4rem; }
.stat-tile span{ font-size:var(--fs-sm); color:#A9B8CB; }

.testimonial{
  background:#fff; border:1px solid var(--c-mist-2); border-radius:var(--r-lg);
  padding:clamp(1.5rem,2.5vw,2rem); height:100%; display:flex; flex-direction:column;
}
.testimonial__stars{ display:flex; gap:2px; color:var(--c-warn); margin-bottom:var(--sp-3); }
.testimonial__stars svg{ width:18px; height:18px; }
.testimonial blockquote{ margin:0 0 var(--sp-4); font-size:1.05rem; color:var(--c-charcoal); line-height:1.6; }
.testimonial__who{ display:flex; align-items:center; gap:.75rem; margin-top:auto; }
.testimonial__avatar{
  width:44px; height:44px; border-radius:50%; flex:none;
  background:linear-gradient(140deg,var(--c-brand),var(--c-glow)); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:var(--f-head); font-weight:700;
}
.testimonial__name{ font-weight:600; font-size:var(--fs-sm); color:var(--c-ink); }
.testimonial__loc{ font-size:var(--fs-xs); color:var(--c-muted); }

.cta-band{
  background:linear-gradient(120deg,var(--c-brand-600),var(--c-brand) 55%,#3C7BFF);
  color:#fff; border-radius:var(--r-xl); padding:clamp(2rem,4.5vw,3.5rem);
  position:relative; overflow:hidden; box-shadow:var(--sh-3);
}
.cta-band::after{
  content:""; position:absolute; right:-60px; top:-80px; width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.22),transparent 65%);
}
.cta-band h2{ color:#fff; }
.cta-band p{ color:rgba(255,255,255,.9); max-width:52ch; }
.cta-band .wrap-inner{ position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-6); flex-wrap:wrap; }

.accordion{ border-top:1px solid var(--c-mist-2); }
.accordion__item{ border-bottom:1px solid var(--c-mist-2); }
.accordion__btn{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4);
  background:none; border:0; padding:1.35rem 0; cursor:pointer; text-align:left;
  font-family:var(--f-head); font-weight:600; font-size:1.08rem; color:var(--c-ink);
}
.accordion__btn:hover{ color:var(--c-brand); }
.accordion__icon{ flex:none; width:28px; height:28px; border-radius:50%; background:var(--c-brand-050); position:relative; transition:background .2s var(--ease); }
.accordion__icon::before,.accordion__icon::after{ content:""; position:absolute; inset:50% 8px auto; height:2px; background:var(--c-brand); transform:translateY(-50%); border-radius:2px; transition:transform .25s var(--ease); }
.accordion__icon::after{ transform:translateY(-50%) rotate(90deg); }
.accordion__btn[aria-expanded="true"] .accordion__icon::after{ transform:translateY(-50%) rotate(0deg); }
.accordion__panel{ overflow:hidden; max-height:0; transition:max-height .3s var(--ease); }
.accordion__panel-inner{ padding-bottom:1.4rem; color:var(--c-slate); max-width:70ch; }

.logo-strip{ display:flex; align-items:center; justify-content:center; gap:clamp(1.5rem,5vw,3.5rem); flex-wrap:wrap; opacity:.85; }
.logo-strip .cert{
  display:flex; align-items:center; gap:.6rem; font-family:var(--f-head); font-weight:600;
  font-size:var(--fs-sm); color:#A9B8CB; letter-spacing:.02em;
}
.logo-strip .cert svg{ width:24px; height:24px; color:var(--c-glow); }

.area-list{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem; }
.area-list li a,.area-list li span{
  display:inline-block; padding:.5rem .9rem; border-radius:var(--r-pill);
  background:#fff; border:1px solid var(--c-mist-2); font-size:var(--fs-sm); color:var(--c-slate);
  transition:all .2s var(--ease);
}
.area-list li a:hover{ background:var(--c-brand); border-color:var(--c-brand); color:#fff; }
.section--dark .area-list li a,.section--dark .area-list li span{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.12); color:var(--c-soft); }

/* --------------------- 9. PRODUCT CARDS & GRIDS --------------------- */
.product-card{
  display:flex; flex-direction:column; height:100%; overflow:hidden;
  background:#fff; border:1px solid var(--c-mist-2); border-radius:var(--r-lg);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.product-card:hover{ transform:translateY(-5px); box-shadow:var(--sh-3); border-color:var(--c-brand-200); }
.product-card__media{
  position:relative; aspect-ratio:4/3; overflow:hidden;
  background:linear-gradient(150deg,var(--c-graphite),var(--c-charcoal));
}
.product-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.product-card:hover .product-card__media img{ transform:scale(1.05); }
.product-card__media svg{ width:100%; height:100%; }
.product-card__flag{
  position:absolute; top:.9rem; left:.9rem; z-index:2;
  background:rgba(10,13,18,.72); color:#fff; backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.16);
  font-size:var(--fs-xs); font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  padding:.35rem .7rem; border-radius:var(--r-pill);
}
.product-card__body{ padding:clamp(1.25rem,2vw,1.6rem); display:flex; flex-direction:column; flex:1; }
.product-card__body h3{ font-size:1.22rem; margin-bottom:.5rem; }
.product-card__body h3 a{ color:inherit; }
.product-card__body h3 a:hover{ color:var(--c-brand); }
.product-card__body p{ color:var(--c-slate); font-size:.98rem; margin-bottom:var(--sp-4); }
.product-card__foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); }

.range-card{
  position:relative; border-radius:var(--r-lg); padding:clamp(1.5rem,2.6vw,2rem);
  background:var(--c-graphite); border:1px solid var(--c-line); color:var(--c-soft);
  display:flex; flex-direction:column; height:100%; overflow:hidden;
  transition:transform .3s var(--ease), border-color .3s var(--ease);
}
.range-card::before{
  content:""; position:absolute; inset:0 0 auto; height:3px;
  background:linear-gradient(90deg,var(--c-brand),var(--c-glow));
  transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease);
}
.range-card:hover{ transform:translateY(-4px); border-color:rgba(91,233,255,.3); }
.range-card:hover::before{ transform:scaleX(1); }
.range-card h3{ color:#fff; font-size:1.3rem; margin-bottom:.35rem; }
.range-card__meta{ font-size:var(--fs-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--c-glow); margin-bottom:var(--sp-4); font-weight:600; }
.range-card p{ color:#A9B8CB; font-size:.97rem; }
.range-card ul{ list-style:none; padding:0; margin:var(--sp-4) 0 0; display:grid; gap:.55rem; font-size:.9rem; }
.range-card ul li{ display:flex; gap:.5rem; color:#C9D5E4; }
.range-card ul li::before{ content:"+"; color:var(--c-brand-400); font-weight:700; }

.spec-table{ width:100%; border-collapse:collapse; font-size:var(--fs-base); }
.spec-table th,.spec-table td{ padding:.9rem 1rem; text-align:left; border-bottom:1px solid var(--c-mist-2); }
.spec-table th{ font-family:var(--f-head); font-weight:600; color:var(--c-ink); width:40%; background:var(--c-mist); }
.spec-table tr:last-child th,.spec-table tr:last-child td{ border-bottom:0; }

.detail-card{
  margin:0; background:#fff; border:1px solid var(--c-mist-2); border-radius:var(--r-lg);
  overflow:hidden; height:100%; display:flex; flex-direction:column;
  transition:transform .28s var(--ease), box-shadow .28s var(--ease);
}
.detail-card:hover{ transform:translateY(-4px); box-shadow:var(--sh-2); }
.detail-card img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.detail-card figcaption{ padding:1.25rem 1.4rem 1.5rem; }
.detail-card figcaption strong{
  display:block; font-family:var(--f-head); font-size:1.1rem; color:var(--c-ink); margin-bottom:.4rem;
}
.detail-card figcaption span{ font-size:.95rem; color:var(--c-slate); line-height:1.55; }

.photo-band{ border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sh-3); }
.photo-band img{ width:100%; display:block; aspect-ratio:16/9; object-fit:cover; }

.gallery-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:var(--sp-4); }
.gallery-grid figure{ border-radius:var(--r-md); overflow:hidden; background:var(--c-graphite); aspect-ratio:4/3; }
.gallery-grid img,.gallery-grid svg{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.gallery-grid figure:hover img{ transform:scale(1.06); }

/* ---------------------- 10. FORMS & QUOTE FLOW ---------------------- */
.form-grid{ display:grid; gap:var(--sp-4); grid-template-columns:1fr 1fr; }
.field{ display:flex; flex-direction:column; gap:.4rem; }
.field--full{ grid-column:1 / -1; }
.field label{ font-family:var(--f-head); font-size:var(--fs-sm); font-weight:600; color:inherit; }
.field .req{ color:var(--c-brand-400); }
.field input,.field select,.field textarea{
  width:100%; font-family:var(--f-body); font-size:var(--fs-base);
  padding:.85rem 1rem; border-radius:var(--r-sm);
  border:1.5px solid var(--c-mist-2); background:#fff; color:var(--c-ink);
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.field textarea{ min-height:120px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--c-brand); box-shadow:0 0 0 4px rgba(29,95,255,.14);
}
.field input::placeholder,.field textarea::placeholder{ color:#9BA8B9; }
.field select{ appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A98AB' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .9rem center; background-size:17px; padding-right:2.6rem;
}
.field--check{ flex-direction:row; align-items:flex-start; gap:.6rem; }
.field--check input{ width:auto; margin-top:.25rem; }
.field--check label{ font-weight:400; font-size:var(--fs-sm); }
.hp-field{ position:absolute!important; left:-9999px!important; opacity:0; height:0; width:0; }

.form-panel--dark .field label{ color:#DDE6F1; }
.form-panel--dark .field input,.form-panel--dark .field select,.form-panel--dark .field textarea{
  background-color:rgba(255,255,255,.06); border-color:rgba(255,255,255,.16); color:#fff;
}
.form-panel--dark .field input::placeholder,.form-panel--dark .field textarea::placeholder{ color:#7E8DA1; }
.form-panel--dark .field input:focus,.form-panel--dark .field select:focus,.form-panel--dark .field textarea:focus{
  border-color:var(--c-glow); box-shadow:0 0 0 4px rgba(91,233,255,.16); background-color:rgba(255,255,255,.09);
}
.form-panel--dark .field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C4D0DF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .9rem center; background-size:17px;
}
.form-panel--dark .field select option{ color:#0A0D12; }

.form-note{ font-size:var(--fs-xs); color:var(--c-muted); margin-top:var(--sp-3); }
.form-msg{ margin-top:var(--sp-4); padding:1rem 1.15rem; border-radius:var(--r-sm); font-size:var(--fs-sm); display:none; }
.form-msg.is-visible{ display:block; }
.form-msg.is-ok{ background:rgba(23,178,106,.12); border:1px solid rgba(23,178,106,.35); color:#0E8552; }
.form-msg.is-err{ background:rgba(240,68,56,.1); border:1px solid rgba(240,68,56,.32); color:#C0392B; }
.form-panel--dark .form-msg.is-ok{ color:#5FE3A6; }
.form-panel--dark .form-msg.is-err{ color:#FF8B80; }
.is-loading{ opacity:.65; pointer-events:none; }

.contact-tile{
  display:flex; gap:var(--sp-4); align-items:flex-start;
  padding:var(--sp-5); border:1px solid var(--c-mist-2); border-radius:var(--r-lg); background:#fff; height:100%;
}
.contact-tile .icon-badge{ margin-bottom:0; width:46px; height:46px; }
.contact-tile h4{ margin-bottom:.25rem; font-size:1.05rem; }
.contact-tile p,.contact-tile a{ font-size:var(--fs-base); color:var(--c-slate); margin:0; }
.contact-tile a:hover{ color:var(--c-brand); }

/* ----------------------------- 11. FOOTER ----------------------------- */
.site-footer{ background:var(--c-ink); color:#A9B8CB; padding-top:clamp(3rem,6vw,5rem); }
.site-footer h4{ color:#fff; font-size:1rem; letter-spacing:.02em; margin-bottom:var(--sp-4); }
.site-footer a{ color:#A9B8CB; }
.site-footer a:hover{ color:#fff; }
.footer-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.3fr; gap:var(--sp-6); padding-bottom:var(--sp-7); }
.footer-grid ul{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem; font-size:var(--fs-sm); }
.footer-brand .brand__name{ color:#fff; }
.footer-brand p{ font-size:var(--fs-sm); max-width:36ch; margin-top:var(--sp-4); }
.footer-contact li{ display:flex; gap:.6rem; align-items:flex-start; }
.footer-contact svg{ width:17px; height:17px; color:var(--c-brand-400); flex:none; margin-top:3px; }
.social{ display:flex; gap:.6rem; margin-top:var(--sp-5); }
.social a{
  width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); transition:all .2s var(--ease);
}
.social a:hover{ background:var(--c-brand); border-color:var(--c-brand); transform:translateY(-2px); }
.social svg{ width:17px; height:17px; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.08); padding-block:var(--sp-5);
  display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); flex-wrap:wrap;
  font-size:var(--fs-xs); color:#7E8DA1;
}
.footer-bottom ul{ list-style:none; display:flex; gap:var(--sp-5); margin:0; padding:0; }

.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:880; display:none;
  background:rgba(10,13,18,.94); backdrop-filter:blur(12px);
  border-top:1px solid rgba(255,255,255,.1); padding:.7rem 1rem;
}
.sticky-cta .inner{ display:flex; gap:.6rem; }
.sticky-cta .btn{ flex:1; padding:.9rem 1rem; font-size:.95rem; }

/* --------------------- 12. WP CORE / EDITOR STYLES --------------------- */
.entry-content{ max-width:var(--wrap-narrow); }
.entry-content h2{ margin-top:var(--sp-7); }
.entry-content h3{ margin-top:var(--sp-6); }
.entry-content ul,.entry-content ol{ margin-bottom:var(--sp-4); display:grid; gap:.5rem; }
.entry-content img{ border-radius:var(--r-md); }
.entry-content blockquote{
  margin:var(--sp-6) 0; padding:1.25rem 1.5rem; border-left:4px solid var(--c-brand);
  background:var(--c-mist); border-radius:0 var(--r-md) var(--r-md) 0; font-size:1.1rem;
}
.entry-content table{ width:100%; border-collapse:collapse; }
.entry-content th,.entry-content td{ padding:.75rem; border:1px solid var(--c-mist-2); }
.wp-caption{ max-width:100%; }
.wp-caption-text,.wp-block-image figcaption{ font-size:var(--fs-sm); color:var(--c-muted); text-align:center; margin-top:.5rem; }
.alignleft{ float:left; margin:.4rem 1.5rem 1rem 0; }
.alignright{ float:right; margin:.4rem 0 1rem 1.5rem; }
.aligncenter{ display:block; margin-inline:auto; }
.alignwide{ max-width:1100px; margin-inline:auto; }
.alignfull{ max-width:100%; }
.sticky,.gallery-caption,.bypostauthor{ display:block; }
.post-card{ background:#fff; border:1px solid var(--c-mist-2); border-radius:var(--r-lg); overflow:hidden; height:100%; display:flex; flex-direction:column; transition:transform .28s var(--ease),box-shadow .28s var(--ease); }
.post-card:hover{ transform:translateY(-4px); box-shadow:var(--sh-2); }
.post-card__media{ aspect-ratio:16/10; background:var(--c-graphite); overflow:hidden; }
.post-card__media img{ width:100%; height:100%; object-fit:cover; }
.post-card__body{ padding:var(--sp-5); display:flex; flex-direction:column; flex:1; }
.post-card__meta{ font-size:var(--fs-xs); color:var(--c-muted); text-transform:uppercase; letter-spacing:.1em; margin-bottom:.5rem; }
.pagination{ display:flex; gap:.4rem; justify-content:center; margin-top:var(--sp-7); flex-wrap:wrap; }
.pagination .page-numbers{
  display:flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 .75rem;
  border-radius:var(--r-sm); border:1px solid var(--c-mist-2); color:var(--c-charcoal); font-weight:600;
}
.pagination .page-numbers.current,.pagination .page-numbers:hover{ background:var(--c-brand); border-color:var(--c-brand); color:#fff; }
.widget{ margin-bottom:var(--sp-6); }
.widget ul{ list-style:none; padding:0; display:grid; gap:.5rem; }

/* --------------------- 13. UTILITIES & MOTION --------------------- */
.t-center{ text-align:center; }
.mb-0{ margin-bottom:0; }
.mt-5{ margin-top:var(--sp-5); }
.mt-6{ margin-top:var(--sp-6); }
.mt-7{ margin-top:var(--sp-7); }
.maxw-60{ max-width:60ch; }
.rel{ position:relative; }

[data-anim]{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
[data-anim].is-in{ opacity:1; transform:none; }
[data-anim][data-delay="1"]{ transition-delay:.08s; }
[data-anim][data-delay="2"]{ transition-delay:.16s; }
[data-anim][data-delay="3"]{ transition-delay:.24s; }
[data-anim][data-delay="4"]{ transition-delay:.32s; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
  [data-anim]{ opacity:1; transform:none; }
}

/* ---------------------------- 14. RESPONSIVE ---------------------------- */
@media (max-width:1080px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .g-4{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:960px){
  :root{ --header-h:72px; }
  .nav-toggle{ display:flex; }
  .header-cta .btn{ display:none; }
  /*
   * The mobile menu is anchored to the sticky header with position:absolute,
   * NOT position:fixed — the header's backdrop-filter creates a containing
   * block that traps fixed children inside it (menu renders 0px tall).
   */
  .nav{
    position:absolute; top:100%; left:0; right:0; margin:0; padding:1.25rem;
    height:calc(100vh - var(--header-h));
    height:calc(100dvh - var(--header-h));
    background:#fff; overflow-y:auto; z-index:899;
    -webkit-overflow-scrolling:touch;
    box-shadow:0 24px 40px rgba(10,13,18,.18);
    opacity:0; visibility:hidden; transform:translateY(-10px);
    transition:opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
  }
  body.nav-open .nav{ opacity:1; visibility:visible; transform:none; }
  body.nav-open .site-header{
    background:#fff;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  body.nav-open{ overflow:hidden; }
  .nav ul{ flex-direction:column; align-items:stretch; gap:0; }
  .nav a{ padding:.95rem .5rem; font-size:1.05rem; border-bottom:1px solid var(--c-mist-2); border-radius:0; }
  .nav .sub-menu{
    position:static; opacity:1; visibility:visible; transform:none; box-shadow:none;
    border:0; border-left:2px solid var(--c-brand-050); border-radius:0; padding:0 0 0 .85rem; margin-bottom:.25rem;
    display:none;
  }
  .nav li.is-open>.sub-menu{ display:block; }
  .nav .menu-item-has-children>a::after{ margin-left:auto; }
  .hero__bg{ background-position:70% center; }
  .hero__bg::after{ background:linear-gradient(180deg, rgba(8,11,16,.92) 0%, rgba(8,11,16,.95) 45%, rgba(8,11,16,.97) 100%); }
  .hero__grid,.feature-split{ grid-template-columns:1fr; }
  .feature-split--rev .feature-split__media{ order:0; }
  .trust-strip .wrap{ grid-template-columns:repeat(2,1fr); }
  .g-3{ grid-template-columns:repeat(2,1fr); }
  .sticky-cta{ display:block; }
  .site-footer{ padding-bottom:70px; }
  .topbar__links{ display:none; }
}
@media (max-width:640px){
  .g-2,.g-3,.g-4{ grid-template-columns:1fr; }
  .form-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; gap:var(--sp-5); }
  .cta-band .wrap-inner{ flex-direction:column; align-items:flex-start; }
  .hero__actions .btn{ width:100%; }
  .brand__tag{ display:none; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .header-phone span{ display:none; }
  .header-phone{ width:44px; height:44px; justify-content:center; border:1px solid var(--c-mist-2); border-radius:var(--r-sm); }
  .topbar__marquee{ font-size:.78rem; }
}
@media (max-width:400px){
  .brand__name{ font-size:1.12rem; }
}