/* ============================================================
   LINK 360 · AG5 Agência de Marketing
   Mesma linguagem do site www.ag5agencia.com.br:
   Manrope 500 com tracking apertado, preto grafite, zero cor de
   destaque, linhas finas, raio 7px (botão) e 12px (cartão).
   O único acento é o verde do WhatsApp e o dourado das estrelas.
   ============================================================ */

html { background: #0b0c0e; scroll-behavior: smooth; }

body {
    --bg: #0b0c0e;
    --surface: #121417;
    --surface-2: #191b1f;
    --fg: #f2f2ef;
    --muted: #a2a4ab;
    --line: #292c31;
    --gold: #e4b65a;
    --tint: 242, 242, 239;
    --rv-bg: #eaeae5; --rv-ink: #18191b; --rv-mute: #5d5e64; --rv-line: #c8c9c2; --rv-av: #dadbd4; --rv-gold: #a56d12;
    --font: "Manrope", Arial, sans-serif;
    --ease: cubic-bezier(.22, 1, .36, 1);
    /* aliases usados pelo HTML e pelo script */
    --off: var(--bg); --dark: var(--fg); --card: var(--surface); --accent: var(--fg); --nude: var(--fg);
    color-scheme: dark;
}
body:not(.dark) {
    --bg: #f2f2ef;
    --surface: #ffffff;
    --surface-2: #eaeae5;
    --fg: #18191b;
    --muted: #5d5e64;
    --line: #d8d8d1;
    --gold: #a56d12;
    --tint: 24, 25, 27;
    --rv-bg: #121417; --rv-ink: #f2f2ef; --rv-mute: #a2a4ab; --rv-line: #2f3338; --rv-av: #23262b; --rv-gold: #e4b65a;
    color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body {
    margin: 0;
    font: 400 16px/1.6 var(--font);
    background: var(--bg);
    color: var(--fg);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    transition: background .4s var(--ease), color .4s var(--ease);
}
h1, h2, h3, h4, p, figure, address, ul { margin: 0; }
ul { padding: 0; list-style: none; }
address { font-style: normal; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
img { display: block; max-width: 100%; height: auto; -webkit-user-drag: none; }
::selection { color: var(--bg); background: var(--fg); }
:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; border-radius: 3px; }
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-thumb { background: var(--line); }
body.preloading { overflow: hidden; }

.shell { width: 100%; max-width: 448px; margin: 0 auto; min-height: 100svh; background: var(--bg); overflow: hidden; }
.word-soft { color: var(--muted); }
.hero .word-soft { color: #a2a4ab; }

/* ─── PRELOADER ─── */
.preloader { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; background: #0b0c0e; transition: opacity .8s var(--ease), visibility 0s linear .8s; }
.preloader.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.preloader-bg, .preloader-shimmer, .preloader-divider, .preloader-welcome { display: none; }
.preloader-content { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 24px; animation: pl-in .9s var(--ease) both; }
@keyframes pl-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.preloader-logo-ring { position: relative; width: 112px; height: 112px; margin-bottom: 30px; }
.preloader-ring-svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.preloader-ring-track { fill: none; stroke: #292c31; stroke-width: 1.2; }
.preloader-ring-progress { fill: none; stroke: #f2f2ef; stroke-width: 1.2; stroke-linecap: round; stroke-dasharray: 352; stroke-dashoffset: 352; animation: pl-ring 2.2s cubic-bezier(.65, 0, .35, 1) forwards; }
@keyframes pl-ring { to { stroke-dashoffset: 0; } }
.preloader-logo { position: absolute; inset: 22px; display: flex; align-items: center; justify-content: center; }
.preloader-logo img { width: 100%; height: 100%; object-fit: contain; }
.preloader-brand { font-size: 13px; font-weight: 700; letter-spacing: .14em; line-height: 1.6; color: #f2f2ef; margin-bottom: 10px; opacity: 0; animation: pl-up .8s .6s var(--ease) forwards; }
.preloader-tagline { font-size: 12px; color: #a2a4ab; margin-bottom: 30px; opacity: 0; animation: pl-up .8s .8s var(--ease) forwards; }
@keyframes pl-up { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.preloader-progress { display: flex; flex-direction: column; align-items: center; gap: 12px; opacity: 0; animation: pl-up .7s 1.1s var(--ease) forwards; }
.preloader-bar { position: relative; width: 96px; height: 1px; background: #292c31; overflow: hidden; }
.preloader-bar span { position: absolute; inset: 0; background: linear-gradient(90deg, transparent, #f2f2ef, transparent); transform: translateX(-100%); animation: pl-bar 1.6s cubic-bezier(.4, 0, .2, 1) infinite; }
@keyframes pl-bar { to { transform: translateX(100%); } }
.preloader-loading-text { font-size: 9px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: #6f727a; padding-left: .3em; }
.preloader-dot { display: inline-block; opacity: .3; animation: pl-dot 1.4s infinite; }
.preloader-dot:nth-child(2) { animation-delay: .2s; }
.preloader-dot:nth-child(3) { animation-delay: .4s; }
@keyframes pl-dot { 0%, 60%, 100% { opacity: .3; } 30% { opacity: 1; } }

/* ─── BOTÕES FLUTUANTES (tema e mídia) ─── */
#theme-btn, #music-toggle {
    position: fixed; right: 16px; z-index: 1100; width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    background: #121417; color: #f2f2ef; border: 1px solid #292c31; border-radius: 7px; font-size: 13px;
    transition: opacity .35s var(--ease), transform .35s var(--ease), border-color .25s var(--ease);
}
#theme-btn { top: 16px; }
#music-toggle { top: 64px; }
body:not(.dark) #theme-btn, body:not(.dark) #music-toggle { background: #ffffff; color: #18191b; border-color: #d8d8d1; box-shadow: 0 2px 10px rgba(0, 0, 0, .08); }
#music-toggle.active { border-color: #f2f2ef; }
.hidden-btn { opacity: 0 !important; pointer-events: none !important; transform: translateY(-8px) !important; }

/* ─── HERO ─── */
.hero { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; min-height: max(100svh, 700px); background: #0b0c0e; color: #f2f2ef; overflow: hidden; }
.hero__glow { position: absolute; inset: 0; z-index: -4; background: radial-gradient(ellipse 82% 46% at 50% 31%, #2b2d33 0%, #16181b 50%, #0b0c0e 82%); }
.hero__map { position: absolute; z-index: -3; top: -34px; left: -6%; width: 128%; aspect-ratio: 1.098; pointer-events: none; }
.hero__man { position: absolute; z-index: -2; top: -30px; left: 50%; width: min(120%, 500px); max-width: none; height: auto; transform: translateX(-50%); -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 60%, transparent 90%); mask-image: linear-gradient(to bottom, #000 0%, #000 60%, transparent 90%); pointer-events: none; }
.hero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(to bottom, rgba(11, 12, 14, .5) 0%, rgba(11, 12, 14, 0) 16%, rgba(11, 12, 14, 0) 52%, rgba(11, 12, 14, .82) 66%, #0b0c0e 78%); }
.hero__top { position: absolute; top: 0; left: 0; display: flex; align-items: center; height: 72px; padding: 0 20px; }
.hero__logo { width: 48px; height: 48px; object-fit: contain; }
.hero__copy { padding: 0 20px 30px; }
.small-dot { display: inline-block; width: 6px; height: 6px; background: currentColor; border-radius: 50%; flex: none; }
.hero__tag { display: flex; align-items: center; gap: 10px; font-size: 11px; line-height: 1.5; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #d0d2d6; }
.hero h1 { margin-top: 18px; font-size: clamp(40px, 11.6vw, 48px); font-weight: 500; letter-spacing: -.065em; line-height: 1.04; }
.hero__fronts { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 20px; font-size: 14px; font-weight: 500; letter-spacing: -.01em; color: #f2f2ef; }
.hero__fronts span { color: #6f727a; }

.hero__cta { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; margin-top: 26px; padding: 18px 2px; font-size: 15px; font-weight: 500; letter-spacing: -.02em; color: #f2f2ef; }
.hero__cta i { font-style: normal; font-size: 18px; line-height: 1; transition: transform .35s var(--ease); }
.hero__cta::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #f2f2ef; transform-origin: left center; }
body:not(.preloading) .hero__cta::after { animation: cta-line 1.3s .9s var(--ease) both; }
@keyframes cta-line { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (hover: hover) and (pointer: fine) { .hero__cta:hover i { transform: translateY(4px); } }

/* mapa do Brasil (mesma arte do site, seção Alcance) */
.br-map__svg { display: block; width: 100%; height: 100%; overflow: visible; }
.br-map__states path { fill: #181a1e; stroke: #474c55; stroke-width: 1.6; }
.br-map__route { stroke: #a3a8b1; stroke-width: 1.6; opacity: 0; stroke-linecap: round; }
.br-map__dot { fill: #f2f2ef; opacity: 0; }
.br-map__origin rect { fill: #f2f2ef; }
.br-map__pin { fill: #0b0c0e; }
.br-map__pulse { fill: none; stroke: #f2f2ef; opacity: 0; }
@keyframes br-draw { from { opacity: 0; stroke-dasharray: 1 1400; } to { opacity: .7; stroke-dasharray: 1400 0; } }
@keyframes br-dot { to { opacity: .95; } }
@keyframes br-pulse { 0% { opacity: .4; transform: scale(.7); } 70%, 100% { opacity: 0; transform: scale(1.7); } }
body:not(.preloading) .br-map__route { animation: br-draw 1.5s var(--ease) forwards; animation-delay: calc(var(--i) * 70ms + 500ms); }
body:not(.preloading) .br-map__dot { animation: br-dot .5s var(--ease) forwards; animation-delay: calc(var(--i) * 70ms + 1400ms); }
body:not(.preloading) .br-map__pulse { animation: br-pulse 3.4s var(--ease) infinite; }
body:not(.preloading) .br-map__pulse--2 { animation-delay: 1.7s; }

@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
body:not(.preloading) .hero__copy > * { animation: rise .9s var(--ease) both; }
body:not(.preloading) .hero__copy > :nth-child(2) { animation-delay: .08s; }
body:not(.preloading) .hero__copy > :nth-child(3) { animation-delay: .16s; }
body:not(.preloading) .hero__copy > :nth-child(4) { animation-delay: .24s; }

/* ─── LAYOUT ─── */
.main { padding: 20px 16px 0; }
.stack { display: flex; flex-direction: column; gap: 10px; padding-top: 28px; }
.sec { padding-top: 76px; }
.sec__head { margin-bottom: 30px; padding: 0 4px; }
.idx { margin-bottom: 18px; font-size: 11px; line-height: 1.5; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.sec__title { font-size: clamp(32px, 9vw, 38px); font-weight: 500; letter-spacing: -.055em; line-height: 1.1; }
.sec__sub { margin-top: 14px; max-width: 44ch; font-size: 13px; line-height: 1.75; color: var(--muted); }

/* ─── BOTÕES E LINKS ─── */
.link { display: flex; align-items: center; gap: 16px; min-height: 72px; padding: 16px 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; transition: border-color .25s var(--ease), transform .2s var(--ease); }
.link:active { transform: scale(.985); }
.link__icon { flex: none; width: 24px; text-align: center; font-size: 19px; }
.link__body { flex: 1; min-width: 0; }
.link__label { font-size: 10px; line-height: 1.5; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.link__title { margin-top: 2px; font-size: 17px; font-weight: 500; letter-spacing: -.03em; line-height: 1.25; }
.link__go { flex: none; font-size: 15px; color: var(--muted); }
.link--primary { background: var(--fg); border-color: var(--fg); color: var(--bg); min-height: 64px; border-radius: 7px; }
.link--primary .link__label, .link--primary .link__go { color: inherit; opacity: .65; }
.link--primary .link__title { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.goals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.goal { display: flex; flex-direction: column; padding: 16px 12px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; transition: border-color .25s var(--ease), transform .2s var(--ease); }
.goal:active { transform: scale(.985); }
.goal i { margin-bottom: 14px; font-size: 16px; }
.goal strong { font-size: 13px; font-weight: 600; letter-spacing: -.02em; }
.goal span { margin-top: 3px; font-size: 10.5px; line-height: 1.4; color: var(--muted); }
.quick { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.quick a, .quick button { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; border: 1px solid var(--line); border-radius: 7px; font-size: 12px; font-weight: 600; transition: border-color .25s var(--ease), transform .2s var(--ease); }
.quick i { font-size: 12px; color: var(--muted); }
.text-link { display: inline-flex; align-items: center; gap: 12px; padding-bottom: 5px; border-bottom: 1px solid currentColor; font-size: 12px; font-weight: 600; }
.btn { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 15px 22px; background: var(--fg); border: 1px solid var(--fg); color: var(--bg); border-radius: 7px; font-size: 13px; font-weight: 700; white-space: nowrap; transition: transform .2s var(--ease), opacity .2s; }
.btn:active { transform: scale(.985); }
.btn--line { background: transparent; color: var(--fg); border-color: var(--line); }

/* ─── SDR AG5 (atendimento guiado) ─── */
.cz-wrap { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 28px 0; scroll-margin-top: 0; }
.cz-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.cz-card.cz-wait { opacity: 0; transform: translateY(28px) scale(.97); }
.cz-card.cz-vis { animation: cz-box .9s var(--ease) both, cz-ring 1.8s .45s var(--ease) 1; }
@keyframes cz-box { from { opacity: 0; transform: translateY(28px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes cz-ring { 0% { box-shadow: 0 0 0 0 rgba(var(--tint), .3); } 100% { box-shadow: 0 0 0 16px rgba(var(--tint), 0); } }
.cz-card.cz-vis .cz-avatar { animation: cz-avatar 1.2s .5s var(--ease) 1; }
@keyframes cz-avatar { 0% { transform: scale(.6); opacity: 0; } 60% { transform: scale(1.08); opacity: 1; } 100% { transform: none; } }
.cz-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; background: var(--surface-2); border-bottom: 1px solid var(--line); }
.cz-chat-id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cz-avatar { width: 38px; height: 38px; flex: none; border: 1px solid var(--line); border-radius: 50%; object-fit: cover; }
.cz-chat-who { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.cz-chat-nome { font-size: 13px; font-weight: 600; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cz-chat-status { display: flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.cz-online { width: 6px; height: 6px; flex: none; border-radius: 50%; background: #25d366; animation: cz-online 2.4s infinite; }
.cz-online.off { background: var(--muted); animation: none; }
@keyframes cz-online { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .45); } 70% { box-shadow: 0 0 0 6px rgba(37, 211, 102, 0); } 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } }
.cz-dots { display: flex; gap: 5px; flex: none; }
.cz-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(var(--tint), .22); transition: background .3s var(--ease), transform .3s var(--ease); }
.cz-dot.on { background: var(--fg); transform: scale(1.2); }
.cz-thread { display: flex; flex-direction: column; gap: 8px; min-height: min(232px, var(--cz-th, 232px)); max-height: var(--cz-th, 440px); padding: 16px 16px 6px; overflow-y: auto; scroll-behavior: smooth; }
.cz-thread::-webkit-scrollbar { width: 3px; }
.cz-msg { max-width: 88%; padding: 10px 14px; font-size: 13px; line-height: 1.55; animation: cz-in .32s var(--ease); }
@keyframes cz-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.cz-msg-c { align-self: flex-start; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px 12px 12px 3px; }
.cz-msg-u { align-self: flex-end; background: var(--fg); color: var(--bg); border-radius: 12px 12px 3px 12px; }
.cz-typing { display: inline-flex; gap: 4px; padding: 14px 14px; }
.cz-typing span { width: 5px; height: 5px; border-radius: 50%; background: var(--muted); animation: cz-pulse 1s infinite ease-in-out; }
.cz-typing span:nth-child(2) { animation-delay: .15s; }
.cz-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes cz-pulse { 0%, 100% { opacity: .25; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.15); } }
.cz-cardmini { align-self: stretch; display: flex; align-items: center; gap: 14px; margin: 4px 0 2px; padding: 14px; background: var(--surface-2); border: 1px solid rgba(var(--tint), .3); border-radius: 12px; animation: cz-in .4s var(--ease); }
.cz-cardmini-img { flex: none; width: 52px; height: 52px; display: grid; place-items: center; background: var(--bg); border: 1px solid var(--line); border-radius: 50%; font-size: 18px; }
.cz-cardmini-body { min-width: 0; }
.cz-cardmini-eyebrow { display: block; font-size: 9px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.cz-cardmini-title { margin: 3px 0 4px; font-size: 16px; font-weight: 600; letter-spacing: -.03em; line-height: 1.2; }
.cz-cardmini-text { font-size: 11.5px; line-height: 1.55; color: var(--muted); }
.cz-cardmini-link { margin-top: 8px; padding: 0 0 3px; border-bottom: 1px solid currentColor; font-size: 11px; font-weight: 600; }
.cz-actions { padding: 6px 16px 16px; }
.cz-chips { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.cz-chip { padding: 11px 14px; background: transparent; border: 1px solid rgba(var(--tint), .3); border-radius: 7px; font-size: 12.5px; font-weight: 500; line-height: 1.3; text-align: left; animation: cz-in .35s var(--ease); transition: border-color .2s var(--ease), transform .15s; }
.cz-chip:active { transform: scale(.97); }
.cz-chip-sec { border-style: dashed; color: var(--muted); }
.cz-chip.is-on { border-color: var(--fg); background: rgba(var(--tint), .12); }
.cz-chip-go { background: var(--fg); color: var(--bg); border-color: var(--fg); font-weight: 700; }
.cz-msg .cz-hint { display: block; margin-top: 4px; font-size: 11.5px; line-height: 1.5; color: var(--muted); }
.cz-inputrow { display: flex; gap: 8px; animation: cz-in .35s var(--ease); }
.cz-input { flex: 1; min-width: 0; padding: 12px 14px; background: var(--bg); color: var(--fg); border: 1px solid var(--line); border-radius: 7px; font: 400 16px/1.3 var(--font); outline: none; transition: border-color .2s; }
.cz-input::placeholder { color: var(--muted); opacity: .8; }
.cz-input:focus { border-color: var(--fg); }
.cz-send { flex: none; width: 48px; height: 48px; display: grid; place-items: center; background: var(--fg); color: var(--bg); border-radius: 7px; font-size: 14px; transition: transform .15s; }
.cz-send:active { transform: scale(.94); }
.cz-lgpd-mini { margin-top: 8px; font-size: 10px; line-height: 1.5; color: var(--muted); text-align: right; }
.cz-redo-mini { align-self: center; margin-top: 4px; font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); transition: color .2s; }
.cz-cta-wa { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 54px; padding: 15px 18px; background: #25d366; color: #06240f; border-radius: 7px; font-size: 13px; font-weight: 700; transition: transform .2s var(--ease), opacity .2s; }
.cz-cta-wa:active { transform: scale(.985); }
.cz-cta-wa i { font-size: 17px; }
.cz-explore { margin-top: 26px; padding-bottom: 6px; text-align: center; font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); cursor: pointer; transition: color .2s; }
@media (hover: hover) and (pointer: fine) {
    .cz-chip:hover, .cz-cardmini-link:hover { border-color: var(--fg); }
    .cz-redo-mini:hover, .cz-explore:hover { color: var(--fg); }
    .cz-cta-wa:hover { opacity: .92; }
    .cz-send:hover { opacity: .9; }
}

/* ─── REVEAL ─── */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.on { opacity: 1; transform: none; }

/* ─── VÍDEOS (carrossel 3D) ─── */
.c3d-wrap { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 540px; perspective: 1200px; }
.c3d-item { position: absolute; width: 250px; aspect-ratio: 9 / 16; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #000; cursor: pointer; will-change: transform, opacity; transition: transform .6s var(--ease), opacity .6s var(--ease), filter .6s var(--ease); }
.c3d-item.active { z-index: 30; transform: none; opacity: 1; border-color: rgba(var(--tint), .4); box-shadow: 0 20px 50px rgba(0, 0, 0, .35); }
.c3d-item.right { z-index: 20; transform: translate3d(120px, 0, -150px) rotateY(-15deg) scale(.85); opacity: .4; filter: blur(1px) brightness(.6); }
.c3d-item.left { z-index: 20; transform: translate3d(-120px, 0, -150px) rotateY(15deg) scale(.85); opacity: .4; filter: blur(1px) brightness(.6); }
.c3d-item:not(.active) .video-play-overlay, .c3d-item:not(.active) .c3d-overlay, .c3d-item:not(.active) .vc-action-btns, .c3d-item:not(.active) .vc-inline-cta { pointer-events: none; }
.c3d-item video { width: 100%; height: 100%; object-fit: cover; cursor: pointer; }
.c3d-overlay { position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column; justify-content: flex-end; padding: 18px; background: linear-gradient(to top, rgba(11, 12, 14, .85) 0%, transparent 60%); pointer-events: none; transition: opacity .3s var(--ease); }
.c3d-overlay p:first-child { color: #f2f2ef; font-size: 16px; font-weight: 500; letter-spacing: -.03em; line-height: 1.2; }
.c3d-overlay p:last-child { margin-top: 4px; color: #a2a4ab; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.c3d-item.active:not(.paused) .c3d-overlay { opacity: 0; }
.c3d-item.active:not(.paused):hover .c3d-overlay { opacity: 1; }
@media (max-width: 480px) {
    .c3d-wrap { height: 520px; }
    .c3d-item { width: 240px; }
    .c3d-item.right { transform: translate3d(100px, 0, -120px) rotateY(-12deg) scale(.8); }
    .c3d-item.left { transform: translate3d(-100px, 0, -120px) rotateY(12deg) scale(.8); }
}
@media (max-width: 360px) {
    .c3d-wrap { height: 480px; }
    .c3d-item { width: 210px; }
    .c3d-item.right { transform: translate3d(85px, 0, -100px) rotateY(-10deg) scale(.75); }
    .c3d-item.left { transform: translate3d(-85px, 0, -100px) rotateY(10deg) scale(.75); }
}
.video-play-overlay { position: absolute; inset: 0; z-index: 10; display: flex; align-items: center; justify-content: center; background: rgba(11, 12, 14, .4); opacity: 0; pointer-events: none; transition: opacity .3s var(--ease); }
.c3d-item:hover .video-play-overlay, .c3d-item.paused .video-play-overlay { opacity: 1; pointer-events: auto; }
.video-play-btn { width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #f2f2ef; color: #0b0c0e; font-size: 16px; padding-left: 2px; transition: transform .25s var(--ease); }
.video-play-btn:hover { transform: scale(1.08); }
.vc-action-btns { position: absolute; top: 10px; right: 10px; z-index: 25; display: flex; gap: 6px; }
.vc-btn-sound, .vc-btn-expand { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 7px; background: rgba(11, 12, 14, .7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border: 1px solid #3a3c42; color: #f2f2ef; font-size: 12px; transition: background .25s var(--ease), color .25s var(--ease); }
.vc-btn-sound.active { background: #f2f2ef; border-color: #f2f2ef; color: #0b0c0e; }
.vc-inline-cta { position: absolute; left: 0; right: 0; bottom: 52px; z-index: 20; display: flex; justify-content: center; padding: 0 12px; pointer-events: none; }
.vc-cta-btn { pointer-events: auto; display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 10px 16px; background: #f2f2ef; color: #0b0c0e; border-radius: 7px; font-size: 11px; font-weight: 700; white-space: nowrap; box-shadow: 0 6px 24px rgba(0, 0, 0, .5); }
@keyframes fadeInCta { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.v-dot { width: 22px; height: 3px; padding: 0; border: 0; border-radius: 99px; background: rgba(var(--tint), .22); cursor: pointer; transition: width .3s var(--ease), background .3s var(--ease); }
.v-dot.on { width: 34px; background: var(--fg); }
.dots { display: flex; justify-content: center; gap: 6px; margin-top: 18px; }

/* ─── DIFERENCIAIS ─── */
.facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fact { padding: 20px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.fact i { margin-bottom: 18px; font-size: 18px; display: block; }
.fact p { font-size: 14px; font-weight: 500; letter-spacing: -.025em; line-height: 1.35; }

/* ─── SERVIÇOS (lista numerada, como no site) ─── */
.svc { border-bottom: 1px solid var(--line); }
.svc__row { display: flex; align-items: flex-start; gap: 18px; width: 100%; padding: 26px 4px; text-align: left; border-top: 1px solid var(--line); }
.svc__n { flex: none; margin-top: 8px; font-size: 10px; color: var(--muted); }
.svc__body { flex: 1; min-width: 0; }
.svc__title { display: block; font-size: 24px; font-weight: 500; letter-spacing: -.04em; line-height: 1.15; }
.svc__desc { display: block; margin-top: 10px; max-width: 34ch; font-size: 12px; line-height: 1.7; color: var(--muted); }
.svc__go { flex: none; margin-top: 4px; font-size: 16px; color: var(--muted); }
.svc__row--soft .svc__title { font-size: 17px; color: var(--muted); }

/* ─── AVALIAÇÕES (painel claro, como no site) ─── */
.reviews { margin: 76px -16px 0; padding: 76px 0 70px; background: var(--rv-bg); color: var(--rv-ink); }
.reviews .idx { color: var(--rv-mute); }
.reviews__head { padding: 0 20px; }
.reviews__title { font-size: clamp(28px, 7.8vw, 34px); font-weight: 500; letter-spacing: -.055em; line-height: 1.15; }
.reviews__score { display: flex; align-items: center; gap: 22px; margin: 34px 0 0; }
.reviews__score strong { font-size: 76px; font-weight: 500; letter-spacing: -.075em; line-height: 1; }
.reviews__score span { display: flex; flex-direction: column; gap: 8px; font-size: 11px; line-height: 1.5; color: var(--rv-mute); }
.reviews__score .reviews__stars { color: var(--rv-gold); font-size: 13px; letter-spacing: 3px; }
.rv { display: flex; gap: 14px; margin-top: 38px; padding: 0 20px 6px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.rv::-webkit-scrollbar { display: none; }
.review-card { flex: 0 0 82%; scroll-snap-align: start; display: flex; flex-direction: column; gap: 16px; padding: 2px 0 2px 20px; border-left: 1px solid var(--rv-line); }
.review-user { display: flex; align-items: center; gap: 12px; }
.review-avatar { width: 38px; height: 38px; flex: none; display: grid; place-items: center; background: var(--rv-av); border: 1px solid var(--rv-line); border-radius: 50%; font-size: 11px; }
.review-user-info h4 { font-size: 13px; font-weight: 700; }
.review-stars { color: var(--rv-gold); font-size: 11px; display: flex; gap: 2px; }
.review-text { font-size: 14px; line-height: 1.7; letter-spacing: -.01em; }
.reviews__foot { display: flex; align-items: center; justify-content: space-between; margin-top: 34px; padding: 0 20px; font-size: 11px; color: var(--rv-mute); }
.reviews__foot .text-link { color: var(--rv-ink); border-color: var(--rv-line); }

/* ─── FAIXA DE CLIENTES ─── */
.logos { margin: 0 -16px; padding: 30px 0; background: #0b0c0e; border-block: 1px solid #292c31; }
body:not(.dark) .logos { background: var(--surface-2); border-color: var(--line); }
.logos__label { padding: 0 20px; font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #a2a4ab; }
body:not(.dark) .logos__label { color: var(--muted); }
.logos__viewport { display: flex; margin-top: 22px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 40px, #000 calc(100% - 40px), transparent); mask-image: linear-gradient(90deg, transparent, #000 40px, #000 calc(100% - 40px), transparent); }
.logos__track { display: flex; flex: none; align-items: center; gap: 44px; padding-right: 44px; animation: brand-scroll 46s linear infinite; }
.logos__track img { width: auto; height: 30px; opacity: .5; filter: grayscale(1); }
body:not(.dark) .logos__track img { filter: brightness(0); opacity: .45; }
@keyframes brand-scroll { to { transform: translateX(-100%); } }

/* ─── SOBRE ─── */
.about { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.about__photo { position: relative; aspect-ratio: 4 / 4.4; background: #e6e5e0; }
.about__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; }
.about__photo::after { content: ""; position: absolute; inset: auto 0 0; height: 16%; background: linear-gradient(to top, var(--surface), transparent); }
.about__body { position: relative; z-index: 1; padding: 26px 22px 8px; }
.about__body > p { margin-top: 22px; font-size: 13px; line-height: 1.85; color: var(--muted); }
.about__body strong { font-weight: 600; color: var(--fg); }
.about__list { margin-top: 26px; border-top: 1px solid var(--line); }
.about__list li { display: flex; justify-content: space-between; gap: 16px; padding: 15px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.about__list li span:first-child { color: var(--muted); }
.about__list li span:last-child { font-weight: 600; text-align: right; }

/* ─── GALERIA ─── */
.gal-marquee { overflow: hidden; margin: 0 -16px; -webkit-mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%); }
.gal-track { display: flex; width: max-content; gap: 10px; animation: gal-scroll-right 34s linear infinite !important; }
.gal-marquee:hover .gal-track { animation-play-state: paused; }
.gal-slide { flex: none; width: 200px; aspect-ratio: 3 / 4; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; cursor: pointer; }
.gal-slide img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
@keyframes gal-scroll-right { from { transform: translateX(-50%); } to { transform: translateX(0); } }
.mgal-backdrop { position: fixed; inset: 0; z-index: 5000; display: none; align-items: flex-start; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .9); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); overflow-y: auto; }
.mgal-backdrop.open { display: flex; }
.mgal-box { display: flex; flex-direction: column; width: 100%; max-width: 480px; margin: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.mgal-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--line); flex: none; }
.mgal-header h2 { font-size: 20px; font-weight: 500; letter-spacing: -.04em; line-height: 1.2; }
.mgal-header p { margin-top: 4px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.mgal-close, .srv-modal-close { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 7px; font-size: 13px; cursor: pointer; transition: border-color .25s var(--ease); }
.mgal-body { max-height: 72vh; padding: 18px; overflow-y: auto; }
.mgal-body > div:first-child { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mgal-item { aspect-ratio: 9 / 16; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; cursor: pointer; }
.mgal-item img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.mgal-cta { margin-top: 20px; }

/* ─── LOCALIZAÇÃO ─── */
.place { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.place__map { height: 230px; border-bottom: 1px solid var(--line); background: var(--surface-2); }
.place__map iframe { width: 100%; height: 100%; border: 0; }
body.dark .place__map iframe { filter: invert(.92) hue-rotate(180deg) grayscale(.55) contrast(.92); }
.place__body { padding: 24px 22px 8px; }
.place__body h3 { font-size: 24px; font-weight: 500; letter-spacing: -.04em; line-height: 1.15; }
.place__tag { margin-top: 6px; font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.place__addr { margin-top: 18px; font-size: 13px; line-height: 1.8; color: var(--muted); }
.place__hours { margin-top: 22px; border-top: 1px solid var(--line); }
.place__hours li { display: flex; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.place__hours li span:first-child { color: var(--muted); }
.place__hours li span:last-child { font-weight: 600; }
.place__go { padding: 18px 22px 22px; }

/* ─── CTA FINAL ─── */
.cta { padding: 36px 24px 26px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.cta h3 { font-size: 31px; font-weight: 500; letter-spacing: -.055em; line-height: 1.12; }
.cta p { margin: 18px 0 28px; font-size: 13px; line-height: 1.75; color: var(--muted); }

/* ─── RODAPÉ ─── */
.foot { margin-top: 76px; padding: 40px 24px 28px; border-top: 1px solid var(--line); text-align: center; }
.foot__mark { width: 52px; height: 52px; margin: 0 auto 24px; object-fit: contain; }
body:not(.dark) .foot__mark { filter: invert(1); }
.foot__social { display: flex; justify-content: center; gap: 10px; margin-bottom: 26px; }
.foot__social a { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 7px; font-size: 15px; color: var(--muted); transition: color .25s var(--ease), border-color .25s var(--ease); }
.foot p { font-size: 10px; line-height: 1.8; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.foot a.by { display: inline-block; margin-top: 12px; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.foot a.by strong { color: var(--fg); font-weight: 700; }
.ticker-wrap { overflow: hidden; padding: 12px 0; border-top: 1px solid var(--line); }
.ticker-inner { display: inline-flex; align-items: center; gap: 22px; white-space: nowrap; font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); animation: ticker 60s linear infinite; }
.t-sep { opacity: .5; }
@keyframes ticker { to { transform: translateX(-50%); } }
.greeting { padding: 22px 0 30px; text-align: center; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }

/* ─── MODAIS ─── */
.srv-modal-backdrop { position: fixed; inset: 0; z-index: 2000; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(0, 0, 0, .82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.srv-modal-box { position: relative; width: 100%; max-width: 440px; max-height: 90vh; overflow-y: auto; padding: 28px 22px 24px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; animation: modal-in .35s var(--ease); }
@keyframes modal-in { from { transform: scale(.97); opacity: 0; } to { transform: none; opacity: 1; } }
.srv-modal-close { position: absolute; top: 14px; right: 14px; background: var(--surface); }
.srv-modal-title { padding-right: 44px; font-size: 26px; font-weight: 500; letter-spacing: -.045em; line-height: 1.15; }
.srv-modal-desc { margin-top: 14px; font-size: 13px; line-height: 1.75; color: var(--muted); }
.srv-modal-list { margin: 24px 0; border-top: 1px solid var(--line); }
.srv-modal-item { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.srv-modal-item i { flex: none; font-size: 10px; color: var(--muted); }
.srv-modal-cta { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 15px 22px; background: var(--fg); color: var(--bg); border-radius: 7px; font-size: 13px; font-weight: 700; transition: transform .2s var(--ease); }
.srv-modal-cta:active { transform: scale(.985); }
.modal { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .94); }
.modal.open { display: flex; animation: fadeIn .35s var(--ease) forwards; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.modal-close-btn, .vc-modal-close { position: fixed; top: 16px; right: 16px; z-index: 10001; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background: #121417; border: 1px solid #292c31; border-radius: 7px; color: #f2f2ef; font-size: 14px; }
.modal-img { max-width: 95vw; max-height: 88vh; object-fit: contain; border-radius: 12px; }
.vc-modal { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; background: rgba(0, 0, 0, .95); }
.vc-modal.open { display: flex; animation: fadeIn .35s var(--ease) forwards; }
.vc-modal video { max-width: 95vw; max-height: 85vh; border-radius: 12px; outline: none; }

/* ─── WHATSAPP (balão como no site) ─── */
.wa-premium-container { position: fixed; right: 20px; bottom: 22px; z-index: 2000; }
.wa-bubble { position: absolute; right: 0; bottom: 70px; width: 290px; max-width: calc(100vw - 40px); padding: 0; background: #15171b; color: #f2f2ef; border: 1px solid #2c2f35; border-radius: 16px; box-shadow: 0 18px 50px -12px #000000b3, 0 2px 8px #0006; opacity: 0; visibility: hidden; transform: translateY(10px) scale(.985); transition: opacity .5s var(--ease), transform .5s var(--ease), visibility 0s linear .5s; }
.wa-bubble.show { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.wa-bubble::before { content: ""; position: absolute; right: 19px; bottom: -9px; width: 18px; height: 18px; background: #15171b; border-right: 1px solid #2c2f35; border-bottom: 1px solid #2c2f35; transform: rotate(45deg); border-bottom-right-radius: 3px; }
.wa-header { display: flex; align-items: center; gap: 10px; padding: 14px 44px 14px 16px; background: linear-gradient(180deg, #1c1f24, #17191e); border-bottom: 1px solid #2c2f35; border-radius: 15px 15px 0 0; margin: 0; }
.wa-avatar-wrapper { position: relative; flex: none; width: 36px; height: 36px; }
.wa-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; border: 1px solid #3f434b; }
.wa-status-dot { position: absolute; right: -1px; bottom: -1px; width: 9px; height: 9px; background: #25d366; border: 2px solid #1c1f24; border-radius: 50%; }
.wa-name { font-size: 12px; font-weight: 600; letter-spacing: -.01em; color: #f2f2ef; }
.wa-content { padding: 0; }
.wa-typing { display: flex; gap: 4px; padding: 16px 17px; }
.wa-typing span { width: 5px; height: 5px; background: #8b8e95; border-radius: 50%; opacity: .4; animation: wa-dots 1.4s infinite; }
.wa-typing span:nth-child(2) { animation-delay: .2s; }
.wa-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes wa-dots { 0%, 100% { transform: translateY(0); opacity: .4; } 50% { transform: translateY(-4px); opacity: 1; } }
.wa-message-text { padding: 16px 17px 18px; }
.wa-message-text p { font-size: 13.5px; line-height: 1.6; letter-spacing: -.01em; color: #e8e8e4; }
.wa-message-text strong { font-weight: 700; }
.wa-close { position: absolute; top: 12px; right: 10px; z-index: 2; width: 28px; height: 28px; font-size: 14px; color: #6f727a; border-radius: 50%; transition: color .25s var(--ease); }
.wa-close:hover { color: #f2f2ef; }
.wa-float-btn { position: relative; width: 55px; height: 55px; display: grid; place-items: center; background: #25d366; color: #102d1b !important; border-radius: 50%; font-size: 28px; box-shadow: 0 7px 28px #0005; opacity: 0; visibility: hidden; transform: translateY(16px) scale(.85); transition: opacity .6s var(--ease), transform .6s var(--ease), visibility 0s linear .6s; }
.wa-float-btn.visible { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.wa-badge { position: absolute; top: -2px; right: -2px; width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; background: #ff3b30; color: #fff; border: 2px solid #0b0c0e; border-radius: 50%; font-size: 10px; font-weight: 700; opacity: 0; transform: scale(0); transition: opacity .4s var(--ease), transform .4s var(--ease); }
.wa-badge.show { opacity: 1; transform: scale(1); }

/* ─── HOVER (só mouse) ─── */
@media (hover: hover) and (pointer: fine) {
    .link:hover, .goal:hover, .quick a:hover, .quick button:hover, .mgal-close:hover, .srv-modal-close:hover, .foot__social a:hover { border-color: var(--fg); }
    .link--primary:hover { opacity: .9; }
    .btn:hover, .srv-modal-cta:hover { opacity: .9; }
    .svc__row:hover .svc__title { color: var(--fg); }
    .svc__row--soft:hover .svc__title { color: var(--fg); }
    .gal-slide:hover img { transform: scale(1.05); }
    .foot__social a:hover { color: var(--fg); }
}

/* ─── MOVIMENTO REDUZIDO ─── */
@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
    .br-map__route { opacity: .7 !important; animation: none !important; }
    .br-map__dot { opacity: .95 !important; animation: none !important; }
    .br-map__pulse { animation: none !important; }
    .hero__cta::after { animation: none !important; }
    .cz-card.cz-wait { opacity: 1; transform: none; }
    .cz-card.cz-vis, .cz-card.cz-vis .cz-avatar { animation: none !important; }
    .hero__copy > *, .cz-msg, .cz-chip, .cz-cardmini, .cz-inputrow, .cz-online { animation: none !important; }
    .gal-track, .ticker-inner, .logos__track { animation: none !important; }
    .preloader-content, .preloader-brand, .preloader-tagline, .preloader-progress, .preloader-bar span, .preloader-dot, .preloader-ring-progress { animation: none !important; }
    .preloader-content, .preloader-brand, .preloader-tagline, .preloader-progress { opacity: 1; transform: none; }
    .preloader-ring-progress { stroke-dashoffset: 0; }
}

/* ─── FORMULÁRIO-FILTRO (igual ao do site, antes do WhatsApp) ─── */
.qz { position: fixed; inset: 0; z-index: 6000; display: grid; place-items: center; padding: 16px; }
.qz[hidden] { display: none; }
.qz__backdrop { position: absolute; inset: 0; background: rgba(5, 6, 7, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.qz__panel { position: relative; width: min(100%, 440px); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 30px 22px 24px; background: var(--surface); border: 1px solid var(--line); border-radius: 13px; animation: qz-in .4s var(--ease); }
@keyframes qz-in { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }
.qz__close { position: absolute; top: 10px; right: 12px; width: 36px; height: 36px; border-radius: 50%; font-size: 24px; line-height: 1; color: var(--muted); transition: color .25s var(--ease); }
.qz__bar { height: 2px; margin-bottom: 18px; background: var(--line); border-radius: 2px; overflow: hidden; }
.qz__bar i { display: block; height: 100%; width: 20%; background: var(--fg); border-radius: 2px; transition: width .45s var(--ease); }
.qz__step { margin-bottom: 24px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.qz__slide h2 { font-size: clamp(22px, 6.4vw, 26px); font-weight: 500; letter-spacing: -.04em; line-height: 1.2; }
.qz__sub { margin-top: 10px; font-size: 12px; line-height: 1.7; color: var(--muted); }
.qz__slide input { width: 100%; margin-top: 22px; padding: 14px 4px; font: 400 16px/1.5 var(--font); color: var(--fg); background: none; border: 0; border-bottom: 1px solid rgba(var(--tint), .3); border-radius: 0; transition: border-color .25s var(--ease); }
.qz__slide input::placeholder { color: var(--muted); opacity: .7; }
.qz__slide input:focus { outline: none; border-bottom-color: var(--fg); }
.qz__opts { display: flex; flex-direction: column; gap: 9px; margin-top: 22px; }
.qz__opt { padding: 13px 16px; text-align: left; font-size: 13px; color: var(--fg); background: var(--surface-2); border: 1px solid var(--line); border-radius: 8px; transition: border-color .25s var(--ease), background .25s var(--ease); }
.qz__opt.is-on { border-color: var(--fg); background: rgba(var(--tint), .1); }
.qz__actions { display: flex; flex-direction: column-reverse; align-items: stretch; gap: 10px; margin-top: 28px; }
.qz__next { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 26px; font-size: 13px; font-weight: 700; color: var(--bg); background: var(--fg); border-radius: 7px; transition: opacity .25s var(--ease), transform .2s var(--ease); }
.qz__next:active { transform: scale(.985); }
.qz__next i { font-size: 12px; }
.qz__back { padding: 8px 0; text-align: center; font-size: 12px; color: var(--muted); }
.qz__err { margin-top: 14px; font-size: 11px; color: #e0a0a0; }
body:not(.dark) .qz__err { color: #b3402f; }
body:not(.dark) .qz__backdrop { background: rgba(24, 25, 27, .5); }
@media (hover: hover) and (pointer: fine) {
    .qz__close:hover, .qz__back:hover { color: var(--fg); }
    .qz__opt:hover { border-color: rgba(var(--tint), .5); }
    .qz__next:hover { opacity: .9; }
}
@media (prefers-reduced-motion: reduce) { .qz__panel { animation: none; } .qz__bar i { transition: none; } }