:root{
  --ink:#F3F0E7;
  --ink-subtle:#EBE7DC;
  --ink-2:#EAE6DA;
  --white:#14141F;
  --white-dim:rgba(20,20,31,.78);
  --muted:rgba(64,78,100,.92);
  --faint:rgba(64,78,100,.58);
  --surface-card:#FBF9F3;
  --surface-dark:#0E1620;
  --surface-dark-card:#152232;
  --cyan:#0B7C72;
  --cyan-hover:#09685F;
  --cyan-soft:rgba(11,124,114,0.12);
  --cyan-glow:rgba(11,124,114,0.24);
  --amber:#D4942A;
  --amber-soft:rgba(212,148,42,0.15);
  --amber-glow:rgba(212,148,42,0.22);
  --border:rgba(0,0,0,.08);
  --border-glow:rgba(11,124,114,.25);
  --glass:rgba(255,255,255,.75);
  --glass-line:rgba(0,0,0,.08);
  --glass-bg:rgba(255,255,255,0.82);
  --glass-border:rgba(0,0,0,0.08);
  --glass-shadow:0 12px 36px -4px rgba(0,0,0,0.06), 0 4px 12px -2px rgba(0,0,0,0.04);
  --glass-shadow-hover:0 20px 48px -6px rgba(0,0,0,0.10), 0 8px 20px -4px rgba(0,0,0,0.06);
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;
  --sans:'Inter Tight','Inter Tight Fallback','Inter',system-ui,-apple-system,sans-serif;
  --display:'Fraunces','Fraunces Fallback',Georgia,serif;
  --nav-h:66px;
}
[data-theme="dark"]{
  --ink:#0E1620;
  --ink-subtle:#152232;
  --ink-2:#1B2B3F;
  --white:#F1F5F9;
  --white-dim:rgba(241,245,249,0.85);
  --muted:rgba(148,163,184,0.9);
  --faint:rgba(148,163,184,0.55);
  --surface-card:#152232;
  --border:rgba(255,255,255,0.08);
  --border-glow:rgba(94,234,212,0.25);
  --glass:rgba(21,34,50,0.85);
  --glass-line:rgba(255,255,255,0.08);
  --glass-bg:rgba(21,34,50,0.9);
  --glass-border:rgba(255,255,255,0.08);
  --glass-shadow:0 12px 36px -4px rgba(0,0,0,0.4), 0 4px 12px -2px rgba(0,0,0,0.3);
  --glass-shadow-hover:0 20px 48px -6px rgba(0,0,0,0.5), 0 8px 20px -4px rgba(0,0,0,0.4);
}
/* Fallback metrics — keeps layout stable until Fraunces/Inter Tight web fonts paint. */
@font-face{font-family:'Fraunces Fallback';src:local('Georgia');size-adjust:105%;ascent-override:92%;descent-override:22%;line-gap-override:0%;}
@font-face{font-family:'Inter Tight Fallback';src:local('Arial');size-adjust:107%;ascent-override:90%;descent-override:22%;line-gap-override:0%;}
html{scroll-behavior:smooth;scroll-padding-top:90px;scrollbar-gutter:stable;width:100%;max-width:100vw;overflow-x:hidden;}
html,body{background:var(--ink);color:var(--white);font-family:var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;width:100%;max-width:100vw;overflow-x:hidden;}
body{overflow-x:hidden;position:relative;width:100%;max-width:100vw;}
*, *::before, *::after{box-sizing:border-box;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;cursor:pointer;background:none;border:0;color:inherit;}
::selection{background:var(--cyan);color:#fff;}

.nav{position:fixed;top:0;left:0;right:0;width:100%;max-width:100%;border-radius:0;transform:none;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 clamp(16px,4vw,40px);height:var(--nav-h,68px);background:rgba(248,245,238,0.96);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border-top:none;border-left:none;border-right:none;border-bottom:1px solid rgba(0,0,0,.08);box-shadow:0 4px 20px rgba(0,0,0,.05);transition:transform .4s cubic-bezier(.25,.46,.45,.94),background .3s;}
.nav.nav--hidden{transform:translateY(-100%);opacity:0;pointer-events:none;}
[data-theme="dark"] .nav{background:rgba(14,22,32,0.96);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 4px 24px rgba(0,0,0,.3);}
.nav.scrolled{background:rgba(248,245,238,0.96);border-color:rgba(0,0,0,.1);box-shadow:0 8px 32px rgba(0,0,0,.12);}
[data-theme="dark"] .nav.scrolled{background:rgba(14,22,32,0.98);border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 8px 32px rgba(0,0,0,.5);}
.nav-brand{display:flex;align-items:center;color:var(--white);height:100%;flex-shrink:0;}
.nav-links{display:flex;align-items:center;gap:18px;font-size:13px;color:var(--white-dim);flex-shrink:1;}
.nav-links a{transition:color .2s;position:relative;padding-bottom:2px;white-space:nowrap;color:var(--white-dim);}
.nav-links a::after{content:'';position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--cyan);transition:right .25s ease;}
.nav-links a:hover{color:var(--white);}
[data-theme="dark"] .nav-links a{color:rgba(241,245,249,0.85);}
[data-theme="dark"] .nav-links a:hover{color:#fff;}
.nav-links a:hover::after,.nav-links a.active::after{right:0;}
.nav-links a.active{color:var(--cyan);}
.nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.nav-sandbox-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;font-weight:600;padding:8px 16px;background:linear-gradient(135deg,#0B7C72,#065A53);border:none;border-radius:100px;color:#fff;cursor:pointer;transition:all .25s ease;white-space:nowrap;box-shadow:0 4px 16px -4px rgba(11,124,114,.5),0 1px 0 rgba(255,255,255,.15) inset;position:relative;overflow:hidden;text-decoration:none;}
.nav-sandbox-btn .dot{width:6px;height:6px;border-radius:50%;background:#5EEAD4;box-shadow:0 0 8px rgba(94,234,212,.9);animation:pulseDot 2s infinite;}
.nav-sandbox-btn::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:navShimmer 3s ease-in-out infinite;}
@keyframes navShimmer{0%{left:-100%;}50%,100%{left:100%;}}
.nav-sandbox-btn:hover{background:linear-gradient(135deg,#0F766E,#065A53);transform:translateY(-1px);box-shadow:0 6px 24px -4px rgba(11,124,114,.6),0 1px 0 rgba(255,255,255,.2) inset;}
.nav-cta{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:8px 16px;background:linear-gradient(135deg,#1E293B,#334155);border:none;border-radius:100px;color:#fff;white-space:nowrap;transition:all .25s cubic-bezier(.22,1,.36,1);font-weight:600;text-decoration:none;box-shadow:0 4px 14px -4px rgba(30,41,59,.4),0 1px 0 rgba(255,255,255,.1) inset;}
.nav-cta:hover{background:linear-gradient(135deg,#0B7C72,#065A53);color:#fff;transform:translateY(-1px);box-shadow:0 6px 20px -4px rgba(11,124,114,.5),0 1px 0 rgba(255,255,255,.15) inset;}
.nav-cta.armed{background:linear-gradient(135deg,#0B7C72,#065A53);color:#fff;animation:navArm 1s ease-in-out infinite;}
@keyframes navArm{0%,100%{box-shadow:0 0 0 0 rgba(79,227,220,.5);}50%{box-shadow:0 0 0 6px rgba(79,227,220,0);}}
.nav-status{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9.5px;color:var(--muted);letter-spacing:.1em;}
.nav-status .dot{width:5px;height:5px;border-radius:50%;background:#0D9488;box-shadow:0 0 6px rgba(13,148,136,.4);}
/* Mobile menu */
.nav-burger{display:none;width:38px;height:38px;border-radius:12px;border:1px solid rgba(0,0,0,.08);align-items:center;justify-content:center;flex:none;background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(243,240,231,.9));cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.06),0 1px 0 rgba(255,255,255,.8) inset;transition:all .25s ease;}
.nav-burger span,.nav-burger span::before,.nav-burger span::after{display:block;width:16px;height:2px;background:#1E293B;border-radius:2px;transition:transform .25s,top .25s,background .25s;}
.nav-burger span{position:relative;}
.nav-burger span::before,.nav-burger span::after{content:'';position:absolute;left:0;}
.nav-burger span::before{top:-5px;} .nav-burger span::after{top:5px;}
.nav-burger:hover{background:linear-gradient(135deg,#0B7C72,#065A53);border-color:transparent;box-shadow:0 4px 12px -2px rgba(11,124,114,.4);}
.nav-burger:hover span,.nav-burger:hover span::before,.nav-burger:hover span::after{background:#FBF9F3;}
.nav.open .nav-burger span{background:transparent;}
.nav.open .nav-burger span::before{top:0;transform:rotate(45deg);}
.nav.open .nav-burger span::after{top:0;transform:rotate(-45deg);}
.nav-mobile{display:none;position:absolute;top:calc(100% + 8px);left:12px;right:12px;width:auto;box-sizing:border-box;padding:12px;background:rgba(248,245,238,0.97);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.4);border-radius:24px;box-shadow:0 20px 40px rgba(0,0,0,.12), 0 1px 3px rgba(0,0,0,.05), inset 0 1px 0 rgba(255,255,255,.8);opacity:0;visibility:hidden;transform:translateY(-12px) scale(0.98);transform-origin:top center;transition:opacity .3s cubic-bezier(.22,1,.36,1),transform .3s cubic-bezier(.22,1,.36,1),visibility .3s;}
.nav-mobile a{display:block;padding:12px 16px;border-radius:12px;font-size:14.5px;color:var(--white-dim);font-weight:500;}
.nav-mobile a:hover{background:rgba(251,249,243,.7);color:var(--white);box-shadow:inset 0 1px 0 rgba(255,255,255,.8);}
.nav-mobile a.active{color:var(--cyan);background:rgba(79,227,220,.08);}
.nav-mobile-cta{margin-top:6px;text-align:center;background:var(--cyan);color:#fff!important;font-weight:600;}

/* Responsive Nav & Breakpoints */
@media(max-width:1120px){
  .nav{padding:0 16px;gap:10px;}
  .nav-links{gap:12px;font-size:12px;}
  .nav-cta{padding:6px 11px;font-size:10px;}
  .nav-sandbox-btn{padding:6px 10px;font-size:10.5px;}
}
@media(max-width:960px){
  .nav-links{display:none;}
  .nav{padding:0 14px;height:var(--nav-h,64px);width:100%;max-width:100%;left:0;right:0;box-sizing:border-box;}
  .nav-right{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  .nav-burger{display:flex !important;flex-shrink:0;}
  .nav-mobile{display:block;}
  .nav.open .nav-mobile {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
  z-index: 99999 !important;
}
}
@media(max-width:640px){
  .nav{padding:0 12px;}
  .nav-cta{display:none;}
  .nav-right{gap:6px;flex-shrink:0;}
  .nav-sandbox-btn{padding:6px 10px;font-size:10px;}
  .nav-brand img {
  height: 52px !important;
  width: auto !important;
  max-width: 280px !important;
  object-fit: contain !important;
  display: block !important;
  transition: transform 0.2s ease !important;
}
  .nav-burger{width:36px;height:36px;flex-shrink:0;}
}
@media(max-width:380px){
  .nav{padding:0 8px;}
  .nav-right{gap:4px;flex-shrink:0;}
  .nav-sandbox-btn{padding:5px 8px;font-size:9.5px;}
  .nav-brand img {
  height: 52px !important;
  width: auto !important;
  max-width: 280px !important;
  object-fit: contain !important;
  display: block !important;
  transition: transform 0.2s ease !important;
}
  .theme-toggle{width:32px;height:32px;flex-shrink:0;}
  .nav-burger{width:32px;height:32px;flex-shrink:0;}
}

/* ─── STANDOUT LUXURY LIVE SANDBOX SECTION ─────────── */
.hero-sandbox-strip{
  position:relative;
  z-index:3;
  margin:48px auto 48px;
  max-width:1240px;
  width:calc(100% - 32px);
  padding:0;
}
.hss-inner{
  position:relative;
  overflow:hidden;
  background:radial-gradient(ellipse 90% 60% at 50% -20%, rgba(13,148,136,0.22), transparent 70%),
             radial-gradient(circle at 10% 90%, rgba(212,148,42,0.06), transparent 50%),
             linear-gradient(180deg, #090E14 0%, #101924 100%);
  border:1px solid rgba(13,148,136,0.38);
  border-radius:28px;
  padding:44px 36px;
  box-shadow:0 32px 80px -16px rgba(0,0,0,0.6),
             0 0 48px -6px rgba(13,148,136,0.24),
             inset 0 1px 0 rgba(255,255,255,0.2),
             inset 0 0 32px rgba(13,148,136,0.08);
  color:#FFFFFF;
}
/* Sweeping ambient light beam */
.hss-inner::before{
  content:'';
  position:absolute;
  top:0;
  left:-60%;
  width:50%;
  height:100%;
  background:linear-gradient(105deg, transparent 20%, rgba(94,234,212,0.06) 45%, rgba(255,255,255,0.12) 50%, rgba(94,234,212,0.06) 55%, transparent 80%);
  animation:hssSweep 9s ease-in-out infinite;
  pointer-events:none;
  z-index:1;
}
@keyframes hssSweep{
  0%{left:-60%;}
  40%,100%{left:140%;}
}
.hss-head{
  position:relative;
  z-index:2;
  text-align:center;
  max-width:780px;
  margin:0 auto 36px;
}
.hss-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#5EEAD4;
  background:rgba(11,124,114,.24);
  border:1px solid rgba(94,234,212,.4);
  padding:6px 16px;
  border-radius:100px;
  margin-bottom:14px;
  position:relative;
  overflow:hidden;
  box-shadow:0 4px 16px rgba(13,148,136,.25);
}
.hss-eyebrow::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  animation:shimmerSheen 3.5s infinite;
}
@keyframes shimmerSheen{
  0%{transform:translateX(-100%)}
  40%,100%{transform:translateX(100%)}
}
.hss-eyebrow .dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#2DD4BF;
  box-shadow:0 0 10px #2DD4BF;
  animation:pulseDot 2s infinite;
}
.hss-title{
  font-family:var(--display);
  font-size:clamp(28px,3.8vw,44px);
  font-weight:400;
  letter-spacing:-.03em;
  line-height:1.14;
  color:#FFFFFF;
  margin:0 0 12px;
}
.hss-title .accent{
  color:#5EEAD4;
  font-style:italic;
  font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;
}
.hss-sub{
  font-size:15.5px;
  line-height:1.6;
  color:rgba(255,255,255,.76);
  margin:0;
}
.hss-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.hss-card{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:rgba(21,34,50,.55);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border:1px solid rgba(255,255,255,.11);
  border-radius:22px;
  padding:24px 22px;
  text-decoration:none;
  color:#FFFFFF;
  transition:border-color .3s ease, box-shadow .3s ease, background .3s ease;
  position:relative;
  overflow:hidden;
  transform-style:preserve-3d;
  will-change:transform;
}
/* Specular edge top glow */
.hss-card::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:2px;
  background:linear-gradient(90deg, transparent, rgba(94,234,212,.7), transparent);
  opacity:0;
  transition:opacity .3s ease;
}
/* Subtle cursor glare */
.hss-card .card-glare{
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(255,255,255,0.09), transparent 65%);
  pointer-events:none;
  opacity:0;
  transition:opacity .25s ease;
}
.hss-card:hover .card-glare{opacity:1;}
.hss-card:hover{
  border-color:rgba(94,234,212,.65);
  background:rgba(21,34,50,.85);
  box-shadow:0 24px 50px -10px rgba(0,0,0,.6), 0 0 30px -4px rgba(13,148,136,.35);
}
.hss-card:hover::before{opacity:1;}
.hss-card.featured{
  border-color:rgba(94,234,212,.45);
  background:linear-gradient(180deg,rgba(16,34,50,.88),rgba(10,22,34,.88));
  box-shadow:0 12px 32px rgba(0,0,0,.35), inset 0 1px 0 rgba(94,234,212,.25);
}
.hss-card.featured::before{
  opacity:1;
  background:linear-gradient(90deg,#0B7C72,#5EEAD4,#0B7C72);
}
.hss-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:14px;
}
.hss-card-badge{
  font-family:var(--mono);
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:4px 10px;
  border-radius:100px;
}
.hss-card-badge.cyan{background:rgba(13,148,136,.25);border:1px solid rgba(94,234,212,.4);color:#5EEAD4;}
.hss-card-badge.teal{background:rgba(20,184,166,.25);border:1px solid rgba(94,234,212,.4);color:#5EEAD4;}
.hss-card-badge.amber{background:rgba(245,158,11,.25);border:1px solid rgba(245,158,11,.45);color:#FDE68A;}
.hss-card-badge.green{background:rgba(16,185,129,.25);border:1px solid rgba(16,185,129,.45);color:#A7F3D0;}
.hss-card-link{
  font-family:var(--mono);
  font-size:11px;
  font-weight:600;
  color:#5EEAD4;
  display:inline-flex;
  align-items:center;
  gap:4px;
  transition:transform .2s;
}
.hss-card:hover .hss-card-link{transform:translateX(3px);}
.hss-card-title{
  font-size:18.5px;
  font-weight:700;
  letter-spacing:-.02em;
  color:#FFFFFF;
  margin:0 0 8px;
}
.hss-card-desc{
  font-size:12.5px;
  line-height:1.55;
  color:rgba(255,255,255,.7);
  margin:0 0 18px;
  flex-grow:1;
}
.hss-card-pills{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.08);
}
.hss-card-pills span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-family:var(--mono);
  font-size:9.5px;
  letter-spacing:.03em;
  padding:3px 8px;
  border-radius:6px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.88);
}
.hss-card-pills svg{
  width:11px;
  height:11px;
  stroke:#5EEAD4;
  stroke-width:2.2;
  fill:none;
  flex-shrink:0;
}
@media(max-width:1080px){.hss-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.hss-grid{grid-template-columns:1fr;}.hss-inner{padding:30px 20px;}.hero-sandbox-strip{margin-top:36px;}}
/* ─── THREE.JS CANVAS ────────────────────────── */
.ambient-vignette{display:none;}
.grid-overlay{display:none;}

.hero{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;overflow:hidden;padding-top:var(--nav-h);}
.hero-scene{position:absolute;inset:0;z-index:0;background:var(--ink);}
.hero-field{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 30% 30%,rgba(11,124,114,.08) 0%,transparent 65%);}
[data-theme="dark"] .hero-field{background:radial-gradient(ellipse 80% 60% at 30% 30%,rgba(13,148,136,.14) 0%,transparent 65%);}
.hero-grid{display:none;}
.hero-noise{display:none;}
.hero-glyphs{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.hero-glyphs span{display:none;position:absolute;font-family:var(--mono);font-size:11px;color:rgba(13,148,136,.12);letter-spacing:.2em;text-transform:uppercase;}
.hero-glass{position:absolute;bottom:0;left:0;right:0;height:35%;background:linear-gradient(180deg,transparent,var(--ink) 85%);opacity:.3;}

/* Bottom padding reserves the band the .scroll-cue occupies (28px offset + ~50px tall)
   so the ticker can never land on top of it. */
.hero-inner{position:relative;z-index:5;max-width:1340px;width:100%;margin:0 auto;padding:56px 32px 108px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,4vw,60px);align-items:center;flex:1;}
.hero-inner > *{min-width:0;}
.hero-badge{display:inline-flex;align-items:center;gap:10px;padding:8px 14px 8px 12px;border:1px solid rgba(13,148,136,.2);border-radius:100px;background:rgba(13,148,136,.06);font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);width:fit-content;margin-bottom:26px;opacity:0;transform:translateY(10px);}
.hero-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 0 rgba(79,227,220,.6);animation:livePing 1.8s ease-out infinite;}
@keyframes badgeShimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@keyframes badgeTilt{0%,100%{transform:perspective(400px) rotateX(0deg) rotateY(0deg)}25%{transform:perspective(400px) rotateX(2deg) rotateY(-3deg)}50%{transform:perspective(400px) rotateX(-1deg) rotateY(3deg)}75%{transform:perspective(400px) rotateX(2deg) rotateY(-2deg)}}
@keyframes livePing{0%{box-shadow:0 0 0 0 rgba(79,227,220,.55);}70%{box-shadow:0 0 0 12px rgba(79,227,220,0);}100%{box-shadow:0 0 0 0 rgba(79,227,220,0);}}
.hero-h1{font-family:var(--display);font-size:clamp(38px,5.2vw,72px);line-height:1.02;letter-spacing:-.035em;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30,"WONK" 0;margin-bottom:24px;text-wrap:balance;overflow-wrap:break-word;hyphens:auto;}
.hero-h1 .accent,.section-h2 .accent,.final h2 .accent{display:inline-block;padding-right:0.15em;padding-bottom:0.04em;font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;letter-spacing:-.02em;background:linear-gradient(135deg,#0B7C72 0%,#0D9488 25%,#14B8A6 48%,#0F766E 72%,#0B7C72 100%);background-size:240% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:headingShimmer 5s ease-in-out infinite;}
.hero-brand{color:var(--cyan);background:linear-gradient(105deg,var(--cyan) 0%,var(--cyan) 35%,#5de8d8 50%,var(--cyan) 65%,var(--cyan) 100%);background-size:250% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:hero-shimmer 3s ease-in-out infinite;}
@keyframes hero-shimmer{0%,100%{background-position:100% 0}50%{background-position:0% 0}}
.hero-sub{font-size:clamp(15.5px,1.25vw,18.5px);line-height:1.55;color:var(--white-dim);max-width:540px;margin-bottom:36px;text-wrap:pretty;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px;}
.btn{display:inline-flex;align-items:center;gap:8px;padding:15px 24px;border-radius:100px;font-size:14px;font-weight:500;letter-spacing:.01em;transition:background .25s,color .25s,transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s;will-change:transform;}
.btn-primary{background:var(--cyan);color:#fff;position:relative;overflow:hidden;box-shadow:0 6px 20px -8px var(--cyan-glow),inset 0 1px 0 rgba(255,255,255,.2);font-weight:600;}
.btn-primary::after{content:'';position:absolute;top:0;bottom:0;left:-70%;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-20deg);pointer-events:none;}
.btn-primary:hover{background:var(--cyan-hover);color:#fff;transform:translateY(-2px);box-shadow:0 8px 28px -8px var(--cyan-glow);}
.btn-primary:hover::after{animation:btnShine .7s ease forwards;}
@keyframes btnShine{to{left:125%;}}
.btn-ghost{border:1px solid var(--glass-line);background:rgba(251,249,243,.6);color:var(--white);backdrop-filter:blur(8px);transition:background .25s,color .25s,border-color .25s,transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s;}
.btn-ghost:hover{border-color:var(--cyan);background:rgba(248,245,238,.9);color:var(--cyan);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.06);}
.btn-wa{background:linear-gradient(135deg,#25D366,#128C7E);color:#fff;border:1px solid rgba(255,255,255,.2);box-shadow:0 6px 20px -8px rgba(37,211,102,.45);font-weight:600;}
.btn-wa:hover{background:linear-gradient(135deg,#22bf5b,#0e7569);color:#fff;transform:translateY(-2px);box-shadow:0 8px 28px -8px rgba(37,211,102,.6);}

.hero-ticker{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 22px;padding:20px 0 0;margin-top:24px;border-top:1px solid var(--glass-line);font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.hero-ticker .dot{color:var(--cyan);}

.hero-flex{position:relative;border-radius:20px;overflow:hidden;background:rgba(251,249,243,.6);border:1px solid rgba(255,255,255,.7);backdrop-filter:blur(20px) saturate(170%);-webkit-backdrop-filter:blur(20px) saturate(170%);aspect-ratio:16/9;box-shadow:0 24px 64px -20px rgba(13,148,136,.28),inset 0 1px 0 rgba(255,255,255,.95);display:block;transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s cubic-bezier(.22,1,.36,1);}
.hero-flex:hover{transform:translateY(-4px);box-shadow:0 34px 84px -20px rgba(13,148,136,.42),inset 0 1px 0 #fff;}
.hero-flex-head{position:absolute;top:0;left:0;right:0;padding:14px 18px;display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.8);background:linear-gradient(180deg,rgba(0,0,0,.4),transparent);z-index:2;}
.hero-flex-head .live-tag{color:#5EEAD4;display:flex;align-items:center;gap:6px;}
.hero-flex-head .live-tag span:first-child{animation:livePulse 2s ease-in-out infinite;}
.hero-flex-body{position:absolute;inset:0;display:grid;place-items:center;padding:36px;text-align:center;}
.hero-flex-body .glyph{width:80px;height:80px;border:1.5px solid var(--cyan);border-radius:50%;display:grid;place-items:center;margin:0 auto 20px;position:relative;}
.hero-flex-body .glyph::before,.hero-flex-body .glyph::after{content:'';position:absolute;inset:-8px;border:1px solid rgba(79,227,220,.2);border-radius:50%;animation:orbit 8s linear infinite;}
.hero-flex-body .glyph::after{inset:-16px;animation-duration:12s;animation-direction:reverse;}
@keyframes orbit{to{transform:rotate(360deg);}}
.hero-flex-body h4{font-size:20px;font-weight:500;margin-bottom:10px;letter-spacing:-.01em;}
.hero-flex-body p{font-size:13.5px;color:var(--white-dim);max-width:280px;margin:0 auto 22px;line-height:1.5;}
.hero-flex-body .cta{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);}
.hero-flex-cap{position:absolute;bottom:0;left:0;right:0;padding:14px 18px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.7);background:linear-gradient(0deg,rgba(0,0,0,.6),transparent);z-index:2;text-align:center;}
/* Hero product video — replaces the duplicate true-cars iframe (that site still leads the Live Showcase below). */
.hero-video-wrap{position:absolute;inset:0;overflow:hidden;background:#1A1F2E;}
.hero-video-wrap video{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .6s cubic-bezier(.25,.46,.45,.94);}
.hero-flex:hover .hero-video-wrap video{transform:scale(1.02);}
.hero-video-wrap .preview-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(3,5,8,.35) 0%,transparent 22%,transparent 58%,rgba(3,5,8,.92) 100%);}

@media(max-width:960px){.hero-inner{grid-template-columns:1fr;gap:36px;padding:40px 20px 96px;} .hero-flex{aspect-ratio:16/9;}}
/* On short viewports there isn't room for the cue without crowding the ticker — drop it.
   Anyone on a 700px-tall window already knows the page scrolls. */
@media(max-height:760px){.scroll-cue{display:none;}}

.section{position:relative;z-index:2;padding:120px 32px;max-width:1340px;margin:0 auto;background:transparent;overflow:visible;}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--cyan);margin-bottom:16px;}
.section-h2{font-family:var(--display);font-size:clamp(30px,3.7vw,50px);line-height:1.05;letter-spacing:-.03em;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;margin-bottom:18px;max-width:820px;text-wrap:balance;}
.section-lede{font-size:17px;color:var(--white-dim);max-width:640px;line-height:1.65;}

.proof{position:relative;z-index:2;border-top:1px solid rgba(0,0,0,.06);border-bottom:1px solid rgba(0,0,0,.06);background:#EAE6DA;padding:44px 32px;}
.proof-inner{max-width:1340px;margin:0 auto;display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center;}
.proof-label{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}
.proof-links{display:flex;gap:14px;flex-wrap:wrap;}
.proof-link{display:flex;align-items:center;gap:10px;padding:12px 18px;border:1px solid rgba(60,50,30,.11);border-radius:100px;background:#FBF9F3;box-shadow:0 2px 7px rgba(60,50,30,.06);transition:all .25s ease;font-size:13.5px;}
.proof-link:hover{border-color:var(--cyan-soft);background:rgba(79,227,220,.08);transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.08);}
.proof-link .live{width:6px;height:6px;border-radius:50%;background:var(--cyan);}
.proof-link .arrow{color:var(--muted);font-family:var(--mono);}
@media(max-width:820px){.proof-inner{grid-template-columns:1fr;gap:18px;}}

.stack .layer{margin-top:60px;}
.stack .layer:first-of-type{margin-top:50px;}
.layer-head{display:flex;align-items:center;gap:16px;margin-bottom:24px;}
.layer-num{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--muted);}
.layer-name{font-size:14px;font-weight:500;letter-spacing:.02em;color:var(--white);}
.layer-line{flex:1;height:1px;background:linear-gradient(90deg,var(--glass-line),transparent);}
.module-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.module-card.mc-hero{grid-column:span 2;}
@media(max-width:960px){.module-grid{grid-template-columns:1fr;}.module-card.mc-hero{grid-column:span 1;}}
.module-card{position:relative;padding:20px 20px 18px;border-radius:18px;background:var(--surface-card);border:1px solid var(--glass-border);backdrop-filter:none;box-shadow:var(--glass-shadow);overflow:hidden;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s cubic-bezier(.22,1,.36,1),border-color .35s;display:flex;flex-direction:column;}
.module-card:hover{transform:translateZ(14px) rotateX(-2deg) rotateY(2deg) translateY(-4px);border-color:rgba(11,124,114,.35);box-shadow:var(--glass-shadow-hover);}
.mc-preview{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;border:1px solid rgba(0,0,0,.08);background:#EFEBE0;margin-bottom:18px;box-shadow:inset 0 1px 0 rgba(232,234,230,.05);}
.mc-preview iframe{position:absolute;top:0;left:0;width:1280px;height:800px;border:0;transform-origin:top left;pointer-events:none;background:#FBF9F3;transition:filter .3s;}
.module-card:hover .mc-preview iframe{filter:brightness(1.06);}
.mc-preview video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;transition:transform .4s ease;}
.module-card:hover .mc-preview video{transform:scale(1.03);}
.mc-preview::after{content:'Live ↗';position:absolute;top:9px;right:9px;padding:4px 10px;border-radius:100px;background:rgba(248,245,238,.9);backdrop-filter:blur(8px);border:1px solid rgba(13,148,136,.2);font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);z-index:3;box-shadow:0 2px 8px rgba(0,0,0,.06);}
.mc-preview.no-live-badge::after{content:'Book demo';color:var(--amber);border-color:rgba(212,148,42,.2);background:rgba(248,245,238,.9);}
/* On phone-framed previews, tuck the chip into the outer letterbox above the phone so it stops overlapping the chat header inside the frame. */
.mc-preview.pv-phone::after,.mc-preview.pv-phone-duo::after{top:6px;right:10px;}
.mc-preview.pv-vid{aspect-ratio:5/4;background:radial-gradient(ellipse 70% 60% at 50% 40%,#EFEBE0,#F7F4EC);display:flex;align-items:center;justify-content:center;gap:16px;padding:14px 10px;overflow:hidden;}
.mc-preview.pv-vid video{position:relative;inset:auto;height:100%;width:auto;max-width:100%;object-fit:contain;display:block;flex-shrink:0;}
.mc-preview.pv-vid img{height:94%;width:auto;object-fit:contain;flex-shrink:0;border-radius:9px;filter:drop-shadow(0 20px 40px rgba(0,0,0,.55));}
@media(max-width:820px){.mc-preview.pv-vid{aspect-ratio:4/3;padding:14px 0;}}
/* Phone-framed module preview (mobile app modules like TruFlow) */
.mc-preview.pv-phone{background:radial-gradient(ellipse 70% 60% at 50% 40%,#E8E8E4,#F5F5F3);display:grid;place-items:center;padding:14px 0;}
.mc-preview.pv-phone .phone-fr{position:relative;height:min(100%,420px);aspect-ratio:9/19.5;border:6px solid #2A2F3A;border-radius:22px;overflow:hidden;background:#0A0D14;box-shadow:0 22px 55px -22px rgba(0,0,0,.9),inset 0 1px 0 rgba(232,234,230,.05);}
.mc-preview.pv-phone iframe{position:absolute;top:0;left:0;width:390px;height:845px;transform-origin:top left;}
/* On mobile, the 16/10 aspect ratio squishes the phone down to something illegible.
   Give the phone-framed previews a taller portrait ratio so the chat inside stays readable. */
@media(max-width:820px){
  .mc-preview.pv-phone{aspect-ratio:3/4;padding:16px 0;overflow:hidden;}
  .mc-preview.pv-phone .phone-fr{height:auto;max-height:80vw;aspect-ratio:9/19.5;}
  .mc-preview.pv-phone-duo{aspect-ratio:5/4;padding:18px 8px;}
  .mc-preview.pv-phone-duo .phone-3d{height:100%;}
  .mc-preview.pv-shots{aspect-ratio:5/4;padding:16px 8px;gap:12px;}
  .mc-preview.pv-shots img{height:100%;}
}
.mc-preview.pv-phone-duo{background:radial-gradient(ellipse 80% 60% at 50% 45%,#E8E8E4,#F5F5F3);display:flex;align-items:center;justify-content:center;gap:20px;perspective:900px;padding:14px 10px;}
.mc-preview.pv-phone-duo .phone-3d{position:relative;height:94%;aspect-ratio:9/19.5;border:5px solid #2A2F3A;border-radius:22px;overflow:hidden;background:#0A0D14;box-shadow:0 24px 60px -18px rgba(0,0,0,.85),inset 0 1px 0 rgba(232,234,230,.06);flex-shrink:0;transition:transform .45s cubic-bezier(.25,.46,.45,.94);}
.mc-preview.pv-phone-duo .phone-3d:first-child{transform:rotateY(6deg) rotateX(1deg) translateZ(-10px);}
.mc-preview.pv-phone-duo .phone-3d:last-child{transform:rotateY(-6deg) rotateX(1deg) translateZ(-10px);}
.module-card:hover .mc-preview.pv-phone-duo .phone-3d:first-child{transform:rotateY(3deg) rotateX(0deg) translateZ(0);}
.module-card:hover .mc-preview.pv-phone-duo .phone-3d:last-child{transform:rotateY(-3deg) rotateX(0deg) translateZ(0);}
.mc-preview.pv-phone-duo .phone-3d img{width:100%;height:100%;object-fit:cover;object-position:top;}

/* ── Pre-rendered device mockups (bezel already in the PNG — no CSS frame) ── */
.mc-preview.pv-shots{background:radial-gradient(ellipse 80% 62% at 50% 42%,#E8E8E4,#F5F5F3);display:flex;align-items:center;justify-content:center;gap:16px;perspective:1000px;padding:12px 10px;}
.mc-preview.pv-shots img{height:97%;width:auto;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 22px 44px rgba(0,0,0,.75));transition:transform .45s cubic-bezier(.25,.46,.45,.94);}
.mc-preview.pv-shots img:first-child{transform:rotateY(7deg) rotateX(1deg) translateZ(-14px);}
.mc-preview.pv-shots img:last-child{transform:rotateY(-7deg) rotateX(1deg) translateZ(-14px);}
.module-card:hover .mc-preview.pv-shots img:first-child{transform:rotateY(3deg) rotateX(0) translateZ(0);}
.module-card:hover .mc-preview.pv-shots img:last-child{transform:rotateY(-3deg) rotateX(0) translateZ(0);}
/* Single-shot variant */
.mc-preview.pv-shots video{height:97%;width:auto;object-fit:cover;flex-shrink:0;border-radius:9px;filter:drop-shadow(0 22px 44px rgba(0,0,0,.75));transition:transform .45s cubic-bezier(.25,.46,.45,.94);background:#0A0D14;}
.mc-preview.pv-shots video:first-child{transform:rotateY(7deg) rotateX(1deg) translateZ(-14px);}
.mc-preview.pv-shots video:last-child{transform:rotateY(-7deg) rotateX(1deg) translateZ(-14px);}
.module-card:hover .mc-preview.pv-shots video:first-child{transform:rotateY(3deg) rotateX(0) translateZ(0);}
.module-card:hover .mc-preview.pv-shots video:last-child{transform:rotateY(-3deg) rotateX(0) translateZ(0);}
.mc-preview.pv-widget{aspect-ratio:5/4;background:radial-gradient(ellipse 80% 62% at 50% 42%,#E8E8E4,#F5F5F3);display:flex;align-items:center;justify-content:center;padding:18px;overflow:hidden;}
.mc-preview.pv-widget > div{width:100%;max-width:340px;max-height:100%;overflow:auto;border-radius:10px;box-shadow:0 12px 32px -12px rgba(0,0,0,.25);}
@media(max-width:820px){.mc-preview.pv-widget{padding:12px;}}
.mc-preview.pv-shots.solo img{height:99%;transform:none;}
.module-card:hover .mc-preview.pv-shots.solo img{transform:translateY(-3px);}
.mc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.mc-layer{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--muted);}
.mc-live,.mc-demo{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--cyan);display:flex;align-items:center;gap:6px;text-transform:uppercase;}
.mc-live .dot,.mc-demo .dot{width:5px;height:5px;border-radius:50%;background:#0D9488;box-shadow:0 0 8px rgba(13,148,136,.4);display:inline-block;}
.mc-demo{color:var(--muted);}
.mc-demo .dot{background:var(--amber);box-shadow:0 0 8px var(--amber-glow);}
/* Hero module — TruInspect ships in every tier, so it leads the layer. */
.module-card.mc-key{border-color:rgba(11,124,114,.22);background:linear-gradient(180deg,var(--cyan-soft),var(--surface-card));}
.module-card.mc-key:hover{border-color:var(--cyan);}
.mc-tier{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);padding:3px 9px;border-radius:100px;border:1px solid rgba(13,148,136,.2);background:rgba(13,148,136,.06);white-space:nowrap;}
.mc-soon{color:var(--faint);}
.mc-name{font-family:var(--display);font-size:24px;letter-spacing:-.03em;font-weight:400;font-variation-settings:"opsz" 72,"SOFT" 30;margin-bottom:10px;}
.mc-outcome{font-size:14px;line-height:1.5;color:var(--white-dim);margin-bottom:18px;}
.mc-meta{list-style:none;display:flex;flex-wrap:wrap;gap:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:22px;padding:0;}
.mc-meta li{padding:5px 10px;border-radius:100px;border:1px solid rgba(0,0,0,.08);background:rgba(0,0,0,.02);white-space:nowrap;}
.mc-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:14px;border-top:1px solid var(--glass-line);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;}
.mc-link{color:var(--cyan);}
.mc-more{color:var(--muted);}
.mc-link:hover,.mc-more:hover{color:var(--white);}

.how{background:linear-gradient(180deg,transparent,rgba(13,148,136,.03) 40%,transparent);}
.how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px;}
@media(max-width:820px){.how-steps{grid-template-columns:1fr;}}
.step{padding:32px 28px;border-radius:16px;border:1px solid var(--glass-border);background:var(--surface-card);position:relative;box-shadow:var(--glass-shadow);}
.step-num{font-family:var(--mono);font-size:11px;color:var(--cyan);letter-spacing:.2em;margin-bottom:20px;}
.step h3{font-size:22px;font-weight:500;letter-spacing:-.01em;margin-bottom:12px;}
.step p{font-size:14.5px;line-height:1.55;color:var(--white-dim);}
.step-time{margin-top:20px;padding-top:16px;border-top:1px solid var(--glass-line);font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;}

.cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:56px;}
@media(max-width:960px){.cases-grid{grid-template-columns:1fr;}}
.case{padding:28px;border-radius:18px;border:1px solid var(--glass-border);background:var(--surface-card);backdrop-filter:none;box-shadow:var(--glass-shadow);transition:all .3s cubic-bezier(.22,1,.36,1);}
.case:hover{border-color:rgba(11,124,114,.35);transform:translateY(-2px);box-shadow:var(--glass-shadow-hover);}
.case-preview{position:relative;width:100%;aspect-ratio:16/10;border-radius:12px;overflow:hidden;border:1px solid rgba(0,0,0,.08);background:#EFEBE0;margin-bottom:18px;box-shadow:inset 0 1px 0 rgba(232,234,230,.05);}
.case-preview iframe{position:absolute;top:0;left:0;width:1280px;height:800px;border:0;transform-origin:top left;pointer-events:none;background:#FBF9F3;transition:transform .4s ease;}
.case-preview video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;transition:transform .4s ease;}
.case:hover .case-preview video{transform:scale(1.03);}
.case-preview::after{content:'OPEN LIVE ↗';display:none;position:absolute;top:10px;right:10px;padding:5px 10px;border-radius:100px;background:rgba(248,245,238,.9);backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,.06);font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;color:var(--cyan);opacity:0;transition:opacity .3s;pointer-events:none;}
.case:hover .case-preview::after{opacity:1;}
.case:hover .case-preview iframe{filter:brightness(1.05);}
.case-logo{height:38px;display:flex;align-items:center;margin-bottom:16px;}
.case-logo img{max-height:38px;max-width:170px;width:auto;object-fit:contain;}
.case-logo.ycg{gap:10px;}
.case-logo.ycg svg{width:34px;height:34px;flex:none;}
.case-logo.ycg .yt{font-family:var(--sans);font-weight:800;line-height:.92;letter-spacing:.02em;}
.case-logo.ycg .yt .p{display:block;font-size:12px;color:var(--white);}
.case-logo.ycg .yt .s{display:block;font-size:14px;color:#e2273b;}
.case-region{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:14px;}
.case h3{font-size:22px;font-weight:600;margin-bottom:8px;letter-spacing:-.01em;}
.case .role{font-size:13px;color:var(--muted);margin-bottom:16px;font-family:var(--mono);letter-spacing:.05em;}
.case p{font-size:14.5px;line-height:1.55;color:var(--white-dim);margin-bottom:22px;}
.case-did{margin-bottom:18px;padding-top:14px;border-top:1px solid var(--glass-line);}
.case-did .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);display:block;margin-bottom:8px;}
.case-win{display:flex;align-items:center;gap:9px;margin-bottom:18px;padding:11px 14px;border-radius:12px;border:1px solid rgba(13,148,136,.15);background:rgba(13,148,136,.05);font-size:13px;line-height:1.4;color:var(--white);}
.case-win .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);flex:none;}
.case-win b{color:var(--cyan);font-weight:600;}
.case-did ul{list-style:none;display:grid;gap:5px;}
.case-did li{font-size:13px;line-height:1.4;color:var(--white-dim);padding-left:16px;position:relative;}
.case-did li::before{content:"→";position:absolute;left:0;color:var(--faint);}
.case-modules{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:22px;}
.case-modules span{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;border-radius:100px;border:1px solid var(--glass-line);color:var(--muted);}
.case-cta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);display:inline-flex;align-items:center;gap:8px;}

/* ─── FOUNDER · EDITORIAL SPREAD ────────────────── */

.urgency{position:relative;z-index:2;padding:100px 32px;background:linear-gradient(180deg,#0F1923 0%,#162233 100%);overflow:hidden;}
.urgency::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 30% 40%,rgba(13,148,136,.08),transparent 60%),radial-gradient(ellipse 40% 50% at 80% 60%,rgba(212,148,42,.06),transparent 60%);}
.urgency-inner{position:relative;max-width:1340px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;}
.urgency-left{display:flex;flex-direction:column;gap:28px;}
.urgency-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#D4942A;}
.urgency h2{font-family:var(--display);font-size:clamp(28px,3vw,42px);line-height:1.1;letter-spacing:-.03em;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;color:#F1F5F9;}
.urgency h2 em{font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;color:#5EEAD4;}
.urgency-lede{font-size:16px;line-height:1.65;color:rgba(241,245,249,.65);max-width:520px;}
.urgency-cards{display:flex;flex-direction:column;}
.urgency-card{position:relative;padding:26px 0 26px 4px;border-top:1px solid rgba(255,255,255,.1);display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:baseline;transition:padding-left .45s cubic-bezier(.22,1,.36,1);}
.urgency-card:last-child{border-bottom:1px solid rgba(255,255,255,.1);}
.urgency-card:hover{padding-left:14px;}
.urgency-card::after{content:"";position:absolute;left:0;top:-1px;width:0;height:1px;background:linear-gradient(90deg,#5EEAD4,transparent);transition:width .55s cubic-bezier(.22,1,.36,1);}
.urgency-card:hover::after{width:100%;}
.urgency-ic{font-family:var(--display);font-size:34px;font-weight:300;font-variation-settings:"opsz" 144,"SOFT" 30;letter-spacing:-.04em;line-height:1;color:rgba(94,234,212,.32);transition:color .45s;}
.urgency-card:hover .urgency-ic{color:#5EEAD4;}
.urgency-ic.teal{}
.urgency-ic.amber{}
.urgency-ic.red{}
.urgency-ic svg{display:none;}
.urgency-card h3{font-family:var(--display);font-size:21px;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;letter-spacing:-.022em;color:#F1F5F9;margin-bottom:7px;line-height:1.2;}
.urgency-card p{font-size:14px;line-height:1.62;color:rgba(241,245,249,.58);max-width:44ch;text-wrap:pretty;}
.urgency-cta{display:inline-flex;align-items:center;gap:10px;margin-top:12px;padding:14px 28px;border-radius:100px;background:var(--cyan);color:#fff;font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:-.01em;box-shadow:0 6px 20px -8px var(--cyan-glow);transition:all .25s cubic-bezier(.22,1,.36,1);text-decoration:none;}
.urgency-cta:hover{background:var(--cyan-hover);transform:translateY(-2px);box-shadow:0 8px 28px -8px var(--cyan-glow);}
@media(max-width:960px){.urgency-inner{grid-template-columns:1fr;gap:40px;}}
.trust-badges{position:relative;z-index:2;padding:44px 32px;background:#EAE6DA;border-bottom:1px solid rgba(0,0,0,.06);}
[data-theme="dark"] .trust-badges{background:rgba(0,0,0,.25);border-bottom:1px solid rgba(255,255,255,.08);}
.trust-badges-inner{max-width:1340px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;}
.trust-badge, [data-theme="dark"] .trust-badge{display:flex !important;flex-direction:row !important;align-items:center !important;gap:14px !important;padding:14px 22px !important;border-radius:14px !important;background:#FBF9F3 !important;border:1px solid rgba(60,50,30,.15) !important;box-shadow:0 4px 14px rgba(0,0,0,.14) !important;flex:0 1 auto !important;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1) !important;}
.trust-badge:hover, [data-theme="dark"] .trust-badge:hover{transform:translateY(-2px) !important;box-shadow:0 8px 24px rgba(0,0,0,.2) !important;}
.trust-badge-ic{width:40px !important;height:40px !important;min-width:40px !important;max-width:40px !important;border-radius:10px !important;display:grid !important;place-items:center !important;flex-shrink:0 !important;}
.trust-badge-ic.teal{background:rgba(13,148,136,.12) !important;}
.trust-badge-ic.amber{background:rgba(212,148,42,.14) !important;}
.trust-badge-ic.green{background:rgba(34,197,94,.14) !important;}
.trust-badge-ic svg{width:22px !important;height:22px !important;min-width:22px !important;max-width:22px !important;display:block !important;}
.trust-badge-text{display:flex !important;flex-direction:column !important;gap:3px !important;text-align:left !important;}
.trust-badge-text b{display:block !important;font-family:var(--sans) !important;font-size:13.5px !important;font-weight:700 !important;color:#1A1A2E !important;line-height:1.25 !important;white-space:nowrap !important;}
.trust-badge-text span{display:block !important;font-family:var(--mono) !important;font-size:10.5px !important;letter-spacing:.08em !important;text-transform:uppercase !important;color:#475569 !important;line-height:1.2 !important;white-space:nowrap !important;}
@media(max-width:640px){.trust-badges-inner{gap:12px;}.trust-badge{flex:1 1 calc(50% - 12px) !important;min-width:140px;padding:12px 14px !important;}}

.founder{position:relative;z-index:2;padding:clamp(80px,9vw,130px) 0;background:#1E2836 !important;overflow:hidden;max-width:none;margin:0;display:block;}
.founder::before{content:'';position:absolute;inset:0;background:
  radial-gradient(ellipse 60% 45% at 20% 30%,rgba(79,227,220,.08),transparent 60%),
  radial-gradient(ellipse 40% 50% at 85% 70%,rgba(240,179,65,.06),transparent 60%);
  pointer-events:none;}
.founder-inner{position:relative;max-width:1340px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,5vw,80px);align-items:start;}
.founder-side{position:relative;padding-top:20px;}
.founder-mono{width:200px;height:200px;border:1px solid rgba(255,255,255,.18);border-radius:50%;display:grid;place-items:center;position:relative;margin-bottom:32px;background:radial-gradient(circle at 40% 30%,rgba(13,148,136,.15),transparent 60%);}
.founder-mono::before,.founder-mono::after{content:'';position:absolute;inset:14px;border:1px solid rgba(232,234,230,.15);border-radius:50%;}
.founder-mono::after{inset:28px;border-color:rgba(232,234,230,.08);}
.founder-meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(148,163,184,.8);display:grid;gap:14px;max-width:280px;}
.founder-meta .row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid rgba(255,255,255,.12);}
.founder-meta .row:last-child{border-bottom:1px solid rgba(255,255,255,.12);}
.founder-meta .row .k{color:#94A3B8 !important;}
.founder-meta .row .v{color:#F1F5F9 !important;letter-spacing:.08em;font-weight:600;}
.founder-body{position:relative;padding-top:40px;}
.founder-body::before{content:'"';position:absolute;top:-30px;left:-8px;font-family:var(--display);font-size:180px;line-height:1;font-weight:400;font-style:italic;color:#5EEAD4;opacity:.2;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;pointer-events:none;user-select:none;}
.founder-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#F59E0B !important;margin-bottom:18px;display:flex;align-items:center;gap:12px;font-weight:700;}
.founder-eyebrow::before{content:'';width:24px;height:2px;background:#F59E0B;}
.founder-quote{font-family:var(--display);font-size:clamp(24px,2.6vw,38px);line-height:1.24;letter-spacing:-.025em;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;color:#FFFFFF !important;margin-bottom:32px;text-wrap:balance;}
.founder-quote em{font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;color:#5EEAD4 !important;font-weight:500;}
.founder-attr{display:flex;align-items:baseline;gap:14px;margin-bottom:28px;padding-top:22px;border-top:1px solid rgba(255,255,255,.15);}
.founder-attr .name{font-family:var(--display);font-size:20px;font-weight:600;letter-spacing:-.015em;color:#FFFFFF !important;}
.founder-attr .role{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#94A3B8 !important;}
.founder-note{font-size:15.5px;line-height:1.65;color:rgba(241,245,249,.85) !important;max-width:580px;}
.founder-note em{font-style:italic;color:#FFFFFF !important;font-weight:600;}
@media(max-width:820px){
  .founder-inner{grid-template-columns:1fr;gap:36px;}
  .founder-mono{width:140px;height:140px;margin:0 auto 24px;}
  .founder-side{padding-top:0;text-align:center;}
  .founder-meta{margin:0 auto;}
  .founder-body{padding-top:0;}
  .founder-body::before{font-size:120px;top:-20px;left:-4px;}
}

.final{padding:120px 32px;text-align:center;background:radial-gradient(ellipse 60% 100% at 50% 50%,rgba(13,148,136,.04),transparent);border-top:1px solid rgba(0,0,0,.06);}
.final h2{font-family:var(--display);font-size:clamp(32px,4.6vw,62px);line-height:1.02;letter-spacing:-.035em;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;max-width:820px;margin:0 auto 22px;text-wrap:balance;}
.final p{font-size:17px;color:var(--white-dim);max-width:560px;margin:0 auto 36px;}
.final .btn{padding:18px 32px;font-size:15px;}
.call-guard{margin-top:28px;display:flex;flex-direction:column;align-items:center;gap:10px;}
.call-btn{padding:15px 26px;font-size:14.5px;display:inline-flex;align-items:center;gap:10px;transition:all .25s;}
.call-ic{font-size:16px;line-height:1;}
.call-guard.armed .call-btn{border-color:var(--cyan);color:var(--cyan);background:rgba(79,227,220,.07);}
.call-guard.armed .call-btn .call-ic{animation:callPulse 1s ease-in-out infinite;}
@keyframes callPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.18);}}
.call-note{font-size:12px;color:var(--muted);max-width:340px;}

.footer{position:relative;z-index:2;padding:60px 32px 40px;border-top:1px solid var(--border);background:#EAE6DA;color:#14141F;}
[data-theme="dark"] .footer{background:#0B0F17;color:#F1F5F9;border-top:1px solid rgba(255,255,255,.08);}
.footer-inner{max-width:1340px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;}
@media(max-width:820px){.footer-inner{grid-template-columns:1fr 1fr;gap:32px;}}
.footer h5{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;}
[data-theme="dark"] .footer h5{color:rgba(148,163,184,.85);}
.footer .logo-3d .tru{background:linear-gradient(180deg,#1E293B 0%,#334155 40%,#64748B 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.footer .logo-3d .dealer{background:linear-gradient(180deg,#0D9488 0%,#0F766E 50%,#115E59 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
[data-theme="dark"] .footer .logo-3d .tru{background:linear-gradient(180deg,#FFFFFF 0%,#E2E8F0 40%,#94A3B8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
[data-theme="dark"] .footer .logo-3d .dealer{background:linear-gradient(180deg,#5EEAD4 0%,#14B8A6 50%,#0D9488 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.footer-brand p{font-size:13px;color:var(--white-dim);line-height:1.5;margin-top:12px;max-width:280px;}
[data-theme="dark"] .footer-brand p{color:rgba(241,245,249,.65);}
.footer ul{list-style:none;display:grid;gap:8px;}
.footer a{font-size:13.5px;color:var(--white-dim);transition:color .2s;}
.footer a:hover{color:var(--cyan);}
[data-theme="dark"] .footer a{color:rgba(241,245,249,.75);}
[data-theme="dark"] .footer a:hover{color:#5EEAD4;}
.footer-bottom{max-width:1340px;margin:40px auto 0;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
[data-theme="dark"] .footer-bottom{border-top:1px solid rgba(255,255,255,.1);color:rgba(148,163,184,.7);}
.trust{color:var(--muted);}
.trust .cyan{color:var(--cyan);}
[data-theme="dark"] .trust .cyan{color:#5EEAD4;}

/* ─── WHATSAPP FAB · SA + UK ─────────────────────
   Compact glass circle, same visual language as .book-float.
   Right rail stacks: book-float 24 → wa-fab 84 → btt 144. */
.wa-fab{position:fixed;bottom:84px;right:24px;z-index:61;display:flex;flex-direction:column;align-items:flex-end;gap:10px;font-family:var(--sans);}
.wa-fab-trigger{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;padding:0;background:rgba(255,255,255,.55);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.75);box-shadow:0 10px 30px -8px rgba(13,148,136,.35),inset 0 1px 0 rgba(255,255,255,.95);cursor:pointer;transition:all .3s cubic-bezier(.22,1,.36,1);}
.wa-fab-trigger:hover,.wa-fab.open .wa-fab-trigger{border-color:rgba(13,148,136,.5);background:rgba(255,255,255,.78);transform:translateY(-3px) scale(1.05);box-shadow:0 16px 40px -8px rgba(13,148,136,.5),inset 0 1px 0 #fff;}
.wa-fab-trigger svg{width:19px;height:19px;fill:#0D9488;transition:transform .3s cubic-bezier(.34,1.4,.64,1);}
.wa-fab.open .wa-fab-trigger svg{transform:rotate(8deg) scale(.94);}
.wa-fab-menu{display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateY(8px) scale(.96);transform-origin:bottom right;pointer-events:none;transition:opacity .25s,transform .25s cubic-bezier(.34,1.4,.64,1);}
.wa-fab.open .wa-fab-menu{opacity:1;transform:none;pointer-events:auto;}
.wa-fab-opt{display:flex;align-items:center;gap:10px;padding:9px 15px 9px 9px;border-radius:100px;background:rgba(251,249,243,.6);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.75);box-shadow:0 8px 24px -8px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.95);color:var(--white-dim);transition:all .28s cubic-bezier(.22,1,.36,1);text-decoration:none;}
.wa-fab-opt:hover{color:var(--white);border-color:rgba(13,148,136,.5);background:rgba(255,255,255,.88);transform:translateY(-3px) scale(1.02);box-shadow:0 14px 34px -8px rgba(13,148,136,.4),inset 0 1px 0 #fff;}
.wa-fab-opt .flag{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:rgba(13,148,136,.08);border:1px solid rgba(13,148,136,.2);flex:none;font-size:13px;line-height:1;}
.wa-fab-opt .label{display:flex;flex-direction:column;line-height:1.15;}
.wa-fab-opt .label b{font-weight:600;font-size:12.5px;color:#1A1A2E;}
.wa-fab-opt .label span{font-family:var(--mono);font-size:9px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;margin-top:2px;}
[data-theme="dark"] .wa-fab-trigger{background:rgba(21,34,50,.85);border-color:rgba(255,255,255,.15);box-shadow:0 10px 30px -8px rgba(13,148,136,.5),inset 0 1px 0 rgba(255,255,255,.1);}
[data-theme="dark"] .wa-fab-trigger:hover,[data-theme="dark"] .wa-fab.open .wa-fab-trigger{background:rgba(21,34,50,.95);border-color:rgba(13,148,136,.6);}
[data-theme="dark"] .wa-fab-opt{background:rgba(21,34,50,.92);border-color:rgba(255,255,255,.12);color:var(--white);box-shadow:0 8px 24px -8px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08);}
[data-theme="dark"] .wa-fab-opt:hover{background:rgba(21,34,50,.98);border-color:rgba(13,148,136,.6);color:#fff;}
[data-theme="dark"] .wa-fab-opt .label b{color:#fff;}
@media(max-width:600px){.wa-fab{bottom:76px;right:16px;} .wa-fab-trigger{width:40px;height:40px;} .wa-fab-opt .label span{display:none;}}

.book-float{position:fixed;bottom:24px;right:24px;z-index:60;display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:11px 20px 11px 11px;border-radius:100px;background:rgba(251,249,243,.6);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.75);box-shadow:0 10px 30px -8px rgba(212,148,42,.28),inset 0 1px 0 rgba(255,255,255,.95);color:var(--white-dim);font-size:12.5px;font-weight:500;letter-spacing:.01em;transition:all .28s cubic-bezier(.22,1,.36,1);}
.book-float:hover{color:var(--white);border-color:rgba(212,148,42,.55);background:rgba(255,255,255,.88);transform:translateY(-3px) scale(1.02);box-shadow:0 16px 38px -8px rgba(212,148,42,.45),inset 0 1px 0 #fff;}
.book-float .ic{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(212,148,42,.08);border:1px solid rgba(212,148,42,.2);flex:none;transition:background .25s,border-color .25s;}
.book-float:hover .ic{background:rgba(240,179,65,.16);border-color:rgba(240,179,65,.55);}
.book-float .ic svg{width:15px;height:15px;stroke:#D4942A;fill:none;stroke-width:1.8;}
[data-theme="dark"] .book-float{background:rgba(21,34,50,.85);border-color:rgba(255,255,255,.15);color:var(--white);box-shadow:0 10px 30px -8px rgba(212,148,42,.4),inset 0 1px 0 rgba(255,255,255,.1);}
[data-theme="dark"] .book-float:hover{background:rgba(21,34,50,.95);border-color:rgba(212,148,42,.6);color:#fff;}
@media(max-width:600px){.book-float span:last-child{display:none;}.book-float{padding:9px;bottom:20px;right:16px;}.book-float .ic{width:26px;height:26px;}}

/* ─── TRUCHAT WIDGET ────────────────────────────── */
.tc{position:fixed;bottom:72px;left:24px;z-index:65;font-family:var(--sans);}
.tc-launcher{display:flex;align-items:center;justify-content:center;width:56px;height:56px;padding:0;background:rgba(255,255,255,.62);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(13,148,136,.4);border-radius:50%;color:#1A1A2E;cursor:pointer;box-shadow:0 8px 24px -8px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.95);transition:all .3s;animation:tcGlow 3s infinite alternate;}.tc-launcher span{display:none;}
.tc-launcher:hover{transform:translateY(-2px);border-color:rgba(13,148,136,.5);}
.tc-launcher img,.tc-launcher svg.tc-icon{width:34px;height:34px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(79,227,220,.4);}
.tc-head svg.tc-icon{width:36px;height:36px;border-radius:50%;}
.founder-mono svg.td-monolith{width:100px;height:100px;}
@keyframes tcGlow{0%{box-shadow:0 4px 16px -4px rgba(13,148,136,.15);}100%{box-shadow:0 6px 24px -4px rgba(13,148,136,.2),0 0 0 4px rgba(13,148,136,.06);}}
.tc.open .tc-launcher{display:none;}
.tc-panel{display:none;flex-direction:column;width:min(380px,calc(100vw - 32px));height:min(560px,calc(100vh - 48px));background:rgba(255,255,255,.97);backdrop-filter:blur(24px) saturate(1.4);border:1px solid rgba(0,0,0,.08);border-radius:20px;overflow:hidden;box-shadow:0 12px 48px -12px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.5);}
.tc.open .tc-panel{display:flex;animation:tcIn .4s cubic-bezier(.34,1.4,.64,1);}
@keyframes tcIn{from{opacity:0;transform:translateY(20px) scale(.96);}}
.tc-head{padding:16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(0,0,0,.06);background:linear-gradient(135deg,rgba(13,148,136,.06),transparent);}
.tc-head img{width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(79,227,220,.5);}
.tc-head .info{flex:1;}
.tc-head .info b{display:block;font-size:14px;font-weight:600;color:#1A1A2E;}
.tc-head .info span{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:#0D9488;text-transform:uppercase;display:flex;align-items:center;gap:5px;margin-top:2px;}
.tc-head .info span::before{content:'';width:6px;height:6px;background:var(--cyan);border-radius:50%;box-shadow:0 0 8px var(--cyan);}
.tc-head .x{width:32px;height:32px;border-radius:8px;background:rgba(0,0,0,.04);color:#1A1A2E;font-size:18px;display:grid;place-items:center;cursor:pointer;transition:background .2s;}
.tc-head .x:hover{background:rgba(0,0,0,.08);}
.tc-body{flex:1;padding:16px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;}
.tc-body::-webkit-scrollbar{width:6px;}
.tc-body::-webkit-scrollbar-thumb{background:rgba(0,0,0,.1);border-radius:3px;}
.tc-bub{max-width:80%;padding:10px 14px;border-radius:14px;font-size:13.5px;line-height:1.45;animation:tcBub .3s ease-out;}
@keyframes tcBub{from{opacity:0;transform:translateY(6px);}}
.tc-bub.a{align-self:flex-start;background:rgba(13,148,136,.08);border:1px solid rgba(13,148,136,.12);border-bottom-left-radius:4px;color:#1A1A2E;}
.tc-bub.u{align-self:flex-end;background:#0D9488;color:#fff;border-bottom-right-radius:4px;}
.tc-quick{padding:10px 16px 4px;display:flex;flex-wrap:wrap;gap:6px;border-top:1px solid rgba(0,0,0,.06);}
.tc-quick button{padding:7px 12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#64748B;background:rgba(0,0,0,.02);border:1px solid rgba(0,0,0,.08);border-radius:100px;cursor:pointer;transition:all .2s;}
.tc-quick button:hover{border-color:#0D9488;color:#0D9488;}
.tc-input{padding:12px 16px 16px;display:flex;gap:8px;}
.tc-input input{flex:1;padding:11px 14px;border-radius:100px;background:rgba(11,124,114,.02);border:1px solid rgba(0,0,0,.08);color:#1A1A2E;font-family:var(--sans);font-size:13px;outline:none;transition:border-color .2s;}
/* Visible keyboard focus everywhere */
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:4px;}
.tru-cursor{position:fixed;top:0;left:0;width:26px;height:26px;border-radius:50%;border:1.5px solid rgba(13,148,136,.65);background:rgba(13,148,136,.06);backdrop-filter:blur(2px);pointer-events:none;z-index:9999;transform:translate(-50%,-50%) scale(.6);opacity:0;transition:opacity .35s,width .25s,height .25s,background .25s,border-color .25s;mix-blend-mode:normal;}
.tru-cursor.on{opacity:1;transform:translate(-50%,-50%) scale(1);}
.tru-cursor.big{width:56px;height:56px;background:rgba(13,148,136,.12);border-color:rgba(13,148,136,.85);}
.tru-cursor-dot{position:fixed;top:0;left:0;width:5px;height:5px;border-radius:50%;background:#0D9488;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);opacity:0;transition:opacity .35s;}
.tru-cursor-dot.on{opacity:1;}
@media(hover:none),(max-width:820px){.tru-cursor,.tru-cursor-dot{display:none;}}
.skip-link{position:absolute;top:-60px;left:16px;z-index:300;padding:10px 18px;background:var(--cyan);color:var(--ink);border-radius:0 0 10px 10px;font-size:14px;font-weight:600;transition:top .2s;}
.skip-link:focus{top:0;}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
  html{scroll-behavior:auto;}
  .reveal,.hero-badge{opacity:1!important;transform:none!important;}
}
.tc-input input:focus{border-color:#0D9488;}
.tc-input button{padding:11px 16px;border-radius:100px;background:#0D9488;color:#fff;font-weight:600;font-size:13px;cursor:pointer;transition:transform .2s;}
.tc-input button:hover{transform:translateY(-1px);}
@media(max-width:600px){
  .tc{position:static;}
  .tc-launcher,.tc-proactive,.wa-fab,.book-float{display:none !important;}
  .tc-panel{position:fixed;top:12px;bottom:72px;left:12px;right:12px;width:auto;height:auto;z-index:10000;}
  .btt{bottom:74px;right:16px;}
}

.reveal{opacity:0;transform:translateY(24px);}
.reveal.visible{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease;}
.splash{display:none!important;}

/* ─── SCROLL REEL ───────────────────────────────── */
.reel{position:relative;z-index:2;background:linear-gradient(180deg,var(--ink),var(--ink-subtle) 50%,var(--ink));border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
[data-theme="dark"] .reel{background:linear-gradient(180deg,#0E1620,#152232 50%,#0E1620);border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06);}
.reel-intro{max-width:1340px;margin:0 auto;padding:120px 32px 40px;}
.scene{position:relative;height:220vh;}
.scene-pin{position:sticky;top:0;height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:60px;align-items:center;max-width:1340px;margin:0 auto;padding:0 32px;overflow:visible;}
.scene-pin > *{min-width:0;}
.scene-copy{position:relative;z-index:2;}
.scene-num{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--cyan);margin-bottom:16px;}
.scene-copy h3{font-family:var(--display);font-size:clamp(28px,3.4vw,46px);line-height:1.02;letter-spacing:-.035em;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;margin-bottom:18px;text-wrap:balance;color:var(--white);}
.scene-copy p{font-size:16.5px;line-height:1.55;color:var(--white-dim);max-width:460px;margin-bottom:24px;}
.scene-caption{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px;}
.scene-caption .bar{flex:1;max-width:180px;height:1px;background:var(--glass-line);position:relative;overflow:hidden;}
.scene-caption .bar-fill{position:absolute;left:0;top:0;bottom:0;width:0%;background:var(--cyan);}
.scene-stage{position:relative;height:80vh;display:grid;place-items:center;overflow:visible;}
/* At narrow desktop widths, shrink the phone so it can't overrun into the copy column. */
@media(max-width:1080px){.phone{width:min(260px,42vw);} .scene-copy p{max-width:100%;} .scene-pin{gap:32px;}}
@media(max-width:520px){.phone{width:min(240px,75vw);} .dms{aspect-ratio:auto;min-height:300px;} .scene-pin{padding:40px 16px;} .scene-copy h3{font-size:24px;}}
@media(max-width:820px){.scene{height:auto;min-height:auto;} .scene-pin{position:relative;height:auto;grid-template-columns:1fr;gap:32px;padding:60px 20px;overflow:visible;} .scene-stage{height:auto;min-height:auto;overflow:visible;} .phone{width:min(260px,75vw);}}

/* ── Scene 1: TruFlow DMS mockup ── */
.dms{position:relative;width:100%;max-width:640px;aspect-ratio:4/3;background:#1A1F2E;color:#F1F5F9;border-radius:14px;border:1px solid var(--glass-line);overflow:hidden;box-shadow:0 40px 100px -40px rgba(0,0,0,.9),inset 0 1px 0 rgba(232,234,230,.05);font-family:var(--sans);}
.dms-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:1px solid var(--glass-line);background:#1E2433;}
.dms-bar span{width:9px;height:9px;border-radius:50%;background:#2A303A;}
.dms-bar .url{margin-left:12px;font-family:var(--mono);font-size:10.5px;color:var(--muted);letter-spacing:.06em;}
.dms-body{display:grid;grid-template-columns:150px 1fr;height:calc(100% - 33px);}
.dms-side{background:#0A0D14;border-right:1px solid var(--glass-line);padding:14px 10px;display:flex;flex-direction:column;gap:4px;font-size:11.5px;}
.dms-side .brand{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:#0D9488;margin-bottom:14px;padding:0 8px;}
.dms-side a{padding:8px 10px;border-radius:6px;color:rgba(241,245,249,.7);display:flex;align-items:center;gap:8px;}
.dms-side a::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--faint);}
.dms-side a.act{background:rgba(79,227,220,.08);color:#F1F5F9;}
.dms-side a.act::before{background:var(--cyan);}
.dms-main{padding:16px;display:grid;grid-template-rows:auto auto 1fr;gap:12px;overflow:hidden;}
.dms-h{display:flex;justify-content:space-between;align-items:center;}
.dms-h .t{font-size:14px;font-weight:600;color:#F1F5F9;}
.dms-h .btn-mini{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;padding:6px 10px;border-radius:100px;background:var(--white);color:var(--ink);}
.dms-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.kpi{padding:10px 12px;background:rgba(232,234,230,.03);border:1px solid var(--glass-line);border-radius:8px;opacity:0;transform:translateY(10px);}
.kpi .k{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--muted);margin-bottom:4px;text-transform:uppercase;}
.kpi .v{font-size:18px;font-weight:600;letter-spacing:-.01em;color:#F1F5F9;}
.kpi .v .up{color:var(--cyan);font-size:11px;font-weight:500;margin-left:6px;}
.dms-list{display:grid;gap:6px;overflow:hidden;}
.row{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:9px 12px;background:rgba(232,234,230,.02);border:1px solid var(--glass-line);border-radius:8px;font-size:11.5px;opacity:0;transform:translateX(-14px);}
.row .n{color:#F1F5F9;}
.row .p{font-family:var(--mono);color:var(--white-dim);}
.row .st{font-family:var(--mono);font-size:9px;letter-spacing:.12em;padding:3px 8px;border-radius:100px;text-transform:uppercase;}
.row .st.hot{background:rgba(79,227,220,.14);color:var(--cyan);}
.row .st.new{background:rgba(232,234,230,.08);color:var(--white-dim);}
.row .st.wn{background:rgba(120,255,180,.14);color:#7FFFB4;}

/* ── Scene 2: TruChat phone ── */
.phone{position:relative;width:280px;aspect-ratio:9/19;background:#F7F6F2;border-radius:38px;border:8px solid #2A2F3A;box-shadow:0 20px 60px -20px rgba(60,50,30,.35),inset 0 1px 0 rgba(255,255,255,.6);overflow:hidden;}
.phone{color:#1A1A2E;}
.phone::before{content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);width:80px;height:22px;background:#2A2F3A;border-radius:0 0 14px 14px;z-index:3;}
.chat-head{padding:44px 16px 12px;text-align:center;border-bottom:1px solid rgba(255,255,255,.18);background:linear-gradient(120deg,#0D9488,#115E59);color:#fff;position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:6px;}
.chat-head .avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(79,227,220,.4),0 6px 18px -6px rgba(79,227,220,.55);}
.chat-head .name{font-size:13px;font-weight:700;color:#fff;}
.chat-head .st{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:rgba(255,255,255,.85);text-transform:uppercase;margin-top:2px;display:flex;align-items:center;justify-content:center;gap:5px;}
.chat-head .st .d{width:5px;height:5px;border-radius:50%;background:var(--cyan);}
.chat-body{padding:16px 12px;display:flex;flex-direction:column;gap:8px;height:calc(100% - 78px);overflow-y:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;}
.chat-body::-webkit-scrollbar{display:none;}
.bub{max-width:75%;padding:8px 12px;border-radius:14px;font-size:11.5px;line-height:1.4;opacity:0;transform:translateY(6px);}
.bub.u{align-self:flex-end;background:linear-gradient(120deg,#0D9488,#115E59);color:#fff;border-bottom-right-radius:4px;box-shadow:0 4px 10px -4px rgba(13,148,136,.45);}
.bub.a{align-self:flex-start;background:#FBF9F3;color:#1A1A2E;border:1px solid rgba(60,50,30,.12);border-bottom-left-radius:4px;box-shadow:0 2px 6px rgba(60,50,30,.06);}
.bub .link{display:block;margin-top:6px;font-family:var(--mono);font-size:9.5px;color:var(--cyan);letter-spacing:.06em;}
.typing{display:flex;align-items:center;gap:4px;padding:8px 12px;border-radius:14px;width:fit-content;opacity:0;transform:translateY(6px);margin:4px 0;}
.typing.a{align-self:flex-start;background:rgba(79,227,220,.06);border:1px solid rgba(79,227,220,.12);}
.typing span{width:5px;height:5px;border-radius:50%;background:var(--cyan);animation:typingBounce 1.2s infinite;}
.typing span:nth-child(2){animation-delay:.2s;}
.typing span:nth-child(3){animation-delay:.4s;}
@keyframes typingBounce{0%,80%,100%{transform:scale(0.6);opacity:.4;}40%{transform:scale(1);opacity:1;}}

/* ── Scene 3: TruAfford Embedded ── */
.aff-scene{width:100%;max-width:min(520px,calc(100vw - 40px));}
.aff-panel{background:#F7F6F2;border:1px solid rgba(60,50,30,.12);border-radius:20px;overflow:hidden;box-shadow:0 40px 100px -30px rgba(60,50,30,.35),0 0 0 1px rgba(255,255,255,.5);color:#1A1A2E;font-family:var(--sans);}
.aff-head{position:relative;padding:22px 24px;display:flex;align-items:center;gap:14px;background:linear-gradient(120deg,#0D9488,#115E59);color:#fff;overflow:hidden;}
.aff-head::after{content:'';position:absolute;top:0;left:-60%;width:50%;height:100%;background:linear-gradient(75deg,transparent,rgba(255,255,255,.32),transparent);animation:ltShimmer 3.2s ease-in-out infinite;}
@keyframes ltShimmer{0%{left:-60%;}55%,100%{left:130%;}}
.aff-head b{display:block;font-size:19px;font-weight:800;letter-spacing:-.01em;color:#fff;}
.aff-head span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:rgba(255,255,255,.85);text-transform:uppercase;}
.aff-ico{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);display:grid;place-items:center;color:#fff;flex-shrink:0;}
.aff-ico svg{width:20px;height:20px;}
.aff-steps{display:flex;gap:4px;padding:12px 16px 0;}
.aff-step-dot{flex:1;height:3px;border-radius:4px;background:rgba(60,50,30,.14);transition:background .3s;}
.aff-step-dot.on{background:var(--cyan);}
.aff-body{padding:20px 24px;min-height:360px;}
.aff-view{display:none;animation:affIn .4s cubic-bezier(.22,1,.36,1) both;}
.aff-view.on{display:block;}
@keyframes affIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.aff-h{font-size:20px;font-weight:700;letter-spacing:-.02em;margin:0 0 8px;line-height:1.25;}
.aff-p{font-size:14px;color:#3A4553;line-height:1.55;margin:0 0 16px;}
.aff-soft{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px;margin-bottom:18px;background:rgba(13,148,136,.07);border:1px solid rgba(13,148,136,.2);font-size:12.5px;color:#3A4553;line-height:1.45;}
.aff-soft svg{width:18px;height:18px;flex-shrink:0;margin-top:2px;stroke:var(--cyan);}
.aff-field{margin-bottom:16px;}
.aff-field label{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#243040;margin:0 0 8px;}
.aff-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.aff-row output{font-weight:700;font-size:14px;color:#1A1A2E;font-family:var(--sans);}
.aff-track{position:relative;height:5px;background:rgba(60,50,30,.14);border-radius:100px;}
.aff-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,#0D9488,#5EEAD4);border-radius:100px;width:0%;}
.aff-knob{position:absolute;top:50%;left:0%;width:18px;height:18px;background:#FBF9F3;border:1.5px solid #0D9488;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 4px rgba(13,148,136,.15),0 4px 12px rgba(60,50,30,.25);}
.aff-actions{display:flex;gap:10px;margin-top:6px;}
.aff-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 16px;border-radius:12px;font-weight:700;font-size:13.5px;transition:all .25s;cursor:pointer;border:0;font-family:var(--sans);}
.aff-btn-primary{background:linear-gradient(120deg,#0D9488,#115E59);color:#fff;box-shadow:0 10px 26px -10px rgba(13,148,136,.55);}
.aff-btn-primary:hover{filter:brightness(1.1);transform:translateY(-2px);}
.aff-btn-ghost{background:#FBF9F3;color:#1A1A2E;border:1.5px solid rgba(0,0,0,.1);}
.aff-btn-ghost:hover{background:#F1F0EC;border-color:rgba(13,148,136,.35);}
.aff-btn-wa{background:linear-gradient(145deg,#34d399,#059669);color:#fff;box-shadow:0 10px 28px -10px rgba(16,185,129,.4);}
.aff-pills{display:flex;flex-wrap:wrap;gap:8px;}
.aff-pill{padding:10px 14px;border-radius:100px;font-size:12.5px;font-weight:700;border:1.5px solid rgba(0,0,0,.1);background:#FBF9F3;color:#55637A;transition:all .25s;cursor:pointer;font-family:var(--sans);}
.aff-pill.on{background:linear-gradient(120deg,#0D9488,#115E59);color:#fff;border-color:transparent;box-shadow:0 8px 20px -8px rgba(13,148,136,.5);}
.aff-result{border-radius:16px;padding:20px;margin-bottom:16px;background:linear-gradient(160deg,rgba(212,148,42,.09),rgba(13,148,136,.05),#fff);border:1px solid rgba(212,148,42,.28);}
.aff-band{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;border-radius:100px;margin-bottom:12px;background:rgba(240,179,65,.14);color:var(--amber);border:1px solid rgba(240,179,65,.28);}
.aff-band.tight{background:rgba(220,90,90,.12);color:#fca5a5;border-color:rgba(220,90,90,.28);}
.aff-big{font-family:var(--display);font-size:38px;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;letter-spacing:-.035em;line-height:1.05;margin:8px 0 4px;background:linear-gradient(120deg,#FFE7B3,var(--amber) 45%,#FF9F5A);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.aff-range{font-size:13px;color:var(--muted);margin-bottom:16px;}
.aff-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.aff-metric{padding:12px;border-radius:12px;background:rgba(0,0,0,.25);border:1px solid var(--glass-line);}
.aff-metric .k{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.aff-metric .v{font-size:16px;font-weight:700;margin-top:4px;color:var(--white);}
.aff-fine{font-size:11px;color:var(--muted);line-height:1.5;margin-top:14px;}
.aff-input{width:100%;padding:13px 15px;border-radius:12px;border:1.5px solid rgba(0,0,0,.12);background:#FBF9F3;color:#1A1A2E;font:500 14px var(--sans);outline:none;transition:border-color .2s,box-shadow .2s;}
.aff-input:focus{border-color:#0D9488;box-shadow:0 0 0 3px rgba(13,148,136,.15);}
.aff-foot{padding:14px 16px;border-top:1px solid rgba(0,0,0,.08);background:#EFEBE0;font-family:var(--sans);font-size:13px;letter-spacing:0;text-transform:none;color:#55637A;text-align:center;}
.aff-foot b{color:#0B7C72;font-weight:700;}
@media(max-width:520px){.aff-scene{max-width:100%;} .aff-panel{border-radius:12px;max-width:calc(100vw - 32px);max-height:80vh;overflow-y:auto;} .aff-panel .aff-form{padding:16px;} .aff-panel .aff-result{padding:16px;}}

/* ─── SPLASH INTRO — 3D SAAS ────────────────────── */
.splash{position:fixed;inset:0;z-index:200;background:radial-gradient(ellipse 70% 50% at 50% 40%,#0A0F1A 0%,var(--ink) 65%),var(--ink);display:grid;place-items:center;overflow:hidden;pointer-events:auto;perspective:1600px;perspective-origin:50% 45%;}

/* Perspective floor grid receding to horizon */
.splash-floor{position:absolute;left:-50%;right:-50%;bottom:-30%;height:100%;background:
  linear-gradient(rgba(79,227,220,.35) 1px,transparent 1px) 0 0/60px 60px,
  linear-gradient(90deg,rgba(79,227,220,.28) 1px,transparent 1px) 0 0/60px 60px;
  transform:rotateX(68deg);mask-image:linear-gradient(180deg,transparent 0,#000 30%,#000 60%,transparent 90%);animation:floorScan 6s linear infinite;will-change:background-position;}
@keyframes floorScan{to{background-position:0 60px,60px 0;}}

/* Scan-line horizon glow */
.splash-horizon{position:absolute;left:0;right:0;top:50%;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 40px var(--cyan);opacity:.6;}

/* HUD crosshair */
.splash-hud{position:absolute;inset:0;pointer-events:none;font-family:var(--mono);font-size:9px;letter-spacing:.24em;color:rgba(79,227,220,.55);text-transform:uppercase;}
.splash-hud .corner{position:absolute;width:28px;height:28px;border:1px solid rgba(13,148,136,.25);}
.splash-hud .tl{top:24px;left:24px;border-right:0;border-bottom:0;}
.splash-hud .tr{top:24px;right:24px;border-left:0;border-bottom:0;}
.splash-hud .bl{bottom:24px;left:24px;border-right:0;border-top:0;}
.splash-hud .br{bottom:24px;right:24px;border-left:0;border-top:0;}
.splash-hud .tag-tl{position:absolute;top:24px;left:60px;}
.splash-hud .tag-tr{position:absolute;top:24px;right:60px;text-align:right;}
.splash-hud .tag-bl{position:absolute;bottom:24px;left:60px;}
.splash-hud .tag-br{position:absolute;bottom:24px;right:60px;text-align:right;}
.splash-hud .blink{color:var(--cyan);animation:hudBlink 1.4s steps(2) infinite;}
@keyframes hudBlink{50%{opacity:0;}}

/* Orbital rings */
.splash-orbs{position:absolute;inset:0;pointer-events:none;will-change:transform;}
.splash-orbs .orb{position:absolute;top:50%;left:50%;width:520px;height:520px;border:1px solid rgba(79,227,220,.15);border-radius:50%;transform:translate(-50%,-50%) rotateX(72deg) rotateZ(0);animation:orbSpin 14s linear infinite;will-change:transform;}
.splash-orbs .orb::before{content:'';position:absolute;top:-5px;left:50%;width:10px;height:10px;background:var(--cyan);border-radius:50%;box-shadow:0 0 24px var(--cyan);transform:translateX(-50%);}
.splash-orbs .orb.o2{display:none;}
.splash-orbs .orb.o3{width:320px;height:320px;border-color:rgba(79,227,220,.22);animation-duration:9s;}
@keyframes orbSpin{to{transform:translate(-50%,-50%) rotateX(72deg) rotateZ(360deg);}}
.splash-streams{display:none;}


/* Data streams */
.splash-streams{position:absolute;inset:0;pointer-events:none;overflow:hidden;font-family:var(--mono);font-size:10px;color:rgba(79,227,220,.35);}
.splash-streams span{position:absolute;white-space:nowrap;animation:streamFly linear infinite;}
@keyframes streamFly{from{transform:translateY(-20px);opacity:0;}10%{opacity:1;}90%{opacity:1;}to{transform:translateY(100vh);opacity:0;}}

.splash-stage{position:relative;transform-style:preserve-3d;text-align:center;z-index:2;}
/* Legacy .splash-line chrome CSS removed — the splash now uses the PNG logo. */
.splash-tag{margin-top:36px;font-family:var(--mono);font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:var(--muted);opacity:0;display:flex;align-items:center;justify-content:center;gap:14px;}
.splash-tag::before,.splash-tag::after{content:'';width:40px;height:1px;background:linear-gradient(90deg,transparent,var(--cyan));}
.splash-tag::after{background:linear-gradient(-90deg,transparent,var(--cyan));}

.splash-skip{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase;opacity:0;animation:fadeInSkip 1s ease 1.2s forwards;cursor:pointer;pointer-events:auto;transition:color .2s;}
.splash-skip:hover{color:var(--cyan);}
@keyframes fadeInSkip{to{opacity:1;}}
.splash-bar{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);width:240px;height:1px;background:rgba(232,234,230,.08);overflow:hidden;}
.splash-bar::after{content:'';position:absolute;left:0;top:0;bottom:0;width:0%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);animation:splashLoad 1.8s cubic-bezier(.7,0,.3,1) forwards;}
@keyframes splashLoad{to{width:100%;}}
.splash-wipe{position:absolute;inset:0;background:var(--ink);transform:translateY(100%);}

/* ─── SCROLL PROGRESS ───────────────────────────── */
.scroll-prog{position:fixed;top:0;left:0;right:0;height:2px;background:transparent;z-index:100;}
.scroll-prog-fill{height:100%;width:100%;background:linear-gradient(90deg,var(--cyan),#7FFFB4);box-shadow:0 0 12px var(--cyan);transform:scaleX(0);transform-origin:left;will-change:transform;}

/* ─── CUSTOM 3D LOGO STYLING ─────────────────────── */
.logo-3d{display:inline-flex;align-items:baseline;font-weight:800;letter-spacing:-.03em;line-height:1;user-select:none;}
.logo-3d .tru{background:linear-gradient(180deg,#1E293B 0%,#334155 40%,#64748B 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:none;position:relative;}
.logo-3d .dealer{background:linear-gradient(180deg,#0D9488 0%,#0F766E 50%,#115E59 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:none;}
[data-theme="dark"] .logo-3d .tru{background:linear-gradient(180deg,#FFFFFF 0%,#E2E8F0 40%,#94A3B8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
[data-theme="dark"] .logo-3d .dealer{background:linear-gradient(180deg,#5EEAD4 0%,#14B8A6 50%,#0D9488 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.navbar-logo{font-size:32px;}
.footer-logo{font-size:42px;margin-bottom:14px;}

/* ─── CHAPTER MARKERS ───────────────────────────── */
.chapter{position:relative;z-index:2;padding:80px 32px;text-align:center;overflow:hidden;background:transparent;}
.chapter::before,.chapter::after{content:'';position:absolute;left:50%;top:0;width:1px;height:40px;background:linear-gradient(180deg,transparent,var(--cyan));}
.chapter::after{top:auto;bottom:0;background:linear-gradient(0deg,transparent,var(--cyan));}
.chapter-inner{max-width:960px;margin:0 auto;position:relative;}

/* ── Urgency ── */
.urgency{position:relative;z-index:2;padding:100px 32px;background:linear-gradient(180deg,#0F1923 0%,#162233 100%);overflow:hidden;}
.urgency::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 30% 40%,rgba(13,148,136,.08),transparent 60%),radial-gradient(ellipse 40% 50% at 80% 60%,rgba(212,148,42,.06),transparent 60%);}
.urgency-inner{position:relative;max-width:1340px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;}
.urgency-left{display:flex;flex-direction:column;gap:28px;}
.urgency-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#D4942A;}
.urgency h2{font-family:var(--display);font-size:clamp(28px,3vw,42px);line-height:1.1;letter-spacing:-.03em;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;color:#F1F5F9;}
.urgency h2 em{font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;color:#5EEAD4;}
.urgency-lede{font-size:16px;line-height:1.65;color:rgba(241,245,249,.65);max-width:520px;}
.urgency-cards{display:flex;flex-direction:column;}
.urgency-card{position:relative;padding:26px 0 26px 4px;border-top:1px solid rgba(255,255,255,.1);display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:baseline;transition:padding-left .45s cubic-bezier(.22,1,.36,1);}
.urgency-card:last-child{border-bottom:1px solid rgba(255,255,255,.1);}
.urgency-card:hover{padding-left:14px;}
.urgency-card::after{content:"";position:absolute;left:0;top:-1px;width:0;height:1px;background:linear-gradient(90deg,#5EEAD4,transparent);transition:width .55s cubic-bezier(.22,1,.36,1);}
.urgency-card:hover::after{width:100%;}
.urgency-ic{font-family:var(--display);font-size:34px;font-weight:300;font-variation-settings:"opsz" 144,"SOFT" 30;letter-spacing:-.04em;line-height:1;color:rgba(94,234,212,.32);transition:color .45s;}
.urgency-card:hover .urgency-ic{color:#5EEAD4;}
.urgency-ic.teal{}
.urgency-ic.amber{}
.urgency-ic.red{}
.urgency-ic svg{display:none;}
.urgency-card h3{font-family:var(--display);font-size:21px;font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;letter-spacing:-.022em;color:#F1F5F9;margin-bottom:7px;line-height:1.2;}
.urgency-card p{font-size:14px;line-height:1.62;color:rgba(241,245,249,.58);max-width:44ch;text-wrap:pretty;}
.urgency-cta{display:inline-flex;align-items:center;gap:10px;margin-top:12px;padding:14px 28px;border-radius:100px;background:var(--cyan);color:#fff;font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:-.01em;box-shadow:0 6px 20px -8px var(--cyan-glow);transition:all .25s cubic-bezier(.22,1,.36,1);text-decoration:none;}
.urgency-cta:hover{background:var(--cyan-hover);transform:translateY(-2px);box-shadow:0 8px 28px -8px var(--cyan-glow);}
@media(max-width:960px){.urgency-inner{grid-template-columns:1fr;gap:40px;}}
/* ── Trust badges ── */
.trust-badges{position:relative;z-index:2;padding:48px 32px;background:#EAE6DA;border-bottom:1px solid rgba(0,0,0,.06);}
.trust-badges-inner{max-width:1340px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:40px;flex-wrap:wrap;}
.trust-badge{display:flex;align-items:center;gap:12px;padding:12px 20px;border-radius:12px;border:1px solid rgba(60,50,30,.1);background:#FBF9F3;box-shadow:0 2px 7px rgba(60,50,30,.06);}
.trust-badge-ic{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;flex-shrink:0;}
.trust-badge-ic.teal{background:rgba(13,148,136,.1);}
.trust-badge-ic.amber{background:rgba(212,148,42,.1);}
.trust-badge-ic.green{background:rgba(34,197,94,.1);}
.trust-badge-ic svg{width:18px;height:18px;}
.trust-badge-text{display:flex;flex-direction:column;gap:1px;}
.trust-badge-text b{font-size:13px;font-weight:600;color:#1A1A2E;}
.trust-badge-text span{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(84,98,120,.85);}
@media(max-width:640px){.trust-badges-inner{gap:16px;}.trust-badge{flex:1;min-width:140px;}}
.chapter-num{font-family:var(--mono);font-size:11px;letter-spacing:.4em;color:var(--cyan);margin-bottom:14px;}
.chapter-title{font-family:var(--display);font-size:clamp(26px,3.2vw,42px);font-weight:400;letter-spacing:-.025em;line-height:1.15;color:var(--white);font-variation-settings:"opsz" 144,"SOFT" 30;text-wrap:balance;}
.chapter-title .light{color:var(--muted);font-weight:300;font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100;}
.chapter-line{max-width:280px;height:1px;margin:22px auto 0;background:linear-gradient(90deg,transparent,var(--glass-line),transparent);}

/* ─── STAT COUNTERS ─────────────────────────────── */
.stats{position:relative;z-index:2;padding:100px 32px;max-width:1340px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;background:var(--ink);}
@media(max-width:820px){.stats{grid-template-columns:repeat(2,1fr);gap:32px;padding:60px 20px;}}
.stat{padding:24px 12px;border-left:1px solid var(--glass-line);}
.stat:first-child{border-left:0;}
@media(max-width:820px){.stat{border-left:0;border-top:1px solid var(--glass-line);padding-top:24px;} .stat:first-child,.stat:nth-child(2){border-top:0;padding-top:0;}}
.stat .n{font-family:var(--display);font-size:clamp(42px,4.8vw,64px);font-weight:400;font-variation-settings:"opsz" 144,"SOFT" 30;letter-spacing:-.035em;line-height:1;color:var(--white);margin-bottom:12px;font-variant-numeric:tabular-nums;}
.stat .n .plus{color:var(--amber);font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100;}
.stat .l{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}

/* ─── MAGNETIC / TILT HELPERS ───────────────────── */
.module-card{will-change:transform;transform-style:preserve-3d;perspective:600px;}
.mc-name,.mc-outcome{transform:translateZ(20px);}
.btn,.nav-cta,.proof-link{will-change:transform;}


/* ─── TACTILE AUDIO SYNTH & HAPTIC FEEDBACK ──────── */
(function(){
  var audioCtx = null;
  function playTactileClick() {
    try {
      if (!audioCtx) {
        var AudioContext = window.AudioContext || window.webkitAudioContext;
        if (AudioContext) audioCtx = new AudioContext();
      }
      if (audioCtx && audioCtx.state === 'suspended') {
        audioCtx.resume();
      }
      if (audioCtx) {
        var osc = audioCtx.createOscillator();
        var gain = audioCtx.createGain();
        osc.type = 'sine';
        osc.frequency.setValueAtTime(1400, audioCtx.currentTime);
        osc.frequency.exponentialRampToValueAtTime(350, audioCtx.currentTime + 0.025);
        gain.gain.setValueAtTime(0.035, audioCtx.currentTime);
        gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 0.025);
        osc.connect(gain);
        gain.connect(audioCtx.destination);
        osc.start();
        osc.stop(audioCtx.currentTime + 0.025);
      }
    } catch(e){}
    // Mobile haptic pulse
    if (typeof navigator !== 'undefined' && navigator.vibrate) {
      navigator.vibrate(10);
    }
  }

  // Bind tactile click to all module tabs and primary buttons
  document.querySelectorAll('.mod-tab-btn, .tt-tab, .curr-btn, .card-toggle').forEach(function(btn){
    btn.addEventListener('click', playTactileClick);
  });
})();

/* ─── STICKY MOBILE BAR SCROLL TRIGGER ───────────── */
(function(){
  var bar = document.getElementById('mobileStickyBar');
  if (!bar) return;
  var hero = document.querySelector('.hero');
  var threshold = 350;
  window.addEventListener('scroll', function(){
    if (window.scrollY > threshold) {
      bar.classList.add('visible');
    } else {
      bar.classList.remove('visible');
    }
  }, {passive:true});
})();


/* ─── 1. SMART NAV ──────────────────────────────── */
.nav{transition:transform .4s cubic-bezier(.25,.46,.45,.94),opacity .4s;}
.nav.nav--hidden{transform:translateY(-120%);opacity:0;pointer-events:none;}



/* ─── 2. BACK-TO-TOP ────────────────────────────── */
.btt{position:fixed;bottom:200px;right:24px;z-index:55;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.75);box-shadow:0 10px 30px -8px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.95);display:grid;place-items:center;cursor:pointer;opacity:0;transform:translateY(12px);pointer-events:none;transition:all .35s cubic-bezier(.22,1,.36,1);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);}
@media(max-width:600px){.btt{bottom:176px;right:16px;width:40px;height:40px;}}
.btt:hover{border-color:rgba(13,148,136,.5);background:rgba(255,255,255,.8);transform:translateY(-3px) scale(1.05);box-shadow:0 16px 38px -8px rgba(13,148,136,.4),inset 0 1px 0 #fff;}
.btt.visible{opacity:1;transform:translateY(0);pointer-events:auto;}
.btt svg{width:18px;height:18px;stroke:var(--cyan);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}

/* ─── 3. HERO SCROLL CUE ────────────────────────── */
.scroll-cue{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:8px;opacity:0;animation:fadeInCue 1s ease 2.2s forwards;pointer-events:none;}
.scroll-cue span{font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}
.scroll-cue .mouse{width:20px;height:32px;border:1.5px solid rgba(148,163,184,.5);border-radius:12px;position:relative;}
.scroll-cue .mouse::after{content:'';position:absolute;top:6px;left:50%;transform:translateX(-50%);width:3px;height:6px;background:var(--cyan);border-radius:2px;animation:mouseWheel 1.6s ease-in-out infinite;}
@keyframes fadeInCue{to{opacity:1;}}
@keyframes mouseWheel{0%{top:6px;opacity:1;}80%{top:16px;opacity:0;}100%{top:6px;opacity:0;}}

/* ─── 4. MOBILE NAV SCROLLSPY ───────────────────── */
.nav-mobile a.active{color:var(--cyan);background:rgba(79,227,220,.08);}

/* ─── 5. STEP CONNECTORS ────────────────────────── */
.how-steps{position:relative;}
.step-connector{position:absolute;top:50%;left:33.33%;width:33.33%;height:2px;transform:translateY(-50%);background:linear-gradient(90deg,var(--glass-line),var(--cyan),var(--glass-line));opacity:0;transition:opacity .6s ease;}
.step-connector.visible{opacity:1;}
.step-connector::before,.step-connector::after{content:'';position:absolute;top:50%;width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);transform:translateY(-50%) scale(0);transition:transform .5s ease .3s;}
.step-connector::before{left:0;}.step-connector::after{right:0;}
.step-connector.visible::before,.step-connector.visible::after{transform:translateY(-50%) scale(1);}
@media(max-width:820px){.step-connector{display:none;}}

/* ─── 6. PROACTIVE TRUCHAT BUBBLE ───────────────── */
.tc-proactive{position:absolute;bottom:calc(100% + 14px);left:0;white-space:nowrap;padding:10px 16px;border-radius:14px;background:rgba(255,255,255,.95);border:1px solid rgba(13,148,136,.15);backdrop-filter:blur(12px);font-size:13px;color:#1A1A2E;box-shadow:0 8px 24px rgba(0,0,0,.1);opacity:0;transform:translateY(8px) scale(.96);pointer-events:none;transition:all .4s cubic-bezier(.34,1.4,.64,1);}
.tc-proactive.visible{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;cursor:pointer;}
.tc-proactive::after{content:'';position:absolute;bottom:-6px;left:24px;width:10px;height:10px;background:var(--glass);border-right:1px solid var(--cyan-soft);border-bottom:1px solid var(--cyan-soft);transform:rotate(45deg);}
.tc-proactive .dismiss{position:absolute;top:-8px;right:-8px;width:20px;height:20px;border-radius:50%;background:var(--ink);border:1px solid var(--glass-line);display:grid;place-items:center;font-size:11px;color:var(--muted);cursor:pointer;transition:all .2s;}
.tc-proactive .dismiss:hover{color:var(--white);border-color:var(--cyan);}

/* ─── 7. MODULE CARD GLOW SWEEP ─────────────────── */
.module-card{overflow:hidden;position:relative;}
.module-card::before{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(79,227,220,.08),transparent);transform:skewX(-20deg);pointer-events:none;transition:left .7s cubic-bezier(.25,.46,.45,.94);z-index:1;}
.module-card:hover::before{left:150%;}

/* ─── HAMBURGER & MOBILE POLISH ─────────────────── */
.nav-mobile a{opacity:0;transform:translateX(-12px);transition:opacity .35s ease,transform .35s ease,background .2s,color .2s;}
.nav.open .nav-mobile a{opacity:1;transform:translateX(0);}
.nav.open .nav-mobile a:nth-child(1){transition-delay:.04s;}
.nav.open .nav-mobile a:nth-child(2){transition-delay:.08s;}
.nav.open .nav-mobile a:nth-child(3){transition-delay:.12s;}
.nav.open .nav-mobile a:nth-child(4){transition-delay:.16s;}
.nav.open .nav-mobile a:nth-child(5){transition-delay:.20s;}
.nav.open .nav-mobile a:nth-child(6){transition-delay:.24s;}

/* ─── CUSTOM LUXURY CURSOR & 3D SYSTEM (desktop only) ─── */
@media(pointer:fine){
  .cursor-glow{
    position:fixed;
    width:32px;
    height:32px;
    border:1.5px solid rgba(94,234,212,0.45);
    border-radius:50%;
    pointer-events:none;
    z-index:99999;
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
    transition:transform .22s cubic-bezier(.22,1,.36,1), opacity .25s ease, background .22s ease, border-color .22s ease;
    mix-blend-mode:normal;
    opacity:0;
    will-change:transform, left, top;
    box-shadow:0 0 16px rgba(13,148,136,0.25);
  }
  .cursor-glow.active{opacity:1;}
  .cursor-glow.hover{
    transform:scale(1.8);
    background:rgba(94,234,212,0.12);
    border-color:rgba(94,234,212,0.85);
    box-shadow:0 0 24px rgba(13,148,136,0.45);
  }
  .cursor-glow-dot{
    position:fixed;
    width:5px;
    height:5px;
    background:#2DD4BF;
    border-radius:50%;
    pointer-events:none;
    z-index:99999;
    box-shadow:0 0 8px #2DD4BF, 0 0 16px rgba(45,212,191,0.8);
    opacity:0;
    will-change:transform, left, top;
  }
  .cursor-glow-dot.active{opacity:1;}
  .cursor-glow.text-mode,.cursor-glow-dot.text-mode{opacity:0!important;}
}

/* 3D tilt perspective wrapper */
[data-tilt]{
  transform-style:preserve-3d;
  transition:transform .2s cubic-bezier(.22,1,.36,1);
  will-change:transform;
}

/* Global Shimmer Utility */
.shimmer-active{
  position:relative;
  overflow:hidden;
}
.shimmer-active::after{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:60%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
  animation:btnShimmer 4s infinite;
  pointer-events:none;
}
@keyframes btnShimmer{
  0%{left:-100%;}
  30%,100%{left:200%;}
}

/* ─── DESKTOP-TO-MOBILE QR CODE BRIDGE ──────────── */
.qr-modal{
  position:fixed;
  inset:0;
  z-index:100000;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
  padding:20px;
}
.qr-modal.active{
  opacity:1;
  pointer-events:auto;
}
.qr-backdrop{
  position:absolute;
  inset:0;
  background:rgba(8,12,18,0.85);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.qr-dialog{
  position:relative;
  z-index:2;
  width:100%;
  max-width:380px;
  background:linear-gradient(180deg, #131F2E, #0D1620);
  border:1px solid rgba(94,234,212,0.35);
  border-radius:24px;
  padding:32px 28px 24px;
  box-shadow:0 32px 80px rgba(0,0,0,0.85), 0 0 40px -8px rgba(13,148,136,0.4);
  text-align:center;
  color:#FFFFFF;
  transform:scale(0.95) translateY(10px);
  transition:transform .3s cubic-bezier(.22,1,.36,1);
}
.qr-modal.active .qr-dialog{
  transform:scale(1) translateY(0);
}
.qr-close{
  position:absolute;
  top:16px;
  right:16px;
  width:32px;
  height:32px;
  border-radius:50%;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.12);
  color:#FFFFFF;
  font-size:18px;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:all .2s;
}
.qr-close:hover{
  background:rgba(255,255,255,0.18);
  transform:scale(1.08);
}
.qr-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#5EEAD4;
  background:rgba(13,148,136,0.22);
  border:1px solid rgba(94,234,212,0.35);
  padding:4px 12px;
  border-radius:100px;
  margin-bottom:12px;
}
.qr-title{
  font-size:20px;
  font-weight:700;
  letter-spacing:-.02em;
  margin:0 0 8px;
}
.qr-sub{
  font-size:13px;
  line-height:1.5;
  color:rgba(255,255,255,0.72);
  margin:0 0 20px;
}
.qr-code-wrap{
  width:180px;
  height:180px;
  margin:0 auto 20px;
  padding:12px;
  background:#FBF9F3;
  border-radius:16px;
  box-shadow:0 12px 32px rgba(0,0,0,0.4);
  display:grid;
  place-items:center;
}
.qr-code-wrap img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}
.qr-actions{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.qr-direct-link{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:11px 16px;
  border-radius:100px;
  background:var(--cyan);
  color:#FFFFFF;
  font-size:13px;
  font-weight:600;
  text-decoration:none;
  transition:all .2s;
}
.qr-direct-link:hover{
  background:var(--cyan-hover);
  transform:translateY(-1px);
}
.qr-hint{
  font-family:var(--mono);
  font-size:10px;
  color:rgba(255,255,255,0.5);
  letter-spacing:.04em;
}

/* Card QR trigger button */
.hss-qr-btn, .sandbox-qr-btn{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-family:var(--mono);
  font-size:10.5px;
  font-weight:600;
  color:#5EEAD4;
  background:rgba(13,148,136,0.18);
  border:1px solid rgba(94,234,212,0.3);
  padding:5px 10px;
  border-radius:100px;
  cursor:pointer;
  transition:all .2s;
  text-decoration:none;
  margin-top:8px;
}
.hss-qr-btn:hover, .sandbox-qr-btn:hover{
  background:rgba(13,148,136,0.35);
  border-color:#5EEAD4;
  transform:translateY(-1px);
}



/* ─── 1. WA TEST DRIVE PILL ──────────────────────── */
.wa-test-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:linear-gradient(135deg, rgba(37,211,102,0.16), rgba(5,150,105,0.12));
  border:1px solid rgba(37,211,102,0.4);
  color:#25D366;
  font-family:var(--mono);
  font-size:11.5px;
  font-weight:600;
  padding:8px 16px;
  border-radius:100px;
  text-decoration:none;
  transition:all .25s ease;
  box-shadow:0 4px 14px rgba(37,211,102,0.15);
}
.wa-test-pill:hover{
  background:linear-gradient(135deg, #25D366, #059669);
  color:#FFFFFF;
  border-color:#25D366;
  transform:translateY(-2px);
  box-shadow:0 8px 24px -4px rgba(37,211,102,0.45);
}
.wa-test-pill svg{
  width:16px;
  height:16px;
  fill:currentColor;
  flex-shrink:0;
}

/* ─── 2. STICKY MOBILE BOTTOM BAR ────────────────── */
.mobile-sticky-bar{
  display:none !important;
}

@media(max-width:820px){
  body{padding-bottom:70px !important;}
  footer, .footer{padding-bottom:90px !important;}
  .wa-fab{display:none !important;}
  .book-float{bottom:80px !important;}
  .btt{bottom:140px !important;}
}

/* ─── 4. BEFORE VS AFTER COMPARISON SECTION ───────── */
.compare-deal-section{
  padding:90px 24px;
  max-width:1240px;
  margin:0 auto;
}
.cds-wrap{
  background:var(--surface-card);
  border:1px solid var(--glass-border);
  border-radius:28px;
  padding:48px 36px;
  box-shadow:var(--glass-shadow);
  position:relative;
  overflow:hidden;
}
.cds-head{
  text-align:center;
  max-width:760px;
  margin:0 auto 40px;
}
.cds-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  position:relative;
}
.cds-col{
  border-radius:22px;
  padding:32px 28px;
  display:flex;
  flex-direction:column;
  position:relative;
}
.cds-col.before{
  background:rgba(239,68,68,0.06);
  border:1px solid rgba(239,68,68,0.18);
}
.cds-col.after{
  background:linear-gradient(180deg, rgba(13,148,136,0.08), rgba(13,148,136,0.03));
  border:2px solid var(--cyan);
  box-shadow:0 16px 44px -10px var(--cyan-glow);
}
.cds-col-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-family:var(--mono);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:5px 12px;
  border-radius:100px;
  margin-bottom:16px;
  width:fit-content;
}
.cds-col.before .cds-col-badge{
  background:rgba(239,68,68,0.1);
  color:#DC2626;
  border:1px solid rgba(239,68,68,0.2);
}
.cds-col.after .cds-col-badge{
  background:rgba(13,148,136,0.12);
  color:#0B7C72;
  border:1px solid rgba(13,148,136,0.25);
}
.cds-col-title{
  font-size:22px;
  font-weight:700;
  letter-spacing:-.02em;
  color:var(--white);
  margin:0 0 10px;
}
.cds-col-desc{
  font-size:14px;
  line-height:1.55;
  color:var(--white-dim);
  margin:0 0 24px;
}
.cds-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.cds-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  font-size:13.5px;
  line-height:1.5;
}
.cds-col.before .cds-item{
  color:var(--white-dim);
}
.cds-col.before .cds-item strong{
  color:var(--white);
}
.cds-col.after .cds-item{
  color:var(--white);
}
.cds-col.after .cds-item strong{
  color:var(--white);
}
.cds-icon{
  width:22px;
  height:22px;
  border-radius:50%;
  display:grid;
  place-items:center;
  flex-shrink:0;
  font-size:12px;
  font-weight:700;
  margin-top:1px;
}
.cds-col.before .cds-icon{
  background:rgba(239,68,68,0.1);
  color:#DC2626;
  border:1px solid rgba(239,68,68,0.2);
}
.cds-col.after .cds-icon{
  background:rgba(13,148,136,0.12);
  color:#0B7C72;
  border:1px solid rgba(13,148,136,0.25);
}
[data-theme="dark"] .cds-col-title{color:#F1F5F9;}
[data-theme="dark"] .cds-col-desc{color:rgba(241,245,249,0.75);}
[data-theme="dark"] .cds-col.before{background:rgba(239,68,68,0.08);border-color:rgba(239,68,68,0.25);}
[data-theme="dark"] .cds-col.before .cds-item{color:rgba(241,245,249,0.8);}
[data-theme="dark"] .cds-col.before .cds-item strong{color:#fff;}
[data-theme="dark"] .cds-col.after{background:rgba(13,148,136,0.1);border-color:rgba(13,148,136,0.4);box-shadow:0 16px 44px -10px rgba(13,148,136,0.35);}
[data-theme="dark"] .cds-col.after .cds-col-badge{background:rgba(13,148,136,0.2);color:#5EEAD4;border-color:rgba(94,234,212,0.3);}
[data-theme="dark"] .cds-col.after .cds-item{color:rgba(241,245,249,0.9);}
[data-theme="dark"] .cds-col.after .cds-item strong{color:#fff;}
[data-theme="dark"] .cds-col.after .cds-icon{background:rgba(13,148,136,0.25);color:#5EEAD4;border-color:rgba(94,234,212,0.35);}
.cds-mobile-tabs{
  display:none;
  margin:0 auto 24px;
  background:rgba(0,0,0,0.06);
  padding:4px;
  border-radius:100px;
  border:1px solid var(--border);
  max-width:360px;
  width:100%;
}
[data-theme="dark"] .cds-mobile-tabs{
  background:rgba(255,255,255,0.06);
  border-color:rgba(255,255,255,0.1);
}
.cds-tab-btn{
  flex:1;
  padding:10px 14px;
  border-radius:100px;
  border:none;
  background:transparent;
  font-family:var(--sans);
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  cursor:pointer;
  transition:all .2s ease;
  text-align:center;
}
.cds-tab-btn.active{
  background:#fff;
  color:var(--white);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
[data-theme="dark"] .cds-tab-btn.active{
  background:var(--surface-dark-card);
  color:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.4);
}
.cds-tab-btn[data-cds-target="before"].active{
  color:#DC2626;
}
.cds-tab-btn[data-cds-target="after"].active{
  color:var(--cyan);
}

@media(max-width:820px){
  .cds-mobile-tabs{display:flex;}
  .cds-grid{grid-template-columns:1fr;}
  .cds-col{display:none;animation:cdsFadeIn .3s ease;}
  .cds-col.active{display:flex;}
  .cds-wrap{padding:30px 20px;}
}
@keyframes cdsFadeIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}



.tc-typing{display:inline-flex;align-items:center;gap:4px;padding:12px 16px;min-width:60px;}
.tc-typing .dot{width:6px;height:6px;border-radius:50%;background:#0D9488;opacity:.4;animation:tcTypingDot 1.4s infinite ease-in-out;}
.tc-typing .dot:nth-child(1){animation-delay:0s;}
.tc-typing .dot:nth-child(2){animation-delay:.2s;}
.tc-typing .dot:nth-child(3){animation-delay:.4s;}
@keyframes tcTypingDot{0%,80%,100%{opacity:.3;transform:scale(0.8);}40%{opacity:1;transform:scale(1.2);}}



/* ─── MOBILE AUDIT & FLOATING OVERLAY CLEANUP ───── */
.desktop-only { display: inline-flex !important; }
.mobile-only { display: none !important; }

@media(max-width: 820px), (hover: none) {
  .desktop-only { display: none !important; }
  .mobile-only { display: inline-flex !important; }

  /* Eliminate floating button stacking & collisions on mobile */
  .book-float, .btt, .tc-proactive {
    display: none !important;
  }
  .wa-fab {
    display: none !important; /* WhatsApp is already in the Sticky Bottom Bar */
  }
  .tc {
    bottom: 74px !important;
    right: 14px !important;
    left: auto !important;
  }
  .tc-launcher {
    width: 48px !important;
    height: 48px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.3) !important;
  }
  .tc-launcher img, .tc-launcher svg.tc-icon {
    width: 28px !important;
    height: 28px !important;
  }
  .tc-panel {
    bottom: 76px !important;
    top: 20px !important;
    left: 12px !important;
    right: 12px !important;
    max-height: calc(100vh - 96px) !important;
  }

  /* Optimize floating navbar on small screens */
  .nav-float {
    padding: 6px 10px !important;
  }
  .nav-logo svg {
    height: 24px !important;
  }
  .nav-sandbox-btn {
    padding: 6px 12px !important;
    font-size: 11.5px !important;
  }
}

/* Dual DMS action links in cards */
.hss-dual-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.hss-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 100px;
  text-decoration: none;
  transition: all .2s ease;
}
.hss-action-desktop {
  background: rgba(20, 184, 166, 0.2);
  color: #5EEAD4;
  border: 1px solid rgba(94, 234, 212, 0.35);
}
.hss-action-desktop:hover {
  background: rgba(20, 184, 166, 0.4);
  transform: translateY(-1px);
}
.hss-action-mobile {
  background: rgba(245, 158, 11, 0.18);
  color: #FCD34D;
  border: 1px solid rgba(245, 158, 11, 0.4);
}
.hss-action-mobile:hover {
  background: rgba(245, 158, 11, 0.35);
  transform: translateY(-1px);
}



/* ─── BUTTON BLUE THEME (#07879A) ──────────────── */
:root {
  --blue-primary: #07879A;
  --blue-hover: #056274;
  --blue-glow: rgba(7, 135, 154, 0.35);
}

.btn.btn-primary, 
.btn-primary, 
.mod-btn-primary,
.nav-sandbox-btn:hover,
.msb-sandbox,
.btn.btn-wa,
.msb-wa {
  background: linear-gradient(135deg, #07879A, #056274) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(94, 234, 212, 0.35) !important;
  box-shadow: 0 6px 20px -4px rgba(7, 135, 154, 0.45) !important;
}

.btn.btn-primary:hover, 
.btn-primary:hover, 
.mod-btn-primary:hover,
.btn.btn-wa:hover,
.msb-wa:hover,
.msb-sandbox:hover {
  background: linear-gradient(135deg, #056274, #044957) !important;
  box-shadow: 0 8px 26px -4px rgba(7, 135, 154, 0.6) !important;
  transform: translateY(-2px);
}

/* ─── MASTER MOBILE UI/UX POLISH (5-SCREENSHOT AUDIT) ─── */
@media(max-width: 820px) {
  /* 1. Eliminate ALL overlapping floating buttons on mobile */
  .book-float, 
  .btt, 
  .tc-proactive, 
  .wa-fab,
  .scroll-cue {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
  }

  /* 2. Position the clean TruChat launcher safely above the sticky bottom bar */
  .tc {
    position: fixed !important;
    bottom: 70px !important;
    right: 14px !important;
    left: auto !important;
    z-index: 9995 !important;
  }
  .tc-launcher {
    width: 46px !important;
    height: 46px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.4) !important;
    border: 1px solid rgba(7, 135, 154, 0.5) !important;
  }
  .tc-launcher img, .tc-launcher svg.tc-icon {
    width: 26px !important;
    height: 26px !important;
  }
  .tc-panel {
    position: fixed !important;
    top: 14px !important;
    bottom: 74px !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    height: auto !important;
    max-height: calc(100vh - 88px) !important;
    border-radius: 18px !important;
  }

  /* 3. Hero spacing cleanup: eliminate massive empty gap before #stack */
  .hero {
    padding-top: 76px !important;
    padding-bottom: 24px !important;
    min-height: auto !important;
  }
  .hero-inner {
    padding-bottom: 0 !important;
  }
  .hero-ticker {
    margin-top: 18px !important;
    margin-bottom: 8px !important;
    font-size: 11.5px !important;
    line-height: 1.4 !important;
  }
  .section.stack {
    margin-top: 0 !important;
    padding-top: 32px !important;
  }

  /* 4. Buyer widget tabs (Affordability, Trade-in, Repayments) — 1-row flex fit */
  .tt-tabs {
    display: flex !important;
    width: 100% !important;
    max-width: 360px !important;
    margin: 20px auto 0 !important;
    padding: 4px !important;
    border-radius: 100px !important;
    box-sizing: border-box !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
  }
  .tt-tab {
    flex: 1 1 33.333% !important;
    padding: 8px 6px !important;
    font-size: 10px !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
    text-align: center !important;
    border-radius: 100px !important;
  }

  /* 5. Dark calculator & sandbox cards — compact mobile sizing */
  .tt-stage {
    margin-top: 20px !important;
    min-height: auto !important;
  }
  #repay-home .tr-panel {
    padding: 18px 14px !important;
    border-radius: 18px !important;
  }
  #repay-home .tr-price {
    padding: 10px 14px !important;
    margin-bottom: 12px !important;
  }
  #repay-home .tr-price input {
    font-size: 20px !important;
  }
  #repay-home .tr-slider-row {
    margin-bottom: 12px !important;
  }
  #repay-home .tr-slider-row label {
    font-size: 11.5px !important;
  }
  #repay-home .tr-result {
    padding: 16px 14px !important;
    border-radius: 14px !important;
    margin-bottom: 14px !important;
  }
  #repay-home .tr-inst {
    font-size: 32px !important;
    letter-spacing: -0.02em !important;
  }
  #repay-home .tr-meta {
    font-size: 10.5px !important;
    line-height: 1.4 !important;
  }
  #repay-home .tr-cta {
    padding: 12px 20px !important;
    font-size: 13.5px !important;
  }

  /* 6. Proof & Trust Badges grid — tight, clean 2-column layout */
  .proof {
    display: none !important; /* Eliminate isolated awkward button */
  }
  .logo-ticker {
    margin-bottom: 20px !important;
    padding: 10px 0 !important;
  }
  .trust-badges {
    padding: 28px 16px !important;
  }
  .trust-badges-inner {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
  .trust-badge {
    padding: 10px 12px !important;
    min-width: 0 !important;
    border-radius: 12px !important;
  }
  .trust-badge:last-child:nth-child(odd) {
    grid-column: span 2 !important; /* Center 5th badge if odd */
  }
  .trust-badge-ic {
    width: 28px !important;
    height: 28px !important;
  }
  .trust-badge-ic svg {
    width: 14px !important;
    height: 14px !important;
  }
  .trust-badge-text b {
    font-size: 11.5px !important;
  }
  .trust-badge-text span {
    font-size: 8.5px !important;
  }

  /* 7. Sandbox cards compact padding on mobile */
  .hss-inner {
    padding: 24px 16px !important;
    border-radius: 20px !important;
  }
  .hss-grid {
    gap: 14px !important;
  }
  .hss-card {
    padding: 20px 18px !important;
    border-radius: 16px !important;
  }
  .hss-card-title {
    font-size: 18px !important;
  }
  .hss-card-desc {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }
}


/* ─── SMOOTH SCROLL OFFSET ──────────────────────── */
html{scroll-padding-top:90px;}

/* ─── TEXT SCRAMBLE GLITCH ──────────────────────── */
.scramble-char{display:inline;color:var(--cyan);opacity:.55;font-variant-numeric:tabular-nums;}
.hero-h1[data-scramble]{cursor:default;}

/* ─── LIVE SHOWCASE HERO ────────────────────────── */
.live-showcase{padding:96px 32px;max-width:1340px;margin:0 auto;}
.live-hero-wrap{position:relative;margin-top:48px;border-radius:20px;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.4);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);overflow:hidden;box-shadow:0 30px 90px -30px rgba(13,148,136,.28),0 2px 8px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.95);transition:box-shadow .5s cubic-bezier(.22,1,.36,1),transform .5s cubic-bezier(.22,1,.36,1);}
.live-hero-wrap:hover{transform:translateY(-4px);box-shadow:0 44px 120px -30px rgba(13,148,136,.42),0 4px 14px rgba(0,0,0,.08),inset 0 1px 0 #fff;}
.live-hero-wrap::before{content:'';position:absolute;top:0;left:-40%;width:35%;height:100%;background:linear-gradient(75deg,transparent,rgba(255,255,255,.5),transparent);animation:liveSheen 7s ease-in-out infinite;pointer-events:none;z-index:3;}
@keyframes liveSheen{0%{left:-40%;}45%,100%{left:125%;}}
.live-hero-head{position:relative;z-index:4;display:flex;justify-content:space-between;align-items:center;padding:14px 18px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(241,245,249,.75);background:linear-gradient(180deg,#26303C,#1B242E);border-bottom:1px solid rgba(0,0,0,.35);}
.live-hero-head .live-tag{color:#5EEAD4;display:flex;align-items:center;gap:8px;font-weight:600;}
.live-hero-head .live-tag span{width:7px;height:7px;border-radius:50%;background:#5EEAD4;display:inline-block;animation:livePulse 2s ease-in-out infinite;}
@keyframes livePulse{0%,100%{box-shadow:0 0 0 0 rgba(94,234,212,.55);opacity:1;}50%{box-shadow:0 0 0 7px rgba(94,234,212,0);opacity:.75;}}
.live-hero-frame{height:75vh;min-height:520px;max-height:900px;background:#F3F0E7;position:relative;}
.live-hero-foot{position:relative;z-index:4;display:flex;justify-content:space-between;align-items:center;padding:14px 18px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(148,163,184,.8);border-top:1px solid rgba(0,0,0,.35);background:linear-gradient(0deg,#26303C,#1B242E);}
.live-hero-foot a{color:#5EEAD4;transition:color .2s;}
.live-hero-foot a:hover{color:#F1F5F9;}
@media(max-width:820px){.live-showcase{padding:64px 20px;}.live-hero-frame{height:60vh;min-height:400px;}}

/* ─── IFRAME SKELETON LOADER ─────────────────────── */
.iframe-skeleton{position:absolute;inset:0;background:linear-gradient(90deg,#0A0D14 25%,#111827 50%,#0A0D14 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;z-index:1;pointer-events:none;}
@keyframes shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
.iframe-loaded .iframe-skeleton{opacity:0;transition:opacity .3s ease;}

/* ─── CONTENT VISIBILITY ─────────────────────────── */
.section,.layer,.case,.step,.founder,.final,.footer,.live-showcase{content-visibility:auto;contain-intrinsic-size:auto 300px;}

/* ─── PRINT STYLES ───────────────────────────────── */
@media print{
  .nav,.scroll-prog,.btt,.book-float,.tc,.splash,.grid-overlay,.ambient-vignette,.hero-scene{display:none!important;}
  body{background:#FBF9F3;color:#000;}
  .module-card,.case,.step{break-inside:avoid;border:1px solid #ccc;}
  .hero{min-height:auto;padding-top:40px;}
  a[href]::after{content:" (" attr(href) ")";font-size:80%;color:#666;}
}

/* ─── PAGE TRANSITION ────────────────────────────── */
.page-transition{position:fixed;inset:0;z-index:999;background:var(--ink);opacity:0;pointer-events:none;transition:opacity .4s ease;}
.page-transition.active{opacity:1;}

/* ─── VIDEO GALLERY — unified flow grid ────────── */
.video-gallery{padding:100px 32px 120px;max-width:1400px;margin:0 auto;position:relative;z-index:2;overflow:hidden;}
.vg-intro{max-width:720px;margin:0 auto 64px;text-align:center;}
.vg-intro .eyebrow{margin:0 auto 14px;display:inline-block;}
.vg-intro .section-h2{margin-bottom:14px;}
.vg-intro .section-lede{margin:0 auto;}

/* Signature composition: 5×2 on desktop, 3-across tablet, 2-across mobile. Ten tiles, exactly. */
.vg-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;perspective:1400px;}

/* Each tile — the flow unit. --i drives the reveal-wave stagger. */
.vg-tile{--i:0;position:relative;aspect-ratio:9/16;border-radius:20px;overflow:hidden;background:#0A0D14;
  border:1px solid rgba(0,0,0,.08);box-shadow:0 14px 40px -18px rgba(0,0,0,.32);
  cursor:pointer;padding:0;font:inherit;color:inherit;text-align:left;
  opacity:0;transform:translateY(36px) scale(.95);
  transition:transform .55s cubic-bezier(.22,1,.36,1),box-shadow .5s;
  will-change:transform,opacity;}

/* Reveal wave — left→right, top row first, then bottom */
.vg-tile.in-view{animation:vgReveal .85s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(var(--i) * 90ms);}
@keyframes vgReveal{
  0%{opacity:0;transform:translateY(36px) scale(.95) rotateX(6deg);}
  60%{opacity:1;}
  100%{opacity:1;transform:translateY(0) scale(1) rotateX(0);}
}

/* Idle breathing — subtle, phase-offset per tile so the grid never sits still */
.vg-tile.in-view::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.35) 90%,rgba(0,0,0,.55));
  animation:vgBreathe 9s ease-in-out infinite;animation-delay:calc(var(--i) * 380ms);z-index:1;}
@keyframes vgBreathe{0%,100%{opacity:.85;}50%{opacity:.62;}}

.vg-tile:hover{transform:translateY(-6px) scale(1.015);box-shadow:0 32px 64px -20px rgba(13,148,136,.34);}
.vg-tile:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;}

.vg-tile img.vg-poster,.vg-tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#0A0D14;transition:transform .8s cubic-bezier(.22,1,.36,1);}
.vg-tile:hover img.vg-poster{transform:scale(1.06);}

/* Theme chip — top-left, glassmorphic. Frosted panel over the poster, no colour fill. */
.vg-chip{position:absolute;top:14px;left:14px;padding:6px 12px;border-radius:100px;
  background:rgba(255,255,255,.14);color:#fff;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
  z-index:3;
  backdrop-filter:blur(16px) saturate(180%);
  -webkit-backdrop-filter:blur(16px) saturate(180%);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 6px 18px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.28);}

/* Sequence number — bottom-right, editorial mag detail */
.vg-num{position:absolute;top:14px;right:14px;
  font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.75);
  letter-spacing:.14em;z-index:3;text-shadow:0 1px 4px rgba(0,0,0,.6);}

/* Label — bottom text is hidden; kept in DOM so aria-label / hover title still work but not shown */
.vg-label{display:none;}

/* Play button — restrained, editorial */
.vg-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:54px;height:54px;border-radius:50%;
  background:rgba(255,255,255,.95);color:#0B7C72;
  display:flex;align-items:center;justify-content:center;z-index:3;
  transition:transform .35s cubic-bezier(.22,1,.36,1),background .3s;
  box-shadow:0 10px 28px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.6);pointer-events:none;}
.vg-tile:hover .vg-play{transform:translate(-50%,-50%) scale(1.1);background:#FBF9F3;}
.vg-play svg{width:16px;height:16px;fill:currentColor;margin-left:2px;}

/* ─── 6 CORE MODULES SHOWCASE ───────────────────── */
.mod-showcase{position:relative;margin-top:48px;}
.mod-tabs-nav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:6px;background:rgba(20,20,31,0.04);border:1px solid rgba(0,0,0,0.08);border-radius:100px;margin-bottom:32px;}
.mod-tabs-nav::-webkit-scrollbar{display:none;}
.mod-tab-btn{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:100px;border:1px solid transparent;background:transparent;color:var(--muted);cursor:pointer;transition:all .25s cubic-bezier(.22,1,.36,1);white-space:nowrap;font-family:var(--sans);flex-shrink:0;}
.mod-tab-btn:hover{background:rgba(255,255,255,.8);color:var(--white);border-color:rgba(0,0,0,0.06);}
.mod-tab-btn.active{background:#FBF9F3;color:var(--white);border-color:var(--cyan);box-shadow:0 6px 20px -4px rgba(11,124,114,.2), 0 2px 6px rgba(0,0,0,.04);}
.mod-tab-btn .tab-num{font-family:var(--mono);font-size:10px;letter-spacing:.08em;font-weight:700;padding:3px 7px;border-radius:100px;background:rgba(0,0,0,.05);color:var(--muted);transition:all .2s;}
.mod-tab-btn.active .tab-num{background:var(--cyan);color:#fff;}
.mod-tab-btn .tab-info{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2;}
.mod-tab-btn .tab-name{font-size:13.5px;font-weight:600;color:var(--white);letter-spacing:-.01em;}
.mod-tab-btn.active .tab-name{color:var(--cyan);}
.mod-tab-btn .tab-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.03em;color:var(--muted);text-transform:uppercase;}
.mod-tab-btn:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;}

.mod-panels-wrap{position:relative;}
.mod-panel{display:none;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:44px;align-items:center;background:var(--surface-card);border:1px solid var(--glass-border);border-radius:28px;padding:48px;box-shadow:var(--glass-shadow);position:relative;overflow:hidden;}
.mod-panel.active{display:grid;animation:modFadeIn .35s cubic-bezier(.22,1,.36,1) forwards;}
@keyframes modFadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}

.mod-panel-info{display:flex;flex-direction:column;}
.mod-panel-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);font-weight:700;margin-bottom:14px;background:var(--cyan-soft);border:1px solid rgba(11,124,114,.18);padding:5px 12px;border-radius:100px;width:fit-content;}
.mod-panel-tag .dot{width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:livePulse 2s ease-in-out infinite;}
.mod-panel-title{font-family:var(--display);font-size:clamp(28px,3.2vw,40px);font-weight:400;letter-spacing:-.03em;line-height:1.1;color:var(--white);margin-bottom:12px;font-variation-settings:"opsz" 144,"SOFT" 30;}
.mod-panel-title .accent{color:var(--cyan);font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;}
.mod-panel-lede{font-size:16px;font-weight:500;line-height:1.5;color:var(--white);margin-bottom:14px;}
.mod-panel-desc{font-size:14.5px;line-height:1.6;color:var(--white-dim);margin-bottom:24px;}

.mod-features-list{list-style:none;padding:0;margin:0 0 32px;display:grid;gap:12px;}
.mod-feature-item{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.45;color:var(--white-dim);}
.mod-feature-icon{width:22px;height:22px;border-radius:6px;background:var(--cyan-soft);border:1px solid rgba(11,124,114,.2);display:grid;place-items:center;flex-shrink:0;color:var(--cyan);margin-top:1px;}
.mod-feature-icon svg{width:13px;height:13px;}
.mod-feature-item strong{color:var(--white);font-weight:600;}

.mod-panel-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.mod-btn-primary{display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border-radius:100px;background:var(--cyan);color:#fff;font-size:13.5px;font-weight:600;transition:all .25s cubic-bezier(.22,1,.36,1);box-shadow:0 6px 20px -6px var(--cyan-glow);text-decoration:none;border:0;cursor:pointer;}
.mod-btn-primary:hover{background:var(--cyan-hover);color:#fff;transform:translateY(-2px);box-shadow:0 8px 24px -6px var(--cyan-glow);}
.mod-btn-clip{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:100px;background:rgba(0,0,0,.04);border:1px solid rgba(0,0,0,.1);color:var(--white);font-size:13.5px;font-weight:500;transition:all .25s cubic-bezier(.22,1,.36,1);cursor:pointer;}
.mod-btn-clip:hover{background:rgba(11,124,114,.08);border-color:var(--cyan);color:var(--cyan);transform:translateY(-2px);}
.mod-btn-clip svg{width:15px;height:15px;fill:currentColor;}

.mod-panel-visual{position:relative;display:flex;flex-direction:column;gap:14px;}
.mod-preview-card{position:relative;width:100%;aspect-ratio:16/10;border-radius:20px;overflow:hidden;background:#0E1620;border:1px solid rgba(0,0,0,.12);box-shadow:0 18px 48px -12px rgba(0,0,0,.25);cursor:pointer;display:block;}
.mod-preview-card img,.mod-preview-card video{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .5s cubic-bezier(.22,1,.36,1);}
.mod-preview-card:hover img,.mod-preview-card:hover video{transform:scale(1.03);}
.mod-preview-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,22,32,.2) 0%,rgba(14,22,32,.75) 100%);display:flex;flex-direction:column;justify-content:space-between;padding:18px;pointer-events:none;transition:background .3s;}
.mod-preview-card:hover .mod-preview-overlay{background:linear-gradient(180deg,rgba(14,22,32,.1) 0%,rgba(14,22,32,.65) 100%);}
.mod-preview-top{display:flex;justify-content:space-between;align-items:center;}
.mod-preview-live{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:#5EEAD4;background:rgba(14,22,32,.75);backdrop-filter:blur(8px);border:1px solid rgba(94,234,212,.3);padding:4px 10px;border-radius:100px;display:flex;align-items:center;gap:6px;}
.mod-preview-live .dot{width:5px;height:5px;border-radius:50%;background:#5EEAD4;box-shadow:0 0 6px #5EEAD4;animation:livePulse 2s ease-in-out infinite;}
.mod-preview-badge{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.8);background:rgba(255,255,255,.12);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);padding:4px 10px;border-radius:100px;}
.mod-preview-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;background:rgba(248,245,238,0.95);color:var(--cyan);display:grid;place-items:center;box-shadow:0 12px 32px rgba(0,0,0,.4);transition:transform .3s cubic-bezier(.22,1,.36,1),background .3s;}
.mod-preview-card:hover .mod-preview-center{transform:translate(-50%,-50%) scale(1.12);background:#FBF9F3;color:var(--cyan-hover);}
.mod-preview-center svg{width:20px;height:20px;fill:currentColor;margin-left:3px;}
.mod-preview-bottom{display:flex;justify-content:space-between;align-items:center;}
.mod-preview-label{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:rgba(255,255,255,.9);text-transform:uppercase;font-weight:600;}
.mod-pills-row{display:flex;flex-wrap:wrap;gap:8px;}
.mod-spec-pill{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--muted);background:rgba(11,124,114,.02);border:1px solid rgba(0,0,0,.08);padding:4px 10px;border-radius:100px;white-space:nowrap;}

@media(max-width:1080px){
  .mod-panel{grid-template-columns:1fr;padding:32px;gap:32px;}
}
@media(max-width:768px){
  .mod-panel{padding:24px 20px;border-radius:20px;}
  .mod-panel-title{font-size:26px;}
  .mod-panel-actions{flex-direction:column;align-items:stretch;}
  .mod-btn-primary,.mod-btn-clip{justify-content:center;}
  .mod-tabs-nav{border-radius:18px;padding:6px;gap:6px;}
  .mod-tab-btn{padding:8px 14px;}
  .mod-tab-btn .tab-sub{display:none;}
}

/* ─── VIDEO LIGHTBOX ENHANCED ───────────────────── */
.video-lightbox{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s cubic-bezier(.22,1,.36,1);padding:16px;}
.video-lightbox.active{opacity:1;pointer-events:auto;}
.vl-backdrop{position:absolute;inset:0;background:rgba(10,13,20,.82);backdrop-filter:blur(18px) saturate(180%);-webkit-backdrop-filter:blur(18px) saturate(180%);}
.vl-dialog{position:relative;z-index:1;width:100%;max-width:920px;max-height:calc(100vh - 32px);background:#0E1620;border:1px solid rgba(255,255,255,.14);border-radius:22px;overflow:hidden;box-shadow:0 32px 90px rgba(0,0,0,.85), 0 0 0 1px rgba(0,0,0,.4);display:flex;flex-direction:column;transform:scale(.95) translateY(8px);transition:transform .35s cubic-bezier(.22,1,.36,1);}
.video-lightbox.active .vl-dialog{transform:scale(1) translateY(0);}
.vl-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;background:#152232;border-bottom:1px solid rgba(255,255,255,.08);color:#F1F5F9;}
.vl-badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#5EEAD4;font-weight:700;}
.vl-badge .dot{width:5px;height:5px;border-radius:50%;background:#5EEAD4;animation:livePulse 2s ease-in-out infinite;}
.vl-title{font-size:13.5px;font-weight:600;color:#FFFFFF;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vl-close{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#F1F5F9;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:all .2s;flex-shrink:0;}
.vl-close:hover{background:rgba(255,255,255,.2);color:#fff;transform:scale(1.08);}
.vl-content{position:relative;width:100%;max-height:calc(85vh - 56px);background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.vl-content video{width:100%;max-height:calc(85vh - 56px);object-fit:contain;display:block;}

/* ─── LIVE SANDBOX MODAL ───────────────────────── */
.sandbox-modal{position:fixed;inset:0;z-index:9998;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .3s cubic-bezier(.22,1,.36,1);}
.sandbox-modal.active{opacity:1;pointer-events:auto;}
.sandbox-backdrop{position:absolute;inset:0;background:rgba(10,15,24,.78);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);}
.sandbox-dialog{position:relative;z-index:1;width:100%;max-width:1040px;max-height:calc(100vh - 48px);overflow-y:auto;border-radius:28px;background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.8);box-shadow:0 32px 80px -16px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.06);padding:36px 36px 30px;transform:scale(.95) translateY(12px);transition:transform .35s cubic-bezier(.22,1,.36,1);}
.sandbox-modal.active .sandbox-dialog{transform:scale(1) translateY(0);}
.sandbox-close{position:absolute;top:20px;right:20px;width:38px;height:38px;border-radius:50%;background:rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.08);color:var(--muted);font-size:22px;line-height:1;display:grid;place-items:center;cursor:pointer;transition:all .2s;}
.sandbox-close:hover{background:rgba(0,0,0,.1);color:var(--white);transform:scale(1.05);}
.sandbox-header{margin-bottom:28px;text-align:left;padding-right:44px;}
.sandbox-eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--cyan);font-weight:600;margin-bottom:8px;display:flex;align-items:center;gap:8px;}
.sandbox-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--cyan);animation:livePulse 2s ease-in-out infinite;}
.sandbox-title{font-family:var(--display);font-size:clamp(26px,3vw,34px);font-weight:400;letter-spacing:-.03em;line-height:1.15;color:var(--white);margin-bottom:8px;font-variation-settings:"opsz" 144,"SOFT" 30;}
.sandbox-title .accent{color:var(--cyan);font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;}
.sandbox-sub{font-size:14.5px;line-height:1.55;color:var(--white-dim);max-width:680px;}

.sandbox-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:24px;}
@media(max-width:860px){.sandbox-grid{grid-template-columns:1fr;}}

.sandbox-card{position:relative;display:flex;flex-direction:column;padding:24px;border-radius:20px;background:#FBF9F3;border:1px solid rgba(0,0,0,.08);box-shadow:0 4px 16px rgba(0,0,0,.04);transition:all .28s cubic-bezier(.22,1,.36,1);}
.sandbox-card:hover{border-color:var(--cyan);transform:translateY(-3px);box-shadow:0 16px 36px -10px rgba(11,124,114,.2);}
.sandbox-card-tag{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);background:var(--cyan-soft);border:1px solid rgba(11,124,114,.18);padding:4px 10px;border-radius:100px;width:fit-content;margin-bottom:14px;font-weight:600;}
.sandbox-card-title{font-family:var(--display);font-size:22px;font-weight:500;letter-spacing:-.02em;color:var(--white);margin-bottom:8px;}
.sandbox-card-desc{font-size:13px;line-height:1.5;color:var(--white-dim);margin-bottom:18px;flex:1;}
.sandbox-card-pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px;}
.sandbox-card-pill{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;color:var(--muted);background:rgba(11,124,114,.02);border:1px solid rgba(0,0,0,.06);padding:3px 8px;border-radius:6px;}
.sandbox-card-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:11px 16px;border-radius:100px;font-family:var(--sans);font-size:13px;font-weight:600;background:var(--cyan);color:#fff;box-shadow:0 4px 14px -4px var(--cyan-glow);transition:all .2s;text-decoration:none;}
.sandbox-card-btn:hover{background:var(--cyan-hover);color:#fff;transform:translateY(-1px);box-shadow:0 6px 18px -4px var(--cyan-glow);}

.sandbox-card.featured{background:linear-gradient(180deg,rgba(11,124,114,.06) 0%,#FFFFFF 35%);border-color:rgba(11,124,114,.24);}
.sandbox-card.featured .sandbox-card-tag{background:var(--cyan);color:#fff;border-color:transparent;}

.sandbox-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;border-top:1px solid rgba(0,0,0,.08);font-size:12.5px;color:var(--muted);flex-wrap:wrap;}
.sandbox-foot a{color:var(--cyan);font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.sandbox-foot a:hover{color:var(--cyan-hover);}
@media(max-width:640px){
  .sandbox-dialog{padding:24px 18px 20px;border-radius:20px;}
  .sandbox-header{padding-right:32px;}
  .sandbox-foot{flex-direction:column;align-items:flex-start;gap:8px;}
}

@media(max-width:1100px){.vg-grid{grid-template-columns:repeat(3,1fr);gap:14px;}}
@media(max-width:640px){
  .video-gallery{padding:72px 20px 90px;}
  .vg-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .vg-play{width:44px;height:44px;}.vg-play svg{width:14px;height:14px;}
  .vg-chip{font-size:8.5px;padding:4px 9px;top:10px;left:10px;}
  .vg-num{font-size:9px;top:10px;right:10px;}
  .vg-label{font-size:12.5px;padding:18px 12px 14px;}
}
@media(prefers-reduced-motion:reduce){
  .vg-tile.in-view{animation-duration:.01s;animation-delay:0s;}
  .vg-tile.in-view::after{animation:none;opacity:.75;}
}

/* ─── DEALER TESTIMONIAL ───────────────────────── */
.testimonial-section{padding:100px 32px;max-width:1120px;margin:0 auto;position:relative;z-index:2;text-align:center;}
.tm-eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--cyan);margin:0 auto 16px;display:inline-flex;align-items:center;gap:8px;}
.tm-eyebrow::before{content:'';width:22px;height:1px;background:currentColor;}
.tm-heading{font-family:var(--display);font-size:clamp(26px,3vw,36px);font-weight:400;letter-spacing:-0.02em;line-height:1.15;color:var(--white);margin:0 auto 44px;max-width:760px;text-align:center;}
.tm-heading .accent{font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;color:var(--cyan);}
.tm-card{position:relative;padding:56px 56px 44px;border-radius:26px;background:var(--surface-card);border:1px solid var(--border);box-shadow:var(--glass-shadow);transition:all .3s ease;}
[data-theme="dark"] .tm-card{background:#152232 !important;border-color:rgba(255,255,255,.08) !important;box-shadow:0 20px 60px -20px rgba(0,0,0,.5) !important;}
.tm-card::before{content:'"';position:absolute;top:12px;left:36px;font-family:var(--display);font-size:180px;line-height:1;font-style:italic;color:var(--cyan);opacity:.14;pointer-events:none;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;}
[data-theme="dark"] .tm-card::before{opacity:.08;color:#5EEAD4;}
.tm-stars{color:var(--amber);font-size:16px;letter-spacing:.15em;margin-bottom:22px;position:relative;z-index:1;}
.tm-quote{position:relative;z-index:1;}
.tm-quote p{font-family:var(--display);font-size:clamp(19px,2vw,25px);font-weight:400;letter-spacing:-0.005em;line-height:1.45;color:var(--white);margin:0;}
.tm-attrib{margin-top:36px;padding-top:26px;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;position:relative;z-index:1;background:transparent !important;}
[data-theme="dark"] .tm-attrib{border-top-color:rgba(255,255,255,.08);background:transparent !important;}
.tm-who{font-size:14.5px;color:var(--white-dim);}
.tm-who strong{color:var(--white);font-weight:600;}
.tm-who .tm-sep{margin:0 8px;color:var(--faint);}
.tm-source{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:100px;background:rgba(11,124,114,.08);border:1px solid rgba(11,124,114,.22);color:var(--cyan);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;transition:background .25s,transform .25s,border-color .25s;}
[data-theme="dark"] .tm-source{background:rgba(13,148,136,.15);border-color:rgba(13,148,136,.3);color:#5EEAD4;}
.tm-source:hover{background:rgba(11,124,114,.14);border-color:var(--cyan);transform:translateY(-2px);}
.tm-g-icon{display:inline-block;width:12px;height:12px;background:conic-gradient(from -90deg,#EA4335 0deg 90deg,#FBBC05 90deg 180deg,#34A853 180deg 270deg,#4285F4 270deg);border-radius:50%;}
@media(max-width:720px){
  .testimonial-section{padding:72px 20px;}
  .tm-card{padding:36px 26px 30px;}
  .tm-card::before{font-size:120px;top:6px;left:18px;}
  .tm-attrib{flex-direction:column;align-items:flex-start;gap:18px;}
}

/* ─── FOOTER SOCIAL RAIL ───────────────────────── */
.footer-social{display:flex;gap:10px;margin-top:12px;}
.footer-social a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--text-dim,#94A3B8);transition:transform .25s,background .25s,border-color .25s,color .25s;}
.footer-social a:hover{transform:translateY(-2px);background:rgba(11,124,114,.15);border-color:var(--cyan);color:var(--cyan);}
.footer-social a svg{width:15px;height:15px;fill:currentColor;}

/* ─── INTERACTIVE ROI & PROFIT CALCULATOR ─────── */
.roi-section{padding:100px 32px 120px;max-width:1200px;margin:0 auto;position:relative;z-index:2;}
.roi-header{text-align:center;max-width:760px;margin:0 auto 48px;}
.roi-header .eyebrow{justify-content:center;display:flex;align-items:center;gap:8px;}
.roi-header .section-h2{margin-left:auto;margin-right:auto;}
.roi-header .section-lede{margin-left:auto;margin-right:auto;}

.roi-container{display:flex;flex-direction:column;gap:28px;}

/* Controls Card */
.roi-controls-card{background:var(--surface-card);border:1px solid var(--glass-border);border-radius:24px;box-shadow:var(--glass-shadow);padding:32px 36px;position:relative;overflow:hidden;}
.roi-controls-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--cyan),#4FE3DC,var(--amber));}
.roi-control-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap;}
.roi-control-label-group{display:flex;flex-direction:column;gap:4px;}
.roi-label{font-family:var(--sans);font-size:18px;font-weight:700;letter-spacing:-.01em;color:var(--white);}
.roi-label-sub{font-size:13.5px;color:var(--white-dim);}

.roi-volume-display{display:inline-flex;align-items:baseline;gap:8px;background:var(--surface-dark);color:#fff;padding:8px 20px;border-radius:100px;box-shadow:0 8px 24px -4px rgba(14,22,32,.35);border:1px solid rgba(255,255,255,.1);}
.roi-volume-num{font-family:var(--display);font-size:32px;font-weight:700;color:#5EEAD4;line-height:1;min-width:48px;text-align:right;}
.roi-volume-unit{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.75);}

.roi-presets-wrap{display:flex;align-items:center;gap:14px;margin-bottom:28px;flex-wrap:wrap;}
.roi-presets-label{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;}
.roi-presets{display:flex;gap:8px;flex-wrap:wrap;}
.roi-preset-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:100px;border:1px solid var(--glass-line);background:rgba(11,124,114,.02);font-family:var(--sans);font-size:12.5px;color:var(--muted);cursor:pointer;transition:all .22s cubic-bezier(.22,1,.36,1);}
.roi-preset-btn:hover{background:rgba(11,124,114,.08);border-color:var(--cyan);color:var(--cyan);transform:translateY(-1px);}
.roi-preset-btn.active{background:var(--surface-dark);border-color:var(--surface-dark);color:#FFFFFF;box-shadow:0 4px 14px rgba(14,22,32,.25);}
.roi-preset-btn.active .roi-preset-val{color:#5EEAD4;background:rgba(255,255,255,.15);}
.roi-preset-val{font-family:var(--mono);font-size:10px;padding:2px 6px;border-radius:100px;background:rgba(0,0,0,.06);color:var(--white-dim);transition:all .2s;}

.roi-slider-container{margin-bottom:20px;}
.roi-slider-track-wrap{position:relative;width:100%;padding:10px 0;}
.roi-slider{width:100%;-webkit-appearance:none;appearance:none;height:8px;border-radius:100px;outline:none;cursor:pointer;background:linear-gradient(90deg,var(--cyan) 0%,#4FE3DC var(--fill,15.38%),rgba(0,0,0,.08) var(--fill,15.38%));transition:background .1s ease;}
.roi-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;border-radius:50%;background:#FBF9F3;border:4px solid var(--cyan);box-shadow:0 2px 12px rgba(11,124,114,.45),0 0 0 1px rgba(0,0,0,.08);cursor:grab;transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s;}
.roi-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 4px 18px rgba(11,124,114,.6),0 0 0 2px rgba(11,124,114,.2);}
.roi-slider::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.22);background:#E0F2FE;}
.roi-slider::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#FBF9F3;border:4px solid var(--cyan);box-shadow:0 2px 12px rgba(11,124,114,.45),0 0 0 1px rgba(0,0,0,.08);cursor:grab;transition:transform .18s,box-shadow .18s;}
.roi-slider:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;}

.roi-slider-ticks{display:flex;justify-content:space-between;padding:4px 4px 0;font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--faint);text-transform:uppercase;}

.roi-disclaimer-pill{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;background:rgba(11,124,114,.06);border:1px solid rgba(11,124,114,.12);font-size:12.5px;color:var(--muted);line-height:1.4;}
.roi-info-ic{flex-shrink:0;font-size:14px;}

/* Results Grid */
.roi-results-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}

.roi-metric-card{background:var(--surface-card);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--glass-shadow);padding:24px 22px;display:flex;flex-direction:column;transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s;}
.roi-metric-card:hover{transform:translateY(-3px);box-shadow:var(--glass-shadow-hover);border-color:rgba(11,124,114,.3);}

.roi-metric-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;}
.roi-metric-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex-shrink:0;}
.roi-metric-icon.teal{background:rgba(11,124,114,.12);color:var(--cyan);}
.roi-metric-icon.amber{background:rgba(212,148,42,.12);color:var(--amber);}
.roi-metric-icon.green{background:rgba(34,197,94,.12);color:#16A34A;}
.roi-metric-icon svg{width:18px;height:18px;}

.roi-metric-badge{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:rgba(0,0,0,.04);border:1px solid rgba(0,0,0,.06);padding:3px 8px;border-radius:100px;white-space:nowrap;}

.roi-metric-title{font-size:14px;font-weight:600;color:var(--white-dim);margin-bottom:8px;}
.roi-metric-number-wrap{display:flex;align-items:baseline;gap:4px;margin-bottom:10px;}
.roi-metric-currency{font-family:var(--sans);font-size:22px;font-weight:700;color:var(--white);margin-right:2px;}
.roi-metric-number{font-family:var(--sans);font-size:clamp(26px,2.4vw,32px);font-weight:800;letter-spacing:-.02em;color:var(--white);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;}
.roi-metric-unit{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;}

.roi-metric-desc{font-size:12.5px;line-height:1.45;color:var(--white-dim);margin-bottom:16px;flex:1;}
.roi-metric-foot{padding-top:12px;border-top:1px solid var(--glass-line);font-size:12px;color:var(--muted);font-weight:500;}
.roi-metric-foot b{color:var(--white);font-weight:700;}

/* Net Profit Unlock Hero Card */
.roi-net-card{grid-column:1/-1;background:linear-gradient(135deg,#0E1620 0%,#152232 50%,#0A1119 100%);border:1px solid rgba(13,148,136,.35);border-radius:24px;box-shadow:0 24px 60px -15px rgba(11,124,114,.3),inset 0 1px 0 rgba(255,255,255,.1);padding:32px 36px;color:#FFFFFF;position:relative;overflow:hidden;}
.roi-net-card::after{content:'';position:absolute;top:-40%;right:-10%;width:350px;height:350px;background:radial-gradient(circle,rgba(13,148,136,.25) 0%,transparent 70%);pointer-events:none;}
.roi-net-inner{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;}

.roi-net-top{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.roi-net-tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#5EEAD4;font-weight:700;}
.roi-net-tag .dot{width:6px;height:6px;border-radius:50%;background:#5EEAD4;animation:livePulse 2s ease-in-out infinite;}

.roi-roi-badge{display:inline-flex;align-items:center;padding:5px 14px;border-radius:100px;background:linear-gradient(135deg,#0B7C72,#0D9488);color:#FFFFFF;font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 4px 14px rgba(13,148,136,.4);border:1px solid rgba(255,255,255,.25);}

.roi-net-label{font-size:15px;color:rgba(255,255,255,.8);font-weight:500;}

.roi-net-main-row{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.roi-net-figure{display:inline-flex;align-items:baseline;gap:6px;}
.roi-net-currency{font-family:var(--display);font-size:clamp(30px,3.5vw,44px);font-weight:700;color:#5EEAD4;}
.roi-net-amount{font-family:var(--display);font-size:clamp(36px,4.5vw,56px);font-weight:800;letter-spacing:-.03em;color:#5EEAD4;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;line-height:1;}
.roi-net-period{font-family:var(--mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7);}

.roi-net-annual-badge{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);padding:10px 18px;border-radius:14px;font-size:13.5px;color:rgba(255,255,255,.8);display:inline-flex;align-items:center;gap:6px;}
.roi-net-annual-badge strong{color:#FDE047;font-family:var(--mono);font-size:15px;font-weight:700;}

.roi-net-breakdown{font-size:13px;line-height:1.5;color:rgba(255,255,255,.7);padding-top:14px;border-top:1px solid rgba(255,255,255,.1);}
.roi-net-breakdown strong{color:#FFFFFF;font-weight:600;}

/* Direct CTA Bar */
.roi-cta-bar{display:flex;align-items:center;justify-content:space-between;gap:28px;background:rgba(11,124,114,.06);border:1px solid rgba(11,124,114,.18);border-radius:24px;padding:32px 36px;flex-wrap:wrap;}
.roi-cta-text{max-width:540px;}
.roi-cta-text h3{font-family:var(--display);font-size:22px;font-weight:500;letter-spacing:-.01em;color:var(--white);margin-bottom:6px;}
.roi-cta-text p{font-size:13.5px;line-height:1.5;color:var(--white-dim);}
.roi-cta-actions{display:flex;gap:12px;flex-wrap:wrap;}
.roi-cta-primary{padding:14px 24px;font-size:14px;font-weight:600;}
.roi-cta-secondary{padding:14px 20px;font-size:13.5px;}

@media(max-width:960px){
  .roi-section{padding:72px 20px 90px;}
  .roi-results-grid{grid-template-columns:1fr;}
  .roi-controls-card{padding:24px 20px;}
  .roi-net-card{padding:24px 20px;}
  .roi-cta-bar{padding:24px 20px;flex-direction:column;align-items:stretch;}
  .roi-cta-actions{flex-direction:column;}
  .roi-cta-actions .btn{justify-content:center;}
}

.step { border: 1px solid var(--border); background: var(--surface-card); box-shadow: var(--glass-shadow); transition: transform 0.3s, box-shadow 0.3s; color: var(--white); }
[data-theme="dark"] .step { background: var(--surface-card); border-color: var(--border); color: var(--white); box-shadow: 0 12px 32px rgba(0,0,0,0.3); }
.step:hover { transform: translateY(-4px); box-shadow: var(--glass-shadow-hover); }
.step-num { background: var(--cyan); color: #fff; display: inline-flex; padding: 6px 12px; border-radius: 100px; font-weight: 600; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 16px; font-family: var(--mono); }


/* ═══ PREMIUM SITE-WIDE EFFECTS ═══ */

/* Heading shimmer — subtle sweep on ALL section headings */
h1, h2, h3, .section-title, .section-h2, .mod-panel-title, .hero-h1 {
  position: relative;
}
h1 .accent, h1 em, h2 .accent, h2 em, h3 .accent, h3 em, .hero-h1 .accent, .section-h2 .accent, .final h2 .accent, .section-title .accent {
  display: inline-block;
  padding-right: 0.15em;
  padding-bottom: 0.04em;
  font-style: italic;
  font-variation-settings: "opsz" 144, "SOFT" 100, "WONK" 1;
  background: linear-gradient(135deg, #0B7C72 0%, #0D9488 25%, #14B8A6 48%, #0F766E 72%, #0B7C72 100%);
  background-size: 240% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: headingShimmer 5s ease-in-out infinite;
}
[data-theme="dark"] h1 .accent, [data-theme="dark"] h1 em, [data-theme="dark"] h2 .accent, [data-theme="dark"] h2 em, [data-theme="dark"] .hero-h1 .accent {
  background: linear-gradient(135deg, #0D9488 0%, #14B8A6 30%, #2DD4BF 60%, #0D9488 100%);
  background-size: 240% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
@keyframes headingShimmer {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* Scroll reveal — fade up on enter */
.reveal, .card, .table-wrap, .cta-box, .badge, .hero-actions, 
.grid-2 > *, .grid-3 > *, .grid-4 > *, .faq-item, .mod-panel,
.footer-grid, .hero-p, .section-head, .section-lede,
.pricing-card, .pkg-card, .feature-card {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s cubic-bezier(.22,1,.36,1), transform 0.7s cubic-bezier(.22,1,.36,1);
}
.reveal.visible, .card.visible, .table-wrap.visible, .cta-box.visible, 
.badge.visible, .hero-actions.visible, .faq-item.visible, .mod-panel.visible,
.footer-grid.visible, .hero-p.visible, .section-head.visible, .section-lede.visible,
.pricing-card.visible, .pkg-card.visible, .feature-card.visible {
  opacity: 1;
  transform: translateY(0);
}
/* Stagger children */
.grid-2 > *:nth-child(2), .grid-3 > *:nth-child(2), .grid-4 > *:nth-child(2) { transition-delay: 0.1s; }
.grid-2 > *:nth-child(3), .grid-3 > *:nth-child(3), .grid-4 > *:nth-child(3) { transition-delay: 0.2s; }
.grid-3 > *:nth-child(4), .grid-4 > *:nth-child(4) { transition-delay: 0.25s; }
.grid-4 > *:nth-child(5) { transition-delay: 0.3s; }
.grid-4 > *:nth-child(6) { transition-delay: 0.35s; }

/* 3D Tilt on cards — perspective hover */
.card, .table-wrap, .cta-box, .pricing-card, .pkg-card, .feature-card, .faq-item {
  transform-style: preserve-3d;
  transition: transform 0.4s cubic-bezier(.22,1,.36,1), box-shadow 0.4s ease;
}
.card:hover, .pricing-card:hover, .pkg-card:hover, .feature-card:hover {
  transform: perspective(800px) rotateX(2deg) rotateY(-2deg) translateY(-6px) !important;
  box-shadow: 0 20px 40px -12px rgba(11,124,114,.15), 0 8px 16px -4px rgba(0,0,0,.08) !important;
}

/* Shine sweep on card hover */
.card::before, .table-wrap::before, .cta-box::before, 
.pricing-card::before, .pkg-card::before, .feature-card::before {
  content: '';
  position: absolute;
  top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent);
  transition: left 0.6s ease;
  pointer-events: none;
  border-radius: inherit;
  z-index: 1;
}
.card:hover::before, .table-wrap:hover::before, .cta-box:hover::before,
.pricing-card:hover::before, .pkg-card:hover::before, .feature-card:hover::before {
  left: 100%;
}
.card, .table-wrap, .cta-box, .pricing-card, .pkg-card, .feature-card {
  position: relative;
  overflow: hidden;
}

/* FAQ items — expand with spring */
.faq-item {
  position: relative;
  overflow: hidden;
  border-radius: 16px !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.faq-item:hover {
  transform: translateY(-3px) scale(1.005);
  box-shadow: 0 12px 28px -8px rgba(11,124,114,.12);
  border-color: rgba(11,124,114,.2) !important;
}

/* Table rows — highlight sweep */
tbody tr {
  transition: background 0.3s ease;
}
tbody tr:hover {
  background: rgba(11,124,114,.04);
}

/* CTA box — breathing glow */
.cta-box {
  animation: ctaGlow 4s ease-in-out infinite;
}
@keyframes ctaGlow {
  0%, 100% { box-shadow: 0 4px 20px rgba(0,0,0,.03); }
  50% { box-shadow: 0 8px 32px rgba(11,124,114,.08), 0 0 0 1px rgba(11,124,114,.1); }
}

/* Buttons — lift + glow on hover */
.btn-primary, .btn-ghost, .mod-btn-primary, .mod-btn-clip {
  transition: all 0.3s cubic-bezier(.22,1,.36,1);
}
.btn-primary:hover, .mod-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px -6px rgba(11,124,114,.5);
}
.btn-ghost:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px -6px rgba(0,0,0,.1);
}

/* Badge float animation */
.badge, .hero-badge {
  animation: badgeFloat 3s ease-in-out infinite;
}
@keyframes badgeFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

/* Dot pulse — used on all live dots */
@keyframes pulseDot {
  0%, 100% { opacity: 1; box-shadow: 0 0 8px currentColor; }
  50% { opacity: 0.6; box-shadow: 0 0 16px currentColor; }
}

/* Smooth scroll padding for fixed nav */
html { scroll-behavior: smooth; }

/* Hide scrollbar on verticals strip */
.vertical-strip::-webkit-scrollbar { display: none; }


/* ═══ SENIOR UI POLISH ═══ */

/* Nav entrance */
@keyframes navSlideIn { from { transform: translateY(-20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.nav { animation: navSlideIn 0.6s cubic-bezier(.22,1,.36,1) forwards; }

/* Card depth — multi-layer realistic shadows */
.card, .table-wrap, .cta-box, .pricing-card, .pkg-card, .feature-card {
  box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 4px 12px rgba(0,0,0,.03), 0 12px 36px -8px rgba(0,0,0,.04);
  border: 1px solid rgba(0,0,0,.06);
  transition: all 0.45s cubic-bezier(.22,1,.36,1);
}
.card:hover, .pricing-card:hover, .pkg-card:hover, .feature-card:hover {
  border-color: rgba(11,124,114,.15);
}

/* Gradient accent line on cards */
.card::after, .pricing-card::after, .pkg-card::after {
  content: '';
  position: absolute;
  top: 0; left: 20%; right: 20%; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(11,124,114,.3), transparent);
  border-radius: 2px;
  opacity: 0;
  transition: opacity 0.4s ease, left 0.4s ease, right 0.4s ease;
}
.card:hover::after, .pricing-card:hover::after, .pkg-card:hover::after {
  opacity: 1; left: 10%; right: 10%;
}

/* Typography refinements */
h1, .hero-h1 { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
h2, .section-h2, .section-title { letter-spacing: -0.02em; }
h3 { letter-spacing: -0.01em; }
p, li { text-rendering: optimizeSpeed; }

/* Better link underlines — gradient fade */
.nav-links a::after { height: 2px; background: linear-gradient(90deg, transparent, var(--cyan), transparent); }

/* Table polish */
table { font-feature-settings: "tnum" 1; }
thead th { 
  background: rgba(11,124,114,.03); 
  border-bottom: 2px solid rgba(11,124,114,.12) !important; 
}
td.highlight { 
  background: rgba(11,124,114,.06);
  font-weight: 600; 
  color: var(--cyan);
  position: relative;
}
td.highlight::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, var(--cyan), #5EEAD4);
  border-radius: 0 3px 3px 0;
}

/* Section dividers — subtle gradient fade between sections */
.section + .section, article + article { 
  border-top: 1px solid transparent;
  background-image: linear-gradient(var(--ink), var(--ink)), linear-gradient(90deg, transparent 5%, rgba(11,124,114,.1) 50%, transparent 95%);
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

/* Footer upgrade */
footer, .footer { 
  background: linear-gradient(180deg, var(--ink) 0%, #EAE6DA 100%);
  position: relative;
  color: var(--white);
}
footer::before, .footer::before {
  content: '';
  position: absolute;
  top: 0; left: 10%; right: 10%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(11,124,114,.2), transparent);
}
.footer h5 { color: var(--muted); }
.footer p, .footer-brand p { color: var(--white-dim); }
.footer a { color: var(--muted); }
.footer a:hover { color: var(--white); }
.footer-bottom { 
  border-top: 1px solid rgba(0,0,0,.1) !important; 
  color: var(--muted); 
}
.footer-social a { color: var(--muted); }
.footer-social a:hover { color: var(--cyan); }
.footer-col a { color: var(--muted); transition: color .2s ease, transform .2s ease; display: inline-block; }
.footer-col a:hover { color: var(--cyan); transform: translateX(3px); }

/* CTA box — gradient border */
.cta-box {
  background: linear-gradient(135deg, #FBF9F3 0%, #F5F2E8 100%);
  border: 1px solid transparent;
  background-clip: padding-box;
  position: relative;
}
.cta-box::after {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(11,124,114,.15), rgba(11,124,114,.05), rgba(11,124,114,.15));
  z-index: -1;
  border-radius: 32px;
}

/* Better focus states — accessible + beautiful */
a:focus-visible, button:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 3px;
  border-radius: 4px;
  box-shadow: 0 0 0 6px rgba(11,124,114,.1);
}

/* Smooth number transitions for ROI calculator */
[id*="roi"], [id*="Val"] { 
  font-feature-settings: "tnum" 1; 
  font-variant-numeric: tabular-nums; 
}

/* Badge/pill shine — subtle reflection */
.badge, .hero-badge, .mod-spec-pill {
  position: relative;
  overflow: hidden;
}
.mod-spec-pill {
  transition: all 0.3s ease;
}
.mod-spec-pill:hover {
  background: rgba(11,124,114,.08);
  border-color: rgba(11,124,114,.2);
  transform: translateY(-1px);
}

/* Live site embed frame — extra depth */
.live-hero-wrap {
  transition: transform 0.5s cubic-bezier(.22,1,.36,1), box-shadow 0.5s ease;
}
.live-hero-wrap:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 32px 72px -20px rgba(0,0,0,0.5), 0 0 40px -8px rgba(13,148,136,0.25) !important;
}

/* Comparison highlight — competitor column has muted red tint for contrast */
td:not(.highlight) {
  color: var(--muted, rgba(64,78,100,.92));
}

/* Feature list checkmarks — pulse on scroll-in */
.mod-feature-icon svg {
  color: var(--cyan);
  transition: transform 0.3s ease;
}
.mod-feature-item:hover .mod-feature-icon svg {
  transform: scale(1.15);
}

/* Smooth image loading */
img {
  transition: opacity 0.4s ease;
}
img[loading="lazy"] {
  opacity: 0;
}
img[loading="lazy"].loaded, img[loading="lazy"]:not([data-src]) {
  opacity: 1;
}

/* Selection color — brand-consistent */
::selection { background: rgba(11,124,114,.2); color: var(--white); }

/* Print — clean */
@media print {
  .nav, .scroll-prog, .nav-mobile, footer { display: none !important; }
  body { background: #FBF9F3; }
  .card, .table-wrap { box-shadow: none; border: 1px solid #ddd; }
}

/* Reduced motion — respect user preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}


/* Nav logo responsive */


/* Glassmorphic Nav */
.nav-mobile {
  overflow-y: auto;
  background: rgba(255,255,255,0.98);
  transition: all 0.3s ease-in-out;
}
[data-theme="dark"] .nav-mobile {
  background: rgba(21, 34, 50, 0.98);
}
.nav.open .nav-mobile {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
  z-index: 99999 !important;
}
/* FABs & Buttons matching true-cars.co.za */
.btn.btn-wa, .msb-wa {
  background: linear-gradient(135deg, #07879A, #056274) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(94, 234, 212, 0.35) !important;
  box-shadow: 0 6px 20px -4px rgba(7, 135, 154, 0.45) !important;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.btn.btn-wa:hover, .msb-wa:hover {
  background: linear-gradient(135deg, #056274, #044957) !important;
  box-shadow: 0 8px 26px -4px rgba(7, 135, 154, 0.6) !important;
  transform: translateY(-2px);
}

/* ═══ DEALERASSIST AI VOICE HUB & RESOURCE SUITE ═══ */
.dealer-assist-section {
  position: relative;
  z-index: 2;
  padding: clamp(60px, 8vw, 100px) 0;
  max-width: none;
  margin: 0;
  display: block;
}
.dealer-assist-inner {
  max-width: 1340px;
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 32px);
}
.dealer-assist-head {
  text-align: center;
  max-width: 840px;
  margin: 0 auto clamp(36px, 5vw, 54px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.dealer-assist-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--cyan);
  background: var(--cyan-soft);
  border: 1px solid var(--border-glow);
  padding: 6px 14px;
  border-radius: 99px;
  font-weight: 600;
}
.dealer-assist-title {
  font-family: var(--display);
  font-size: clamp(28px, 3.4vw, 44px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.025em;
  color: var(--white);
}
.dealer-assist-lede {
  font-size: clamp(15px, 1.4vw, 17px);
  line-height: 1.6;
  color: var(--muted);
  max-width: 720px;
}
.dealer-assist-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(20px, 3vw, 36px);
  align-items: stretch;
}
@media (max-width: 960px) {
  .dealer-assist-grid {
    grid-template-columns: 1fr;
  }
}
.assist-card {
  background: #FBF9F3 !important;
  border: 1px solid rgba(60, 50, 30, 0.15) !important;
  border-radius: 20px;
  padding: clamp(24px, 3vw, 36px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.06);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}
[data-theme="dark"] .assist-card {
  background: #152232 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.assist-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(0,0,0,0.12);
}
.assist-card-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #0D9488;
  background: rgba(13, 148, 136, 0.1);
  border: 1px solid rgba(13, 148, 136, 0.25);
  padding: 5px 12px;
  border-radius: 99px;
  margin-bottom: 14px;
  font-weight: 600;
}
.assist-card-badge .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #0D9488;
  box-shadow: 0 0 6px rgba(13, 148, 136, 0.6);
}
.assist-card-h3 {
  font-family: var(--display);
  font-size: clamp(22px, 2.2vw, 28px);
  font-weight: 700;
  color: var(--white);
  line-height: 1.25;
  margin-bottom: 8px;
}
.assist-card-desc {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--muted);
  margin-bottom: 20px;
}
.assist-features-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 22px;
}
.assist-pill {
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.06);
  color: var(--white);
  white-space: nowrap;
}
[data-theme="dark"] .assist-pill {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.08);
  color: #F1F5F9;
}
.assist-sim-box {
  background: rgba(0, 0, 0, 0.03);
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 14px;
  padding: 16px;
  margin-bottom: 20px;
}
[data-theme="dark"] .assist-sim-box {
  background: rgba(0, 0, 0, 0.3);
  border-color: rgba(255, 255, 255, 0.08);
}
.assist-sim-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 12px;
}
.assist-sim-prompts {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
.assist-prompt-btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 14px;
  border-radius: 10px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.08);
  text-align: left;
  font-size: 13px;
  font-weight: 500;
  color: var(--white);
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}
[data-theme="dark"] .assist-prompt-btn {
  background: #1B2B3F;
  border-color: rgba(255, 255, 255, 0.08);
  color: #F1F5F9;
}
.assist-prompt-btn:hover {
  border-color: var(--cyan);
  transform: translateX(2px);
}
.assist-prompt-btn.active {
  background: rgba(13, 148, 136, 0.08);
  border-color: #0D9488;
  color: #0D9488;
  font-weight: 600;
}
[data-theme="dark"] .assist-prompt-btn.active {
  background: rgba(13, 148, 136, 0.2);
  border-color: #5EEAD4;
  color: #5EEAD4;
}
.assist-prompt-btn .ic {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--muted);
  flex-shrink: 0;
}
.assist-sim-response {
  background: #FFFFFF;
  border: 1px solid rgba(13, 148, 136, 0.3);
  border-radius: 10px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 4px 12px rgba(13, 148, 136, 0.08);
}
[data-theme="dark"] .assist-sim-response {
  background: #0E1620;
  border-color: rgba(94, 234, 212, 0.3);
}
.assist-sim-tag {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #0D9488;
  font-weight: 700;
}
[data-theme="dark"] .assist-sim-tag {
  color: #5EEAD4;
}
#assistSimText {
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--white);
  font-style: italic;
}
.assist-sim-delivery {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 11px;
  color: #0D9488;
  font-weight: 600;
  background: rgba(13, 148, 136, 0.08);
  padding: 4px 10px;
  border-radius: 6px;
  align-self: flex-start;
}
[data-theme="dark"] .assist-sim-delivery {
  color: #5EEAD4;
  background: rgba(13, 148, 136, 0.2);
}
.call-guard {
  margin-top: 10px;
  text-align: center;
}
.call-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 14px 20px;
  border-radius: 12px;
  background: linear-gradient(135deg, #1E2836, #0F172A);
  color: #FFFFFF;
  font-weight: 600;
  font-size: 14px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
  transition: all 0.25s ease;
  cursor: pointer;
}
.call-btn:hover {
  background: linear-gradient(135deg, #0D9488, #09685F);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(13, 148, 136, 0.3);
}
.call-note {
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--muted);
  margin-top: 8px;
}

/* Resource Suite Card Actions */
.suite-actions-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 22px;
}
.suite-action-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 16px;
  border-radius: 12px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.08);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}
[data-theme="dark"] .suite-action-card {
  background: #1B2B3F;
  border-color: rgba(255, 255, 255, 0.08);
}
.suite-action-card:hover {
  transform: translateY(-2px);
  border-color: var(--cyan);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}
.suite-action-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.suite-action-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.04);
  display: grid;
  place-items: center;
  color: var(--white);
}
[data-theme="dark"] .suite-action-icon {
  background: rgba(255, 255, 255, 0.06);
  color: #F1F5F9;
}
.suite-action-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: left;
}
.suite-action-title {
  font-family: var(--sans);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--white);
  line-height: 1.25;
}
[data-theme="dark"] .suite-action-title {
  color: #FFFFFF;
}
.suite-action-sub {
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.2;
}
.suite-action-arrow {
  font-size: 14px;
  color: var(--muted);
  font-weight: 700;
  transition: transform 0.2s ease;
}
.suite-action-card:hover .suite-action-arrow {
  transform: translateX(3px);
  color: var(--cyan);
}
.suite-primary-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 14px 20px;
  border-radius: 12px;
  background: linear-gradient(135deg, #0B7C72, #065A53);
  color: #FFFFFF !important;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.02em;
  border: none;
  box-shadow: 0 4px 16px -4px rgba(11, 124, 114, 0.5);
  text-decoration: none;
  transition: all 0.25s ease;
}
.suite-primary-btn:hover {
  background: linear-gradient(135deg, #0F766E, #065A53);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px -4px rgba(11, 124, 114, 0.6);
}
.assist-trust-strip {
  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 8px;
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--muted);
  margin-top: 14px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* ═══ MOBILE BOTTOM BAR POPOUT PANELS ═══ */
.popout-panel {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  max-width: 520px;
  margin: 0 auto;
  background: #FBF9F3;
  border: 1px solid rgba(60, 50, 30, 0.15);
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.25);
  z-index: 1000;
  transform: translateY(100%);
  opacity: 0;
  visibility: hidden;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease, visibility 0.3s;
  padding: 24px;
}
.popout-panel.active {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}
[data-theme="dark"] .popout-panel {
  background: #152232;
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.6);
}
.popout-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="dark"] .popout-header {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
.popout-header h3 {
  font-family: var(--display);
  font-size: 18px;
  font-weight: 700;
  color: var(--white);
  margin: 0;
}
.popout-close {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.05);
  border: none;
  display: grid;
  place-items: center;
  font-size: 14px;
  color: var(--muted);
  cursor: pointer;
  transition: all 0.2s ease;
}
[data-theme="dark"] .popout-close {
  background: rgba(255, 255, 255, 0.08);
  color: #F1F5F9;
}
.popout-close:hover {
  background: rgba(239, 68, 68, 0.15);
  color: #EF4444;
}
.popout-body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
}
.popout-body h3 {
  color: var(--white);
}
.popout-body ul {
  padding-left: 20px;
}
.popout-body li {
  margin-bottom: 6px;
}

/* ═══ STICKY MOBILE BOTTOM BAR (3D TACTILE CAPSULES WITH SHIMMER & SPARKLES) ═══ */
/* ═══ TRUDEALER DUAL-MODE FLOATING FAB & MOBILE STICKY FOOTER ═══ */
@media (min-width: 601px) {
  .mobile-bottom-bar {
    position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 1000;
    display: inline-flex !important; align-items: center; gap: 8px;
    background: rgba(14, 22, 32, 0.94);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(11, 124, 114, 0.6);
    padding: 7px 14px; border-radius: 100px;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.6), 0 0 24px rgba(11, 124, 114, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.15);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .mobile-bottom-bar:hover {
    transform: translateX(-50%) translateY(-3px);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.75), 0 0 32px rgba(11, 124, 114, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.25);
  }
  .mobile-bottom-bar .bar-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 16px !important; border-radius: 100px !important;
    font-size: 13px; font-weight: 700; color: #FFFFFF;
    background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.12);
    text-decoration: none; cursor: pointer; transition: all 0.2s ease;
  }
  .mobile-bottom-bar .bar-btn-inner {
    display: flex; flex-direction: row; align-items: center; gap: 6px; background: none; border: none; box-shadow: none; padding: 0;
  }
  .mobile-bottom-bar .bar-btn.chat .bar-btn-inner { background: none; }
  .mobile-bottom-bar .bar-btn.chat { background: var(--cyan, #0B7C72); color: #FFF; border-color: transparent; }
  .mobile-bottom-bar .bar-btn.chat:hover { background: #0E9F92; }
}

@media (max-width: 600px) {
  .mobile-bottom-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 70px;
    background: rgba(14, 22, 32, 0.95);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.15);
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    align-items: center;
    z-index: 999;
    padding: 0 8px;
  }
  [data-theme="light"] .mobile-bottom-bar {
    background: rgba(248, 245, 238, 0.96);
    border-top-color: rgba(0, 0, 0, 0.1);
    box-shadow: 0 -8px 28px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }
  .bar-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    text-decoration: none;
    padding: 3px 0;
    -webkit-tap-highlight-color: transparent;
  }
  .bar-btn-inner {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 6px 4px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.2);
    overflow: hidden;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  }
  [data-theme="light"] .bar-btn-inner {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(240, 236, 226, 0.85) 100%);
    border-color: rgba(0, 0, 0, 0.09);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), inset 0 1px 0 #fff;
  }
  .bar-btn:active .bar-btn-inner {
    transform: translateY(2px) scale(0.96);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  }
  /* Continuous Shimmer Light Sweep */
  .bar-shine {
    position: absolute;
    top: 0;
    left: -120%;
    width: 70%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transform: skewX(-20deg);
    animation: barShineSweep 4.5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    pointer-events: none;
  }
  .bar-btn.chat .bar-shine {
    animation-delay: 1.5s;
  }
  .bar-btn.whatsapp .bar-shine {
    animation-delay: 3s;
  }
  @keyframes barShineSweep {
    0% { left: -120%; }
    25%, 100% { left: 160%; }
  }
  /* 3D Icon Container */
  .bar-icon-box {
    position: relative;
    width: 28px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  .bar-btn:hover .bar-icon-box, .bar-btn:active .bar-icon-box {
    transform: scale(1.12);
  }
  .bar-icon-box svg {
    width: 19px;
    height: 19px;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
  }
  /* Sparkle Twinkle Badge */
  .bar-sparkle {
    position: absolute;
    top: -3px;
    right: -2px;
    font-size: 8px;
    line-height: 1;
    opacity: 0.85;
    animation: sparkleTwinkle 2.4s ease-in-out infinite alternate;
  }
  @keyframes sparkleTwinkle {
    0% { opacity: 0.3; transform: scale(0.7) rotate(0deg); }
    100% { opacity: 1; transform: scale(1.3) rotate(25deg); }
  }
  /* Live Pulse Indicator Dot on AI Chat */
  .bar-pulse-dot {
    position: absolute;
    bottom: -1px;
    right: -1px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #00F2FE;
    box-shadow: 0 0 8px #00F2FE;
    animation: pulseDotLive 1.8s ease-in-out infinite;
  }
  @keyframes pulseDotLive {
    0%, 100% { transform: scale(0.9); opacity: 0.7; }
    50% { transform: scale(1.35); opacity: 1; box-shadow: 0 0 12px #00F2FE; }
  }
  /* 3D Color Accents */
  .bar-btn.book .bar-btn-inner {
    border-color: rgba(245, 158, 11, 0.3);
  }
  .bar-btn.book .bar-icon-box {
    color: #F59E0B;
  }
  .bar-btn.book .bar-sparkle {
    color: #FBBF24;
    text-shadow: 0 0 8px rgba(245, 158, 11, 0.9);
  }
  .bar-btn.book .bar-text {
    color: #F59E0B;
  }
  .bar-btn.chat .bar-btn-inner {
    border-color: rgba(0, 242, 254, 0.32);
  }
  .bar-btn.chat .bar-icon-box {
    color: #00F2FE;
  }
  .bar-btn.chat .bar-sparkle {
    color: #38BDF8;
    text-shadow: 0 0 8px rgba(0, 242, 254, 0.9);
  }
  .bar-btn.chat .bar-text {
    color: #00F2FE;
  }
  .bar-btn.whatsapp .bar-btn-inner {
    border-color: rgba(37, 211, 102, 0.32);
  }
  .bar-btn.whatsapp .bar-icon-box {
    color: #25D366;
  }
  .bar-btn.whatsapp .bar-sparkle {
    color: #4ADE80;
    text-shadow: 0 0 8px rgba(37, 211, 102, 0.9);
  }
  .bar-btn.whatsapp .bar-text {
    color: #25D366;
  }
  .bar-text {
    font-size: 10px;
    font-family: var(--mono);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
  }
}

/* ═══ LIVE SHOWROOM WIDGETS SECTION (.tt-section) ═══ */
.tt-section {
  padding: clamp(60px, 7vw, 100px) 0;
  position: relative;
  z-index: 2;
  text-align: center;
}
.tt-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
}
.tt-eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 12px;
  display: inline-block;
  font-weight: 600;
}
.tt-section h2 {
  font-family: var(--display);
  font-size: clamp(28px, 3.4vw, 46px);
  letter-spacing: -.025em;
  line-height: 1.15;
  margin-bottom: 12px;
  color: var(--white);
}
.tt-section h2 em {
  color: var(--cyan);
  font-style: italic;
}
.tt-sub {
  font-size: clamp(15px, 1.4vw, 17px);
  line-height: 1.6;
  color: var(--muted);
  max-width: 680px;
  margin: 0 auto 28px;
}
.tt-tabs {
  display: inline-flex;
  gap: 8px;
  padding: 6px;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid var(--border);
  border-radius: 100px;
  margin-bottom: 32px;
}
[data-theme="dark"] .tt-tabs {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
}
.tt-tab {
  padding: 9px 20px;
  border-radius: 100px;
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: all .2s;
}
.tt-tab:hover {
  color: var(--white);
}
.tt-tab.active {
  background: var(--cyan);
  color: #fff !important;
  font-weight: 600;
  box-shadow: 0 4px 16px -4px var(--cyan);
}
.tt-stage {
  max-width: 540px;
  margin: 0 auto;
  min-height: 480px;
  display: flex;
  justify-content: center;
}
.tt-panel {
  display: none;
  width: 100%;
}
.tt-panel.active {
  display: block;
  animation: fadeUp .3s ease;
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@media(max-width: 600px) {
  .tt-tabs { flex-wrap: wrap; justify-content: center; }
}


/* Nav brand & logo sizing */
.nav-brand {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
}
.nav-brand img {
  height: 52px !important;
  width: auto !important;
  max-width: 280px !important;
  object-fit: contain !important;
  display: block !important;
  transition: transform 0.2s ease !important;
}
.nav-brand:hover img {
  transform: scale(1.02);
}

/* Nav Burger button */
.nav-burger {
  display: none;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  cursor: pointer !important;
  z-index: 101 !important;
  background: rgba(255, 255, 255, 0.9) !important;
}
[data-theme="dark"] .nav-burger {
  background: rgba(26, 38, 54, 0.95) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.4) !important;
}
.nav-burger span, .nav-burger span::before, .nav-burger span::after {
  display: block;
  width: 18px !important;
  height: 2px !important;
  background: #1E293B !important;
  border-radius: 2px !important;
  transition: transform .25s, top .25s, background .25s !important;
}
[data-theme="dark"] .nav-burger span,
[data-theme="dark"] .nav-burger span::before,
[data-theme="dark"] .nav-burger span::after {
  background: #F8FAFC !important;
}
.nav.open .nav-burger span {
  background: transparent !important;
}
.nav.open .nav-burger span::before {
  top: 0 !important;
  transform: rotate(45deg) !important;
}
.nav.open .nav-burger span::after {
  top: 0 !important;
  transform: rotate(-45deg) !important;
}

/* Nav Mobile Drawer */
.nav-mobile {
  display: none;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 12px !important;
  right: 12px !important;
  width: auto !important;
  box-sizing: border-box !important;
  padding: 14px !important;
  background: rgba(248,245,238,0.98) !important;
  backdrop-filter: blur(24px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
  border: 1px solid rgba(0,0,0,.1) !important;
  border-radius: 20px !important;
  box-shadow: 0 24px 48px rgba(0,0,0,.25), 0 1px 3px rgba(0,0,0,.1) !important;
  max-height: calc(100vh - 84px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px) scale(0.98);
  transform-origin: top center;
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease !important;
  z-index: 99999 !important;
}
[data-theme="dark"] .nav-mobile {
  background: rgba(14, 22, 32, 0.98) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.6) !important;
}
.nav-mobile a {
  display: block !important;
  padding: 12px 16px !important;
  border-radius: 10px !important;
  font-size: 14.5px !important;
  color: var(--white-dim) !important;
  font-weight: 500 !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
.nav-mobile a:hover {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}
.nav.open .nav-mobile {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}

@media(max-width: 960px) {
  .nav-burger {
    display: flex !important;
  }
  .nav-brand img {
  height: 52px !important;
  width: auto !important;
  max-width: 280px !important;
  object-fit: contain !important;
  display: block !important;
  transition: transform 0.2s ease !important;
}
}
@media(max-width: 480px) {
  .nav-brand img { height: 40px !important; max-width: 200px !important; }
}
