:root{
  --bg:#0b1118;
  --bg-soft:#101926;
  --card:#121d2b;
  --card-2:#0f1824;
  --text:#edf3fb;
  --muted:#9ba9bd;
  --line:#1f3045;
  --line-soft:#182637;
  --brand:#e94057;
  --brand-2:#ff7a59;
  --ok:#21c58e;
  --shadow:0 18px 44px rgba(0,0,0,.35);
  --radius:22px;
  --grid:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;min-height:100%}
body{
  background:
    radial-gradient(1100px 500px at 100% -10%, rgba(233,64,87,.15), transparent 50%),
    radial-gradient(700px 320px at -5% 0%, rgba(255,122,89,.08), transparent 50%),
    linear-gradient(180deg,#09111a 0%, #0b1118 100%);
  color:var(--text);
  font:400 16px/1.6 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  letter-spacing:.01em;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.container{width:min(100%,var(--grid));margin:0 auto;padding:0 20px}
.card-surface{
  background:linear-gradient(180deg, rgba(18,29,43,.96), rgba(12,20,30,.96));
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.section{padding:88px 0}
.section-hint,.eyebrow{
  display:inline-block;
  margin-bottom:12px;
  color:#89a1c0;
  font-size:12px;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.section-head{
  max-width:760px;
  margin-bottom:28px;
}
.section-head h2,
.hero-copy h1,
.contact-card h2,
.final-cta h2{
  margin:0 0 12px;
  line-height:1.08;
  letter-spacing:-.03em;
}
.hero-copy h1{font-size:clamp(2.3rem,4vw,4.4rem)}
.section-head h2,
.contact-card h2,
.final-cta h2{font-size:clamp(1.9rem,2.8vw,3.1rem)}
.section-head p,
.hero-subtitle,
.contact-card > p,
.final-cta p,
.section-note{margin:0;color:var(--muted)}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  min-height:48px;
  padding:12px 20px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn--primary{
  color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  box-shadow:0 12px 30px rgba(233,64,87,.25);
}
.btn--ghost{
  color:var(--text);
  border-color:#284058;
  background:rgba(16,25,38,.55);
}
.btn--ghost:hover{background:#122032;border-color:#355474}
.btn--small{min-height:40px;padding:10px 16px;font-size:.95rem}

.site-header{
  position:sticky;
  top:0;
  z-index:80;
  backdrop-filter:blur(14px) saturate(150%);
  background:rgba(9,15,24,.72);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.header-wrap{
  display:flex;
  align-items:center;
  gap:18px;
  justify-content:space-between;
  min-height:78px;
}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand-logo{height:80px;width:auto}
.site-nav{display:flex;align-items:center;gap:22px}
.site-nav a{
  color:var(--muted);
  font-weight:600;
  position:relative;
}
.site-nav a:hover,
.site-nav a.is-active{color:var(--text)}
.header-actions{display:flex;align-items:center;gap:14px}
.lang-switch{display:flex;align-items:center;gap:8px}
.lang-link{
  padding:7px 10px;
  border-radius:999px;
  border:1px solid transparent;
  color:var(--muted);
  font-size:.92rem;
  font-weight:700;
}
.lang-link:hover,.lang-link.is-active{color:var(--text);border-color:#2a3d55;background:#101926}
.menu-toggle{
  display:none;
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid #24384f;
  background:#101926;
  padding:10px;
}
.menu-toggle span{display:block;height:2px;background:#fff;border-radius:999px;margin:5px 0}

.hero{position:relative;padding:90px 0 62px}
.hero-bg{
  position:absolute;inset:0;
  background:radial-gradient(800px 300px at 80% 0%, rgba(255,255,255,.06), transparent 60%);
  pointer-events:none;
}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:26px;align-items:center}
.hero-copy{padding-right:10px}
.hero-subtitle{max-width:60ch;font-size:1.06rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 22px}
.proof-bar{display:flex;flex-wrap:wrap;gap:10px}
.proof-bar span,
.trust-chip{
  display:inline-flex;align-items:center;min-height:38px;padding:8px 14px;border-radius:999px;
  background:rgba(15,24,36,.88);border:1px solid var(--line);
  color:#c7d3e5;font-size:.95rem;font-weight:600;
}
.hero-media{display:grid;gap:16px}
.hero-main{overflow:hidden}
.hero-main img{width:100%;aspect-ratio:4/3;object-fit:cover}
.hero-stack{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hero-mini{display:grid;grid-template-columns:110px 1fr;gap:14px;padding:14px;align-items:center}
.hero-mini img{width:110px;height:110px;border-radius:16px;object-fit:cover}
.hero-mini h2{margin:0 0 6px;font-size:1.1rem}
.hero-mini p{margin:0;color:var(--muted);font-size:.95rem}

.trust-strip{padding:0 0 12px}
.trust-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.trust-chip{justify-content:center;text-align:center;padding:16px;border-radius:16px;min-height:72px}

.services-grid,
.why-grid,
.quotes-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.service-card{overflow:hidden}
.service-card__media img{width:100%;aspect-ratio:16/10;object-fit:cover}
.service-card__body{padding:20px}
.service-card__body h3,.why-card h3,.quote-card h3,.step-card h3,.plan h3{margin:0 0 10px}
.service-card__body p,.why-card p,.quote-card p,.step-card p,.plan p{margin:0;color:var(--muted)}
.tick-list,.check-list{margin:16px 0 18px;padding:0;list-style:none;display:grid;gap:10px}
.tick-list li,.check-list li{position:relative;padding-left:24px;color:#dbe4f2}
.tick-list li::before,.check-list li::before{content:'✓';position:absolute;left:0;top:0;color:var(--ok);font-weight:800}
.why-card,.quote-card,.step-card,.plan,.compare-card,.contact-card,.form-card,.final-cta{padding:22px}

.compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.compare-card{overflow:hidden}
.compare{position:relative;border-radius:18px;overflow:hidden;background:#09111a;aspect-ratio:4/3}
.compare > img,.compare__after img{width:100%;height:100%;object-fit:cover}
.compare__after{position:absolute;inset:0;overflow:hidden}
.compare__label{
  position:absolute;top:14px;z-index:2;padding:6px 10px;border-radius:999px;
  background:rgba(9,15,24,.72);border:1px solid rgba(255,255,255,.12);font-size:.8rem;font-weight:700
}
.compare__label--before{left:14px}
.compare__label--after{right:14px}
.compare input[type=range]{position:absolute;left:14px;right:14px;bottom:14px;width:calc(100% - 28px);z-index:3}
.compare-card__caption{padding-top:14px;font-weight:700}

.plans-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column}
.plan--featured{border-color:#7b3a3a;box-shadow:0 18px 44px rgba(233,64,87,.18)}
.plan-tag{
  position:absolute;top:18px;right:18px;padding:6px 10px;border-radius:999px;
  background:rgba(233,64,87,.14);color:#ffd4d8;border:1px solid rgba(233,64,87,.28);font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em
}
.plan__eyebrow{margin-bottom:8px;color:#ffb1bb;font-size:.82rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.plan__price{font-size:1.35rem;font-weight:900;margin-bottom:6px}
.plan__meta{color:#b9c7da;font-weight:700;margin-bottom:12px}
.plan .btn{margin-top:auto}
.section-note{margin-top:16px}

.tabs{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.tab-btn,.filter-btn{
  min-height:42px;padding:10px 16px;border-radius:999px;border:1px solid #273a52;
  background:#101926;color:#c5d2e4;font-weight:700;transition:all .18s ease
}
.tab-btn:hover,.filter-btn:hover,.tab-btn.is-active,.filter-btn.is-active{
  background:linear-gradient(135deg, rgba(233,64,87,.18), rgba(255,122,89,.16));
  border-color:#6f4350;color:#fff
}
.tab-panel{display:none;gap:12px}
.tab-panel.is-active{display:grid}
.extra-row{
  display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 20px;
  background:rgba(14,22,33,.88);border:1px solid var(--line-soft);border-radius:18px
}
.extra-row h4{margin:0 0 6px;font-size:1.05rem}
.extra-row__price{color:var(--muted);font-weight:600}

.portfolio-filters{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}
.portfolio-groups{display:grid;gap:32px}
.portfolio-group{display:grid;gap:14px}
.portfolio-group__header{display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.portfolio-group__header h3{margin:0;font-size:1.3rem}
.portfolio-group__header p{margin:0;color:var(--muted)}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.portfolio-card{min-width:0}
.portfolio-card button{
  width:100%;padding:0;background:rgba(14,22,33,.9);border:1px solid var(--line-soft);border-radius:18px;overflow:hidden;
  color:inherit;text-align:left
}
.portfolio-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.portfolio-card span{display:block;padding:14px 16px;font-weight:700}
.portfolio-group[hidden]{display:none !important}

.stars{margin-bottom:12px;color:#ffb77a;font-weight:900;letter-spacing:.35em}
.steps-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.step-card__num{
  display:inline-grid;place-items:center;width:42px;height:42px;margin-bottom:14px;border-radius:50%;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));font-weight:900
}

.faq-list{display:grid;gap:12px}
.faq-item{background:rgba(14,22,33,.88);border:1px solid var(--line-soft);border-radius:18px;overflow:hidden}
.faq-item summary{list-style:none;padding:18px 20px;font-weight:700;cursor:pointer;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:1.3rem;color:#cbd8eb}
.faq-item[open] summary::after{content:'–'}
.faq-item__body{padding:0 20px 18px;color:var(--muted)}
.faq-item__body p{margin:0}

.final-cta{display:grid;grid-template-columns:1.2fr auto;gap:20px;align-items:center}
.final-cta__actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}

.contact-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:18px}
.contact-list{display:grid;gap:14px;margin:20px 0 22px}
.contact-list div{display:grid;gap:4px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.06)}
.contact-list strong{font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;color:#a8b8ce}
.contact-list span,.contact-list a{color:#e7eef8}
.contact-actions,.form-actions{display:flex;flex-wrap:wrap;gap:12px}
.lead-form{display:grid;gap:14px}
.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.field{display:grid;gap:7px}
.field > span{font-size:.93rem;color:#c9d5e7;font-weight:600}
.field input,
.field textarea{
  width:100%;padding:13px 14px;border-radius:14px;border:1px solid #24384f;background:#0c1622;color:var(--text);outline:none
}
.field input:focus,
.field textarea:focus{border-color:#4a6a8d;box-shadow:0 0 0 3px rgba(74,106,141,.16)}
.checkbox{display:flex;align-items:flex-start;gap:10px;color:var(--muted);font-size:.92rem}
.checkbox input{margin-top:4px;accent-color:var(--brand)}
.form-message{min-height:1.4em;color:#9edeb5;font-weight:600}
.form-message.is-error{color:#ff9d9d}
.map-frame{margin-top:20px;overflow:hidden;border-radius:18px;border:1px solid var(--line-soft)}
.map-frame iframe{display:block;width:100%;height:300px;border:0}

.site-footer{padding:40px 0 24px;border-top:1px solid rgba(255,255,255,.06)}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr 1fr .8fr;gap:18px}
.footer-logo{height:80px;width:auto;margin-bottom:12px}
.site-footer p{margin:0;color:var(--muted)}
.site-footer h3{margin:0 0 10px;font-size:1rem}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.site-footer li,.site-footer a{color:#dce6f4}
.footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:20px;margin-top:24px;border-top:1px solid rgba(255,255,255,.06);color:var(--muted)}

.wa-float{
  position:fixed;right:18px;bottom:18px;z-index:70;display:grid;place-items:center;
  width:60px;height:60px;border-radius:50%;background:#16c35b;color:#fff;
  box-shadow:0 18px 36px rgba(0,0,0,.32), 0 0 0 8px rgba(22,195,91,.12)
}
.wa-float svg{width:30px;height:30px}

.lightbox{padding:0;border:0;border-radius:22px;max-width:min(92vw,1080px);width:100%;background:#0b1118;color:#fff;overflow:hidden}
.lightbox::backdrop{background:rgba(4,8,14,.78)}
.lightbox figure{margin:0}
.lightbox img{width:100%;max-height:76vh;object-fit:contain;background:#060a0f}
.lightbox figcaption{padding:14px 18px;color:#d7e2f1}
.lightbox__close{
  position:absolute;top:12px;right:12px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.16);
  background:rgba(11,17,24,.72);color:#fff;font-size:1.4rem;z-index:2
}

@media (max-width: 1100px){
  .hero-grid,.contact-grid,.final-cta{grid-template-columns:1fr}
  .final-cta__actions{justify-content:flex-start}
  .trust-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .steps-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 900px){
  .services-grid,.why-grid,.quotes-grid,.plans-grid,.compare-grid,.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-stack{grid-template-columns:1fr}
  .site-nav{
    position:fixed;left:16px;right:16px;top:86px;display:none;flex-direction:column;align-items:flex-start;padding:18px;border-radius:20px;
    background:rgba(10,16,24,.96);border:1px solid var(--line);box-shadow:var(--shadow)
  }
  body.menu-open .site-nav{display:flex}
  .menu-toggle{display:inline-block}
}
@media (max-width: 680px){
  .section{padding:72px 0}
  .header-wrap{min-height:72px}
  .header-actions .btn{display:none}
  .trust-grid,.services-grid,.why-grid,.quotes-grid,.plans-grid,.compare-grid,.portfolio-grid,.field-grid,.footer-grid,.steps-grid{grid-template-columns:1fr}
  .hero{padding-top:74px}
  .hero-mini{grid-template-columns:90px 1fr}
  .hero-mini img{width:90px;height:90px}
  .extra-row{flex-direction:column;align-items:flex-start}
  .wa-float{right:14px;bottom:14px;width:56px;height:56px}
}

.price-tax-note{margin:-2px 0 10px;color:#9fb0c6;font-size:.9rem;font-weight:700}
.price-tax-note--inline{display:block;margin:4px 0 0;font-size:.82rem;color:#9fb0c6}
.mobile-detailing-grid{margin-bottom:18px}
.mobile-detailing-cta{margin-top:18px}
.mobile-detailing-cta .section-hint{margin-bottom:10px}
@media (max-width: 640px){.price-tax-note{font-size:.86rem}.price-tax-note--inline{font-size:.8rem}.mobile-detailing-cta{margin-top:14px}}

.plan--custom{grid-column:1/-1;overflow:hidden;background:linear-gradient(135deg,rgba(18,29,43,.98),rgba(14,24,37,.98) 55%,rgba(233,64,87,.10));border-color:rgba(233,64,87,.28)}
.plan--custom::after{content:"";position:absolute;right:-90px;top:-90px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(233,64,87,.18),transparent 68%);pointer-events:none}
.plan__price--quote{color:#ffd4d8}
.custom-package-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px;margin-top:18px}
.plan--custom .btn{align-self:flex-start;margin-top:6px}
@media (max-width: 760px){.custom-package-list{grid-template-columns:1fr}.plan--custom .btn{width:100%}}

.mobile-photo-gallery{margin:22px 0 4px}.mobile-photo-gallery .portfolio-group__header{margin-bottom:14px}.mobile-photo-grid .portfolio-card img{aspect-ratio:3/4;object-position:center}@media (max-width: 640px){.mobile-photo-gallery{margin:18px 0 2px}}

/* =========================================================
   2026 — Futuristic Glass / Continuous Three.js World
   The HTML remains semantic; WebGL is a fixed visual layer.
   ========================================================= */
:root{
  --bg:#eaf0f3;
  --bg-soft:rgba(244,248,249,.56);
  --card:rgba(255,255,255,.52);
  --card-2:rgba(239,246,248,.58);
  --text:#101820;
  --muted:#526171;
  --line:rgba(22,43,58,.16);
  --line-soft:rgba(31,57,72,.12);
  --brand:#d51932;
  --brand-2:#f35e4e;
  --ok:#168967;
  --shadow:0 22px 70px rgba(38,58,70,.14), inset 0 1px 0 rgba(255,255,255,.72);
  --glass:rgba(255,255,255,.38);
  --glass-strong:rgba(255,255,255,.56);
  --glass-border:rgba(255,255,255,.68);
  --radius:26px;
}

html{background:#eaf0f3}
body{
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(900px 520px at 84% 7%, rgba(213,25,50,.11), transparent 62%),
    radial-gradient(760px 520px at 12% 34%, rgba(124,184,197,.20), transparent 66%),
    linear-gradient(180deg,#f2f6f7 0%,#e5edef 48%,#f3f6f7 100%);
  color:var(--text);
  text-rendering:optimizeLegibility;
}
body > :not(.site-3d-world):not(noscript){position:relative;z-index:2}

.site-3d-world{
  position:fixed;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  overflow:hidden;
  pointer-events:none;
  background:
    radial-gradient(circle at 82% 18%, rgba(213,25,50,.16) 0 1.5%, transparent 1.8% 100%),
    radial-gradient(ellipse at 82% 18%, transparent 0 10%, rgba(27,37,45,.07) 10.5% 11%, transparent 11.5% 18%, rgba(255,255,255,.38) 18.5% 19%, transparent 19.5%),
    radial-gradient(ellipse at 13% 68%, transparent 0 8%, rgba(27,37,45,.055) 8.5% 9%, transparent 9.5% 16%, rgba(213,25,50,.07) 16.5% 17%, transparent 17.5%),
    linear-gradient(115deg,rgba(255,255,255,.82),rgba(226,237,240,.66) 46%,rgba(247,249,249,.86));
}
.site-3d-world::before{
  content:"";
  position:absolute;
  inset:-12% -8%;
  background:
    repeating-linear-gradient(90deg,transparent 0 11.8vw,rgba(70,101,113,.06) 11.9vw 12vw),
    linear-gradient(100deg,transparent 15%,rgba(213,25,50,.055) 15.3% 15.55%,transparent 15.8% 73%,rgba(80,121,136,.055) 73.2% 73.45%,transparent 73.7%);
  transform:perspective(900px) rotateX(64deg) translateY(45%);
  transform-origin:center bottom;
  opacity:.72;
}
#site-3d-canvas{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  opacity:0;
  transition:opacity 1.1s ease;
}
.webgl-active #site-3d-canvas{opacity:.96}
.site-3d-world__haze{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(246,250,250,.13),rgba(232,240,242,.03) 50%,rgba(244,248,249,.12)),
    radial-gradient(closest-side at 50% 48%,transparent 58%,rgba(231,239,241,.20));
  mix-blend-mode:screen;
}

.site-header{
  position:sticky;
  top:0;
  z-index:80;
  background:rgba(244,248,249,.62);
  border-bottom:1px solid rgba(255,255,255,.74);
  box-shadow:0 8px 32px rgba(38,59,70,.08);
  backdrop-filter:blur(22px) saturate(145%);
  -webkit-backdrop-filter:blur(22px) saturate(145%);
}
.header-wrap{min-height:82px}
.brand-logo{height:74px;filter:drop-shadow(0 6px 14px rgba(31,39,44,.12))}
.site-nav a{color:#53616b}
.site-nav a:hover,.site-nav a.is-active{color:#101820}
.site-nav a.is-active::after{
  content:"";position:absolute;left:0;right:0;bottom:-10px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--brand),var(--brand-2));
}
.lang-link{color:#5a6873}
.lang-link:hover,.lang-link.is-active{color:#101820;border-color:rgba(45,67,80,.16);background:rgba(255,255,255,.52)}
.menu-toggle{border-color:rgba(36,56,70,.18);background:rgba(255,255,255,.5);backdrop-filter:blur(14px)}
.menu-toggle span{background:#17222a}

.card-surface{
  background:linear-gradient(145deg,rgba(255,255,255,.60),rgba(237,245,247,.38));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:var(--shadow);
  backdrop-filter:blur(18px) saturate(132%);
  -webkit-backdrop-filter:blur(18px) saturate(132%);
}

.hero{min-height:min(780px,calc(100vh - 50px));display:flex;align-items:center;padding:96px 0 82px}
.hero-bg{
  background:
    radial-gradient(600px 360px at 86% 22%,rgba(213,25,50,.09),transparent 66%),
    linear-gradient(90deg,rgba(246,250,250,.32),transparent 54%);
}
.hero-grid{gap:42px}
.hero-copy{padding:30px 18px 30px 0}
.hero-copy h1{
  max-width:13ch;
  font-size:clamp(2.75rem,5.3vw,5.65rem);
  color:#101820;
  letter-spacing:-.055em;
  text-wrap:balance;
  text-shadow:0 1px 0 rgba(255,255,255,.75),0 16px 44px rgba(60,79,90,.10);
}
.hero-subtitle{max-width:57ch;font-size:clamp(1rem,1.3vw,1.18rem);color:#4d5c68}
.eyebrow,.section-hint{color:#8a2230;font-weight:800}
.proof-bar span,.trust-chip{
  background:rgba(250,253,253,.47);
  border-color:rgba(255,255,255,.65);
  color:#384752;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 12px 30px rgba(43,66,78,.07);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.hero-main{transform:perspective(1200px) rotateY(-2.2deg);box-shadow:0 34px 90px rgba(32,51,63,.18)}
.hero-main img{aspect-ratio:1.12/1;filter:saturate(.92) contrast(1.02)}
.hero-mini{background:rgba(248,251,252,.48)}
.hero-mini h2{color:#17222a}
.hero-mini p{color:#53626e}

.btn{transition:transform .28s ease,box-shadow .28s ease,background .28s ease,border-color .28s ease,color .28s ease}
.btn:hover{transform:translateY(-2px)}
.btn--primary{
  color:#fff;
  background:linear-gradient(135deg,#c9142c,#ef5a4b);
  border-color:rgba(255,255,255,.28);
  box-shadow:0 14px 34px rgba(200,20,43,.24),inset 0 1px 0 rgba(255,255,255,.28);
}
.btn--primary:hover{box-shadow:0 18px 42px rgba(200,20,43,.30),inset 0 1px 0 rgba(255,255,255,.32)}
.btn--ghost{
  color:#17222a;
  border-color:rgba(30,53,68,.16);
  background:rgba(255,255,255,.43);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  backdrop-filter:blur(13px);
}
.btn--ghost:hover{color:#101820;background:rgba(255,255,255,.68);border-color:rgba(30,53,68,.22)}

.section{position:relative;padding:100px 0}
.section::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:22px clamp(12px,2.7vw,42px);
  border:1px solid rgba(255,255,255,.64);
  border-radius:clamp(30px,4vw,58px);
  background:linear-gradient(145deg,rgba(255,255,255,.36),rgba(233,242,244,.24));
  box-shadow:0 30px 90px rgba(45,69,82,.075),inset 0 1px 0 rgba(255,255,255,.70);
  backdrop-filter:blur(13px) saturate(126%);
  -webkit-backdrop-filter:blur(13px) saturate(126%);
}
.section:nth-of-type(3n)::before{background:linear-gradient(145deg,rgba(250,253,253,.23),rgba(228,239,242,.16));backdrop-filter:blur(9px) saturate(125%);-webkit-backdrop-filter:blur(9px) saturate(125%)}
.section:nth-of-type(4n)::before{inset:34px clamp(18px,4vw,64px);background:linear-gradient(145deg,rgba(255,255,255,.44),rgba(239,246,247,.26))}
.section > .container,.section.container{position:relative;z-index:1}
.section-head{max-width:810px;margin-bottom:34px}
.section-head h2,.contact-card h2,.final-cta h2{color:#101820;font-size:clamp(2rem,3.2vw,3.55rem);letter-spacing:-.045em;text-wrap:balance}
.section-head p,.contact-card > p,.final-cta p,.section-note{color:#53616d}

.services-grid,.why-grid,.quotes-grid,.plans-grid,.compare-grid,.portfolio-grid,.steps-grid{gap:20px}
.service-card,.why-card,.quote-card,.step-card,.plan,.compare-card,.contact-card,.form-card,.final-cta{
  background:linear-gradient(145deg,rgba(255,255,255,.56),rgba(238,246,248,.38));
  border-color:rgba(255,255,255,.70);
  box-shadow:0 20px 55px rgba(48,69,80,.10),inset 0 1px 0 rgba(255,255,255,.70);
}
.service-card,.portfolio-card button,.compare-card,.hero-main,.hero-mini{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s ease,border-color .45s ease}
.service-card:hover,.portfolio-card button:hover{transform:translateY(-4px);box-shadow:0 28px 70px rgba(43,64,75,.14);border-color:rgba(255,255,255,.92)}
.service-card__media img{filter:saturate(.92) contrast(1.02)}
.service-card__body h3,.why-card h3,.quote-card h3,.step-card h3,.plan h3{color:#17222a}
.service-card__body p,.why-card p,.quote-card p,.step-card p,.plan p{color:#566570}
.tick-list li,.check-list li{color:#293842}
.tick-list li::before,.check-list li::before{color:#188561}

.plan--featured{border-color:rgba(213,25,50,.30);box-shadow:0 22px 64px rgba(192,34,52,.14),inset 0 1px 0 rgba(255,255,255,.78)}
.plan-tag{background:rgba(213,25,50,.10);color:#9f1023;border-color:rgba(213,25,50,.20)}
.plan__eyebrow{color:#a21325}
.plan__meta,.plan__price--quote{color:#4f5e69}
.plan--custom{background:linear-gradient(135deg,rgba(255,255,255,.68),rgba(236,244,246,.48) 58%,rgba(213,25,50,.07));border-color:rgba(213,25,50,.20)}
.plan--custom::after{background:radial-gradient(circle,rgba(213,25,50,.12),transparent 68%)}

.tab-btn,.filter-btn{
  border-color:rgba(38,62,76,.14);
  background:rgba(255,255,255,.42);
  color:#485864;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
  backdrop-filter:blur(12px);
}
.tab-btn:hover,.filter-btn:hover,.tab-btn.is-active,.filter-btn.is-active{background:linear-gradient(135deg,rgba(213,25,50,.11),rgba(255,122,89,.10));border-color:rgba(190,37,54,.28);color:#8e1322}
.extra-row,.faq-item{
  background:rgba(248,252,252,.48);
  border-color:rgba(255,255,255,.68);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68),0 12px 34px rgba(42,63,75,.055);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.extra-row__price,.faq-item__body{color:#566570}

.portfolio-card button{background:rgba(255,255,255,.48);border-color:rgba(255,255,255,.72);color:#17222a;box-shadow:0 16px 44px rgba(45,65,76,.09)}
.stars{color:#ca5d25}
.step-card__num{color:#fff;box-shadow:0 10px 24px rgba(200,20,43,.18)}
.faq-item summary::after{color:#6b2330}

.compare{background:#dfe7ea}
.compare__label{background:rgba(20,30,38,.72);border-color:rgba(255,255,255,.26);color:#fff;backdrop-filter:blur(10px)}

.contact-list div{border-bottom-color:rgba(25,48,61,.10)}
.contact-list strong{color:#65727d}
.contact-list span,.contact-list a{color:#17232b}
.field > span{color:#364650}
.field input,.field textarea{
  border-color:rgba(36,56,79,.14);
  background:rgba(255,255,255,.50);
  color:#17222a;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter:blur(10px);
}
.field input::placeholder,.field textarea::placeholder{color:#7a8790}
.field input:focus,.field textarea:focus{border-color:rgba(180,34,52,.48);box-shadow:0 0 0 3px rgba(213,25,50,.09)}
.checkbox{color:#5c6a74}
.form-message{color:#187654}.form-message.is-error{color:#a8172a}
.map-frame{border-color:rgba(255,255,255,.72);box-shadow:0 18px 50px rgba(43,64,76,.11)}

.site-footer{
  margin-top:26px;
  padding:54px 0 28px;
  border-top:1px solid rgba(255,255,255,.72);
  background:linear-gradient(180deg,rgba(242,247,248,.42),rgba(235,242,244,.68));
  backdrop-filter:blur(20px) saturate(130%);
  -webkit-backdrop-filter:blur(20px) saturate(130%);
  box-shadow:0 -18px 60px rgba(42,64,75,.06);
}
.site-footer p{color:#5c6974}
.site-footer h3{color:#17222a}
.site-footer li,.site-footer a{color:#31414c}
.footer-bottom{border-top-color:rgba(34,57,70,.10);color:#6a7680}
.footer-logo{filter:drop-shadow(0 7px 16px rgba(26,36,43,.12))}

.lightbox{background:#111820;color:#fff;box-shadow:0 32px 90px rgba(0,0,0,.35)}
.lightbox figcaption{color:#e8eef3}
.wa-float{box-shadow:0 18px 42px rgba(23,68,45,.22),0 0 0 7px rgba(22,195,91,.10)}

/* Legal pages keep the same spatial world with calmer, more opaque reading glass. */
.legal-wrap{
  max-width:980px;
  padding:clamp(28px,5vw,64px);
  border-radius:36px;
  border:1px solid rgba(255,255,255,.76);
  background:rgba(250,253,253,.58);
  box-shadow:0 28px 80px rgba(45,67,78,.10),inset 0 1px 0 rgba(255,255,255,.8);
  backdrop-filter:blur(20px) saturate(125%);
  -webkit-backdrop-filter:blur(20px) saturate(125%);
}
.legal-wrap .section-head h1{margin:0;font-size:clamp(2.3rem,4vw,4.25rem);line-height:1.02;letter-spacing:-.05em;color:#101820}
.legal-block{padding:22px 0;border-top:1px solid rgba(35,57,69,.10)}
.legal-block h2{margin:0 0 8px;color:#17222a;font-size:1.22rem}
.legal-block p{margin:0;color:#4f5e68}
main.section > .legal-wrap{position:relative;z-index:1}

/* Native reveal choreography remains independent from WebGL/CDN. */
.reveal-ready{opacity:0;transform:translateY(22px);filter:blur(5px);transition:opacity .8s cubic-bezier(.2,.72,.2,1),transform .8s cubic-bezier(.2,.72,.2,1),filter .8s ease}
.reveal-ready.is-revealed{opacity:1;transform:none;filter:none}

@media (max-width: 1100px){
  .hero{min-height:auto}
  .hero-copy h1{max-width:16ch}
  .hero-main{transform:none}
}
@media (max-width: 900px){
  .site-nav{background:rgba(246,250,250,.88);border-color:rgba(255,255,255,.8);box-shadow:0 24px 60px rgba(37,57,68,.14);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
  .site-nav a.is-active::after{bottom:-4px}
}
@media (max-width: 680px){
  .header-wrap{min-height:70px}
  .brand-logo{height:64px}
  .hero{padding:64px 0 58px}
  .hero-grid{gap:24px}
  .hero-copy{padding:16px 0}
  .hero-copy h1{font-size:clamp(2.55rem,12vw,4.1rem);max-width:13ch}
  .hero-subtitle{font-size:1rem}
  .section{padding:74px 0}
  .section::before{inset:12px 8px;border-radius:28px;background:rgba(248,252,252,.43);backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px)}
  .section:nth-of-type(4n)::before{inset:15px 8px}
  .card-surface{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
  .site-3d-world::before{opacity:.44}
  .webgl-active #site-3d-canvas{opacity:.88}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal-ready{opacity:1!important;transform:none!important;filter:none!important}
  .service-card:hover,.portfolio-card button:hover,.btn:hover{transform:none}
  #site-3d-canvas{transition:none}
}

@supports not ((backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px))){
  .card-surface,.section::before,.site-header,.site-footer,.legal-wrap,.extra-row,.faq-item,.tab-btn,.filter-btn,.btn--ghost{background:rgba(247,250,251,.90)}
}

/* Keep fixed/sticky interactive UI above the scroll content stacking context. */
body > .site-header{z-index:80}
body > .wa-float{z-index:70}


/* =========================================================
   2026-08-11 — Darker Premium Glass refinement
   Keeps the same architecture, but moves the overall art direction
   from pearl glass to a darker luxury technical lounge.
   ========================================================= */
:root{
  --bg:#071018;
  --bg-soft:rgba(10,18,29,.66);
  --card:rgba(9,16,24,.52);
  --card-2:rgba(12,21,32,.56);
  --text:#eef4fb;
  --muted:#a3b0c1;
  --line:rgba(183,209,227,.14);
  --line-soft:rgba(183,209,227,.10);
  --brand:#d91b35;
  --brand-2:#f3654f;
  --ok:#1fb58a;
  --shadow:0 28px 80px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06);
  --glass:rgba(10,17,26,.42);
  --glass-strong:rgba(12,20,31,.62);
  --glass-border:rgba(255,255,255,.12);
}
html{background:#071018}
body{
  background:
    radial-gradient(1100px 620px at 84% 6%, rgba(217,27,53,.15), transparent 58%),
    radial-gradient(860px 520px at 10% 36%, rgba(71,112,136,.18), transparent 62%),
    linear-gradient(180deg,#060d15 0%,#08131d 46%,#09131d 100%);
  color:var(--text);
}
.site-3d-world{
  background:
    radial-gradient(circle at 82% 18%, rgba(217,27,53,.22) 0 1.3%, transparent 1.8% 100%),
    radial-gradient(ellipse at 82% 18%, transparent 0 10%, rgba(255,255,255,.07) 10.5% 11%, transparent 11.5% 18%, rgba(217,27,53,.11) 18.5% 19%, transparent 19.5%),
    radial-gradient(ellipse at 13% 68%, transparent 0 8%, rgba(163,205,226,.05) 8.5% 9%, transparent 9.5% 16%, rgba(217,27,53,.07) 16.5% 17%, transparent 17.5%),
    linear-gradient(120deg,rgba(5,10,16,.96),rgba(9,17,27,.92) 45%,rgba(8,13,20,.98));
}
.site-3d-world::before{
  background:
    repeating-linear-gradient(90deg,transparent 0 11.8vw,rgba(154,188,207,.06) 11.9vw 12vw),
    linear-gradient(100deg,transparent 15%,rgba(217,27,53,.08) 15.3% 15.55%,transparent 15.8% 73%,rgba(122,167,188,.06) 73.2% 73.45%,transparent 73.7%);
  opacity:.62;
}
.webgl-active #site-3d-canvas{opacity:.92}
.site-3d-world__haze{
  background:
    linear-gradient(180deg,rgba(192,210,219,.05),rgba(8,14,21,.02) 52%,rgba(255,255,255,.04)),
    radial-gradient(closest-side at 50% 48%,transparent 58%,rgba(176,206,219,.06));
  mix-blend-mode:screen;
}
.site-header{
  background:rgba(8,14,22,.54);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 34px rgba(0,0,0,.22);
  backdrop-filter:blur(24px) saturate(135%);
  -webkit-backdrop-filter:blur(24px) saturate(135%);
}
.brand-logo,.footer-logo{filter:drop-shadow(0 10px 24px rgba(0,0,0,.20))}
.site-nav a,.lang-link{color:#aeb9c6}
.site-nav a:hover,.site-nav a.is-active,.lang-link:hover,.lang-link.is-active{color:#f4f8fd}
.lang-link:hover,.lang-link.is-active{border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.06)}
.menu-toggle{border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.05)}
.menu-toggle span{background:#eef4fb}
.card-surface,
.service-card,.why-card,.quote-card,.step-card,.plan,.compare-card,.contact-card,.form-card,.final-cta,
.portfolio-card button,.hero-mini,.extra-row,.faq-item,.legal-wrap{
  background:linear-gradient(145deg,rgba(12,20,31,.56),rgba(7,13,21,.44));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(18px) saturate(132%);
  -webkit-backdrop-filter:blur(18px) saturate(132%);
}
.hero-bg{
  background:
    radial-gradient(640px 360px at 86% 22%,rgba(217,27,53,.10),transparent 66%),
    linear-gradient(90deg,rgba(255,255,255,.04),transparent 54%);
}
.hero-copy h1,.section-head h2,.contact-card h2,.final-cta h2,.service-card__body h3,.why-card h3,.quote-card h3,.step-card h3,.plan h3,.legal-wrap .section-head h1,.legal-block h2,.site-footer h3{color:#f3f8fd}
.hero-subtitle,.section-head p,.contact-card>p,.final-cta p,.section-note,.service-card__body p,.why-card p,.quote-card p,.step-card p,.plan p,.extra-row__price,.faq-item__body,.legal-block p,.site-footer p,.footer-bottom,.contact-list strong,.checkbox,.field>span,.field input::placeholder,.field textarea::placeholder{color:#a6b4c3}
.tick-list li,.check-list li,.contact-list span,.contact-list a,.site-footer li,.site-footer a,.portfolio-card button,.hero-mini h2,.compare-card__caption{color:#eaf1f8}
.proof-bar span,.trust-chip,.tab-btn,.filter-btn,.btn--ghost{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.10);
  color:#dbe5ef;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 34px rgba(0,0,0,.12);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.btn--ghost:hover,.tab-btn:hover,.filter-btn:hover,.tab-btn.is-active,.filter-btn.is-active{
  background:linear-gradient(135deg,rgba(217,27,53,.16),rgba(243,101,79,.12));
  border-color:rgba(217,27,53,.26);
  color:#fff;
}
.btn--primary{box-shadow:0 16px 38px rgba(217,27,53,.26), inset 0 1px 0 rgba(255,255,255,.20)}
.hero-main{box-shadow:0 34px 90px rgba(0,0,0,.28)}
.section::before{
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(145deg,rgba(10,17,27,.36),rgba(12,20,31,.22));
  box-shadow:0 36px 100px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(14px) saturate(126%);
  -webkit-backdrop-filter:blur(14px) saturate(126%);
}
.section:nth-of-type(3n)::before{background:linear-gradient(145deg,rgba(9,16,25,.26),rgba(12,20,31,.16))}
.section:nth-of-type(4n)::before{background:linear-gradient(145deg,rgba(10,17,27,.40),rgba(12,20,31,.24))}
.plan--featured{border-color:rgba(217,27,53,.30);box-shadow:0 24px 72px rgba(217,27,53,.10), inset 0 1px 0 rgba(255,255,255,.08)}
.plan-tag{background:rgba(217,27,53,.12);border-color:rgba(217,27,53,.24);color:#ffd8dd}
.plan__eyebrow,.eyebrow,.section-hint{color:#ffacb7}
.plan__meta,.plan__price--quote,.price-tax-note,.price-tax-note--inline{color:#9fb0c1}
.plan--custom{background:linear-gradient(135deg,rgba(12,20,31,.68),rgba(8,14,22,.56) 58%,rgba(217,27,53,.08));border-color:rgba(217,27,53,.20)}
.portfolio-card button:hover,.service-card:hover{box-shadow:0 30px 74px rgba(0,0,0,.24);border-color:rgba(255,255,255,.18)}
.compare{background:#0c1520}
.compare__label{background:rgba(7,12,18,.76);border-color:rgba(255,255,255,.14)}
.contact-list div,.footer-bottom{border-bottom-color:rgba(255,255,255,.08);border-top-color:rgba(255,255,255,.08)}
.field input,.field textarea{
  border-color:rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:#eef4fb;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(10px);
}
.field input:focus,.field textarea:focus{border-color:rgba(217,27,53,.45);box-shadow:0 0 0 3px rgba(217,27,53,.10)}
.map-frame{border-color:rgba(255,255,255,.12);box-shadow:0 20px 54px rgba(0,0,0,.20)}
.site-footer{
  border-top:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(8,14,22,.44),rgba(7,12,18,.74));
  box-shadow:0 -18px 60px rgba(0,0,0,.14);
}
.lightbox{background:#0b1118;box-shadow:0 32px 90px rgba(0,0,0,.45)}
@media (max-width: 900px){
  .site-nav{background:rgba(8,14,22,.90);border-color:rgba(255,255,255,.10);box-shadow:0 24px 60px rgba(0,0,0,.28)}
}
@media (max-width: 680px){
  .section::before{background:rgba(9,16,25,.34)}
}
@supports not ((backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px))){
  .card-surface,.section::before,.site-header,.site-footer,.legal-wrap,.extra-row,.faq-item,.tab-btn,.filter-btn,.btn--ghost,.service-card,.why-card,.quote-card,.step-card,.plan,.compare-card,.contact-card,.form-card,.final-cta,.portfolio-card button,.hero-mini{background:rgba(10,17,26,.90)}
}


/* =========================================================
   Pointer-reactive 3D inner glass blocks
   Inspired by Kage-like spatial cards: restrained tilt + cursor glow.
   ========================================================= */
@media (hover:hover) and (pointer:fine){
  .tilt-card{
    --tilt-rx:0deg;
    --tilt-ry:0deg;
    --glow-x:50%;
    --glow-y:50%;
    position:relative;
    isolation:isolate;
    overflow:hidden;
    transform-style:preserve-3d;
    will-change:transform;
    backface-visibility:hidden;
    transform-origin:center center;
  }
  .tilt-card{
    --tilt-lift:0px;
    --tilt-z:0px;
    --tilt-scale:1;
  }
  .tilt-card.is-3d-active{
    transform:perspective(1050px) rotateX(var(--tilt-rx)) rotateY(var(--tilt-ry)) translate3d(0,var(--tilt-lift),var(--tilt-z)) scale(var(--tilt-scale));
  }
  .tilt-card.is-tilting{
    border-color:rgba(255,255,255,.18);
    box-shadow:0 34px 90px rgba(0,0,0,.32),0 14px 42px rgba(217,27,53,.07),inset 0 1px 0 rgba(255,255,255,.10);
    transition:box-shadow .34s ease,border-color .34s ease;
  }
  .tilt-card > *:not(.tilt-glow){
    z-index:1;
    transform:translateZ(0);
    transition:transform .42s cubic-bezier(.2,.72,.2,1);
  }
  .tilt-card.is-tilting > *:not(.tilt-glow){
    transform:translateZ(12px);
  }
  .tilt-card .tilt-glow{
    position:absolute!important;
    z-index:3!important;
    inset:-1px;
    display:block;
    padding:0!important;
    margin:0!important;
    border:0!important;
    width:auto!important;
    height:auto!important;
    font-size:0!important;
    line-height:0!important;
    pointer-events:none;
    opacity:0;
    transform:none!important;
    transition:opacity .28s ease;
    background:
      radial-gradient(circle at var(--glow-x) var(--glow-y),
        rgba(255,255,255,.18) 0,
        rgba(255,255,255,.10) 8%,
        rgba(217,27,53,.10) 20%,
        rgba(99,151,177,.05) 34%,
        transparent 54%);
    mix-blend-mode:screen;
  }
  .tilt-card .tilt-glow::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:linear-gradient(118deg,rgba(255,255,255,.08),transparent 28% 68%,rgba(255,255,255,.035));
    opacity:.72;
  }
  .tilt-card.is-tilting .tilt-glow{opacity:1}

  /* Keep imagery cinematic while the frame reacts in 3D. */
  .service-card.tilt-card.is-tilting .service-card__media img,
  .portfolio-card button.tilt-card.is-tilting img,
  .compare-card.tilt-card.is-tilting .compare img,
  .hero-mini.tilt-card.is-tilting img{
    filter:saturate(.98) contrast(1.035) brightness(1.035);
  }

}

@media (prefers-reduced-motion:reduce){
  .tilt-card,.tilt-card.is-tilting{transform:none!important;will-change:auto!important}
  .tilt-glow{display:none!important}
}


/* 2026-08-11 — Reference wheel integration + persistent WhatsApp anchor */
.wa-float{
  position:fixed;
  right:max(16px, env(safe-area-inset-right, 0px) + 16px);
  bottom:max(16px, env(safe-area-inset-bottom, 0px) + 16px);
  z-index:90;
  animation:waFloatBob 3.8s ease-in-out infinite;
}
@keyframes waFloatBob{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
@media (prefers-reduced-motion: reduce){
  .wa-float{animation:none}
}


/* 2026-08-11 — WhatsApp must stay pinned to the viewport corner */
body > a.wa-float{
  position:fixed!important;
  top:auto!important;
  left:auto!important;
  right:18px!important;
  bottom:18px!important;
  margin:0!important;
  transform:none!important;
  animation:none!important;
  z-index:2147483000!important;
}
@media (max-width:680px){
  body > a.wa-float{right:14px!important;bottom:14px!important}
}
@supports (right: max(1px, env(safe-area-inset-right))){
  body > a.wa-float{
    right:max(18px, calc(env(safe-area-inset-right) + 12px))!important;
    bottom:max(18px, calc(env(safe-area-inset-bottom) + 12px))!important;
  }
  @media (max-width:680px){
    body > a.wa-float{
      right:max(14px, calc(env(safe-area-inset-right) + 10px))!important;
      bottom:max(14px, calc(env(safe-area-inset-bottom) + 10px))!important;
    }
  }
}