/* Extracted from index.php */

:root {
            --green: #197b16;
            --green-2: #0f5f13;
            --green-3: #eaf5e9;
            --ink: #10141c;
            --muted: #596171;
            --line: #dfe5de;
            --soft: #f6f8f4;
            --white: #ffffff;
            --shadow: 0 16px 40px rgba(16, 20, 28, .12);
            --radius: 8px;
        }

        * {
            box-sizing: border-box;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            margin: 0;
            color: var(--ink);
            background: #fff;
            font-family: Arial, Helvetica, sans-serif;
            line-height: 1.45;
        }

        a {
            color: inherit;
            text-decoration: none;
        }

        img {
            max-width: 100%;
            display: block;
        }

        .site-shell {
            width: min(1140px, calc(100% - 48px));
            margin: 0 auto;
        }

        .top-nav {
            position: sticky;
            top: 0;
            z-index: 50;
            background: rgba(255, 255, 255, .96);
            border-bottom: 1px solid rgba(21, 86, 24, .1);
            box-shadow: 0 4px 24px rgba(15, 95, 19, .06);
        }

        .nav-inner {
            height: 86px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 28px;
        }

        .brand {
            display: flex;
            align-items: center;
            gap: 12px;
            min-width: 260px;
        }

        .brand-mark {
            width: 48px;
            height: 58px;
            flex: 0 0 auto;
        }

        .brand-name {
            display: block;
            font-size: 29px;
            font-weight: 800;
            letter-spacing: 0;
            line-height: 1;
        }

        .brand-name span {
            color: var(--green);
        }

        .brand-tag {
            display: block;
            margin-top: 5px;
            color: #303640;
            font-size: 12px;
            font-weight: 600;
        }

        .main-menu {
            display: flex;
            align-items: center;
            gap: 34px;
            font-size: 15px;
            font-weight: 700;
        }

        .main-menu a {
            padding: 31px 0 25px;
            border-bottom: 2px solid transparent;
        }

        .main-menu a.active,
        .main-menu a:hover {
            color: var(--green);
            border-bottom-color: var(--green);
        }

        .menu-toggle {
            display: none !important;
        }

        .call-button {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 14px 19px;
            color: #fff;
            background: linear-gradient(135deg, var(--green), var(--green-2));
            border-radius: 8px;
            box-shadow: 0 9px 18px rgba(25, 123, 22, .23);
            font-size: 15px;
            font-weight: 800;
            white-space: nowrap;
        }

        .hero {
            position: relative;
            overflow: hidden;
            min-height: 555px;
            background:
                linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.78) 43%, rgba(255,255,255,.25) 76%),
                linear-gradient(0deg, rgba(16,20,28,.12), rgba(16,20,28,.04)),
                url('/images/background/onedrop-hero-road.jpg') center / cover no-repeat;
        }

        .hero::after {
            content: "";
            position: absolute;
            inset: auto 0 0;
            height: 165px;
            background: linear-gradient(0deg, rgba(0,0,0,.34), transparent);
            pointer-events: none;
        }

        .hero-grid {
            position: relative;
            z-index: 2;
            display: grid;
            grid-template-columns: 1.12fr .88fr;
            gap: 58px;
            padding: 34px 0 24px;
            align-items: start;
        }

        .hero-copy {
            position: relative;
            min-height: 460px;
            padding-top: 8px;
        }

        .trust-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 355px;
            height: 31px;
            padding: 0 22px;
            color: #182019;
            background: rgba(255,255,255,.9);
            border: 1px solid rgba(25, 123, 22, .14);
            border-radius: 999px;
            font-size: 14px;
            font-weight: 700;
        }

        .hero h1 {
            margin: 11px 0 10px;
            max-width: 575px;
            font-size: 66px;
            line-height: .98;
            font-weight: 900;
            letter-spacing: 0;
        }

        .hero h1 span {
            color: var(--green);
            display: block;
        }

        .hero-sub {
            margin: 0 0 26px;
            font-size: 20px;
            color: #111722;
        }

        .hero-stats {
            display: grid;
            grid-template-columns: repeat(3, max-content);
            gap: 26px;
            align-items: center;
        }

        .hero-stat {
            display: grid;
            grid-template-columns: 42px 1fr;
            gap: 12px;
            align-items: center;
            min-width: 130px;
        }

        .hero-stat + .hero-stat {
            padding-left: 20px;
            border-left: 1px solid rgba(25, 123, 22, .22);
        }

        .hero-stat strong {
            display: block;
            font-size: 20px;
            line-height: 1;
        }

        .hero-stat span {
            display: block;
            margin-top: 4px;
            font-size: 13px;
        }

        .round-icon {
            width: 42px;
            height: 42px;
            display: inline-grid;
            place-items: center;
            color: var(--green);
            background: rgba(255,255,255,.9);
            border: 1px solid rgba(25, 123, 22, .2);
            border-radius: 50%;
        }

        .hero-car {
            position: absolute;
            left: 120px;
            bottom: 12px;
            z-index: 3;
            width: min(520px, 83vw);
            filter: drop-shadow(0 24px 22px rgba(16,20,28,.22));
        }

        .live-strip {
            position: absolute;
            left: 0;
            bottom: 10px;
            z-index: 4;
            display: flex;
            align-items: center;
            gap: 18px;
            width: min(535px, 95%);
            padding: 10px 16px;
            background: rgba(255,255,255,.95);
            border: 1px solid rgba(25, 123, 22, .12);
            border-radius: 8px;
            box-shadow: 0 9px 26px rgba(16, 20, 28, .16);
            font-size: 12px;
            white-space: nowrap;
        }

        .avatar-stack {
            display: flex;
            align-items: center;
        }

        .avatar-stack img {
            width: 28px;
            height: 28px;
            margin-left: -7px;
            border-radius: 50%;
            border: 2px solid #fff;
            object-fit: cover;
        }

        .avatar-stack img:first-child {
            margin-left: 0;
        }

        .booking-card {
            justify-self: end;
            width: min(430px, 100%);
            padding: 25px 27px 22px;
            background: rgba(255,255,255,.96);
            border: 1px solid rgba(25, 123, 22, .11);
            border-radius: 16px;
            box-shadow: var(--shadow);
            backdrop-filter: blur(8px);
        }

        .booking-card h2 {
            margin: 0 0 8px;
            text-align: center;
            font-size: 24px;
            line-height: 1.15;
        }

        .booking-card h2 span {
            color: var(--green);
        }

        .form-grid {
            display: grid;
            gap: 11px;
        }

        .field label,
        .trip-label {
            display: block;
            margin-bottom: 5px;
            font-size: 13px;
            font-weight: 800;
        }

        .control,
        .date-control {
            width: 100%;
            height: 39px;
            padding: 0 13px;
            color: #222a35;
            background: #fff;
            border: 1px solid #ccd4cf;
            border-radius: 6px;
            font-size: 13px;
            font-family: inherit;
        }

        .location-wrap {
            position: relative;
        }

        .location-wrap .control {
            padding-right: 42px;
        }

        .locate-btn {
            position: absolute;
            top: 50%;
            right: 10px;
            transform: translateY(-50%);
            width: 24px;
            height: 24px;
            border: 0;
            background: transparent;
            color: #152017;
            cursor: pointer;
        }

        .radio-row,
        .date-row,
        .mini-benefits {
            display: flex;
            align-items: center;
            gap: 14px;
            flex-wrap: wrap;
        }

        .radio-row label {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            font-size: 13px;
            cursor: pointer;
        }

        .radio-row input {
            width: 17px;
            height: 17px;
            accent-color: var(--green);
        }

        .round-trip-days {
            display: none;
        }

        .round-trip-days.is-visible {
            display: block;
        }

        .round-trip-days select {
            cursor: pointer;
        }

        .date-row .date-control {
            flex: 1 1 175px;
        }

        .quick-date {
            height: 38px;
            padding: 0 18px;
            border: 1px solid rgba(25, 123, 22, .22);
            border-radius: 6px;
            background: #fff;
            color: #111;
            font-weight: 800;
            cursor: pointer;
        }

        .quick-date.active {
            color: #fff;
            background: var(--green);
        }

        .primary-cta {
            width: 100%;
            height: 43px;
            border: 0;
            border-radius: 6px;
            color: #fff;
            background: linear-gradient(135deg, var(--green), var(--green-2));
            box-shadow: 0 9px 20px rgba(25, 123, 22, .25);
            font-size: 15px;
            font-weight: 900;
            cursor: pointer;
        }

        .fare-pill {
            display: flex;
            justify-content: center;
            align-items: baseline;
            gap: 6px;
            height: 42px;
            border-radius: 6px;
            background: linear-gradient(90deg, #f2f7f1, #e8f4e7);
            color: #161b22;
            font-weight: 800;
        }

        .fare-pill strong {
            color: var(--green);
            font-size: 22px;
        }

        .mini-benefits {
            justify-content: space-between;
            margin-top: 13px;
            font-size: 12px;
            color: #263026;
        }

        .mini-benefits span {
            display: inline-flex;
            gap: 6px;
            align-items: center;
        }

        section {
            padding: 24px 0;
        }

        .section-title {
            margin: 0 0 18px;
            text-align: center;
            font-size: 22px;
            line-height: 1.2;
        }

        .section-title span {
            color: var(--green);
        }

        .section-title::after {
            content: "";
            display: block;
            width: 34px;
            height: 2px;
            margin: 7px auto 0;
            background: var(--green);
        }

        .services-grid,
        .tariff-grid {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 24px;
        }

        .service-card,
        .tariff-card,
        .panel {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            box-shadow: 0 7px 24px rgba(25, 55, 28, .06);
        }

        .service-card {
            min-height: 190px;
            padding: 17px 14px 18px;
            text-align: center;
        }

        .service-art {
            height: 78px;
            display: grid;
            place-items: center;
            margin-bottom: 8px;
        }

        .service-art img {
            max-height: 72px;
            margin: 0 auto;
            object-fit: contain;
        }

        .service-card h3,
        .tariff-card h3 {
            margin: 0 0 7px;
            font-size: 17px;
        }

        .service-card p,
        .tariff-card p {
            margin: 0;
            color: #1c2633;
            font-size: 13px;
        }

        .why {
            background: linear-gradient(180deg, #fff, #f9fbf7);
        }

        .why-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 18px 34px;
        }

        .why-item {
            display: grid;
            grid-template-columns: 48px 1fr;
            gap: 13px;
            align-items: center;
            min-height: 54px;
        }

        .why-item + .why-item {
            border-left: 1px solid rgba(25, 123, 22, .13);
            padding-left: 16px;
        }

        .why-item strong {
            display: block;
            font-size: 14px;
        }

        .tariff {
            background: #fbfcfa;
            padding-top: 10px;
        }

        .tariff-heading {
            margin: 0 0 14px;
            text-align: center;
            font-size: 21px;
        }

        .tariff-heading span {
            color: var(--green);
        }

        .tariff-card {
            padding: 13px 12px 12px;
            text-align: center;
        }

        .tariff-card img {
            height: 56px;
            margin: 2px auto 6px;
            object-fit: contain;
        }

        .price {
            margin: 4px 0 7px;
            color: var(--green);
            font-size: 23px;
            font-weight: 900;
            line-height: 1;
        }

        .price small {
            color: #1c242d;
            font-size: 13px;
            font-weight: 800;
        }

        .trip-badge {
            display: inline-flex;
            justify-content: center;
            align-items: center;
            min-width: 142px;
            height: 28px;
            color: var(--green);
            border: 1px solid var(--green);
            border-radius: 5px;
            font-size: 13px;
            font-weight: 900;
        }

        .trip-badge.fill {
            color: #fff;
            background: var(--green);
        }

        .tariff-note {
            margin: 10px 0 8px 10px;
            font-size: 12px;
            color: #28312c;
        }

        .center-action {
            text-align: center;
        }

        .outline-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 200px;
            height: 33px;
            padding: 0 24px;
            color: var(--green);
            border: 1px solid var(--green);
            border-radius: 6px;
            background: #fff;
            font-size: 13px;
            font-weight: 900;
        }

        .info-grid {
            display: grid;
            grid-template-columns: .95fr .95fr 1.35fr;
            gap: 28px;
            align-items: stretch;
        }

        .panel {
            padding: 17px 20px;
            min-height: 238px;
            overflow: hidden;
        }

        .panel h2 {
            margin: 0 0 12px;
            font-size: 20px;
            line-height: 1.15;
        }

        .panel h2 span {
            color: var(--green);
        }

        .route-list {
            display: grid;
            gap: 0;
            font-size: 12px;
        }

        .route-row {
            display: grid;
            grid-template-columns: 1fr 18px 1fr auto;
            gap: 8px;
            align-items: center;
            padding: 10px 0;
            border-bottom: 1px solid #e8eee7;
        }

        .route-row b {
            color: var(--green);
            font-size: 12px;
        }

        .view-link {
            display: inline-flex;
            margin-top: 11px;
            color: var(--green);
            font-size: 13px;
            font-weight: 900;
        }

        .about-panel {
            border: 0;
            box-shadow: none;
        }

        .about-panel p {
            margin: 0 0 13px;
            font-size: 13px;
        }

        .about-stats {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 10px;
            margin-top: 16px;
            text-align: center;
        }

        .about-stats .round-icon {
            width: 34px;
            height: 34px;
            margin: 0 auto 6px;
        }

        .about-stats strong {
            display: block;
            color: #182018;
            font-size: 14px;
        }

        .about-stats span {
            display: block;
            font-size: 9px;
        }

        .reviews-panel {
            position: relative;
            background: linear-gradient(135deg, #f7fbf5, #eef6eb);
        }

        .review-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 12px;
        }

        .quote {
            padding: 14px 14px 10px;
            background: rgba(255,255,255,.84);
            border: 1px solid #e5ece2;
            border-radius: 6px;
            font-size: 11px;
        }

        .quote-mark {
            color: var(--green);
            font-size: 28px;
            line-height: 0;
            font-weight: 900;
        }

        .quote strong {
            display: block;
            margin-top: 10px;
            font-size: 11px;
        }

        .stars {
            margin-top: 5px;
            color: #f8b400;
            letter-spacing: 1px;
            text-align: right;
        }

        .faq {
            padding-top: 0;
        }

        .faq h2 {
            margin: 0 0 12px;
            text-align: center;
            font-size: 20px;
        }

        .faq-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 12px 26px;
        }

        details {
            border: 1px solid #dbe3dd;
            border-radius: 5px;
            background: #fff;
        }

        summary {
            display: flex;
            justify-content: space-between;
            align-items: center;
            min-height: 38px;
            padding: 0 14px;
            list-style: none;
            cursor: pointer;
            font-size: 13px;
            font-weight: 800;
        }

        summary::-webkit-details-marker {
            display: none;
        }

        summary::after {
            content: "\2304";
            color: #1a2b20;
            font-size: 16px;
        }

        details[open] summary::after {
            transform: rotate(180deg);
        }

        details p {
            margin: 0;
            padding: 0 14px 13px;
            color: var(--muted);
            font-size: 12px;
        }

        .site-footer {
            color: #fff;
            background:
                radial-gradient(circle at 12% 12%, rgba(57, 155, 50, .22), transparent 34%),
                linear-gradient(135deg, #09200f, #0e3018 58%, #06190c);
        }

        .footer-grid {
            display: grid;
            grid-template-columns: 1.2fr .8fr .9fr 1fr 1fr;
            gap: 34px;
            padding: 32px 0 25px;
        }

        .footer-brand {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 9px;
        }

        .footer-brand .brand-name {
            color: #fff;
            font-size: 23px;
        }

        .footer-brand .brand-mark {
            width: 40px;
            height: 48px;
        }

        .footer h3 {
            margin: 0 0 10px;
            font-size: 15px;
        }

        .footer p,
        .footer a,
        .footer li {
            color: rgba(255,255,255,.88);
            font-size: 13px;
        }

        .footer ul {
            display: grid;
            gap: 4px;
            padding: 0;
            margin: 0;
            list-style: none;
        }

        .social-row {
            display: flex;
            gap: 12px;
            margin-top: 16px;
        }

        .social-row a {
            width: 28px;
            height: 28px;
            display: grid;
            place-items: center;
            border: 1px solid rgba(255,255,255,.45);
            border-radius: 50%;
            font-size: 12px;
            font-weight: 900;
        }

        .store-button {
            display: flex;
            align-items: center;
            gap: 10px;
            width: 145px;
            min-height: 42px;
            margin-bottom: 9px;
            padding: 7px 10px;
            border: 1px solid rgba(255,255,255,.55);
            border-radius: 6px;
            background: #050806;
            color: #fff;
        }

        .store-button small {
            display: block;
            font-size: 8px;
            line-height: 1;
        }

        .store-button strong {
            display: block;
            font-size: 14px;
            line-height: 1.1;
        }

        .copyright {
            padding: 10px 0;
            text-align: center;
            color: rgba(255,255,255,.82);
            background: var(--green);
            font-size: 12px;
        }

        .icon-svg {
            width: 22px;
            height: 22px;
            fill: none;
            stroke: currentColor;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .text-green {
            color: var(--green);
        }

        .solid-svg {
            fill: currentColor;
            stroke: none;
        }

        @media (max-width: 1000px) {
            .site-shell {
                width: min(94%, 760px);
            }

            .nav-inner {
                height: auto;
                padding: 16px 0;
                flex-wrap: wrap;
            }

            .main-menu {
                order: 3;
                width: 100%;
                justify-content: center;
                gap: 22px;
            }

            .main-menu a {
                padding: 8px 0;
            }

            .hero-grid,
            .info-grid,
            .footer-grid {
                grid-template-columns: 1fr;
            }

            .booking-card {
                justify-self: stretch;
            }

            .hero-copy {
                min-height: 430px;
            }

            .hero-car {
                left: 40px;
            }

            .services-grid,
            .tariff-grid,
            .why-grid,
            .faq-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width: 620px) {
            .site-shell {
                width: calc(100% - 28px);
            }

            .brand {
                min-width: 0;
            }

            .brand-name {
                font-size: 22px;
            }

            .brand-tag {
                font-size: 10px;
            }

            .call-button {
                width: 100%;
                justify-content: center;
            }

            .main-menu {
                gap: 12px;
                overflow-x: auto;
                justify-content: flex-start;
                padding-bottom: 4px;
            }

            .hero h1 {
                font-size: 44px;
            }

            .trust-pill {
                min-width: 0;
                width: 100%;
                font-size: 12px;
            }

            .hero-stats,
            .services-grid,
            .tariff-grid,
            .why-grid,
            .faq-grid,
            .review-grid,
            .about-stats {
                grid-template-columns: 1fr;
            }

            .hero-stat + .hero-stat,
            .why-item + .why-item {
                border-left: 0;
                padding-left: 0;
            }

            .hero-copy {
                min-height: 390px;
            }

            .hero-car {
                left: 0;
                bottom: 42px;
                width: 100%;
            }

            .live-strip {
                position: relative;
                margin-top: 250px;
                white-space: normal;
                bottom: auto;
            }
        }

        /* Responsive polish for the rebuilt homepage. */
        @media (max-width: 1180px) {
            .nav-inner {
                gap: 18px;
            }

            .brand {
                min-width: 220px;
            }

            .main-menu {
                gap: 22px;
            }

            .hero-grid {
                gap: 34px;
            }

            .hero h1 {
                font-size: 58px;
            }

            .hero-car {
                left: 70px;
                width: min(475px, 78vw);
            }
        }

        @media (max-width: 1000px) {
            .booking-card {
                justify-self: center;
                width: min(560px, 100%);
            }

            .hero h1 {
                font-size: 54px;
            }

            .hero-stats {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 14px;
            }

            .hero-stat {
                min-width: 0;
            }

            .hero-stat + .hero-stat {
                padding-left: 14px;
            }
        }

        @media (max-width: 620px) {
            .top-nav {
                position: relative;
            }

            .nav-inner {
                gap: 12px;
                padding: 13px 0;
            }

            .main-menu a {
                white-space: nowrap;
            }

            .hero {
                min-height: auto;
                background:
                    linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.72) 52%, rgba(255,255,255,.28) 100%),
                    linear-gradient(0deg, rgba(16,20,28,.12), rgba(16,20,28,.04)),
                    url('/images/background/onedrop-hero-road.jpg') center top / cover no-repeat;
            }

            .hero::after {
                height: 95px;
            }

            .hero-grid {
                gap: 18px;
                padding: 20px 0 24px;
            }

            .hero-copy {
                min-height: auto;
                padding-top: 0;
            }

            .hero h1 {
                margin-top: 12px;
                font-size: 42px;
                line-height: 1.03;
            }

            .hero-sub {
                margin-bottom: 16px;
                font-size: 16px;
            }

            .hero-stats {
                grid-template-columns: 1fr;
                gap: 9px;
            }

            .hero-stat {
                grid-template-columns: 38px 1fr;
                min-height: 52px;
                padding: 7px 10px;
                background: rgba(255,255,255,.88);
                border: 1px solid rgba(25, 123, 22, .14);
                border-radius: 8px;
            }

            .hero-stat strong {
                font-size: 17px;
            }

            .round-icon {
                width: 38px;
                height: 38px;
            }

            .hero-car {
                position: relative;
                left: auto;
                bottom: auto;
                width: min(100%, 420px);
                margin: 16px auto 0;
            }

            .live-strip {
                position: relative;
                left: auto;
                bottom: auto;
                width: 100%;
                margin: 10px 0 0;
                gap: 8px 10px;
                flex-wrap: wrap;
                white-space: normal;
            }

            .booking-card {
                padding: 18px 16px;
                border-radius: 8px;
            }

            .booking-card h2 {
                font-size: 21px;
            }

            .control,
            .date-control,
            .primary-cta {
                min-height: 44px;
            }

            .radio-row label {
                flex: 1 1 125px;
            }

            .primary-cta {
                height: auto;
                padding: 12px;
                font-size: 13px;
                line-height: 1.25;
            }

            .fare-pill {
                height: auto;
                min-height: 42px;
                padding: 8px;
                font-size: 13px;
            }

            .mini-benefits {
                display: grid;
                grid-template-columns: 1fr;
                gap: 8px;
                justify-items: start;
            }

            .service-card {
                min-height: auto;
            }

            .panel {
                min-height: 0;
                padding: 16px;
            }

            .route-row {
                grid-template-columns: 1fr 18px 1fr;
            }

            .route-row b {
                grid-column: 1 / -1;
                justify-self: end;
            }
        }

        @media (max-width: 380px) {
            .brand-tag {
                display: none;
            }

            .hero h1 {
                font-size: 37px;
            }

            .live-strip {
                font-size: 11px;
            }
        }

        /* Reference-style homepage top section */
        body {
            background: #fbfcfb;
        }

        .top-status {
            color: #fff;
            background: linear-gradient(90deg, #0f5f13, #197b16);
            font-size: 14px;
            font-weight: 700;
        }

        .top-status-inner {
            min-height: 36px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 20px;
        }

        .top-status span {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            white-space: nowrap;
        }

        .top-status span:first-child::before {
            content: "";
            width: 16px;
            height: 16px;
            background: linear-gradient(180deg, #ffcf33, #ff4b22 70%, #e21818);
            -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13.5 2.1c.8 3.4-.4 5.2-1.8 6.9-.9 1.1-1.8 2.2-1.8 3.8 0 1.4.9 2.4 2.2 2.4 1.8 0 3-1.5 3-3.5 2.2 1.4 3.6 3.6 3.6 6A6.7 6.7 0 0 1 12 24a6.7 6.7 0 0 1-6.8-6.7c0-3.5 2.1-5.7 4.2-7.9 1.8-1.9 3.6-3.8 4.1-7.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13.5 2.1c.8 3.4-.4 5.2-1.8 6.9-.9 1.1-1.8 2.2-1.8 3.8 0 1.4.9 2.4 2.2 2.4 1.8 0 3-1.5 3-3.5 2.2 1.4 3.6 3.6 3.6 6A6.7 6.7 0 0 1 12 24a6.7 6.7 0 0 1-6.8-6.7c0-3.5 2.1-5.7 4.2-7.9 1.8-1.9 3.6-3.8 4.1-7.3Z'/%3E%3C/svg%3E") center / contain no-repeat;
        }

        .top-status span:nth-child(2)::before {
            content: "";
            width: 19px;
            height: 19px;
            background: currentColor;
            -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16 11c1.7 0 3-1.3 3-3s-1.3-3-3-3-3 1.3-3 3 1.3 3 3 3Zm-8 0c1.7 0 3-1.3 3-3S9.7 5 8 5 5 6.3 5 8s1.3 3 3 3Zm0 2c-2.7 0-6 1.3-6 4v2h12v-2c0-2.7-3.3-4-6-4Zm8 0c-.3 0-.7 0-1 .1 1.2.9 2 2.1 2 3.9v2h5v-2c0-2.7-3.3-4-6-4Z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16 11c1.7 0 3-1.3 3-3s-1.3-3-3-3-3 1.3-3 3 1.3 3 3 3Zm-8 0c1.7 0 3-1.3 3-3S9.7 5 8 5 5 6.3 5 8s1.3 3 3 3Zm0 2c-2.7 0-6 1.3-6 4v2h12v-2c0-2.7-3.3-4-6-4Zm8 0c-.3 0-.7 0-1 .1 1.2.9 2 2.1 2 3.9v2h5v-2c0-2.7-3.3-4-6-4Z'/%3E%3C/svg%3E") center / contain no-repeat;
        }

        .top-status span:last-child::before {
            content: "";
            width: 16px;
            height: 16px;
            border: 2px solid currentColor;
            border-radius: 50%;
        }

        .top-nav {
            position: relative;
            background: #fff;
            box-shadow: 0 3px 18px rgba(20, 48, 24, .08);
        }

        .nav-inner {
            height: 70px;
        }

        .brand-mark {
            width: 42px;
            height: 50px;
        }

        .brand-name {
            font-size: 27px;
        }

        .main-menu {
            gap: 30px;
            font-size: 14px;
        }

        .main-menu a {
            padding: 24px 0 21px;
        }

        .main-menu a[href="#services"]::after {
            content: "";
            display: inline-block;
            width: 6px;
            height: 6px;
            margin-left: 6px;
            border-right: 1px solid currentColor;
            border-bottom: 1px solid currentColor;
            transform: rotate(45deg) translateY(-3px);
        }

        .call-button {
            min-height: 43px;
            padding: 0 18px;
            border-radius: 10px;
            background: linear-gradient(135deg, #197b16, #0f5f13);
            box-shadow: 0 6px 18px rgba(25, 123, 22, .26);
        }

        .hero {
            min-height: 690px;
            background:
                linear-gradient(90deg, rgba(246,250,246,.86) 0%, rgba(246,250,246,.64) 35%, rgba(246,250,246,.08) 68%),
                linear-gradient(180deg, rgba(255,255,255,.32) 0%, rgba(255,255,255,.05) 58%, rgba(8,22,10,.06) 100%),
                url('/images/background/onedrop-hero-road.jpg') center / cover no-repeat;
        }

        .hero::after {
            height: 135px;
            background: linear-gradient(0deg, rgba(8, 22, 10, .34), transparent);
        }

        .hero-grid {
            width: min(1680px, calc(100% - 96px));
            grid-template-columns: minmax(0, 860px) 560px;
            gap: 72px;
            padding: 34px 0 20px;
            align-items: start;
        }

        .hero-copy {
            min-height: 625px;
            padding-top: 0;
            min-width: 0;
        }

        .trust-pill {
            min-width: 0;
            height: 26px;
            padding: 0 17px;
            color: #197b16;
            background: rgba(255,255,255,.93);
            border: 0;
            border-radius: 999px;
            box-shadow: 0 5px 18px rgba(24, 63, 27, .08);
            text-transform: uppercase;
            font-size: 12px;
            font-weight: 900;
        }

        .hero h1 {
            max-width: 610px;
            margin: 14px 0 8px;
            font-size: 48px;
            line-height: 1.03;
            font-weight: 900;
        }

        .hero h1 span {
            display: block;
            color: #111722;
        }

        .hero h1 b {
            color: #197b16;
            font-size: 70px;
            letter-spacing: 0;
        }

        .hero-sub {
            margin-bottom: 18px;
            color: #10141c;
            font-size: 20px;
            font-weight: 800;
        }

        .hero-stats {
            display: flex;
            gap: 22px;
            align-items: center;
            flex-wrap: wrap;
        }

        .hero-stat {
            display: inline-flex;
            grid-template-columns: none;
            gap: 8px;
            min-width: 0;
            align-items: center;
            color: #10141c;
            font-size: 13px;
            font-weight: 800;
        }

        .hero-stat + .hero-stat {
            border-left: 0;
            padding-left: 0;
        }

        .hero-stat span {
            margin-top: 0;
            font-size: 13px;
        }

        .hero-stat .round-icon {
            width: 22px;
            height: 22px;
            color: #197b16;
            background: #eef8ec;
            border-color: rgba(25, 123, 22, .18);
        }

        .hero-stat .icon-svg {
            width: 14px;
            height: 14px;
        }

        .hero-car {
            left: 10px;
            bottom: 6px;
            width: min(545px, 55vw);
            filter: drop-shadow(0 22px 18px rgba(16,20,28,.22));
        }

        .live-strip {
            display: none;
        }

        .booking-card {
            justify-self: end;
            width: 100%;
            padding: 28px 36px 31px;
            background: rgba(255,255,255,.97);
            border: 1px solid rgba(16, 20, 28, .12);
            border-radius: 22px;
            box-shadow: 0 18px 42px rgba(16, 20, 28, .2);
            backdrop-filter: none;
        }

        .booking-card h2 {
            margin-bottom: 18px;
            font-size: 30px;
            font-weight: 900;
        }

        .form-grid {
            gap: 15px;
        }

        .field label,
        .trip-label {
            margin-bottom: 4px;
            color: #10141c;
            font-size: 12px;
            font-weight: 900;
        }

        .control,
        .date-control {
            height: 50px;
            padding: 0 17px;
            border-color: #d0d6d1;
            border-radius: 8px;
            color: #10141c;
            font-size: 15px;
        }

        .locate-btn {
            right: 12px;
            color: #10141c;
        }

        .radio-row {
            gap: 52px;
            min-height: 28px;
        }

        .radio-row label {
            font-size: 13px;
            font-weight: 700;
        }

        .date-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 92px 116px;
            gap: 14px;
        }

        .date-row .date-control {
            min-width: 0;
        }

        .quick-date {
            height: 50px;
            padding: 0 12px;
            border-color: rgba(25, 123, 22, .2);
            font-size: 14px;
        }

        .primary-cta {
            height: 58px;
            margin-top: 8px;
            background: linear-gradient(135deg, #ff3328, #e5251c);
            box-shadow: 0 10px 20px rgba(229, 37, 28, .25);
            font-size: 18px;
        }

        .fare-pill {
            height: 54px;
            background: #f2f8ef;
            font-size: 17px;
        }

        .fare-pill strong {
            font-size: 30px;
        }

        .mini-benefits {
            margin-top: 20px;
            gap: 16px;
            color: #142016;
            font-size: 13px;
            font-weight: 700;
        }

        .mini-benefits .icon-svg {
            width: 15px;
            height: 15px;
            color: #197b16;
        }

        .route-strip {
            padding: 14px 0 20px;
            background: #fff;
            border-bottom: 1px solid #edf1ed;
        }

        .route-strip-head {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 18px;
            margin-bottom: 12px;
        }

        .route-strip h2,
        .route-strip p {
            margin: 0;
        }

        .route-strip h2 {
            color: #197b16;
            font-size: 18px;
            line-height: 1.2;
        }

        .route-strip h2 span {
            color: #10141c;
        }

        .route-strip p {
            color: #10141c;
            font-size: 16px;
            font-weight: 800;
        }

        .route-cards {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr)) 86px;
            gap: 8px;
        }

        .route-card {
            min-height: 76px;
            display: grid;
            grid-template-columns: 42px 1fr;
            gap: 4px 10px;
            align-items: center;
            padding: 10px 12px;
            border: 1px solid #dfe5de;
            border-radius: 8px;
            background: #fff;
            box-shadow: 0 6px 18px rgba(21, 86, 24, .05);
        }

        .route-card img {
            grid-row: 1 / 4;
            width: 42px;
            height: 28px;
            object-fit: contain;
        }

        .route-card span {
            font-size: 12px;
            font-weight: 800;
        }

        .route-card small {
            color: #596171;
            font-size: 11px;
        }

        .route-card strong {
            color: #197b16;
            font-size: 20px;
            line-height: 1;
        }

        .route-card-more {
            display: flex;
            flex-direction: column;
            justify-content: center;
            text-align: center;
            color: #197b16;
        }

        .route-card-more span {
            font-size: 13px;
        }

        @media (max-width: 1000px) {
            .top-status-inner {
                justify-content: center;
                flex-wrap: wrap;
                padding: 8px 0;
            }

            .hero-grid {
                grid-template-columns: 1fr;
                gap: 18px;
            }

            .hero-copy {
                min-height: 385px;
            }

            .hero-car {
                width: min(500px, 80vw);
            }

            .booking-card {
                justify-self: center;
                width: min(480px, 100%);
            }

            .route-cards {
                grid-template-columns: repeat(3, 1fr);
            }
        }

        @media (max-width: 620px) {
            .top-status {
                font-size: 12px;
            }

            .top-status-inner {
                justify-content: flex-start;
                gap: 8px 14px;
            }

            .nav-inner {
                height: auto;
                padding: 12px 0;
            }

            .hero {
                background:
                    linear-gradient(180deg, rgba(246,250,246,.98) 0%, rgba(246,250,246,.82) 56%, rgba(246,250,246,.36) 100%),
                    url('/images/background/onedrop-hero-road.jpg') center top / cover no-repeat;
            }

            .hero-grid {
                padding-top: 18px;
            }

            .hero-copy {
                min-height: auto;
            }

            .trust-pill {
                width: auto;
                max-width: 100%;
                justify-content: flex-start;
                font-size: 10px;
            }

            .hero h1 {
                font-size: 32px;
            }

            .hero h1 b {
                font-size: 46px;
            }

            .hero-sub {
                font-size: 16px;
            }

            .hero-stats {
                gap: 9px;
            }

            .hero-stat {
                width: auto;
                min-height: auto;
                padding: 7px 9px;
            }

            .hero-car {
                position: relative;
                width: min(420px, 100%);
                margin-top: 12px;
            }

            .booking-card {
                padding: 17px 15px;
            }

            .date-row {
                grid-template-columns: 1fr 76px 94px;
            }

            .mini-benefits {
                grid-template-columns: repeat(3, 1fr);
                align-items: start;
            }

            .route-strip-head {
                align-items: start;
                flex-direction: column;
                gap: 4px;
            }

            .route-cards {
                grid-template-columns: 1fr;
            }

            .route-card {
                min-height: 68px;
            }
        }

        /* Exact compact lower-section replica from the reference */
        .route-strip,
        #services,
        .why,
        .tariff,
        .about-summary,
        .reviews-section,
        .faq {
            background: #fff;
        }

        .route-strip {
            padding: 8px 0 13px;
            border-bottom: 1px solid #eff3ef;
        }

        .route-strip-head {
            margin-bottom: 8px;
        }

        .route-strip h2 {
            font-size: 14px;
            font-weight: 900;
        }

        .route-strip p {
            font-size: 13px;
            font-weight: 900;
        }

        .route-cards {
            grid-template-columns: repeat(5, minmax(0, 1fr)) 80px;
            gap: 8px;
        }

        .route-card {
            min-height: 72px;
            grid-template-columns: 39px 1fr;
            gap: 2px 9px;
            padding: 8px 10px;
            border-radius: 7px;
            box-shadow: 0 4px 14px rgba(15, 95, 19, .04);
        }

        .route-card img {
            width: 39px;
            height: 28px;
        }

        .route-card span {
            font-size: 11px;
            line-height: 1.15;
        }

        .route-card small {
            font-size: 10px;
            line-height: 1;
        }

        .route-card strong {
            font-size: 18px;
        }

        .route-card-more {
            min-height: 72px;
        }

        .route-card-more span {
            font-size: 12px;
        }

        #services {
            padding: 14px 0 17px;
        }

        .section-title {
            margin-bottom: 13px;
            font-size: 18px;
            font-weight: 900;
        }

        .section-title::after {
            width: 30px;
            height: 1px;
            margin-top: 5px;
        }

        .services-grid {
            gap: 28px;
        }

        .service-card {
            min-height: 127px;
            padding: 11px 10px 12px;
            border-radius: 8px;
            box-shadow: 0 5px 15px rgba(16, 20, 28, .04);
        }


        .service-art img {
            max-height: 60px;
        }

        .service-card h3 {
            margin-bottom: 4px;
            font-size: 14px;
            line-height: 1.1;
        }

        .service-card p {
            font-size: 11px;
            line-height: 1.28;
        }

        .why {
            padding: 8px 0 15px;
            border-top: 1px solid #eff3ef;
            border-bottom: 1px solid #eff3ef;
        }

        .why .section-title {
            margin-bottom: 13px;
        }

        .why-grid {
            grid-template-columns: repeat(4, 1fr);
            gap: 14px 0;
        }

        .why-item {
            grid-template-columns: 38px 1fr;
            gap: 11px;
            min-height: 38px;
            padding: 0 22px;
        }

        .why-item:nth-child(4n + 1) {
            padding-left: 0;
        }

        .why-item + .why-item {
            border-left: 1px solid rgba(25, 123, 22, .13);
        }

        .why-item:nth-child(5) {
            border-left: 0;
        }

        .why-item .round-icon {
            width: 34px;
            height: 34px;
            color: #197b16;
            background: #f6fbf4;
        }

        .why-item .icon-svg {
            width: 19px;
            height: 19px;
        }

        .why-item strong {
            font-size: 12px;
            line-height: 1.22;
        }

        .tariff {
            padding: 9px 0 13px;
        }

        .tariff-heading {
            margin-bottom: 11px;
            font-size: 18px;
            font-weight: 900;
        }

        .tariff-grid {
            gap: 28px;
        }

        .tariff-card {
            min-height: 138px;
            padding: 9px 10px 10px;
            border-radius: 8px;
            box-shadow: 0 5px 15px rgba(16, 20, 28, .04);
        }

        .tariff-card h3 {
            margin-bottom: 5px;
            font-size: 16px;
        }

        .tariff-card img {
            height: 50px;
            margin-bottom: 6px;
        }

        .price {
            margin-bottom: 7px;
            font-size: 22px;
        }

        .price small {
            font-size: 11px;
        }

        .trip-badge {
            min-width: 112px;
            height: 24px;
            border-radius: 5px;
            font-size: 12px;
        }

        .tariff-note {
            display: inline-block;
            margin: 8px 0 0 9px;
            font-size: 10px;
        }

        .center-action {
            margin-top: -3px;
        }

        .outline-btn {
            min-width: 172px;
            height: 25px;
            font-size: 11px;
        }

        .about-summary {
            padding: 7px 0 10px;
            border-top: 1px solid #eff3ef;
        }

        .about-layout {
            display: grid;
            grid-template-columns: 365px 1fr;
            gap: 26px;
            align-items: center;
        }

        .about-copy h2 {
            margin: 0 0 6px;
            font-size: 18px;
            line-height: 1.15;
        }

        .about-copy h2 span {
            color: var(--green);
        }

        .about-copy p {
            margin: 0;
            color: #111722;
            font-size: 11px;
            line-height: 1.3;
        }

        .about-metrics {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            text-align: center;
        }

        .about-metrics > div {
            min-height: 93px;
            display: grid;
            align-content: center;
            justify-items: center;
            border-left: 1px solid rgba(25, 123, 22, .13);
        }

        .about-metrics .round-icon {
            width: 41px;
            height: 41px;
            margin-bottom: 5px;
            color: #197b16;
            background: #fff;
            border-color: transparent;
        }

        .about-metrics .icon-svg {
            width: 30px;
            height: 30px;
        }

        .about-metrics strong {
            color: #10141c;
            font-size: 32px;
            line-height: .95;
            font-weight: 900;
        }

        .about-metrics span:last-child {
            margin-top: 3px;
            font-size: 11px;
            line-height: 1.15;
        }

        .reviews-section {
            padding: 5px 0 9px;
        }

        .reviews-section h2 {
            margin: 0 0 9px;
            text-align: center;
            font-size: 20px;
            line-height: 1.15;
            font-weight: 900;
        }

        .reviews-section h2 span,
        .reviews-section h2 strong {
            color: var(--green);
        }

        .reviews-shell {
            display: grid;
            grid-template-columns: 26px 1fr 26px;
            gap: 14px;
            align-items: center;
        }

        .review-arrow {
            width: 26px;
            height: 26px;
            border: 1px solid #dfe5de;
            border-radius: 50%;
            background: #fff;
            color: #111722;
            font-size: 21px;
            line-height: 1;
            cursor: pointer;
        }

        .reviews-section .review-grid {
            grid-template-columns: repeat(3, 1fr);
            gap: 28px;
        }

        .reviews-section .quote {
            min-height: 100px;
            padding: 11px 18px 12px;
            border-radius: 7px;
            background: #fff;
            font-size: 11px;
            line-height: 1.35;
            box-shadow: 0 5px 15px rgba(16, 20, 28, .04);
        }

        .reviews-section .quote p {
            margin: 3px 0 7px;
        }

        .reviews-section .quote strong {
            font-size: 11px;
        }

        .reviews-section .stars {
            margin: 0;
            color: #ffc107;
            text-align: left;
            font-size: 14px;
            letter-spacing: 1px;
        }

        .faq {
            padding: 0 0 15px;
        }

        .faq h2 {
            margin-bottom: 8px;
            font-size: 18px;
            font-weight: 900;
        }

        .faq-grid {
            gap: 8px 28px;
        }

        details {
            border-radius: 5px;
        }

        summary {
            min-height: 31px;
            padding: 0 13px;
            font-size: 11px;
        }

        details p {
            font-size: 11px;
            line-height: 1.35;
        }

        @media (max-width: 1000px) {
            .services-grid,
            .tariff-grid {
                gap: 14px;
            }

            .about-layout {
                grid-template-columns: 1fr;
            }

            .about-metrics > div:first-child {
                border-left: 0;
            }

            .reviews-shell {
                grid-template-columns: 1fr;
            }

            .review-arrow {
                display: none;
            }
        }

        @media (max-width: 620px) {
            .route-cards,
            .services-grid,
            .tariff-grid,
            .why-grid,
            .about-metrics,
            .reviews-section .review-grid,
            .faq-grid {
                grid-template-columns: 1fr;
            }

            .why-item,
            .why-item:nth-child(4n + 1) {
                padding: 0;
                border-left: 0;
            }

            .about-metrics > div {
                border-left: 0;
                border-top: 1px solid rgba(25, 123, 22, .13);
            }
        }

        /* Branded white taxi on hero road */
        .hero-car-wrap {
            position: absolute;
            left: 160px;
            top: 270px;
            z-index: 5;
            width: min(640px, 46vw);
            pointer-events: none;
        }

        .hero-car-wrap .hero-car {
            position: relative;
            left: auto;
            bottom: auto;
            z-index: 1;
            width: 100%;
            filter: drop-shadow(0 12px 12px rgba(16, 20, 28, .24));
            transform: translateZ(0);
        }

        .hero-car-wrap::before {
            content: "";
            position: absolute;
            left: 10%;
            right: 8%;
            bottom: 1%;
            height: 12%;
            z-index: 0;
            background: radial-gradient(ellipse at center, rgba(6, 10, 8, .38) 0%, rgba(6, 10, 8, .22) 45%, rgba(6, 10, 8, 0) 75%);
            transform: skewX(-11deg);
        }

        .car-door-brand {
            position: absolute;
            left: 53%;
            top: 50%;
            z-index: 3;
            display: inline-flex;
            align-items: center;
            gap: 4px;
            transform: rotate(.4deg) skewX(-7deg) scale(.94);
            transform-origin: left center;
            color: #111722;
            font-size: 16px;
            font-weight: 900;
            line-height: 1;
            letter-spacing: 0;
            text-shadow: 0 1px 1px rgba(255, 255, 255, .92);
        }

        .car-door-logo {
            width: 26px;
            height: 32px;
            flex: 0 0 auto;
            filter: drop-shadow(0 1px 1px rgba(255,255,255,.7));
        }

        .car-door-name span {
            color: #197b16;
        }

        .car-number-plate {
            position: absolute;
            left: 11.5%;
            top: 59.5%;
            z-index: 4;
            min-width: 88px;
            height: 22px;
            display: grid;
            place-items: center;
            padding: 0 8px;
            color: #111;
            background: #f0bf1f;
            border: 1px solid #1d1d1d;
            border-radius: 2px;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,.22), 0 1px 2px rgba(0,0,0,.25);
            font-size: 8px;
            font-weight: 900;
            line-height: 1;
            letter-spacing: .2px;
            text-transform: uppercase;
            transform: perspective(150px) rotateY(18deg) rotateZ(-1deg) skewX(-4deg);
        }

        @media (max-width: 1000px) {
            .hero-car-wrap {
                left: 30px;
                top: 198px;
                width: min(540px, 76vw);
            }
        }

        @media (max-width: 620px) {
            .hero-grid {
                width: min(1120px, calc(100% - 28px));
            }

            .hero-car-wrap {
                position: relative;
                left: auto;
                top: auto;
                width: min(330px, calc(100vw - 60px));
                margin: 28px auto 4px;
            }

            .hero-car-wrap .hero-car {
                display: block;
                margin: 0 auto;
            }

            .booking-card {
                justify-self: center;
                width: min(100%, calc(100vw - 28px));
            }

            .booking-card h2 {
                font-size: 22px;
                line-height: 1.16;
                white-space: normal;
            }

            .date-row {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }

            .date-row .date-control {
                grid-column: 1 / -1;
                min-width: 0;
            }

            .quick-date {
                width: 100%;
                min-width: 0;
                padding: 0 8px;
            }

            .mini-benefits {
                display: grid;
                grid-template-columns: 1fr;
                gap: 9px;
                justify-items: start;
            }

            .car-door-brand {
                font-size: 12px;
            }

            .car-door-logo {
                width: 21px;
                height: 26px;
            }

            .car-number-plate {
                min-width: 68px;
                height: 18px;
                font-size: 7px;
            }
        }

        .menu-toggle,
        .menu-backdrop {
            display: none;
        }

        /* Final phone layout pass */
        @media (max-width: 620px) {
            body {
                overflow-x: hidden;
            }

            body.menu-open {
                overflow: hidden;
            }

            .site-shell,
            .hero-grid {
                width: min(390px, calc(100% - 28px));
            }

            .top-status-inner {
                display: flex;
                align-items: center;
                justify-content: center;
                min-height: 0;
                padding: 6px 0;
                gap: 0;
            }

            .top-status span {
                white-space: nowrap;
                line-height: 1.25;
            }

            .top-status span:nth-child(2),
            .top-status span:nth-child(3) {
                display: none;
            }

            .top-nav {
                z-index: 100;
            }

            .nav-inner {
                position: relative;
                display: grid;
                grid-template-columns: 1fr;
                align-items: center;
                gap: 10px;
                padding: 12px 0 10px;
            }

            .brand {
                justify-content: flex-start !important;
                width: calc(100% - 54px);
                min-width: 0;
            }

            .brand-mark {
                width: 40px;
                height: 48px;
            }

            .brand-name {
                font-size: 27px;
            }

            .brand-tag {
                font-size: 10px;
            }

            .menu-toggle {
                position: absolute;
                top: 14px;
                right: 0;
                z-index: 120;
                width: 42px;
                height: 42px;
                display: inline-grid !important;
                place-items: center;
                padding: 0;
                color: #197b16;
                background: #eef8ec;
                border: 1px solid rgba(25, 123, 22, .28);
                border-radius: 8px;
                box-shadow: 0 6px 14px rgba(25, 123, 22, .12);
                cursor: pointer;
            }

            .menu-toggle span {
                width: 20px;
                height: 2px;
                display: none;
                grid-area: 1 / 1;
                background: currentColor;
                border-radius: 999px;
                transition: transform .18s ease, opacity .18s ease;
            }

            .menu-toggle .menu-glyph {
                grid-area: 1 / 1;
                display: block;
                color: currentColor;
                font-size: 24px;
                font-weight: 900;
                line-height: 1;
            }

            .menu-toggle span:nth-child(1) {
                transform: translateY(-6px);
            }

            .menu-toggle span:nth-child(3) {
                transform: translateY(6px);
            }

            body.menu-open .menu-toggle span:nth-child(1) {
                transform: rotate(45deg);
            }

            body.menu-open .menu-toggle span:nth-child(2) {
                opacity: 0;
            }

            body.menu-open .menu-toggle span:nth-child(3) {
                transform: rotate(-45deg);
            }

            .call-button {
                grid-column: 1 / -1;
                width: 100%;
                min-height: 42px;
                padding: 0 14px;
                justify-content: center;
                border-radius: 8px;
                font-size: 16px;
            }

            .main-menu {
                position: fixed;
                top: 0;
                right: 0;
                z-index: 90;
                width: min(300px, 82vw);
                height: 100dvh;
                display: flex;
                flex-direction: column;
                align-items: stretch;
                gap: 10px;
                padding: 150px 18px 24px;
                overflow-y: auto;
                color: #10141c;
                background: #fff;
                box-shadow: -20px 0 36px rgba(16, 20, 28, .18);
                font-size: 15px;
                visibility: hidden;
                pointer-events: none;
                transform: translateX(105%);
                transition: transform .22s ease, visibility .22s ease;
            }

            body.menu-open .main-menu {
                visibility: visible;
                pointer-events: auto;
                transform: translateX(0);
            }

            .main-menu a {
                min-width: 0;
                min-height: 44px;
                display: flex;
                align-items: center;
                justify-content: flex-start;
                padding: 0 14px;
                border: 1px solid rgba(25, 123, 22, .14);
                border-radius: 8px;
                background: #f8fbf7;
                white-space: nowrap;
            }

            .main-menu a.active,
            .main-menu a:hover {
                color: var(--green);
                background: #eef8ec;
                border-color: rgba(25, 123, 22, .34);
            }

            .main-menu a[href="#services"]::after {
                display: none;
            }

            .menu-backdrop {
                position: fixed;
                inset: 0;
                z-index: 70;
                display: block;
                background: rgba(16, 20, 28, .42);
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
                transition: opacity .18s ease, visibility .18s ease;
            }

            body.menu-open .menu-backdrop {
                opacity: 1;
                visibility: visible;
                pointer-events: auto;
            }

            .hero {
                min-height: 0;
            }

            .hero-grid {
                display: flex;
                flex-direction: column;
                gap: 12px;
                padding: 16px 0 18px;
            }

            .hero-copy {
                display: contents;
            }

            .trust-pill {
                order: 1;
                width: min(100%, 300px);
                min-height: 26px;
                height: auto;
                margin: 0 auto;
                padding: 6px 10px;
                justify-content: center;
                text-align: center;
                font-size: 9px;
                line-height: 1.2;
                white-space: normal;
            }

            .hero h1 {
                order: 2;
                margin: 0;
                max-width: 100%;
                font-size: 31px;
                line-height: 1.04;
            }

            .hero h1 b {
                font-size: 40px;
            }

            .hero-sub {
                order: 3;
                margin: -4px 0 0;
                font-size: 16px;
                line-height: 1.25;
            }

            .hero-stats {
                order: 4;
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 8px;
            }

            .hero-stat {
                min-height: 44px;
                padding: 6px 8px;
                gap: 7px;
                border-radius: 8px;
                font-size: 12px;
            }

            .hero-stat:nth-child(3) {
                grid-column: 1 / -1;
            }

            .hero-stat .round-icon {
                width: 28px;
                height: 28px;
            }

            .hero-stat .icon-svg {
                width: 16px;
                height: 16px;
            }

            .hero-stat span {
                font-size: 12px;
                line-height: 1.2;
            }

            .booking-card {
                order: 5;
                width: min(100%, 346px);
                margin: 0 auto;
                padding: 16px 14px;
                border-radius: 12px;
                box-shadow: 0 12px 28px rgba(16, 20, 28, .16);
            }

            .booking-card h2 {
                margin-bottom: 13px;
                font-size: 22px;
                line-height: 1.18;
            }

            .form-grid {
                gap: 12px;
            }

            .control,
            .date-control {
                height: 46px;
                padding: 0 12px;
                font-size: 14px;
            }

            .location-wrap .control {
                padding-right: 42px;
            }

            .locate-btn {
                right: 8px;
                width: 32px;
                height: 32px;
            }

            .radio-row {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 8px;
                min-height: 0;
            }

            .radio-row label {
                justify-content: center;
                min-height: 38px;
                padding: 0 8px;
                font-size: 13px;
            }

            .date-row {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 8px;
            }

            .date-row .date-control {
                grid-column: 1 / -1;
            }

            .quick-date {
                height: 42px;
                padding: 0 8px;
                font-size: 13px;
            }

            .primary-cta {
                min-height: 48px;
                height: auto;
                margin-top: 2px;
                padding: 11px;
                font-size: 14px;
                line-height: 1.2;
            }

            .fare-pill {
                min-height: 44px;
                height: auto;
                padding: 8px;
                font-size: 14px;
            }

            .fare-pill strong {
                font-size: 22px;
            }

            .mini-benefits {
                grid-template-columns: 1fr;
                gap: 8px;
                margin-top: 12px;
            }

            .hero-car-wrap {
                order: 6;
                width: min(285px, 100%);
                margin: 4px auto 0;
            }

            .live-strip {
                order: 7;
            }
        }

        @media (max-width: 380px) {
            .site-shell,
            .hero-grid {
                width: calc(100% - 22px);
            }

            .brand-name {
                font-size: 24px;
            }

            .main-menu {
                font-size: 12px;
            }

            .hero h1 {
                font-size: 30px;
            }

            .hero h1 b {
                font-size: 38px;
            }

            .booking-card h2 {
                font-size: 20px;
            }
        }

        @media (max-width: 620px) {
            .top-nav .menu-toggle {
                position: fixed !important;
                top: 42px !important;
                right: 14px !important;
                z-index: 200 !important;
                display: inline-grid !important;
                visibility: visible !important;
                opacity: 1 !important;
                pointer-events: auto !important;
            }
        }

        /* Final mobile card grids, including phones using browser "Desktop site". */
        @media (max-width: 620px) {
            .route-cards,
            .services-grid,
            .tariff-grid,
            .why-grid,
            .about-metrics,
            .reviews-section .review-grid,
            .faq-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
                gap: 8px !important;
            }

            .route-card {
                min-height: 82px !important;
                grid-template-columns: 36px minmax(0, 1fr) !important;
                gap: 2px 7px !important;
                padding: 8px !important;
            }

            .route-card img {
                width: 36px !important;
                height: 25px !important;
            }

            .route-card span {
                font-size: 10px !important;
            }

            .route-card small {
                font-size: 9px !important;
            }

            .route-card strong {
                font-size: 17px !important;
            }

            .service-card {
                min-height: 138px !important;
                padding: 10px 8px !important;
            }

            .service-art {
                height: 56px !important;
            }

            .service-art img {
                max-height: 52px !important;
            }

            .service-card h3,
            .tariff-card h3 {
                font-size: 13px !important;
                line-height: 1.2 !important;
            }

            .service-card p {
                font-size: 10px !important;
                line-height: 1.3 !important;
            }

            .why-item,
            .why-item:nth-child(4n + 1) {
                min-height: 56px !important;
                grid-template-columns: 34px minmax(0, 1fr) !important;
                gap: 8px !important;
                padding: 0 !important;
                border-left: 0 !important;
            }

            .why-item .round-icon {
                width: 32px !important;
                height: 32px !important;
            }

            .why-item strong {
                font-size: 11px !important;
                line-height: 1.15 !important;
            }

            summary {
                min-height: 40px !important;
                padding: 0 10px !important;
                font-size: 10px !important;
                line-height: 1.2 !important;
            }
        }

        html.force-mobile body {
            overflow-x: hidden !important;
        }

        html.force-mobile body.menu-open {
            overflow: hidden !important;
        }

        html.force-mobile .site-shell,
        html.force-mobile .hero-grid {
            width: min(390px, calc(100% - 28px)) !important;
        }

        html.force-mobile .top-status {
            position: sticky !important;
            top: 0 !important;
            z-index: 220 !important;
        }

        html.force-mobile .top-status-inner {
            min-height: 0 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            gap: 0 !important;
            padding: 6px 0 !important;
        }

        html.force-mobile .top-status span {
            white-space: nowrap !important;
            line-height: 1.25 !important;
        }

        html.force-mobile .top-status span:nth-child(2),
        html.force-mobile .top-status span:nth-child(3) {
            display: none !important;
        }

        html.force-mobile .top-nav {
            position: sticky !important;
            top: 27px !important;
            z-index: 210 !important;
            background: #fff !important;
        }

        html.force-mobile .nav-inner {
            position: relative !important;
            height: auto !important;
            display: grid !important;
            grid-template-columns: 1fr !important;
            align-items: center !important;
            gap: 10px !important;
            padding: 12px 0 10px !important;
        }

        html.force-mobile .brand {
            justify-content: flex-start !important;
            width: calc(100% - 54px) !important;
            min-width: 0 !important;
        }

        html.force-mobile .brand-mark {
            width: 40px !important;
            height: 48px !important;
        }

        html.force-mobile .brand-name {
            font-size: 27px !important;
        }

        html.force-mobile .brand-tag {
            font-size: 10px !important;
        }

        html.force-mobile .menu-toggle {
            position: fixed !important;
            top: 38px !important;
            right: 12px !important;
            z-index: 200 !important;
            width: 48px !important;
            height: 48px !important;
            display: inline-grid !important;
            place-items: center !important;
            color: #fff !important;
            background: #197b16 !important;
            border: 1px solid rgba(15, 95, 19, .35) !important;
            border-radius: 8px !important;
            visibility: visible !important;
            opacity: 1 !important;
            pointer-events: auto !important;
        }

        html.force-mobile .menu-toggle span {
            display: none !important;
        }

        html.force-mobile .menu-toggle .menu-glyph {
            display: block !important;
            color: currentColor !important;
            font-size: 24px !important;
            font-weight: 900 !important;
            line-height: 1 !important;
        }

        html.force-mobile .call-button {
            grid-column: 1 / -1 !important;
            width: 100% !important;
            min-height: 42px !important;
            justify-content: center !important;
            padding: 0 14px !important;
            border-radius: 8px !important;
            font-size: 16px !important;
        }

        html.force-mobile .main-menu {
            position: fixed !important;
            top: 0 !important;
            right: 0 !important;
            z-index: 90 !important;
            width: min(300px, 82vw) !important;
            height: 100dvh !important;
            display: flex !important;
            flex-direction: column !important;
            align-items: stretch !important;
            gap: 10px !important;
            padding: 150px 18px 24px !important;
            overflow-y: auto !important;
            color: #10141c !important;
            background: #fff !important;
            box-shadow: -20px 0 36px rgba(16, 20, 28, .18) !important;
            font-size: 15px !important;
            visibility: hidden !important;
            pointer-events: none !important;
            transform: translateX(105%) !important;
            transition: transform .22s ease, visibility .22s ease !important;
        }

        html.force-mobile body.menu-open .main-menu {
            visibility: visible !important;
            pointer-events: auto !important;
            transform: translateX(0) !important;
        }

        html.force-mobile .main-menu a {
            min-height: 44px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: flex-start !important;
            padding: 0 14px !important;
            border: 1px solid rgba(25, 123, 22, .14) !important;
            border-radius: 8px !important;
            background: #f8fbf7 !important;
            white-space: nowrap !important;
        }

        html.force-mobile .main-menu a[href="#services"]::after {
            display: none !important;
        }

        html.force-mobile .menu-backdrop {
            position: fixed !important;
            inset: 0 !important;
            z-index: 70 !important;
            display: block !important;
            background: rgba(16, 20, 28, .42) !important;
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
        }

        html.force-mobile body.menu-open .menu-backdrop {
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
        }

        html.force-mobile .hero {
            min-height: 0 !important;
        }

        html.force-mobile .hero-grid {
            display: flex !important;
            flex-direction: column !important;
            gap: 12px !important;
            padding: 16px 0 18px !important;
        }

        html.force-mobile .hero-copy {
            display: contents !important;
            min-height: 0 !important;
        }

        html.force-mobile .trust-pill {
            order: 1 !important;
            width: min(100%, 300px) !important;
            min-width: 0 !important;
            min-height: 26px !important;
            height: auto !important;
            margin: 0 auto !important;
            padding: 6px 10px !important;
            justify-content: center !important;
            text-align: center !important;
            font-size: 9px !important;
            line-height: 1.2 !important;
            white-space: normal !important;
        }

        html.force-mobile .hero h1 {
            order: 2 !important;
            margin: 0 !important;
            max-width: 100% !important;
            font-size: 31px !important;
            line-height: 1.04 !important;
        }

        html.force-mobile .hero h1 b {
            font-size: 40px !important;
        }

        html.force-mobile .hero-sub {
            order: 3 !important;
            margin: -4px 0 0 !important;
            font-size: 16px !important;
            line-height: 1.25 !important;
        }

        html.force-mobile .hero-stats {
            order: 4 !important;
            display: grid !important;
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
            gap: 8px !important;
        }

        html.force-mobile .hero-stat {
            min-height: 44px !important;
            padding: 6px 8px !important;
            gap: 7px !important;
            border-radius: 8px !important;
            font-size: 12px !important;
        }

        html.force-mobile .hero-stat:nth-child(3) {
            grid-column: 1 / -1 !important;
        }

        html.force-mobile .hero-stat .round-icon {
            width: 28px !important;
            height: 28px !important;
        }

        html.force-mobile .hero-stat .icon-svg {
            width: 16px !important;
            height: 16px !important;
        }

        html.force-mobile .hero-stat span {
            font-size: 12px !important;
            line-height: 1.2 !important;
        }

        html.force-mobile .booking-card {
            order: 5 !important;
            justify-self: center !important;
            width: min(100%, 346px) !important;
            margin: 0 auto !important;
            padding: 16px 14px !important;
            border-radius: 12px !important;
            box-shadow: 0 12px 28px rgba(16, 20, 28, .16) !important;
        }

        html.force-mobile .booking-card h2 {
            margin-bottom: 13px !important;
            font-size: 22px !important;
            line-height: 1.18 !important;
            white-space: normal !important;
        }

        html.force-mobile .hero-car-wrap {
            order: 6 !important;
            position: relative !important;
            left: auto !important;
            top: auto !important;
            width: min(285px, 100%) !important;
            margin: 4px auto 0 !important;
        }

        html.force-mobile .route-cards,
        html.force-mobile .services-grid,
        html.force-mobile .tariff-grid,
        html.force-mobile .why-grid,
        html.force-mobile .about-metrics,
        html.force-mobile .reviews-section .review-grid,
        html.force-mobile .faq-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
            gap: 8px !important;
        }

        html.force-mobile .route-card {
            min-height: 82px !important;
            grid-template-columns: 36px minmax(0, 1fr) !important;
            gap: 2px 7px !important;
            padding: 8px !important;
        }

        html.force-mobile .route-card img {
            width: 36px !important;
            height: 25px !important;
        }

        html.force-mobile .route-card span {
            font-size: 10px !important;
        }

        html.force-mobile .route-card small {
            font-size: 9px !important;
        }

        html.force-mobile .route-card strong {
            font-size: 17px !important;
        }

        html.force-mobile .service-card {
            min-height: 138px !important;
            padding: 10px 8px !important;
        }

        html.force-mobile .service-art {
            height: 56px !important;
        }

        html.force-mobile .service-art img {
            max-height: 52px !important;
        }

        html.force-mobile .service-card h3,
        html.force-mobile .tariff-card h3 {
            font-size: 13px !important;
            line-height: 1.2 !important;
        }

        html.force-mobile .service-card p {
            font-size: 10px !important;
            line-height: 1.3 !important;
        }

        html.force-mobile .why-item,
        html.force-mobile .why-item:nth-child(4n + 1) {
            min-height: 56px !important;
            grid-template-columns: 34px minmax(0, 1fr) !important;
            gap: 8px !important;
            padding: 0 !important;
            border-left: 0 !important;
        }

        html.force-mobile .why-item .round-icon {
            width: 32px !important;
            height: 32px !important;
        }

        html.force-mobile .why-item strong {
            font-size: 11px !important;
            line-height: 1.15 !important;
        }

        @media (max-width: 620px) {
            .site-footer {
                padding-top: 22px !important;
            }

            .footer-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
                gap: 18px 16px !important;
                padding: 0 0 20px !important;
                align-items: start !important;
            }

            .footer-grid > div:first-child {
                grid-column: 1 / -1 !important;
            }

            .footer-brand {
                margin-bottom: 8px !important;
            }

            .footer-brand .brand-name {
                font-size: 22px !important;
            }

            .footer-brand .brand-mark {
                width: 36px !important;
                height: 44px !important;
            }

            .footer h3 {
                margin: 0 0 8px !important;
                font-size: 14px !important;
                line-height: 1.2 !important;
            }

            .footer ul {
                gap: 6px !important;
            }

            .footer p,
            .footer a,
            .footer li {
                font-size: 11px !important;
                line-height: 1.35 !important;
            }

            .social-row {
                margin-top: 12px !important;
                gap: 9px !important;
            }

            .store-button {
                width: 100% !important;
                min-width: 0 !important;
                min-height: 40px !important;
                gap: 7px !important;
                padding: 7px 8px !important;
            }

            .store-button .icon-svg {
                width: 18px !important;
                height: 18px !important;
            }

            .store-button small {
                font-size: 7px !important;
            }

            .store-button strong {
                font-size: 11px !important;
            }

            .copyright {
                padding: 10px 14px !important;
                font-size: 10px !important;
                line-height: 1.35 !important;
            }
        }

        html.force-mobile .site-footer {
            padding-top: 22px !important;
        }

        html.force-mobile .footer-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
            gap: 18px 16px !important;
            padding: 0 0 20px !important;
            align-items: start !important;
        }

        html.force-mobile .footer-grid > div:first-child {
            grid-column: 1 / -1 !important;
        }

        html.force-mobile .footer-brand {
            margin-bottom: 8px !important;
        }

        html.force-mobile .footer-brand .brand-name {
            font-size: 22px !important;
        }

        html.force-mobile .footer-brand .brand-mark {
            width: 36px !important;
            height: 44px !important;
        }

        html.force-mobile .footer h3 {
            margin: 0 0 8px !important;
            font-size: 14px !important;
            line-height: 1.2 !important;
        }

        html.force-mobile .footer ul {
            gap: 6px !important;
        }

        html.force-mobile .footer p,
        html.force-mobile .footer a,
        html.force-mobile .footer li {
            font-size: 11px !important;
            line-height: 1.35 !important;
        }

        html.force-mobile .social-row {
            margin-top: 12px !important;
            gap: 9px !important;
        }

        html.force-mobile .store-button {
            width: 100% !important;
            min-width: 0 !important;
            min-height: 40px !important;
            gap: 7px !important;
            padding: 7px 8px !important;
        }

        html.force-mobile .store-button .icon-svg {
            width: 18px !important;
            height: 18px !important;
        }

        html.force-mobile .store-button small {
            font-size: 7px !important;
        }

        html.force-mobile .store-button strong {
            font-size: 11px !important;
        }

        html.force-mobile .copyright {
            padding: 10px 14px !important;
            font-size: 10px !important;
            line-height: 1.35 !important;
        }

        @media (min-width: 1001px) {
            html:not(.force-mobile) .route-strip h2 {
                font-size: 20px;
            }

            html:not(.force-mobile) .route-strip p {
                font-size: 17px;
            }

            html:not(.force-mobile) .route-card {
                min-height: 86px;
                grid-template-columns: 48px minmax(0, 1fr);
                gap: 5px 12px;
                padding: 12px 14px;
            }

            html:not(.force-mobile) .route-card img {
                width: 48px;
                height: 32px;
            }

            html:not(.force-mobile) .route-card span {
                font-size: 13px;
                line-height: 1.15;
            }

            html:not(.force-mobile) .route-card small {
                font-size: 12px;
            }

            html:not(.force-mobile) .route-card strong {
                font-size: 23px;
            }

            html:not(.force-mobile) .route-card-more span {
                font-size: 14px;
            }

            html:not(.force-mobile) #services {
                padding: 18px 0 22px;
            }

            html:not(.force-mobile) .section-title {
                margin-bottom: 16px;
                font-size: 21px;
            }

            html:not(.force-mobile) .service-card {
                min-height: 150px;
                padding: 14px 13px 15px;
            }

            html:not(.force-mobile) .service-art {
                height: 74px;
            }

            html:not(.force-mobile) .service-art img {
                max-height: 68px;
            }

            html:not(.force-mobile) .service-card h3 {
                margin-bottom: 6px;
                font-size: 16px;
                line-height: 1.15;
            }

            html:not(.force-mobile) .service-card p {
                font-size: 12.5px;
                line-height: 1.35;
            }

            html:not(.force-mobile) .why {
                padding: 13px 0 19px;
            }

            html:not(.force-mobile) .why-item {
                grid-template-columns: 42px minmax(0, 1fr);
                gap: 12px;
                min-height: 44px;
            }

            html:not(.force-mobile) .why-item .round-icon {
                width: 38px;
                height: 38px;
            }

            html:not(.force-mobile) .why-item strong {
                font-size: 13.5px;
                line-height: 1.22;
            }

            html:not(.force-mobile) .tariff {
                padding: 13px 0 18px;
            }

            html:not(.force-mobile) .tariff-heading {
                margin-bottom: 14px;
                font-size: 21px;
            }

            html:not(.force-mobile) .tariff-card {
                min-height: 158px;
                padding: 12px 12px 13px;
            }

            html:not(.force-mobile) .tariff-card h3 {
                margin-bottom: 6px;
                font-size: 17px;
            }

            html:not(.force-mobile) .tariff-card img {
                height: 58px;
                margin-bottom: 8px;
            }

            html:not(.force-mobile) .price {
                margin-bottom: 9px;
                font-size: 27px;
            }

            html:not(.force-mobile) .price small {
                font-size: 12px;
            }

            html:not(.force-mobile) .trip-badge {
                min-width: 124px;
                height: 27px;
                font-size: 13px;
            }
        }

        .theme-page {
            background: #fbfcfa;
        }

        .tariff-page-hero {
            border-bottom: 1px solid #e7eee5;
            background:
                linear-gradient(120deg, rgba(246, 251, 244, .96), rgba(255, 255, 255, .92)),
                url('/assets/images/bg_hero2.jpg') center / cover no-repeat;
        }

        .tariff-page-hero .site-shell {
            min-height: 188px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 24px;
            padding: 36px 0;
        }

        .page-kicker {
            display: inline-flex;
            align-items: center;
            min-height: 27px;
            margin-bottom: 10px;
            padding: 0 12px;
            border-radius: 999px;
            color: #197b16;
            background: #eef9ec;
            font-size: 12px;
            font-weight: 900;
            text-transform: uppercase;
        }

        .tariff-page-hero h1 {
            margin: 0;
            color: #10141c;
            font-size: 42px;
            line-height: 1.05;
        }

        .tariff-page-hero p {
            max-width: 570px;
            margin: 10px 0 0;
            color: #4d5968;
            font-size: 16px;
            font-weight: 700;
            line-height: 1.5;
        }

        .page-cta {
            min-width: 154px;
            min-height: 44px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0 20px;
            border-radius: 8px;
            color: #fff;
            background: #197b16;
            box-shadow: 0 10px 22px rgba(25, 123, 22, .18);
            font-size: 14px;
            font-weight: 900;
        }

        .tariff-detail-section {
            padding: 26px 0 28px;
        }

        .tariff-detail-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 18px;
        }

        .tariff-detail-card,
        .tariff-rule-panel {
            border: 1px solid #dfe7dd;
            border-radius: 8px;
            background: #fff;
            box-shadow: 0 8px 24px rgba(16, 20, 28, .05);
        }

        .tariff-detail-card {
            min-height: 358px;
            display: flex;
            flex-direction: column;
            padding: 16px;
        }

        .tariff-vehicle-head {
            min-height: 118px;
            display: grid;
            grid-template-rows: 66px auto;
            gap: 8px;
            justify-items: center;
            text-align: center;
        }

        .tariff-vehicle-head img {
            max-width: 150px;
            max-height: 66px;
            object-fit: contain;
        }

        .tariff-vehicle-head h3 {
            margin: 0;
            color: #10141c;
            font-size: 18px;
            line-height: 1.15;
        }

        .tariff-vehicle-head p {
            margin: 5px auto 0;
            max-width: 215px;
            color: #4d5968;
            font-size: 12px;
            font-weight: 700;
            line-height: 1.35;
        }

        .tariff-specs {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 7px;
            margin: 15px 0;
        }

        .tariff-specs span {
            min-height: 48px;
            display: grid;
            place-items: center;
            padding: 6px;
            border-radius: 8px;
            color: #4d5968;
            background: #f5faf4;
            font-size: 10px;
            font-weight: 800;
            text-align: center;
            line-height: 1.2;
        }

        .tariff-specs strong {
            display: block;
            color: #10141c;
            font-size: 14px;
        }

        .tariff-price-row {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 9px;
            margin-top: auto;
        }

        .tariff-price-box {
            min-height: 116px;
            display: grid;
            align-content: center;
            justify-items: center;
            gap: 5px;
            padding: 10px 8px;
            border: 1px solid rgba(25, 123, 22, .22);
            border-radius: 8px;
            color: #197b16;
            background: #fbfffa;
            text-align: center;
        }

        .tariff-price-box.fill {
            color: #fff;
            background: #197b16;
        }

        .tariff-price-box span {
            font-size: 12px;
            font-weight: 900;
        }

        .tariff-price-box strong {
            color: currentColor;
            font-size: 25px;
            line-height: 1;
        }

        .tariff-price-box small {
            margin-left: 2px;
            color: currentColor;
            font-size: 11px;
        }

        .tariff-price-box em {
            color: currentColor;
            font-size: 10px;
            font-style: normal;
            font-weight: 800;
            line-height: 1.25;
        }

        .tariff-rules-section {
            padding: 0 0 34px;
        }

        .tariff-rules-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 18px;
        }

        .tariff-rule-panel {
            padding: 20px;
        }

        .tariff-rule-panel h2 {
            margin: 0 0 12px;
            color: #10141c;
            font-size: 20px;
            line-height: 1.2;
        }

        .tariff-rule-panel ul {
            display: grid;
            gap: 9px;
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .tariff-rule-panel li {
            position: relative;
            padding-left: 19px;
            color: #4d5968;
            font-size: 13px;
            font-weight: 700;
            line-height: 1.45;
        }

        .tariff-rule-panel li::before {
            content: "";
            position: absolute;
            left: 0;
            top: .58em;
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: #197b16;
        }

        .tariff-rule-panel a {
            color: #197b16;
            font-weight: 900;
        }

        @media (max-width: 1000px) {
            .tariff-detail-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 620px) {
            .tariff-page-hero .site-shell {
                min-height: 0;
                display: grid;
                padding: 24px 0;
            }

            .tariff-page-hero h1 {
                font-size: 34px;
            }

            .tariff-page-hero p {
                font-size: 13px;
            }

            .page-cta {
                width: 100%;
            }

            .tariff-detail-section {
                padding: 20px 0 22px;
            }

            .tariff-detail-grid,
            .tariff-rules-grid {
                grid-template-columns: 1fr;
            }

            .tariff-detail-card {
                min-height: 0;
                padding: 14px;
            }

            .tariff-vehicle-head {
                min-height: 104px;
            }

            .tariff-price-row {
                gap: 8px;
            }

            .tariff-price-box strong {
                font-size: 22px;
            }

            .tariff-rule-panel {
                padding: 16px;
            }
        }

        html.force-mobile .tariff-detail-grid,
        html.force-mobile .tariff-rules-grid {
            grid-template-columns: 1fr !important;
        }

        html.force-mobile .tariff-page-hero .site-shell {
            min-height: 0 !important;
            display: grid !important;
            padding: 24px 0 !important;
        }

        html.force-mobile .page-cta {
            width: 100% !important;
        }

/* Shared sticky header override */
.theme-header {
    position: sticky;
    top: 0;
    z-index: 220;
    background: #fff;
}

.theme-header .top-status,
.theme-header .top-nav {
    position: relative;
    top: auto;
}

.theme-header .top-nav {
    z-index: auto;
}

html.force-mobile .theme-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 220 !important;
}

html.force-mobile .theme-header .top-status,
html.force-mobile .theme-header .top-nav {
    position: relative !important;
    top: auto !important;
}

.logo-footer{
    width: 30px;
    display: block;
    background: white;
    border-radius: 60px;
}