/* DentaVista — dc-hero widget styles */
.dv-hero { background: #fff; padding: 0; overflow: clip; }
                .dv-hero__inner {
                    max-width: none; margin: 0; padding: 0;
                    display: grid; grid-template-columns: 1fr 1fr; align-items: stretch;
                    min-height: clamp(640px, 88vh, 880px);
                }

                /* ---- Left copy ---- */
                .dv-hero__copy {
                    display: flex; flex-direction: column; justify-content: center;
                    padding: clamp(120px, 13vw, 150px) clamp(28px, 4vw, 60px) clamp(48px, 6vw, 72px)
                             max(24px, calc((92vw - var(--dv-maxw)) / 2));
                }
                .dv-hero__eyebrow { color: var(--dv-teal-600); margin-bottom: 18px; }
                .dv-hero__title {
                    font-family: var(--dv-font-head); font-weight: 800; letter-spacing: -.02em;
                    line-height: 1.04; color: var(--dv-navy); margin: 0;
                    font-size: clamp(2.4rem, 4.6vw, 4.1rem);
                }
                .dv-hero__title .dv-grad { color: var(--dv-teal-600); }

                .dv-hero__cares {
                    list-style: none; margin: clamp(28px, 4vw, 46px) 0 0; padding: 0;
                    display: flex; gap: clamp(18px, 2.5vw, 38px); flex-wrap: wrap;
                }
                .dv-hero__care { flex: 1 1 130px; min-width: 124px; padding-top: 16px; border-top: 2px solid var(--dv-line); }
                .dv-hero__care-num { font-family: var(--dv-font-head); font-weight: 800; font-size: 15px; color: var(--dv-teal-600); }
                .dv-hero__care-title { font-size: 15px; font-weight: 700; color: var(--dv-navy); margin: 6px 0 10px; line-height: 1.25; }
                .dv-hero__care-link {
                    display: inline-flex; align-items: center; gap: 7px;
                    font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
                    color: var(--dv-muted); text-decoration: none; transition: color .2s ease, gap .2s ease;
                }
                .dv-hero__care-link svg { width: 14px; height: 14px; transition: transform .25s ease; }
                .dv-hero__care-link:hover { color: var(--dv-teal-600); gap: 11px; }

                .dv-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: clamp(28px, 4vw, 40px); }

                /* ---- Google reviews (compact, rotating) ---- */
                .dv-hero__reviews { margin-top: clamp(26px, 3.4vw, 36px); padding-top: 22px; border-top: 1px solid var(--dv-line); max-width: 460px; }
                .dv-hero__rev-head { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
                .dv-hero__rev-glogo { width: 22px; height: 22px; flex: none; display: inline-flex; }
                .dv-hero__rev-glogo svg { width: 100%; height: 100%; }
                .dv-hero__rev-stars { display: inline-flex; gap: 1px; color: #ffb020; }
                .dv-hero__rev-stars svg { width: 15px; height: 15px; }
                .dv-hero__rev-score { font-size: 13px; color: var(--dv-muted); }
                .dv-hero__rev-score strong { color: var(--dv-navy); font-weight: 800; font-size: 14.5px; }
                .dv-hero__rev-rotator { position: relative; min-height: 96px; }
                .dv-hero__rev-item {
                    position: absolute; inset: 0; margin: 0; opacity: 0; transform: translateY(10px);
                    transition: opacity .55s ease, transform .55s var(--dv-ease); pointer-events: none;
                }
                .dv-hero__rev-item.is-on { opacity: 1; transform: none; pointer-events: auto; }
                .dv-hero__rev-item p {
                    margin: 0 0 8px; font-size: 14px; line-height: 1.55; color: var(--dv-ink);
                    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
                }
                .dv-hero__rev-item cite { font-style: normal; font-size: 12.5px; font-weight: 700; color: var(--dv-navy); }
                .dv-hero__rev-item cite span { color: var(--dv-muted); font-weight: 500; }
                @media (max-width: 980px) { .dv-hero__reviews { max-width: 100%; } }

                /* ---- Right visual: blue mosaic + media ---- */
                .dv-hero__visual { position: relative; overflow: hidden; background: var(--dv-teal-600); min-height: clamp(800px, 72vh, 880px); }
                .dv-hero__media { position: absolute; inset: 0; z-index: 1; }
                .dv-hero__media img, .dv-hero__media video { width: 100%; height: 100%; object-fit: cover; display: block; }

                .dv-hero__mosaic { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
                .dv-hero__sq { position: absolute; display: block; }
                .dv-hero__sq--1 { top: 0; left: 0; width: 26%; height: 22%; background: rgba(63,160,206,.55); }
                .dv-hero__sq--2 { top: 22%; left: 0; width: 14%; height: 16%; background: rgba(255,255,255,.18); }
                .dv-hero__sq--3 { bottom: 0; left: 8%; width: 18%; height: 24%; background: rgba(31,42,51,.16); }
                .dv-hero__sq--4 { bottom: 0; left: 0; width: 8%; height: 16%; background: rgba(91,182,223,.6); }
                .dv-hero__sq--5 { top: 0; right: 0; width: 16%; height: 14%; background: rgba(255,255,255,.14); }

                .dv-hero__sound {
                    position: absolute; z-index: 3; bottom: 18px; right: 18px;
                    width: 46px; height: 46px; border: 0; border-radius: 50%; cursor: pointer;
                    background: rgba(255,255,255,.92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
                    color: var(--dv-navy); display: flex; align-items: center; justify-content: center;
                    box-shadow: var(--dv-shadow);
                    transition: background .2s ease, color .2s ease, transform .25s var(--dv-spring);
                }
                .dv-hero__sound:hover { background: var(--dv-teal-600); color: #fff; transform: translateY(-2px); }
                .dv-hero__sound:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(63,160,206,.55); }
                .dv-hero__sound svg { width: 21px; height: 21px; }
                .dv-hero__sound .dv-hero__sound-on { display: none; }
                .dv-hero__sound.is-on .dv-hero__sound-on { display: block; }
                .dv-hero__sound.is-on .dv-hero__sound-off { display: none; }

                /* ---- Scroll cue ---- */
                .dv-hero__scroll {
                    position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 4;
                    display: inline-flex; flex-direction: column; align-items: center; gap: 6px;
                    background: none; border: 0; padding: 6px; cursor: pointer;
                }
                .dv-hero__scroll-ic {
                    width: 42px; height: 42px; border-radius: 50%;
                    display: flex; align-items: center; justify-content: center;
                    background: #fff; border: 1px solid var(--dv-line); color: var(--dv-teal-600);
                    box-shadow: var(--dv-shadow-sm); animation: dvScrollBob 2s ease-in-out infinite;
                }
                .dv-hero__scroll-ic svg { width: 22px; height: 22px; }
                .dv-hero__scroll-arrow { width: 16px; height: 16px; color: var(--dv-teal-600); animation: dvScrollArrow 2s ease-in-out infinite; }
                .dv-hero__scroll:focus-visible { outline: none; border-radius: 14px; box-shadow: 0 0 0 3px rgba(63,160,206,.55); }
                @keyframes dvScrollBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
                @keyframes dvScrollArrow { 0%,100% { transform: translateY(-2px); opacity: .45; } 50% { transform: translateY(3px); opacity: 1; } }

                @media (max-width: 980px) {
                    .dv-hero__inner { grid-template-columns: 1fr; min-height: 0; }
                    .dv-hero__copy { padding: clamp(110px, 22vw, 140px) clamp(20px, 6vw, 40px) 40px; }
                    .dv-hero__visual { min-height: 460px; }
                    .dv-hero__scroll { display: none; }
                }
                @media (max-width: 520px) {
                    .dv-hero__actions .dv-btn { flex: 1 1 100%; }
                    .dv-hero__care { flex-basis: 100%; }
                }
                @media (prefers-reduced-motion: reduce) {
                    .dv-hero__scroll-ic, .dv-hero__scroll-arrow { animation: none; }
                }