/* Soto Mobile Detailing Orlando · Home v3 · converted from Claude Design (993a7597) · 2026-09-02 */
:root{--accent:#1437f5;--accent2:#244dff;--ink:#07111b;--paper:#f7f9fc;--muted:#64748b;--line:rgba(255,255,255,.14)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#07111b}
body{margin:0;background:#07111b;color:#f7f9fc;font-family:'Inter',"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
input,select,button{font:inherit}
h1,h2,h3,p,ul{margin:0}
svg.ic{width:16px;height:16px;flex:none}
main{overflow:hidden}
#soto3{min-height:100vh;background:#07111b;color:#f7f9fc}
.wrap{position:relative;max-width:1340px;margin:0 auto}
.grad{color:transparent;background:linear-gradient(100deg,#6f96ff,var(--accent2));-webkit-background-clip:text;background-clip:text}
.blue{color:#7da4ff}
.stars{color:#ffb800;letter-spacing:2px;font-size:14px}
.stars--sm{font-size:13px;letter-spacing:1px}
.stars--xs{font-size:12px;letter-spacing:2.5px}
.stars--lg{display:block;margin-top:4px;letter-spacing:4px;font-size:17px}
.lnk-w{transition:color .25s ease}.lnk-w:hover{color:#fff}
.lnk-gap{transition:gap .25s ease}.lnk-gap:hover{gap:12px}
@keyframes pulseDot{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes floatY{0%,100%{transform:rotate(6deg) translateY(0)}50%{transform:rotate(6deg) translateY(-8px)}}
@keyframes shine{0%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(340%) skewX(-18deg)}}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.rv.on{opacity:1;transform:translateY(0)}
.shine-btn{position:relative;overflow:hidden}
.shine-btn::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);animation:shine 3.2s ease-in-out infinite}
.float-note{animation:floatY 4s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.shine-btn::after,.float-note,.area-marquee{animation:none}}

/* utility bar */
.util-v3{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 0;min-height:36px;padding:7px 16px;background:linear-gradient(90deg,var(--accent),var(--accent2));color:#fff;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.util-v3>span{display:inline-flex;align-items:center;gap:7px;padding:0 18px}
.util-v3 .util-sep{width:1px;height:14px;padding:0;background:rgba(255,255,255,.35)}

/* header */
.hdr{position:sticky;top:0;z-index:50;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:26px;height:76px;padding:0 clamp(18px,3.4vw,52px);background:rgba(4,11,19,.92);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-bottom:1px solid rgba(255,255,255,.1)}
.hdr-logo{display:flex;align-items:center}
.hdr-logo img{width:92px;height:64px;object-fit:contain}
.desktop-nav-v3{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2vw,32px);font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#9aa9b8}
.hdr-right{display:flex;align-items:center;justify-content:flex-end;gap:18px}
.hdr-phone{display:flex;flex-direction:column;align-items:flex-end;line-height:1.25;transition:color .25s}
.hdr-phone:hover{color:#7da4ff}
.hdr-phone-lbl{font-size:9.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#9aa9b8}
.hdr-phone-num{display:inline-flex;align-items:center;gap:8px;font-size:21px;font-weight:900;color:#fff;letter-spacing:.01em}
.hdr-phone-m{display:none;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:8px;border:1px solid rgba(125,164,255,.5);background:rgba(20,55,245,.16);color:#fff;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.cta-s{display:none}
.hdr-cta{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 20px;border-radius:7px;background:linear-gradient(135deg,var(--accent2),var(--accent));color:#fff;font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 10px 26px rgba(20,55,245,.35);transition:transform .25s,box-shadow .25s}
.hdr-cta:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(20,55,245,.5)}

/* hero */
.hero{position:relative;background:#060f1a}
.hero-media{position:absolute;inset:0;overflow:hidden;z-index:0}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% center}
.hero-video{z-index:1;opacity:0;transition:opacity .6s ease}
.hero-video.ready{opacity:1}
.hero-pause{position:absolute;right:16px;bottom:16px;z-index:6;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(4,11,19,.65);color:#fff;cursor:pointer;backdrop-filter:blur(6px)}
.hero-pause[hidden]{display:none}
.hero-pause .ico-play{display:none}
.hero-pause[aria-pressed="true"] .ico-play{display:block}
.hero-pause[aria-pressed="true"] .ico-pause{display:none}
@media (max-width:600px){.hero-video,.hero-pause{display:none!important}.hero-poster{animation:kenburns 18s ease-in-out infinite alternate}}
@keyframes kenburns{0%{transform:scale(1)}100%{transform:scale(1.08)}}
@media (prefers-reduced-motion:reduce){.hero-video{display:none!important}.hero-poster{animation:none}}
.hero-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(4,10,18,.94) 30%,rgba(4,10,18,.62) 65%,rgba(4,10,18,.45)),linear-gradient(0deg,rgba(4,10,18,.75) 0%,transparent 24%),radial-gradient(900px 500px at 90% 0%,rgba(20,55,245,.3),transparent 60%)}
.hero-grid-v3{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;grid-template-areas:"lead form" "extras form";column-gap:clamp(28px,4vw,60px);row-gap:0;align-items:start;max-width:1340px;margin:0 auto;padding:clamp(40px,6vh,64px) clamp(18px,3.4vw,52px) 96px}
.hero-lead{grid-area:lead}
.hero-extras{grid-area:extras}
.hero-form-col{grid-area:form}
.hero-offer{margin-top:16px;max-width:560px;color:#d7e0ea;font-size:16px;line-height:1.55}
.hero-offer strong{color:#fff}
.hero-stars{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#d7e0ea}
#v3-h1{margin:16px 0 0;font-size:clamp(36px,4.3vw,58px);line-height:1.02;letter-spacing:-.015em;font-weight:900;text-transform:uppercase;font-style:italic}
.hero-usps{display:flex;flex-wrap:wrap;gap:12px clamp(16px,2.4vw,34px);margin-top:22px}
.usp{display:inline-flex;align-items:center;gap:10px}
.usp>span{line-height:1.3}
.usp strong{display:block;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.usp>span>span{color:#9aa9b8;font-size:12.5px}
.usp b{color:#7da4ff;font-weight:700}
.benefit-strip-v3{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:26px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.16);border-radius:10px;overflow:hidden;max-width:640px}
.benefit-strip-v3>span{display:flex;flex-direction:column;align-items:center;gap:7px;padding:15px 10px;background:rgba(6,15,26,.82);backdrop-filter:blur(6px);font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;text-align:center}
.call-row{display:flex;flex-wrap:wrap;align-items:stretch;gap:1px;margin-top:16px;max-width:640px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.16);border-radius:10px;overflow:hidden}
.call-strip{flex:1.2;display:flex;align-items:center;gap:13px;min-width:250px;padding:14px 18px;background:rgba(6,15,26,.85);backdrop-filter:blur(6px);transition:background .25s}
a.call-strip:hover{background:rgba(10,22,38,.9)}
.call-strip{flex:1 1 100%}
.call-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,var(--accent2),var(--accent));color:#fff}
.call-txt{line-height:1.25}
.call-lbl{display:block;color:#7da4ff;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.call-txt strong{font-size:20px;font-weight:900;letter-spacing:.02em}
.g-badge{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff}
.g-title{display:block;font-size:13.5px!important;font-weight:900}
.g-sub{color:#9aa9b8;font-size:12px}
.wa-line{margin-top:12px;color:#9aa9b8;font-size:12.5px}
.wa-line a{display:inline-flex;align-items:center;gap:6px;color:#d7e0ea;font-weight:700}
.wa-line a:hover{color:#fff}
.hero-form-col{position:relative}
.form-callouts{display:none}
.area-pill{display:none}

.hero-note-v3{position:absolute;top:-24px;right:14px;z-index:3;transform:rotate(3deg);display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:999px;background:linear-gradient(135deg,var(--accent2),var(--accent));border:1px solid rgba(255,255,255,.35);box-shadow:0 14px 34px rgba(20,55,245,.5);font-family:Caveat,'Segoe Script',cursive;font-size:21px;line-height:1;color:#fff;pointer-events:none;white-space:nowrap}
.quote{position:relative;max-width:400px;margin-left:auto;background:#fff;color:#0a1420;border-radius:12px;padding:20px 22px 16px;box-shadow:0 34px 80px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.1)}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{padding:5px 10px;border-radius:999px;color:#fff;font-size:9.5px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.pill--blue{background:var(--accent)}.pill--ink{background:#0a1420}
.quote-h{margin-top:14px;font-size:24px;font-weight:900;letter-spacing:-.01em;text-transform:uppercase;font-style:italic}
.quote-sub{margin-top:4px;color:#64748b;font-size:13px}
.form-grid-v3{display:grid;grid-template-columns:1fr;gap:12px;margin-top:16px}
.form-grid-v3 label{display:block;margin-bottom:5px;font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#334155}
.q-input{display:block;width:100%;height:46px;padding:0 12px;border:1px solid #d8e0ea;border-radius:7px;background:#fff;color:#0a1420;outline:none;appearance:auto;transition:border-color .2s,box-shadow .2s}
.q-input:focus{border-color:var(--accent2);box-shadow:0 0 0 3px rgba(36,77,255,.14)}
.q-input.is-invalid{border-color:#dc2626;box-shadow:0 0 0 3px rgba(220,38,38,.12)}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ts-holder{margin-top:12px;min-height:0}
.ts-holder:empty{display:none}
.q-submit{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;height:52px;margin-top:14px;border:0;border-radius:7px;background:linear-gradient(135deg,var(--accent2),var(--accent));color:#fff;font-size:13.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;cursor:pointer;box-shadow:0 12px 28px rgba(20,55,245,.3);transition:transform .25s,box-shadow .25s}
.q-submit:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(20,55,245,.45)}
.q-submit[disabled]{opacity:.7;cursor:progress;transform:none}
.q-foot{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:11px;color:#64748b;font-size:11.5px;text-align:center}
.q-state{display:inline-flex;align-items:center;gap:6px}
.q-state[hidden]{display:none}
.q-state--sent{color:#15803d;font-weight:700}
.q-state--error{color:#b91c1c}
.q-state--error a{font-weight:900;color:#0a1420;text-decoration:underline}

/* trust bar */
.trustbar-v3{position:relative;z-index:5;display:grid;grid-template-columns:repeat(5,1fr);gap:0;max-width:1240px;margin:-58px auto 0;border-radius:12px;background:#fff;color:#0a1420;box-shadow:0 24px 60px rgba(0,0,0,.35);overflow:hidden;transform:translateY(50%)}
.trustbar-v3>span{display:flex;align-items:center;justify-content:center;gap:10px;padding:18px 12px;border-right:1px solid #e8edf3;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;text-align:left}
.trustbar-v3>span:last-child{border-right:0}
.tb-sub{color:#64748b;font-weight:700}

/* areas band + marquee */
.areas-band{position:relative;z-index:2;padding:100px 0 44px;overflow:hidden}
.areas-band-head{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;padding:0 clamp(18px,3.4vw,52px) 24px}
.areas-flag{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;background:linear-gradient(135deg,var(--accent2),var(--accent));color:#fff;font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%);box-shadow:0 12px 30px rgba(20,55,245,.3)}
.areas-band-note{color:#9aa9b8;font-size:12.5px}
.areas-band-note a{color:#7da4ff;font-weight:900;text-transform:uppercase;font-size:11px;letter-spacing:.06em}
.marquee-wrap{position:relative}
.marquee-fade{position:absolute;top:0;bottom:0;width:110px;z-index:2;pointer-events:none}
.marquee-fade--l{left:0;background:linear-gradient(90deg,rgba(4,11,19,.85),transparent)}
.marquee-fade--r{right:0;background:linear-gradient(270deg,rgba(4,11,19,.85),transparent)}
.area-marquee{display:flex;gap:14px;width:max-content;padding:6px 0 10px;animation:marquee 32s linear infinite}
.area-marquee:hover{animation-play-state:paused}
.area-chip{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease,background .3s ease}
a.area-chip{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(11,24,37,.85);color:#e7eef7;font-size:13.5px;font-weight:800;letter-spacing:.03em;white-space:nowrap}
a.area-chip:hover{transform:translateY(-4px);border-color:rgba(125,164,255,.7);background:rgba(20,55,245,.18);box-shadow:0 14px 30px rgba(20,55,245,.28)}
.covered{display:inline-flex;align-items:center;gap:5px;color:#37e08d;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}

/* section chrome */
.kicker{color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.kicker--light{display:inline-flex;align-items:center;gap:9px;color:#7da4ff}
.kicker-line{width:22px;height:2px;background:var(--accent2)}
.sec-head{margin-bottom:38px}
.sec-head--row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px}
.sec-head h2,.proof-head h2,.areas h2,.faq h2{margin-top:10px;font-size:clamp(30px,3.4vw,46px);font-weight:900;letter-spacing:-.02em;text-transform:uppercase;font-style:italic}
.sec-lead{max-width:380px;color:#64748b;font-size:15px;line-height:1.6}
.sec-lead--light{color:#9aa9b8;font-size:14.5px}
.sec-lead--tight{margin-top:14px;max-width:420px;line-height:1.65}
.lede-cols{max-width:1040px;margin-top:18px;columns:2;column-gap:clamp(24px,3vw,48px)}
.lede-cols p{margin:0 0 14px;font-size:15px;line-height:1.7;break-inside:avoid}
@media (max-width:820px){.lede-cols{columns:1;max-width:640px}}
.wm{position:absolute;font-size:clamp(90px,13vw,190px);font-weight:900;font-style:italic;text-transform:uppercase;letter-spacing:-.03em;user-select:none;pointer-events:none;white-space:nowrap}
.wm--tr{top:-22px;right:-10px;color:transparent;-webkit-text-stroke:1.5px rgba(20,55,245,.1)}
.wm--bl{bottom:-30px;left:-14px;color:rgba(10,20,32,.04)}
.wm--proof{top:8px;right:-6px;z-index:1;font-size:clamp(80px,11vw,150px);color:transparent;-webkit-text-stroke:1.5px rgba(125,164,255,.12)}

/* services */
.services{position:relative;overflow:hidden;background:radial-gradient(900px 420px at 8% 0%,rgba(20,55,245,.08),transparent 60%),radial-gradient(800px 420px at 96% 100%,rgba(20,55,245,.07),transparent 60%),#f7f9fc;color:#0a1420;padding:clamp(64px,9vh,110px) clamp(18px,4vw,60px)}
.svc-watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-8deg);width:min(560px,60vw);opacity:.05;filter:grayscale(1);pointer-events:none}
.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cards-3{grid-template-columns:repeat(3,1fr)}
.svc-card{position:relative;display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:#fff;border:1px solid #e2e8f0;box-shadow:0 10px 30px rgba(7,17,27,.06);transition:transform .35s ease,box-shadow .35s ease}
.svc-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(7,17,27,.14)}
.svc-img{position:relative;height:190px;overflow:hidden}
.svc-img img{width:100%;height:100%;object-fit:cover;display:block}
.svc-price{position:absolute;top:12px;right:12px;padding:6px 10px;border-radius:999px;background:rgba(4,11,19,.78);color:#fff;font-size:11px;font-weight:800;letter-spacing:.06em}
.svc-body{display:flex;flex-direction:column;gap:8px;flex:1;padding:18px 18px 20px}
.svc-body h3{font-size:18px;font-weight:900;letter-spacing:-.01em}
.svc-body p{color:#64748b;font-size:13.5px;line-height:1.55;flex:1}
.svc-link{display:inline-flex;align-items:center;gap:8px;margin-top:6px;color:var(--accent);font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}

/* proof / finish lab */
.proof{position:relative;overflow:hidden;background:#050d17;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.proof-head{position:relative;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;max-width:1340px;margin:0 auto;padding:clamp(52px,7vh,80px) clamp(18px,4vw,60px) 34px}
.proof-head h2{color:#fff}
.finish-lab-v3{display:grid;grid-template-columns:minmax(230px,280px) minmax(380px,1.2fr) minmax(320px,.95fr);min-height:560px}
.ft-tabs{display:grid;grid-template-rows:repeat(4,1fr);background:#050d16;border-right:1px solid rgba(255,255,255,.1)}
.ft-tab{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;padding:18px 44px 18px 22px;cursor:pointer;text-align:left;border:0;border-bottom:1px solid rgba(255,255,255,.1);background:transparent;color:#9aa9b8;transition:background .3s ease,color .3s ease}
.ft-tab.on{background:linear-gradient(125deg,#0d31f7,#174dff);box-shadow:inset 3px 0 #84a0ff;color:#fff}
.ft-title{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.ft-tab small{font-size:10px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.ft-tab .arr{position:absolute;right:18px;top:50%;transform:translateY(-50%);opacity:.35}
.ft-tab.on .arr{opacity:1}
.ft-media{position:relative;min-height:420px;overflow:hidden}
.ft-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:contrast(1.08) saturate(1.1);transition:opacity .35s}
.ft-media img.fade{opacity:0}
.ft-media-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,13,22,.35),transparent 30%,transparent 70%,rgba(2,9,17,.55))}
.ft-tag{position:absolute;bottom:18px;right:18px;padding:7px 12px;border:1px solid rgba(255,255,255,.4);background:rgba(2,9,17,.7);color:#fff;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.ft-panel{display:flex;flex-direction:column;justify-content:center;padding:40px clamp(26px,3vw,48px);background:linear-gradient(145deg,#071523,#020911 80%)}
.ft-panel h2{margin:13px 0 12px;font-size:clamp(32px,3vw,48px);font-weight:900;letter-spacing:-.02em;text-transform:uppercase;font-style:italic}
.ft-copy{color:#b6c2d0;font-size:13.5px;line-height:1.65}
.ft-pricebox{display:flex;align-items:center;gap:18px;margin:18px 0 4px;padding:14px 18px;border-radius:10px;background:rgba(20,55,245,.12);border:1px solid rgba(125,164,255,.3)}
.ft-price-col{display:flex;flex-direction:column;line-height:1.1}
.ft-price-row{display:flex;align-items:baseline;gap:6px}
.ft-price-row small,.ft-dur-col small{color:#7da4ff;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.ft-price-row strong{font-size:30px;font-weight:900;font-style:italic;letter-spacing:-.02em;color:#fff}
.ft-price-note{margin-top:4px;color:#9aa9b8;font-size:10.5px;letter-spacing:.05em}
.ft-vsep{width:1px;align-self:stretch;background:rgba(125,164,255,.3)}
.ft-dur-col{display:flex;flex-direction:column;gap:4px;line-height:1.1}
.ft-dur-col strong{display:inline-flex;align-items:center;gap:7px;font-size:15px;font-weight:900;color:#fff}
.ft-addon{display:block;margin-top:6px;color:#9aa9b8;font-size:11px;letter-spacing:.02em}
.ft-addon[hidden]{display:none}
.ft-inc-lbl{display:block;margin-top:10px;color:#64748b;font-size:10px;letter-spacing:.06em;text-transform:uppercase}
.ft-features{display:grid;gap:9px;margin:12px 0 23px;padding:0;list-style:none}
.ft-features li{display:flex;align-items:center;gap:10px;color:#d7e0ea;font-size:12px;font-weight:700;letter-spacing:.03em}
.ft-level-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.ft-level-head span{color:#9aa9b8;font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.ft-level-head strong{font-size:12px;font-weight:900;letter-spacing:.1em}
.ft-meter{position:relative;height:6px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}
.ft-meter i{position:absolute;top:0;bottom:0;left:0;border-radius:999px;background:linear-gradient(90deg,#174dff,#84a0ff);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.ft-cta{display:inline-flex;align-items:center;gap:9px;margin-top:24px;color:#fff;font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:6px;width:fit-content;transition:color .25s,gap .25s,border-color .25s}
.ft-cta:hover{color:#7da4ff;gap:13px;border-color:#7da4ff}

/* how it works */
.how{background:#f7f9fc;color:#0a1420;padding:clamp(64px,9vh,110px) clamp(18px,4vw,60px)}
.how-card{position:relative;border-radius:12px;background:#fff;border:1px solid #e2e8f0;padding:26px;overflow:hidden}
.how-card h3{font-size:19px;font-weight:900}
.how-card p{margin-top:8px;color:#64748b;font-size:14px;line-height:1.6}
.how-num{position:absolute;top:14px;right:18px;font-size:44px;font-weight:900;font-style:italic;color:#8593a6}
.how-num--light{color:rgba(255,255,255,.35)}
.how-card--img{padding:0;min-height:180px}
.how-card--img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.how-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,10,18,.85) 0%,transparent 55%)}
.how-txt{position:absolute;left:20px;right:20px;bottom:16px;color:#fff}
.how-txt p{margin-top:6px;color:#c6d2de;font-size:14px;line-height:1.5}

/* reviews */
.reviews{position:relative;overflow:hidden;background:radial-gradient(700px 300px at 12% 0%,rgba(20,55,245,.2),transparent 60%),#07111b;padding:clamp(44px,6vh,64px) clamp(18px,4vw,60px)}
.split-2{display:grid;gap:clamp(22px,3vw,48px);align-items:center;max-width:1340px;margin:0 auto}
.reviews-grid{grid-template-columns:.55fr 1.45fr}
.rating-row{display:flex;align-items:baseline;gap:12px}
.rating-big{font-size:clamp(52px,5vw,72px);font-weight:900;font-style:italic;letter-spacing:-.03em;line-height:1}
.g-badge--lg{width:36px;height:36px;border-radius:9px;transform:translateY(-4px)}
.rating-sub{display:block;margin-top:7px;color:#9aa9b8;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.ra-link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;color:#7da4ff;font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;transition:color .25s,gap .25s}
.ra-link:hover{color:#fff;gap:12px}
.rv-cards{gap:12px}
.rv-copy h2{font-size:clamp(26px,3vw,40px);font-weight:900;letter-spacing:-.02em;text-transform:uppercase;font-style:italic}
.rv-copy p{margin-top:14px;color:#b6c2d0;font-size:15px;line-height:1.7;max-width:640px}
.rv-points{margin-top:18px}
.lbl-hint{font-weight:600;letter-spacing:0;text-transform:none;color:#64748b}
.q-input[hidden]{display:none!important}
.places-holder{margin-top:0}
.places-holder[hidden]{display:none}
gmp-place-autocomplete{display:block;width:100%;min-height:46px;border:1px solid #d8e0ea;border-radius:7px;background:#fff;color:#0a1420;box-sizing:border-box;--gmp-mat-font-body-medium:500 16px/22px Inter,system-ui,sans-serif;--gmp-mat-font-body-large:500 16px/22px Inter,system-ui,sans-serif;font-size:16px}
gmp-place-autocomplete.is-invalid{border-color:#dc2626;box-shadow:0 0 0 3px rgba(220,38,38,.15)}
.quote--dark gmp-place-autocomplete{background:#0d1a2b;border-color:rgba(255,255,255,.14);color:#fff}
.rv-card{display:flex;flex-direction:column;gap:9px;padding:18px;border-radius:11px;background:rgba(11,24,37,.9);border:1px solid rgba(255,255,255,.1);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.rv-card:hover{transform:translateY(-4px);border-color:rgba(125,164,255,.5);box-shadow:0 16px 36px rgba(20,55,245,.22)}
.rv-card p{color:#d7e0ea;font-size:13.5px;line-height:1.6;flex:1}
.rv-who{display:flex;align-items:center;gap:8px;color:#9aa9b8;font-size:11.5px;font-weight:700}
.rv-ini{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,var(--accent2),var(--accent));color:#fff;font-size:10px;font-weight:900}

/* areas */
.areas{background:#f7f9fc;color:#0a1420;padding:clamp(64px,9vh,110px) clamp(18px,4vw,60px)}
.areas-grid{grid-template-columns:1fr 1.05fr;gap:clamp(28px,4vw,70px)}
.area-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px;max-width:460px}
.area-btn{display:flex;align-items:center;gap:9px;width:100%;min-height:48px;padding:12px 14px;border-radius:8px;cursor:pointer;font-size:13.5px;font-weight:800;text-align:left;border:1px solid #e2e8f0;background:#fff;color:#0a1420}
.area-btn .arr{margin-left:auto;opacity:0}
.area-btn.on{border-color:var(--accent2);background:linear-gradient(135deg,var(--accent2),var(--accent));color:#fff;box-shadow:0 14px 30px rgba(20,55,245,.3)}
.area-btn.on .arr{opacity:1}
.area-btn:hover{transform:translateY(-4px);border-color:rgba(125,164,255,.7);box-shadow:0 14px 30px rgba(20,55,245,.28)}
.areas-hint{margin-top:12px;color:#5b6b80;font-size:12px;letter-spacing:.04em}
.areas-more{margin-top:18px;color:#64748b;font-size:13.5px}
.areas-more a{color:var(--accent);font-weight:800}
.map-card{border-radius:14px;overflow:hidden;border:1px solid #e2e8f0;box-shadow:0 20px 50px rgba(7,17,27,.1);background:#fff}
.map-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #e2e8f0;font-size:13px;font-weight:800}
.map-title{display:inline-flex;align-items:center;gap:8px}
.map-live{display:inline-flex;align-items:center;gap:6px;color:#15803d;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.map-live i{width:7px;height:7px;border-radius:50%;background:#16a34a;animation:pulseDot 2s infinite}
#area-map{display:block;width:100%;height:380px;border:0}

/* faq */
.faq{background:#f7f9fc;color:#0a1420;padding:0 clamp(18px,4vw,60px) clamp(64px,9vh,110px)}
.faq-grid{grid-template-columns:.8fr 1.2fr;gap:clamp(28px,4vw,70px);align-items:start}
.faq-list{border-top:1px solid #dbe3ec}
.faq-item{border-bottom:1px solid #dbe3ec}
.faq-q{display:flex;width:100%;align-items:center;justify-content:space-between;gap:16px;padding:19px 2px;border:0;background:none;cursor:pointer;text-align:left;font-size:16px;font-weight:800;color:#0a1420}
.faq-q .chev{color:#64748b;transition:transform .25s ease}
.faq-item.on .chev{transform:rotate(180deg)}
.faq-a{padding:0 2px 20px;max-width:620px;color:#64748b;font-size:14.5px;line-height:1.7}
.faq-a[hidden]{display:none}

/* final cta */
.final-cta{position:relative;overflow:hidden;background:linear-gradient(135deg,#244dff 0%,#1437f5 55%,#0d2ad0 100%);color:#fff;padding:clamp(70px,10vh,120px) clamp(18px,4vw,60px)}
.final-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 400px at 85% 10%,rgba(255,255,255,.18),transparent 60%),repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 2px,transparent 2px 22px);pointer-events:none}
.final-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.32}
.final-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,10,18,.94) 20%,rgba(4,10,18,.55))}
.final-inner{position:relative;max-width:1340px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:clamp(28px,4vw,64px)}
.final-lede{margin-top:16px;max-width:520px;color:#dbe4ff;font-size:16px;line-height:1.65}
.final-note{margin-top:18px;color:#bcd0ff;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.final-cta h2{margin-top:10px;font-size:clamp(32px,4vw,54px);font-weight:900;letter-spacing:-.02em;text-transform:uppercase;font-style:italic}
.final-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.cta-w,.cta-o{display:inline-flex;align-items:center;gap:9px;height:56px;padding:0 26px;border-radius:7px;font-size:13px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;transition:transform .25s,border-color .25s}
.cta-w{background:#fff;color:#07111b;box-shadow:0 14px 34px rgba(0,0,0,.25)}
.cta-w:hover{transform:translateY(-2px)}
.cta-o{border:1px solid rgba(255,255,255,.55);color:#fff;background:rgba(4,11,19,.18)}
.cta-o:hover{border-color:#fff;transform:translateY(-2px)}

/* footer */
.ft{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;max-width:1340px;margin:0 auto;padding:56px clamp(18px,4vw,60px) 90px;background:#07111b;color:#9aa9b8;font-size:13.5px}
.ft img{width:132px;height:90px;object-fit:contain}
.ft p{margin-top:12px;max-width:300px;line-height:1.6}
.ft-contact{display:inline-flex;align-items:center;gap:8px;margin-top:12px;margin-right:16px;color:#fff;font-weight:800}
.ft-col{display:flex;flex-direction:column;gap:10px}
.ft-col h3{color:#fff;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.ft-sys{margin-top:14px;font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#7da4ff}
.ft-copy{margin-top:6px;font-size:12px;color:#8a97a8}

/* mobile bar */
.m-bar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;align-items:stretch;gap:1px;background:rgba(255,255,255,.14);border-top:1px solid rgba(255,255,255,.14)}
.m-call,.m-quote{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;color:#fff;font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.m-call{flex:1.35;background:#07111b;font-size:13px;letter-spacing:.06em}
.m-quote{flex:1}
.m-quote{background:linear-gradient(135deg,var(--accent2),var(--accent))}

/* responsive (from design helmet) */
@media (max-width:1080px){.hero-grid-v3{grid-template-columns:1fr}.hero-note-v3{display:none}.finish-lab-v3{grid-template-columns:1fr}}
@media (max-width:960px){
  .split-2{grid-template-columns:minmax(0,1fr)!important}
  .cards-4{grid-template-columns:1fr 1fr}
  .trustbar-v3{grid-template-columns:1fr 1fr;margin:-30px 18px 0;transform:none}
  .trustbar-v3>span{padding:14px 12px;font-size:10.5px;border-right:0}
  .trustbar-v3>span:last-child{grid-column:1/-1}
  .m-bar{display:flex;gap:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:rgba(6,13,24,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid rgba(255,255,255,.08)}
  .m-call{flex:1;min-height:58px;border-radius:14px;background:linear-gradient(135deg,#1437f5,#2a56ff);font-size:15px;letter-spacing:.04em;box-shadow:0 12px 30px rgba(20,55,245,.45)}
  .m-call .ic{width:20px;height:20px}
  .desktop-nav-v3{display:none}
  .util-v3{display:none}
  .hdr{height:64px;gap:10px}
  .hdr-phone{display:none}
  .hdr-cta{height:40px;padding:0 12px;font-size:10px;white-space:nowrap}
  .hdr-logo img{width:74px;height:52px}
  .wm{display:none}
  .sec-head{margin-bottom:26px}
  .sec-head h2,.proof-head h2,.areas h2,.faq h2{font-size:clamp(28px,8vw,36px)}
  .sec-lead{font-size:13.5px}
  section[id],section[aria-label]{padding-left:18px;padding-right:18px}
  .final-cta h2{font-size:clamp(26px,7.5vw,34px)}
  .final-btns{width:100%}
  .final-btns a{flex:1;justify-content:center}
  .ft{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px 18px;padding-bottom:110px}
  .ft>div{min-width:0}
  .ft .ft-contact{overflow-wrap:anywhere;word-break:break-word}
  .ft>div:first-child{grid-column:1/-1}
  .hero-grid-v3{grid-template-columns:minmax(0,1fr);grid-template-areas:"lead" "form" "extras";padding-top:22px;padding-bottom:48px;row-gap:22px}
  #v3-h1{font-size:clamp(26px,7vw,40px);line-height:1.04}
  .hero-offer{font-size:15px;margin-top:12px}
  .hero-usps{display:none}
  .hero-lead,.hero-form-col,.hero-extras{min-width:0;max-width:100%}
  .form-grid-v3{grid-template-columns:minmax(0,1fr)}
  .ft-lab,.ft-grid,.ft-wrap,.ft-tabs,.finish-lab-v3{min-width:0}
  .finish-lab-v3{grid-template-columns:minmax(0,1fr)}
  .ft-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft-tab,.ft-panel,.ft-media{min-width:0}
  .ft-tab{overflow-wrap:anywhere}
  .split-2{grid-template-columns:minmax(0,1fr)}
  .split-2>div,.split-2>*{min-width:0}
  .area-btns{grid-template-columns:repeat(2,minmax(0,1fr))}
  .area-btn{min-width:0;overflow-wrap:anywhere}
  .form-grid-v3>div{min-width:0}
  .q-input,.q-select,gmp-place-autocomplete{min-width:0;width:100%;max-width:100%;box-sizing:border-box}
  .hero-form-col .quote-card,.hero-form-col .quote{min-width:0;width:100%}
  .hero-extras .benefit-strip-v3{display:none}
  .trustbar-v3{display:none}
  .hero-grid-v3{padding-top:6px;padding-bottom:10px;row-gap:8px}
  .hero-stars,.hero-offer{display:none}
  .hero-lead{position:relative;isolation:isolate;padding-top:8px}
  .hero-lead::before{content:"";position:absolute;left:-18px;right:-18px;top:-12px;height:210px;z-index:-1;pointer-events:none;background:radial-gradient(70% 75% at 22% 45%,rgba(20,55,245,.34),transparent 72%)}
  #v3-h1{font-size:26px;line-height:.98;letter-spacing:-.02em;text-shadow:0 2px 22px rgba(0,0,0,.5)}

  #v3-h1 .grad{background:linear-gradient(95deg,#9ab7ff,#3d6bff 55%,#8fb0ff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(61,107,255,.35))}
  #v3-h1::after{content:"";display:block;width:64px;height:3px;margin-top:9px;border-radius:2px;background:linear-gradient(90deg,#1437f5,#8fb0ff);box-shadow:0 0 12px rgba(20,55,245,.6)}
  .hero-form-col .quote{padding:12px 12px 10px;border-radius:14px}
  .quote .pills{display:none}
  .quote-h{font-size:17px;line-height:1.1;margin:0 0 6px}
  .quote-sub{display:none}
  .form-grid-v3{gap:8px;margin-top:0}
  .form-grid-v3 label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .form-grid-v3>div{position:relative}
  .q-input,gmp-place-autocomplete{height:42px;min-height:42px}
  .q-submit{height:48px;margin-top:8px}
  .q-foot{margin:0;min-height:0}
  .q-state--idle{display:none}
  .hero-extras{display:flex;flex-direction:column;gap:8px}
  .hero-form-col .quote{background:linear-gradient(180deg,rgba(12,22,38,.86),rgba(6,13,24,.9));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);box-shadow:0 26px 60px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06);color:#f7f9fc}
  .hero-form-col .quote-h{color:#fff}
  .hero-form-col .q-input{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#fff}
  .hero-form-col .q-input::placeholder{color:#8ea0b5}
  .hero-form-col select.q-input{background-color:#0d1a2b;color:#fff}
  .hero-form-col select.q-input option{color:#0a1420;background:#fff}
  .hero-form-col gmp-place-autocomplete{background:#0d1a2b;border-color:rgba(255,255,255,.16);color:#fff}
  .hero-form-col .q-input.is-invalid,.hero-form-col gmp-place-autocomplete.is-invalid{border-color:#ff6b6b}
  .hero-form-col .q-foot{color:#9aa9b8}
  .hero-form-col .q-state--error a{color:#fff}
  .hero-form-col .q-submit{box-shadow:0 12px 30px rgba(20,55,245,.42)}
  .hero-form-col .quote{position:relative;overflow:hidden}
  .hero-form-col .quote::before{content:"";position:absolute;left:14%;right:14%;top:0;height:2px;border-radius:0 0 2px 2px;background:linear-gradient(90deg,transparent,#3d6bff,#8fb0ff,#3d6bff,transparent);opacity:.95}
  .hero-form-col .quote-h{padding-bottom:7px;margin-bottom:7px;border-bottom:1px solid rgba(255,255,255,.08)}
  .hero-form-col .form-grid-v3{gap:9px}
  .hero-form-col .q-input,.hero-form-col gmp-place-autocomplete{height:44px;min-height:44px;border-radius:10px;background:rgba(255,255,255,.085);border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1px 0 rgba(0,0,0,.35);color:#fff;font-size:15px}
  .hero-form-col .q-input::placeholder{color:#a7b4c6}
  .hero-form-col .q-input:focus,.hero-form-col gmp-place-autocomplete:focus-within{border-color:#7da4ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 3px rgba(20,55,245,.35);background:rgba(255,255,255,.11)}
  .hero-form-col #q-name,.hero-form-col #q-phone,.hero-form-col select#q-service{background-repeat:no-repeat;background-position:13px center;background-size:18px 18px;padding-left:40px}
  .hero-form-col #q-name{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fb0ff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-7 8-7s8 3 8 7'/%3E%3C/svg%3E")}
  .hero-form-col #q-phone{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fb0ff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E")}
  .hero-form-col select#q-service{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fb0ff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8z'/%3E%3Cpath d='M19 17l.7 2 2 .7-2 .7-.7 2-.7-2-2-.7 2-.7z'/%3E%3C/svg%3E");background-color:rgba(255,255,255,.085)}
  .hero-form-col .q-submit{height:50px;border-radius:12px;letter-spacing:.12em}
  .call-strip{background:linear-gradient(135deg,#1437f5,#2a56ff);border:0;justify-content:center;gap:12px;padding:11px 14px;border-radius:14px;box-shadow:0 16px 36px rgba(20,55,245,.38)}
  .call-ico{background:#fff;color:#1437f5}
  .call-lbl{color:rgba(255,255,255,.82)}
  .call-txt strong{color:#fff}
  .wa-line{text-align:center}
  .areas-band .area-pill{margin:2px 18px 10px}
  .hero-extras>*{margin-top:0!important;margin-bottom:0!important}
  .area-pill{display:flex;align-items:center;justify-content:center;gap:8px;min-height:34px;padding:5px 12px;border-radius:999px;white-space:nowrap;background:rgba(20,55,245,.16);border:1px solid rgba(125,164,255,.35);color:#fff;font-size:12.5px;font-weight:700;text-decoration:none;text-align:center;flex-wrap:wrap}
  .area-pill .ic{width:15px;height:15px;color:#8fb0ff}
  .area-pill span{color:#9fb0c3;font-weight:500}
  .form-callouts{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);align-items:stretch;list-style:none;margin:16px 0 0;padding:14px 6px;border-radius:18px;background:linear-gradient(180deg,rgba(15,27,46,.9),rgba(6,14,26,.94));border:1px solid rgba(120,160,255,.5);box-shadow:0 0 0 1px rgba(20,55,245,.2),0 0 26px rgba(20,55,245,.42),0 18px 44px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.07)}
  .form-callouts li{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;padding:2px 4px;border-left:1px solid rgba(255,255,255,.12)}
  .form-callouts li:first-child{border-left:0}
  .fc-ico{flex:0 0 40px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 28%,#22355e,#0a1426 72%);border:1px solid rgba(125,164,255,.55);box-shadow:inset 0 2px 5px rgba(255,255,255,.14),inset 0 -4px 8px rgba(0,0,0,.55),0 0 14px rgba(20,55,245,.4)}
  .fc-ico--gold{border-color:rgba(245,179,1,.6);box-shadow:inset 0 2px 5px rgba(255,255,255,.14),inset 0 -4px 8px rgba(0,0,0,.55),0 0 14px rgba(245,179,1,.35)}
  .fc-ico svg{width:22px;height:22px}
  .fc-star{color:#f7b500;font-size:22px;line-height:1;text-shadow:0 1px 0 rgba(0,0,0,.4),0 0 10px rgba(247,181,0,.55)}
  .fc-txt{min-width:0;font-size:12.5px;font-weight:700;line-height:1.2;color:#fff;letter-spacing:-.01em}
  .form-callouts{margin:0;padding:7px 6px;grid-template-columns:auto minmax(0,1fr)}
  .form-callouts{border-color:rgba(125,164,255,.3);box-shadow:0 0 0 1px rgba(20,55,245,.12),0 0 18px rgba(20,55,245,.25),0 14px 34px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.06)}
  .form-callouts{grid-template-columns:auto auto;justify-content:center;padding:8px 4px}
  .form-callouts li{padding:2px 12px;gap:9px}
  .fc-ico{flex-basis:34px;width:34px;height:34px;position:relative;isolation:isolate;border:0;background:radial-gradient(circle at 35% 28%,#17264a,#070e1a 72%);box-shadow:inset 0 1px 2px rgba(255,255,255,.14),inset 0 -3px 6px rgba(0,0,0,.6),0 0 12px rgba(20,55,245,.35)}
  .fc-ico::before{content:"";position:absolute;inset:-1.5px;border-radius:50%;z-index:-1;background:conic-gradient(from 200deg,#9fc0ff,#2a56ff 35%,#dbe6ff 55%,#1437f5 75%,#9fc0ff)}
  .fc-ico::after{content:"";position:absolute;inset:1px;border-radius:50%;background:radial-gradient(circle at 35% 22%,rgba(255,255,255,.22),transparent 55%);pointer-events:none}
  .fc-ico--gold{box-shadow:inset 0 1px 2px rgba(255,255,255,.14),inset 0 -3px 6px rgba(0,0,0,.6),0 0 12px rgba(245,179,1,.35)}
  .fc-ico--gold::before{background:conic-gradient(from 200deg,#ffe8a3,#c9971c 35%,#fff3c4 55%,#a86f08 75%,#ffe8a3)}
  .fc-ico svg{width:20px;height:20px;position:relative;z-index:1}
  .fc-ico--gold svg{filter:drop-shadow(0 0 5px rgba(247,181,0,.55))}
  .fc-ico--bolt{background:radial-gradient(circle at 35% 28%,#101d3a,#04091a 74%)}
  .fc-ico--bolt svg{width:22px;height:22px;filter:drop-shadow(0 0 6px rgba(143,176,255,.8))}
  .fc-txt{font-size:13px;white-space:nowrap}
  .fc-ico--google{background:radial-gradient(circle at 35% 28%,#ffffff,#e6ecf6 75%);box-shadow:inset 0 -2px 4px rgba(0,0,0,.18),inset 0 1px 1px rgba(255,255,255,.9),0 0 12px rgba(255,255,255,.22)}
  .fc-ico--google::before{background:conic-gradient(from 200deg,#ffffff,#c3cfe3 35%,#ffffff 55%,#aebbd3 75%,#ffffff)}
  .fc-ico--google::after{background:none}
  .fc-ico--google svg{width:18px;height:18px;filter:none}
  .fc-txt .fc-star{color:#f7b500;font-size:12px;font-style:normal;margin-right:1px;text-shadow:0 0 6px rgba(247,181,0,.5)}

  .fc-ico{flex-basis:34px;width:34px;height:34px}

  .hero-extras .call-row-v3,.hero-extras .call-strip{margin-top:0}
  .map-pre{display:none}
  .hdr-phone-m{display:inline-flex;height:40px;padding:0 12px;font-size:12px;letter-spacing:.03em;white-space:nowrap;background:var(--accent);border-color:var(--accent);box-shadow:0 6px 18px rgba(20,55,245,.35)}
  .hdr-phone-m span{display:inline}
  .hdr-cta{display:none}
  .hdr-right{gap:8px}
  .cta-l{display:none}
  .cta-s{display:inline}
  .quote{max-width:none;margin-left:0}
  .ft-tabs{grid-template-rows:none;grid-template-columns:1fr 1fr;border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}
  .ft-tab{padding:14px 34px 14px 14px}
  .ft-title{font-size:11.5px}
  .ft-media{min-height:260px}
  .ft-panel{padding:28px 18px 34px}
  .ft-panel h2{font-size:28px}
  a.area-chip{padding:10px 14px;font-size:12.5px}
  .benefit-strip-v3{grid-template-columns:1fr 1fr}
  .benefit-strip-v3>span{padding:12px 8px;font-size:9.5px}
  .rv-cards{grid-template-columns:1fr}
  .reviews-grid{gap:22px}
  .rv-card p{font-size:14px}
  .areas-band{padding-top:0;padding-bottom:22px}
  .areas-band-head{display:none}
  .area-marquee{padding:4px 0 8px}
}
@media (max-width:620px){.cards-4{grid-template-columns:1fr}.form-grid-v3{grid-template-columns:1fr}}


/* ═══ Premium 10-10 pass · 2026-09-02 ═══ */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;padding:10px 14px;border-radius:8px;background:#fff;color:#07111b;font-weight:800}
.skip:focus{left:12px}
:focus-visible{outline:3px solid #7da4ff;outline-offset:3px}
section[id],.how{scroll-margin-top:96px}
h1,h2,h3{font-family:'Inter',"Helvetica Neue",Arial,sans-serif}
.kicker--onblue{color:#dbe4ff}
.rv-kicker{display:inline-flex;margin-bottom:12px}

/* mobile menu */
.m-toggle{display:none;width:44px;height:44px;padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(255,255,255,.04);cursor:pointer;flex-direction:column;justify-content:center;gap:5px}
.m-toggle span{display:block;height:2px;border-radius:2px;background:#fff;transition:transform .25s,opacity .25s}
.m-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.m-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.m-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.m-menu{position:fixed;top:64px;left:0;right:0;z-index:49;display:flex;flex-direction:column;padding:10px 18px 22px;background:rgba(4,11,19,.97);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.1);box-shadow:0 30px 60px rgba(0,0,0,.5)}
.m-menu[hidden]{display:none}
.m-menu>a{padding:14px 4px;border-bottom:1px solid rgba(255,255,255,.08);font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#e7eef7}
.m-menu-contact{display:flex;flex-direction:column;gap:10px;padding-top:16px}
.m-menu-phone{display:inline-flex;align-items:center;gap:10px;font-size:22px;font-weight:900;color:#fff}
.m-menu-wa{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#d7e0ea}
.m-menu-hours{color:#7da4ff;font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
body.menu-open{overflow:hidden}

/* certifications strip */

/* the Soto standard · accent block */
.standard{position:relative;overflow:hidden;background:linear-gradient(135deg,#244dff,#1437f5 60%,#0f2fd9);color:#fff;padding:clamp(64px,9vh,110px) clamp(18px,4vw,60px)}
.standard::before{content:"";position:absolute;inset:0;background:radial-gradient(800px 420px at 100% 0%,rgba(255,255,255,.16),transparent 60%),repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 2px,transparent 2px 22px);pointer-events:none}
.standard .wrap{position:relative}
.standard h2{margin-top:10px;font-size:clamp(32px,4vw,56px);font-weight:900;letter-spacing:-.02em;text-transform:uppercase;font-style:italic;line-height:1.02}
.standard h2 em{color:#bcd0ff;font-style:italic}
.std-lede{margin-top:16px;max-width:640px;color:#dbe4ff;font-size:16px;line-height:1.65}
.stats-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;margin-top:40px;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.28);border-radius:14px;overflow:hidden}
.stat{display:flex;flex-direction:column;gap:8px;padding:26px 20px;background:rgba(7,17,27,.22);backdrop-filter:blur(4px)}
.stat strong{font-size:clamp(30px,3vw,40px);font-weight:900;font-style:italic;letter-spacing:-.02em;line-height:1}
.stat span{color:#dbe4ff;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.35}

/* crew */
.crew{position:relative;overflow:hidden;background:#07111b;padding:clamp(64px,9vh,110px) clamp(18px,4vw,60px)}
.crew-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,64px);align-items:center}
.crew-media{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.crew-media img{width:100%;height:100%;object-fit:cover;border-radius:14px;border:1px solid rgba(255,255,255,.1);box-shadow:0 24px 60px rgba(0,0,0,.45)}
.crew-owner{aspect-ratio:3/4;object-position:60% center}
.crew-team{aspect-ratio:3/4;margin-top:48px}
.crew-copy h2{margin-top:12px;font-size:clamp(30px,3.6vw,50px);font-weight:900;letter-spacing:-.02em;text-transform:uppercase;font-style:italic;line-height:1.02}
.crew-copy p{margin-top:16px;color:#b6c2d0;font-size:15.5px;line-height:1.7;max-width:520px}
.crew-points{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none;color:#e7eef7;font-size:13px;font-weight:700;letter-spacing:.03em}
.crew-copy .ft-cta{margin-top:26px}

/* real work gallery */
.work{background:#f7f9fc;color:#0a1420;padding:clamp(64px,9vh,110px) clamp(18px,4vw,60px)}
.work .sec-head--row>div{max-width:780px}
.work .ra-link--dark{margin-left:auto;align-self:flex-end;padding-bottom:6px}
.ra-link--dark{color:var(--accent);margin-top:0}
.ra-link--dark:hover{color:#0a1420}
.work-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:14px}
.work-card{position:relative;margin:0;border-radius:12px;overflow:hidden;background:#0a1420;border:1px solid #e2e8f0;box-shadow:0 10px 30px rgba(7,17,27,.08)}
.work-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.work-card:hover img{transform:scale(1.04)}
.work-card figcaption{position:absolute;left:14px;top:14px;padding:6px 10px;border-radius:999px;background:rgba(4,11,19,.78);color:#fff;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;backdrop-filter:blur(6px)}
.work-card--lg{grid-column:span 2;grid-row:span 2}
.work-card--tall{grid-row:span 2}

/* final CTA dark floating card */
.quote--dark{background:#07111b;color:#f7f9fc;box-shadow:0 34px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.08);margin-left:0;max-width:none}
.quote--dark .quote-h{color:#fff}
.quote--dark .quote-sub{color:#9aa9b8}
.quote--dark .form-grid-v3 label{color:#c6d2de}
.quote--dark .q-input{background:#0d1a2b;border-color:rgba(255,255,255,.14);color:#fff}
.quote--dark .q-input::placeholder{color:#7f8da0}
.quote--dark .q-foot{color:#9aa9b8}
.quote--dark .q-state--error a{color:#fff}
.pill--light{background:rgba(255,255,255,.14);color:#fff}

@media (max-width:1180px){.stats-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:960px){
  .m-toggle{display:flex}
  .final-inner{grid-template-columns:1fr}
  .crew-grid{grid-template-columns:1fr}
  .crew-team{margin-top:28px}
  .work-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:180px}
  .work-card--lg{grid-column:span 2;grid-row:span 2}
  .work-card--tall{grid-row:span 1}
  
  .stats-grid{grid-template-columns:repeat(2,1fr);margin-top:28px}
  .stat{padding:18px 14px}
  .stat strong{font-size:26px}
  .standard h2{font-size:clamp(28px,8vw,36px)}
  .crew-copy h2{font-size:clamp(28px,8vw,36px)}
  section[id],.how{scroll-margin-top:72px}
}
@media (max-width:620px){.final-btns{flex-direction:column}.final-btns a{width:100%;flex:none;justify-content:center;height:auto;min-height:56px;padding:14px 18px;text-align:center}.work-card:last-child{grid-column:span 2}}
@media (max-width:480px){.work-grid{grid-auto-rows:150px}.crew-media{gap:10px}.crew-team{margin-top:20px}}
@media (max-width:360px){.form-callouts li{gap:7px;padding:2px 8px}.fc-ico{flex-basis:30px;width:30px;height:30px}.fc-ico svg{width:17px;height:17px}.fc-txt{font-size:11.5px}}
.ft-social{display:inline-flex;align-items:center;gap:8px}

/* ── Deep premium pass 2026-09-02 · photo layers · motion system · tiers ─────────────────────────── */
.has-pbg{position:relative;overflow:hidden;isolation:isolate;background:#07111b!important}
.services.has-pbg,.how.has-pbg,.work.has-pbg,.areas.has-pbg,.faq.has-pbg{background:#f4f7fb!important}
.standard.has-pbg,.final-cta.has-pbg{background:#1437f5!important}
.pbg{position:absolute;left:0;right:0;top:-14%;bottom:-14%;z-index:-1;pointer-events:none;overflow:hidden}
.pbg picture,.pbg img{position:absolute;inset:0;width:100%;height:100%}
.pbg img{object-fit:cover;object-position:var(--fp,50% 50%);transform:translate3d(0,0,0) scale(1.12);transform-origin:center;backface-visibility:hidden}
.pbg::after{content:"";position:absolute;inset:0}
.pbg--dark{background:#07111b}.pbg--dark img{opacity:.5;filter:saturate(.9) contrast(1.05)}
.pbg--dark::after{background:linear-gradient(180deg,rgba(7,17,27,.78),rgba(7,17,27,.42) 45%,rgba(7,17,27,.86)),radial-gradient(60% 60% at 70% 40%,rgba(20,55,245,.18),transparent 70%)}
.pbg--light{background:#f4f7fb}.pbg--light img{opacity:.34;filter:saturate(.7) contrast(1.05)}
.pbg--light::after{background:linear-gradient(180deg,rgba(244,247,251,.9),rgba(244,247,251,.62) 40%,rgba(244,247,251,.7) 70%,rgba(244,247,251,.94))}
.pbg--blue{background:#1437f5}.pbg--blue img{opacity:.62;mix-blend-mode:luminosity;filter:contrast(1.15)}
.pbg--blue::after{background:linear-gradient(135deg,rgba(36,77,255,.62),rgba(20,55,245,.42) 55%,rgba(13,42,208,.7))}
.pbg--duo{background:#07111b}.pbg--duo img{opacity:.55;filter:grayscale(1) contrast(1.2);mix-blend-mode:screen}
.pbg--duo::after{background:linear-gradient(90deg,rgba(7,17,27,.92),rgba(7,17,27,.55) 55%,rgba(20,55,245,.25)),linear-gradient(180deg,rgba(7,17,27,.4),rgba(7,17,27,.6))}
.ft.has-pbg{color:#c9d3df}
/* reveal + stagger */
.rv{transform:translateY(14px)}
.rv [data-rv]{opacity:0;transform:translateY(18px);transition:opacity .6s ease var(--d,0ms),transform .75s cubic-bezier(.2,.8,.2,1) var(--d,0ms)}
.rv.on [data-rv]{opacity:1;transform:none}
.rv .kicker{position:relative;display:inline-block}
.rv .kicker::before{content:"";position:absolute;left:0;bottom:-5px;height:1px;width:0;background:linear-gradient(90deg,var(--accent),transparent);transition:width .9s ease .25s}
.rv.on .kicker::before{width:100%}
.stat strong{font-variant-numeric:tabular-nums}
/* tilt (desktop pointer only) */
@media (hover:hover) and (pointer:fine){
  .svc-card{transform-style:preserve-3d;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
  .svc-card.tilt{transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(-4px)}
  .svc-card .svc-img img{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
  .svc-card:hover .svc-img img{transform:scale(1.06)}
  .work-card img{transition:transform .7s cubic-bezier(.2,.8,.2,1)}
  .work-card:hover img{transform:scale(1.05)}
}
/* marquee control */
.marquee-wrap{position:relative}
.mq-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);z-index:3;display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(7,17,27,.7);color:#c9d3df;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.mq-toggle:hover,.mq-toggle:focus-visible{border-color:#7da4ff;color:#fff;outline:none}
.mq-toggle .mq-ico{font-size:9px}
.marquee-wrap:hover .area-marquee,.marquee-wrap:focus-within .area-marquee,.area-marquee.paused{animation-play-state:paused}
/* tiers */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1240px;margin:0 auto 14px;padding:0 clamp(18px,3.4vw,52px)}
.tier-card{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 24px 22px;border-radius:16px;background:linear-gradient(180deg,rgba(13,26,43,.92),rgba(7,15,26,.94));border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 50px rgba(0,0,0,.35);color:#fff;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s}
.tier-card:hover{transform:translateY(-6px);border-color:rgba(125,164,255,.45);box-shadow:0 26px 60px rgba(0,0,0,.45),0 0 0 1px rgba(20,55,245,.25)}
.tier-card--popular{border-color:rgba(125,164,255,.55);background:linear-gradient(180deg,rgba(20,45,110,.92),rgba(9,22,52,.95));box-shadow:0 24px 60px rgba(0,0,0,.45),0 0 40px rgba(20,55,245,.35)}
.tier-badge{position:absolute;top:-12px;left:24px;padding:5px 12px;border-radius:999px;background:linear-gradient(135deg,#f5c542,#e0a41c);color:#0a1420;font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;box-shadow:0 8px 20px rgba(245,197,66,.35)}
.tier-num{font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#7da4ff}
.tier-card h3{font-size:22px;font-weight:900;letter-spacing:-.01em;text-transform:uppercase;font-style:italic;line-height:1}
.tier-tag{color:#9fb0c3;font-size:14px;line-height:1.5}
.tier-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;padding:12px 0;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.tier-price small{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#7da4ff;font-weight:800}
.tier-price strong{font-size:34px;font-weight:900;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.tier-price span{flex-basis:100%;font-size:12px;color:#9fb0c3}
.tier-inc{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tier-inc li{position:relative;padding-left:18px;font-size:14px;line-height:1.45;color:#dfe6ef}
.tier-inc li::before{content:"◆";position:absolute;left:0;top:.35em;font-size:8px;color:#7da4ff}
.tier-war{margin-top:auto;font-size:12px;color:#b9c6d6;letter-spacing:.02em}
.tier-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;border-radius:10px;background:linear-gradient(135deg,var(--accent2,#244dff),var(--accent,#1437f5));color:#fff;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;box-shadow:0 12px 28px rgba(20,55,245,.35)}
.tier-card--popular .tier-cta{background:linear-gradient(135deg,#f5c542,#e0a41c);color:#0a1420;box-shadow:0 12px 28px rgba(245,197,66,.3)}
.tiers-note{max-width:1240px;margin:0 auto 34px;padding:0 clamp(18px,3.4vw,52px);color:#9fb0c3;font-size:12.5px;letter-spacing:.02em}
@media (max-width:960px){
  .tiers{grid-template-columns:1fr;gap:14px;padding:0 18px}
  .tier-card{padding:24px 18px 20px}
  .tier-price strong{font-size:30px}
  .tiers-note{padding:0 18px;margin-bottom:26px}
  .mq-toggle{right:8px;width:30px;height:30px;padding:0;justify-content:center}
  .mq-toggle .mq-lbl{display:none}
  .pbg{top:-8%;bottom:-8%}
}
@media (prefers-reduced-motion:reduce){
  .rv [data-rv]{opacity:1;transform:none;transition:none}
  .rv .kicker::before{width:100%;transition:none}
  .pbg img{transform:none!important}
  .svc-card.tilt{transform:none}
  .area-marquee{animation:none}
}
.sec-lead,.areas-more,.sec-lead--tight{color:#526174}
.has-pbg.services .sec-lead,.has-pbg.areas .sec-lead,.has-pbg.faq .sec-lead,.has-pbg.areas .areas-more{color:#4f5f72}
/* supervisor phase-2 fixes */
.sec-lead--light{color:#9fb0c3!important}
.faq-a{color:#526174}
.faq--dark.has-pbg{background:#07111b!important;color:#f7f9fc}
.faq--dark .kicker{color:#7da4ff}
.faq--dark h2{color:#fff}
.faq--dark .sec-lead{color:#b6c2d0!important}
.faq--dark .faq-item{border-color:rgba(255,255,255,.1)}
.faq--dark .faq-q{color:#fff}
.faq--dark .faq-a{color:#c9d3df}
.faq--dark .faq-q .chev{color:#7da4ff}
.cards-how{grid-template-columns:repeat(4,minmax(0,1fr))}
.how-card .how-num{opacity:.9}
@media (max-width:960px){.cards-how{grid-template-columns:1fr}}
.how-card .how-num{color:#6b7a8f;opacity:1}

/* ── Edited photos + neon accents 2026-09-02 · v2 tras /supervisar: neón fuerte solo en H1, títulos del form, 3 H2 de conversión (packages · reviews · CTA final) y tier popular; el resto `--soft` ── */
@media (max-width:600px){.hero-poster{object-position:38% 26%}}
.neon{position:relative;z-index:0;color:#a9c2ff;text-shadow:0 0 1px #fff,0 0 8px rgba(154,184,255,.85),0 0 22px rgba(36,77,255,.75),0 0 46px rgba(20,55,245,.5)}
.blue.neon{color:#9dbcff}
.grad.neon{color:transparent;text-shadow:none;filter:drop-shadow(0 0 7px rgba(140,175,255,.8)) drop-shadow(0 0 24px rgba(36,77,255,.6))}
.neon--ink{color:#1437f5;text-shadow:0 0 1px rgba(20,55,245,.5),0 0 12px rgba(36,77,255,.38),0 0 30px rgba(36,77,255,.22)}
.neon--onblue{color:#fff;font-style:italic;text-shadow:0 0 1px #fff,0 0 10px rgba(255,255,255,.7),0 0 28px rgba(170,198,255,.65),0 0 54px rgba(255,255,255,.3)}
.neon--soft{text-shadow:0 0 10px rgba(36,77,255,.28)}
.neon--soft.neon--ink{text-shadow:0 0 8px rgba(36,77,255,.18)}
.neon--soft.neon--onblue{text-shadow:0 0 10px rgba(255,255,255,.35)}
.grad.neon.neon--soft{filter:drop-shadow(0 0 8px rgba(36,77,255,.3))}
.quote-h .neon{color:#1437f5;text-shadow:0 0 1px rgba(20,55,245,.45),0 0 12px rgba(36,77,255,.35),0 0 26px rgba(36,77,255,.18)}
.quote--dark .quote-h .neon{color:#8fb0ff;text-shadow:0 0 1px #fff,0 0 8px rgba(143,176,255,.8),0 0 20px rgba(36,77,255,.6)}
@media (max-width:960px){.hero-form-col .quote-h .neon{color:#8fb0ff;text-shadow:0 0 1px #fff,0 0 8px rgba(143,176,255,.8),0 0 20px rgba(36,77,255,.6)}}
.kicker-line{box-shadow:0 0 8px rgba(36,77,255,.85),0 0 16px rgba(36,77,255,.45)}
#ft-title{text-shadow:0 0 10px rgba(154,184,255,.35)}
.tier-card--popular h3{color:#ffe8a3;text-shadow:0 0 1px #fff7dd,0 0 10px rgba(255,214,107,.7),0 0 26px rgba(201,151,28,.55)}
.svc-card h3,.how-card h3{transition:color .3s ease}
@media (hover:hover) and (pointer:fine){.svc-card:hover h3,.svc-card:focus-within h3,.how-card:not(.how-card--img):hover h3{color:#244dff}}
@keyframes neonIgnite{0%{opacity:.15}100%{opacity:1}}
.neon--ignite{animation:neonIgnite 1.4s cubic-bezier(.2,.8,.2,1) both}
.rv.on .neon{animation:neonIgnite 1.1s cubic-bezier(.2,.8,.2,1) both}
@media (prefers-reduced-motion:reduce){.neon--ignite,.rv.on .neon{animation:none}}
/* ── H1 legibility (Randy 2026-09-02 "el H1 en mobile y PC no se ve muy legible"): núcleo CLARO de alto contraste (≥9:1 sobre navy) + halo azul detrás; el glifo queda nítido, el neón vive en la sombra ── */
.neon{color:#dbe6ff;text-shadow:0 0 1px rgba(255,255,255,.35),0 0 12px rgba(36,77,255,.95),0 0 30px rgba(36,77,255,.6),0 0 56px rgba(20,55,245,.35)}
.blue.neon,#v3-h1 .blue.neon{color:#c4d5ff}
.grad.neon,#v3-h1 .grad.neon{background:linear-gradient(100deg,#f4f7ff,#c3d3ff 55%,#a4bcff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 0 10px rgba(36,77,255,.95)) drop-shadow(0 0 30px rgba(36,77,255,.55))}
.grad.neon.neon--soft{filter:drop-shadow(0 0 8px rgba(36,77,255,.35))}
.quote--dark .quote-h .neon{color:#cfdcff}
@media (max-width:960px){
  #v3-h1 .grad.neon{filter:drop-shadow(0 0 9px rgba(36,77,255,.95)) drop-shadow(0 0 24px rgba(36,77,255,.55))}
  .hero-form-col .quote-h .neon{color:#cfdcff}
}
/* ── Acentos en secciones CLARAS en azul oscuro (Randy 2026-09-02 "debe utilizar el azul oscuro para que resalte más y se pueda leer"): peso y contraste (#0d27a3 ≈ 10.5:1 sobre #f4f7fb) con un halo eléctrico apenas perceptible ── */
.neon--ink,.neon--soft.neon--ink{color:#0d27a3;text-shadow:0 0 1px rgba(13,39,163,.4),0 0 10px rgba(36,77,255,.22)}
.quote-h .neon{color:#0d27a3;text-shadow:0 0 1px rgba(13,39,163,.4),0 0 10px rgba(36,77,255,.22)}
/* ── Azul de marca en los acentos (Randy 2026-09-02 "Me refiero a este azul · debes ser igual a este" = #1437f5 sólido como "DETAIL."): revierte el #0d27a3 anterior · H1: el mismo azul sólido con un borde luminoso fino para leerse sobre el hero oscuro ── */
.neon--ink,.neon--soft.neon--ink{color:#1437f5;text-shadow:0 0 1px rgba(20,55,245,.5),0 0 12px rgba(36,77,255,.35)}
.quote-h .neon{color:#1437f5;text-shadow:0 0 1px rgba(20,55,245,.45),0 0 12px rgba(36,77,255,.35)}
#v3-h1 .grad.neon,#v3-h1 .blue.neon{background:none;-webkit-background-clip:initial;background-clip:initial;color:#1437f5;-webkit-text-fill-color:#1437f5;filter:none;text-shadow:0 0 1px rgba(255,255,255,.95),0 0 3px rgba(226,234,255,.9),0 0 10px rgba(170,195,255,.75),0 0 28px rgba(36,77,255,.7)}
@media (max-width:960px){#v3-h1 .grad.neon{filter:none}}

/* ── H1 del hero · composición editorial con neón (WEB-024 · referencia de Randy 2026-09-02) ──
   UNA SOLA FRASE tipografiada en cinco líneas. El texto NO cambia: sigue siendo
   "#1 Top Rated Mobile Detailing Company in Orlando" palabra por palabra, y el <title>
   no se toca en absoluto — son elementos distintos. Escala por tramo: el servicio manda,
   la ciudad va en contorno de neón y el prefijo de confianza abre en dorado.
   Va al final del archivo a propósito: neutraliza las reglas previas de .grad/.blue/::after
   del H1 por ORDEN de cascada, no con !important. */
#v3-h1{display:block;margin:12px 0 0;font-size:clamp(28px,3.4vw,46px);line-height:1;
  letter-spacing:-.02em;font-style:italic;font-weight:900;text-transform:uppercase;color:#fff}
#v3-h1 .h1-kick,#v3-h1 .h1-l1,#v3-h1 .h1-l2,#v3-h1 .h1-l3,#v3-h1 .h1-l4{
  display:block;font-style:italic;font-weight:900;text-transform:uppercase;white-space:nowrap}

/* Solo GEOMETRIA. El aspecto de la ciudad lo fija un unico bloque al final del archivo. */
#v3-h1 .h1-l4{position:relative;padding-left:1.02em;font-size:1.86em;line-height:.98;
  letter-spacing:-.035em}
/* líneas de velocidad: decorativas, por pseudo-elemento, así no entran al texto del H1 */
#v3-h1 .h1-l4::before{content:"";position:absolute;left:.02em;top:52%;
  transform:translateY(-50%) skewX(-16deg);width:.72em;height:.42em;
  background:repeating-linear-gradient(180deg,#2f57ff 0,#2f57ff .1em,transparent .1em,transparent .2em)}
#v3-h1::after{display:none}
@media (max-width:960px){
  #v3-h1{margin-top:10px;font-size:clamp(20px,5.6vw,26px)}
}
@media (prefers-reduced-motion:reduce){#v3-h1 .neon--ignite{animation:none}}

/* ── Titulares de sección: el mismo idioma del H1 (WEB-026 · pedido de Randy 2026-09-02) ──
   No se replica el volumen del H1 —si todo grita, nada destaca (Regla 9)— sino su GRAMÁTICA:
   antetítulo dorado, acento en el azul de marca SÓLIDO con borde luminoso fino, y un salto de
   escala dentro del propio titular. Una sola receta de acento sirve sobre fondo claro y oscuro:
   el núcleo #1437f5 cumple contraste por sí solo (7.4:1 sobre blanco) y el borde blanco lo
   despega de la foto. Va al final del archivo: gana por cascada, sin !important. */
.kicker{color:#f5c542;letter-spacing:.24em}
.kicker--light{color:#f5c542}
.kicker--onblue{color:#ffe4a3}
.kicker-line{width:34px;height:1px;background:linear-gradient(90deg,rgba(245,197,66,.95),transparent);
  box-shadow:0 0 10px rgba(245,197,66,.32)}
/* el acento del titular: más grande, más apretado y en el azul de marca */
h2 .neon,h2 .grad,h2 em.neon{font-size:1.1em;font-weight:900;font-style:italic;letter-spacing:-.035em}
h2 .neon,h2 .grad{background:none;-webkit-background-clip:initial;background-clip:initial;
  color:#1437f5;-webkit-text-fill-color:#1437f5;filter:none;
  text-shadow:0 0 1px rgba(255,255,255,.95),0 0 3px rgba(226,234,255,.85),
              0 0 10px rgba(170,195,255,.7),0 0 26px rgba(36,77,255,.62)}
/* sobre la banda azul el azul no se ve: ahí el acento es blanco con halo, como ya estaba */
h2 em.neon--onblue,h2 .neon--onblue{color:#fff;-webkit-text-fill-color:#fff;
  text-shadow:0 0 1px #fff,0 0 10px rgba(255,255,255,.65),0 0 28px rgba(170,198,255,.6)}
/* jerarquía: el halo fuerte se reserva a los titulares de conversión (Regla 9) */
h2 .neon--soft{text-shadow:0 0 1px rgba(255,255,255,.9),0 0 8px rgba(36,77,255,.34)}

/* ── Badge de Same-Day: disco CLARO, en espejo del de Google (WEB-027 · Randy 2026-09-02) ──
   El anterior era un disco oscuro con un rayo en degradado y un pip dorado: a 20 px el degradado
   se fundía con el brillo del disco por arriba y con el fondo por abajo, y el pip se leía como
   una mota. Ahora el rayo va MACIZO en azul de marca sobre disco claro — el mismo contraste que
   la G de Google del badge de al lado, que es lo que hace que los dos parezcan del mismo juego. */
.fc-ico--bolt{background:radial-gradient(circle at 34% 24%,#ffffff,#e6edfb 62%,#cfdcf7 100%);
  box-shadow:inset 0 1px 2px rgba(255,255,255,.9),inset 0 -3px 7px rgba(31,54,102,.28),
             0 0 12px rgba(20,55,245,.4)}
.fc-ico--bolt::after{background:radial-gradient(circle at 34% 20%,rgba(255,255,255,.85),transparent 58%)}
.fc-ico--bolt svg{filter:drop-shadow(0 1px 1px rgba(10,25,60,.35))}

/* ── Corrección de contraste del antetítulo (WEB-028 · medido con axe-core 4.10.2) ──
   El dorado #f5c542 vive sobre fondo oscuro. En las secciones CLARAS (#f4f7fb) daba 1.5:1
   contra los 4.5:1 que exige la norma, y axe lo marcó como «serious» en 4 nodos: services,
   work, areas y la cabecera de sección genérica. La familia dorada se conserva bajando el
   tono a un oro profundo — MEDIDO, no estimado: #8a6300 sobre #f4f7fb da 5.06:1.
   La convención de clases ya existía y se respeta: `.kicker` es para fondo claro,
   `.kicker--light` es la variante clara para fondo oscuro. */
.kicker{color:#8a6300}
.kicker--light{color:#f5c542}
.kicker .kicker-line,.kicker-line{background:linear-gradient(90deg,rgba(138,99,0,.9),transparent);
  box-shadow:none}
.kicker--light .kicker-line{background:linear-gradient(90deg,rgba(245,197,66,.95),transparent);
  box-shadow:0 0 10px rgba(245,197,66,.32)}

/* ── Badges del hero móvil SIN disco (WEB-029 · Randy 2026-09-02) ──
   Se retiran el disco, el bisel cónico, los brillos internos y el halo: quedan la G de Google
   con sus colores y un rayo limpio. Los glifos crecen porque ya no hay disco que los sostenga,
   y el rayo va blanco con resplandor azul — sobre el vidrio oscuro de la barra, el azul de marca
   solo se hunde; el blanco con halo es el mismo idioma de neón del titular. */
.fc-ico{flex:0 0 auto;width:auto;height:auto;border:0;border-radius:0;background:none;box-shadow:none;
  isolation:auto}
.fc-ico::before,.fc-ico::after{content:none;display:none}
.fc-ico svg{width:24px;height:24px;position:static;filter:none}
.fc-ico--google svg{width:22px;height:22px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.fc-ico--bolt svg{width:25px;height:25px;
  filter:drop-shadow(0 0 5px rgba(120,160,255,.95)) drop-shadow(0 0 14px rgba(20,55,245,.75))}

/* ── El vídeo del hero TAMBIÉN en móvil (WEB-030 · Randy 2026-09-02) ──
   Estaba oculto a propósito por debajo de 600 px: la copia de escritorio pesa 7,7 MB y en datos
   móviles eso es media pantalla de espera. Ahora se sirve una copia ligera de 1280x720 (~2,4 MB,
   un 69% menos) que el JS elige por ancho, con el póster pintando primero y el vídeo entrando
   encima al estar listo. El botón de pausa DEJA de esconderse en móvil: un fondo en movimiento que
   dura más de 5 s necesita control de pausa (WCAG 2.2.2), y si el vídeo se ve, el control también.
   Bajo `prefers-reduced-motion` o con ahorro de datos activo no se carga nada y se queda el póster. */
@media (max-width:600px){
  .hero-video{display:block!important}
  .hero-pause{display:flex!important}
}
@media (prefers-reduced-motion:reduce){.hero-video{display:none!important}.hero-pause{display:none!important}}

/* ══ Pasada de legibilidad (WEB-031 · Randy 2026-09-02, con capturas) ══════════════════════════ */

/* 1 · REGRESIÓN MÍA, corregida. El dorado profundo de WEB-028 es para fondo CLARO, pero al ir
   más abajo en el archivo se comía también `.kicker--onblue`, que vive sobre la banda azul: ahí
   salía marrón sobre azul, ilegible. Se vuelve a declarar después, que es lo que decide la cascada
   entre clases de la misma especificidad. Lo delata la captura, no el audit: axe corre sobre lo
   VISIBLE, y estas secciones entran con opacidad 0 hasta que se revelan al hacer scroll. */
.kicker--onblue{color:#ffe4a3}
.kicker--onblue .kicker-line{background:linear-gradient(90deg,rgba(255,228,163,.95),transparent);
  box-shadow:0 0 10px rgba(255,228,163,.3)}

/* 2 · Las fotos de fondo azules estaban compitiendo con el texto: la imagen iba al 62% y el velo
   dejaba pasar demasiado. La foto pasa a ser TEXTURA, no protagonista. */
.pbg--blue img{opacity:.3;filter:contrast(1.12) saturate(.9)}
.pbg--blue::after{background:linear-gradient(135deg,rgba(23,60,255,.88),rgba(16,45,215,.82) 55%,rgba(10,32,170,.92))}
.std-lede,.final-lede{color:#f0f4ff}

/* 3 · El pie: dejaba ver la furgoneta detrás de cada línea y el texto flotaba suelto. */
.ft .pbg--dark img{opacity:.22}
.ft .pbg--dark::after{background:linear-gradient(180deg,rgba(5,12,20,.94),rgba(5,12,20,.88) 45%,rgba(5,12,20,.97))}
.ft.has-pbg{color:#cfd9e6}
.ft-col h3{color:#f5c542;letter-spacing:.2em}
.ft-contact{color:#fff}
/* el correo se partía a mitad de palabra en una segunda línea huérfana */
.ft a,.ft-contact,.ft-brand p{overflow-wrap:anywhere}
@media (max-width:760px){
  .ft{grid-template-columns:1fr 1fr;gap:22px 18px;padding:40px 20px 92px}
  .ft-brand{grid-column:1/-1;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
  .ft-brand p{max-width:none;margin-top:10px}
  /* los contactos dejan de ir en fila suelta: una columna con todo alineado */
  .ft-brand .ft-contact{display:flex;width:100%;margin:8px 0 0;gap:10px}
  .ft-col{border-top:1px solid rgba(255,255,255,.12);padding-top:14px;gap:8px}
  .ft-col h3{margin-bottom:2px}
}

/* 4 · H1 en móvil: el blanco tenía que ser BLANCO, no un gris azulado. El halo de DETAILING se
   derramaba sobre las palabras vecinas; ahora cada una lleva su propio filo y su sombra oscura. */
/* 5 · ORLANDO como TUBO DE NEÓN: el trazo es el cristal encendido (casi blanco) y el color va en
   el resplandor de detrás. Antes el trazo era azul medio sobre fondo azul: apagado y sin cuerpo. */


/* ── ORLANDO vuelve al contorno AZUL, pero encendido (WEB-032 · Randy 2026-09-02) ──
   El trazo blanco de WEB-031 se leía, pero le quitó la identidad: Randy lo quiere como estaba,
   azul, y que destaque por el EFECTO, no por cambiarle el color. Tres capas hacen el trabajo:
   (1) el tubo sigue siendo el trazo azul de marca; (2) dentro ya no hay vacío, hay un relleno
   azul muy tenue — el gas encendido dentro del cristal, que es lo que le da cuerpo a la letra;
   (3) el resplandor sube a cuatro niveles, del filo cercano casi blanco al halo lejano, que es
   como se comporta un neón real. Mobile y Company in siguen en blanco puro. */


/* ── H1: se invierte el reparto de color (WEB-033 · Randy 2026-09-02) ──
   Las dos palabras GRANDES (Detailing y Orlando) van en blanco encendido y las dos PEQUEÑAS
   (Mobile y Company in) pasan al azul. Antes era al revés y el peso visual competía: dos bloques
   azules enormes y las palabras chicas en blanco. Así el ojo lee primero el servicio y la ciudad,
   y el azul queda de conector. El azul elegido es #2f57ff, el mismo del contorno de Orlando y de
   las rayas de velocidad — un tono más claro que el #1437f5 de marca, que a 12-20 px sobre foto
   oscura se hundía; lleva además filo blanco fino y halo, la receta de acento ya aprobada. */

/* Detailing: blanco encendido, el halo azul detrás hace el neón */

/* Orlando: vuelve al contorno BLANCO hueco que tenía, sin relleno */


/* ── El azul de las palabras pequeñas sube para que se LEA (WEB-034 · medido) ──
   #2f57ff da 3.27:1 sobre el hero oscuro: vale para texto grande, pero «Company in» va a 15-16 px
   y ahí el umbral es 4.5:1. #5f83ff da 5.15:1 y sigue siendo el mismo azul de familia. Medido
   sobre el fondo real del hero (#0d1a2b), no estimado. Es la misma lección de esta noche con el
   dorado: el color se elige con el número delante. */


/* ── Por qué «Mobile» y «Company in» no se leían (WEB-035 · Randy 2026-09-02) ──
   Mi medición anterior fue contra el fondo EQUIVOCADO. Calculé el azul contra el azul marino del
   hero (#0d1a2b) y daba 5.15:1, pero esas dos palabras no viven sobre el marino: viven DENTRO del
   resplandor de DETAILING, que las rodea con un halo azul brillante. Azul sobre azul encendido no
   se lee por mucho que el número contra el fondo lejano salga bien. Dos arreglos, no uno:
   (1) el halo de DETAILING deja de inundar a sus vecinas — se recorta el radio lejano, que es el
       que se derramaba, y se conserva el cercano, que es el que le da el neón;
   (2) las dos palabras pequeñas pasan a un azul HIELO, claro sobre ese halo, con una sombra oscura
       propia que las despega del fondo sea cual sea.
   La lección, escrita: el contraste se mide contra lo que hay DETRÁS de la letra, no contra el
   color de la sección. */

/* ── Velo cinematográfico detrás del titular (WEB-036 · Randy autoriza oscurecer) ──
   El problema no era el color de las letras sino la luz que tenían detrás. En vez de seguir
   subiendo el brillo del texto —que es lo que llevaba tres rondas sin cerrar— se baja la luz
   del fondo justo donde está el titular. Es un degradado radial muy difuminado, no una caja:
   se apaga hacia fuera y en el borde ya no existe, así que se lee como iluminación de estudio
   y no como un rectángulo gris pegado encima. La foto y el vídeo siguen viéndose alrededor. */
.hero-lead{position:relative;isolation:isolate}
.hero-lead::before{content:"";position:absolute;z-index:-1;pointer-events:none;
  left:-8%;right:-16%;top:-10%;bottom:-8%;
  background:radial-gradient(78% 76% at 26% 45%,
    rgba(2,7,16,.95) 0%,rgba(2,7,16,.86) 32%,rgba(2,7,16,.6) 55%,rgba(2,7,16,.26) 72%,transparent 86%)}
@media (max-width:960px){
  .hero-lead::before{left:-14%;right:-14%;top:-8%;bottom:-4%;
    background:radial-gradient(96% 72% at 42% 46%,
      rgba(2,7,16,.96) 0%,rgba(2,7,16,.9) 38%,rgba(2,7,16,.66) 60%,rgba(2,7,16,.3) 76%,transparent 90%)}
}
/* con el fondo ya apagado, el halo de DETAILING puede ser más contenido y elegante */

/* y las palabras pequeñas ganan cuerpo sin perder el azul */


/* ── «Mobile» y «Company in» en AZUL LLENO (WEB-037 · Randy) ──
   Con el velo puesto ya se puede: sobre el fondo apagado, #5680ff da 5.57:1 en el centro del velo
   y 5.21:1 en su borde — el azul más SATURADO de los seis medidos que aún cumple los 4.5:1 que
   exige «Company in», que va a ~13 px. Los más llenos (#1437f5 2.72:1 · #2f57ff 3.69:1) no llegan.
   Nada de filo blanco: era lo que las volvía blancuzcas. El cuerpo lo dan un halo azul propio y
   una sombra oscura debajo. «Company in» crece un punto para que respire. */

/* ══ H1 del hero · OPCIÓN B elegida por Randy (WEB-038 · 2026-09-03) ═══════════════════════════
   Los azules NO son inventados: se muestrearon píxel a píxel del logo del cliente
   (assets/img/soto-logo-header.webp). El logo no usa el índigo #1437f5 del sitio, usa cian-azules:
   claro #7cd8fc · medio #0c6cd4-#1070d8 · oscuro #0454b0.
   Fondo efectivo bajo el titular, compuesto y medido (póster muestreado en canvas + sombra del
   hero + velo): #030912. Contrastes resultantes, calculados, no estimados:
     eyebrow #f5c542 -> 12.31:1   ·   MOBILE #1070d8 -> 4.12:1
     DETAILING #fff  -> 19.97:1   ·   COMPANY IN #7cd8fc -> 12.44:1
   Tres registros distintos a propósito: el dorado marca la insignia, el azul medio sostiene la
   línea de apoyo sin competir, y el cian claro deja la línea chica nítida. Eso es la jerarquía.
   🔒 LA CIUDAD NO SE TOCA: su regla de contorno queda fuera de este bloque, y así se comprueba
   por diff. (Al escribir esto, la guarda del script saltó porque el comentario nombraba el
   selector: literal, no semántica. Se reformuló en vez de aflojar la guarda.) */

/* OBJETIVO 2 · el titular ocupa más ancho en móvil. El tamaño base escala con el viewport en vez
   de toparse en 26 px, y el margen lateral baja a 14 px. Se mantiene la alineación con el resto
   de la página (el formulario arranca donde arranca el titular). Desbordamiento horizontal
   medido en 375, 390, 430 y 768: CERO en los cuatro. */
@media (max-width:960px){
  .hero-grid-v3{padding-left:14px;padding-right:14px}
  #v3-h1{font-size:clamp(22px,7.4vw,34px)}

}

/* ══════════════════════════════════════════════════════════════════════════════════════════════
   H1 DEL HERO · BLOQUE CANÓNICO ÚNICO (WEB-041 · 2026-09-03)
   Único sitio donde se define el titular. Para cambiar una línea se edita AQUÍ.

   Patrón: el de Black V Protect, que Randy señaló como referencia de legibilidad —
   COLORES PLANOS Y SATURADOS sobre casi negro, CERO resplandor, y cada línea con un
   tratamiento distinto para que se note la diferencia entre una y otra:
     insignia   → acero apagado con cuadrito azul
     meta       → BLANCO sólido
     servicio   → AZUL DE LOS BOTONES, el mismo degradado del botón de envío
                  (linear-gradient 135deg #244dff → #1437f5 · vars --accent2/--accent)
     conector   → BLANCO sólido, igual que la meta (Randy 2026-09-03)
     ciudad     → CONTORNO del mismo azul, plano
   Contrastes sobre el fondo efectivo del hero (#040911), calculados:
     blanco 19.96:1 · acero 7.74:1 · azul del botón #244dff 3.40:1
   NOTA HONESTA: 3.40:1 cumple el mínimo de 3:1 que aplica a texto grande (58 px en negrita),
   pero NO llegaría a 4.5:1 si alguna vez se usara este azul en texto pequeño. Es un azul
   oscuro; funciona aquí por el tamaño. Si se quiere margen, el siguiente escalón que conserva
   la familia es #3a63ff (≈4.2:1).
   ══════════════════════════════════════════════════════════════════════════════════════════════ */

#v3-h1 .h1-kick{display:flex;align-items:center;gap:6px;margin:0 0 .5em;
  font-size:.34em;font-style:normal;font-weight:800;letter-spacing:.34em;line-height:1;
  color:#93a7c2;text-shadow:none}
#v3-h1 .h1-kick::before{content:"\25A0";display:inline-block;color:#244dff;font-size:.75em;margin-right:6px}
#v3-h1 .h1-kick::after{content:none}

#v3-h1 .h1-l1{font-size:.8em;letter-spacing:.06em;color:#ffffff;-webkit-text-fill-color:#ffffff;
  background:none;text-shadow:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.55))}

/* servicio · sólido por defecto; el degradado del botón solo donde el navegador sabe recortarlo */
#v3-h1 .h1-l2{font-size:2.15em;line-height:.9;letter-spacing:-.045em;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.5));text-shadow:none}
/* La G final se cortaba (Randy 2026-09-03): con background-clip:text la pintura se recorta a la
   CAJA de la linea, y la cursiva empuja la tinta del ultimo glifo ~25px mas alla de esa caja, asi
   que ese trozo salia sin pintar. inline-block + padding a la derecha ensancha la caja sin mover
   el texto ni una decima. */
#v3-h1 .h1-l2 .h1-l2i{display:inline-block;padding-right:.1em;font-style:inherit;font-weight:inherit;color:#244dff;-webkit-text-fill-color:#244dff}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  /* del azul del BOTÓN al azul del LOGO (Randy 2026-09-03): arranca en #244dff, pasa por un
     tono intermedio y aterriza en el #0c6cd4 que se muestreó del propio isotipo. De paso gana
     contraste: la parada final mide 3.86:1 contra los 2.75:1 del #1437f5 que había antes. */
  #v3-h1 .h1-l2 .h1-l2i{background:linear-gradient(165deg,#2f5cff 0%,#1a5ae8 48%,#0c6cd4 100%);
    -webkit-background-clip:text;background-clip:text;
    color:transparent;-webkit-text-fill-color:transparent}
}
@media (forced-colors:active){
  #v3-h1 .h1-l2 .h1-l2i{background:none;color:CanvasText;-webkit-text-fill-color:CanvasText;
    forced-color-adjust:auto}
}

#v3-h1 .h1-l3{font-size:.56em;line-height:1.7;letter-spacing:.3em;color:#ffffff;
  -webkit-text-fill-color:#ffffff;background:none;text-shadow:none;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.55))}

@media (max-width:960px){
  .hero-grid-v3{padding-left:14px;padding-right:14px}
  #v3-h1{font-size:clamp(22px,7.4vw,34px)}
}

/* ══ TITULAR DEL FORMULARIO · bloque canónico (WEB-040 · Randy 2026-09-03) ═══════════════════
   Dos cosas: va CENTRADO, y «Free estimate» tenía el mismo problema que el titular del hero —
   halo encima y un azul que no contrasta con el fondo donde vive. Se quita el resplandor y se
   elige el color POR FONDO, con el número delante:
     · sobre el vidrio oscuro del formulario → #7cd8fc (azul claro del logo) = 10.43:1
     · sobre la tarjeta blanca de escritorio → #0c6cd4 (azul medio del logo) = 5.11:1
   El azul de marca #1437f5 medía 2.31:1 sobre el vidrio oscuro: por eso no se leía.
   Sustituye a las 7 reglas de `.quote-h .neon` que se habían ido apilando. */
.quote-h{text-align:center}
.quote-h .neon{color:#0c6cd4;-webkit-text-fill-color:#0c6cd4;background:none;
  text-shadow:none;filter:none}
.quote--dark .quote-h .neon,
.hero-form-col .quote-h .neon{color:#7cd8fc;-webkit-text-fill-color:#7cd8fc;text-shadow:none}
@media (max-width:960px){
  .hero-form-col .quote-h{text-align:center}
  .hero-form-col .quote-h .neon{color:#7cd8fc;-webkit-text-fill-color:#7cd8fc;text-shadow:none}
}


/* ── La ciudad, con luz verde de Randy para tocarla (WEB-041) ──
   Pierde sus cuatro capas de resplandor: el patrón de referencia es PLANO. Queda en contorno
   del mismo azul del botón, que es lo que la separa de las dos líneas blancas. */
/* NEÓN EN EL BORDE (Randy 2026-09-03): el interior sigue hueco y el resto del titular sigue
   plano; lo que se enciende es el TRAZO, que es exactamente cómo funciona un tubo de neón.
   El trazo sube a #3f7dff para que el cristal se vea encendido y no apagado, y el halo se
   mantiene CORTO a propósito (2 / 10 / 24 px). El halo largo fue lo que en rondas anteriores
   inundaba a las palabras vecinas y las volvía ilegibles: esa lección no se repite. */


/* ── Acento de titular sobre las secciones OSCURAS (WEB-043 · Randy 2026-09-03: "CLEAR PRICES no se
   puede leer") ─────────────────────────────────────────────────────────────────────────────────
   El bloque WEB-026 afirmaba que una sola receta de acento servia sobre fondo claro y oscuro. Era
   falso y aqui esta medido: el #1437f5 solido da 6.75:1 sobre las secciones claras, pero solo
   2.62:1 sobre las oscuras — por debajo del mínimo de 3:1 que aplica incluso a texto de 34px. No
   era un titular, eran CUATRO con el mismo defecto: Clear prices / One standard / Real driveways /
   answered. Randy vio uno. Sobre oscuro el acento pasa a #6ea8ff (7.88:1), que sigue leyendose como
   azul de marca y no como pastel, con halo de tinta para los parches claros de la foto de fondo. */
#proof h2 .neon,#proof h2 .grad,#crew h2 .neon,#crew h2 .grad,
#reviews h2 .neon,#reviews h2 .grad,#faq h2 .neon,#faq h2 .grad{
  background:none;-webkit-background-clip:initial;background-clip:initial;
  color:#6ea8ff;-webkit-text-fill-color:#6ea8ff;filter:none;
  text-shadow:0 1px 2px rgba(2,8,18,.9),0 0 10px rgba(47,110,255,.5),0 0 26px rgba(36,77,255,.28)}

/* ── Densidad de la seccion de servicios en movil (WEB-044 · Randy: "mucho espacio vacio en
   servicios") ──────────────────────────────────────────────────────────────────────────────────
   El aire venia de tres sitios que sumaban ~90px muertos antes de la primera tarjeta: 76px de
   padding superior atado a 9vh (en un movil alto eso crece solo), un interlineado 'normal' de 1.25
   en un titular de tres lineas, y 26px entre la entradilla y las tarjetas. Se recorta el aire, NO
   el contenido: no se toca ni una palabra del copy. La foto gana 22px de alto, que es lo que hace
   que la tarjeta deje de parecer texto suelto. */
@media (max-width:600px){
  #services{padding-top:46px;padding-bottom:54px}
  #services .sec-head{gap:12px;margin-bottom:18px}
  #services h2{line-height:1.06;letter-spacing:-.03em}
  #services .sec-lead{font-size:14px;line-height:1.5}
  #services .cards-4{gap:14px}
  #services .svc-img{height:212px}
}

/* ── Parallax en las fotos de servicio (WEB-045 · Randy: "las imagenes de servicios deben ser
   parallax") ──────────────────────────────────────────────────────────────────────────────────
   La foto va sobredimensionada un 14% y el motor la desplaza dentro de su ventana. El recorrido se
   calcula desde la ALTURA de la ventana (±5.5%), no con el tope fijo de las capas de seccion: con
   una ventana de 190-212px, el clamp de 44px de aquellas dejaria ver el borde. Reposo = escala sin
   desplazamiento, asi que con prefers-reduced-motion la foto se queda quieta y encuadrada. */
.svc-img img{transform:scale(1.14);transform-origin:50% 50%}

/* ══ ORLANDO · BLOQUE CANONICO UNICO (WEB-046 · consolidacion pedida por Randy) ═══════════════
   Hasta esta noche la ciudad la pintaban SIETE bloques encadenados: tubo blanco, gas azul, filo
   azul, contorno blanco... cada peticion aparcaba una capa nueva encima de la anterior y ganaba
   la ultima por orden de cascada. Eso hacia que un cambio de una linea dependiera de en que parte
   del archivo cayera, no de lo que dijera. Ahora hay UNO: aspecto aqui, geometria arriba, y la
   unica pieza que se repite es la media query de tamaño.
   Tratamiento final (Randy 2026-09-03 "ponlo blanco con el neon"): relleno blanco solido — el
   mismo que MOBILE y COMPANY IN, ya validado contra los fotogramas del video — y el neon lo hace
   el halo azul de tres pasos, del filo cercano al resplandor lejano. Sin contorno: era lo que se
   veia sucio sobre el video. Las rayas de velocidad se quedan azules, que es lo que mantiene el
   color de marca en la linea. */
#v3-h1 .h1-l4{color:#ffffff;-webkit-text-fill-color:#ffffff;-webkit-text-stroke:0;
  filter:drop-shadow(0 0 3px rgba(214,231,255,.95))
         drop-shadow(0 0 13px rgba(47,110,255,.95))
         drop-shadow(0 0 32px rgba(36,77,255,.6))
         drop-shadow(0 1px 2px rgba(0,0,0,.55))}
/* Las rayas se veian borrosas (Randy 2026-09-03) por DOS causas medibles, no por gusto:
   (1) la caja media .42em y el patron se repite cada .2em, asi que la tercera raya quedaba cortada
       en .02em — esa astilla desenfocada es lo que se ve en su captura. Con .5em caben tres rayas
       completas (.1 solida + .1 hueco, tres veces) y el patron cierra exacto.
   (2) el halo de 6px sobre barras de ~2px las fundia entre si. Baja a 3px: sigue encendido, ya no
       se derrama. Los bordes del gradiente son duros; lo borroso era el halo, no las barras. */
#v3-h1 .h1-l4::before{height:.5em;
  background:repeating-linear-gradient(180deg,#3f7dff 0,#3f7dff .1em,transparent .1em,transparent .2em);
  /* El halo es EL MISMO de ORLANDO (Randy 2026-09-03), sus tres capas en el mismo orden y con los
     mismos colores: filo casi blanco, encendido azul medio, resplandor azul de marca. Solo cambian
     los radios, escalados a un elemento que mide 32 px en vez de 60: con los radios de la ciudad,
     unas barras de 2 px se volverian a fundir, que es justo lo que se acaba de corregir. */
  filter:drop-shadow(0 0 2px rgba(214,231,255,.95))
         drop-shadow(0 0 7px rgba(47,110,255,.95))
         drop-shadow(0 0 16px rgba(36,77,255,.6))}
@media (forced-colors:active){#v3-h1 .h1-l4{color:CanvasText;-webkit-text-fill-color:CanvasText;filter:none}}
/* WEB-094 e · alto contraste forzado: los selectores vuelven al chevron nativo (el SVG blanco fijo podría desaparecer sobre el fondo del sistema) */
@media (forced-colors:active){.quote--dark select.q-input,.hero-form-col select.q-input{background-image:none;appearance:auto;-webkit-appearance:auto;padding-right:14px}}

/* ── Cierre del footer (WEB-049 · Randy 2026-09-03: "no esta ajustado ni se ve premium") ────────
   El problema no era el estilo, era la COLUMNA: el copyright y la línea de servicio vivían dentro
   de «Quick links», una columna estrecha de dos enlaces, así que se partían en tres renglones cada
   uno mientras la mitad derecha del footer quedaba vacía. Salen de ahí a una barra propia que cruza
   las cuatro columnas, con filete superior: el dato de cierre se lee de una pasada y las columnas
   vuelven a ser lo que son, listas de enlaces.
   El azul en mayúsculas con tracking ancho se retira: a 10.5px y partido en tres líneas gritaba sin
   jerarquía. Ahora es una sola línea tenue con separadores en rombo — el mismo carácter del sitio,
   en su registro más bajo, que es lo que hace que un pie parezca premium y no un cajón de sobras. */
/* Randy 2026-09-03: el crédito NO va aparte a la derecha, va dentro de la MISMA última línea. La
   barra deja de repartir en dos extremos y pasa a ser un solo renglón que fluye con sus rombos. */
.ft-base{grid-column:1/-1;display:block;
  margin-top:34px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}
.ft-base p{margin:0;max-width:none}
.ft-base-l{display:flex;flex-wrap:wrap;align-items:center;gap:0 10px;
  color:#93a3b6;font-size:12px;letter-spacing:.02em;line-height:1.7}
.ft-base-l i{display:inline-block;width:3px;height:3px;transform:rotate(45deg);background:#5f83ff;opacity:.85}
.ft-base-l a{color:#cfd9e6;font-weight:800;border-bottom:1px solid rgba(125,164,255,.45);
  padding-bottom:1px;transition:color .25s,border-color .25s}
.ft-base-l a:hover,.ft-base-l a:focus-visible{color:#7da4ff;border-color:#7da4ff}
@media (max-width:700px){
  .ft-base{margin-top:26px;padding-top:16px}
  .ft-base-l{gap:0 8px;font-size:11.5px}
}

/* La dirección va con el resto del NAP en el pie (Randy 2026-09-03). Es la misma que muestran el
   GBP, el Facebook y el nombre ficticio registrado: si el sitio dijera otra cosa, la inconsistencia
   de NAP la pagan las citaciones. Ocupa su propia línea porque los .ft-contact fluyen en fila y una
   dirección de 42 caracteres partiría el bloque de teléfono y correo. */
.ft-addr{display:flex;width:100%;margin-right:0;color:#cfd9e6;font-weight:700;line-height:1.5}
.ft-addr .ic{flex:0 0 auto;margin-top:2px}

/* ── Antetítulo del hero fuera del H1 (SEO-002 · páginas de servicio y ciudad) ─────────────────
   En la home el antetítulo vive DENTRO del H1 y no molesta, porque «#1 Top Rated» es un prefijo de
   confianza que el gate R20 reconoce. En las doce páginas nuevas el antetítulo dice cosas como
   «Hablamos español» o «Gated access ok», y ahí R20 leía esas palabras como el arranque del H1 y
   fallaba contra un title correcto. La solución no es aflojar el gate: es que el H1 de una página
   de servicio o de ciudad sea EXACTAMENTE el patrón de la doctrina («[Servicio] Services in
   [Ciudad]»), y que el antetítulo viva fuera, como hermano. Estas reglas le devuelven el aspecto
   que tenía cuando estaba dentro. */
.h1-kick--solo{display:block;margin:0 0 2px;font-size:11px;font-weight:800;letter-spacing:.26em;
  text-transform:uppercase;font-style:normal;color:#93a7c2;text-shadow:none}
.h1-kick--solo::before{content:"■";margin-right:9px;color:#244dff;font-size:.8em;vertical-align:middle}
@media (max-width:960px){.h1-kick--solo{font-size:10px;letter-spacing:.22em}}

/* ══ NAVEGACIÓN CON DESPLEGABLES (SEO-003 · Randy 2026-09-03) ═══════════════════════════════════
   Con doce páginas nuevas, un menú de cinco anclas a secciones de la home dejaba el sitio sin
   forma de llegar a ninguna. Los desplegables no son decoración: son la única ruta de navegación
   hacia las páginas de servicio y de ciudad, y además el enlazado interno que Google usa para
   entender la jerarquía.
   Decisiones de diseño, todas con motivo:
   · Cada entrada lleva DOS líneas — nombre y precio o distancia. Un menú que solo lista nombres
     obliga a entrar para saber si te interesa; con el precio delante, el clic ya viene calificado.
   · Panel de vidrio oscuro con un filete azul arriba, el mismo lenguaje del formulario del hero.
     No inventa una tercera estética.
   · Se abre con hover en puntero fino y con clic o teclado siempre. `hidden` se quita por JS, así
     que sin JS los enlaces siguen existiendo en el DOM para el rastreador.
   · La flecha gira 180°, que es la única animación: el resto es opacidad y desplazamiento corto. */
.nav-item{position:relative;display:flex;align-items:center}
.nav-trigger{display:inline-flex;align-items:center;gap:7px;padding:0;border:0;background:none;
  font:inherit;color:inherit;cursor:pointer}
.nav-caret{width:10px;height:6px;flex:0 0 auto;transition:transform .22s ease;opacity:.8}
.nav-trigger[aria-expanded="true"] .nav-caret{transform:rotate(180deg)}
.nav-drop{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-6px);
  z-index:60;min-width:290px;padding:12px;border-radius:14px;
  background:linear-gradient(180deg,rgba(9,18,30,.98),rgba(6,13,22,.99));
  border:1px solid rgba(125,164,255,.22);
  box-shadow:0 26px 60px rgba(2,8,18,.6),0 0 0 1px rgba(255,255,255,.03) inset;
  opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease,visibility .2s}
.nav-drop::before{content:"";position:absolute;top:-1px;left:18px;right:18px;height:1px;
  background:linear-gradient(90deg,transparent,#3f7dff,transparent)}
.nav-drop::after{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
.nav-item.open .nav-drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-drop-lbl{display:block;padding:8px 12px 5px;color:#93a7c2;font-size:9.5px;font-weight:800;
  letter-spacing:.22em;text-transform:uppercase}
.nav-drop-lbl + a{margin-top:0}
.nav-drop a{display:flex;flex-direction:column;gap:2px;padding:9px 12px;border-radius:9px;
  color:#e8eef8;text-decoration:none;transition:background .18s ease,transform .18s ease}
.nav-drop a b{font-size:13px;font-weight:800;letter-spacing:-.01em}
.nav-drop a span{color:#93a7c2;font-size:11px;font-weight:600;letter-spacing:.01em}
.nav-drop a:hover,.nav-drop a:focus-visible{background:rgba(47,110,255,.14);transform:translateX(3px)}
.nav-drop a:hover b,.nav-drop a:focus-visible b{color:#fff}
@media (hover:hover) and (pointer:fine){
  .nav-item.has-drop:hover .nav-drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
}
@media (prefers-reduced-motion:reduce){
  .nav-drop,.nav-caret,.nav-drop a{transition:none}
}

/* ── El mismo menú en móvil: acordeón, no panel flotante ──────────────────────────────────────
   Un desplegable superpuesto en una pantalla de 390px tapa lo que hay debajo y obliga a cerrar
   para orientarse. El acordeón empuja el contenido y deja ver dónde estás. */
.m-group{border-bottom:1px solid rgba(255,255,255,.08)}
.m-acc{display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 2px;
  border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer;
  font-weight:800;letter-spacing:.02em}
.m-acc .nav-caret{width:12px;height:7px}
.m-sub{display:flex;flex-direction:column;gap:1px;padding:0 0 10px 16px}
.m-sub a{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:9px 10px;border-radius:8px;color:#cfd9e6;font-size:14px;font-weight:700;
  background:rgba(255,255,255,.03)}
.m-sub a em{flex:0 0 auto;color:#7da4ff;font-size:11px;font-weight:800;font-style:normal;
  letter-spacing:.04em}
.m-sub a:active{background:rgba(47,110,255,.16)}

/* ── H1 de las páginas interiores: la ciudad tiene que caber (SEO-004) ────────────────────────
   La home dice ORLANDO, siete letras, y a 1.86em cabe justo en 390px. ALTAMONTE, KISSIMMEE o
   WINTER PARK no caben: la línea lleva `white-space:nowrap`, así que el texto se sale de su caja
   sin ensancharla y el documento gana ~13px de scroll horizontal. Medido, no supuesto: el `.h1-l4`
   de Kissimmee daba rect 326px y scrollWidth 351px.
   Se corrige SOLO en las páginas interiores (`.hero--sub`) porque el H1 de la home está aprobado
   tras varias rondas con Randy y no se toca. El clamp deja intacto el tamaño cuando la palabra es
   corta y solo lo reduce cuando el ancho lo exige. */
@media (max-width:600px){
  .hero--sub #v3-h1 .h1-l4{font-size:clamp(1.05em,7.9vw,1.86em)}
  .hero--sub #v3-h1 .h1-l3{letter-spacing:.24em}
}
/* Y el hero de esas páginas recorta en horizontal. Medido: con la ciudad larga el hero aportaba
   13px de scroll lateral que NO venía de la caja del texto (el clamp de arriba ya la hace caber)
   ni del halo del neón — se comprobó apagando el filtro y el desbordamiento seguía. `overflow-x:
   clip` lo contiene sin recortar en vertical, así que las sombras siguen respirando hacia abajo.
   Va sobre `.hero--sub` y no sobre `.hero` para no alterar la home. */
.hero--sub{overflow-x:clip}

/* /thank-you/ — recibo dentro de la tarjeta de vidrio. Unica clase nueva de la pagina: todo lo
   demas reutiliza componentes que YA existen (quote, how-card, final-cta, trustbar-v3). Se anade
   AL FINAL a proposito: no toca ni una regla existente, asi que no puede regresionar otra pagina. */
.ty-recap{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.ty-recap li{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:#334155}
.ty-recap li svg{flex:0 0 auto;margin-top:2px;color:var(--accent)}
.ty-recap li b{color:#0a1420;font-weight:800}
.quote a.q-submit.shine-btn{margin-top:18px;text-decoration:none;display:flex;align-items:center;
  justify-content:center;gap:8px}

/* Form delivery state contrast on the existing dark form surfaces. */
.quote--dark .q-state--sent{color:#4ade80}
.quote--dark .q-state--error{color:#fca5a5}
@media(max-width:960px){
  .hero-form-col .q-state--sent{color:#4ade80}
  .hero-form-col .q-state--error{color:#fca5a5}
}

/* ── nav v4 premium (2026-09-10 · WEB-073) ──
   Los <button> del menú no heredan text-transform ni letter-spacing (UA de Chrome), por eso «Services» se veía en
   minúsculas junto a PRICING en mayúsculas. Aquí se unifica y se le da al menú una píldora de vidrio con chips. */
.desktop-nav-v3{justify-self:center;width:max-content;max-width:100%;gap:2px;padding:4px;border-radius:999px;border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 10px 30px rgba(0,0,0,.25);
  font-size:11.5px;font-weight:800;letter-spacing:.15em;color:rgba(226,234,246,.78)}
.desktop-nav-v3>a,.desktop-nav-v3 .nav-trigger{position:relative;display:inline-flex;align-items:center;gap:8px;
  height:36px;padding:0 15px;border-radius:999px;color:inherit;text-decoration:none;white-space:nowrap;
  text-transform:inherit;letter-spacing:inherit;font-weight:inherit;
  transition:background .22s ease,color .22s ease,box-shadow .22s ease}
.desktop-nav-v3>a::before,.desktop-nav-v3 .nav-trigger::before{content:"";position:absolute;left:15px;right:15px;bottom:6px;
  height:1.5px;border-radius:2px;background:linear-gradient(90deg,#1437f5,#5b8dff);
  transform:scaleX(0);transform-origin:left;transition:transform .28s cubic-bezier(.2,.7,.2,1)}
.desktop-nav-v3>a:hover,.desktop-nav-v3 .nav-trigger:hover,.desktop-nav-v3>a:focus-visible,.desktop-nav-v3 .nav-trigger:focus-visible{
  color:#fff;background:rgba(255,255,255,.07);outline:0}
.desktop-nav-v3>a:hover::before,.desktop-nav-v3 .nav-trigger:hover::before,.desktop-nav-v3>a:focus-visible::before{transform:scaleX(1)}
.desktop-nav-v3 .nav-trigger .nav-caret{width:9px;height:6px;opacity:.7;margin-top:1px}
.desktop-nav-v3 .nav-trigger[aria-expanded="true"],.nav-item.open .nav-trigger{color:#fff;
  background:linear-gradient(180deg,rgba(20,55,245,.42),rgba(20,55,245,.26));
  box-shadow:0 0 0 1px rgba(91,141,255,.35) inset,0 6px 18px rgba(20,55,245,.25)}
.desktop-nav-v3 .nav-trigger[aria-expanded="true"]::before,.nav-item.open .nav-trigger::before{transform:scaleX(0)}
.desktop-nav-v3 .nav-trigger[aria-expanded="true"] .nav-caret,.nav-item.open .nav-caret{opacity:1}
@media (hover:hover) and (pointer:fine){
  .nav-item.has-drop:hover .nav-trigger{color:#fff;background:linear-gradient(180deg,rgba(20,55,245,.42),rgba(20,55,245,.26));
    box-shadow:0 0 0 1px rgba(91,141,255,.35) inset,0 6px 18px rgba(20,55,245,.25)}
  .nav-item.has-drop:hover .nav-trigger::before{transform:scaleX(0)}
  .nav-item.has-drop:hover .nav-caret{transform:rotate(180deg);opacity:1}
}
.nav-drop{top:calc(100% + 12px);border-radius:16px;padding:10px;min-width:300px;
  background:linear-gradient(180deg,rgba(10,20,34,.97),rgba(5,12,22,.99));
  border:1px solid rgba(125,164,255,.26);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}
.nav-drop::after{top:-12px;height:12px}
.nav-drop-lbl{color:#7f95b3;font-size:9.5px;letter-spacing:.24em;padding:9px 12px 5px}
.nav-drop a{padding:9px 12px 9px 14px;border-radius:10px;border-left:2px solid transparent}
.nav-drop a:hover,.nav-drop a:focus-visible{background:linear-gradient(90deg,rgba(20,55,245,.22),rgba(20,55,245,.06));
  border-left-color:#5b8dff;transform:translateX(2px)}
@media (max-width:1180px){
  .desktop-nav-v3{letter-spacing:.11em;font-size:11px}
  .desktop-nav-v3>a,.desktop-nav-v3 .nav-trigger{padding:0 11px;height:34px}
  .desktop-nav-v3>a::before,.desktop-nav-v3 .nav-trigger::before{left:11px;right:11px}
}
@media (prefers-reduced-motion:reduce){
  .desktop-nav-v3>a,.desktop-nav-v3 .nav-trigger,.desktop-nav-v3>a::before,.desktop-nav-v3 .nav-trigger::before{transition:none}
}
/* ── nav v5 services mega-panel (2026-09-10 · WEB-074) · sin precios, los 8 servicios del price guide, iconos ── */
.nav-drop{text-transform:none;letter-spacing:0}
.nav-drop--svc{min-width:0;width:680px;padding:14px 14px 12px;display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;
  background:linear-gradient(180deg,rgba(11,21,36,.985),rgba(5,12,22,.995));border-color:rgba(125,164,255,.3);
  box-shadow:0 30px 70px rgba(2,8,18,.65),0 0 0 1px rgba(255,255,255,.03) inset,0 0 60px rgba(20,55,245,.12)}
.nav-drop--svc::before{left:24px;right:24px}
.nav-drop--svc .nds-col{display:flex;flex-direction:column;gap:2px}
.nav-drop--svc .nav-drop-lbl{padding:6px 10px 6px;color:#7f95b3;font-size:9.5px;font-weight:800;letter-spacing:.24em;text-transform:uppercase}
.nav-drop--svc a{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;
  border-left:0;color:#e8eef8;transition:background .18s ease,transform .18s ease}
.nav-drop--svc .nds-ic{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:#8fb0ff;
  background:linear-gradient(180deg,rgba(20,55,245,.22),rgba(20,55,245,.1));border:1px solid rgba(91,141,255,.28);
  transition:background .18s ease,color .18s ease,box-shadow .18s ease,border-color .18s ease}
.nav-drop--svc .nds-ic svg{width:19px;height:19px}
.nav-drop--svc .nds-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.nav-drop--svc a b{font-size:13.5px;font-weight:800;letter-spacing:-.01em;color:#fff;line-height:1.15}
.nav-drop--svc a span span,.nav-drop--svc .nds-t>span{color:#93a7c2;font-size:11.5px;font-weight:600;letter-spacing:0;line-height:1.3}
.nav-drop--svc a:hover,.nav-drop--svc a:focus-visible{background:linear-gradient(90deg,rgba(20,55,245,.2),rgba(20,55,245,.04));transform:translateX(2px);border-left:0}
.nav-drop--svc a:hover .nds-ic,.nav-drop--svc a:focus-visible .nds-ic{background:#1437f5;color:#fff;border-color:#4d7bff;box-shadow:0 8px 20px rgba(20,55,245,.45)}
.nav-drop--svc a:hover .nds-t>span,.nav-drop--svc a:focus-visible .nds-t>span{color:#c6d3e8}
.nav-drop--svc .nds-foot{grid-column:1/-1;margin-top:8px;padding:10px 4px 2px;border-top:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.nav-drop--svc .nds-book{display:inline-flex;flex-direction:row;white-space:nowrap;grid-template-columns:none;align-items:center;gap:8px;padding:0 14px;height:36px;border-radius:999px;
  background:#1437f5;color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  box-shadow:0 8px 20px rgba(20,55,245,.35);transition:background .18s ease,transform .18s ease}
.nav-drop--svc .nds-book:hover{background:#2f5bff;transform:translateY(-1px)}
.nav-drop--svc .nds-book .ic{width:14px;height:14px}
.nav-drop--svc .nds-add{font-size:11.5px;color:#93a7c2;font-weight:600}
.nav-drop--svc .nds-add b{color:#c6d3e8;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:10px;margin-right:6px}
.m-sub a em{display:none}
/* ── mobile menu v2 (2026-09-10 · WEB-075) · Home en todas, servicios con icono, áreas como chips, bloque de acción ── */
.m-menu--v2{top:64px;min-height:calc(100dvh - 64px);max-height:calc(100dvh - 64px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding:8px 18px 110px;gap:0;
  background:radial-gradient(520px 260px at 100% 0%,rgba(20,55,245,.28),transparent 60%),radial-gradient(420px 260px at 0% 100%,rgba(20,55,245,.14),transparent 60%),linear-gradient(180deg,rgba(6,13,23,.985),rgba(3,8,15,.99));
  border-bottom:0;box-shadow:0 40px 80px rgba(0,0,0,.6)}
.m-menu--v2 .mm-link,.m-menu--v2 .m-acc{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:16px 4px;margin:0;border:0;border-bottom:1px solid rgba(255,255,255,.08);background:none;
  color:#f2f6fb;font:inherit;font-size:14px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:color .2s ease,padding-left .2s ease}
.m-menu--v2 .mm-link .ic{width:16px;height:16px;color:#5b8dff;opacity:.85}
.m-menu--v2 .m-acc .nav-caret{width:12px;height:7px;color:#5b8dff;transition:transform .22s ease}
.m-menu--v2 .m-acc[aria-expanded="true"]{color:#8fb0ff}
.m-menu--v2 .m-acc[aria-expanded="true"] .nav-caret{transform:rotate(180deg)}
.m-menu--v2 .mm-link:active,.m-menu--v2 .m-acc:active{color:#8fb0ff}
.m-menu--v2 .m-group{border:0}
.m-menu--v2 .m-sub{display:grid;gap:4px;padding:6px 0 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.m-menu--v2 .m-sub[hidden]{display:none}
.m-menu--v2 #m-services a{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);color:#e8eef8;text-decoration:none;transition:background .18s ease}
.m-menu--v2 #m-services a:active{background:rgba(20,55,245,.22)}
.m-menu--v2 .mm-ic{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:#8fb0ff;
  background:linear-gradient(180deg,rgba(20,55,245,.26),rgba(20,55,245,.1));border:1px solid rgba(91,141,255,.3)}
.m-menu--v2 .mm-ic svg{width:19px;height:19px}
.m-menu--v2 .mm-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.m-menu--v2 .mm-t b{font-size:14px;font-weight:800;letter-spacing:-.01em;color:#fff;line-height:1.15}
.m-menu--v2 .mm-t small{font-size:11.5px;font-weight:600;color:#93a7c2;line-height:1.3}
.m-menu--v2 .m-sub--areas{grid-template-columns:repeat(2,1fr);gap:8px}
.m-menu--v2 .m-sub--areas a{display:flex;align-items:center;justify-content:center;min-height:42px;padding:0 12px;border-radius:999px;text-align:center;
  border:1px solid rgba(91,141,255,.3);background:rgba(20,55,245,.12);color:#e8eef8;font-size:13px;font-weight:800;letter-spacing:.02em;text-decoration:none;transition:background .18s ease}
.m-menu--v2 .m-sub--areas a:active{background:#1437f5}
.m-menu--v2 .mm-cta{margin-top:18px;padding:16px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.1);display:grid;gap:10px}
.m-menu--v2 .mm-book{display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;border-radius:999px;background:#1437f5;color:#fff;
  font-size:13.5px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;box-shadow:0 12px 30px rgba(20,55,245,.45)}
.m-menu--v2 .mm-book .ic{width:16px;height:16px}
.m-menu--v2 .mm-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.m-menu--v2 .mm-call,.m-menu--v2 .mm-wa{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:999px;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:#fff;font-size:13px;font-weight:800;letter-spacing:.02em;text-decoration:none;white-space:nowrap}
.m-menu--v2 .mm-call .ic,.m-menu--v2 .mm-wa .ic{width:16px;height:16px}
.m-menu--v2 .mm-wa .ic{color:#25D366}
.m-menu--v2 .mm-hours{display:block;text-align:center;color:#93a7c2;font-size:11px;font-weight:700;letter-spacing:.04em;line-height:1.5}
.m-menu--v2 .mm-stars{color:#f5b301;letter-spacing:1px}
body.menu-open{overflow:hidden}
/* ── book now en el hero + chips de área como enlaces (2026-09-10 · WEB-076) ── */
.call-row{max-width:680px}
.call-strip{flex:1.2 1 250px}
.call-book{flex:1 1 200px;display:flex;align-items:center;justify-content:center;gap:12px;min-width:200px;padding:14px 18px;
  background:linear-gradient(135deg,#1437f5,#2a56ff);color:#fff;text-decoration:none;transition:filter .25s ease,background .25s ease}
.call-book:hover{filter:brightness(1.08)}
.call-book .call-txt{display:flex;flex-direction:column;gap:2px;align-items:flex-start}
.call-book .call-lbl{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.call-book strong{display:inline-flex;align-items:center;gap:8px;font-size:17px;font-weight:900;letter-spacing:.02em;color:#fff}
.call-book strong .ic{width:15px;height:15px}
@media (max-width:640px){
  .call-row{gap:8px;background:none;border:0;border-radius:0;overflow:visible}
  .call-strip,.call-book{flex:1 1 100%;border-radius:14px}
  .call-book{box-shadow:0 16px 36px rgba(20,55,245,.38);justify-content:center}
  .call-book .call-txt{align-items:center}
}
a.area-btn{text-decoration:none}
a.area-btn .arr{opacity:.55;transition:opacity .2s ease,transform .2s ease}
a.area-btn:hover .arr{opacity:1;transform:translateX(3px)}
.area-chip--static{cursor:default;opacity:.85}
.nav-drop--contact{min-width:290px}

/* WEB-093 · 2026-09-15 · cabecera compacta también entre 961 y 1120 px: la de escritorio no cabe (medido a 1024: el teléfono se partía en 3 líneas).
   Mismas reglas de cabecera que <=960 (logo, teléfono en píldora, hamburguesa, ES); Book Now se conserva (hay sitio). Rango continuo hasta 1120 px (por debajo de 960 repite valores idénticos: sin hueco en anchos fraccionarios). Nada más cambia. */
@media (max-width:1120px){
  .desktop-nav-v3{display:none}
  .util-v3{display:none}
  .hdr{height:64px;gap:10px}
  .hdr-phone{display:none}
  .hdr-logo img{width:74px;height:52px}
  .hdr-phone-m{display:inline-flex;height:40px;padding:0 12px;font-size:12px;letter-spacing:.03em;white-space:nowrap;background:var(--accent);border-color:var(--accent);box-shadow:0 6px 18px rgba(20,55,245,.35)}
  .hdr-phone-m span{display:inline}
  .hdr-cta{height:40px;padding:0 12px;font-size:10px;white-space:nowrap}
  .cta-l{display:none}
  .cta-s{display:inline}
  .hdr-right{gap:8px}
  .m-toggle{display:flex}
}
/* WEB-094 · 2026-09-15 · fundador: nota en la sección «One family. One standard.» del home y sección «Meet the founder» en About Us (reutiliza .crew-grid/.crew-copy/.crew-owner) */
.founder-note{margin-top:22px;padding:16px 18px;border-left:3px solid var(--accent);border-radius:12px;background:rgba(255,255,255,.05)}
.founder-note .founder-name{display:block;font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:#7da4ff}
.founder-note p{margin-top:8px;font-size:14.5px;line-height:1.6;color:#d7e0ea;max-width:520px}
.founder-note a{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#fff;text-decoration:none}
.founder-note a:hover{color:#7da4ff}
.crew-media--one{grid-template-columns:1fr;max-width:440px}
.crew-media--wide{max-width:none}
.crew-owner--wide{aspect-ratio:3/2;object-position:50% 45%}
.founder-section .crew-copy p+p{margin-top:12px}
@media (max-width:960px){.crew-media--one{max-width:360px;margin:0 auto}.crew-media--wide{max-width:none}}
/* WEB-094 b · sección del fundador más limpia: rótulo sobre la foto, una frase, dos acciones */
.founder-figure{position:relative;margin:0}
.founder-cap{position:absolute;left:14px;bottom:14px;display:flex;flex-direction:column;gap:2px;padding:10px 14px;border-radius:10px;background:rgba(4,11,19,.78);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12)}
.founder-cap strong{font-size:15px;font-weight:900;letter-spacing:.01em;color:#fff}
.founder-cap span{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#7da4ff}
.crew-copy .founder-line{font-style:italic;color:#d7e0ea}
.founder-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:26px}
.founder-actions .ft-cta{margin-top:0}
.founder-link{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#7da4ff;text-decoration:none}
.founder-link:hover{color:#fff}
/* WEB-094 c · fondo del fundador: foto tenue y desenfocada bajo el degradado oscuro (sin rótulos de la van detrás del texto) */
.pbg--founder img{opacity:.38;filter:saturate(.8) contrast(1.05) blur(2px)}
.pbg--founder::after{background:linear-gradient(180deg,rgba(7,17,27,.86),rgba(7,17,27,.62) 45%,rgba(7,17,27,.92)),radial-gradient(55% 55% at 25% 45%,rgba(20,55,245,.22),transparent 70%)}
/* WEB-094 d · selects de las tarjetas de reserva sobre fondo oscuro: flecha blanca propia (la nativa salía negra e invisible en móvil) */
.quote--dark select.q-input{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px 16px;padding-right:42px}
@media (max-width:960px){.hero-form-col select.q-input{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px 16px;padding-right:42px}}

/* R01 v1.1.0 · desplegable propio de dirección (sustituye la cubierta de pantalla completa del
   componente de Google). Posición y ancho los fija el JS desde las coordenadas del campo: el
   padre cambia entre el formulario del hero y el del final. */
.sd-addr-list{position:absolute;z-index:60;margin:0;padding:6px;list-style:none;background:#fff;
  border:1px solid #d7dce5;border-radius:10px;box-shadow:0 14px 34px rgba(12,22,44,.18);
  max-height:min(40dvh,240px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.sd-addr-list[hidden]{display:none}
.sd-addr-list li{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:8px;
  cursor:pointer;line-height:1.25;text-align:left}
.sd-addr-list li.is-active,.sd-addr-list li:hover{background:#eef3fb}
.sd-addr-main{font-weight:600;color:#0c162c;font-size:.95rem}
.sd-addr-sec{color:#5b6677;font-size:.8rem}
/* La atribución es obligatoria: no se oculta, no se traduce, no se parte en dos líneas. */
.sd-addr-list li.sd-addr-attr{padding:6px 12px 4px;cursor:default;color:#8a94a6;font-size:.7rem;
  letter-spacing:.02em;border-top:1px solid #eef1f6;margin-top:4px;white-space:nowrap}
.sd-addr-list li.sd-addr-attr:hover{background:transparent}
/* 2026-10-02 · «Request a quote» de las páginas de estudio es un ENLACE (el formulario vive solo en /contact/): mismo aspecto que el botón */
a.q-submit{text-decoration:none;box-sizing:border-box}
.quote--cta .quote-sub{margin-bottom:6px}

/* 2026-10-02 · botón EN/ES en TODAS las páginas (antes solo /book/ y /offer/, que lo traen de landing.css) */
.lang-btn{min-width:44px;min-height:40px;padding:0 12px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#e7eef7;font-weight:800;font-size:12px;letter-spacing:.08em;cursor:pointer;transition:background .25s ease,border-color .25s ease;flex:0 0 auto}
.lang-btn:hover{background:rgba(47,110,255,.22);border-color:rgba(125,164,255,.7)}
@media (max-width:960px){.lang-btn{min-width:36px;min-height:36px;padding:0 7px}}
.lang-note:empty{display:none}.lang-note{margin-top:10px;font-size:13px;opacity:.85}
.hdr-phone-num,.hdr-cta{white-space:nowrap}

/* ── 2026-10-03 · selector de reserva con TARJETAS (patrón de /offer/) en los formularios «book-start» ──
   Contraste (WCAG 1.4.11, medido): elegido = borde de acento + aro + punto (claro 7,25:1 · oscuros 10,8-11,3:1) y foco con el acento;
   borde sin elegir oscuro ≥3:1 (alfa .46); en el tema claro ese borde es decorativo (la tarjeta se identifica por su texto y precio).
   Cada contexto conserva su paleta: hero de escritorio claro · hero móvil (≤960px) y formulario final oscuros. */
.quote{--bs-line:#cbd5e1;--bs-bg:#fff;--bs-ink:#07111b;--bs-mut:#64748b;--bs-leg:#334155;--bs-acc:#1437f5;--bs-ring:rgba(20,55,245,.16);--bs-hov:#c7d2fe;--bs-tagc:#fff}
.quote--dark{--bs-line:rgba(178,199,255,.46);--bs-bg:rgba(255,255,255,.035);--bs-ink:#fff;--bs-mut:#9aa9b8;--bs-leg:#c6d2de;--bs-acc:#8fb0ff;--bs-ring:rgba(143,176,255,.2);--bs-hov:rgba(143,176,255,.5);--bs-tagc:#07111b}
@media(max-width:960px){.hero-form-col .quote{--bs-line:rgba(178,199,255,.46);--bs-bg:rgba(255,255,255,.04);--bs-ink:#fff;--bs-mut:#9aa9b8;--bs-leg:#c6d2de;--bs-acc:#8fb0ff;--bs-ring:rgba(143,176,255,.2);--bs-hov:rgba(143,176,255,.5);--bs-tagc:#07111b}}
.bs{display:grid;gap:11px;margin:12px 0 12px}
.bs-price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;line-height:1}
.bs-from{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--bs-mut)}
.bs-amt{font-size:34px;font-weight:900;letter-spacing:-.03em;color:var(--bs-ink)}
.bs-note{font-size:12px;font-weight:700;color:var(--bs-acc)}
.bs-set{border:0;margin:0;padding:0;min-width:0}
.bs-leg{display:block;padding:0;margin:0 0 6px;font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--bs-leg)}
.bs-grid{display:grid;gap:7px}
.bs-grid--svc{grid-template-columns:repeat(2,minmax(0,1fr))}
.bs-grid--size{grid-template-columns:repeat(4,minmax(0,1fr))}
.bs-card{position:relative;min-width:0;display:grid;gap:2px;align-content:center;min-height:54px;padding:9px 11px;border:2px solid var(--bs-line);border-radius:12px;background:var(--bs-bg);color:var(--bs-ink);cursor:pointer;text-align:left;transition:border-color .2s,transform .2s,box-shadow .2s;-webkit-tap-highlight-color:transparent}
.bs-card input{position:absolute;left:50%;top:50%;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}
.bs-card:hover{transform:translateY(-1px);border-color:var(--bs-hov)}
.bs-card.on,.bs-card:has(input:checked){border-color:var(--bs-acc);box-shadow:0 0 0 4px var(--bs-ring)}
.bs-card.on::after,.bs-card:has(input:checked)::after{content:"";position:absolute;right:8px;top:8px;width:8px;height:8px;border-radius:50%;background:var(--bs-acc);box-shadow:0 0 0 3px var(--bs-ring)}
.bs-card:has(input:focus-visible){outline:2px solid var(--bs-acc);outline-offset:2px}
.bs-name{font-size:14px;font-weight:800;line-height:1.15;overflow-wrap:anywhere}
.bs-sub{font-size:11.5px;font-weight:600;line-height:1.25;color:var(--bs-mut)}
.bs-tag{position:absolute;top:-8px;left:9px;padding:2px 6px;border-radius:6px;background:var(--bs-acc);color:var(--bs-tagc);font-size:8.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.bs-card--size{min-height:50px;padding:7px 3px;text-align:center;justify-items:center}
.bs-card--size .bs-name{font-size:12px}
.bs-card--size.on::after,.bs-card--size:has(input:checked)::after{right:5px;top:5px;width:6px;height:6px}
.bs-p{min-height:17px;font-size:15px;font-weight:900;letter-spacing:-.01em;color:var(--bs-acc);line-height:1.1}
.bs-desde{display:block;font-size:8.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--bs-mut)}
.bs-p.exacto .bs-desde{display:none}
@media(max-width:960px){.hero-form-col .bs{gap:9px;margin:6px 0 10px}.hero-form-col .bs-amt{font-size:28px}.hero-form-col .bs-card{min-height:48px;padding:7px 9px}.hero-form-col .bs-card--size{min-height:46px;padding:6px 2px}}
@media(max-width:380px){.bs-grid--size{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:960px){.hero-form-col .bs-card--size .bs-name{font-size:11.5px}}

/* ── 2026-10-03 · hero de escritorio: la columna del formulario nunca baja de 360px (en Altamonte el título de 990px la dejaba
   en 175px) y el nombre de ciudad largo usa un tamaño que cabe en su columna; en móvil conserva el tamaño anterior. ── */
@media(min-width:961px){.hero-grid-v3{grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr)}}
#v3-h1 .h1-l4.h1-l4--long{font-size:clamp(.85em,6.9vw,1.86em)}
@media(min-width:961px){#v3-h1 .h1-l4.h1-l4--long{font-size:clamp(.85em,4.3vw,1.16em)}}

/* ── 2026-10-03 · FAQ en <details> (15 páginas: oferta, ciudades y servicios) · Randy: «no es premium, no se ve profesional» ──
   Nadie estilizaba <details>/<summary> dentro de .faq-list: salían el triángulo del navegador y el texto suelto sobre la foto.
   Ahora: tarjeta por pregunta, «+» que gira a «×», respuesta en gris claro y un velo más denso sobre la foto de la van. */
.faq--dark .faq-list{border-top:0;display:grid;gap:10px;margin-top:6px;max-width:880px}
.faq--dark .faq-list details{background:rgba(7,17,27,.74);border:1px solid rgba(148,178,255,.16);border-radius:14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .2s ease,background .2s ease}
.faq--dark .faq-list details[open]{background:rgba(11,24,44,.92);border-color:rgba(125,164,255,.46);box-shadow:0 14px 34px rgba(0,0,0,.28)}
.faq--dark .faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;cursor:pointer;font-size:16.5px;font-weight:800;line-height:1.35;letter-spacing:-.005em;color:#fff}
.faq--dark .faq-list summary::-webkit-details-marker{display:none}
.faq--dark .faq-list summary::marker{content:""}
.faq--dark .faq-list summary::after{content:"";flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:rgba(125,164,255,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1.5v9M1.5 6h9' stroke='%239fb6ff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform .25s ease,background-color .2s ease}
.faq--dark .faq-list details[open] summary::after{transform:rotate(45deg);background-color:rgba(125,164,255,.26)}
.faq--dark .faq-list summary:hover::after{background-color:rgba(125,164,255,.24)}
.faq--dark .faq-list summary:focus-visible{outline:2px solid #7da4ff;outline-offset:3px;border-radius:14px}
.faq--dark .faq-list details p{margin:0;padding:0 20px 18px;max-width:72ch;color:#c9d3df;font-size:15px;line-height:1.65}
.faq--dark .faq-list details p+p{margin-top:-8px}
.faq--dark .faq-list details p b{color:#fff}
.faq--dark .pbg--dark::after{background:linear-gradient(180deg,rgba(7,17,27,.9),rgba(7,17,27,.8) 45%,rgba(7,17,27,.94)),radial-gradient(60% 60% at 70% 40%,rgba(20,55,245,.16),transparent 70%)}
@media (max-width:640px){
  .faq--dark .faq-list{gap:8px}
  .faq--dark .faq-list summary{padding:16px;font-size:15.5px}
  .faq--dark .faq-list details p{padding:0 16px 16px;font-size:14.5px}
}

/* Migas visibles (auditoría SEO 2026-10-04): las MISMAS entradas que el BreadcrumbList de cada página, sin hubs nuevos */
.crumbs{margin:0 0 12px;font-size:12px;font-weight:600;letter-spacing:.02em;line-height:1.3}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:0 6px;margin:0;padding:0;list-style:none}
.crumbs li{display:flex;align-items:center;gap:6px;opacity:.78}
.crumbs li+li::before{content:"\203A";opacity:.7}
.crumbs a{color:inherit;text-decoration:none;display:inline-block;padding:12px 2px;margin:-12px -2px}
.crumbs a:hover,.crumbs a:focus-visible{text-decoration:underline;text-underline-offset:3px}
.crumbs [aria-current="page"]{opacity:1}
/* «, FL» del H1 de ciudad (H1 = «Mobile Detailing in [City], FL», igual que el title): etiqueta postal, no compite con la ciudad */
.h1-st{font-size:.5em;letter-spacing:.06em;margin-left:.06em;vertical-align:.12em}
/* H1 en español, móvil (auditoría 2026-10-04): «DETALLADO» y «PROTECCIÓN» son ~15 % más anchas que DETAILING/PROTECTION
   y a 2.15em tocaban o pasaban el borde (medido: 395 px de 390 en home, Orlando, interior y exterior; 391 en PPF).
   1.9em deja el mismo aire a la derecha que tiene el inglés. Solo español y solo ≤480 px; .h1-l2--long (12.8vw) no se toca. */
@media (max-width:480px){html[lang="es"] #v3-h1 .h1-l2:not(.h1-l2--long){font-size:1.9em}}

/* Fase 2 · auditoría 2026-10-04 · los 4 paquetes (2×2 en escritorio), extras con precio publicado y guías en acordeón.
   .guide-list hereda el acabado de la FAQ oscura (las mismas reglas, derivadas de ellas) pero NO es FAQ: no lleva FAQPage
   y qa/faq_paridad_test.mjs solo mira div.faq-list. */
.tier-card[id]{scroll-margin-top:96px}
.guide{padding:clamp(56px,8vh,96px) clamp(18px,4vw,60px)}
.guide .sec-head .sec-lead{max-width:62ch}
.guide .sec-head h2{text-wrap:balance}
.tiers-note a{text-decoration:underline;text-underline-offset:3px}
@media (min-width:961px){.tiers.tiers--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.addon-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:6px}
.addon{display:flex;flex-direction:column;gap:6px;padding:18px 18px 16px;border-radius:14px;background:rgba(255,255,255,.92);border:1px solid rgba(10,20,32,.08);box-shadow:0 10px 26px rgba(10,20,32,.07)}
.addon b{font-size:15.5px;font-weight:800;letter-spacing:-.005em;color:#0a1420}
.addon small{font-size:13px;line-height:1.45;color:#556677}
.addon .addon-price{margin-top:auto;padding-top:4px;font-size:19px;font-weight:900;color:#1437f5}
@media (max-width:1080px){.addon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.addon-grid{gap:10px}.addon{padding:14px 14px 12px}.addon b{font-size:14.5px}}
.guide-wrap{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(22px,3vw,48px);align-items:start;margin-top:8px}
.guide-fig{margin:0;position:sticky;top:104px;border-radius:18px;overflow:hidden;border:1px solid rgba(148,178,255,.18);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.guide-fig img{display:block;width:100%;height:auto}
.guide-list p a.lnk-w{text-decoration:underline;text-underline-offset:3px}
@media (max-width:960px){.guide-wrap{grid-template-columns:1fr}.guide-fig{position:static;order:-1;max-width:560px}.guide-fig img{max-height:420px;object-fit:cover}}
.faq--dark .guide-list{border-top:0;display:grid;gap:10px;margin-top:6px;max-width:880px}
.faq--dark .guide-list details{background:rgba(7,17,27,.74);border:1px solid rgba(148,178,255,.16);border-radius:14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .2s ease,background .2s ease}
.faq--dark .guide-list details[open]{background:rgba(11,24,44,.92);border-color:rgba(125,164,255,.46);box-shadow:0 14px 34px rgba(0,0,0,.28)}
.faq--dark .guide-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;cursor:pointer;font-size:16.5px;font-weight:800;line-height:1.35;letter-spacing:-.005em;color:#fff}
.faq--dark .guide-list summary::-webkit-details-marker{display:none}
.faq--dark .guide-list summary::marker{content:""}
.faq--dark .guide-list summary::after{content:"";flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:rgba(125,164,255,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1.5v9M1.5 6h9' stroke='%239fb6ff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform .25s ease,background-color .2s ease}
.faq--dark .guide-list details[open] summary::after{transform:rotate(45deg);background-color:rgba(125,164,255,.26)}
.faq--dark .guide-list summary:hover::after{background-color:rgba(125,164,255,.24)}
.faq--dark .guide-list summary:focus-visible{outline:2px solid #7da4ff;outline-offset:3px;border-radius:14px}
.faq--dark .guide-list details p{margin:0;padding:0 20px 18px;max-width:72ch;color:#c9d3df;font-size:15px;line-height:1.65}
.faq--dark .guide-list details p+p{margin-top:-8px}
.faq--dark .guide-list details p b{color:#fff}
@media (max-width:640px){
  .faq--dark .guide-list{gap:8px}
  .faq--dark .guide-list summary{padding:16px;font-size:15.5px}
}
/* Fase 3 · auditoría 2026-10-04 · ciudades: tira compacta de los 4 paquetes (el detalle vive en /car-detailing-orlando/) y
   entrada de #proof legible sobre su FOTO de fondo (#526174 daba ~2.8:1 contra el fondo; #c9d3df, el texto de los acordeones oscuros,
   da ≥4.5:1 incluso contra el píxel más claro de la foto detrás del texto, medido en navegador) */
.proof-head .sec-lead{color:#c9d3df}
.pkg-mini{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;max-width:1240px;margin:0 auto 14px;padding:0 clamp(18px,3.4vw,52px)}
.pkg-m{position:relative;display:flex;flex-direction:column;gap:8px;padding:24px 20px 18px;border-radius:16px;background:linear-gradient(180deg,rgba(13,26,43,.92),rgba(7,15,26,.94));border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 50px rgba(0,0,0,.35);color:#fff;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s}
.pkg-m:hover{transform:translateY(-4px);border-color:rgba(125,164,255,.45)}
.pkg-m--pop{border-color:rgba(125,164,255,.55);background:linear-gradient(180deg,rgba(20,45,110,.92),rgba(9,22,52,.95));box-shadow:0 24px 60px rgba(0,0,0,.45),0 0 40px rgba(20,55,245,.35)}
.pkg-m h3{font-size:19px;font-weight:900;letter-spacing:-.01em;text-transform:uppercase;font-style:italic;line-height:1.08}
.pkg-m--pop h3{color:#ffe8a3;text-shadow:0 0 1px #fff7dd,0 0 10px rgba(255,214,107,.7),0 0 26px rgba(201,151,28,.55)}
.pkg-m-p{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:2px 0 6px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
.pkg-m-p small{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#7da4ff;font-weight:800}
.pkg-m-p strong{font-size:30px;font-weight:900;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.pkg-m-p span{flex-basis:100%;font-size:12px;color:#9fb0c3}
.pkg-m-p span{white-space:nowrap}
@media (min-width:961px){.pkg-m h3{min-height:2.16em}}
.pkg-m .tier-cta{margin-top:auto;white-space:nowrap}
.pkg-m--pop .tier-cta{background:linear-gradient(135deg,#f5c542,#e0a41c);color:#0a1420;box-shadow:0 12px 28px rgba(245,197,66,.3)}
.pkg-m-inc{align-self:center;min-height:32px;display:inline-flex;align-items:center;font-size:12.5px;font-weight:700;color:#c9d3df;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.pkg-m-inc:hover,.pkg-m-inc:focus-visible{color:#fff}
.pkg-mini .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:960px){.pkg-mini{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0 18px}.pkg-m{padding:22px 14px 14px}.pkg-m h3{font-size:16px}.pkg-m-p strong{font-size:26px}.pkg-m .tier-cta{height:44px;font-size:11px;letter-spacing:.1em}}
@media (max-width:560px){.pkg-mini{grid-template-columns:1fr;gap:12px}.pkg-m{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"k k" "h h" "p c" "i i";column-gap:14px;row-gap:6px;padding:20px 16px 10px}.pkg-m .tier-num{grid-area:k}.pkg-m h3{grid-area:h}.pkg-m-p{grid-area:p;margin:0;padding-top:4px;border-top:0}.pkg-m .tier-cta{grid-area:c;align-self:center;margin-top:0;padding:0 14px;letter-spacing:.08em}.pkg-m-inc{grid-area:i;justify-self:start}}
@media (max-width:380px){.pkg-m{grid-template-columns:minmax(0,1fr);grid-template-areas:"k" "h" "p" "c" "i"}.pkg-m .tier-cta{width:100%}}
/* Fase 3 · cabecera a 320-359 px: logo + teléfono + menú + idioma pedían 343 px (scroll horizontal en todo el sitio, previo).
   Se compacta sin quitar el número visible: menos relleno lateral, logo algo menor, botón de teléfono más estrecho. */
@media (max-width:359px){.hdr{padding:0 10px;gap:6px}.hdr-logo img{width:60px;height:42px}.hdr-right{gap:6px}.hdr-phone-m{padding:0 8px;gap:4px;font-size:11px;letter-spacing:0}.hdr-phone-m svg{width:13px;height:13px}.lang-btn{min-width:34px;padding:0 5px}.m-toggle{width:40px;height:40px;padding:9px}}