/* Lazy Company — estilos compartidos de las paginas servicios/*.html */
:root{
  --cream:#F8F2E8; --nude:#E3CDAE; --taupe:#B89A78; --taupe-deep:#8B6F52;
  --ink:#3A2E22; --ink-mid:#6B5B47; --white:#FFFDFA;
  --font-serif:'Cormorant Garamond',serif; --font-sans:'Jost',sans-serif; --font-mono:'Space Mono',monospace;
  --bar-h:96px;
  --taupe-aa:#76593D; /* texto sobre crema/blanco: >= 5.6:1 (AA) */
  /* escala de elevacion calida (sombras multicapa, tinte ink; nunca grises frios) */
  --hi:inset 0 1px 0 rgba(255,255,255,.95);
  --sh-1:0 1px 2px rgba(58,46,34,.06), 0 4px 10px -2px rgba(58,46,34,.08);
  --sh-2:0 1px 2px rgba(58,46,34,.06), 0 8px 16px -6px rgba(58,46,34,.12), 0 24px 44px -22px rgba(58,46,34,.26);
  --sh-3:0 2px 4px rgba(58,46,34,.08), 0 14px 26px -8px rgba(58,46,34,.18), 0 36px 64px -26px rgba(58,46,34,.40);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{overflow-x:clip; background:var(--cream); color:var(--ink); font-family:var(--font-sans); font-weight:300; padding-bottom:var(--bar-h);}
a{text-decoration:none; color:inherit;}
a[x-apple-data-detectors]{color:inherit !important; text-decoration:none !important; font:inherit !important;}

/* ---- nav / menu movil (igual que el resto del sitio) ---- */
nav{position:sticky; top:0; z-index:100; display:flex; justify-content:space-between; align-items:center; padding:20px 50px; background:rgba(248,242,232,0.9); backdrop-filter:blur(14px); border-bottom:1px solid rgba(139,111,82,0.1);}
.logo{font-family:var(--font-serif); font-size:27px; color:var(--ink);}
.logo em{font-style:italic; color:var(--taupe-deep);}
.nav-links{display:flex; gap:28px; align-items:center; list-style:none;}
.nav-links a{font-size:11px; letter-spacing:2.5px; text-transform:uppercase; color:var(--ink-mid);}
.nav-links a.active{color:var(--taupe-deep);}
.nav-cta{border:1px solid rgba(139,111,82,0.35); padding:9px 20px; color:var(--taupe-deep) !important;}
#lang-toggle,.lang-toggle-m{border:1px solid rgba(139,111,82,0.35); width:32px; height:32px; border-radius:50%; font-family:var(--font-mono); font-size:10px; color:var(--taupe-deep); background:none; cursor:pointer; display:flex; align-items:center; justify-content:center;}
  .lang-toggle-m{display:none;}
.nav-hamburger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; z-index:101;}
.nav-hamburger span{display:block; width:22px; height:1px; background:var(--ink); transition:.3s;}
.nav-hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px);}
.nav-hamburger.open span:nth-child(2){opacity:0;}
.nav-hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px);}
.mobile-menu{display:none; position:fixed; inset:0; z-index:99; background:rgba(28,20,14,0.97); flex-direction:column; align-items:center; justify-content:center; gap:34px; opacity:0; transition:opacity .3s;}
.mobile-menu.open{display:flex; opacity:1;}
.mobile-menu a{font-size:13px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,253,250,0.85);}
.mobile-menu a:hover{color:var(--nude);}
.mobile-menu .m-cta{border:1px solid rgba(227,205,174,0.4); padding:14px 34px; color:var(--nude) !important;}
@media (max-width:820px){.nav-links{display:none;} .nav-hamburger{display:flex;} nav{padding:16px 24px;} .lang-toggle-m{display:flex; width:40px; height:40px; margin-left:auto; margin-right:6px;}}

.fade-in{opacity:0; transform:translateY(22px); transition:opacity .45s cubic-bezier(.16,.84,.44,1), transform .45s cubic-bezier(.16,.84,.44,1);}
.fade-in.visible{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion:reduce){.fade-in{opacity:1; transform:none; transition:none;} html{scroll-behavior:auto;}}

/* ---- hero ---- */
.wrap{max-width:1160px; margin:0 auto; padding:0 40px;}
.crumb{padding-top:26px; padding-bottom:6px;}
.back{display:inline-flex; align-items:center; gap:8px; min-height:44px; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--ink-mid); border-bottom:1px solid transparent; transition:.2s;}
.back:hover{color:var(--taupe-deep);}
.head{max-width:760px; margin:0 auto; padding:56px 32px 40px; text-align:center; position:relative;}
.label{font-family:var(--font-mono); font-size:10.5px; letter-spacing:3px; text-transform:uppercase; color:var(--taupe-aa); display:block; margin-bottom:20px;}
.head .svc-icon{width:44px; height:44px; fill:none; stroke:var(--taupe-deep); stroke-width:1.1; stroke-linecap:round; stroke-linejoin:round; margin-bottom:22px;}
.head h1{font-family:var(--font-serif); font-weight:400; font-size:clamp(32px,5vw,54px); line-height:1.12;}
.head h1 em{font-style:italic; color:var(--taupe-deep);}
.head p.lead{color:var(--ink-mid); margin:20px auto 0; font-size:16px; line-height:1.7; max-width:620px;}
.drives{margin-top:26px; display:inline-block; font-size:12.5px; color:var(--ink); border:1px solid rgba(139,111,82,0.28); border-top-color:rgba(255,255,255,.9); border-radius:999px; padding:9px 18px; background:rgba(255,253,250,0.72); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:var(--hi), var(--sh-1); line-height:1.5;}
.drives span{font-family:var(--font-mono); font-size:9.5px; letter-spacing:2px; text-transform:uppercase; color:var(--taupe-aa); margin-right:8px;}

/* ---- selector + variantes ---- */
.build{position:relative; isolation:isolate; padding-top:30px;}
.chips-label{font-family:var(--font-mono); font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--taupe-aa); display:block; margin-bottom:12px;}
.chips{display:flex; gap:10px; flex-wrap:wrap; padding:6px 6px 14px; margin:-6px -6px -14px;}
.chip{font:inherit; font-size:13px; padding:12px 18px; min-height:44px; border-radius:999px; border:1px solid rgba(139,111,82,0.36); border-top-color:rgba(255,255,255,.9); background:rgba(255,253,250,0.78); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); color:var(--ink); cursor:pointer; box-shadow:var(--hi), var(--sh-1); transition:transform .2s, box-shadow .2s, background .2s, border-color .2s, color .2s;}
.chip:hover{background:#fff; border-color:var(--taupe-deep); transform:translateY(-1px); box-shadow:var(--hi), 0 10px 18px -8px rgba(58,46,34,.28);}
.chip:focus-visible{outline:2px solid var(--taupe-deep); outline-offset:2px;}
.chip.on{background:linear-gradient(180deg,#52432F,var(--ink)); color:var(--white); border-color:var(--ink); box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 12px 22px -8px rgba(58,46,34,.6);}
.build-h{font-family:var(--font-serif); font-weight:400; font-size:clamp(26px,3.4vw,34px); margin:44px 0 22px;}

/* tabla de precios: una sola fila, tarjetas del mismo alto (scroll horizontal si no caben) */
.build.wrap{max-width:1180px;}
.fx-note{font-size:12.5px; color:var(--ink-mid); margin:-8px 0 16px;}
.build-h{font-family:var(--font-serif); font-weight:400; font-size:clamp(26px,3.4vw,34px); margin:44px 0 22px;}
/* tabla de precios: una sola fila, tarjetas del mismo alto (scroll horizontal si no caben) */
.build.wrap{max-width:1320px;}
.var-grid{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(250px,1fr); gap:18px; align-items:stretch; overflow-x:auto; scroll-snap-type:x proximity; padding:18px 14px 66px; margin:-18px -14px -66px; scrollbar-width:thin; scrollbar-color:var(--taupe) transparent;}
.var-card{position:relative; isolation:isolate; scroll-snap-align:start;
  background:
    radial-gradient(130% 62% at 18% -6%, rgba(255,255,255,.80) 0%, rgba(255,255,255,0) 58%),
    linear-gradient(145deg, rgba(255,255,255,.58) 0%, rgba(255,250,242,.30) 48%, rgba(255,244,228,.42) 100%);
  -webkit-backdrop-filter:blur(24px) saturate(1.6) brightness(1.04); backdrop-filter:blur(24px) saturate(1.6) brightness(1.04);
  border:1px solid rgba(255,255,255,.55); border-radius:22px; padding:26px 22px; display:flex; flex-direction:column; cursor:pointer; scroll-margin-top:110px; scroll-margin-bottom:calc(var(--bar-h) + 24px);
  box-shadow:
    inset 0 1.5px 1px rgba(255,255,255,.98),
    inset 1px 0 1px rgba(255,255,255,.55),
    inset 0 -1.5px 2px rgba(139,111,82,.22),
    inset 0 0 34px rgba(255,255,255,.38),
    0 1px 2px rgba(58,46,34,.06), 0 16px 30px -14px rgba(120,90,55,.30), 0 34px 62px -32px rgba(90,65,38,.38);
  transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, background .25s;}
.var-card::before{content:''; position:absolute; z-index:-1; inset:0; border-radius:inherit; padding:1.5px; pointer-events:none; background:linear-gradient(140deg, rgba(255,255,255,1) 0%, rgba(255,255,255,.15) 30%, rgba(139,111,82,0) 58%, rgba(139,111,82,.38) 100%); mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude; -webkit-mask-composite:xor;}
.var-card:hover{transform:translateY(-5px); box-shadow:inset 0 1.5px 1px #fff, inset 1px 0 1px rgba(255,255,255,.6), inset 0 -1.5px 2px rgba(139,111,82,.26), inset 0 0 40px rgba(255,255,255,.5), 0 2px 4px rgba(58,46,34,.07), 0 24px 40px -14px rgba(120,90,55,.36), 0 44px 76px -34px rgba(90,65,38,.45);}
.var-card.on{transform:translateY(-9px);
  background:
    radial-gradient(130% 62% at 18% -6%, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 58%),
    linear-gradient(145deg, rgba(255,255,255,.90) 0%, rgba(255,252,246,.74) 55%, rgba(255,246,232,.80) 100%);
  border-color:rgba(255,255,255,.85);
  box-shadow:
    inset 0 1.5px 1px #fff, inset 0 -1.5px 2px rgba(139,111,82,.26), inset 0 0 40px rgba(255,255,255,.7),
    0 0 0 1px var(--taupe-deep), 0 0 0 8px rgba(184,154,120,.24),
    0 2px 4px rgba(58,46,34,.08), 0 22px 38px -12px rgba(110,80,48,.40), 0 48px 78px -30px rgba(90,65,38,.52);}
.var-card.on::before{padding:2px; background:linear-gradient(140deg, #fff 0%, var(--nude) 28%, var(--taupe-deep) 62%, #5E4730 100%);}
.var-card.on::after{content:''; position:absolute; top:-2px; left:26px; right:26px; height:4px; border-radius:0 0 5px 5px; background:linear-gradient(90deg,var(--nude),var(--taupe-deep) 50%,var(--nude)); box-shadow:0 2px 8px rgba(139,111,82,.45);}
.var-top{display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-height:30px;}
.var-top h3{font-family:var(--font-serif); font-weight:500; font-size:20px; line-height:1.2; margin-right:auto; color:var(--ink);}
.badge{font-family:var(--font-mono); font-size:9px; letter-spacing:1.5px; text-transform:uppercase; border:1px solid var(--taupe-deep); color:var(--taupe-aa); border-radius:999px; padding:3px 9px; background:rgba(255,253,250,.7);}
.badge.rec{background:var(--taupe-aa); border-color:var(--taupe-aa); color:#fff; font-weight:400; box-shadow:0 4px 10px -4px rgba(90,65,38,.5);}
.sel{font-size:11.5px; color:var(--taupe-aa); font-weight:400;}

/* precio: el dato dominante de la tarjeta (se escala con el ancho real de su caja) */
.price-wrap{margin:20px 0 18px;}
.price-label{font-family:var(--font-mono); font-size:10px; letter-spacing:1.6px; text-transform:uppercase; color:var(--taupe-aa); display:block; margin-bottom:8px;}
.price-label i{display:block; font-style:normal; color:var(--ink-mid); letter-spacing:1px; margin-top:2px;}
.price-box{container-type:inline-size;}
.price{font-family:var(--font-serif); font-weight:600; font-size:clamp(25px,2.6vw,36px); line-height:1.05; color:var(--ink); letter-spacing:-.5px; font-variant-numeric:lining-nums tabular-nums;}
@supports (font-size:1cqw){ .price{font-size:clamp(23px,15.5cqw,46px);} }
.price .pn{display:block; white-space:nowrap;}
.price .pn2{font-size:.66em; color:var(--ink-mid); font-weight:500; margin-top:3px; letter-spacing:-.2px;}
.price .p-from{display:block; font-family:var(--font-sans); font-size:12.5px; font-weight:400; color:var(--ink-mid); letter-spacing:0; margin-bottom:3px;}
.price .cop{display:block; margin-top:8px; font-family:var(--font-mono); font-size:11px; font-weight:400; letter-spacing:1px; color:var(--ink-mid);}
.price-box.single{padding:0;}
@supports (font-size:1cqw){ .price-dual .price{font-size:clamp(23px,12.5cqw,38px);} }
.maint-line{margin-top:12px; font-size:12.5px; line-height:1.45; color:var(--ink-mid);}
.maint-line b{font-weight:500; color:var(--ink); margin-right:4px;}
.price-dual{display:grid;}
.price-dual .price-box{padding:0 0 16px;}
.price-dual .price-box.alt{padding:16px 0 0; border-top:1px solid rgba(139,111,82,0.30);}

.var-desc{padding-bottom:16px; border-bottom:1px solid rgba(139,111,82,0.22);}
.var-tag{font-size:13.5px; line-height:1.55; color:var(--ink-mid);}
.var-note{font-size:12.5px; color:var(--taupe-aa); margin-top:10px; line-height:1.5;}
.inc-label{font-family:var(--font-mono); font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--taupe-aa); margin:18px 0 10px; display:block;}
.feat{list-style:none; display:grid; gap:8px; margin-bottom:24px; align-content:start;}
.feat.grow{flex-grow:1;}
.feat:not(.grow){margin-bottom:0;}
.feat li{font-size:13.5px; color:var(--ink-mid); -webkit-text-fill-color:var(--ink-mid); padding-left:16px; position:relative; line-height:1.45;}
.feat li::before{content:''; position:absolute; left:1px; top:.66em; width:7px; height:1px; background:var(--taupe-aa);}
.exc-label{margin-top:20px;}
.feat.excl li{color:#786853; -webkit-text-fill-color:#786853;}
.feat.excl li::before{width:6px; height:6px; top:.62em; left:1px; background:none; border:1px solid #786853; border-radius:50%;}
.btn-card{display:block; text-align:center; font-size:10.5px; letter-spacing:2px; text-transform:uppercase; padding:15px 12px; border:1px solid var(--taupe-deep); color:var(--taupe-aa); background:rgba(255,253,250,.6); border-radius:3px; box-shadow:var(--hi); transition:.25s;}
.btn-card:hover{background:var(--taupe-deep); color:var(--white);}
.var-card.on .btn-card{background:var(--taupe-deep); color:var(--white); box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 10px 18px -8px rgba(58,46,34,.5);}
.var-card.on .btn-card:hover{background:var(--ink); border-color:var(--ink);}
.btn-primary{background:var(--taupe-deep); color:var(--white); font-size:10.5px; letter-spacing:2.5px; text-transform:uppercase; padding:16px 34px; transition:.3s;}
.btn-primary:hover{background:var(--ink);}

/* ---- agentes: que es una conversacion ---- */
.explainer{margin-top:56px; padding:30px; border:1px solid rgba(255,255,255,.55); border-radius:22px; background:radial-gradient(130% 70% at 18% -6%, rgba(255,255,255,.8), rgba(255,255,255,0) 58%), linear-gradient(145deg, rgba(255,255,255,.58), rgba(255,244,228,.38)); -webkit-backdrop-filter:blur(24px) saturate(1.6); backdrop-filter:blur(24px) saturate(1.6); box-shadow:inset 0 1.5px 1px rgba(255,255,255,.98), inset 0 -1.5px 2px rgba(139,111,82,.2), inset 0 0 34px rgba(255,255,255,.38), 0 16px 30px -14px rgba(120,90,55,.28), 0 34px 62px -32px rgba(90,65,38,.34);}
.explainer h2{font-family:var(--font-serif); font-weight:500; font-size:26px; margin-bottom:16px;}
.explainer-grid{display:grid; grid-template-columns:1.15fr 1fr; gap:32px; align-items:start;}
.explainer p{font-size:14px; line-height:1.65; color:var(--ink-mid);}
.explainer p.fine{font-size:12.5px; line-height:1.6; margin-top:12px; padding-left:12px; border-left:1px solid var(--taupe-deep);}
.split{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:18px;}
.split > div{border-left:1px solid var(--taupe-deep); padding-left:12px;}
.split b{display:block; font-weight:500; font-size:13px; color:var(--ink); margin-bottom:4px;}
.split span{font-size:12.5px; line-height:1.5; color:var(--ink-mid);}
.mini-chat{border:1px solid rgba(139,111,82,0.22); border-radius:12px; padding:16px; background:var(--cream); display:flex; flex-direction:column; gap:8px;}
.bub{max-width:85%; padding:8px 12px; border-radius:12px; font-size:13px; line-height:1.4;}
.bub.c{align-self:flex-end; background:var(--taupe-deep); color:var(--white); border-bottom-right-radius:2px;}
.bub.a{align-self:flex-start; background:var(--white); border:1px solid rgba(139,111,82,0.18); border-bottom-left-radius:2px;}
.mini-chat-eq{margin-top:4px; padding-top:10px; border-top:1px dashed rgba(139,111,82,0.4); font-family:var(--font-mono); font-size:11px; letter-spacing:.5px; color:var(--taupe-aa); text-align:center;}

.notes{margin:40px 0 0; padding-top:22px; border-top:1px solid rgba(139,111,82,0.16);}
.notes p{font-size:12.5px; line-height:1.6; color:var(--ink-mid); margin-bottom:6px; max-width:760px;}

/* ---- otros servicios ---- */
.others{padding-top:70px; padding-bottom:70px;}
.others h2{font-family:var(--font-serif); font-weight:400; font-size:26px; margin-bottom:18px;}
.others-list{display:flex; flex-wrap:wrap; gap:10px;}
.others-list a{font-size:13px; padding:12px 20px; min-height:44px; display:inline-flex; align-items:center; border:1px solid rgba(139,111,82,0.28); border-radius:999px; background:rgba(255,253,250,0.6); transition:.2s;}
.others-list a:hover{border-color:var(--taupe-deep); color:var(--taupe-deep);}

/* ---- barra inferior fija ---- */
.quote-bar{position:fixed; left:0; right:0; bottom:0; z-index:90; background:rgba(255,253,250,.88); -webkit-backdrop-filter:blur(16px) saturate(1.2); backdrop-filter:blur(16px) saturate(1.2); border-top:1px solid rgba(139,111,82,0.22); box-shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 -16px 32px -22px rgba(58,46,34,0.4);}
.quote-inner{max-width:1160px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 40px;}
.bar-info{display:flex; flex-direction:column; gap:4px; min-width:0;}
.bar-ref{font-family:var(--font-mono); font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--taupe-aa);}
.bar-prices{display:flex; gap:26px; flex-wrap:wrap;}
.bar-prices div{display:flex; flex-direction:column;}
.bar-prices span{font-size:11px; color:var(--ink-mid);}
.bar-prices b{font-family:var(--font-serif); font-weight:500; font-size:21px; line-height:1.2; font-variant-numeric:lining-nums;}
.bar-exact{font-size:11.5px; color:var(--ink-mid);}
.bar-cta{flex-shrink:0; text-align:center;}

/* ---- footer ---- */
footer{text-align:center; padding:50px 24px; border-top:1px solid rgba(139,111,82,0.15);}
.footer-links{display:flex; gap:28px; justify-content:center; margin:18px 0; flex-wrap:wrap;}
.footer-links a{font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--ink-mid);}
.footer-bottom{font-size:11.5px; color:var(--ink-mid); opacity:.7;}

/* ---- chat de Sofia (sube sobre la barra fija) ---- */
#chat-widget{position:fixed; bottom:calc(var(--bar-h) + 18px); right:24px; z-index:200; font-family:var(--font-sans);}
#chat-toggle{width:56px; height:56px; border-radius:50%; background:var(--taupe-deep); border:none; color:var(--white); cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 26px -8px rgba(58,46,34,0.5); transition:.25s;}
#chat-toggle:hover{background:var(--ink);}
#chat-toggle svg{width:24px; height:24px; fill:currentColor;}
#chat-box{position:fixed; bottom:calc(var(--bar-h) + 86px); right:24px; width:340px; max-width:calc(100vw - 32px); height:440px; max-height:calc(100vh - var(--bar-h) - 120px); background:var(--white); border-radius:14px; box-shadow:0 24px 60px -16px rgba(58,46,34,0.4); display:none; flex-direction:column; overflow:hidden; border:1px solid rgba(139,111,82,0.15);}
#chat-box.open{display:flex;}
#chat-header{background:var(--taupe-deep); color:var(--white); padding:16px 18px; display:flex; align-items:center; gap:12px;}
.chat-avatar{width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,0.2); display:flex; align-items:center; justify-content:center; font-family:var(--font-serif); font-size:15px;}
.chat-header-info{flex-grow:1; display:flex; flex-direction:column;}
.chat-name{font-size:13px; font-weight:500;}
.chat-status{font-size:10.5px; opacity:.85; display:flex; align-items:center; gap:6px;}
.status-dot{width:6px; height:6px; border-radius:50%; background:#8FAE8A;}
#chat-close{background:none; border:none; color:var(--white); font-size:20px; cursor:pointer; line-height:1;}
#chat-messages{flex-grow:1; overflow-y:auto; padding:16px 18px; display:flex; flex-direction:column; gap:12px;}
.msg{max-width:80%; padding:10px 14px; border-radius:12px; font-size:13.5px; line-height:1.5;}
.msg.sofia{background:var(--cream); color:var(--ink); align-self:flex-start; border-bottom-left-radius:2px;}
.msg.user{background:var(--taupe-deep); color:var(--white); align-self:flex-end; border-bottom-right-radius:2px;}
.msg.typing{background:var(--cream); color:var(--ink-mid); align-self:flex-start; font-style:italic;}
#chat-input-area{display:flex; gap:8px; padding:12px; border-top:1px solid rgba(139,111,82,0.15);}
#chat-input{flex-grow:1; border:1px solid rgba(139,111,82,0.25); border-radius:10px; padding:9px 12px; font-family:var(--font-sans); font-size:13px; resize:none; max-height:80px; outline:none; background:var(--cream);}
#chat-send{background:var(--taupe-deep); border:none; border-radius:10px; width:38px; height:38px; display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0;}
#chat-send svg{width:16px; height:16px; fill:var(--white);}

@media (max-width:860px){
  .explainer-grid{grid-template-columns:1fr;}
}
@media (max-width:700px){
  .wrap{padding:0 20px;}
  .head{padding:40px 22px 48px;}
  .var-grid{grid-auto-flow:row; grid-auto-columns:auto; grid-template-columns:1fr; overflow:visible; padding:0; margin:0; gap:18px;}
  .var-card{padding:26px 22px;}
  .var-card:hover, .var-card.on{transform:none;}
  .chips{padding:8px 20px 28px; margin:-8px -20px -28px;}
  .chips{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none;}
  .chips::-webkit-scrollbar{display:none;}
  .chip{white-space:nowrap; flex-shrink:0;}
  .split{grid-template-columns:1fr;}
  .explainer{padding:22px 18px;}
  .quote-inner{flex-direction:column; align-items:stretch; gap:12px; padding:12px 16px calc(12px + env(safe-area-inset-bottom));}
  .quote-inner{gap:8px; padding-top:10px;}
  .bar-prices{flex-direction:column; flex-wrap:nowrap; gap:3px;}
  .bar-prices div{flex-direction:row; justify-content:space-between; align-items:baseline; gap:10px;}
  .bar-prices b{font-size:15px;}
  .bar-prices span{font-size:11px;}
  .bar-exact{display:none;}
  .bar-cta{padding:15px 20px;}
  .btn-card{padding:17px 18px;}
  #chat-widget{right:16px;}
  #chat-box{right:16px;}
}
@media (prefers-reduced-motion:reduce){ .var-card, .chip, .btn-card{transition:none;} .var-card:hover, .chip:hover{transform:none;} }