* {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            font-family: "Sarabun", sans-serif;
            background: #0b0d10;
            color: #ffffff;
            line-height: 1.7;
        }

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

        img {
            max-width: 100%;
        }

        .container {
            width: min(1180px, 92%);
            margin: auto;
        }

        /* NAVBAR */

        header {
            position: sticky;
            top: 0;
            z-index: 999;
            background: rgba(10, 12, 15, .95);
            border-bottom: 1px solid #262b31;
            backdrop-filter: blur(12px);
        }

        .navbar {
            height: 72px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .logo {
            font-size: 26px;
            font-weight: 800;
        }

        .logo span {
            color: #f5b942;
        }

        nav {
            display: flex;
            gap: 28px;
            align-items: center;
        }

        nav a {
            color: #d6d8dc;
            font-size: 15px;
        }

        nav a:hover {
            color: #f5b942;
        }

        .nav-btn {
            background: #f5b942;
            color: #111;
            padding: 10px 20px;
            border-radius: 10px;
            font-weight: 700;
        }

        /* HERO */

        .hero {
            min-height: 720px;
            display: flex;
            align-items: center;
            position: relative;
            overflow: hidden;
            background: #0b0d10;
        }

        .hero-content {
            max-width: 720px;
        }

        .badge {
            display: inline-block;
            background: rgba(245,185,66,.12);
            color: #f5b942;
            border: 1px solid rgba(245,185,66,.30);
            padding: 7px 15px;
            border-radius: 30px;
            margin-bottom: 20px;
            font-size: 14px;
        }

        .hero h1 {
            font-size: clamp(42px, 7vw, 78px);
            line-height: 1.2;
            margin-bottom: 24px;
        }

        .hero h1 span {
            color: #f5b942;
        }

        .hero p {
            font-size: 20px;
            color: #d2d5da;
            max-width: 650px;
            margin-bottom: 34px;
        }

        .hero-buttons {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 14px 24px;
            border-radius: 10px;
            font-weight: 700;
            transition: .2s;
        }

        .btn-primary {
            background: #f5b942;
            color: #101010;
        }

        .btn-primary:hover {
            background: #ffc957;
            transform: translateY(-2px);
        }

        .btn-outline {
            border: 1px solid #555d66;
            color: #fff;
            background: rgba(255,255,255,.03);
        }

        .btn-outline:hover {
            border-color: #f5b942;
        }

        /* COMMON */

        section {
            padding: 90px 0;
        }

        .section-head {
            text-align: center;
            max-width: 720px;
            margin: 0 auto 50px;
        }

        .section-head small {
            color: #f5b942;
            font-weight: 700;
        }

        .section-head h2 {
            margin-top: 10px;
            font-size: clamp(30px, 5vw, 46px);
        }

        .section-head p {
            color: #aeb4bc;
            margin-top: 14px;
        }

        /* SERVICES */

        .services {
            background: #101318;
        }

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

        .card {
            background: #171b21;
            border: 1px solid #252b33;
            padding: 30px;
            border-radius: 18px;
            transition: .25s;
        }

        .card:hover {
            transform: translateY(-5px);
            border-color: #725b2a;
        }

        .icon {
            width: 52px;
            height: 52px;
            display: grid;
            place-items: center;
            background: rgba(245,185,66,.12);
            color: #f5b942;
            border-radius: 14px;
            font-size: 25px;
            margin-bottom: 20px;
        }

        .card h3 {
            margin-bottom: 10px;
        }

        .card p {
            color: #aeb4bc;
        }

        /* CARS */

        .cars-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 24px;
        }

        .car-card {
            overflow: hidden;
            background: #15191f;
            border: 1px solid #252b33;
            border-radius: 18px;
        }

        .car-image {
            height: 220px;
            background-size: cover;
            background-position: center;
        }

        .car-body {
            padding: 24px;
        }

        .car-body h3 {
            font-size: 22px;
            margin-bottom: 8px;
        }

        .car-body p {
            color: #aeb4bc;
        }

        .car-meta {
            display: flex;
            gap: 16px;
            margin-top: 18px;
            color: #d6d8dc;
            font-size: 14px;
        }

        /* WHY */

        .why {
            background: #101318;
        }

        .why-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 50px;
            align-items: center;
        }

        .why-box {
            background: #171b21;
            padding: 35px;
            border-radius: 18px;
            border: 1px solid #252b33;
        }

        .feature {
            display: flex;
            gap: 16px;
            margin-bottom: 24px;
        }

        .feature:last-child {
            margin-bottom: 0;
        }

        .check {
            width: 34px;
            height: 34px;
            flex: 0 0 34px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: #f5b942;
            color: #111;
            font-weight: 800;
        }

        .feature p {
            color: #aeb4bc;
        }

        /* PRICING */

        .pricing-grid {
            display: grid;
            grid-template-columns: repeat(3,1fr);
            gap: 24px;
        }

        .price-card {
            padding: 35px;
            border-radius: 18px;
            background: #15191f;
            border: 1px solid #272d35;
        }

        .price-card.featured {
            border-color: #f5b942;
            transform: translateY(-8px);
        }

        .price {
            font-size: 40px;
            font-weight: 800;
            margin: 18px 0;
            color: #f5b942;
        }

        .price small {
            font-size: 16px;
            color: #aeb4bc;
        }

        .price-card ul {
            list-style: none;
            margin: 22px 0 28px;
        }

        .price-card li {
            margin: 10px 0;
            color: #c8ccd1;
        }

        /* AREAS */

        .area-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 12px;
        }

        .area {
            padding: 11px 20px;
            background: #171b21;
            border: 1px solid #2a3038;
            border-radius: 30px;
        }

        /* STEPS */

        .steps {
            background: #101318;
        }

        .step-number {
            font-size: 44px;
            font-weight: 800;
            color: #f5b942;
            opacity: .8;
        }

        /* REVIEWS */

        .review-name {
            font-weight: 700;
            margin-top: 18px;
        }

        .stars {
            color: #f5b942;
            letter-spacing: 3px;
        }

        /* CONTACT */

        .contact-wrap {
            display: grid;
            grid-template-columns: .85fr 1.15fr;
            gap: 35px;
        }

        .contact-info,
        .contact-form {
            background: #15191f;
            padding: 35px;
            border-radius: 18px;
            border: 1px solid #272d35;
        }

        .contact-item {
            padding: 16px 0;
            border-bottom: 1px solid #272d35;
        }

        .contact-item:last-child {
            border-bottom: 0;
        }

        form {
            display: grid;
            gap: 15px;
        }

        input,
        textarea,
        select {
            width: 100%;
            border: 1px solid #303741;
            border-radius: 10px;
            background: #0f1216;
            color: #fff;
            padding: 14px 15px;
            font-family: inherit;
            font-size: 15px;
        }

        textarea {
            min-height: 130px;
            resize: vertical;
        }

        input:focus,
        textarea:focus,
        select:focus {
            outline: 0;
            border-color: #f5b942;
        }

        button {
            border: 0;
            cursor: pointer;
            font-family: inherit;
        }

        /* FAQ */

        .faq {
            background: #101318;
        }

        details {
            max-width: 850px;
            margin: 12px auto;
            background: #171b21;
            border: 1px solid #292f37;
            border-radius: 12px;
            padding: 20px 22px;
        }

        summary {
            cursor: pointer;
            font-weight: 700;
        }

        details p {
            margin-top: 14px;
            color: #aeb4bc;
        }

        /* CTA */

        .cta-box {
            background:
                linear-gradient(135deg, #f5b942, #d99b20);
            color: #111;
            padding: 60px;
            border-radius: 24px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 30px;
        }

        .cta-box h2 {
            font-size: 38px;
            line-height: 1.3;
        }

        .cta-box .btn {
            background: #111;
            color: #fff;
        }

        /* FOOTER */

        footer {
            background: #07090b;
            border-top: 1px solid #20252b;
            padding: 55px 0 25px;
        }

        .footer-grid {
            display: grid;
            grid-template-columns: 2fr 1fr 1fr;
            gap: 40px;
        }

        .footer-text {
            color: #8f969f;
            margin-top: 15px;
            max-width: 520px;
        }

        .footer-title {
            font-weight: 700;
            margin-bottom: 15px;
        }

        footer ul {
            list-style: none;
        }

        footer li {
            color: #9ba2aa;
            margin-bottom: 9px;
        }

        .copyright {
            margin-top: 40px;
            padding-top: 25px;
            border-top: 1px solid #20252b;
            text-align: center;
            color: #747b83;
            font-size: 14px;
        }

        /* FLOAT BUTTON */

        .float-contact {
            position: fixed;
            right: 20px;
            bottom: 20px;
            z-index: 1000;
            background: #19b55b;
            color: #fff;
            padding: 14px 20px;
            border-radius: 50px;
            box-shadow: 0 10px 30px rgba(0,0,0,.35);
            font-weight: 700;
        }

        /* MOBILE */

        @media (max-width: 900px) {

            .navbar nav a:not(.nav-btn) {
                display: none;
            }

            .grid-3,
            .cars-grid,
            .pricing-grid {
                grid-template-columns: 1fr;
            }

            .why-grid,
            .contact-wrap {
                grid-template-columns: 1fr;
            }

            .price-card.featured {
                transform: none;
            }

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

            .cta-box {
                flex-direction: column;
                align-items: flex-start;
                padding: 40px 25px;
            }

            .hero {
                min-height: 650px;
            }

            .hero p {
                font-size: 17px;
            }

        }

        @media (max-width: 520px) {

            section {
                padding: 70px 0;
            }

            .navbar {
                height: 65px;
            }

            .logo {
                font-size: 21px;
            }

            .nav-btn {
                padding: 8px 13px;
            }

            .card,
            .price-card,
            .contact-info,
            .contact-form {
                padding: 24px;
            }

            .float-contact {
                right: 12px;
                bottom: 12px;
            }

        }
/* Shared navigation, accessible links and service pages. */
section[id], main[id] { scroll-margin-top: 125px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #f5b942; outline-offset: 5px; }
.skip-link { position: fixed; top: -100px; left: 15px; padding: 12px 18px; background: #f5b942; color: #111; z-index: 2000; }
.skip-link:focus { top: 12px; }
.mobile-nav { display: none; }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(5,6,8,.95),rgba(5,6,8,.65),rgba(5,6,8,.3)); }
.hero > .container { position: relative; z-index: 1; }
.hero h1 .hero-location { display: block; font-size: clamp(24px,3.5vw,36px); color: #fff; margin-top: 16px; }
.car-image { display: block; width: 100%; object-fit: cover; }
.text-link, .service-links a, .card h3 a { color: #f5b942; text-decoration: underline; text-underline-offset: 4px; }
.area-copy { max-width: 850px; margin: 30px auto 0; color: #c8ccd1; }
.area-copy p + p { margin-top: 14px; }
.reading-width { max-width: 850px; }
.service-hero { padding: 45px 0 65px; }
.service-hero h1 { font-size: clamp(32px,4.3vw,54px); line-height: 1.35; margin-bottom: 24px; }
.service-intro { color: #c8ccd1; font-size: 18px; margin: 0 0 28px; }
.breadcrumb { display: block; margin-bottom: 28px; color: #aeb4bc; font-size: 14px; }
.breadcrumb a { display: inline; color: #f5b942; text-decoration: underline; }
.article-section { padding: 55px 0; }
.article-section h2, .reading-width > h2 { font-size: clamp(25px,3vw,34px); line-height: 1.4; margin-bottom: 20px; }
.article-section p { color: #c8ccd1; margin-bottom: 18px; }
.content-list { padding-left: 24px; color: #c8ccd1; }
.content-list li { margin: 12px 0; }
.service-links { padding-left: 22px; margin: 20px 0; }
.service-links li { margin: 12px 0; }
.related-heading { margin-top: 50px; }
footer { padding-bottom: 95px; }
.social-profiles { display: block; margin-top: 36px; }
.social-links { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; }
.social-links li { margin: 0; }
.social-links a { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 9px 16px; border: 1px solid #303741; border-radius: 10px; color: #d6d8dc; background: #15191f; }
.social-links a:hover { color: #f5b942; border-color: #f5b942; }
.social-links a span { color: #f5b942; }
.guide-article { padding: 44px 0 80px; }
.guide-article h1 { font-size: clamp(30px,4.2vw,50px); line-height: 1.4; margin-bottom: 24px; }
.guide-article h2 { font-size: clamp(24px,3vw,32px); line-height: 1.45; margin-bottom: 20px; }
.guide-article h3 { font-size: 21px; margin: 24px 0 12px; }
.guide-meta { color: #aeb4bc; font-size: 14px; margin-bottom: 18px; }
.guide-meta a { color: #f5b942; }
.guide-article p { margin-bottom: 18px; }
.guide-lead, .guide-section p { color: #c8ccd1; font-size: 18px; line-height: 1.85; }
.guide-cover { margin: 30px 0; }
.guide-cover img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px; }
.guide-cover figcaption { color: #aeb4bc; font-size: 14px; margin-top: 10px; }
.guide-answer, .guide-toc, .guide-cta { padding: 28px; margin: 28px 0; background: #15191f; border: 1px solid #303741; border-radius: 16px; }
.guide-answer { border-left: 4px solid #f5b942; }
.guide-answer p:last-child, .guide-cta p:last-child { margin-bottom: 0; }
.guide-toc { display: block; }
.guide-toc ol { padding-left: 24px; }
.guide-toc li { margin: 10px 0; }
.guide-toc a, .guide-section a:not(.btn) { color: #f5b942; text-decoration: underline; text-underline-offset: 4px; }
.guide-section { padding: 36px 0; border-bottom: 1px solid #252b33; }
.guide-section ul, .guide-section ol { padding-left: 24px; color: #c8ccd1; font-size: 17px; }
.guide-section li { margin: 12px 0; }
.guide-table-wrap { overflow-x: auto; margin: 24px 0; border: 1px solid #303741; border-radius: 12px; }
.guide-table { width: 100%; min-width: 600px; border-collapse: collapse; color: #c8ccd1; }
.guide-table caption { padding: 16px; text-align: left; font-weight: 700; color: #fff; }
.guide-table th, .guide-table td { text-align: left; vertical-align: top; padding: 16px; border-top: 1px solid #303741; }
.guide-table thead th { color: #f5b942; background: #171b21; }
.guide-table tbody th { color: #fff; width: 24%; }
.guide-quote { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; line-height: 1.9; background: #15191f; color: #d6d8dc; border: 1px solid #303741; border-radius: 12px; padding: 24px; }
.guide-card { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); overflow: hidden; border: 1px solid #303741; border-radius: 18px; background: #15191f; }
.guide-card-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.guide-card-copy { padding: 32px; }
.guide-card-copy h3 { font-size: clamp(22px,2.5vw,30px); line-height: 1.5; margin-bottom: 14px; }
.guide-card-copy p:not(.guide-meta) { color: #c8ccd1; margin-bottom: 20px; }
.guide-card-copy h3 a:hover { color: #f5b942; }
@media (max-width: 720px) {
    .guide-card { grid-template-columns: 1fr; }
    .guide-card-image img { aspect-ratio: 16 / 9; height: auto; }
    .guide-card-copy, .guide-answer, .guide-toc, .guide-cta { padding: 22px; }
    .guide-article .hero-buttons .btn { width: 100%; }
}
.partner-ad { padding: 0 0 64px; scroll-margin-top: 140px; }
.partner-ad-card { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; align-items: center; gap: 24px; padding: 30px; border: 1px solid #284337; border-radius: 18px; background: linear-gradient(120deg,#13231b,#11171b); }
.partner-ad-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 16px; background: #183e2a; color: #76e3a1; }
.partner-ad-label { display: inline-block; margin-bottom: 8px; color: #aeb4bc; font-size: 12px; }
.partner-ad-copy h2 { margin-bottom: 8px; font-size: clamp(20px,2.4vw,27px); line-height: 1.4; }
.partner-ad-copy p { max-width: 650px; color: #becac3; font-size: 15px; }
.partner-ad-brand { display: block; margin-top: 10px; color: #76e3a1; font-size: 14px; font-weight: 700; }
.partner-ad-button { gap: 10px; background: #76e3a1; color: #0b2012; white-space: nowrap; }
.partner-ad-button:hover { background: #9befba; }
@media (max-width: 720px) {
    .partner-ad-card { grid-template-columns: 48px minmax(0,1fr); align-items: start; gap: 18px; padding: 24px; }
    .partner-ad-icon { width: 48px; height: 48px; border-radius: 12px; }
    .partner-ad-icon svg { width: 28px; height: 28px; }
    .partner-ad-button { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 900px) {
    .mobile-nav { display: flex; gap: 0; justify-content: space-between; padding: 8px 0 10px; }
    .mobile-nav a { display: inline-block; padding: 6px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition: none !important; animation: none !important; }
}