/* BIVACO HOME SERVICES - extracted from Blade */

/* =====================================================
               CẤU HÌNH FONT RIÊNG CỦA KHỐI DỊCH VỤ
               Muốn đổi font: chỉ sửa --bvc-services-font.
               ===================================================== */
            body.agency-theme .bvc-services-v2 {
                --bvc-services-font: var(--bivaco-font-family, "Bai Jamjuree", sans-serif);
                --bvc-services-primary: var(--color-3, #08a9e8);
                --bvc-services-text: #13243a;
                --bvc-services-muted: #61738a;
                --bvc-services-border: #dce8f2;
                --bvc-services-card-bg: #ffffff;
                position: relative;
                isolation: isolate;
                overflow: hidden;
                padding: 58px 0 64px;
                background: linear-gradient(180deg, #f5fbff 0%, #ffffff 72%);
                font-family: var(--bvc-services-font) !important;
            }

            body.agency-theme .bvc-services-v2,
            body.agency-theme .bvc-services-v2 *:not(.material-icons):not(.material-icons-outlined):not(.material-symbols-outlined):not(.material-symbols-rounded) {
                box-sizing: border-box;
                font-family: var(--bvc-services-font) !important;
            }

            body.agency-theme .bvc-services-v2__container {
                position: relative;
                z-index: 2;
                width: min(1180px, calc(100% - 40px));
                margin: 0 auto;
            }

            body.agency-theme .bvc-services-v2__dots {
                position: absolute;
                top: 122px;
                left: max(0px, calc(50% - 680px));
                z-index: 1;
                width: 145px;
                height: 145px;
                opacity: .65;
                pointer-events: none;
                background-image: radial-gradient(circle, rgba(8, 169, 232, .32) 3px, transparent 3.5px);
                background-size: 32px 32px;
            }

            body.agency-theme .bvc-services-v2__header {
                max-width: 820px;
                margin: 0 auto 42px;
                text-align: center;
            }

            body.agency-theme .bvc-services-v2__eyebrow {
                margin: 0 !important;
                padding: 0 !important;
                color: var(--bvc-services-primary) !important;
                font-size: 27px !important;
                font-weight: 700 !important;
                line-height: 1.25 !important;
                letter-spacing: -.02em !important;
                text-align: center !important;
            }

            body.agency-theme .bvc-services-v2__title {
                margin: 10px 0 0 !important;
                padding: 0 !important;
                color: #111827 !important;
                font-size: 19px !important;
                font-weight: 500 !important;
                line-height: 1.4 !important;
                letter-spacing: 0 !important;
                text-align: center !important;
            }

            body.agency-theme .bvc-services-v2__line {
                display: block;
                width: 100px;
                height: 2px;
                margin: 12px auto 0;
                border: 0;
                border-radius: 999px;
                background: var(--bvc-services-primary);
            }

            body.agency-theme .bvc-services-v2__description {
                max-width: 760px;
                margin: 10px auto 0 !important;
                padding: 0 !important;
                color: #111827 !important;
                font-size: 20px !important;
                font-weight: 500 !important;
                line-height: 1.4 !important;
                letter-spacing: 0 !important;
                text-align: center !important;
            }

            body.agency-theme .bvc-services-v2__desktop-layout {
                display: grid;
                grid-template-columns: minmax(0, 1fr) minmax(260px, 32%) minmax(0, 1fr);
                align-items: center;
                gap: 78px;
            }

            body.agency-theme .bvc-services-v2__column {
                display: grid;
                gap: 20px;
            }

            body.agency-theme .bvc-services-v2__card {
                --bvc-services-shift-x: 0px;
                display: grid;
                grid-template-columns: 78px minmax(0, 1fr);
                align-items: center;
                gap: 18px;
                min-height: 154px;
                padding: 24px;
                border: 1px solid var(--bvc-services-border);
                border-radius: 18px;
                background: var(--bvc-services-card-bg);
                box-shadow: 0 12px 35px rgba(18, 67, 98, .08);
                color: var(--bvc-services-text);
                text-decoration: none !important;
                transform: translateX(var(--bvc-services-shift-x));
                will-change: transform;
                transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
            }

            /*
             * Desktop: card 1 và 3 tiến vào ảnh giữa, card 2 lùi lại.
             * Hai cột dùng giá trị đối xứng để bố cục cân bằng.
             */
            @media (min-width: 992px) {
                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(1),
                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(3) {
                    --bvc-services-shift-x: 60px;
                }

                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(2) {
                    --bvc-services-shift-x: 0px;
                }

                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(1),
                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(3) {
                    --bvc-services-shift-x: -60px;
                }

                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(2) {
                    --bvc-services-shift-x: 0px;
                }
            }

            body.agency-theme .bvc-services-v2__icon {
                display: grid;
                place-items: center;
                width: 72px;
                height: 72px;
                padding: 8px;
                border-radius: 16px;
                background: #f2fbff;
                color: var(--bvc-services-primary);
                transition: transform .25s ease, background .25s ease;
            }

            body.agency-theme .bvc-services-v2__icon img {
                display: block;
                width: 100%;
                height: 100%;
                object-fit: contain;
            }

            body.agency-theme .bvc-services-v2__icon .material-icons-outlined,
            body.agency-theme .bvc-services-v2__icon .material-symbols-outlined,
            body.agency-theme .bvc-services-v2__icon .material-symbols-rounded {
                font-size: 42px !important;
                line-height: 1 !important;
            }

            body.agency-theme .bvc-services-v2__fallback-icon {
                font-size: 34px !important;
                line-height: 1 !important;
            }

            body.agency-theme .bvc-services-v2__card-title {
                display: block;
                margin: 0 !important;
                padding: 0 !important;
                color: var(--bvc-services-primary) !important;
                font-size: 17px !important;
                font-weight: 700 !important;
                line-height: 1.4 !important;
                letter-spacing: 0 !important;
                transition: color .25s ease;
            }

            body.agency-theme .bvc-services-v2__card-description {
                display: block;
                margin: 8px 0 0 !important;
                padding: 0 !important;
                color: var(--bvc-services-muted) !important;
                font-size: 14px !important;
                font-weight: 400 !important;
                line-height: 1.65 !important;
                letter-spacing: 0 !important;
                transition: color .25s ease;
            }

            body.agency-theme .bvc-services-v2__media {
                position: relative;
                isolation: isolate;
                display: flex;
                align-items: center;
                justify-content: center;
                min-height: 380px;
                padding: 22px;
                overflow: visible;
            }

            /* Quầng sáng chuyển động nhẹ phía sau ảnh trung tâm. */
            body.agency-theme .bvc-services-v2__media::before {
                content: "";
                position: absolute;
                z-index: 0;
                width: min(88%, 390px);
                aspect-ratio: 1;
                border-radius: 50%;
                background: radial-gradient(
                    circle,
                    rgba(8, 169, 232, .24) 0%,
                    rgba(70, 201, 236, .13) 42%,
                    rgba(8, 169, 232, 0) 72%
                );
                filter: blur(7px);
                pointer-events: none;
                animation: bvcServicesGlow 4.8s ease-in-out infinite;
            }

            /* Vòng công nghệ xoay chậm, tạo chiều sâu nhưng không gây rối mắt. */
            body.agency-theme .bvc-services-v2__media::after {
                content: "";
                position: absolute;
                z-index: 1;
                width: min(82%, 360px);
                aspect-ratio: 1;
                border: 1px dashed rgba(8, 169, 232, .30);
                border-radius: 50%;
                pointer-events: none;
                animation: bvcServicesOrbit 18s linear infinite;
            }

            body.agency-theme .bvc-services-v2__info {
                display: block;
                min-width: 0;
            }

            body.agency-theme .bvc-services-v2__media img {
                position: relative;
                z-index: 2;
                display: block;
                width: 100%;
                max-width: 410px;
                max-height: 440px;
                object-fit: contain;
                filter: drop-shadow(0 24px 34px rgba(18, 67, 98, .15));
                transform-origin: 50% 55%;
                will-change: transform;
                animation: bvcServicesFloat 5.2s ease-in-out infinite;
            }

            @keyframes bvcServicesFloat {
                0%, 100% {
                    transform: translate3d(0, 0, 0) scale(1);
                }
                50% {
                    transform: translate3d(0, -12px, 0) scale(1.015);
                }
            }

            @keyframes bvcServicesGlow {
                0%, 100% {
                    opacity: .48;
                    transform: scale(.94);
                }
                50% {
                    opacity: .82;
                    transform: scale(1.06);
                }
            }

            @keyframes bvcServicesOrbit {
                from {
                    transform: rotate(0deg);
                }
                to {
                    transform: rotate(360deg);
                }
            }

            body.agency-theme .bvc-services-v2__mobile-list {
                display: none;
            }

            @media (hover: hover) and (pointer: fine) {
                body.agency-theme .bvc-services-v2__card:hover,
                body.agency-theme .bvc-services-v2__card:focus-visible {
                    transform: translateX(var(--bvc-services-shift-x)) translateY(-5px);
                    border-color: var(--bvc-services-primary);
                    background: linear-gradient(135deg, #08a9e8 0%, #21b9e9 54%, #49caec 100%);
                    box-shadow: 0 18px 38px rgba(0, 112, 174, .22);
                    outline: none;
                }

                body.agency-theme .bvc-services-v2__card:hover .bvc-services-v2__card-title,
                body.agency-theme .bvc-services-v2__card:hover .bvc-services-v2__card-description,
                body.agency-theme .bvc-services-v2__card:focus-visible .bvc-services-v2__card-title,
                body.agency-theme .bvc-services-v2__card:focus-visible .bvc-services-v2__card-description {
                    color: #ffffff !important;
                }

                body.agency-theme .bvc-services-v2__card:hover .bvc-services-v2__icon,
                body.agency-theme .bvc-services-v2__card:focus-visible .bvc-services-v2__icon {
                    transform: scale(1.04);
                    background: #ffffff;
                }
            }

            /* =====================================================
               TABLET / FOLD 576–991
               GIỮ BỐ CỤC GIỐNG DESKTOP:
               3 card trái + ảnh giữa + 3 card phải.
               Card 1/3 và card 2 vẫn thò/thụt đối xứng.
               ===================================================== */
            @media (min-width: 576px) and (max-width: 991.98px) {
                body.agency-theme .bvc-services-v2 {
                    padding: 46px 0 52px;
                }

                body.agency-theme .bvc-services-v2__container {
                    width: calc(100% - 24px);
                    max-width: 960px;
                }

                body.agency-theme .bvc-services-v2__header {
                    max-width: 720px;
                    margin-bottom: 30px;
                }

                body.agency-theme .bvc-services-v2__eyebrow {
                    font-size: 27px !important;
                }

                body.agency-theme .bvc-services-v2__title {
                    font-size: 19px !important;
                    line-height: 1.42 !important;
                }

                body.agency-theme .bvc-services-v2__description {
                    font-size: 14px !important;
                    line-height: 1.4 !important;
                }

                body.agency-theme .bvc-services-v2__desktop-layout {
                    display: grid;
                    grid-template-columns:
                        minmax(0, 1fr)
                        minmax(120px, 22%)
                        minmax(0, 1fr);
                    align-items: center;
                    gap: 14px;
                }

                body.agency-theme .bvc-services-v2__column {
                    gap: 14px;
                    min-width: 0;
                }

                body.agency-theme .bvc-services-v2__card {
                    grid-template-columns: 52px minmax(0, 1fr);
                    gap: 10px;
                    min-height: 116px;
                    padding: 14px 12px;
                    border-radius: 14px;
                }

                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(1),
                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(3) {
                    --bvc-services-shift-x: 20px;
                }

                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(2) {
                    --bvc-services-shift-x: 0px;
                }

                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(1),
                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(3) {
                    --bvc-services-shift-x: -20px;
                }

                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(2) {
                    --bvc-services-shift-x: 0px;
                }

                body.agency-theme .bvc-services-v2__icon {
                    width: 48px;
                    height: 48px;
                    padding: 6px;
                    border-radius: 12px;
                }

                body.agency-theme .bvc-services-v2__icon .material-icons-outlined,
                body.agency-theme .bvc-services-v2__icon .material-symbols-outlined,
                body.agency-theme .bvc-services-v2__icon .material-symbols-rounded {
                    font-size: 30px !important;
                }

                body.agency-theme .bvc-services-v2__card-title {
                    font-size: 14px !important;
                    line-height: 1.3 !important;
                }

                body.agency-theme .bvc-services-v2__card-description {
                    margin-top: 4px !important;
                    font-size: 11.5px !important;
                    line-height: 1.45 !important;
                }

                body.agency-theme .bvc-services-v2__media {
                    grid-column: auto;
                    grid-row: auto;
                    min-height: 230px;
                    padding: 8px;
                    overflow: visible;
                }

                body.agency-theme .bvc-services-v2__media img {
                    max-width: 230px;
                    max-height: 280px;
                }

                body.agency-theme .bvc-services-v2__media::before {
                    width: min(92%, 240px);
                }

                body.agency-theme .bvc-services-v2__media::after {
                    width: min(86%, 220px);
                }

                body.agency-theme .bvc-services-v2__mobile-list {
                    display: none;
                }
            }

            /* Tablet nhỏ / Fold hẹp: vẫn giữ 3 vùng, chỉ giảm kích thước. */
            @media (min-width: 576px) and (max-width: 699.98px) {
                body.agency-theme .bvc-services-v2__desktop-layout {
                    grid-template-columns:
                        minmax(0, 1fr)
                        minmax(92px, 18%)
                        minmax(0, 1fr);
                    gap: 8px;
                }

                body.agency-theme .bvc-services-v2__card {
                    grid-template-columns: 42px minmax(0, 1fr);
                    min-height: 104px;
                    padding: 10px 9px;
                    gap: 8px;
                }

                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(1),
                body.agency-theme .bvc-services-v2__column:first-child .bvc-services-v2__card:nth-child(3) {
                    --bvc-services-shift-x: 10px;
                }

                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(1),
                body.agency-theme .bvc-services-v2__column:last-child .bvc-services-v2__card:nth-child(3) {
                    --bvc-services-shift-x: -10px;
                }

                body.agency-theme .bvc-services-v2__icon {
                    width: 40px;
                    height: 40px;
                }

                body.agency-theme .bvc-services-v2__card-title {
                    font-size: 13px !important;
                }

                body.agency-theme .bvc-services-v2__card-description {
                    font-size: 10.5px !important;
                    line-height: 1.4 !important;
                }

                body.agency-theme .bvc-services-v2__media {
                    min-height: 190px;
                }

                body.agency-theme .bvc-services-v2__media img {
                    max-width: 160px;
                    max-height: 220px;
                }
            }

            /* =====================================================
               MOBILE <=575
               Chỉ điện thoại mới chuyển sang slider ngang.
               Slider nằm gọn trong container, không kéo tràn trang.
               ===================================================== */
            @media (max-width: 575.98px) {
                body.agency-theme .bvc-services-v2 {
                    padding: 36px 0 40px;
                }

                body.agency-theme .bvc-services-v2__container {
                    width: calc(100% - 24px);
                    max-width: 100%;
                    overflow: hidden;
                }

                body.agency-theme .bvc-services-v2__dots {
                    display: none;
                }

                body.agency-theme .bvc-services-v2__header {
                    margin-bottom: 24px;
                }

                body.agency-theme .bvc-services-v2__eyebrow {
                    font-size: 21px !important;
                }

                body.agency-theme .bvc-services-v2__title {
                    margin-top: 8px !important;
                    font-size: 16px !important;
                    line-height: 1.4 !important;
                }

                body.agency-theme .bvc-services-v2__description {
                    max-width: 340px;
                    margin-top: 10px !important;
                    font-size: 15px !important;
                    line-height: 1.45 !important;
                }

                body.agency-theme .bvc-services-v2__line {
                    width: 46px;
                    height: 2px;
                    margin-top: 10px;
                }

                body.agency-theme .bvc-services-v2__desktop-layout {
                    display: none;
                }

                body.agency-theme .bvc-services-v2__mobile-list {
                    display: flex;
                    gap: 10px;
                    width: 100%;
                    max-width: 100%;
                    margin: 0;
                    padding: 4px 0 16px;
                    overflow-x: auto;
                    overflow-y: hidden;
                    overscroll-behavior-inline: contain;
                    scroll-snap-type: x mandatory;
                    scroll-padding-inline: 0;
                    scrollbar-width: none;
                    -webkit-overflow-scrolling: touch;
                }

                body.agency-theme .bvc-services-v2__mobile-list::-webkit-scrollbar {
                    display: none;
                }

                body.agency-theme .bvc-services-v2__mobile-list .bvc-services-v2__card {
                    flex: 0 0 100%;
                    width: 100%;
                    max-width: 100%;
                    grid-template-columns: 56px minmax(0, 1fr);
                    gap: 12px;
                    min-width: 0;
                    min-height: 132px;
                    padding: 16px;
                    border-radius: 14px;
                    transform: none;
                    scroll-snap-align: start;
                    scroll-snap-stop: always;
                }

                body.agency-theme .bvc-services-v2__mobile-list .bvc-services-v2__icon {
                    width: 52px;
                    height: 52px;
                    padding: 6px;
                    border-radius: 12px;
                }

                body.agency-theme .bvc-services-v2__card-title {
                    font-size: 15px !important;
                    line-height: 1.35 !important;
                }

                body.agency-theme .bvc-services-v2__card-description {
                    margin-top: 5px !important;
                    font-size: 13px !important;
                    line-height: 1.5 !important;
                }
            }

            /* Touch: đổi màu TOÀN BỘ card. */
            @media (hover: none), (pointer: coarse) {
                body.agency-theme .bvc-services-v2__card:active,
                body.agency-theme .bvc-services-v2__card:focus {
                    border-color: var(--bvc-services-primary);
                    background: linear-gradient(135deg, #08a9e8 0%, #21b9e9 54%, #49caec 100%);
                    box-shadow: 0 16px 34px rgba(0, 112, 174, .20);
                    outline: none;
                }

                body.agency-theme .bvc-services-v2__card:active .bvc-services-v2__card-title,
                body.agency-theme .bvc-services-v2__card:active .bvc-services-v2__card-description,
                body.agency-theme .bvc-services-v2__card:focus .bvc-services-v2__card-title,
                body.agency-theme .bvc-services-v2__card:focus .bvc-services-v2__card-description {
                    color: #ffffff !important;
                }

                body.agency-theme .bvc-services-v2__card:active .bvc-services-v2__icon,
                body.agency-theme .bvc-services-v2__card:focus .bvc-services-v2__icon {
                    background: #ffffff;
                    transform: scale(1.03);
                }
            }

            @media (prefers-reduced-motion: reduce) {
                body.agency-theme .bvc-services-v2__card,
                body.agency-theme .bvc-services-v2__icon {
                    transition: none;
                }

                body.agency-theme .bvc-services-v2__media img,
                body.agency-theme .bvc-services-v2__media::before,
                body.agency-theme .bvc-services-v2__media::after {
                    animation: none !important;
                }
            }


            /* =====================================================
               BIVACO RESPONSIVE SERVICE LIST — FINAL 2026-09-17
               - <=1024: dùng danh sách đầy đủ, không slider.
               - 600..1024: 2 dịch vụ / hàng (tablet + Fold mở).
               - <=599: 1 dịch vụ / hàng.
               - Header: tiêu đề chính -> tiêu đề phụ -> đường kẻ -> mô tả.
               ===================================================== */
            @media (max-width: 1024px) {
                body.agency-theme .bvc-services-v2 {
                    padding: 40px 0 46px !important;
                }
                body.agency-theme .bvc-services-v2__container {
                    width: min(100% - 28px, 960px) !important;
                    max-width: none !important;
                    overflow: visible !important;
                }
                body.agency-theme .bvc-services-v2__desktop-layout {
                    display: none !important;
                }
                body.agency-theme .bvc-services-v2__mobile-list {
                    display: grid !important;
                    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
                    gap: 14px !important;
                    width: 100% !important;
                    max-width: 100% !important;
                    margin: 0 !important;
                    padding: 0 !important;
                    overflow: visible !important;
                    scroll-snap-type: none !important;
                }
                body.agency-theme .bvc-services-v2__mobile-list .bvc-services-v2__card {
                    width: 100% !important;
                    max-width: none !important;
                    min-width: 0 !important;
                    min-height: 118px !important;
                    padding: 15px 14px !important;
                    grid-template-columns: 52px minmax(0, 1fr) !important;
                    gap: 12px !important;
                    border-radius: 14px !important;
                    transform: none !important;
                    scroll-snap-align: none !important;
                }
                body.agency-theme .bvc-services-v2__mobile-list .bvc-services-v2__icon {
                    width: 48px !important;
                    height: 48px !important;
                }
                body.agency-theme .bvc-services-v2__header {
                    display: flex !important;
                    flex-direction: column !important;
                    align-items: center !important;
                    margin-bottom: 26px !important;
                }
                body.agency-theme .bvc-services-v2__eyebrow {
                    order: 1 !important;
                    font-size: 20px !important;
                    line-height: 1.25 !important;
                    font-weight: 700 !important;
                }
                body.agency-theme .bvc-services-v2__title {
                    order: 2 !important;
                    max-width: 720px !important;
                    margin: 7px auto 0 !important;
                    font-size: 15px !important;
                    line-height: 1.42 !important;
                    font-weight: 500 !important;
                    color: #111827 !important;
                }
                body.agency-theme .bvc-services-v2__line {
                    order: 3 !important;
                    width: 58px !important;
                    height: 2px !important;
                    margin: 11px auto 0 !important;
                }
                body.agency-theme .bvc-services-v2__description {
                    order: 4 !important;
                    max-width: 720px !important;
                    margin: 10px auto 0 !important;
                    font-size: 13px !important;
                    line-height: 1.5 !important;
                    color: #536174 !important;
                }
            }

            @media (max-width: 599.98px) {
                body.agency-theme .bvc-services-v2__container {
                    width: calc(100% - 24px) !important;
                }
                body.agency-theme .bvc-services-v2__mobile-list {
                    grid-template-columns: 1fr !important;
                    gap: 10px !important;
                }
                body.agency-theme .bvc-services-v2__mobile-list .bvc-services-v2__card {
                    min-height: 112px !important;
                    padding: 14px !important;
                    grid-template-columns: 50px minmax(0, 1fr) !important;
                }
                body.agency-theme .bvc-services-v2__mobile-list .bvc-services-v2__icon {
                    width: 46px !important;
                    height: 46px !important;
                }
            }