/* BIIX · overlay da VITRINE (Odontologia V7.2). Carregado SO quando data.ui.vitrine === true; tudo sob .v-ui; o site.css do Master nao e alterado. So transform/opacity em movimento; respeita prefers-reduced-motion. */
.v-ui{--v-ice:#edf5ff;--v-wa:#25a244;--v-wa-d:#1c8a38}

/* ---------- cabecalho: botao de agendar ao lado do menu (mobile/tablet) ---------- */
@media(max-width:850px){
 .v-ui .btn-header{display:inline-flex!important;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:0;margin-left:auto;border-radius:12px;gap:0}
 .v-ui .btn-header span,.v-ui .btn-header .arrow-icon{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
 .v-ui .btn-header .ic{width:22px;height:22px}
 .v-ui .mobile-toggle{margin-left:0}
}

/* ---------- hero mobile: foto -> degrade azul-claro -> texto ---------- */
@media(max-width:640px){
 .v-ui .hero{background:var(--v-ice)}
 .v-ui .hero .hero-picture{-webkit-mask-image:linear-gradient(to bottom,#000 46%,transparent);mask-image:linear-gradient(to bottom,#000 46%,transparent)}
 .v-ui .hero .hero-inner{margin-top:-56px;padding:0 0 28px}
 .v-ui .hero .eyebrow{display:block;margin-bottom:8px}
 .v-ui .hero h1{font-size:clamp(38px,11.6vw,50px);line-height:1.03;max-width:9.6em;margin-bottom:12px}
 .v-ui .hero p{font-size:15px;line-height:1.5;max-width:30em;margin-bottom:18px}
 .v-ui .hero-actions .btn{min-height:50px;font-size:15px}
 .v-ui .hero-advantages{margin-top:20px}
}

/* ---------- especialidades: carrossel horizontal (todas as larguras) ---------- */
.v-ui .service-grid,.v-ui .service-grid.featured-grid{display:flex!important;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;padding:4px 2px 10px;margin:0}
.v-ui .service-grid::-webkit-scrollbar{display:none}
.v-ui .service-grid .service-card,.v-ui .service-grid .service-optional{display:block!important;flex:0 0 calc((100% - 12px)/2);min-width:0;scroll-snap-align:start}
@media(min-width:641px) and (max-width:1000px){.v-ui .service-grid .service-card,.v-ui .service-grid .service-optional{flex-basis:calc((100% - 24px)/3)}}
@media(min-width:1001px){.v-ui .service-grid .service-card,.v-ui .service-grid .service-optional{flex-basis:calc((100% - 36px)/4)}}
.v-ui .service-grid:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:12px}
.v-ui .v-car{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.v-ui .v-car-btn{flex:0 0 auto;width:44px;height:44px;border-radius:50%;border:1px solid var(--stroke);background:var(--surface);color:var(--accent-2);display:grid;place-items:center;cursor:pointer;padding:0}
.v-ui .v-car-btn .ic{width:20px;height:20px}.v-ui .v-car-btn.prev .ic{transform:rotate(180deg)}
.v-ui .v-car-btn[disabled]{opacity:.35;cursor:default}
.v-ui .v-car-mid{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.v-ui .v-pos{font-size:12px;font-weight:700;color:var(--accent-2)}
.v-ui .v-dots{display:flex;gap:8px}
.v-ui .v-dot{width:8px;height:8px;border-radius:6px;background:#c3d3ea;border:0;padding:0;cursor:pointer;transition:width .2s,background .2s}
.v-ui .v-dot[aria-current="true"]{width:22px;background:var(--accent)}
.v-ui .show-all-services{white-space:normal}

/* ---------- informacoes: sem icones de contato repetidos; icone do coracao corrigido ---------- */
.v-ui .highlight-row{display:none}
.v-ui .trust-symbol,.v-ui .trust-symbol svg{overflow:visible}

/* ---------- WhatsApp: contato e botao flutuante ---------- */
.v-ui .v-wa-item a{color:inherit;font-weight:800;text-decoration:none}.v-ui .v-wa-item .ic{color:var(--v-wa)}
.v-ui .v-wa-cta{background:var(--v-wa)!important;border-color:var(--v-wa)!important;color:#fff!important}.v-ui .v-wa-cta:hover{background:var(--v-wa-d)!important}
.v-ui .v-wa-fab{position:fixed;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:60;width:58px;height:58px;border-radius:50%;background:var(--v-wa);color:#fff;display:grid;place-items:center;box-shadow:0 8px 22px rgba(18,120,52,.38);transition:opacity .2s,transform .2s}
.v-ui .v-wa-fab svg{width:30px;height:30px;fill:currentColor}
.v-ui .v-wa-fab.is-hidden{opacity:0;pointer-events:none;transform:translateY(8px)}
.v-ui.has-fab .footer-bottom{padding-bottom:84px}

/* ---------- rodape: logo, navegacao, contato e redes ---------- */
.v-ui .v-social{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.v-ui .v-social a,.v-ui .v-social .v-social-off{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);color:inherit}
.v-ui .v-social .v-social-off{cursor:default;pointer-events:none;user-select:none}
.v-ui .v-social svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.v-ui .v-footer-wa{display:inline-flex;align-items:center;gap:8px;font-weight:800}
@media(max-width:640px){
 .v-ui .footer-grid{grid-template-columns:1fr 1fr;gap:26px 18px}
 .v-ui .footer-grid>div:first-child{grid-column:1/-1}
 .v-ui .footer-grid>div:nth-child(3){display:none}
 .v-ui .footer-grid>div:last-child{grid-column:1/-1}
}

@media(prefers-reduced-motion:reduce){.v-ui .service-grid,.v-ui .service-grid.featured-grid{scroll-behavior:auto}.v-ui .v-wa-fab,.v-ui .v-dot{transition:none}}
