/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */

@layer properties {
    @supports (((-webkit-hyphens: none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {
        *, :before, :after, ::backdrop {
            --tw-translate-x:0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-scale-x: 1;
            --tw-scale-y: 1;
            --tw-scale-z: 1;
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-color: initial;
            --tw-shadow-alpha: 100%;
            --tw-inset-shadow: 0 0 #0000;
            --tw-inset-shadow-color: initial;
            --tw-inset-shadow-alpha: 100%;
            --tw-ring-color: initial;
            --tw-ring-shadow: 0 0 #0000;
            --tw-inset-ring-color: initial;
            --tw-inset-ring-shadow: 0 0 #0000;
            --tw-ring-inset: initial;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-offset-shadow: 0 0 #0000;
            --tw-outline-style: solid;
            --tw-blur: initial;
            --tw-brightness: initial;
            --tw-contrast: initial;
            --tw-grayscale: initial;
            --tw-hue-rotate: initial;
            --tw-invert: initial;
            --tw-opacity: initial;
            --tw-saturate: initial;
            --tw-sepia: initial;
            --tw-drop-shadow: initial;
            --tw-drop-shadow-color: initial;
            --tw-drop-shadow-alpha: 100%;
            --tw-drop-shadow-size: initial;
            --tw-backdrop-blur: initial;
            --tw-backdrop-brightness: initial;
            --tw-backdrop-contrast: initial;
            --tw-backdrop-grayscale: initial;
            --tw-backdrop-hue-rotate: initial;
            --tw-backdrop-invert: initial;
            --tw-backdrop-opacity: initial;
            --tw-backdrop-saturate: initial;
            --tw-backdrop-sepia: initial;
            --tw-duration: initial;
            --tw-ease: initial;
            --tw-content: ""
        }
    }
}

@layer theme {
    :root,
    :host {
        --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
        --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        --color-black: #0d1416;
        --color-white: #fff;
        --spacing: .25rem;
        --text-xs: .75rem;
        --text-xs--line-height: calc(1/.75);
        --text-sm: .875rem;
        --text-sm--line-height: calc(1.25/.875);
        --text-base: 1rem;
        --text-base--line-height: calc(1.5/1);
        --text-lg: 1.125rem;
        --text-lg--line-height: calc(1.75/1.125);
        --text-xl: 1.25rem;
        --text-xl--line-height: calc(1.75/1.25);
        --text-2xl: 1.5rem;
        --text-2xl--line-height: calc(2/1.5);
        --text-3xl: 1.875rem;
        --text-3xl--line-height: calc(2.25/1.875);
        --text-4xl: 2.25rem;
        --text-4xl--line-height: calc(2.5/2.25);
        --text-5xl: 3rem;
        --text-5xl--line-height: 1;
        --text-6xl: 3.75rem;
        --text-6xl--line-height: 1;
        --font-weight-normal: 400;
        --font-weight-medium: 500;
        --font-weight-semibold: 600;
        --font-weight-bold: 700;
        --ease-in-out: cubic-bezier(.4, 0, .2, 1);
        --animate-spin: spin 1s linear infinite;
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
        --default-font-family: var(--font-sans);
        --default-mono-font-family: var(--font-mono);
        --text-13: 13px;
        --text-15: 15px;
        --color-body: #404040;
        --color-dark: #000;
        --color-primary: #67C761;
        --font-body: "Figtree", sans-serif
    }
}

@layer base {
    *,
    :after,
    :before,
    ::backdrop {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }
    ::file-selector-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }
    html,
    :host {
        -webkit-text-size-adjust: 100%;
        tab-size: 4;
        line-height: 1.5;
        font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
        font-feature-settings: var(--default-font-feature-settings, normal);
        font-variation-settings: var(--default-font-variation-settings, normal);
        -webkit-tap-highlight-color: transparent
    }
    hr {
        height: 0;
        color: inherit;
        border-top-width: 1px
    }
    abbr:where([title]) {
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-size: inherit;
        font-weight: inherit
    }
    a {
        color: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        text-decoration: inherit
    }
    b,
    strong {
        font-weight: bolder
    }
    code,
    kbd,
    samp,
    pre {
        font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
        font-feature-settings: var(--default-mono-font-feature-settings, normal);
        font-variation-settings: var(--default-mono-font-variation-settings, normal);
        font-size: 1em
    }
    small {
        font-size: 80%
    }
    sub,
    sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }
    sub {
        bottom: -.25em
    }
    sup {
        top: -.5em
    }
    table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse
    }
    :-moz-focusring {
        outline: auto
    }
    progress {
        vertical-align: baseline
    }
    summary {
        display: list-item
    }
    ol,
    ul,
    menu {
        list-style: none
    }
    img,
    svg,
    video,
    canvas,
    audio,
    iframe,
    embed,
    object {
        vertical-align: middle;
        display: block
    }
    img,
    video {
        max-width: 100%;
        height: auto
    }
    button,
    input,
    select,
    optgroup,
    textarea {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }
    ::file-selector-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }
    :where(select:is([multiple], [size])) optgroup {
        font-weight: bolder
    }
    :where(select:is([multiple], [size])) optgroup option {
        padding-inline-start: 20px
    }
    ::file-selector-button {
        margin-inline-end: 4px
    }
    ::placeholder {
        opacity: 1
    }
    @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
        ::placeholder {
            color: currentColor
        }
        @supports (color:color-mix(in lab, red, red)) {
            ::placeholder {
                color: color-mix(in oklab, currentcolor 50%, transparent)
            }
        }
    }
    textarea {
        resize: vertical
    }
    ::-webkit-search-decoration {
        -webkit-appearance: none
    }
    ::-webkit-date-and-time-value {
        min-height: 1lh;
        text-align: inherit
    }
    ::-webkit-datetime-edit {
        display: inline-flex
    }
    ::-webkit-datetime-edit-fields-wrapper {
        padding: 0
    }
    ::-webkit-datetime-edit {
        padding-block: 0
    }
    ::-webkit-datetime-edit-year-field {
        padding-block: 0
    }
    ::-webkit-datetime-edit-month-field {
        padding-block: 0
    }
    ::-webkit-datetime-edit-day-field {
        padding-block: 0
    }
    ::-webkit-datetime-edit-hour-field {
        padding-block: 0
    }
    ::-webkit-datetime-edit-minute-field {
        padding-block: 0
    }
    ::-webkit-datetime-edit-second-field {
        padding-block: 0
    }
    ::-webkit-datetime-edit-millisecond-field {
        padding-block: 0
    }
    ::-webkit-datetime-edit-meridiem-field {
        padding-block: 0
    }
    ::-webkit-calendar-picker-indicator {
        line-height: 1
    }
    :-moz-ui-invalid {
        box-shadow: none
    }
    button,
    input:where([type=button], [type=reset], [type=submit]) {
        appearance: button
    }
    ::file-selector-button {
        appearance: button
    }
    ::-webkit-inner-spin-button {
        height: auto
    }
    ::-webkit-outer-spin-button {
        height: auto
    }
    [hidden]:where(:not([hidden=until-found])) {
        display: none !important
    }
}

@layer components;
@layer utilities {
    .invisible {
        visibility: hidden
    }
    .visible {
        visibility: visible
    }
    .\!fixed {
        position: fixed !important
    }
    .absolute {
        position: absolute
    }
    .fixed {
        position: fixed
    }
    .relative {
        position: relative
    }
    .static {
        position: static
    }
    .inset-0 {
        inset: calc(var(--spacing)*0)
    }
    .\!top-0 {
        top: calc(var(--spacing)*0) !important
    }
    .-top-\[5px\] {
        top: -5px
    }
    .top-0 {
        top: calc(var(--spacing)*0)
    }
    .top-1\/2 {
        top: 50%
    }
    .top-\[2px\] {
        top: 2px
    }
    .top-\[4px\] {
        top: 4px
    }
    .top-\[10px\] {
        top: 10px
    }
    .top-\[20px\] {
        top: 20px
    }
    .top-\[25px\] {
        top: 25px
    }
    .top-\[35px\] {
        top: 35px
    }
    .top-\[95px\] {
        top: 95px
    }
    .top-\[215px\] {
        top: 215px
    }
    .top-full {
        top: 100%
    }
    .top-px {
        top: 1px
    }
    .right-0 {
        right: calc(var(--spacing)*0)
    }
    .bottom-0 {
        bottom: calc(var(--spacing)*0)
    }
    .bottom-\[8px\] {
        bottom: 8px
    }
    .bottom-\[10px\] {
        bottom: 10px
    }
    .bottom-\[20px\] {
        bottom: 20px
    }
    .bottom-\[65px\] {
        bottom: 65px
    }
    .left-0 {
        left: calc(var(--spacing)*0)
    }
    .left-1\/2 {
        left: 50%
    }
    .-z-\[1\] {
        z-index: calc(1*-1)
    }
    .z-\[1\] {
        z-index: 1
    }
    .z-\[2\] {
        z-index: 2
    }
    .z-\[9\] {
        z-index: 9
    }
    .z-\[999\] {
        z-index: 999
    }
    .col-span-2 {
        grid-column: span 2/span 2
    }
    .col-start-1 {
        grid-column-start: 1
    }
    .row-start-1 {
        grid-row-start: 1
    }
    .container {
        width: 100%
    }
    @media (min-width:40rem) {
        .container {
            max-width: 40rem
        }
    }
    @media (min-width:48rem) {
        .container {
            max-width: 48rem
        }
    }
    @media (min-width:64rem) {
        .container {
            max-width: 64rem
        }
    }
    @media (min-width:80rem) {
        .container {
            max-width: 80rem
        }
    }
    @media (min-width:96rem) {
        .container {
            max-width: 96rem
        }
    }
    .mx-auto {
        margin-inline: auto
    }
    .my-\[5px\] {
        margin-block: 5px
    }
    .my-\[15px\] {
        margin-block: 15px
    }
    .my-\[20px\] {
        margin-block: 20px
    }
    .my-\[25px\] {
        margin-block: 25px
    }
    .my-\[30px\] {
        margin-block: 30px
    }
    .my-\[70px\] {
        margin-block: 70px
    }
    .-mt-\[5px\] {
        margin-top: -5px
    }
    .-mt-px {
        margin-top: -1px
    }
    .mt-\[5px\] {
        margin-top: 5px
    }
    .mt-\[8px\] {
        margin-top: 8px
    }
    .mt-\[10px\] {
        margin-top: 10px
    }
    .mt-\[15px\] {
        margin-top: 15px
    }
    .mt-\[20px\] {
        margin-top: 20px
    }
    .mt-\[25px\] {
        margin-top: 25px
    }
    .mt-\[30px\] {
        margin-top: 30px
    }
    .mt-\[50px\] {
        margin-top: 50px
    }
    .mt-\[60px\] {
        margin-top: 60px
    }
    .mt-px {
        margin-top: 1px
    }
    .\!mb-0 {
        margin-bottom: calc(var(--spacing)*0) !important
    }
    .mb-0 {
        margin-bottom: calc(var(--spacing)*0)
    }
    .mb-\[3px\] {
        margin-bottom: 3px
    }
    .mb-\[4px\] {
        margin-bottom: 4px
    }
    .mb-\[5px\] {
        margin-bottom: 5px
    }
    .mb-\[6px\] {
        margin-bottom: 6px
    }
    .mb-\[7px\] {
        margin-bottom: 7px
    }
    .mb-\[8px\] {
        margin-bottom: 8px
    }
    .mb-\[9px\] {
        margin-bottom: 9px
    }
    .mb-\[10px\] {
        margin-bottom: 10px
    }
    .mb-\[11px\] {
        margin-bottom: 11px
    }
    .mb-\[12px\] {
        margin-bottom: 12px
    }
    .mb-\[13px\] {
        margin-bottom: 13px
    }
    .mb-\[15px\] {
        margin-bottom: 15px
    }
    .mb-\[17px\] {
        margin-bottom: 17px
    }
    .mb-\[18px\] {
        margin-bottom: 18px
    }
    .mb-\[20px\] {
        margin-bottom: 20px
    }
    .mb-\[25px\] {
        margin-bottom: 25px
    }
    .mb-\[30px\] {
        margin-bottom: 30px
    }
    .\!hidden {
        display: none !important
    }
    .block {
        display: block
    }
    .flex {
        display: flex
    }
    .grid {
        display: grid
    }
    .hidden {
        display: none
    }
    .inline {
        display: inline
    }
    .inline-block {
        display: inline-block
    }
    .table {
        display: table
    }
    .h-1 {
        height: calc(var(--spacing)*1)
    }
    .h-2 {
        height: calc(var(--spacing)*2)
    }
    .h-3 {
        height: calc(var(--spacing)*3)
    }
    .h-4 {
        height: calc(var(--spacing)*4)
    }
    .h-5 {
        height: calc(var(--spacing)*5)
    }
    .h-6 {
        height: calc(var(--spacing)*6)
    }
    .h-\[3px\] {
        height: 3px
    }
    .h-\[5px\] {
        height: 5px
    }
    .h-\[8px\] {
        height: 8px
    }
    .h-\[12px\] {
        height: 12px
    }
    .h-\[14px\] {
        height: 14px
    }
    .h-\[15px\] {
        height: 15px
    }
    .h-\[17px\] {
        height: 17px
    }
    .h-\[18px\] {
        height: 18px
    }
    .h-\[20px\] {
        height: 20px
    }
    .h-\[30px\] {
        height: 30px
    }
    .h-\[35px\] {
        height: 35px
    }
    .h-\[40px\] {
        height: 40px
    }
    .h-\[42px\] {
        height: 42px
    }
    .h-\[45px\] {
        height: 45px
    }
    .h-\[50px\] {
        height: 50px
    }
    .h-\[60px\] {
        height: 60px
    }
    .h-\[65px\] {
        height: 65px
    }
    .h-\[75px\] {
        height: 75px
    }
    .h-\[90px\] {
        height: 90px
    }
    .h-\[100px\] {
        height: 100px
    }
    .h-\[110px\] {
        height: 110px
    }
    .h-\[150px\] {
        height: 150px
    }
    .h-\[250px\] {
        height: 250px
    }
    .h-\[360px\] {
        height: 360px
    }
    .h-\[500px\] {
        height: 500px
    }
    .h-full {
        height: 100%
    }
    .h-px {
        height: 1px
    }
    .h-screen {
        height: 100vh
    }
    .min-h-screen {
        min-height: 100vh
    }
    .w-\[5px\] {
        width: 5px
    }
    .w-\[8px\] {
        width: 8px
    }
    .w-\[14px\] {
        width: 14px
    }
    .w-\[18px\] {
        width: 18px
    }
    .w-\[20px\] {
        width: 20px
    }
    .w-\[30px\] {
        width: 30px
    }
    .w-\[35px\] {
        width: 35px
    }
    .w-\[40px\] {
        width: 40px
    }
    .w-\[41px\] {
        width: 41px
    }
    .w-\[45px\] {
        width: 45px
    }
    .w-\[50px\] {
        width: 50px
    }
    .w-\[52px\] {
        width: 52px
    }
    .w-\[60px\] {
        width: 60px
    }
    .w-\[65px\] {
        width: 65px
    }
    .w-\[75px\] {
        width: 75px
    }
    .w-\[80px\] {
        width: 80px
    }
    .w-\[90px\] {
        width: 90px
    }
    .w-\[100px\] {
        width: 100px
    }
    .w-\[120px\] {
        width: 120px
    }
    .w-\[144px\] {
        width: 144px
    }
    .w-\[184px\] {
        width: 184px
    }
    .w-\[240px\] {
        width: 240px
    }
    .w-\[380px\] {
        width: 380px
    }
    .w-full {
        width: 100%
    }
    .w-px {
        width: 1px
    }
    .max-w-\[425px\] {
        max-width: 425px
    }
    .max-w-\[450px\] {
        max-width: 450px
    }
    .min-w-\[270px\] {
        min-width: 270px
    }
    .flex-1 {
        flex: 1
    }
    .flex-none {
        flex: none
    }
    .grow {
        flex-grow: 1
    }
    .basis-auto {
        flex-basis: auto
    }
    .basis-full {
        flex-basis: 100%
    }
    .border-collapse {
        border-collapse: collapse
    }
    .translate-2 {
        --tw-translate-x: calc(var(--spacing)*2);
        --tw-translate-y: calc(var(--spacing)*2);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }
    .-translate-x-1\/2 {
        --tw-translate-x: calc(calc(1/2*100%)*-1);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }
    .-translate-y-1 {
        --tw-translate-y: calc(var(--spacing)*-1);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }
    .-translate-y-1\/2 {
        --tw-translate-y: calc(calc(1/2*100%)*-1);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }
    .scale-75 {
        --tw-scale-x: 75%;
        --tw-scale-y: 75%;
        --tw-scale-z: 75%;
        scale: var(--tw-scale-x)var(--tw-scale-y)
    }
    .-rotate-\[5deg\] {
        rotate: -5deg
    }
    .rotate-45 {
        rotate: 45deg
    }
    .transform {
        transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, )
    }
    .animate-spin {
        animation: var(--animate-spin)
    }
    .cursor-grabbing {
        cursor: grabbing
    }
    .cursor-pointer {
        cursor: pointer
    }
    .resize {
        resize: both
    }
    .list-inside {
        list-style-position: inside
    }
    .list-decimal {
        list-style-type: decimal
    }
    .list-disc {
        list-style-type: disc
    }
    .appearance-none {
        appearance: none
    }
    .grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }
    .grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
    .grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
    .flex-col {
        flex-direction: column
    }
    .flex-row {
        flex-direction: row
    }
    .flex-wrap {
        flex-wrap: wrap
    }
    .items-center {
        align-items: center
    }
    .items-end {
        align-items: flex-end
    }
    .\!justify-start {
        justify-content: flex-start !important
    }
    .justify-between {
        justify-content: space-between
    }
    .justify-center {
        justify-content: center
    }
    .gap-\[2px\] {
        gap: 2px
    }
    .gap-\[5px\] {
        gap: 5px
    }
    .gap-\[7px\] {
        gap: 7px
    }
    .gap-\[8px\] {
        gap: 8px
    }
    .gap-\[10px\] {
        gap: 10px
    }
    .gap-\[12px\] {
        gap: 12px
    }
    .gap-\[15px\] {
        gap: 15px
    }
    .gap-\[18px\] {
        gap: 18px
    }
    .gap-\[20px\] {
        gap: 20px
    }
    .gap-\[25px\] {
        gap: 25px
    }
    .gap-px {
        gap: 1px
    }
    .gap-x-\[15px\] {
        column-gap: 15px
    }
    .gap-x-\[20px\] {
        column-gap: 20px
    }
    .gap-x-\[25px\] {
        column-gap: 25px
    }
    .gap-y-\[10px\] {
        row-gap: 10px
    }
    .gap-y-\[30px\] {
        row-gap: 30px
    }
    .overflow-hidden {
        overflow: hidden
    }
    .overflow-x-auto {
        overflow-x: auto
    }
    .overflow-y-auto {
        overflow-y: auto
    }
    .overflow-y-scroll {
        overflow-y: scroll
    }
    .rounded-\[3px\] {
        border-radius: 3px
    }
    .rounded-\[5px\] {
        border-radius: 5px
    }
    .rounded-\[10px\] {
        border-radius: 10px
    }
    .rounded-\[15px\] {
        border-radius: 15px
    }
    .rounded-\[30px\] {
        border-radius: 30px
    }
    .rounded-full {
        border-radius: 3.40282e38px
    }
    .rounded-t-\[5px\] {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px
    }
    .border {
        border-style: var(--tw-border-style);
        border-width: 1px
    }
    .border-0 {
        border-style: var(--tw-border-style);
        border-width: 0
    }
    .border-\[2px\] {
        border-style: var(--tw-border-style);
        border-width: 2px
    }
    .border-\[3px\] {
        border-style: var(--tw-border-style);
        border-width: 3px
    }
    .border-\[5px\] {
        border-style: var(--tw-border-style);
        border-width: 5px
    }
    .border-y {
        border-block-style: var(--tw-border-style);
        border-block-width: 1px
    }
    .border-t {
        border-top-style: var(--tw-border-style);
        border-top-width: 1px
    }
    .border-r {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }
    .border-b {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px
    }
    .border-l {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }
    .border-dashed {
        --tw-border-style: dashed;
        border-style: dashed
    }
    .\!border-\[\#D9D9D9\] {
        border-color: #d9d9d9 !important
    }
    .\!border-\[\#D9D9D9\]\/30 {
        border-color: oklab(88.5305% 2.98023e-8 0/.3) !important
    }
    .\!border-\[\#d9d9d9\] {
        border-color: #d9d9d9 !important
    }
    .\!border-body\/20 {
        border-color: #40404033 !important
    }
    @supports (color:color-mix(in lab, red, red)) {
        .\!border-body\/20 {
            border-color: color-mix(in oklab, var(--color-body)20%, transparent) !important
        }
    }
    .\!border-dark {
        border-color: var(--color-dark) !important
    }
    .\!border-white\/10 {
        border-color: #ffffff1a !important
    }
    @supports (color:color-mix(in lab, red, red)) {
        .\!border-white\/10 {
            border-color: color-mix(in oklab, var(--color-white)10%, transparent) !important
        }
    }
    .\!border-white\/20 {
        border-color: #fff3 !important
    }
    @supports (color:color-mix(in lab, red, red)) {
        .\!border-white\/20 {
            border-color: color-mix(in oklab, var(--color-white)20%, transparent) !important
        }
    }
    .border-\[\#0D1416\] {
        border-color: #0d1416
    }
    .border-\[\#292F31\] {
        border-color: #292f31
    }
    .border-\[\#454B4D\]\/50 {
        border-color: oklab(40.8074% -.0065593 -.00544155/.5)
    }
    .border-\[\#404040\]\/10 {
        border-color: oklab(37.1495% -4.47035e-8 0/.1)
    }
    .border-\[\#A7F0BA\] {
        border-color: #a7f0ba
    }
    .border-\[\#CCCCCC\] {
        border-color: #ccc
    }
    .border-\[\#D9D9D9\] {
        border-color: #d9d9d9
    }
    .border-\[\#D9D9D9\]\/30 {
        border-color: oklab(88.5305% 2.98023e-8 0/.3)
    }
    .border-\[\#D9D9D9\]\/50 {
        border-color: oklab(88.5305% 2.98023e-8 0/.5)
    }
    .border-\[\#E8DAFF\] {
        border-color: #e8daff
    }
    .border-\[\#ECECEC\] {
        border-color: #ececec
    }
    .border-\[\#E3F5E4\] {
        border-color: #e3f5e4
    }
    .border-\[\#FDDC69\] {
        border-color: #fddc69
    }
    .border-\[\#D7F5D9\] {
        border-color: #d7f5d9
    }
    .border-\[\#FFD9BE\] {
        border-color: #ffd9be
    }
    .border-\[\#d9d9d9\] {
        border-color: #d9d9d9
    }
    .border-black {
        border-color: var(--color-black)
    }
    .border-black\/5 {
        border-color: #0d14160d
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-black\/5 {
            border-color: color-mix(in oklab, var(--color-black)5%, transparent)
        }
    }
    .border-black\/10 {
        border-color: #0d14161a
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-black\/10 {
            border-color: color-mix(in oklab, var(--color-black)10%, transparent)
        }
    }
    .border-body\/10 {
        border-color: #4040401a
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-body\/10 {
            border-color: color-mix(in oklab, var(--color-body)10%, transparent)
        }
    }
    .border-body\/20 {
        border-color: #40404033
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-body\/20 {
            border-color: color-mix(in oklab, var(--color-body)20%, transparent)
        }
    }
    .border-primary {
        border-color: var(--color-primary)
    }
    .border-white {
        border-color: var(--color-white)
    }
    .border-white\/5 {
        border-color: #ffffff0d
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-white\/5 {
            border-color: color-mix(in oklab, var(--color-white)5%, transparent)
        }
    }
    .border-white\/10 {
        border-color: #ffffff1a
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-white\/10 {
            border-color: color-mix(in oklab, var(--color-white)10%, transparent)
        }
    }
    .border-white\/20 {
        border-color: #fff3
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-white\/20 {
            border-color: color-mix(in oklab, var(--color-white)20%, transparent)
        }
    }
    .border-white\/30 {
        border-color: #ffffff4d
    }
    @supports (color:color-mix(in lab, red, red)) {
        .border-white\/30 {
            border-color: color-mix(in oklab, var(--color-white)30%, transparent)
        }
    }
    .\!border-t-primary {
        border-top-color: var(--color-primary) !important
    }
    .\!bg-\[\#FBFBFB\] {
        background-color: #fbfbfb !important
    }
    .\!bg-\[\#f4f4f4\] {
        background-color: #f4f4f4 !important
    }
    .\!bg-black {
        background-color: var(--color-black) !important
    }
    .\!bg-dark {
        background-color: var(--color-dark) !important
    }
    .\!bg-transparent {
        background-color: #0000 !important
    }
    .\!bg-white {
        background-color: var(--color-white) !important
    }
    .bg-\[\#24A148\] {
        background-color: #24a148
    }
    .bg-\[\#171E20\] {
        background-color: #171e20
    }
    .bg-\[\#4589FF\] {
        background-color: #4589ff
    }
    .bg-\[\#CCE9EB\] {
        background-color: #cce9eb
    }
    .bg-\[\#D9D9D9\] {
        background-color: #d9d9d9
    }
    .bg-\[\#D9D9D9\]\/20 {
        background-color: oklab(88.5305% 2.98023e-8 0/.2)
    }
    .bg-\[\#DEFBE6\] {
        background-color: #defbe6
    }
    .bg-\[\#E6F4F5\] {
        background-color: #e6f4f5
    }
    .bg-\[\#E8DAFF\] {
        background-color: #e8daff
    }
    .bg-\[\#E9F0E5\] {
        background-color: #e9f0e5
    }
    .bg-\[\#E9F0E5\]\/40 {
        background-color: oklab(94.681% -.0113359 .011811/.4)
    }
    .bg-\[\#EFEFF0\] {
        background-color: #efeff0
    }
    .bg-\[\#F4F4F4\] {
        background-color: #f4f4f4
    }
    .bg-\[\#E3F5E4\] {
        background-color: #e3f5e4
    }
    .bg-\[\#F6F2FF\] {
        background-color: #f6f2ff
    }
    .bg-\[\#F9CF2E\] {
        background-color: #f9cf2e
    }
    .bg-\[\#FCF4D6\] {
        background-color: #fcf4d6
    }
    .bg-\[\#67C761\] {
        background-color: #67C761
    }
    .bg-\[\#FFD6BB\] {
        background-color: #ffd6bb
    }
    .bg-\[\#D7F5D9\] {
        background-color: #d7f5d9
    }
    .bg-\[\#FFD9BE\] {
        background-color: #ffd9be
    }
    .bg-\[\#F1FFF2\] {
        background-color: #f1fff2
    }
    .bg-\[\#FFF2E8\] {
        background-color: #fff2e8
    }
    .bg-\[\#f4f4f4\] {
        background-color: #f4f4f4
    }
    .bg-black {
        background-color: var(--color-black)
    }
    .bg-body\/15 {
        background-color: #40404026
    }
    @supports (color:color-mix(in lab, red, red)) {
        .bg-body\/15 {
            background-color: color-mix(in oklab, var(--color-body)15%, transparent)
        }
    }
    .bg-body\/20 {
        background-color: #40404033
    }
    @supports (color:color-mix(in lab, red, red)) {
        .bg-body\/20 {
            background-color: color-mix(in oklab, var(--color-body)20%, transparent)
        }
    }
    .bg-dark {
        background-color: var(--color-dark)
    }
    .bg-dark\/40 {
        background-color: #0006
    }
    @supports (color:color-mix(in lab, red, red)) {
        .bg-dark\/40 {
            background-color: color-mix(in oklab, var(--color-dark)40%, transparent)
        }
    }
    .bg-dark\/90 {
        background-color: #000000e6
    }
    @supports (color:color-mix(in lab, red, red)) {
        .bg-dark\/90 {
            background-color: color-mix(in oklab, var(--color-dark)90%, transparent)
        }
    }
    .bg-primary {
        background-color: var(--color-primary)
    }
    .bg-transparent {
        background-color: #0000
    }
    .bg-white {
        background-color: var(--color-white)
    }
    .bg-white\/5 {
        background-color: #ffffff0d
    }
    @supports (color:color-mix(in lab, red, red)) {
        .bg-white\/5 {
            background-color: color-mix(in oklab, var(--color-white)5%, transparent)
        }
    }
    .bg-white\/30 {
        background-color: #ffffff4d
    }
    @supports (color:color-mix(in lab, red, red)) {
        .bg-white\/30 {
            background-color: color-mix(in oklab, var(--color-white)30%, transparent)
        }
    }
    .bg-cover {
        background-size: cover
    }
    .bg-center {
        background-position: 50%
    }
    .bg-no-repeat {
        background-repeat: no-repeat
    }
    .object-cover {
        object-fit: cover
    }
    .p-\[10px\] {
        padding: 10px
    }
    .p-\[15px\] {
        padding: 15px
    }
    .p-\[20px\] {
        padding: 20px
    }
    .p-px {
        padding: 1px
    }
    .px-\[8px\] {
        padding-inline: 8px
    }
    .px-\[10px\] {
        padding-inline: 10px
    }
    .px-\[12px\] {
        padding-inline: 12px
    }
    .px-\[15px\] {
        padding-inline: 15px
    }
    .px-\[20px\] {
        padding-inline: 20px
    }
    .px-\[25px\] {
        padding-inline: 25px
    }
    .px-\[50px\] {
        padding-inline: 50px
    }
    .py-\[2px\] {
        padding-block: 2px
    }
    .py-\[4px\] {
        padding-block: 4px
    }
    .py-\[5px\] {
        padding-block: 5px
    }
    .py-\[6px\] {
        padding-block: 6px
    }
    .py-\[8px\] {
        padding-block: 8px
    }
    .py-\[10px\] {
        padding-block: 10px
    }
    .py-\[13px\] {
        padding-block: 13px
    }
    .py-\[14px\] {
        padding-block: 14px
    }
    .py-\[15px\] {
        padding-block: 15px
    }
    .py-\[20px\] {
        padding-block: 20px
    }
    .py-\[25px\] {
        padding-block: 25px
    }
    .py-\[30px\] {
        padding-block: 30px
    }
    .py-\[60px\] {
        padding-block: 60px
    }
    .py-\[80px\] {
        padding-block: 80px
    }
    .py-px {
        padding-block: 1px
    }
    .\!pt-0 {
        padding-top: calc(var(--spacing)*0) !important
    }
    .pt-\[5px\] {
        padding-top: 5px
    }
    .pt-\[15px\] {
        padding-top: 15px
    }
    .pt-\[55px\] {
        padding-top: 55px
    }
    .pt-\[60px\] {
        padding-top: 60px
    }
    .pt-\[80px\] {
        padding-top: 80px
    }
    .pt-\[140px\] {
        padding-top: 140px
    }
    .pt-\[165px\] {
        padding-top: 165px
    }
    .pt-\[200px\] {
        padding-top: 200px
    }
    .\!pb-0 {
        padding-bottom: calc(var(--spacing)*0) !important
    }
    .pb-\[8px\] {
        padding-bottom: 8px
    }
    .pb-\[10px\] {
        padding-bottom: 10px
    }
    .pb-\[12px\] {
        padding-bottom: 12px
    }
    .pb-\[15px\] {
        padding-bottom: 15px
    }
    .pb-\[20px\] {
        padding-bottom: 20px
    }
    .pb-\[40px\] {
        padding-bottom: 40px
    }
    .pb-\[60px\] {
        padding-bottom: 60px
    }
    .pb-\[100px\] {
        padding-bottom: 100px
    }
    .text-center {
        text-align: center
    }
    .align-bottom {
        vertical-align: bottom
    }
    .align-middle {
        vertical-align: middle
    }
    .align-top {
        vertical-align: top
    }
    .font-mono {
        font-family: var(--font-mono)
    }
    .font-serif {
        font-family: var(--font-serif)
    }
    .text-2xl {
        font-size: var(--text-2xl);
        line-height: var(--tw-leading, var(--text-2xl--line-height))
    }
    .text-3xl {
        font-size: var(--text-3xl);
        line-height: var(--tw-leading, var(--text-3xl--line-height))
    }
    .text-4xl {
        font-size: var(--text-4xl);
        line-height: var(--tw-leading, var(--text-4xl--line-height))
    }
    .text-5xl {
        font-size: var(--text-5xl);
        line-height: var(--tw-leading, var(--text-5xl--line-height))
    }
    .text-base {
        font-size: var(--text-base);
        line-height: var(--tw-leading, var(--text-base--line-height))
    }
    .text-lg {
        font-size: var(--text-lg);
        line-height: var(--tw-leading, var(--text-lg--line-height))
    }
    .text-sm {
        font-size: var(--text-sm);
        line-height: var(--tw-leading, var(--text-sm--line-height))
    }
    .text-xl {
        font-size: var(--text-xl);
        line-height: var(--tw-leading, var(--text-xl--line-height))
    }
    .text-xs {
        font-size: var(--text-xs);
        line-height: var(--tw-leading, var(--text-xs--line-height))
    }
    .text-13 {
        font-size: var(--text-13)
    }
    .text-15 {
        font-size: var(--text-15)
    }
    .text-\[10px\] {
        font-size: 10px
    }
    .text-\[18px\] {
        font-size: 18px
    }
    .text-\[20px\] {
        font-size: 20px
    }
    .text-\[24px\] {
        font-size: 24px
    }
    .text-\[30px\] {
        font-size: 30px
    }
    .text-\[32px\] {
        font-size: 32px
    }
    .text-\[34px\] {
        font-size: 34px
    }
    .text-\[35px\] {
        font-size: 35px
    }
    .text-\[40px\] {
        font-size: 40px
    }
    .text-\[44px\] {
        font-size: 44px
    }
    .text-\[50px\] {
        font-size: 50px
    }
    .text-\[100px\] {
        font-size: 100px
    }
    .\!leading-\[1\.2\] {
        --tw-leading: 1.2 !important;
        line-height: 1.2 !important
    }
    .leading-\[1\.2\] {
        --tw-leading: 1.2;
        line-height: 1.2
    }
    .leading-\[1\.3\] {
        --tw-leading: 1.3;
        line-height: 1.3
    }
    .leading-\[1\.7\] {
        --tw-leading: 1.7;
        line-height: 1.7
    }
    .leading-none {
        --tw-leading: 1;
        line-height: 1
    }
    .\!font-semibold {
        --tw-font-weight: var(--font-weight-semibold) !important;
        font-weight: var(--font-weight-semibold) !important
    }
    .font-bold {
        --tw-font-weight: var(--font-weight-bold);
        font-weight: var(--font-weight-bold)
    }
    .font-medium {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }
    .font-normal {
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal)
    }
    .font-semibold {
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold)
    }
    .text-wrap {
        text-wrap: wrap
    }
    .whitespace-nowrap {
        white-space: nowrap
    }
    .\!text-black {
        color: var(--color-black) !important
    }
    .\!text-white {
        color: var(--color-white) !important
    }
    .text-\[\#42BE65\] {
        color: #42be65
    }
    .text-\[\#D9D9D9\] {
        color: #d9d9d9
    }
    .text-\[\#F1C21B\] {
        color: #f1c21b
    }
    .text-\[\#FA4D56\] {
        color: #fa4d56
    }
    .text-\[\#67C761\] {
        color: #67C761
    }
    .text-\[\#FFD6BB\] {
        color: #ffd6bb
    }
    .text-\[\#bbbbbb\] {
        color: #bbb
    }
    .text-\[\#d9d9d9\] {
        color: #d9d9d9
    }
    .text-\[\#fe7a36\] {
        color: #fe7a36
    }
    .text-black {
        color: var(--color-black)
    }
    .text-body {
        color: var(--color-body)
    }
    .text-body\/50 {
        color: #40404080
    }
    @supports (color:color-mix(in lab, red, red)) {
        .text-body\/50 {
            color: color-mix(in oklab, var(--color-body)50%, transparent)
        }
    }
    .text-primary {
        color: var(--color-primary)
    }
    .text-transparent {
        color: #0000
    }
    .text-white {
        color: var(--color-white)
    }
    .text-white\/70 {
        color: #ffffffb3
    }
    @supports (color:color-mix(in lab, red, red)) {
        .text-white\/70 {
            color: color-mix(in oklab, var(--color-white)70%, transparent)
        }
    }
    .uppercase {
        text-transform: uppercase
    }
    .italic {
        font-style: italic
    }
    .line-through {
        text-decoration-line: line-through
    }
    .overline {
        text-decoration-line: overline
    }
    .underline {
        text-decoration-line: underline
    }
    .opacity-0 {
        opacity: 0
    }
    .opacity-90 {
        opacity: .9
    }
    .shadow-\[0_0_200px_rgba\(13\, 20\, 22\, 0\.1\)\] {
        --tw-shadow: 0 0 200px var(--tw-shadow-color, #0d14161a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }
    .shadow-\[0_8px_24px_rgba\(149\, 157\, 165\, 0\.2\)\] {
        --tw-shadow: 0 8px 24px var(--tw-shadow-color, #959da533);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }
    .shadow-\[0_8px_24px_rgba\(149\, 157\, 165\, 0\.3\)\] {
        --tw-shadow: 0 8px 24px var(--tw-shadow-color, #959da54d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }
    .\!outline-0 {
        outline-style: var(--tw-outline-style) !important;
        outline-width: 0 !important
    }
    .outline-0 {
        outline-style: var(--tw-outline-style);
        outline-width: 0
    }
    .filter {
        filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
    }
    .backdrop-blur-\[10px\] {
        --tw-backdrop-blur: blur(10px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
        backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
    }
    .backdrop-blur-\[21px\] {
        --tw-backdrop-blur: blur(21px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
        backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
    }
    .transition {
        transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }
    .transition-all {
        transition-property: all;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }
    .duration-300 {
        --tw-duration: .3s;
        transition-duration: .3s
    }
    .duration-500 {
        --tw-duration: .5s;
        transition-duration: .5s
    }
    .ease-in-out {
        --tw-ease: var(--ease-in-out);
        transition-timing-function: var(--ease-in-out)
    }
    .\[-moz-appearance\:textfield\] {
        -moz-appearance: textfield
    }
    .backface-hidden {
        backface-visibility: hidden
    }
    @media (hover:hover) {
        .group-hover\:visible:is(:where(.group): hover *) {
            visibility:visible
        }
        .group-hover\:scale-110:is(:where(.group):hover *) {
            --tw-scale-x: 110%;
            --tw-scale-y: 110%;
            --tw-scale-z: 110%;
            scale: var(--tw-scale-x)var(--tw-scale-y)
        }
        .group-hover\:bg-black:is(:where(.group):hover *) {
            background-color: var(--color-black)
        }
        .group-hover\:bg-dark:is(:where(.group):hover *) {
            background-color: var(--color-dark)
        }
        .group-hover\:bg-primary:is(:where(.group):hover *) {
            background-color: var(--color-primary)
        }
        .group-hover\:text-primary:is(:where(.group):hover *) {
            color: var(--color-primary)
        }
        .group-hover\:text-white:is(:where(.group):hover *) {
            color: var(--color-white)
        }
        .group-hover\:opacity-100:is(:where(.group):hover *) {
            opacity: 1
        }
    }
    .placeholder\:\!text-white\/70::placeholder {
        color: #ffffffb3 !important
    }
    @supports (color:color-mix(in lab, red, red)) {
        .placeholder\:\!text-white\/70::placeholder {
            color: color-mix(in oklab, var(--color-white)70%, transparent) !important
        }
    }
    .placeholder\:\!text-white\/75::placeholder {
        color: #ffffffbf !important
    }
    @supports (color:color-mix(in lab, red, red)) {
        .placeholder\:\!text-white\/75::placeholder {
            color: color-mix(in oklab, var(--color-white)75%, transparent) !important
        }
    }
    .placeholder\:text-black::placeholder {
        color: var(--color-black)
    }
    .placeholder\:text-body::placeholder {
        color: var(--color-body)
    }
    .first\:mt-0:first-child {
        margin-top: calc(var(--spacing)*0)
    }
    .first\:border-t:first-child {
        border-top-style: var(--tw-border-style);
        border-top-width: 1px
    }
    .first\:pt-0:first-child {
        padding-top: calc(var(--spacing)*0)
    }
    .last\:mb-0:last-child {
        margin-bottom: calc(var(--spacing)*0)
    }
    .last\:border-b:last-child {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px
    }
    .last\:border-b-0:last-child {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 0
    }
    .last\:pb-0:last-child {
        padding-bottom: calc(var(--spacing)*0)
    }
    @media (hover:hover) {
        .hover\:border-primary:hover {
            border-color: var(--color-primary)
        }
        .hover\:border-white:hover {
            border-color: var(--color-white)
        }
        .hover\:\!bg-dark:hover {
            background-color: var(--color-dark) !important
        }
        .hover\:bg-black:hover {
            background-color: var(--color-black)
        }
        .hover\:bg-primary:hover {
            background-color: var(--color-primary)
        }
        .hover\:text-primary:hover {
            color: var(--color-primary)
        }
        .hover\:text-white:hover {
            color: var(--color-white)
        }
        .hover\:text-white\/80:hover {
            color: #fffc
        }
        @supports (color:color-mix(in lab, red, red)) {
            .hover\:text-white\/80:hover {
                color: color-mix(in oklab, var(--color-white)80%, transparent)
            }
        }
        .hover\:underline:hover {
            text-decoration-line: underline
        }
    }
    .focus\:placeholder\:\!text-transparent:focus::placeholder {
        color: #0000 !important
    }
    @media (min-width:40rem) {
        .sm\:col-span-1 {
            grid-column: span 1/span 1
        }
        .sm\:col-span-2 {
            grid-column: span 2/span 2
        }
        .sm\:mb-0 {
            margin-bottom: calc(var(--spacing)*0)
        }
        .sm\:max-w-\[640px\] {
            max-width: 640px
        }
        .sm\:grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }
        .sm\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }
        .sm\:gap-\[15px\] {
            gap: 15px
        }
    }
    @media (min-width:48rem) {
        .md\:absolute {
            position: absolute
        }
        .md\:top-\[25px\] {
            top: 25px
        }
        .md\:bottom-\[20px\] {
            bottom: 20px
        }
        .md\:bottom-\[25px\] {
            bottom: 25px
        }
        .md\:bottom-\[75px\] {
            bottom: 75px
        }
        .md\:bottom-\[110px\] {
            bottom: 110px
        }
        .md\:col-span-1 {
            grid-column: span 1/span 1
        }
        .md\:col-span-2 {
            grid-column: span 2/span 2
        }
        .md\:col-span-3 {
            grid-column: span 3/span 3
        }
        .md\:my-\[20px\] {
            margin-block: 20px
        }
        .md\:my-\[25px\] {
            margin-block: 25px
        }
        .md\:my-\[30px\] {
            margin-block: 30px
        }
        .md\:my-\[40px\] {
            margin-block: 40px
        }
        .md\:my-\[100px\] {
            margin-block: 100px
        }
        .md\:-mt-\[15px\] {
            margin-top: -15px
        }
        .md\:-mt-\[170px\] {
            margin-top: -170px
        }
        .md\:-mt-\[180px\] {
            margin-top: -180px
        }
        .md\:mt-0 {
            margin-top: calc(var(--spacing)*0)
        }
        .md\:mt-\[10px\] {
            margin-top: 10px
        }
        .md\:mt-\[15px\] {
            margin-top: 15px
        }
        .md\:mt-\[20px\] {
            margin-top: 20px
        }
        .md\:mt-\[25px\] {
            margin-top: 25px
        }
        .md\:mt-\[30px\] {
            margin-top: 30px
        }
        .md\:mt-\[35px\] {
            margin-top: 35px
        }
        .md\:mt-\[50px\] {
            margin-top: 50px
        }
        .md\:mt-\[80px\] {
            margin-top: 80px
        }
        .md\:mb-0 {
            margin-bottom: calc(var(--spacing)*0)
        }
        .md\:mb-\[5px\] {
            margin-bottom: 5px
        }
        .md\:mb-\[8px\] {
            margin-bottom: 8px
        }
        .md\:mb-\[10px\] {
            margin-bottom: 10px
        }
        .md\:mb-\[11px\] {
            margin-bottom: 11px
        }
        .md\:mb-\[12px\] {
            margin-bottom: 12px
        }
        .md\:mb-\[14px\] {
            margin-bottom: 14px
        }
        .md\:mb-\[15px\] {
            margin-bottom: 15px
        }
        .md\:mb-\[18px\] {
            margin-bottom: 18px
        }
        .md\:mb-\[20px\] {
            margin-bottom: 20px
        }
        .md\:mb-\[25px\] {
            margin-bottom: 25px
        }
        .md\:mb-\[30px\] {
            margin-bottom: 30px
        }
        .md\:mb-\[35px\] {
            margin-bottom: 35px
        }
        .md\:mb-\[40px\] {
            margin-bottom: 40px
        }
        .md\:\!inline-block {
            display: inline-block !important
        }
        .md\:block {
            display: block
        }
        .md\:flex {
            display: flex
        }
        .md\:\!h-\[54px\] {
            height: 54px !important
        }
        .md\:h-\[15px\] {
            height: 15px
        }
        .md\:h-\[40px\] {
            height: 40px
        }
        .md\:h-\[45px\] {
            height: 45px
        }
        .md\:h-\[50px\] {
            height: 50px
        }
        .md\:h-\[70px\] {
            height: 70px
        }
        .md\:h-\[75px\] {
            height: 75px
        }
        .md\:h-\[100px\] {
            height: 100px
        }
        .md\:h-\[120px\] {
            height: 120px
        }
        .md\:h-\[175px\] {
            height: 175px
        }
        .md\:h-\[460px\] {
            height: 460px
        }
        .md\:h-\[600px\] {
            height: 600px
        }
        .md\:h-full {
            height: 100%
        }
        .md\:w-\[40px\] {
            width: 40px
        }
        .md\:w-\[45px\] {
            width: 45px
        }
        .md\:w-\[50px\] {
            width: 50px
        }
        .md\:w-\[70px\] {
            width: 70px
        }
        .md\:w-\[75px\] {
            width: 75px
        }
        .md\:w-\[100px\] {
            width: 100px
        }
        .md\:w-\[120px\] {
            width: 120px
        }
        .md\:w-\[150px\] {
            width: 150px
        }
        .md\:w-\[158px\] {
            width: 158px
        }
        .md\:w-\[250px\] {
            width: 250px
        }
        .md\:w-\[262px\] {
            width: 262px
        }
        .md\:w-\[300px\] {
            width: 300px
        }
        .md\:\!max-w-full {
            max-width: 100% !important
        }
        .md\:max-w-\[100px\] {
            max-width: 100px
        }
        .md\:max-w-\[170px\] {
            max-width: 170px
        }
        .md\:max-w-\[220px\] {
            max-width: 220px
        }
        .md\:max-w-\[312px\] {
            max-width: 312px
        }
        .md\:max-w-\[345px\] {
            max-width: 345px
        }
        .md\:max-w-\[350px\] {
            max-width: 350px
        }
        .md\:max-w-\[400px\] {
            max-width: 400px
        }
        .md\:max-w-\[465px\] {
            max-width: 465px
        }
        .md\:max-w-\[535px\] {
            max-width: 535px
        }
        .md\:max-w-\[540px\] {
            max-width: 540px
        }
        .md\:max-w-\[600px\] {
            max-width: 600px
        }
        .md\:max-w-\[620px\] {
            max-width: 620px
        }
        .md\:max-w-\[650px\] {
            max-width: 650px
        }
        .md\:max-w-\[720px\] {
            max-width: 720px
        }
        .md\:grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }
        .md\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }
        .md\:grid-cols-4 {
            grid-template-columns: repeat(4, minmax(0, 1fr))
        }
        .md\:justify-between {
            justify-content: space-between
        }
        .md\:justify-end {
            justify-content: flex-end
        }
        .md\:gap-\[10px\] {
            gap: 10px
        }
        .md\:gap-\[15px\] {
            gap: 15px
        }
        .md\:gap-\[20px\] {
            gap: 20px
        }
        .md\:gap-\[25px\] {
            gap: 25px
        }
        .md\:gap-\[50px\] {
            gap: 50px
        }
        .md\:gap-x-\[20px\] {
            column-gap: 20px
        }
        .md\:gap-x-\[25px\] {
            column-gap: 25px
        }
        .md\:gap-x-\[30px\] {
            column-gap: 30px
        }
        .md\:gap-y-\[35px\] {
            row-gap: 35px
        }
        .md\:border-\[10px\] {
            border-style: var(--tw-border-style);
            border-width: 10px
        }
        .md\:p-\[20px\] {
            padding: 20px
        }
        .md\:p-\[25px\] {
            padding: 25px
        }
        .md\:p-\[30px\] {
            padding: 30px
        }
        .md\:p-\[40px\] {
            padding: 40px
        }
        .md\:px-\[19px\] {
            padding-inline: 19px
        }
        .md\:px-\[20px\] {
            padding-inline: 20px
        }
        .md\:px-\[25px\] {
            padding-inline: 25px
        }
        .md\:px-\[35px\] {
            padding-inline: 35px
        }
        .md\:px-\[40px\] {
            padding-inline: 40px
        }
        .md\:py-\[8px\] {
            padding-block: 8px
        }
        .md\:py-\[10px\] {
            padding-block: 10px
        }
        .md\:py-\[11px\] {
            padding-block: 11px
        }
        .md\:py-\[15px\] {
            padding-block: 15px
        }
        .md\:py-\[17px\] {
            padding-block: 17px
        }
        .md\:py-\[20px\] {
            padding-block: 20px
        }
        .md\:py-\[25px\] {
            padding-block: 25px
        }
        .md\:py-\[40px\] {
            padding-block: 40px
        }
        .md\:py-\[80px\] {
            padding-block: 80px
        }
        .md\:\!pt-\[450px\] {
            padding-top: 450px !important
        }
        .md\:pt-\[20px\] {
            padding-top: 20px
        }
        .md\:pt-\[75px\] {
            padding-top: 75px
        }
        .md\:pt-\[80px\] {
            padding-top: 80px
        }
        .md\:pt-\[90px\] {
            padding-top: 90px
        }
        .md\:pt-\[115px\] {
            padding-top: 115px
        }
        .md\:pt-\[185px\] {
            padding-top: 185px
        }
        .md\:pt-\[210px\] {
            padding-top: 210px
        }
        .md\:pt-\[230px\] {
            padding-top: 230px
        }
        .md\:pt-\[280px\] {
            padding-top: 280px
        }
        .md\:\!pb-\[40px\] {
            padding-bottom: 40px !important
        }
        .md\:pb-\[5px\] {
            padding-bottom: 5px
        }
        .md\:pb-\[20px\] {
            padding-bottom: 20px
        }
        .md\:pb-\[25px\] {
            padding-bottom: 25px
        }
        .md\:pb-\[60px\] {
            padding-bottom: 60px
        }
        .md\:pb-\[80px\] {
            padding-bottom: 80px
        }
        .md\:pb-\[115px\] {
            padding-bottom: 115px
        }
        .md\:pb-\[120px\] {
            padding-bottom: 120px
        }
        .md\:text-2xl {
            font-size: var(--text-2xl);
            line-height: var(--tw-leading, var(--text-2xl--line-height))
        }
        .md\:text-3xl {
            font-size: var(--text-3xl);
            line-height: var(--tw-leading, var(--text-3xl--line-height))
        }
        .md\:text-4xl {
            font-size: var(--text-4xl);
            line-height: var(--tw-leading, var(--text-4xl--line-height))
        }
        .md\:text-5xl {
            font-size: var(--text-5xl);
            line-height: var(--tw-leading, var(--text-5xl--line-height))
        }
        .md\:text-6xl {
            font-size: var(--text-6xl);
            line-height: var(--tw-leading, var(--text-6xl--line-height))
        }
        .md\:text-base {
            font-size: var(--text-base);
            line-height: var(--tw-leading, var(--text-base--line-height))
        }
        .md\:text-lg {
            font-size: var(--text-lg);
            line-height: var(--tw-leading, var(--text-lg--line-height))
        }
        .md\:text-sm {
            font-size: var(--text-sm);
            line-height: var(--tw-leading, var(--text-sm--line-height))
        }
        .md\:text-15 {
            font-size: var(--text-15)
        }
        .md\:text-\[30px\] {
            font-size: 30px
        }
        .md\:text-\[44px\] {
            font-size: 44px
        }
        .md\:text-\[50px\] {
            font-size: 50px
        }
        .md\:text-\[64px\] {
            font-size: 64px
        }
        .md\:text-\[70px\] {
            font-size: 70px
        }
        .md\:text-\[80px\] {
            font-size: 80px
        }
        .md\:leading-none {
            --tw-leading: 1;
            line-height: 1
        }
    }
    @media (min-width:64rem) {
        .lg\:invisible {
            visibility: hidden
        }
        .lg\:visible {
            visibility: visible
        }
        .lg\:absolute {
            position: absolute
        }
        .lg\:sticky {
            position: sticky
        }
        .lg\:top-\[25px\] {
            top: 25px
        }
        .lg\:top-\[55px\] {
            top: 55px
        }
        .lg\:top-\[150px\] {
            top: 150px
        }
        .lg\:bottom-\[30px\] {
            bottom: 30px
        }
        .lg\:bottom-\[85px\] {
            bottom: 85px
        }
        .lg\:order-1 {
            order: 1
        }
        .lg\:order-2 {
            order: 2
        }
        .lg\:col-span-1 {
            grid-column: span 1/span 1
        }
        .lg\:col-span-2 {
            grid-column: span 2/span 2
        }
        .lg\:mx-auto {
            margin-inline: auto
        }
        .lg\:my-\[25px\] {
            margin-block: 25px
        }
        .lg\:my-\[30px\] {
            margin-block: 30px
        }
        .lg\:my-\[35px\] {
            margin-block: 35px
        }
        .lg\:my-\[50px\] {
            margin-block: 50px
        }
        .lg\:-mt-\[100px\] {
            margin-top: -100px
        }
        .lg\:mt-0 {
            margin-top: calc(var(--spacing)*0)
        }
        .lg\:mt-\[15px\] {
            margin-top: 15px
        }
        .lg\:mt-\[20px\] {
            margin-top: 20px
        }
        .lg\:mt-\[25px\] {
            margin-top: 25px
        }
        .lg\:mt-\[30px\] {
            margin-top: 30px
        }
        .lg\:mt-\[35px\] {
            margin-top: 35px
        }
        .lg\:mt-\[40px\] {
            margin-top: 40px
        }
        .lg\:mt-\[45px\] {
            margin-top: 45px
        }
        .lg\:mt-\[80px\] {
            margin-top: 80px
        }
        .lg\:mt-\[100px\] {
            margin-top: 100px
        }
        .lg\:-mb-px {
            margin-bottom: -1px
        }
        .lg\:mb-0 {
            margin-bottom: calc(var(--spacing)*0)
        }
        .lg\:mb-\[12px\] {
            margin-bottom: 12px
        }
        .lg\:mb-\[13px\] {
            margin-bottom: 13px
        }
        .lg\:mb-\[15px\] {
            margin-bottom: 15px
        }
        .lg\:mb-\[18px\] {
            margin-bottom: 18px
        }
        .lg\:mb-\[20px\] {
            margin-bottom: 20px
        }
        .lg\:mb-\[25px\] {
            margin-bottom: 25px
        }
        .lg\:mb-\[28px\] {
            margin-bottom: 28px
        }
        .lg\:mb-\[30px\] {
            margin-bottom: 30px
        }
        .lg\:mb-\[35px\] {
            margin-bottom: 35px
        }
        .lg\:mb-\[40px\] {
            margin-bottom: 40px
        }
        .lg\:mb-\[45px\] {
            margin-bottom: 45px
        }
        .lg\:mb-\[50px\] {
            margin-bottom: 50px
        }
        .lg\:\!hidden {
            display: none !important
        }
        .lg\:block {
            display: block
        }
        .lg\:flex {
            display: flex
        }
        .lg\:hidden {
            display: none
        }
        .lg\:table {
            display: table
        }
        .lg\:table-cell {
            display: table-cell
        }
        .lg\:h-\[50px\] {
            height: 50px
        }
        .lg\:h-\[52px\] {
            height: 52px
        }
        .lg\:h-\[150px\] {
            height: 150px
        }
        .lg\:h-\[700px\] {
            height: 700px
        }
        .lg\:h-full {
            height: 100%
        }
        .lg\:min-h-screen {
            min-height: 100vh
        }
        .lg\:\!w-\[425px\] {
            width: 425px !important
        }
        .lg\:w-\[50px\] {
            width: 50px
        }
        .lg\:w-\[52px\] {
            width: 52px
        }
        .lg\:w-\[150px\] {
            width: 150px
        }
        .lg\:w-\[260px\] {
            width: 260px
        }
        .lg\:w-full {
            width: 100%
        }
        .lg\:\!max-w-full {
            max-width: 100% !important
        }
        .lg\:max-w-\[190px\] {
            max-width: 190px
        }
        .lg\:max-w-\[240px\] {
            max-width: 240px
        }
        .lg\:max-w-\[400px\] {
            max-width: 400px
        }
        .lg\:max-w-\[425px\] {
            max-width: 425px
        }
        .lg\:max-w-\[475px\] {
            max-width: 475px
        }
        .lg\:max-w-\[660px\] {
            max-width: 660px
        }
        .lg\:max-w-\[720px\] {
            max-width: 720px
        }
        .lg\:max-w-\[740px\] {
            max-width: 740px
        }
        .lg\:max-w-\[780px\] {
            max-width: 780px
        }
        .lg\:max-w-\[800px\] {
            max-width: 800px
        }
        .lg\:max-w-\[830px\] {
            max-width: 830px
        }
        .lg\:max-w-\[872px\] {
            max-width: 872px
        }
        .lg\:max-w-\[875px\] {
            max-width: 875px
        }
        .lg\:max-w-\[885px\] {
            max-width: 885px
        }
        .lg\:max-w-full {
            max-width: 100%
        }
        .lg\:\!translate-none {
            translate: none !important
        }
        .lg\:\!transform-none {
            transform: none !important
        }
        .lg\:grid-cols-1 {
            grid-template-columns: repeat(1, minmax(0, 1fr))
        }
        .lg\:grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }
        .lg\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }
        .lg\:grid-cols-4 {
            grid-template-columns: repeat(4, minmax(0, 1fr))
        }
        .lg\:grid-cols-6 {
            grid-template-columns: repeat(6, minmax(0, 1fr))
        }
        .lg\:flex-nowrap {
            flex-wrap: nowrap
        }
        .lg\:items-center {
            align-items: center
        }
        .lg\:items-start {
            align-items: flex-start
        }
        .lg\:justify-end {
            justify-content: flex-end
        }
        .lg\:justify-start {
            justify-content: flex-start
        }
        .lg\:gap-0 {
            gap: calc(var(--spacing)*0)
        }
        .lg\:gap-\[20px\] {
            gap: 20px
        }
        .lg\:gap-\[25px\] {
            gap: 25px
        }
        .lg\:gap-\[30px\] {
            gap: 30px
        }
        .lg\:gap-\[75px\] {
            gap: 75px
        }
        .lg\:gap-x-\[35px\] {
            column-gap: 35px
        }
        .lg\:gap-y-\[40px\] {
            row-gap: 40px
        }
        .lg\:border-b-0 {
            border-bottom-style: var(--tw-border-style);
            border-bottom-width: 0
        }
        .lg\:p-\[25px\] {
            padding: 25px
        }
        .lg\:p-\[30px\] {
            padding: 30px
        }
        .lg\:p-\[40px\] {
            padding: 40px
        }
        .lg\:p-\[60px\] {
            padding: 60px
        }
        .lg\:\!px-0 {
            padding-inline: calc(var(--spacing)*0) !important
        }
        .lg\:px-\[25px\] {
            padding-inline: 25px
        }
        .lg\:px-\[45px\] {
            padding-inline: 45px
        }
        .lg\:px-\[60px\] {
            padding-inline: 60px
        }
        .lg\:py-0 {
            padding-block: calc(var(--spacing)*0)
        }
        .lg\:py-\[10px\] {
            padding-block: 10px
        }
        .lg\:py-\[15px\] {
            padding-block: 15px
        }
        .lg\:py-\[20px\] {
            padding-block: 20px
        }
        .lg\:py-\[25px\] {
            padding-block: 25px
        }
        .lg\:py-\[30px\] {
            padding-block: 30px
        }
        .lg\:py-\[50px\] {
            padding-block: 50px
        }
        .lg\:py-\[100px\] {
            padding-block: 100px
        }
        .lg\:pt-0 {
            padding-top: calc(var(--spacing)*0)
        }
        .lg\:pt-\[30px\] {
            padding-top: 30px
        }
        .lg\:pt-\[100px\] {
            padding-top: 100px
        }
        .lg\:pt-\[205px\] {
            padding-top: 205px
        }
        .lg\:pt-\[240px\] {
            padding-top: 240px
        }
        .lg\:pt-\[245px\] {
            padding-top: 245px
        }
        .lg\:pt-\[260px\] {
            padding-top: 260px
        }
        .lg\:pb-\[25px\] {
            padding-bottom: 25px
        }
        .lg\:pb-\[30px\] {
            padding-bottom: 30px
        }
        .lg\:pb-\[80px\] {
            padding-bottom: 80px
        }
        .lg\:pb-\[100px\] {
            padding-bottom: 100px
        }
        .lg\:pb-\[140px\] {
            padding-bottom: 140px
        }
        .lg\:text-center {
            text-align: center
        }
        .lg\:align-middle {
            vertical-align: middle
        }
        .lg\:text-3xl {
            font-size: var(--text-3xl);
            line-height: var(--tw-leading, var(--text-3xl--line-height))
        }
        .lg\:text-base {
            font-size: var(--text-base);
            line-height: var(--tw-leading, var(--text-base--line-height))
        }
        .lg\:text-lg {
            font-size: var(--text-lg);
            line-height: var(--tw-leading, var(--text-lg--line-height))
        }
        .lg\:text-xl {
            font-size: var(--text-xl);
            line-height: var(--tw-leading, var(--text-xl--line-height))
        }
        .lg\:text-15 {
            font-size: var(--text-15)
        }
        .lg\:text-\[54px\] {
            font-size: 54px
        }
        .lg\:text-\[60px\] {
            font-size: 60px
        }
        .lg\:text-\[65px\] {
            font-size: 65px
        }
        .lg\:text-\[110px\] {
            font-size: 110px
        }
        .lg\:text-\[\#BBBBBB\] {
            color: #bbb
        }
        .lg\:text-white {
            color: var(--color-white)
        }
        .lg\:opacity-0 {
            opacity: 0
        }
        .lg\:opacity-100 {
            opacity: 1
        }
    }
    @media (min-width:80rem) {
        .xl\:\!absolute {
            position: absolute !important
        }
        .xl\:\!top-auto {
            top: auto !important
        }
        .xl\:-top-\[85px\] {
            top: -85px
        }
        .xl\:top-\[235px\] {
            top: 235px
        }
        .xl\:\!bottom-0 {
            bottom: calc(var(--spacing)*0) !important
        }
        .xl\:bottom-\[40px\] {
            bottom: 40px
        }
        .xl\:bottom-\[95px\] {
            bottom: 95px
        }
        .xl\:mx-auto {
            margin-inline: auto
        }
        .xl\:-mt-\[190px\] {
            margin-top: -190px
        }
        .xl\:-mt-\[273px\] {
            margin-top: -273px
        }
        .xl\:mt-0 {
            margin-top: calc(var(--spacing)*0)
        }
        .xl\:mt-\[15px\] {
            margin-top: 15px
        }
        .xl\:mt-\[30px\] {
            margin-top: 30px
        }
        .xl\:mt-\[40px\] {
            margin-top: 40px
        }
        .xl\:mt-\[50px\] {
            margin-top: 50px
        }
        .xl\:mt-\[100px\] {
            margin-top: 100px
        }
        .xl\:mb-0 {
            margin-bottom: calc(var(--spacing)*0)
        }
        .xl\:flex {
            display: flex
        }
        .xl\:w-\[365px\] {
            width: 365px
        }
        .xl\:w-\[420px\] {
            width: 420px
        }
        .xl\:\!max-w-\[1920px\] {
            max-width: 1920px !important
        }
        .xl\:\!max-w-full {
            max-width: 100% !important
        }
        .xl\:max-w-\[220px\] {
            max-width: 220px
        }
        .xl\:max-w-\[300px\] {
            max-width: 300px
        }
        .xl\:max-w-\[350px\] {
            max-width: 350px
        }
        .xl\:max-w-\[460px\] {
            max-width: 460px
        }
        .xl\:max-w-\[462px\] {
            max-width: 462px
        }
        .xl\:max-w-\[465px\] {
            max-width: 465px
        }
        .xl\:max-w-\[500px\] {
            max-width: 500px
        }
        .xl\:max-w-\[525px\] {
            max-width: 525px
        }
        .xl\:max-w-\[535px\] {
            max-width: 535px
        }
        .xl\:max-w-\[536px\] {
            max-width: 536px
        }
        .xl\:max-w-\[540px\] {
            max-width: 540px
        }
        .xl\:max-w-\[630px\] {
            max-width: 630px
        }
        .xl\:max-w-\[650px\] {
            max-width: 650px
        }
        .xl\:max-w-\[815px\] {
            max-width: 815px
        }
        .xl\:max-w-\[865px\] {
            max-width: 865px
        }
        .xl\:max-w-\[875px\] {
            max-width: 875px
        }
        .xl\:max-w-\[900px\] {
            max-width: 900px
        }
        .xl\:max-w-\[960px\] {
            max-width: 960px
        }
        .xl\:max-w-\[985px\] {
            max-width: 985px
        }
        .xl\:max-w-\[990px\] {
            max-width: 990px
        }
        .xl\:max-w-\[1090px\] {
            max-width: 1090px
        }
        .xl\:max-w-\[1095px\] {
            max-width: 1095px
        }
        .xl\:max-w-\[1100px\] {
            max-width: 1100px
        }
        .xl\:max-w-\[1110px\] {
            max-width: 1110px
        }
        .xl\:max-w-full {
            max-width: 100%
        }
        .xl\:min-w-\[290px\] {
            min-width: 290px
        }
        .xl\:grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }
        .xl\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }
        .xl\:grid-cols-4 {
            grid-template-columns: repeat(4, minmax(0, 1fr))
        }
        .xl\:items-stretch {
            align-items: stretch
        }
        .xl\:gap-\[25px\] {
            gap: 25px
        }
        .xl\:gap-\[30px\] {
            gap: 30px
        }
        .xl\:gap-\[35px\] {
            gap: 35px
        }
        .xl\:gap-\[40px\] {
            gap: 40px
        }
        .xl\:gap-\[50px\] {
            gap: 50px
        }
        .xl\:gap-\[80px\] {
            gap: 80px
        }
        .xl\:gap-\[90px\] {
            gap: 90px
        }
        .xl\:gap-\[100px\] {
            gap: 100px
        }
        .xl\:gap-y-\[50px\] {
            row-gap: 50px
        }
        .xl\:p-\[100px\] {
            padding: 100px
        }
        .xl\:\!px-0 {
            padding-inline: calc(var(--spacing)*0) !important
        }
        .xl\:px-\[30px\] {
            padding-inline: 30px
        }
        .xl\:px-\[55px\] {
            padding-inline: 55px
        }
        .xl\:px-\[100px\] {
            padding-inline: 100px
        }
        .xl\:py-0 {
            padding-block: calc(var(--spacing)*0)
        }
        .xl\:py-\[12px\] {
            padding-block: 12px
        }
        .xl\:py-\[40px\] {
            padding-block: 40px
        }
        .xl\:py-\[120px\] {
            padding-block: 120px
        }
        .xl\:pt-\[5px\] {
            padding-top: 5px
        }
        .xl\:pt-\[65px\] {
            padding-top: 65px
        }
        .xl\:pt-\[120px\] {
            padding-top: 120px
        }
        .xl\:pt-\[255px\] {
            padding-top: 255px
        }
        .xl\:pt-\[265px\] {
            padding-top: 265px
        }
        .xl\:pb-\[75px\] {
            padding-bottom: 75px
        }
        .xl\:pb-\[100px\] {
            padding-bottom: 100px
        }
        .xl\:pb-\[120px\] {
            padding-bottom: 120px
        }
        .xl\:pb-\[200px\] {
            padding-bottom: 200px
        }
        .xl\:text-xl {
            font-size: var(--text-xl);
            line-height: var(--tw-leading, var(--text-xl--line-height))
        }
        .xl\:text-\[64px\] {
            font-size: 64px
        }
        .xl\:text-\[85px\] {
            font-size: 85px
        }
        .xl\:text-\[110px\] {
            font-size: 110px
        }
    }
    @media (min-width:96rem) {
        .\32 xl\:-top-\[165px\] {
            top: -165px
        }
        .\32 xl\:top-\[10px\] {
            top: 10px
        }
        .\32 xl\:top-\[105px\] {
            top: 105px
        }
        .\32 xl\:top-\[265px\] {
            top: 265px
        }
        .\32 xl\:\!bottom-\[45px\] {
            bottom: 45px !important
        }
        .\32 xl\:-mt-\[230px\] {
            margin-top: -230px
        }
        .\32 xl\:mt-\[150px\] {
            margin-top: 150px
        }
        .\32 xl\:mb-\[20px\] {
            margin-bottom: 20px
        }
        .\32 xl\:\!max-w-\[1620px\] {
            max-width: 1620px !important
        }
        .\32 xl\:\!max-w-\[1760px\] {
            max-width: 1760px !important
        }
        .\32 xl\:\!max-w-\[1820px\] {
            max-width: 1820px !important
        }
        .\32 xl\:\!max-w-\[1920px\] {
            max-width: 1920px !important
        }
        .\32 xl\:max-w-\[280px\] {
            max-width: 280px
        }
        .\32 xl\:max-w-\[430px\] {
            max-width: 430px
        }
        .\32 xl\:max-w-\[600px\] {
            max-width: 600px
        }
        .\32 xl\:max-w-\[1920px\] {
            max-width: 1920px
        }
        .\32 xl\:max-w-full {
            max-width: 100%
        }
        .\32 xl\:px-\[100px\] {
            padding-inline: 100px
        }
        .\32 xl\:px-\[150px\] {
            padding-inline: 150px
        }
        .\32 xl\:pt-\[45px\] {
            padding-top: 45px
        }
        .\32 xl\:pt-\[100px\] {
            padding-top: 100px
        }
        .\32 xl\:pb-\[25px\] {
            padding-bottom: 25px
        }
        .\32 xl\:text-\[110px\] {
            font-size: 110px
        }
        .\32 xl\:text-\[125px\] {
            font-size: 125px
        }
        .\32 xl\:text-\[140px\] {
            font-size: 140px
        }
    }
    .ltr\:-right-\[32px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        right: -32px
    }
    .ltr\:right-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        right: calc(var(--spacing)*0)
    }
    .ltr\:right-\[10px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        right: 10px
    }
    .ltr\:right-\[15px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        right: 15px
    }
    .ltr\:right-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        right: 20px
    }
    .ltr\:right-\[120px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        right: 120px
    }
    .ltr\:left-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        left: calc(var(--spacing)*0)
    }
    .ltr\:left-\[10px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        left: 10px
    }
    .ltr\:left-\[12px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        left: 12px
    }
    .ltr\:left-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        left: 20px
    }
    .ltr\:left-\[30px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        left: 30px
    }
    .ltr\:-mr-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        margin-right: -20px
    }
    .ltr\:mr-\[5px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        margin-right: 5px
    }
    .ltr\:-ml-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        margin-left: -20px
    }
    .ltr\:-ml-\[430px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        margin-left: -430px
    }
    .ltr\:ml-\[10px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        margin-left: 10px
    }
    .ltr\:ml-auto:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        margin-left: auto
    }
    .ltr\:-translate-x-full:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        --tw-translate-x: -100%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }
    .ltr\:-scale-x-100:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        --tw-scale-x: calc(100%*-1);
        scale: var(--tw-scale-x)var(--tw-scale-y)
    }
    .ltr\:rotate-\[15deg\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        rotate: 15deg
    }
    .ltr\:rotate-\[45deg\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        rotate: 45deg
    }
    .ltr\:rounded-tl-\[15px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        border-top-left-radius: 15px
    }
    .ltr\:border-r:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }
    .ltr\:border-l:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }
    .ltr\:border-l-\[4px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        border-left-style: var(--tw-border-style);
        border-left-width: 4px
    }
    .ltr\:\!border-l-\[\#F9CF2E\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        border-left-color: #f9cf2e !important
    }
    .ltr\:\!border-l-primary:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        border-left-color: var(--color-primary) !important
    }
    .ltr\:\!pr-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-right: calc(var(--spacing)*0) !important
    }
    .ltr\:pr-\[5px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-right: 5px
    }
    .ltr\:pr-\[10px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-right: 10px
    }
    .ltr\:pr-\[18px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-right: 18px
    }
    .ltr\:pl-\[10px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 10px
    }
    .ltr\:pl-\[15px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 15px
    }
    .ltr\:pl-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 20px
    }
    .ltr\:pl-\[24px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 24px
    }
    .ltr\:pl-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 25px
    }
    .ltr\:pl-\[27px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 27px
    }
    .ltr\:pl-\[30px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 30px
    }
    .ltr\:pl-\[34px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 34px
    }
    .ltr\:pl-\[57px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 57px
    }
    .ltr\:pl-\[58px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 58px
    }
    .ltr\:text-left:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        text-align: left
    }
    .ltr\:text-right:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        text-align: right
    }
    .ltr\:first\:rounded-l-\[5px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *):first-child {
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px
    }
    .ltr\:first\:pl-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *):first-child {
        padding-left: calc(var(--spacing)*0)
    }
    .ltr\:last\:rounded-r-\[5px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *):last-child {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px
    }
    .ltr\:last\:pr-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *):last-child {
        padding-right: calc(var(--spacing)*0)
    }
    @media (min-width:40rem) {
        .ltr\:sm\:-ml-px:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -1px
        }
        .ltr\:sm\:rounded-l-none:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0
        }
        .ltr\:sm\:rounded-r-none:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0
        }
    }
    @media (min-width:48rem) {
        .ltr\:md\:right-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            right: 20px
        }
        .ltr\:md\:right-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            right: 25px
        }
        .ltr\:md\:left-\[35px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: 35px
        }
        .ltr\:md\:left-\[50px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: 50px
        }
        .ltr\:md\:-mr-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-right: -25px
        }
        .ltr\:md\:-mr-px:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-right: -1px
        }
        .ltr\:md\:-ml-\[45px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -45px
        }
        .ltr\:md\:-ml-\[80px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -80px
        }
        .ltr\:md\:ml-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: 25px
        }
        .ltr\:md\:ml-auto:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: auto
        }
        .ltr\:md\:pr-\[15px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 15px
        }
        .ltr\:md\:pr-\[45px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 45px
        }
        .ltr\:md\:pr-\[80px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 80px
        }
        .ltr\:md\:pr-\[85px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 85px
        }
        .ltr\:md\:pl-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 20px
        }
        .ltr\:md\:pl-\[23px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 23px
        }
        .ltr\:md\:pl-\[72px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 72px
        }
        .md\:ltr\:pl-\[15px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 15px
        }
        .ltr\:md\:text-right:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            text-align: right
        }
        .ltr\:md\:last\:mr-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *):last-child {
            margin-right: calc(var(--spacing)*0)
        }
    }
    @media (min-width:64rem) {
        .ltr\:lg\:right-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            right: 25px
        }
        .ltr\:lg\:right-\[30px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            right: 30px
        }
        .ltr\:lg\:-left-\[12px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: -12px
        }
        .ltr\:lg\:-mr-\[14px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-right: -14px
        }
        .ltr\:lg\:-mr-\[45px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-right: -45px
        }
        .ltr\:lg\:-ml-\[15px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -15px
        }
        .ltr\:lg\:-ml-\[60px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -60px
        }
        .ltr\:lg\:-ml-\[280px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -280px
        }
        .ltr\:lg\:ml-\[15px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: 15px
        }
        .ltr\:lg\:ml-auto:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: auto
        }
        .ltr\:lg\:-rotate-\[5deg\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            rotate: -5deg
        }
        .ltr\:lg\:rotate-\[5deg\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            rotate: 5deg
        }
        .ltr\:lg\:pr-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 20px
        }
        .lg\:ltr\:pl-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 20px
        }
        .ltr\:lg\:\!pl-\[285px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 285px !important
        }
        .ltr\:lg\:pl-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 25px
        }
        .ltr\:lg\:pl-\[30px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 30px
        }
        .ltr\:lg\:pl-\[45px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 45px
        }
        .ltr\:lg\:pl-\[88px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 88px
        }
        .ltr\:lg\:text-left:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            text-align: left
        }
        .ltr\:lg\:text-right:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            text-align: right
        }
    }
    @media (min-width:80rem) {
        .ltr\:xl\:\!right-auto:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            right: auto !important
        }
        .ltr\:xl\:right-\[40px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            right: 40px
        }
        .ltr\:xl\:\!left-\[45px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: 45px !important
        }
        .ltr\:xl\:left-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: 25px
        }
        .ltr\:xl\:-mr-\[30px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-right: -30px
        }
        .ltr\:xl\:mr-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-right: calc(var(--spacing)*0)
        }
        .ltr\:xl\:-ml-\[70px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -70px
        }
        .ltr\:xl\:-ml-\[100px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -100px
        }
        .ltr\:xl\:-ml-\[160px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -160px
        }
        .ltr\:xl\:-ml-\[245px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -245px
        }
        .ltr\:xl\:ml-\[20px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: 20px
        }
        .ltr\:xl\:ml-\[33px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: 33px
        }
        .ltr\:xl\:ml-auto:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: auto
        }
        .ltr\:xl\:pr-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 25px
        }
        .ltr\:xl\:pr-\[40px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 40px
        }
        .ltr\:xl\:pr-\[50px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 50px
        }
        .ltr\:xl\:pr-\[70px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 70px
        }
        .ltr\:xl\:pr-\[100px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-right: 100px
        }
        .ltr\:xl\:pl-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: calc(var(--spacing)*0)
        }
        .ltr\:xl\:pl-\[35px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 35px
        }
        .ltr\:xl\:pl-\[45px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 45px
        }
        .ltr\:xl\:pl-\[50px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 50px
        }
        .ltr\:xl\:pl-\[70px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 70px
        }
        .ltr\:xl\:pl-\[75px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 75px
        }
        .ltr\:xl\:pl-\[85px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 85px
        }
        .ltr\:xl\:pl-\[100px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 100px
        }
    }
    @media (min-width:96rem) {
        .ltr\:2xl\:right-0:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            right: calc(var(--spacing)*0)
        }
        .ltr\:2xl\:\!left-\[110px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: 110px !important
        }
        .ltr\:2xl\:left-\[40px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: 40px
        }
        .ltr\:2xl\:left-\[280px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            left: 280px
        }
        .ltr\:2xl\:-ml-\[260px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -260px
        }
        .ltr\:2xl\:-ml-\[345px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            margin-left: -345px
        }
        .ltr\:2xl\:pl-\[25px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 25px
        }
        .ltr\:2xl\:pl-\[110px\]:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
            padding-left: 110px
        }
    }
    .rtl\:right-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        right: calc(var(--spacing)*0)
    }
    .rtl\:right-\[10px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        right: 10px
    }
    .rtl\:right-\[12px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        right: 12px
    }
    .rtl\:right-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        right: 20px
    }
    .rtl\:right-\[30px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        right: 30px
    }
    .rtl\:-left-\[32px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        left: -32px
    }
    .rtl\:left-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        left: calc(var(--spacing)*0)
    }
    .rtl\:left-\[10px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        left: 10px
    }
    .rtl\:left-\[15px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        left: 15px
    }
    .rtl\:left-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        left: 20px
    }
    .rtl\:left-\[120px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        left: 120px
    }
    .rtl\:-mr-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        margin-right: -20px
    }
    .rtl\:-mr-\[430px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        margin-right: -430px
    }
    .rtl\:mr-\[10px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        margin-right: 10px
    }
    .rtl\:mr-auto:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        margin-right: auto
    }
    .rtl\:-ml-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        margin-left: -20px
    }
    .rtl\:ml-\[5px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        margin-left: 5px
    }
    .rtl\:translate-x-full:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        --tw-translate-x: 100%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }
    .rtl\:-scale-x-100:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        --tw-scale-x: calc(100%*-1);
        scale: var(--tw-scale-x)var(--tw-scale-y)
    }
    .rtl\:-rotate-\[45deg\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        rotate: -45deg
    }
    .rtl\:rotate-\[-15deg\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        rotate: -15deg
    }
    .rtl\:rounded-tr-\[15px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        border-top-right-radius: 15px
    }
    .rtl\:border-r:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }
    .rtl\:border-r-\[4px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        border-right-style: var(--tw-border-style);
        border-right-width: 4px
    }
    .rtl\:border-l:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }
    .rtl\:\!border-r-\[\#F9CF2E\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        border-right-color: #f9cf2e !important
    }
    .rtl\:\!border-r-primary:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        border-right-color: var(--color-primary) !important
    }
    .rtl\:pr-\[10px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 10px
    }
    .rtl\:pr-\[15px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 15px
    }
    .rtl\:pr-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 20px
    }
    .rtl\:pr-\[24px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 24px
    }
    .rtl\:pr-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 25px
    }
    .rtl\:pr-\[27px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 27px
    }
    .rtl\:pr-\[30px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 30px
    }
    .rtl\:pr-\[34px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 34px
    }
    .rtl\:pr-\[57px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 57px
    }
    .rtl\:pr-\[58px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 58px
    }
    .rtl\:\!pl-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-left: calc(var(--spacing)*0) !important
    }
    .rtl\:pl-\[5px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-left: 5px
    }
    .rtl\:pl-\[10px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-left: 10px
    }
    .rtl\:pl-\[18px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-left: 18px
    }
    .rtl\:text-left:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        text-align: left
    }
    .rtl\:text-right:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        text-align: right
    }
    .rtl\:first\:rounded-r-\[5px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *):first-child {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px
    }
    .rtl\:last\:rounded-l-\[5px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *):last-child {
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px
    }
    .rtl\:last\:pr-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *):last-child {
        padding-right: calc(var(--spacing)*0)
    }
    .rtl\:last\:pl-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *):last-child {
        padding-left: calc(var(--spacing)*0)
    }
    @media (min-width:40rem) {
        .rtl\:sm\:-mr-px:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -1px
        }
        .rtl\:sm\:rounded-l-none:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0
        }
        .rtl\:sm\:rounded-r-none:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0
        }
    }
    @media (min-width:48rem) {
        .rtl\:md\:right-\[35px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: 35px
        }
        .rtl\:md\:right-\[50px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: 50px
        }
        .rtl\:md\:left-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            left: 20px
        }
        .rtl\:md\:left-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            left: 25px
        }
        .rtl\:md\:-mr-\[45px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -45px
        }
        .rtl\:md\:-mr-\[80px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -80px
        }
        .rtl\:md\:mr-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: 25px
        }
        .rtl\:md\:mr-auto:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: auto
        }
        .rtl\:md\:-ml-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-left: -25px
        }
        .rtl\:md\:-ml-px:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-left: -1px
        }
        .md\:rtl\:pr-\[15px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 15px
        }
        .rtl\:md\:pr-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 20px
        }
        .rtl\:md\:pr-\[23px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 23px
        }
        .rtl\:md\:pr-\[72px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 72px
        }
        .rtl\:md\:pl-\[15px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 15px
        }
        .rtl\:md\:pl-\[45px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 45px
        }
        .rtl\:md\:pl-\[80px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 80px
        }
        .rtl\:md\:pl-\[85px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 85px
        }
        .rtl\:md\:text-left:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            text-align: left
        }
        .rtl\:md\:last\:ml-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *):last-child {
            margin-left: calc(var(--spacing)*0)
        }
    }
    @media (min-width:64rem) {
        .rtl\:lg\:-right-\[12px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: -12px
        }
        .rtl\:lg\:left-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            left: 25px
        }
        .rtl\:lg\:left-\[30px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            left: 30px
        }
        .rtl\:lg\:-mr-\[15px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -15px
        }
        .rtl\:lg\:-mr-\[60px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -60px
        }
        .rtl\:lg\:-mr-\[280px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -280px
        }
        .rtl\:lg\:mr-\[15px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: 15px
        }
        .rtl\:lg\:mr-auto:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: auto
        }
        .rtl\:lg\:-ml-\[14px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-left: -14px
        }
        .rtl\:lg\:-ml-\[45px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-left: -45px
        }
        .rtl\:lg\:-rotate-\[5deg\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            rotate: -5deg
        }
        .rtl\:lg\:rotate-\[5deg\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            rotate: 5deg
        }
        .lg\:rtl\:pr-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 20px
        }
        .rtl\:lg\:\!pr-\[285px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 285px !important
        }
        .rtl\:lg\:pr-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 25px
        }
        .rtl\:lg\:pr-\[30px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 30px
        }
        .rtl\:lg\:pr-\[45px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 45px
        }
        .rtl\:lg\:pr-\[88px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 88px
        }
        .rtl\:lg\:pl-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 20px
        }
        .rtl\:lg\:text-left:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            text-align: left
        }
        .rtl\:lg\:text-right:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            text-align: right
        }
    }
    @media (min-width:80rem) {
        .rtl\:xl\:\!right-\[45px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: 45px !important
        }
        .rtl\:xl\:right-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: 25px
        }
        .rtl\:xl\:\!left-auto:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            left: auto !important
        }
        .rtl\:xl\:left-\[40px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            left: 40px
        }
        .rtl\:xl\:-mr-\[70px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -70px
        }
        .rtl\:xl\:-mr-\[100px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -100px
        }
        .rtl\:xl\:-mr-\[160px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -160px
        }
        .rtl\:xl\:-mr-\[245px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -245px
        }
        .rtl\:xl\:mr-\[20px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: 20px
        }
        .rtl\:xl\:mr-\[33px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: 33px
        }
        .rtl\:xl\:mr-auto:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: auto
        }
        .rtl\:xl\:-ml-\[30px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-left: -30px
        }
        .rtl\:xl\:ml-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-left: calc(var(--spacing)*0)
        }
        .rtl\:xl\:pr-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: calc(var(--spacing)*0)
        }
        .rtl\:xl\:pr-\[35px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 35px
        }
        .rtl\:xl\:pr-\[45px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 45px
        }
        .rtl\:xl\:pr-\[50px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 50px
        }
        .rtl\:xl\:pr-\[70px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 70px
        }
        .rtl\:xl\:pr-\[75px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 75px
        }
        .rtl\:xl\:pr-\[85px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 85px
        }
        .rtl\:xl\:pr-\[100px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 100px
        }
        .rtl\:xl\:pl-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 25px
        }
        .rtl\:xl\:pl-\[40px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 40px
        }
        .rtl\:xl\:pl-\[50px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 50px
        }
        .rtl\:xl\:pl-\[70px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 70px
        }
        .rtl\:xl\:pl-\[100px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-left: 100px
        }
    }
    @media (min-width:96rem) {
        .rtl\:2xl\:\!right-\[110px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: 110px !important
        }
        .rtl\:2xl\:right-\[40px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: 40px
        }
        .rtl\:2xl\:right-\[280px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            right: 280px
        }
        .rtl\:2xl\:left-0:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            left: calc(var(--spacing)*0)
        }
        .rtl\:2xl\:-mr-\[260px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -260px
        }
        .rtl\:2xl\:-mr-\[345px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            margin-right: -345px
        }
        .rtl\:2xl\:pr-\[25px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 25px
        }
        .rtl\:2xl\:pr-\[110px\]:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
            padding-right: 110px
        }
    }
    .dark\:\!hidden:where([class=dark], [class=dark] *) {
        display: none !important
    }
    .dark\:\!inline:where([class=dark], [class=dark] *) {
        display: inline !important
    }
    .dark\:block:where([class=dark], [class=dark] *) {
        display: block
    }
    .dark\:hidden:where([class=dark], [class=dark] *) {
        display: none
    }
    .dark\:\!border-white\/10:where([class=dark], [class=dark] *) {
        border-color: #ffffff1a !important
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:\!border-white\/10:where([class=dark], [class=dark] *) {
            border-color: color-mix(in oklab, var(--color-white)10%, transparent) !important
        }
    }
    .dark\:\!border-white\/15:where([class=dark], [class=dark] *) {
        border-color: #ffffff26 !important
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:\!border-white\/15:where([class=dark], [class=dark] *) {
            border-color: color-mix(in oklab, var(--color-white)15%, transparent) !important
        }
    }
    .dark\:border-black:where([class=dark], [class=dark] *) {
        border-color: var(--color-black)
    }
    .dark\:border-dark:where([class=dark], [class=dark] *) {
        border-color: var(--color-dark)
    }
    .dark\:border-white\/5:where([class=dark], [class=dark] *) {
        border-color: #ffffff0d
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:border-white\/5:where([class=dark], [class=dark] *) {
            border-color: color-mix(in oklab, var(--color-white)5%, transparent)
        }
    }
    .dark\:border-white\/10:where([class=dark], [class=dark] *) {
        border-color: #ffffff1a
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:border-white\/10:where([class=dark], [class=dark] *) {
            border-color: color-mix(in oklab, var(--color-white)10%, transparent)
        }
    }
    .dark\:border-white\/15:where([class=dark], [class=dark] *) {
        border-color: #ffffff26
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:border-white\/15:where([class=dark], [class=dark] *) {
            border-color: color-mix(in oklab, var(--color-white)15%, transparent)
        }
    }
    .dark\:border-white\/20:where([class=dark], [class=dark] *) {
        border-color: #fff3
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:border-white\/20:where([class=dark], [class=dark] *) {
            border-color: color-mix(in oklab, var(--color-white)20%, transparent)
        }
    }
    .dark\:\!bg-black:where([class=dark], [class=dark] *) {
        background-color: var(--color-black) !important
    }
    .dark\:\!bg-dark:where([class=dark], [class=dark] *) {
        background-color: var(--color-dark) !important
    }
    .dark\:bg-\[\#3b3f41\]:where([class=dark], [class=dark] *) {
        background-color: #3b3f41
    }
    .dark\:bg-\[\#171E20\]:where([class=dark], [class=dark] *) {
        background-color: #171e20
    }
    .dark\:bg-black:where([class=dark], [class=dark] *) {
        background-color: var(--color-black)
    }
    .dark\:bg-dark:where([class=dark], [class=dark] *) {
        background-color: var(--color-dark)
    }
    .dark\:bg-white:where([class=dark], [class=dark] *) {
        background-color: var(--color-white)
    }
    .dark\:bg-white\/10:where([class=dark], [class=dark] *) {
        background-color: #ffffff1a
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:bg-white\/10:where([class=dark], [class=dark] *) {
            background-color: color-mix(in oklab, var(--color-white)10%, transparent)
        }
    }
    .dark\:bg-white\/15:where([class=dark], [class=dark] *) {
        background-color: #ffffff26
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:bg-white\/15:where([class=dark], [class=dark] *) {
            background-color: color-mix(in oklab, var(--color-white)15%, transparent)
        }
    }
    .dark\:\!text-white:where([class=dark], [class=dark] *) {
        color: var(--color-white) !important
    }
    .dark\:text-white:where([class=dark], [class=dark] *) {
        color: var(--color-white)
    }
    .dark\:text-white\/40:where([class=dark], [class=dark] *) {
        color: #fff6
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:text-white\/40:where([class=dark], [class=dark] *) {
            color: color-mix(in oklab, var(--color-white)40%, transparent)
        }
    }
    .dark\:text-white\/50:where([class=dark], [class=dark] *) {
        color: #ffffff80
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:text-white\/50:where([class=dark], [class=dark] *) {
            color: color-mix(in oklab, var(--color-white)50%, transparent)
        }
    }
    .dark\:text-white\/70:where([class=dark], [class=dark] *) {
        color: #ffffffb3
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:text-white\/70:where([class=dark], [class=dark] *) {
            color: color-mix(in oklab, var(--color-white)70%, transparent)
        }
    }
    .dark\:shadow-none:where([class=dark], [class=dark] *) {
        --tw-shadow: 0 0 #0000;
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }
    .dark\:invert:where([class=dark], [class=dark] *) {
        --tw-invert: invert(100%);
        filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
    }
    .dark\:placeholder\:text-white:where([class=dark], [class=dark] *)::placeholder {
        color: var(--color-white)
    }
    .dark\:placeholder\:text-white\/70:where([class=dark], [class=dark] *)::placeholder {
        color: #ffffffb3
    }
    @supports (color:color-mix(in lab, red, red)) {
        .dark\:placeholder\:text-white\/70:where([class=dark], [class=dark] *)::placeholder {
            color: color-mix(in oklab, var(--color-white)70%, transparent)
        }
    }
    @media (hover:hover) {
        .dark\:hover\:\!bg-dark:where([class=dark], [class=dark] *):hover {
            background-color: var(--color-dark) !important
        }
    }
    .\[\&\:\:-webkit-calendar-picker-indicator\]\:opacity-0::-webkit-calendar-picker-indicator {
        opacity: 0
    }
    .\[\&\:\:-webkit-calendar-picker-indicator\]\:invert::-webkit-calendar-picker-indicator {
        --tw-invert: invert(100%);
        filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
    }
    .dark\:\[\&\:\:-webkit-calendar-picker-indicator\]\:invert:where([class=dark], [class=dark] *)::-webkit-calendar-picker-indicator {
        --tw-invert: invert(100%);
        filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
    }
    .\[\&\:\:-webkit-inner-spin-button\]\:appearance-none::-webkit-inner-spin-button {
        appearance: none
    }
    .\[\&\:\:-webkit-outer-spin-button\]\:appearance-none::-webkit-outer-spin-button {
        appearance: none
    }
    .\[\&\:not\(\:first-child\)\]\:mt-\[30px\]:not(:first-child) {
        margin-top: 30px
    }
    @media (min-width:48rem) {
        .md\:\[\&\:not\(\: first-child\)\]\:mt-\[40px\]:not(:first-child) {
            margin-top:40px
        }
    }
}

body {
    background-color: var(--color-white);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-body)
}

@media (min-width:48rem) {
    body {
        font-size: var(--text-15)
    }
}

@media (min-width:64rem) {
    body {
        font-size: var(--text-base);
        line-height: var(--tw-leading, var(--text-base--line-height))
    }
}

body:where([class=dark], [class=dark] *) {
    background-color: var(--color-dark);
    color: #ffffffb3
}

@supports (color:color-mix(in lab, red, red)) {
    body:where([class=dark], [class=dark] *) {
        color: color-mix(in oklab, var(--color-white)70%, transparent)
    }
}

h6,
.h6,
h5,
.h5,
h4,
.h4,
h3,
.h3,
h2,
.h2,
h1,
.h1,
.display-6,
.display-5,
.display-4,
.display-3,
.display-2,
.display-1 {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--color-black)
}

:is(h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1, .display-6, .display-5, .display-4, .display-3, .display-2, .display-1):where([class=dark], [class=dark] *) {
    color: var(--color-white)
}

p {
    --tw-leading: 1.5;
    margin-bottom: 15px;
    line-height: 1.5
}

p:last-child {
    margin-bottom: calc(var(--spacing)*0)
}

@media (min-width:48rem) {
    p {
        --tw-leading: 1.6;
        line-height: 1.6
    }
}

a,
button {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out)
}

img {
    display: inline-block
}

.container {
    margin-inline: auto;
    padding-inline: 12px
}

@media (min-width:40rem) {
    .container {
        max-width: 540px
    }
}

@media (min-width:48rem) {
    .container {
        max-width: 720px
    }
}

@media (min-width:64rem) {
    .container {
        max-width: 960px
    }
}

@media (min-width:80rem) {
    .container {
        max-width: 1308px
    }
}

button {
    cursor: pointer
}

.primary-btn {
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-primary);
    background-color: var(--color-primary);
    font-size: var(--text-15);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-white);
    border-radius: 5px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 4px;
    display: inline-flex
}

@media (hover:hover) {
    .primary-btn:hover {
        border-color: var(--color-black);
        background-color: var(--color-black);
        color: var(--color-white)
    }
}

@media (min-width:48rem) {
    .primary-btn {
        font-size: var(--text-base);
        line-height: var(--tw-leading, var(--text-base--line-height));
        padding: 5px
    }
}

@media (min-width:64rem) {
    .primary-btn {
        font-size: var(--text-lg);
        line-height: var(--tw-leading, var(--text-lg--line-height));
        padding: 6px
    }
}

@media (min-width:80rem) {
    .primary-btn {
        font-size: var(--text-xl);
        line-height: var(--tw-leading, var(--text-xl--line-height))
    }
}

.primary-btn span:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
    padding-left: 18px
}

@media (min-width:48rem) {
    .primary-btn span:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 20px
    }
}

@media (min-width:64rem) {
    .primary-btn span:where(:dir(ltr), [dir=ltr], [dir=ltr] *) {
        padding-left: 22px
    }
}

.primary-btn span:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
    padding-right: 18px
}

@media (min-width:48rem) {
    .primary-btn span:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 20px
    }
}

@media (min-width:64rem) {
    .primary-btn span:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
        padding-right: 22px
    }
}

.primary-btn i {
    background-color: var(--color-white);
    width: 37px;
    height: 37px;
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--color-black);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    border-radius: 5px;
    justify-content: center;
    align-items: center;
    display: flex
}

@media (hover:hover) {
    .primary-btn i:is(:where(.group): hover *) {
        background-color:var(--color-primary);
        color: var(--color-white)
    }
}

@media (min-width:48rem) {
    .primary-btn i {
        width: 40px;
        height: 40px
    }
}

.primary-btn i:where([class=dark], [class=dark] *) {
    background-color: var(--color-dark);
    color: var(--color-white)
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

.form-input {
    border-style: var(--tw-border-style);
    width: 100%;
    height: 50px;
    color: var(--color-black);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    --tw-outline-style: none;
    background-color: #f4f4f4;
    border-width: 1px;
    border-color: #f4f4f4;
    outline-style: none;
    padding-inline: 15px;
    display: block
}

.form-input::placeholder {
    color: #666;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out)
}

.form-input:focus::placeholder {
    color: #0000
}

@media (min-width:48rem) {
    .form-input {
        height: 55px;
        padding-inline: 20px
    }
}

.form-input:where([class=dark], [class=dark] *) {
    border-color: var(--color-black);
    background-color: var(--color-black);
    color: var(--color-white)
}

.form-input:where([class=dark], [class=dark] *)::placeholder {
    color: #ffffff80
}

@supports (color:color-mix(in lab, red, red)) {
    .form-input:where([class=dark], [class=dark] *)::placeholder {
        color: color-mix(in oklab, var(--color-white)50%, transparent)
    }
}

textarea.form-input {
    height: 150px;
    padding-top: 15px
}

@media (min-width:64rem) {
    textarea.form-input {
        padding-top: 20px
    }
}

:is(.dark input[type=date], .dark input[type=time])::-webkit-calendar-picker-indicator {
    --tw-invert: invert(100%);
    filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
}

.form-select {
    cursor: pointer;
    appearance: none;
    border-style: var(--tw-border-style);
    width: 100%;
    height: 50px;
    color: var(--color-black);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    --tw-outline-style: none;
    background-color: #f4f4f4;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2367C761' viewBox='0 0 16 16'%3E%3Cpath d='M4.646 6.646a.5.5 0 0 1 .708 0L8 9.293l2.646-2.647a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 24px;
    border-width: 1px;
    border-color: #f4f4f4;
    outline-style: none;
    padding-inline: 15px;
    display: block
}

@media (min-width:48rem) {
    .form-select {
        height: 55px;
        padding-inline: 20px
    }
}

.form-select:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    background-position: right 12px center
}

.form-select:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    background-position: 12px
}

.form-select:where([class=dark],
[class=dark] *) {
    border-color: var(--color-black);
    background-color: var(--color-black);
    color: var(--color-white)
}

#navbar .navbar-nav .nav-item .nav-link.active {
    color: var(--color-primary)
}

#navbar .navbar-nav .nav-item .nav-link.dropdown-toggle:before {
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    --tw-translate-y: calc(calc(1/2*100%)*-1);
    translate: var(--tw-translate-x)var(--tw-translate-y);
    content: var(--tw-content);
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    margin-top: 1px;
    display: inline-block;
    position: absolute;
    top: 50%
}

#navbar .navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    padding-right: 18px
}

#navbar .navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *):before {
    content: var(--tw-content);
    right: -2px
}

#navbar .navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    padding-left: 18px
}

#navbar .navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *):before {
    content: var(--tw-content);
    left: -2px
}

#navbar .navbar-nav .nav-item .nav-link.dropdown-toggle:before {
    --tw-content: "";
    font-family: flaticon_rentq
}

#navbar .navbar-nav .nav-item .dropdown-menu {
    visibility: hidden;
    opacity: 0;
    top: 100%
}

#navbar .navbar-nav .nav-item .dropdown-menu:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    left: calc(var(--spacing)*0)
}

#navbar .navbar-nav .nav-item .dropdown-menu:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    right: calc(var(--spacing)*0)
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link.dropdown-toggle:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *):before {
    content: var(--tw-content);
    right: 20px
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .nav-link.dropdown-toggle:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *):before {
    content: var(--tw-content);
    left: 20px
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu {
    visibility: hidden;
    top: calc(var(--spacing)*0);
    opacity: 0
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    left: 100%
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    right: 100%
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu {
    visibility: hidden;
    opacity: 0
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    left: -100%
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    right: -100%
}

#navbar .navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item:hover .dropdown-menu,
#navbar .navbar-nav .nav-item .dropdown-menu .nav-item:hover .dropdown-menu,
#navbar .navbar-nav .nav-item:hover .dropdown-menu {
    visibility: visible;
    opacity: 1
}

/* Fixed site header — spacer stays constant; topbar slides away via transform (no layout jump) */
.site-header {
    --site-topbar-h: 0px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    width: 100%;
    background: #fff;
    transform: translate3d(0, 0, 0);
    transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease;
    will-change: transform;
}
.dark .site-header {
    background: #0D1416;
}
.site-header.is-scrolled {
    transform: translate3d(0, calc(var(--site-topbar-h) * -1), 0);
    --tw-shadow: 0 8px 24px var(--tw-shadow-color, #959da533);
    box-shadow: var(--tw-inset-shadow, 0 0 #0000), var(--tw-inset-ring-shadow, 0 0 #0000), var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.site-header.is-scrolled .site-topbar {
    pointer-events: none;
}
.dark .site-header.is-scrolled {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}
.site-topbar {
    overflow: hidden;
}
.site-navbar {
    position: relative;
    z-index: 2;
    background: inherit;
}
.site-header-spacer {
    width: 100%;
    flex: none;
    pointer-events: none;
    height: 72px;
}
@media (min-width: 1024px) {
    .site-header {
        --site-topbar-h: 46px;
    }
    .site-header-spacer {
        height: 120px;
    }
}

/* Theme toggle — matches search circle */
.nav-theme-btn {
    flex: none;
    width: 50px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(13, 20, 22, 0.2);
    border-radius: 999px;
    background: transparent;
    color: #0D1416;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.dark .nav-theme-btn {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
}
.nav-theme-btn:hover {
    color: #67C761;
    border-color: rgba(103, 199, 97, 0.55);
    background: rgba(103, 199, 97, 0.1);
}
@media (max-width: 1023px) {
    .nav-theme-btn {
        width: 44px;
        height: 44px;
        font-size: 18px;
        border: 1.5px solid rgba(13, 20, 22, 0.16);
        background: #f4f6f5;
    }
    .dark .nav-theme-btn {
        background: rgba(255, 255, 255, 0.08);
        border-color: rgba(255, 255, 255, 0.22);
    }
}
@media (min-width: 1024px) {
    .nav-theme-btn {
        display: none;
    }
}

#navbar.navbar-sticky {
    top: calc(var(--spacing)*0);
    background-color: transparent;
    --tw-shadow: 0 0 #0000;
    box-shadow: none;
    position: relative;
    border-style: var(--tw-border-style) !important;
    border-width: 0 !important;
    /* Keep padding stable — changing it on scroll causes a height jump */
    padding-block: inherit;
}

@media (min-width:64rem) {
    #navbar.navbar-sticky {
        padding-block: inherit;
    }
}

#navbar.navbar-sticky:where([class=dark],
[class=dark] *) {
    background-color: transparent;
    --tw-shadow: 0 0 #0000;
    box-shadow: none
}

#navbar.navbar-sticky.style-two {
    top: calc(var(--spacing)*0);
    right: calc(var(--spacing)*0);
    left: calc(var(--spacing)*0);
    z-index: 9;
    padding-block: calc(var(--spacing)*0);
    background-color: #0000;
    position: fixed;
    --tw-shadow: 0 0 #0000 !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important
}

#navbar.navbar-sticky.style-two .style-two {
    border-style: var(--tw-border-style) !important;
    background-color: var(--color-black) !important;
    border-width: 0 !important;
    border-radius: 0 !important
}

#navbar.navbar-sticky.style-three {
    background-color: var(--color-black);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

/* Navbar login button */
.nav-login-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 50px;
    padding: 0 8px 0 20px;
    border-radius: 999px;
    border: 1px solid rgba(103, 199, 97, 0.35);
    background: linear-gradient(135deg, #79d473 0%, #67C761 45%, #4fb849 100%);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1;
    box-shadow:
        0 8px 18px rgba(103, 199, 97, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
}
.nav-login-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.28) 42%, transparent 70%);
    transform: translateX(-120%);
    transition: transform 0.55s ease;
    pointer-events: none;
}
.nav-login-btn span {
    position: relative;
    z-index: 1;
}
.nav-login-btn i {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.95);
    color: #2f9a29;
    font-size: 17px;
    box-shadow: 0 2px 6px rgba(13, 20, 22, 0.12);
    transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease;
}
.nav-login-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.03);
    box-shadow:
        0 12px 24px rgba(103, 199, 97, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.34);
    color: #fff;
}
.nav-login-btn:hover::before {
    transform: translateX(120%);
}
.nav-login-btn:hover i {
    transform: scale(1.06);
    background: #fff;
    color: #248f1e;
}
.dark .nav-login-btn {
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow:
        0 10px 22px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

/* Navbar search — mobile dropdown + desktop expand-left */
.nav-search {
    position: relative;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.nav-search__btn {
    flex: none;
    width: 50px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(13, 20, 22, 0.2);
    border-radius: 999px;
    background: transparent;
    color: #0D1416;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.dark .nav-search__btn {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
}
.nav-search__btn:hover,
.nav-search__btn.active {
    color: #67C761;
    border-color: rgba(103, 199, 97, 0.55);
}
.nav-search__shell {
    display: flex;
    align-items: center;
    gap: 6px;
}
.nav-search__input {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    outline: none;
    background: transparent;
    color: #0D1416;
    font-size: 14px;
    font-weight: 500;
}
.dark .nav-search__input {
    color: #fff;
}
.nav-search__input::placeholder {
    color: rgba(13, 20, 22, 0.45);
}
.dark .nav-search__input::placeholder {
    color: rgba(255, 255, 255, 0.45);
}
.nav-search__go {
    flex: none;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    background: #67C761;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
}
.nav-search__go:hover {
    background: #57b552;
    transform: translateX(1px);
}
.nav-header-actions {
    flex: none;
    position: relative;
    z-index: 6;
}

/* Laptop/desktop: sliding expand to the left */
@media (min-width: 1024px) {
    #navbar > .container > .relative.flex {
        gap: 28px;
    }
    .nav-header-actions {
        margin-left: 4px;
    }
    #navbar .navbar-nav {
        column-gap: 28px;
    }
    .nav-search {
        width: 50px;
        transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .nav-search.is-open {
        width: min(320px, 34vw);
    }
    .nav-search__shell {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        gap: 0;
        width: 100%;
        height: 100%;
        padding: 0 50px 0 0;
        border-radius: 999px;
        border: 1px solid transparent;
        background: transparent;
        overflow: hidden;
        opacity: 1;
        visibility: visible;
        transform: none;
        pointer-events: none;
        transition: background 0.25s ease, border-color 0.25s ease;
    }
    .nav-search.is-open .nav-search__shell {
        border-color: rgba(13, 20, 22, 0.2);
        background: #fff;
        pointer-events: auto;
    }
    .dark .nav-search.is-open .nav-search__shell {
        border-color: rgba(255, 255, 255, 0.2);
        background: #0D1416;
    }
    .nav-search__input {
        width: 0;
        height: 100%;
        opacity: 0;
        padding: 0;
        transition: opacity 0.28s ease 0.08s, padding 0.28s ease;
    }
    .nav-search.is-open .nav-search__input {
        width: auto;
        flex: 1 1 auto;
        opacity: 1;
        padding-left: 18px;
        padding-right: 4px;
        pointer-events: auto;
    }
    .nav-search__go {
        display: none;
    }
    .nav-search__btn {
        position: relative;
        z-index: 2;
        border-color: transparent;
        background: transparent;
    }
    .nav-search:not(.is-open) .nav-search__btn {
        border-color: rgba(13, 20, 22, 0.2);
    }
    .dark .nav-search:not(.is-open) .nav-search__btn {
        border-color: rgba(255, 255, 255, 0.2);
    }
}

/* Mobile: dropdown under the icon */
@media (max-width: 1023px) {
    #navbar {
        padding-top: 12.5px;
        padding-bottom: 12.5px;
        min-height: 57px;
        display: flex;
        align-items: center;
    }
    #navbar > .container {
        width: 100%;
    }
    #navbar .relative.flex {
        align-items: center;
        min-height: 48px;
    }
    .site-logo {
        height: 34px;
    }
    .nav-search__shell {
        position: absolute;
        top: calc(100% + 10px);
        right: 0;
        width: min(300px, calc(100vw - 24px));
        padding: 8px 8px 8px 16px;
        border-radius: 14px;
        border: 1px solid rgba(13, 20, 22, 0.12);
        background: #fff;
        box-shadow: 0 12px 28px rgba(13, 20, 22, 0.14);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px) scale(0.98);
        transform-origin: top right;
        pointer-events: none;
        transition:
            opacity 0.22s ease,
            transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
            visibility 0.22s ease;
    }
    .dark .nav-search__shell {
        background: #171E20;
        border-color: rgba(255, 255, 255, 0.12);
        box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
    }
    .nav-search.is-open .nav-search__shell {
        opacity: 1;
        visibility: visible;
        transform: translateY(0) scale(1);
        pointer-events: auto;
    }
    .nav-search__input {
        height: 40px;
    }
    .nav-search__btn {
        width: 44px;
        height: 44px;
        font-size: 22px;
        border: 1.5px solid rgba(13, 20, 22, 0.16);
        background: #f4f6f5;
        border-radius: 50%;
        box-shadow: 0 1px 3px rgba(13, 20, 22, 0.06);
    }
    .dark .nav-search__btn {
        background: rgba(255, 255, 255, 0.08);
        border-color: rgba(255, 255, 255, 0.22);
        color: #fff;
    }
    .nav-search__btn:hover,
    .nav-search__btn.active {
        background: rgba(103, 199, 97, 0.14);
        border-color: rgba(103, 199, 97, 0.55);
        color: #67C761;
    }
}

.sidebar-modal {
    visibility: hidden;
    top: calc(var(--spacing)*0);
    bottom: calc(var(--spacing)*0);
    z-index: 100;
    width: 320px;
    max-width: 100%;
    transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, );
    background-color: var(--color-white);
    opacity: 0;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    flex-direction: column;
    display: flex;
    position: fixed
}

@media (min-width:48rem) {
    .sidebar-modal {
        width: 400px
    }
}

@media (min-width:64rem) {
    .sidebar-modal {
        width: 500px
    }
}

.sidebar-modal:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    right: calc(var(--spacing)*0);
    --tw-translate-x: 100%;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.sidebar-modal:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    left: calc(var(--spacing)*0);
    --tw-translate-x: -100%;
    translate: var(--tw-translate-x)var(--tw-translate-y)
}

.sidebar-modal:where([class=dark],
[class=dark] *) {
    background-color: var(--color-black)
}

.sidebar-modal .sidebar-modal-header {
    border-bottom-style: var(--tw-border-style);
    border-color: #0d14160d;
    border-bottom-width: 1px;
    justify-content: space-between;
    align-items: center;
    display: flex
}

@supports (color:color-mix(in lab, red, red)) {
    .sidebar-modal .sidebar-modal-header {
        border-color: color-mix(in oklab, var(--color-black)5%, transparent)
    }
}

.sidebar-modal .sidebar-modal-header {
    background-color: var(--color-white);
    padding: 20px
}

@media (min-width:48rem) {
    .sidebar-modal .sidebar-modal-header {
        padding: 30px
    }
}

@media (min-width:64rem) {
    .sidebar-modal .sidebar-modal-header {
        padding-inline: 40px
    }
}

.sidebar-modal .sidebar-modal-header:where([class=dark],
[class=dark] *) {
    border-color: #ffffff0d
}

@supports (color:color-mix(in lab, red, red)) {
    .sidebar-modal .sidebar-modal-header:where([class=dark],
    [class=dark] *) {
        border-color: color-mix(in oklab, var(--color-white)5%, transparent)
    }
}

.sidebar-modal .sidebar-modal-header:where([class=dark],
[class=dark] *) {
    background-color: var(--color-black)
}

.sidebar-modal .sidebar-modal-body {
    height: 100vh;
    padding: 20px;
    overflow-y: scroll
}

@media (min-width:48rem) {
    .sidebar-modal .sidebar-modal-body {
        padding: 30px
    }
}

@media (min-width:64rem) {
    .sidebar-modal .sidebar-modal-body {
        padding-inline: 40px
    }
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link.dropdown-toggle:before {
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    content: var(--tw-content);
    --tw-translate-y: calc(calc(1/2*100%)*-1);
    translate: var(--tw-translate-x)var(--tw-translate-y);
    display: inline-block;
    position: absolute;
    top: 50%
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    padding-right: 20px
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *):before {
    content: var(--tw-content);
    right: -2px
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    padding-left: 20px
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link.dropdown-toggle:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *):before {
    content: var(--tw-content);
    left: -2px
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link.dropdown-toggle:before {
    --tw-content: "";
    font-family: flaticon_rentq
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link.active,
.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .nav-link:hover {
    color: var(--color-primary)
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu {
    display: none
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .nav-link.dropdown-toggle:before {
    --tw-content: ""
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu {
    display: none
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .nav-link.dropdown-toggle:before {
    --tw-content: ""
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu {
    display: none
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .nav-link.dropdown-toggle:before {
    --tw-content: ""
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu {
    display: none
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item.active .nav-link.dropdown-toggle:before {
    --tw-content: ""
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item.active .dropdown-menu {
    display: block
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item.active .nav-link.dropdown-toggle:before {
    --tw-content: ""
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item.active .dropdown-menu {
    display: block
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item.active .nav-link.dropdown-toggle:before {
    --tw-content: ""
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item .dropdown-menu .nav-item.active .dropdown-menu {
    display: block
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item.active .nav-link.dropdown-toggle:before {
    --tw-content: ""
}

.sidebar-modal .sidebar-modal-body .sidebar-navbar-nav .nav-item.active .dropdown-menu {
    display: block
}

.sidebar-modal .sidebar-modal-footer {
    border-top-style: var(--tw-border-style);
    border-color: #0d14160d;
    border-top-width: 1px;
    align-items: center;
    gap: 20px;
    display: flex
}

@supports (color:color-mix(in lab, red, red)) {
    .sidebar-modal .sidebar-modal-footer {
        border-color: color-mix(in oklab, var(--color-black)5%, transparent)
    }
}

.sidebar-modal .sidebar-modal-footer {
    background-color: var(--color-white);
    padding: 20px
}

@media (min-width:48rem) {
    .sidebar-modal .sidebar-modal-footer {
        gap: 25px;
        padding: 30px
    }
}

@media (min-width:64rem) {
    .sidebar-modal .sidebar-modal-footer {
        padding-inline: 40px;
        display: none
    }
}

.sidebar-modal .sidebar-modal-footer:where([class=dark],
[class=dark] *) {
    border-color: #ffffff0d
}

@supports (color:color-mix(in lab, red, red)) {
    .sidebar-modal .sidebar-modal-footer:where([class=dark],
    [class=dark] *) {
        border-color: color-mix(in oklab, var(--color-white)5%, transparent)
    }
}

.sidebar-modal .sidebar-modal-footer:where([class=dark],
[class=dark] *) {
    background-color: var(--color-black)
}

.sidebar-modal.show,
.dashboard-sidebar.show {
    visibility: visible;
    opacity: 1;
    translate: none
}

.backdrop {
    visibility: hidden;
    inset: calc(var(--spacing)*0);
    z-index: 99;
    background-color: var(--color-black);
    opacity: 0;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    position: fixed
}

.backdrop.show {
    visibility: visible;
    opacity: .5
}

.scrollbar::-webkit-scrollbar {
    width: 5px
}

.scrollbar::-webkit-scrollbar-thumb {
    background-color: #0d14161a;
    border-radius: 3.40282e38px
}

@supports (color:color-mix(in lab, red, red)) {
    .scrollbar::-webkit-scrollbar-thumb {
        background-color: color-mix(in oklab, var(--color-black)10%, transparent)
    }
}

.scrollbar::-webkit-scrollbar-track {
    background-color: #0000;
    border-radius: 3.40282e38px
}

.dark .scrollbar::-webkit-scrollbar-thumb {
    background-color: #ffffff1a
}

@supports (color:color-mix(in lab, red, red)) {
    .dark .scrollbar::-webkit-scrollbar-thumb {
        background-color: color-mix(in oklab, var(--color-white)10%, transparent)
    }
}

.banner-images .image.active {
    --tw-scale-x: 100%;
    --tw-scale-y: 100%;
    --tw-scale-z: 100%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    opacity: 1
}

html[dir=rtl] .swiper {
    direction: ltr
}

html[dir=rtl] .swiper .swiper-slide * {
    direction: rtl
}

.swiper-pagination-bullets {
    --tw-leading: 1;
    justify-content: center;
    align-items: center;
    gap: 8px;
    line-height: 1;
    display: flex;
    inset: calc(var(--spacing)*0) !important;
    width: auto !important;
    position: relative !important
}

.swiper-pagination-bullets .swiper-pagination-bullet {
    opacity: 1;
    width: 10px;
    height: 10px;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    background-color: #e9f0e5;
    border-radius: 3.40282e38px;
    position: relative;
    margin: calc(var(--spacing)*0) !important
}

@media (hover:hover) {
    .swiper-pagination-bullets .swiper-pagination-bullet:hover {
        background-color: var(--color-primary)
    }
}

.swiper-pagination-bullets .swiper-pagination-bullet:where([class=dark],
[class=dark] *) {
    background-color: #fff3
}

@supports (color:color-mix(in lab, red, red)) {
    .swiper-pagination-bullets .swiper-pagination-bullet:where([class=dark],
    [class=dark] *) {
        background-color: color-mix(in oklab, var(--color-white)20%, transparent)
    }
}

.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--color-primary)
}

.form-check input[type=checkbox] {
    -webkit-appearance: none;
    border-style: var(--tw-border-style);
    background-color: var(--color-white);
    border-width: 1px;
    border-color: #d9d9d9;
    border-radius: 2px;
    width: 18px;
    height: 18px;
    position: relative
}

.form-check input[type=checkbox]:disabled {
    opacity: .35
}

.form-check input[type=checkbox]:where([class=dark],
[class=dark] *) {
    border-color: #ffffff1a
}

@supports (color:color-mix(in lab, red, red)) {
    .form-check input[type=checkbox]:where([class=dark],
    [class=dark] *) {
        border-color: color-mix(in oklab, var(--color-white)10%, transparent)
    }
}

.form-check input[type=checkbox]:where([class=dark],
[class=dark] *) {
    background-color: var(--color-black)
}

.form-check input[type=checkbox]:before {
    content: "";
    border: 2px solid #0000;
    border-width: 0 2px 2px 0;
    width: 4px;
    height: 10px;
    margin-top: -1px;
    margin-left: -1px;
    margin-right: -.5px;
    position: absolute;
    top: 50%;
    right: 50%;
    transform: rotate(45deg)translate(-50%, -50%)
}

.form-check input[type=checkbox]:checked {
    border-color: var(--color-primary);
    background-color: var(--color-primary)
}

.form-check input[type=checkbox]:checked:before {
    border-color: var(--color-white)
}

.form-check input[type=checkbox]:disabled~label {
    opacity: .35
}

.accordion .accordion-item.active .accordion-toggle .ri-add-fill:before {
    content: ""
}

.tabs .nav-tabs .nav-item .nav-link.active {
    color: var(--color-primary)
}

.tabs .tab-content .tab-pane.active {
    display: block
}

#ltrRtlToggle {
    z-index: 9;
    background-color: var(--color-white);
    width: 41px;
    height: 42px;
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
    color: var(--color-black);
    --tw-shadow: 0 8px 24px var(--tw-shadow-color, #959da54d);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    justify-content: center;
    align-items: center;
    display: flex;
    position: fixed;
    bottom: 10px
}

@media (hover:hover) {
    #ltrRtlToggle:hover {
        color: var(--color-primary)
    }
}

@media (min-width:48rem) {
    #ltrRtlToggle {
        bottom: 20px
    }
}

@media (min-width:64rem) {
    #ltrRtlToggle {
        bottom: 30px
    }
}

@media (min-width:80rem) {
    #ltrRtlToggle {
        bottom: 40px
    }
}

#ltrRtlToggle:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    left: 10px
}

@media (min-width:48rem) {
    #ltrRtlToggle:where(:dir(ltr),
    [dir=ltr],
    [dir=ltr] *) {
        left: 20px
    }
}

@media (min-width:64rem) {
    #ltrRtlToggle:where(:dir(ltr),
    [dir=ltr],
    [dir=ltr] *) {
        left: 30px
    }
}

@media (min-width:80rem) {
    #ltrRtlToggle:where(:dir(ltr),
    [dir=ltr],
    [dir=ltr] *) {
        left: 40px
    }
}

#ltrRtlToggle:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    right: 10px
}

@media (min-width:48rem) {
    #ltrRtlToggle:where(:dir(rtl),
    [dir=rtl],
    [dir=rtl] *) {
        right: 20px
    }
}

@media (min-width:64rem) {
    #ltrRtlToggle:where(:dir(rtl),
    [dir=rtl],
    [dir=rtl] *) {
        right: 30px
    }
}

@media (min-width:80rem) {
    #ltrRtlToggle:where(:dir(rtl),
    [dir=rtl],
    [dir=rtl] *) {
        right: 40px
    }
}

#ltrRtlToggle:where([class=dark],
[class=dark] *) {
    background-color: var(--color-black);
    color: var(--color-white);
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
}

#backToTopBtn {
    visibility: hidden;
    bottom: calc(var(--spacing)*0);
    z-index: 9;
    background-color: var(--color-black);
    width: 41px;
    height: 42px;
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
    color: var(--color-white);
    opacity: 0;
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: .3s;
    --tw-ease: var(--ease-in-out);
    transition-duration: .3s;
    transition-timing-function: var(--ease-in-out);
    justify-content: center;
    align-items: center;
    display: flex;
    position: fixed
}

@media (hover:hover) {
    #backToTopBtn:hover {
        background-color: var(--color-primary)
    }
}

#backToTopBtn:where(:dir(ltr),
[dir=ltr],
[dir=ltr] *) {
    right: 10px
}

@media (min-width:48rem) {
    #backToTopBtn:where(:dir(ltr),
    [dir=ltr],
    [dir=ltr] *) {
        right: 20px
    }
}

@media (min-width:64rem) {
    #backToTopBtn:where(:dir(ltr),
    [dir=ltr],
    [dir=ltr] *) {
        right: 30px
    }
}

@media (min-width:80rem) {
    #backToTopBtn:where(:dir(ltr),
    [dir=ltr],
    [dir=ltr] *) {
        right: 40px
    }
}

#backToTopBtn:where(:dir(rtl),
[dir=rtl],
[dir=rtl] *) {
    left: 10px
}

@media (min-width:48rem) {
    #backToTopBtn:where(:dir(rtl),
    [dir=rtl],
    [dir=rtl] *) {
        left: 20px
    }
}

@media (min-width:64rem) {
    #backToTopBtn:where(:dir(rtl),
    [dir=rtl],
    [dir=rtl] *) {
        left: 30px
    }
}

@media (min-width:80rem) {
    #backToTopBtn:where(:dir(rtl),
    [dir=rtl],
    [dir=rtl] *) {
        left: 40px
    }
}

#backToTopBtn i {
    --tw-leading: 1;
    line-height: 1;
    position: relative;
    top: 2px
}

#backToTopBtn.show {
    visibility: visible;
    opacity: 1;
    bottom: 10px
}

@media (min-width:48rem) {
    #backToTopBtn.show {
        bottom: 20px
    }
}

@media (min-width:64rem) {
    #backToTopBtn.show {
        bottom: 30px
    }
}

@media (min-width:80rem) {
    #backToTopBtn.show {
        bottom: 40px
    }
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-scale-x {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-scale-y {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-scale-z {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-ring-inset {
    syntax: "*";
    inherits: false
}

@property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0
}

@property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff
}

@property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-blur {
    syntax: "*";
    inherits: false
}

@property --tw-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-invert {
    syntax: "*";
    inherits: false
}

@property --tw-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-drop-shadow-size {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-blur {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-invert {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-duration {
    syntax: "*";
    inherits: false
}

@property --tw-ease {
    syntax: "*";
    inherits: false
}

@property --tw-content {
    syntax: "*";
    inherits: false;
    initial-value: ""
}
/* Car card image carousel */
.car-image-carousel {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
}
.car-image-carousel .car-carousel-slide {
    display: none;
    width: 100%;
}
.car-image-carousel .car-carousel-slide.is-active {
    display: block;
}
.car-image-carousel .car-carousel-slide img {
    width: 100%;
    display: block;
    border-radius: 15px;
}
.car-carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 38px;
    height: 38px;
    border-radius: 9999px;
    border: none;
    background: rgba(255, 255, 255, 0.55);
    color: rgba(13, 20, 22, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(13, 20, 22, 0.12);
    opacity: 0.75;
    visibility: visible;
    transition: all 0.25s ease;
}
.car-image-carousel:hover .car-carousel-btn,
.car-image-carousel:focus-within .car-carousel-btn {
    opacity: 0.85;
    visibility: visible;
}
.car-carousel-btn:hover {
    background: rgba(103, 199, 97, 0.9);
    color: #fff;
    opacity: 1;
}
.car-carousel-prev {
    left: 12px;
}
.car-carousel-next {
    right: 12px;
}
.car-carousel-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 12px;
    z-index: 5;
    display: flex;
    justify-content: center;
    gap: 6px;
}
.car-carousel-dot {
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    border: none;
    background: rgba(255, 255, 255, 0.55);
    cursor: pointer;
    padding: 0;
    transition: all 0.2s ease;
}
.car-carousel-dot.is-active {
    width: 18px;
    background: #67C761;
}
@media (max-width: 767px) {
    .car-carousel-btn {
        opacity: 0.7;
        visibility: visible;
        width: 34px;
        height: 34px;
        font-size: 20px;
    }
}

/* Home fleet — 2 compact cards per row on mobile */
@media (max-width: 767.98px) {
    .fleet-grid {
        gap: 10px !important;
    }
    .fleet-card {
        border-radius: 12px;
        overflow: hidden;
    }
    .fleet-card .car-image-carousel {
        border-radius: 12px 12px 0 0;
    }
    .fleet-card .car-image-carousel .car-carousel-slide img {
        border-radius: 12px 12px 0 0;
        aspect-ratio: 5 / 4;
        object-fit: cover;
        height: auto;
    }
    .fleet-card .car-carousel-btn {
        width: 22px;
        height: 22px;
        font-size: 15px;
        box-shadow: 0 2px 8px rgba(13, 20, 22, 0.2);
    }
    .fleet-card .car-carousel-prev {
        left: 6px;
    }
    .fleet-card .car-carousel-next {
        right: 6px;
    }
    .fleet-card .car-carousel-dots {
        bottom: 6px;
        gap: 4px;
    }
    .fleet-card .car-carousel-dot {
        width: 5px;
        height: 5px;
    }
    .fleet-card .car-carousel-dot.is-active {
        width: 12px;
    }
    .fleet-card > .car-image-carousel + div {
        padding: 10px 10px 12px !important;
    }
    .fleet-card > .car-image-carousel + div > div:first-child {
        gap: 6px !important;
    }
    .fleet-card h3 {
        font-size: 12.5px !important;
        margin-bottom: 2px !important;
        line-height: 1.25 !important;
    }
    .fleet-card h3 + span {
        font-size: 10px !important;
        line-height: 1.3 !important;
    }
    .fleet-card span.block.font-bold.text-primary {
        font-size: 13px !important;
        margin-bottom: 0 !important;
        line-height: 1.2 !important;
    }
    .fleet-card span.block.font-bold.text-primary + span {
        font-size: 9.5px !important;
    }
    .fleet-card > .car-image-carousel + div > div:nth-child(2) {
        margin-top: 8px !important;
        margin-bottom: 10px !important;
        gap: 4px 2px !important;
    }
    .fleet-card .text-\[35px\] {
        font-size: 16px !important;
        margin-bottom: 1px !important;
    }
    .fleet-card > .car-image-carousel + div > div:nth-child(2) span {
        font-size: 9px !important;
        line-height: 1.2 !important;
    }
    .fleet-card > .car-image-carousel + div > div:last-child {
        gap: 6px !important;
        flex-direction: column;
        align-items: stretch !important;
    }
    .fleet-card .primary-btn {
        width: 100%;
        justify-content: center;
        min-height: 30px;
        padding: 3px 6px !important;
        font-size: 11px !important;
        border-radius: 999px;
    }
    .fleet-card .primary-btn span {
        padding-right: 6px !important;
        padding-left: 6px !important;
    }
    .fleet-card .primary-btn i {
        width: 22px !important;
        height: 22px !important;
        font-size: 12px !important;
    }
    .fleet-card a.inline-block.font-medium {
        text-align: center;
        font-size: 11px !important;
        line-height: 1.2 !important;
    }
}

/* Inner page banner */
.page-banner {
    background: #0D1416;
    padding: 55px 0;
}
.page-banner__glow {
    position: absolute;
    pointer-events: none;
    border-radius: 9999px;
    filter: blur(90px);
}
.page-banner__glow--right {
    top: -40%;
    right: -8%;
    width: 55%;
    height: 160%;
    background: rgba(103, 199, 97, 0.22);
}
.page-banner__glow--left {
    bottom: -20%;
    left: -10%;
    width: 40%;
    height: 80%;
    background: rgba(103, 199, 97, 0.14);
}
.page-banner__car {
    position: absolute;
    inset: 0 0 0 auto;
    width: min(280px, 62%);
    opacity: 0.22;
    pointer-events: none;
    display: block;
}
.page-banner__car img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right bottom;
}
.page-banner__brand {
    margin-bottom: 10px;
}
.page-banner__title {
    color: #fff;
    font-size: 34px;
    line-height: 1.15;
    max-width: 820px;
    margin-bottom: 12px;
}
.page-banner__subtitle {
    color: rgba(255, 255, 255, 0.7);
    max-width: 620px;
    margin: 0 0 16px;
}
.page-banner__crumbs {
    color: rgba(255, 255, 255, 0.72);
    gap: 10px;
}
.page-banner__crumbs > li > span:not(.page-banner__sep) {
    color: rgba(255, 255, 255, 0.88);
}
.page-banner__sep {
    display: block;
    width: 1px;
    height: 14px;
    background: rgba(255, 255, 255, 0.35);
    transform: rotate(15deg);
}
.page-banner__accent {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background: linear-gradient(90deg, #67C761 0%, rgba(103, 199, 97, 0.45) 45%, transparent 100%);
}
@media (min-width: 768px) {
    .page-banner {
        padding: 70px 0;
    }
    .page-banner__title {
        font-size: 44px;
    }
    .page-banner__car {
        width: min(640px, 55%);
        opacity: 0.36;
    }
    .page-banner__crumbs {
        gap: 12px;
    }
}
@media (min-width: 1024px) {
    .page-banner {
        padding: 85px 0;
    }
    .page-banner__title {
        font-size: 52px;
    }
}
@media (min-width: 1280px) {
    .page-banner__title {
        font-size: 58px;
    }
}

/* Who We Are */
.who-we-are {
    background: linear-gradient(180deg, #F4F9F3 0%, #ffffff 55%);
}
.who-we-are__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    align-items: center;
}
.dark .who-we-are {
    background: linear-gradient(180deg, #12191B 0%, #0D1416 55%);
}
.who-we-are__media {
    position: relative;
}
.who-we-are__image {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #0D1416;
}
.who-we-are__image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 45%, rgba(13, 20, 22, 0.55) 100%);
    pointer-events: none;
}
.who-we-are__image img {
    display: block;
    width: 100%;
    height: 420px;
    object-fit: cover;
}
.who-we-are__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 15px;
}
.who-we-are__stat {
    background: #0D1416;
    color: #fff;
    border-radius: 14px;
    padding: 14px 12px;
    text-align: center;
    border: 1px solid rgba(103, 199, 97, 0.25);
}
.who-we-are__stat strong {
    display: block;
    font-size: 22px;
    line-height: 1.1;
    margin-bottom: 4px;
    color: #67C761;
}
.who-we-are__stat strong span {
    font-weight: 500;
    font-size: 0.72em;
    color: rgba(255, 255, 255, 0.75);
}
.who-we-are__stat > span {
    display: block;
    font-size: 12px;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.7);
}
.who-we-are__values {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 24px;
}
.who-we-are__value {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.dark .who-we-are__value {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.08);
}
.who-we-are__value > i {
    flex: none;
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(103, 199, 97, 0.14);
    color: #67C761;
    font-size: 20px;
}
.who-we-are__value strong {
    display: block;
    color: #0D1416;
    margin-bottom: 2px;
    font-size: 15px;
}
.dark .who-we-are__value strong {
    color: #fff;
}
.who-we-are__value span {
    display: block;
    font-size: 13px;
    line-height: 1.4;
    color: inherit;
    opacity: 0.75;
}
.who-we-are__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}
.who-we-are__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    color: #0D1416;
}
.dark .who-we-are__link {
    color: #fff;
}
.who-we-are__link:hover {
    color: #67C761;
}
.who-we-are__link i {
    font-size: 18px;
}
@media (min-width: 640px) {
    .who-we-are__values {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (min-width: 768px) {
    .who-we-are__image img {
        height: 480px;
    }
    .who-we-are__stat {
        padding: 16px 14px;
    }
    .who-we-are__stat strong {
        font-size: 26px;
    }
    .who-we-are__stat > span {
        font-size: 13px;
    }
}
@media (min-width: 1024px) {
    .who-we-are__grid {
        grid-template-columns: 1.05fr 0.95fr;
        gap: 50px;
    }
    .who-we-are__image img {
        height: 540px;
    }
    .who-we-are__stats {
        position: absolute;
        left: 16px;
        right: 16px;
        bottom: 16px;
        margin-top: 0;
        z-index: 2;
    }
}

/* Fleet brands */
.brands-section__panel {
    background: #0D1416;
    border-radius: 20px;
    padding: 28px 22px;
    overflow: hidden;
    position: relative;
}
.brands-section__panel::before {
    content: "";
    position: absolute;
    top: -40%;
    right: -10%;
    width: 50%;
    height: 120%;
    border-radius: 9999px;
    background: rgba(103, 199, 97, 0.16);
    filter: blur(70px);
    pointer-events: none;
}
.brands-section__intro {
    position: relative;
    z-index: 1;
    max-width: 640px;
    margin-bottom: 24px;
}
.brands-section__intro h2 {
    color: #fff;
}
.brands-section__text {
    color: rgba(255, 255, 255, 0.7);
}
.brands-section__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.brands-section__item {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.25s ease;
}
.brands-section__item span {
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.88);
}
.brands-section__item:hover {
    border-color: rgba(103, 199, 97, 0.55);
    background: rgba(103, 199, 97, 0.12);
    transform: translateY(-2px);
}
.brands-section__item:hover span {
    color: #67C761;
}
@media (min-width: 640px) {
    .brands-section__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (min-width: 768px) {
    .brands-section__panel {
        padding: 36px 34px;
    }
    .brands-section__item {
        min-height: 92px;
    }
    .brands-section__item span {
        font-size: 18px;
    }
}
@media (min-width: 1024px) {
    .brands-section__panel {
        padding: 42px 44px;
    }
    .brands-section__intro {
        margin-bottom: 30px;
    }
}

/* Contact page */
.contact-page {
    background: linear-gradient(180deg, #F4F9F3 0%, #ffffff 48%);
}
.dark .contact-page {
    background: linear-gradient(180deg, #12191B 0%, #0D1416 48%);
}
.contact-page__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    align-items: start;
}
.contact-page__lead {
    color: inherit;
    opacity: 0.8;
}
.contact-page__channels {
    display: grid;
    gap: 12px;
    margin-bottom: 22px;
}
.contact-page__channel {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    transition: all 0.25s ease;
}
.dark .contact-page__channel {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.08);
}
.contact-page__channel:hover {
    border-color: rgba(103, 199, 97, 0.45);
    transform: translateY(-2px);
}
.contact-page__channel-icon {
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(103, 199, 97, 0.14);
    color: #67C761;
    font-size: 22px;
}
.contact-page__channel-icon--whatsapp {
    background: rgba(37, 211, 102, 0.16);
    color: #25D366;
}
.contact-page__channel-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.contact-page__channel-body strong {
    color: #0D1416;
    font-size: 15px;
}
.dark .contact-page__channel-body strong {
    color: #fff;
}
.contact-page__channel-body span {
    font-size: 14px;
    color: inherit;
    opacity: 0.75;
    word-break: break-word;
}
.contact-page__office {
    overflow: hidden;
    border-radius: 18px;
    background: #0D1416;
    color: #fff;
}
.contact-page__office-media {
    position: relative;
    height: 220px;
    overflow: hidden;
}
.contact-page__office-media iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    filter: grayscale(0.15) contrast(1.02);
}
.contact-page__office-body {
    padding: 20px 22px 24px;
}
.contact-page__office-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
    padding: 4px 10px;
    border-radius: 9999px;
    background: #67C761;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
}
.contact-page__office-body h3 {
    color: #fff;
    font-size: 18px;
    margin-bottom: 8px;
    line-height: 1.3;
}
.contact-page__office-body p {
    color: rgba(255, 255, 255, 0.72);
    margin-bottom: 18px;
}
.contact-page__office-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
}
.contact-page__office-call {
    font-weight: 600;
    color: #67C761;
}
.contact-page__office-call:hover {
    text-decoration: underline;
}
.contact-page__form-card {
    position: relative;
    overflow: hidden;
    background: #0D1416;
    border-radius: 20px;
    padding: 24px 20px;
}
.contact-page__form-card::before {
    content: "";
    position: absolute;
    top: -35%;
    right: -15%;
    width: 55%;
    height: 90%;
    border-radius: 9999px;
    background: rgba(103, 199, 97, 0.16);
    filter: blur(70px);
    pointer-events: none;
}
.contact-page__form-title {
    position: relative;
    z-index: 1;
    color: #fff;
    font-size: 22px;
    margin-bottom: 8px;
}
.contact-page__form-text {
    position: relative;
    z-index: 1;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 22px;
}
.contact-page__form {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 16px;
}
.contact-page__form-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.contact-page__form label {
    display: block;
    margin-bottom: 7px;
    color: rgba(255, 255, 255, 0.85);
    font-size: 14px;
}
.contact-page__form .form-input {
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: transparent !important;
    border-radius: 8px !important;
    color: #0D1416 !important;
}
.contact-page__form .form-input::placeholder {
    color: rgba(13, 20, 22, 0.45) !important;
}
@media (min-width: 768px) {
    .contact-page__form-row {
        grid-template-columns: 1fr 1fr;
    }
    .contact-page__form-card {
        padding: 32px 30px;
    }
    .contact-page__office-media {
        height: 250px;
    }
}
@media (min-width: 1024px) {
    .contact-page__grid {
        grid-template-columns: 0.95fr 1.05fr;
        gap: 40px;
    }
    .contact-page__form-card {
        padding: 36px 34px;
        position: sticky;
        top: 100px;
    }
}

/* Policy pages */
.policy-page__content {
    max-width: 860px;
    margin: 0 auto;
}
.policy-page__updated {
    display: inline-block;
    margin-bottom: 24px;
    padding: 6px 12px;
    border-radius: 9999px;
    background: rgba(103, 199, 97, 0.12);
    color: #67C761;
    font-size: 13px;
    font-weight: 600;
}
.policy-page__content h2 {
    font-size: 20px;
    line-height: 1.3;
    margin: 28px 0 10px;
    color: #0D1416;
}
.dark .policy-page__content h2 {
    color: #fff;
}
.policy-page__content p,
.policy-page__content li {
    line-height: 1.7;
    margin-bottom: 12px;
}
.policy-page__content ul {
    margin: 0 0 16px;
    padding-left: 18px;
    list-style: disc;
}
.policy-page__content a {
    color: #67C761;
    font-weight: 600;
}
.policy-page__content a:hover {
    text-decoration: underline;
}
.policy-page__content h3 {
    font-size: 16px;
    line-height: 1.3;
    margin: 0 0 10px;
    color: #0D1416;
}
.dark .policy-page__content h3 {
    color: #fff;
}
.policy-roles {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    margin: 8px 0 20px;
}
.policy-roles__card {
    border: 1px solid rgba(13, 20, 22, 0.08);
    border-radius: 14px;
    padding: 18px 18px 8px;
    background: #f7faf7;
}
.dark .policy-roles__card {
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
}
.policy-roles__label {
    display: inline-block;
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #67C761;
}
.policy-roles__card ul {
    margin-bottom: 8px;
}
.policy-example {
    margin: 0 0 16px;
    padding: 14px 16px;
    border-radius: 12px;
    border-left: 3px solid #67C761;
    background: rgba(103, 199, 97, 0.1);
    line-height: 1.7;
}
.dark .policy-example {
    background: rgba(103, 199, 97, 0.12);
}
.policy-declare {
    margin: 0 0 16px;
    padding: 18px 18px 8px;
    border-radius: 14px;
    border: 1px solid rgba(103, 199, 97, 0.35);
    background: rgba(103, 199, 97, 0.08);
}
.policy-declare__note {
    font-size: 14px;
    font-weight: 600;
    color: #0D1416;
}
.dark .policy-declare__note {
    color: #fff;
}
@media (min-width: 768px) {
    .policy-page__content h2 {
        font-size: 22px;
    }
    .policy-roles {
        grid-template-columns: 1fr 1fr;
    }
}

/* Move back-to-top to bottom left */
html[dir=ltr] #backToTopBtn,
html:not([dir=rtl]) #backToTopBtn {
    right: auto !important;
    left: 10px !important;
}
html[dir=rtl] #backToTopBtn {
    left: auto !important;
    right: 10px !important;
}
@media (min-width: 48rem) {
    html[dir=ltr] #backToTopBtn,
    html:not([dir=rtl]) #backToTopBtn {
        left: 20px !important;
    }
    html[dir=rtl] #backToTopBtn {
        right: 20px !important;
    }
}
@media (min-width: 64rem) {
    html[dir=ltr] #backToTopBtn,
    html:not([dir=rtl]) #backToTopBtn {
        left: 30px !important;
    }
    html[dir=rtl] #backToTopBtn {
        right: 30px !important;
    }
}
@media (min-width: 80rem) {
    html[dir=ltr] #backToTopBtn,
    html:not([dir=rtl]) #backToTopBtn {
        left: 40px !important;
    }
    html[dir=rtl] #backToTopBtn {
        right: 40px !important;
    }
}

/* Mobile bottom navigation */
.mobile-bottom-nav {
    display: none;
}
@media (max-width: 991.98px) {
    .mobile-bottom-nav {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: center;
        position: fixed;
        left: 0;
        right: 0;
        bottom: -1px;
        z-index: 40;
        height: calc(65px + env(safe-area-inset-bottom, 0px));
        padding: 8px 6px calc(9px + env(safe-area-inset-bottom, 0px));
        background: #fff;
        backdrop-filter: blur(10px);
        border-top: 0;
        box-shadow: 0 -4px 18px rgba(13, 20, 22, 0.08);
    }
    .dark .mobile-bottom-nav {
        background: #0D1416;
        border-top-color: transparent;
        box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.35);
    }
    .mobile-bottom-nav__item {
        appearance: none;
        border: 0;
        background: transparent;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-width: 0;
        height: 100%;
        padding: 0;
        color: rgba(13, 20, 22, 0.5);
        text-decoration: none;
        font: inherit;
        cursor: pointer;
        transition: color 0.2s ease;
    }
    .dark .mobile-bottom-nav__item {
        color: rgba(255, 255, 255, 0.5);
    }
    .mobile-bottom-nav__item > i {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        font-size: 22px;
        line-height: 1;
    }
    .mobile-bottom-nav__label {
        display: block;
        font-size: 11px;
        font-weight: 600;
        line-height: 1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }
    .mobile-bottom-nav__item.is-active,
    .mobile-bottom-nav__item:hover {
        color: #67C761;
    }
    .mobile-bottom-nav__item--book {
        position: relative;
    }
    .mobile-bottom-nav__book {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        margin-top: -18px;
        border-radius: 50%;
        background: #67C761;
        color: #0D1416;
        box-shadow: 0 6px 16px rgba(103, 199, 97, 0.4);
        border: 3px solid #fff;
    }
    .dark .mobile-bottom-nav__book {
        border-color: #0D1416;
    }
    .mobile-bottom-nav__book i {
        display: block;
        font-size: 22px;
        line-height: 1;
        color: #0D1416;
    }
    .mobile-bottom-nav__item--book .mobile-bottom-nav__label {
        margin-top: -1px;
        color: inherit;
    }
    .mobile-bottom-nav__item--book.is-active,
    .mobile-bottom-nav__item--book:hover {
        color: #67C761;
    }
    .mobile-bottom-nav__item--book:hover .mobile-bottom-nav__book {
        background: #74d06e;
    }
    body:has(.mobile-bottom-nav) {
        padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }
    body:has(.mobile-bottom-nav) .floating-actions {
        bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }
    #backToTopBtn {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

/* Floating WhatsApp + Call */
.floating-actions {
    position: fixed;
    right: 10px;
    bottom: 10px;
    z-index: 200;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.floating-actions__btn {
    width: 48px;
    height: 48px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 24px;
    box-shadow: 0 8px 22px rgba(13, 20, 22, 0.22);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.floating-actions__btn:hover {
    transform: translateY(-2px);
    color: #fff;
}
.floating-actions__btn--whatsapp {
    background: #25D366;
}
.floating-actions__btn--whatsapp:hover {
    background: #1ebe57;
    box-shadow: 0 10px 24px rgba(37, 211, 102, 0.35);
}
.floating-actions__btn--call {
    background: #67C761;
}
.floating-actions__btn--call:hover {
    background: #57b552;
    box-shadow: 0 10px 24px rgba(103, 199, 97, 0.35);
}
@media (min-width: 48rem) {
    .floating-actions {
        right: 20px;
        bottom: 20px;
    }
}
@media (min-width: 64rem) {
    .floating-actions {
        right: 30px;
        bottom: 30px;
    }
}
@media (min-width: 80rem) {
    .floating-actions {
        right: 40px;
        bottom: 40px;
    }
}

/* Cars filter bar */
.cars-filter {
    background: #0D1416;
    border-radius: 18px;
    padding: 18px;
    position: relative;
    overflow: hidden;
}
.cars-filter::before {
    content: "";
    position: absolute;
    top: -40%;
    right: -12%;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(103, 199, 97, 0.16);
    filter: blur(40px);
    pointer-events: none;
}
.cars-filter__form {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}
.cars-filter__field label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 13px;
    font-weight: 600;
}
.cars-filter__field label i {
    color: #67C761;
    font-size: 16px;
}
.cars-filter__field .form-input,
.cars-filter__field .form-select {
    width: 100%;
    min-height: 48px;
    background: #fff !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    color: #0D1416 !important;
    font-size: 16px;
    cursor: pointer;
}
.cars-filter__field .form-input:focus,
.cars-filter__field .form-select:focus {
    border-color: #67C761 !important;
    outline: none;
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.2);
}
.cars-filter__field input[type=\"datetime-local\"] {
    -webkit-appearance: none;
    appearance: none;
    max-width: 100%;
}
.cars-filter__action {
    display: flex;
}
.cars-filter__btn {
    width: 100%;
    justify-content: center;
    min-height: 48px;
}
@media (min-width: 640px) {
    .cars-filter {
        padding: 22px;
    }
    .cars-filter__form {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }
    .cars-filter__action {
        grid-column: 1 / -1;
    }
}
@media (min-width: 1024px) {
    .cars-filter {
        padding: 24px 26px;
    }
    .cars-filter__form {
        grid-template-columns: 1.1fr 1fr 1fr auto;
        align-items: end;
        gap: 16px;
    }
    .cars-filter__action {
        grid-column: auto;
    }
    .cars-filter__btn {
        width: auto;
        min-width: 150px;
        white-space: nowrap;
    }
    .cars-filter__field--to {
        position: relative;
    }
}

/* Cars page spacing */
.cars-page-content {
    padding-top: 24px;
    padding-bottom: 60px;
}
@media (min-width: 768px) {
    .cars-page-content {
        padding-top: 30px;
        padding-bottom: 80px;
    }
}
@media (min-width: 1024px) {
    .cars-page-content {
        padding-top: 36px;
        padding-bottom: 100px;
    }
}
@media (min-width: 1280px) {
    .cars-page-content {
        padding-bottom: 120px;
    }
}

/* Cars pagination */
.car-card.is-hidden-page {
    display: none !important;
}
.cars-pagination__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.cars-pagination__btn {
    width: 42px;
    height: 42px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #f4f4f4;
    color: #0D1416;
    font-size: 16px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.25s ease;
}
.dark .cars-pagination__btn {
    background: #171E20;
    color: #fff;
}
.cars-pagination__btn:hover:not(:disabled):not(.is-active) {
    background: #67C761;
    color: #fff;
}
.cars-pagination__btn.is-active {
    background: #67C761;
    color: #fff;
}
.cars-pagination__btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
@media (min-width: 768px) {
    .cars-pagination__btn {
        width: 48px;
        height: 48px;
        font-size: 17px;
    }
    .cars-pagination__list {
        gap: 10px;
    }
}

/* Compact car cards (4-column grid) */
.car-card {
    position: relative;
    overflow: hidden;
    min-width: 0;
}
.car-card > .car-image-carousel + div {
    padding: 14px !important;
}
.car-card h3 {
    font-size: 15px !important;
    margin-bottom: 2px !important;
    line-height: 1.25 !important;
    min-width: 0;
}
.car-card h3 a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}
.car-card h3 + span {
    font-size: 12px !important;
}
.car-card > .car-image-carousel + div > div:first-child > div:first-child {
    min-width: 0;
    flex: 1 1 auto;
}
.fleet-card h3 {
    min-width: 0;
}
.fleet-card h3 a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}
.car-card span.block.font-bold.text-primary {
    font-size: 16px !important;
    margin-bottom: 0 !important;
    line-height: 1.2 !important;
}
.car-card span.block.font-bold.text-primary + span {
    font-size: 11px !important;
}
.car-card > .car-image-carousel + div > div:nth-child(2) {
    margin-top: 10px !important;
    margin-bottom: 12px !important;
    gap: 4px !important;
}
.car-card .text-\[35px\] {
    font-size: 20px !important;
    margin-bottom: 2px !important;
}
.car-card > .car-image-carousel + div > div:nth-child(2) span {
    font-size: 11px !important;
}
.car-card > .car-image-carousel + div > div:last-child {
    gap: 8px !important;
    flex-direction: column;
    align-items: stretch !important;
}
.car-card .primary-btn {
    width: 100%;
    justify-content: center;
    min-height: 36px;
    padding: 5px 10px !important;
    font-size: 13px !important;
}
.car-card .primary-btn span {
    padding-right: 8px !important;
    padding-left: 8px !important;
}
.car-card .primary-btn i {
    width: 26px !important;
    height: 26px !important;
    font-size: 14px !important;
}
.car-card a.inline-block.font-medium {
    text-align: center;
    font-size: 13px !important;
}
.car-card .car-carousel-btn {
    width: 30px;
    height: 30px;
    font-size: 18px;
}
.car-card .car-carousel-dots {
    bottom: 8px;
}
@media (min-width: 1280px) {
    .car-card > .car-image-carousel + div {
        padding: 12px 14px 14px !important;
    }
}

/* Cars page — 2 compact cards per row on mobile + stop sideways shake */
@media (max-width: 767.98px) {
    html,
    body {
        overflow-x: hidden;
        max-width: 100%;
    }
    .cars-page-content,
    .cars-page-content .container,
    #carsGrid {
        max-width: 100%;
        min-width: 0;
    }
    #carsGrid {
        gap: 10px !important;
    }
    .page-banner--with-filter {
        overflow-x: clip;
        overflow-y: visible;
        max-width: 100%;
    }
    .page-banner__glow--right {
        right: -4%;
        width: 48%;
    }
    .page-banner__glow--left {
        left: -4%;
        width: 34%;
    }
    .cars-banner-filter .datetime-12h--compact .datetime-12h__card {
        grid-template-columns: 1fr;
        min-width: 0;
        max-width: 100%;
    }
    .cars-banner-filter .dt-time-dropdown__menu,
    .cars-banner-filter .dt-date-dropdown__panel {
        max-width: min(280px, calc(100vw - 48px));
        left: 0;
        right: auto;
    }
    .car-card {
        border-radius: 12px;
    }
    .car-card .car-image-carousel {
        border-radius: 12px 12px 0 0;
    }
    .car-card .car-image-carousel .car-carousel-slide img {
        border-radius: 12px 12px 0 0;
        aspect-ratio: 5 / 4;
        object-fit: cover;
        height: auto;
    }
    .car-card .car-carousel-btn {
        width: 22px;
        height: 22px;
        font-size: 15px;
        box-shadow: 0 2px 8px rgba(13, 20, 22, 0.2);
    }
    .car-card .car-carousel-prev {
        left: 6px;
    }
    .car-card .car-carousel-next {
        right: 6px;
    }
    .car-card .car-carousel-dots {
        bottom: 6px;
        gap: 4px;
    }
    .car-card .car-carousel-dot {
        width: 5px;
        height: 5px;
    }
    .car-card .car-carousel-dot.is-active {
        width: 12px;
    }
    .car-card > .car-image-carousel + div {
        padding: 10px 10px 12px !important;
    }
    .car-card > .car-image-carousel + div > div:first-child {
        gap: 6px !important;
    }
    .car-card h3 {
        font-size: 12.5px !important;
        margin-bottom: 2px !important;
        line-height: 1.25 !important;
    }
    .car-card h3 + span {
        font-size: 10px !important;
        line-height: 1.3 !important;
    }
    .car-card span.block.font-bold.text-primary {
        font-size: 13px !important;
        margin-bottom: 0 !important;
        line-height: 1.2 !important;
    }
    .car-card span.block.font-bold.text-primary + span {
        font-size: 9.5px !important;
    }
    .car-card > .car-image-carousel + div > div:nth-child(2) {
        margin-top: 8px !important;
        margin-bottom: 10px !important;
        gap: 4px 2px !important;
    }
    .car-card .text-\[35px\] {
        font-size: 16px !important;
        margin-bottom: 1px !important;
    }
    .car-card > .car-image-carousel + div > div:nth-child(2) span {
        font-size: 9px !important;
        line-height: 1.2 !important;
    }
    .car-card > .car-image-carousel + div > div:last-child {
        gap: 6px !important;
        flex-direction: column;
        align-items: stretch !important;
    }
    .car-card .primary-btn {
        width: 100%;
        justify-content: center;
        min-height: 30px;
        padding: 3px 6px !important;
        font-size: 11px !important;
    }
    .car-card .primary-btn span {
        padding-right: 6px !important;
        padding-left: 6px !important;
    }
    .car-card .primary-btn i {
        width: 22px !important;
        height: 22px !important;
        font-size: 12px !important;
    }
    .car-card a.inline-block.font-medium {
        text-align: center;
        font-size: 11px !important;
        line-height: 1.2 !important;
    }
}

/* Booking form */
.booking-form-card {
    width: 100%;
    max-width: 100%;
    overflow: visible;
    container-type: inline-size;
    container-name: booking;
}
.car-details-sidebar__sticky .booking-form-card {
    overflow: hidden;
}
.booking-form-card__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}
.booking-form-card__icon {
    flex: none;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: rgba(103, 199, 97, 0.15);
    color: #67C761;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}
.booking-form-card__title {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    color: #0D1416;
}
.dark .booking-form-card__title {
    color: #fff;
}
.booking-form-card__subtitle {
    margin: 3px 0 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
    color: rgba(13, 20, 22, 0.55);
}
.dark .booking-form-card__subtitle {
    color: rgba(255, 255, 255, 0.55);
}
@media (min-width: 768px) {
    .booking-form-card__title {
        font-size: 20px;
    }
}
.booking-form {
    width: 100%;
    max-width: 100%;
}
.booking-form__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-bottom: 12px;
    width: 100%;
}
.booking-form__field {
    min-width: 0;
    max-width: 100%;
}
.booking-form__field label {
    display: block;
    margin-bottom: 4px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
}
.booking-form__field .form-input {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    min-height: 36px !important;
    height: 36px;
    padding: 6px 10px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
}
.booking-field__label {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    margin-bottom: 6px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.2;
}
.dark .booking-field__label {
    color: rgba(255, 255, 255, 0.55);
}
.booking-field__label i {
    font-size: 14px;
    color: #67C761;
}
.booking-field__input {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    min-height: 42px;
    height: 42px;
    padding: 0 12px;
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    background: #fff;
    color: #0D1416;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.dark .booking-field__input {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.booking-field__input::placeholder {
    color: rgba(13, 20, 22, 0.45);
    font-weight: 400;
}
.dark .booking-field__input::placeholder {
    color: rgba(255, 255, 255, 0.4);
}
.booking-field__input:focus {
    border-color: #67C761;
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.18);
}
.booking-form__field--full {
    grid-column: 1 / -1;
}
.booking-form .primary-btn {
    width: 100%;
    max-width: 100%;
    justify-content: center;
}
.booking-duration {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(103, 199, 97, 0.12);
    border: 1px solid rgba(103, 199, 97, 0.35);
}
.booking-duration.is-hidden {
    display: none;
}
.booking-duration.is-error {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.35);
}
.booking-duration__label {
    display: block;
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.5);
    line-height: 1.2;
    flex: 0 0 auto;
}
.booking-duration.is-error .booking-duration__label {
    color: rgba(185, 28, 28, 0.7);
}
.booking-duration strong {
    display: block;
    margin: 0;
    font-size: 13px;
    font-weight: 750;
    color: #1f6b1b;
    line-height: 1.3;
    text-align: right;
}
.booking-duration.is-error strong {
    color: #b91c1c;
    font-size: 12.5px;
    font-weight: 700;
}

.booking-availability {
    margin: 0 0 16px;
    padding: 14px;
    border-radius: 14px;
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.28);
}
.booking-availability.is-hidden {
    display: none !important;
}
.booking-availability.is-conflict {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.28);
}
.booking-availability__head {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 10px;
}
.booking-availability__head > i {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(245, 158, 11, 0.18);
    color: #b45309;
    font-size: 18px;
}
.booking-availability.is-conflict .booking-availability__head > i {
    background: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}
.booking-availability__head strong {
    display: block;
    font-size: 14px;
    font-weight: 800;
    color: #0d1416;
}
.booking-availability__head p {
    margin: 2px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.62);
}
.booking-availability__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.booking-availability__list li {
    display: grid;
    gap: 2px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(13, 20, 22, 0.06);
    font-size: 12px;
    font-weight: 700;
    color: #0d1416;
    line-height: 1.4;
}
.booking-availability__list em {
    font-style: normal;
    font-size: 11px;
    font-weight: 750;
    color: #b45309;
}
.booking-availability__free {
    display: block;
    margin-top: 2px;
    font-size: 11px;
    font-weight: 700;
    color: #1f6b1b;
}
.booking-availability__live {
    margin: 10px 0 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(220, 38, 38, 0.1);
    color: #b91c1c;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.4;
}
.booking-availability__live.is-hidden {
    display: none !important;
}
.booking-submit.is-unavailable {
    opacity: 0.55;
    pointer-events: none;
}
.booking-form input[type="datetime-local"] {
    font-size: 12px !important;
    min-height: 36px !important;
    height: 36px;
    padding-inline: 8px !important;
}
.datetime-12h {
    width: 100%;
    min-width: 0;
    overflow: visible;
}
.datetime-12h__card {
    display: grid;
    gap: 10px;
    padding: 12px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #d9d9d9;
    box-shadow: 0 1px 2px rgba(13, 20, 22, 0.04);
    overflow: visible;
}
.dark .datetime-12h__card {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
}
.datetime-12h__part {
    min-width: 0;
    overflow: visible;
}
.datetime-12h__part-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.55);
}
.dark .datetime-12h__part-label {
    color: rgba(255, 255, 255, 0.55);
}
.datetime-12h__part-label i {
    font-size: 14px;
    color: #67C761;
}
.dt-date-dropdown {
    position: relative;
    width: 100%;
    overflow: visible;
}
.dt-date-dropdown__trigger {
    width: 100%;
    min-height: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #f8faf8;
    color: #0D1416;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.dark .dt-date-dropdown__trigger {
    background: #0D1416;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.dt-date-dropdown.is-open .dt-date-dropdown__trigger {
    border-color: rgba(103, 199, 97, 0.55);
    box-shadow: 0 0 0 2px rgba(103, 199, 97, 0.28);
    background: #fff;
}
.dark .dt-date-dropdown.is-open .dt-date-dropdown__trigger {
    background: #171E20;
}
.dt-date-dropdown__value.is-placeholder {
    color: rgba(13, 20, 22, 0.45);
    font-weight: 500;
}
.dark .dt-date-dropdown__value.is-placeholder {
    color: rgba(255, 255, 255, 0.45);
}
.dt-date-dropdown__trigger i {
    font-size: 18px;
    color: #67C761;
}
.dt-date-dropdown__panel {
    position: absolute;
    left: 0;
    right: auto;
    top: calc(100% + 6px);
    z-index: 80;
    width: min(320px, calc(100vw - 32px));
    min-width: min(260px, calc(100vw - 32px));
    padding: 12px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(103, 199, 97, 0.28);
    box-shadow: 0 16px 36px rgba(13, 20, 22, 0.16);
}
.dark .dt-date-dropdown__panel {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
}
.dt-cal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.dt-cal__title {
    font-size: 14px;
    font-weight: 800;
    color: #0D1416;
}
.dark .dt-cal__title {
    color: #fff;
}
.dt-cal__nav {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(103, 199, 97, 0.12);
    color: #67C761;
    font-size: 20px;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}
.dt-cal__nav:hover {
    background: #67C761;
    color: #fff;
}
.dt-cal__weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 6px;
}
.dt-cal__weekdays span {
    text-align: center;
    font-size: 11px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.45);
    padding: 4px 0;
}
.dark .dt-cal__weekdays span {
    color: rgba(255, 255, 255, 0.45);
}
.dt-cal__days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.dt-cal__day {
    aspect-ratio: 1;
    min-height: 34px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #0D1416;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.dark .dt-cal__day {
    color: #fff;
}
.dt-cal__day:hover:not(:disabled) {
    background: rgba(103, 199, 97, 0.14);
}
.dt-cal__day.is-muted {
    color: rgba(13, 20, 22, 0.28);
}
.dark .dt-cal__day.is-muted {
    color: rgba(255, 255, 255, 0.28);
}
.dt-cal__day.is-today:not(.is-selected) {
    box-shadow: inset 0 0 0 1.5px rgba(103, 199, 97, 0.7);
    color: #67C761;
}
.dt-cal__day.is-selected {
    background: #67C761;
    color: #fff;
    box-shadow: 0 4px 12px rgba(103, 199, 97, 0.35);
}
.dt-cal__day.is-disabled,
.dt-cal__day:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}
.datetime-12h__timebox {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: 42px;
    min-height: 42px;
    padding: 3px;
    box-sizing: border-box;
    border-radius: 10px;
    background: #f8faf8;
    border: 1px solid #e5e7eb;
    overflow: visible;
}
.dark .datetime-12h__timebox {
    background: #0D1416;
    border-color: rgba(255, 255, 255, 0.12);
}
.dt-time-dropdown {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    overflow: visible;
}
.dt-time-dropdown__trigger {
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0 10px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: #0D1416;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(13, 20, 22, 0.06);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
    outline: none;
}
.dt-time-dropdown__trigger:focus,
.dt-time-dropdown__trigger:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px rgba(103, 199, 97, 0.35);
}
.dark .dt-time-dropdown__trigger {
    background: #171E20;
    color: #fff;
}
.dt-time-dropdown.is-open .dt-time-dropdown__trigger {
    box-shadow: 0 0 0 2px rgba(103, 199, 97, 0.35);
}
.dt-time-dropdown__trigger i {
    display: none;
}
.dt-time-dropdown__menu {
    position: absolute;
    left: 0;
    right: auto;
    top: calc(100% + 6px);
    z-index: 80;
    width: 120px;
    min-width: 120px;
    max-height: 220px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 6px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid rgba(103, 199, 97, 0.28);
    box-shadow: 0 14px 34px rgba(13, 20, 22, 0.16);
}
.dark .dt-time-dropdown__menu {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
}
.dt-time-dropdown__menu::-webkit-scrollbar {
    width: 6px;
}
.dt-time-dropdown__menu::-webkit-scrollbar-thumb {
    background: rgba(103, 199, 97, 0.45);
    border-radius: 999px;
}
.dt-time-dropdown__option {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #0D1416;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.dark .dt-time-dropdown__option {
    color: #fff;
}
.dt-time-dropdown__option:hover {
    background: rgba(103, 199, 97, 0.12);
    color: #0D1416;
}
.dark .dt-time-dropdown__option:hover {
    color: #fff;
}
.dt-time-dropdown__option.is-selected {
    background: #67C761;
    color: #fff;
}
.datetime-12h__ampm {
    --ampm-pad: 2px;
    --ampm-gap: 2px;
    position: relative;
    flex: none;
    align-self: stretch;
    display: inline-grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    padding: var(--ampm-pad);
    border-radius: 9px;
    background: rgba(13, 20, 22, 0.06);
    gap: var(--ampm-gap);
}
.dark .datetime-12h__ampm {
    background: rgba(255, 255, 255, 0.08);
}
.datetime-12h__ampm::before {
    content: "";
    position: absolute;
    top: var(--ampm-pad);
    bottom: var(--ampm-pad);
    left: var(--ampm-pad);
    width: calc((100% - (var(--ampm-pad) * 2) - var(--ampm-gap)) / 2);
    border-radius: 7px;
    background: #67C761;
    box-shadow: 0 2px 8px rgba(103, 199, 97, 0.35);
    transform: translateX(0);
    transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
    z-index: 0;
    pointer-events: none;
}
.datetime-12h__ampm.is-pm::before {
    transform: translateX(calc(100% + var(--ampm-gap)));
}
.datetime-12h__ampm button {
    position: relative;
    z-index: 1;
    min-width: 42px;
    height: auto;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: rgba(13, 20, 22, 0.55);
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    transition: color 0.28s ease;
}
.dark .datetime-12h__ampm button {
    color: rgba(255, 255, 255, 0.55);
}
.datetime-12h__ampm button.is-active {
    background: transparent;
    color: #fff;
    box-shadow: none;
}
.datetime-12h--compact .datetime-12h__card {
    padding: 10px;
    gap: 8px;
    background: rgba(255, 255, 255, 0.96);
}
.datetime-12h--compact .dt-date-dropdown__trigger {
    min-height: 40px !important;
    height: 40px;
    font-size: 13px !important;
}
.datetime-12h--compact .datetime-12h__timebox {
    height: 40px;
    min-height: 40px;
    padding: 3px;
}
.datetime-12h--compact .dt-time-dropdown__trigger {
    min-height: 0 !important;
    height: 100%;
    font-size: 13px !important;
}
.datetime-12h--compact .datetime-12h__ampm button {
    min-width: 38px;
}
.cars-banner-filter__field--datetime {
    min-width: 0;
}
.cars-banner-filter .dt-time-dropdown__menu,
.cars-banner-filter .dt-date-dropdown__panel {
    z-index: 60;
}
@container booking (min-width: 380px) {
    .booking-form__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 10px;
    }
}

/* Booking document uploads */
.booking-docs {
    display: grid;
    gap: 14px;
    margin-bottom: 14px;
}
.booking-docs__head h4 {
    margin: 0 0 2px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    color: #0D1416;
}
.dark .booking-docs__head h4 {
    color: #fff;
}
.booking-docs__head p {
    margin: 0 0 8px;
    font-size: 12px;
    opacity: 0.65;
    line-height: 1.3;
}
.booking-docs__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.booking-docs__grid--single {
    grid-template-columns: 1fr;
}
.doc-upload {
    position: relative;
    min-width: 0;
}
.doc-upload__input {
    position: absolute;
    inset: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
}
.doc-upload.has-file .doc-upload__input {
    pointer-events: none;
    z-index: 0;
}
.doc-upload__drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 110px;
    padding: 12px 10px;
    border-radius: 10px;
    border: 1.5px dashed rgba(103, 199, 97, 0.55);
    background: rgba(103, 199, 97, 0.06);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}
.doc-upload__drop:hover {
    border-color: #67C761;
    background: rgba(103, 199, 97, 0.12);
}
.dark .doc-upload__drop {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(103, 199, 97, 0.4);
}
.doc-upload__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 9999px;
    background: rgba(103, 199, 97, 0.16);
    color: #67C761;
    font-size: 18px;
    margin-bottom: 2px;
}
.doc-upload__title {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #0D1416;
    line-height: 1.2;
}
.dark .doc-upload__title {
    color: #fff;
}
.doc-upload__hint {
    display: block;
    font-size: 11px;
    opacity: 0.6;
    line-height: 1.2;
}
.doc-upload.is-compressing {
    pointer-events: none;
    opacity: 0.72;
}
.doc-upload.is-compressing::after {
    content: "Optimizing image…";
    position: absolute;
    inset: auto 10px 10px;
    z-index: 3;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.78);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    pointer-events: none;
}
.doc-upload__preview {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 110px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(103, 199, 97, 0.35);
    background: #fff;
}
.dark .doc-upload__preview {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
}
.doc-upload__preview.is-hidden {
    display: none;
}
.doc-upload.has-file .doc-upload__drop {
    display: none;
}
.doc-upload__image {
    display: none;
    width: 100%;
    height: 110px;
    object-fit: cover;
    cursor: zoom-in;
}
.doc-upload.is-image .doc-upload__image {
    display: block;
}
.doc-upload.is-image .doc-upload__preview {
    cursor: zoom-in;
}
.doc-upload__file {
    display: none;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 14px 12px;
    text-align: center;
    color: #67C761;
    font-size: 28px;
}
.doc-upload.is-file .doc-upload__file {
    display: flex;
}
.doc-upload__name {
    display: block;
    max-width: 100%;
    font-size: 11px;
    font-weight: 600;
    color: #0D1416;
    line-height: 1.3;
    word-break: break-word;
}
.dark .doc-upload__name {
    color: #fff;
}
.doc-upload__remove {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 3;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0D1416;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(13, 20, 22, 0.28);
}
.doc-upload__remove:hover {
    background: #dc2626;
    color: #fff;
}

/* Document enlarge lightbox */
.doc-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.doc-lightbox.is-hidden {
    display: none;
}
.doc-lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(13, 20, 22, 0.88);
    cursor: pointer;
}
.doc-lightbox__dialog {
    position: relative;
    z-index: 1;
    width: min(960px, 100%);
    max-height: min(90vh, 900px);
    display: flex;
    align-items: center;
    justify-content: center;
}
.doc-lightbox__image {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: min(86vh, 860px);
    object-fit: contain;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
}
.doc-lightbox__close {
    position: absolute;
    top: -10px;
    right: -10px;
    z-index: 2;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #0D1416;
    font-size: 22px;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
}
.doc-lightbox__close:hover {
    background: #dc2626;
    color: #fff;
}
@media (max-width: 640px) {
    .doc-lightbox__close {
        top: -6px;
        right: 0;
    }
}
body.doc-lightbox-open {
    overflow: hidden;
}
.doc-upload__ocr {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    padding: 5px 8px;
    background: rgba(13, 20, 22, 0.78);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    text-align: center;
    line-height: 1.2;
}
.doc-upload__ocr.is-hidden {
    display: none;
}
.doc-upload__ocr.is-success {
    background: rgba(103, 199, 97, 0.92);
}
.doc-upload__ocr.is-error {
    background: rgba(220, 38, 38, 0.88);
}
.booking-docs__number-field {
    margin-top: 10px;
}
.booking-docs__number-row {
    display: flex;
    align-items: stretch;
    gap: 8px;
}
.booking-docs__number-row .form-input {
    flex: 1 1 auto;
    min-width: 0;
}
.booking-docs__check-btn {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 36px;
    padding: 0 12px;
    border: 0;
    border-radius: 5px;
    background: #67C761;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s ease;
}
.booking-docs__check-btn:hover {
    background: #57b552;
    color: #fff;
}
.booking-docs__check-btn.is-verified,
.booking-docs__check-btn.is-verified:hover {
    background: #0D1416;
    color: #fff;
    cursor: default;
}
.booking-docs__check-btn:disabled {
    opacity: 1;
}
.booking-docs__check-btn i {
    font-size: 15px;
}
.booking-docs__number-row.is-valid .form-input {
    border-color: #67C761 !important;
}
.booking-docs__number-row.is-invalid .form-input {
    border-color: #dc2626 !important;
}
.booking-docs__status {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.3;
    min-height: 14px;
    opacity: 0.75;
}
.booking-docs__status.is-loading {
    color: #67C761;
    opacity: 1;
}
.booking-docs__status.is-success {
    color: #67C761;
    opacity: 1;
}
.booking-docs__status.is-error {
    color: #dc2626;
    opacity: 1;
}

/* Car specifications cards */
.car-specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.car-specs__card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border-radius: 12px;
    background: #F4F9F3;
    border: 1px solid rgba(103, 199, 97, 0.22);
    min-width: 0;
}
.dark .car-specs__card {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.1);
}
.car-specs__icon {
    flex: none;
    width: 38px;
    height: 38px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(103, 199, 97, 0.14);
    color: #67C761;
    font-size: 18px;
}
.car-specs__label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    opacity: 0.7;
    margin-bottom: 2px;
}
.car-specs__card strong {
    display: block;
    font-size: 13px;
    color: #0D1416;
    line-height: 1.3;
    word-break: break-word;
}
.dark .car-specs__card strong {
    color: #fff;
}
@media (min-width: 768px) {
    .car-specs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }
    .car-specs__card {
        gap: 12px;
        padding: 14px 16px;
    }
    .car-specs__icon {
        width: 44px;
        height: 44px;
        font-size: 22px;
    }
    .car-specs__label {
        font-size: 12px;
    }
    .car-specs__card strong {
        font-size: 15px;
    }
}

/* Booking submit CTA */
.booking-submit {
    width: 100%;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 58px;
    padding: 8px 8px 8px 18px;
    border: 1px solid #0D1416;
    border-radius: 12px;
    background: #0D1416;
    color: #fff;
    cursor: pointer;
    text-align: left;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.2s ease;
}
.booking-submit__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.booking-submit__eyebrow {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.62);
    line-height: 1.2;
}
.booking-submit__label {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
}
.booking-submit__meta {
    margin-left: auto;
    flex: none;
    text-align: right;
}
.booking-submit__rate {
    display: inline-flex;
    align-items: baseline;
    gap: 2px;
    font-size: 18px;
    font-weight: 700;
    color: #67C761;
    line-height: 1;
    white-space: nowrap;
}
.booking-submit__rate span {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: rgba(255, 255, 255, 0.55);
}
.booking-submit__eyebrow.is-duration {
    color: #67C761;
    text-transform: none;
    letter-spacing: 0;
    font-size: 12px;
    font-weight: 700;
}
.booking-submit__eyebrow.is-error {
    color: #f87171;
}
.booking-submit__icon {
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: #67C761;
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    transition: transform 0.25s ease, background 0.25s ease;
}
.booking-submit:hover {
    background: #151d20;
    border-color: #151d20;
}
.booking-submit:hover .booking-submit__icon {
    transform: translateX(3px);
    background: #74d06e;
}
.booking-submit:focus-visible {
    outline: 2px solid #67C761;
    outline-offset: 3px;
}

/* Mobile sticky Book Now (car details) */
.mobile-book-bar {
    display: none;
}
#bookingSection {
    scroll-margin-top: 90px;
}
@media (max-width: 991.98px) {
    .mobile-book-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: calc(74px + env(safe-area-inset-bottom, 0px));
        z-index: 30;
        padding: 10px 10px 10px 16px;
        background: #0D1416;
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 16px;
        box-shadow: 0 10px 28px rgba(13, 20, 22, 0.35);
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
        transition: transform 0.28s ease, opacity 0.28s ease, visibility 0.28s ease;
    }
    .mobile-book-bar.is-hidden {
        transform: translateY(120%);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
    .mobile-book-bar__price {
        color: #fff;
        min-width: 0;
    }
    .mobile-book-bar__amount {
        display: inline-flex;
        align-items: baseline;
        gap: 2px;
        font-size: 20px;
        font-weight: 700;
        color: #67C761;
        line-height: 1.1;
    }
    .mobile-book-bar__amount span {
        font-size: 12px;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.55);
        margin-left: 0;
    }
    .mobile-book-bar__note {
        display: block;
        margin-top: 3px;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 0;
        text-transform: none;
        color: rgba(255, 255, 255, 0.72);
        line-height: 1.25;
    }
    .mobile-book-bar__note.is-error {
        color: #f87171;
    }
    .mobile-book-bar__btn {
        flex: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 46px;
        padding: 0 16px 0 18px;
        border-radius: 12px;
        background: #67C761;
        color: #0D1416;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
        white-space: nowrap;
        transition: background 0.2s ease, transform 0.2s ease;
    }
    .mobile-book-bar__btn i {
        font-size: 18px;
        line-height: 1;
        transition: transform 0.2s ease;
    }
    .mobile-book-bar__btn:hover {
        background: #74d06e;
        color: #0D1416;
    }
    .mobile-book-bar__btn:hover i {
        transform: translateX(2px);
    }
    body.has-mobile-book-bar {
        padding-bottom: calc(160px + env(safe-area-inset-bottom, 0px));
    }
    body.has-mobile-book-bar .floating-actions {
        bottom: calc(160px + env(safe-area-inset-bottom, 0px));
        transition: bottom 0.28s ease;
    }
    body.has-mobile-book-bar #backToTopBtn {
        bottom: calc(160px + env(safe-area-inset-bottom, 0px));
        transition: bottom 0.28s ease;
    }
    body.has-mobile-book-bar.mobile-book-bar-hidden {
        padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }
    body.has-mobile-book-bar.mobile-book-bar-hidden .floating-actions {
        bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }
    body.has-mobile-book-bar.mobile-book-bar-hidden #backToTopBtn {
        bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }
}

/* Car details photo gallery */
.car-detail-gallery {
    margin-bottom: 20px;
}
.car-detail-gallery__main {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
    background: #0D1416;
}
.car-detail-gallery__image {
    display: block;
    width: 100%;
    height: 280px;
    object-fit: cover;
}
.car-detail-gallery__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.95);
    color: #0D1416;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(13, 20, 22, 0.18);
    transition: all 0.25s ease;
}
.car-detail-gallery__nav:hover {
    background: #67C761;
    color: #fff;
}
.car-detail-gallery__nav--prev {
    left: 12px;
}
.car-detail-gallery__nav--next {
    right: 12px;
}
.car-detail-gallery__zoom {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 3;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}
.car-detail-gallery__zoom:hover {
    background: #67C761;
    color: #fff;
}
.car-detail-gallery__thumbs {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}
.car-detail-gallery__thumb {
    border: 2px solid transparent;
    border-radius: 10px;
    overflow: hidden;
    padding: 0;
    background: transparent;
    cursor: pointer;
    opacity: 0.7;
    transition: all 0.25s ease;
}
.car-detail-gallery__thumb img {
    display: block;
    width: 100%;
    height: 64px;
    object-fit: cover;
}
.car-detail-gallery__thumb.is-active,
.car-detail-gallery__thumb:hover {
    opacity: 1;
    border-color: #67C761;
}
@media (min-width: 768px) {
    .car-detail-gallery__image {
        height: 420px;
    }
    .car-detail-gallery__thumb img {
        height: 78px;
    }
}
@media (min-width: 1024px) {
    .car-detail-gallery__image {
        height: 460px;
    }
}

/* Car details breadcrumb */
.car-details-crumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.55);
}
.dark .car-details-crumb {
    color: rgba(255, 255, 255, 0.55);
}
.car-details-crumb a {
    color: #67C761;
    font-weight: 600;
}
.car-details-crumb a:hover {
    text-decoration: underline;
}

.car-details-layout {
    align-items: stretch;
}
.car-details-main {
    min-width: 0;
}
.car-details-sidebar {
    min-width: 0;
}
.car-details-sidebar__sticky {
    position: relative;
    z-index: 1;
}
.car-details-sidebar__sticky .booking-form-card {
    margin-bottom: 0;
}
.car-details-included {
    max-width: 100%;
}
@media (min-width: 1024px) {
    /* Booking column matches left height; card sticks in viewport while page scrolls */
    .car-details-sidebar {
        height: 0;
        min-height: 100%;
        max-height: 100%;
        overflow: visible;
        display: block;
        align-self: stretch;
    }
    .car-details-sidebar__sticky {
        position: sticky;
        top: 120px;
        z-index: 1;
        display: flex;
        flex-direction: column;
        min-height: 0;
        height: auto;
        max-height: calc(100vh - 140px);
        overflow: hidden;
        transition: top 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    }
    body.is-header-scrolled .car-details-sidebar__sticky {
        top: 84px;
        max-height: calc(100vh - 100px);
    }
    .car-details-sidebar__sticky .booking-form-card {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        min-height: 0;
        height: 100%;
        max-height: calc(100vh - 140px);
        margin-bottom: 0;
        overflow: hidden;
        padding: 18px 16px 14px !important;
        border: 1px solid rgba(13, 20, 22, 0.06);
        box-shadow: 0 10px 28px rgba(13, 20, 22, 0.04);
    }
    body.is-header-scrolled .car-details-sidebar__sticky .booking-form-card {
        max-height: calc(100vh - 100px);
    }
    .car-details-sidebar__sticky .booking-form-card__head {
        flex: 0 0 auto;
        margin-bottom: 12px;
        padding-bottom: 12px;
        border-bottom: 1px solid rgba(13, 20, 22, 0.07);
    }
    .dark .car-details-sidebar__sticky .booking-form-card__head {
        border-bottom-color: rgba(255, 255, 255, 0.1);
    }
    .car-details-sidebar__sticky .booking-form {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        gap: 0;
    }
    .car-details-sidebar__sticky .booking-form__body {
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 2px 4px 8px 0;
        margin-right: -2px;
        scrollbar-width: thin;
        scrollbar-color: rgba(13, 20, 22, 0.28) transparent;
    }
    .car-details-sidebar__sticky .booking-form__body::-webkit-scrollbar {
        width: 6px;
    }
    .car-details-sidebar__sticky .booking-form__body::-webkit-scrollbar-track {
        background: transparent;
    }
    .car-details-sidebar__sticky .booking-form__body::-webkit-scrollbar-thumb {
        background: rgba(13, 20, 22, 0.22);
        border-radius: 999px;
    }
    .car-details-sidebar__sticky .booking-form__body::-webkit-scrollbar-thumb:hover {
        background: rgba(13, 20, 22, 0.38);
    }
    .car-details-sidebar__sticky .booking-form__body > :first-child {
        margin-top: 0;
    }
    .car-details-sidebar__sticky .booking-availability {
        margin-top: 0;
    }
    .car-details-sidebar__sticky .booking-form__footer {
        flex: 0 0 auto;
        margin: 0 -2px 0 0;
        padding: 12px 2px 0 0;
        border-top: 1px solid rgba(13, 20, 22, 0.08);
        background: linear-gradient(180deg, rgba(244, 244, 244, 0.92) 0%, #f4f4f4 28%);
        box-shadow: 0 -10px 18px rgba(244, 244, 244, 0.85);
    }
    .dark .car-details-sidebar__sticky .booking-form__footer {
        border-top-color: rgba(255, 255, 255, 0.1);
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.92) 0%, #000 28%);
        box-shadow: 0 -10px 18px rgba(0, 0, 0, 0.85);
    }
    .car-details-sidebar__sticky .booking-form__footer .booking-submit {
        margin-bottom: 8px;
    }
    .car-details-sidebar__sticky .booking-form__footer #bookingAvailabilityFoot {
        margin: 0;
        font-size: 11.5px;
        line-height: 1.35;
        color: rgba(13, 20, 22, 0.5);
        text-align: center;
    }
    .dark .car-details-sidebar__sticky .booking-form__footer #bookingAvailabilityFoot {
        color: rgba(255, 255, 255, 0.5);
    }
}
@media (max-width: 1023px) {
    .car-details-sidebar__sticky {
        position: static;
        top: auto;
        height: auto;
        max-height: none;
        overflow: visible;
    }
    .booking-form__footer {
        margin-top: 12px;
    }
    .booking-form__footer .booking-submit {
        margin-bottom: 10px;
    }
}

/* Top header social icons */
.top-header-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-size: 16px;
    line-height: 1;
    border-radius: 999px;
    background: #fff;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.top-header-social a:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(13, 20, 22, 0.18);
}
.top-header-social a[aria-label="Facebook"] {
    color: #1877F2;
}
.top-header-social a[aria-label="Instagram"] {
    color: #E4405F;
}
.top-header-social a[aria-label="Twitter"] {
    color: #0D1416;
}
.top-header-social a[aria-label="LinkedIn"] {
    color: #0A66C2;
}
.top-header-social a[aria-label="YouTube"] {
    color: #FF0000;
}

/* Booking UPI payment modal */
.booking-pay-modal {
    position: fixed;
    inset: 0;
    z-index: 130;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.booking-pay-modal[hidden] {
    display: none !important;
}
.booking-pay-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(13, 20, 22, 0.58);
    backdrop-filter: blur(3px);
}
.booking-pay-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(440px, 100%);
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    border-radius: 18px;
    background: #fff;
    padding: 20px 18px 16px;
    box-shadow: 0 24px 48px rgba(13, 20, 22, 0.28);
}
.dark .booking-pay-modal__dialog {
    background: #171E20;
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.booking-pay-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.06);
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    cursor: pointer;
}
.dark .booking-pay-modal__close {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}
.booking-pay-modal__head {
    padding-right: 36px;
    margin-bottom: 14px;
}
.booking-pay-modal__badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(103, 199, 97, 0.14);
    color: #2f8f2a;
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 8px;
}
.booking-pay-modal__head h3 {
    margin: 0 0 6px;
    font-size: 20px;
}
.booking-pay-modal__head p {
    margin: 0;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.65);
}
.dark .booking-pay-modal__head p {
    color: rgba(255, 255, 255, 0.65);
}
.booking-pay-modal__choices {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 12px;
}
.booking-pay-modal__choices.is-single {
    grid-template-columns: 1fr;
}
.booking-pay-choice {
    display: grid;
    gap: 4px;
    text-align: left;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    background: #fff;
    cursor: pointer;
    color: inherit;
    font: inherit;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.booking-pay-choice:hover {
    border-color: rgba(103, 199, 97, 0.45);
}
.booking-pay-choice.is-active {
    border-color: rgba(103, 199, 97, 0.7);
    background: rgba(103, 199, 97, 0.12);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.16);
}
.booking-pay-choice__kicker {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.48);
}
.booking-pay-choice.is-active .booking-pay-choice__kicker {
    color: #2f8f2a;
}
.booking-pay-choice__label {
    font-size: 13px;
    font-weight: 700;
    color: #0d1416;
}
.booking-pay-choice__amount {
    font-size: 20px;
    line-height: 1.1;
    color: #1f7a1a;
}
.dark .booking-pay-choice {
    background: #0d1416;
    border-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}
.dark .booking-pay-choice__label {
    color: #fff;
}
.dark .booking-pay-choice__kicker {
    color: rgba(255, 255, 255, 0.5);
}
.booking-pay-modal__amount {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 14px;
    background: rgba(103, 199, 97, 0.12);
    border: 1px solid rgba(103, 199, 97, 0.28);
    margin-bottom: 8px;
}
.booking-pay-modal__amount span {
    font-size: 13px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.65);
}
.dark .booking-pay-modal__amount span {
    color: rgba(255, 255, 255, 0.65);
}
.booking-pay-modal__amount strong {
    font-size: 28px;
    line-height: 1;
    color: #1f7a1a;
}
.booking-pay-modal__note {
    margin: 0 0 14px;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.7);
}
.dark .booking-pay-modal__note {
    color: rgba(255, 255, 255, 0.7);
}
.booking-pay-modal__qr-wrap {
    display: grid;
    justify-items: center;
    gap: 10px;
    margin-bottom: 16px;
    padding: 16px;
    border-radius: 16px;
    background: #f6f7f6;
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.dark .booking-pay-modal__qr-wrap {
    background: #0D1416;
    border-color: rgba(255, 255, 255, 0.08);
}
.booking-pay-modal__qr-box {
    position: relative;
    width: 220px;
    height: 220px;
    display: grid;
    place-items: center;
}
.booking-pay-modal__qr {
    width: 220px;
    height: 220px;
    object-fit: contain;
    border-radius: 12px;
    background: #fff;
    padding: 10px;
    display: block;
}
.booking-pay-modal__qr-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 36px;
    height: 36px;
    object-fit: cover;
    border-radius: 50%;
    background: #fff;
    padding: 2px;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(13, 20, 22, 0.14);
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 1;
}
.booking-pay-modal__upi-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: #2f8f2a;
}
.booking-pay-modal__proof-label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 700;
}
.booking-pay-modal__proof-label span {
    color: #dc2626;
}
.booking-pay-modal__upload .doc-upload__drop {
    min-height: 110px;
}
.booking-pay-modal__error {
    margin: 8px 0 0;
    font-size: 12px;
    color: #dc2626;
}
.booking-pay-modal__agree {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 16px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: #f7f8f7;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
    color: #0d1416;
    cursor: pointer;
}
.booking-pay-modal__agree input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: #67C761;
    flex: 0 0 auto;
    cursor: pointer;
}
.booking-pay-modal__agree label {
    cursor: pointer;
}
.booking-pay-modal__agree a {
    color: #1f7a1a;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.booking-pay-modal__agree a:hover {
    color: #146312;
}
.dark .booking-pay-modal__agree {
    background: #0d1416;
    border-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}
.booking-pay-modal__agree + .booking-pay-modal__error {
    margin-top: 8px;
}
.booking-pay-modal__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

/* Booking terms modal */
.booking-terms-modal {
    position: fixed;
    inset: 0;
    z-index: 140;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.booking-terms-modal[hidden] {
    display: none !important;
}
.booking-terms-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(13, 20, 22, 0.62);
    backdrop-filter: blur(3px);
}
.booking-terms-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(760px, 100%);
    height: min(720px, calc(100vh - 32px));
    max-height: calc(100vh - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 48px rgba(13, 20, 22, 0.28);
}
.dark .booking-terms-modal__dialog {
    background: #171E20;
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.booking-terms-modal__head {
    flex: 0 0 auto;
    padding: 20px 52px 12px 20px;
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
}
.dark .booking-terms-modal__head {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}
.booking-terms-modal__head h3 {
    margin: 0 0 4px;
    font-size: 20px;
}
.booking-terms-modal__head p {
    margin: 0;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.62);
}
.dark .booking-terms-modal__head p {
    color: rgba(255, 255, 255, 0.62);
}
.booking-terms-modal__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding: 0;
    max-width: none;
    margin: 0;
    background: #fff;
    display: flex;
    flex-direction: column;
}
.dark .booking-terms-modal__body {
    background: #fff;
}
.booking-terms-modal__frame {
    display: block;
    flex: 1 1 auto;
    width: 100%;
    min-height: 280px;
    border: 0;
    background: #fff;
}
.booking-terms-modal__actions {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 20px 16px;
    border-top: 1px solid rgba(13, 20, 22, 0.08);
    background: #fff;
}
.dark .booking-terms-modal__actions {
    border-top-color: rgba(255, 255, 255, 0.08);
    background: #171E20;
}

/* Booking success */
.booking-success-page {
    padding: 48px 0 70px;
}
.booking-success {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
}
.booking-success__icon {
    width: 72px;
    height: 72px;
    margin: 0 auto 16px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(103, 199, 97, 0.16);
    color: #2f8f2a;
    font-size: 40px;
}
.booking-success h1 {
    margin: 0 0 8px;
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1.15;
}
.booking-success__lead {
    margin: 0 auto 18px;
    max-width: 540px;
    color: rgba(13, 20, 22, 0.68);
    font-size: 16px;
}
.dark .booking-success__lead {
    color: rgba(255, 255, 255, 0.68);
}
.booking-success__id {
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 22px;
    padding: 12px 18px;
    border-radius: 14px;
    background: rgba(103, 199, 97, 0.12);
    border: 1px solid rgba(103, 199, 97, 0.28);
    font-size: 13px;
    font-weight: 600;
}
.booking-success__id strong {
    font-size: 20px;
    color: #2f8f2a;
    letter-spacing: 0.02em;
}
.booking-success__card,
.booking-success__next {
    text-align: left;
    border-radius: 16px;
    background: #f4f4f4;
    padding: 18px 18px 16px;
    margin-bottom: 16px;
}
.dark .booking-success__card,
.dark .booking-success__next {
    background: #171E20;
}
.booking-success__card h2,
.booking-success__next h3 {
    margin: 0 0 12px;
    font-size: 18px;
}
.booking-success__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}
.booking-success__list li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
    font-size: 14px;
}
.dark .booking-success__list li {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}
.booking-success__list li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.booking-success__list span {
    color: rgba(13, 20, 22, 0.55);
}
.dark .booking-success__list span {
    color: rgba(255, 255, 255, 0.55);
}
.booking-success__list strong {
    text-align: right;
}
.booking-success__note {
    margin: 12px 0 0;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.55);
}
.booking-success__next ol {
    margin: 0;
    padding-left: 18px;
    display: grid;
    gap: 8px;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.75);
}
.dark .booking-success__next ol {
    color: rgba(255, 255, 255, 0.75);
}
.booking-success__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 8px;
}

/* FAQ page */
.faq-page {
    padding: 48px 0 70px;
}
.faq-page__intro {
    max-width: 640px;
    margin: 0 auto 28px;
    text-align: center;
}
.faq-page__eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    color: #67C761;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.faq-page__intro h2 {
    margin: 0 0 8px;
    font-size: clamp(24px, 3.5vw, 34px);
}
.faq-page__intro p {
    margin: 0;
    color: rgba(13, 20, 22, 0.65);
}
.dark .faq-page__intro p {
    color: rgba(255, 255, 255, 0.65);
}
.faq-page__accordion {
    display: grid;
    gap: 12px;
    max-width: 900px;
    margin: 0 auto;
}
.faq-page__item {
    border: 1px solid rgba(13, 20, 22, 0.1);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
}
.dark .faq-page__item {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.1);
}
.faq-page__toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    border: 0;
    background: transparent;
    text-align: left;
    font-size: 16px;
    font-weight: 700;
    color: #0D1416;
    cursor: pointer;
}
.dark .faq-page__toggle {
    color: #fff;
}
.faq-page__toggle i {
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(103, 199, 97, 0.14);
    color: #67C761;
    font-size: 18px;
    transition: transform 0.2s ease;
}
.faq-page__item.active .faq-page__toggle i {
    transform: rotate(45deg);
    background: #67C761;
    color: #fff;
}
.faq-page__panel {
    padding: 0 18px 16px;
    color: rgba(13, 20, 22, 0.7);
    font-size: 14px;
    line-height: 1.55;
}
.dark .faq-page__panel {
    color: rgba(255, 255, 255, 0.7);
}
.faq-page__panel p {
    margin: 0;
}
.faq-page__cta {
    max-width: 900px;
    margin: 28px auto 0;
    padding: 20px;
    border-radius: 16px;
    background: rgba(103, 199, 97, 0.12);
    border: 1px solid rgba(103, 199, 97, 0.28);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.faq-page__cta h3 {
    margin: 0 0 4px;
    font-size: 18px;
}
.faq-page__cta p {
    margin: 0;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.65);
}
.dark .faq-page__cta p {
    color: rgba(255, 255, 255, 0.65);
}
.faq-page__cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Home FAQ bottom CTA */
.home-faq-cta {
    margin-top: 8px;
    padding: 18px 16px;
    border-radius: 14px;
    border: 1px solid rgba(103, 199, 97, 0.28);
    background: rgba(103, 199, 97, 0.08);
    text-align: center;
}
.home-faq-cta__title {
    margin: 0 0 12px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}
.home-faq-cta__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 10px;
}
.home-faq-cta__or {
    color: rgba(255, 255, 255, 0.55);
    font-size: 13px;
    font-weight: 600;
}
.home-faq-cta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(103, 199, 97, 0.55);
    color: #67C761;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.home-faq-cta__btn:hover {
    background: rgba(103, 199, 97, 0.16);
    color: #7fd478;
}
.home-faq-cta__btn--solid {
    background: #67C761;
    border-color: #67C761;
    color: #0D1416;
}
.home-faq-cta__btn--solid:hover {
    background: #74d06e;
    color: #0D1416;
}
@media (min-width: 768px) {
    .home-faq-cta {
        margin-top: 12px;
        padding: 20px 22px;
    }
    .home-faq-cta__title {
        font-size: 18px;
        margin-bottom: 14px;
    }
    .home-faq-cta__btn {
        min-height: 42px;
        padding: 0 18px;
        font-size: 14px;
    }
}

/* Cars filter trip summary */
.cars-filter-summary {
    margin: 0 0 20px;
    padding: 12px 16px;
    border-radius: 12px;
    background: rgba(103, 199, 97, 0.12);
    border: 1px solid rgba(103, 199, 97, 0.28);
    color: #0D1416;
    font-size: 14px;
    font-weight: 500;
}
.dark .cars-filter-summary {
    color: #fff;
    background: rgba(103, 199, 97, 0.16);
    border-color: rgba(103, 199, 97, 0.35);
}
.cars-filter-summary strong {
    color: #67C761;
    font-weight: 800;
}
.cars-avail-empty {
    margin: 10px 0 0;
    padding: 16px;
    border-radius: 12px;
    background: rgba(220, 38, 38, 0.06);
    border: 1px solid rgba(220, 38, 38, 0.18);
    color: #b91c1c;
    font-size: 14px;
    font-weight: 650;
    text-align: center;
}
.cars-avail-empty.is-hidden {
    display: none !important;
}
.car-card__avail-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(185, 28, 28, 0.95);
    color: #fff;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.02em;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(185, 28, 28, 0.28);
}
.car-card__avail-badge i {
    font-size: 14px;
}
.car-card__avail-overlay {
    position: absolute;
    inset: 0;
    z-index: 8;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    background: rgba(13, 20, 22, 0.42);
    backdrop-filter: blur(1.5px);
    pointer-events: none;
}
.car-card__avail-overlay.is-hidden {
    display: none !important;
}
.car-card__avail-panel {
    width: min(100%, 240px);
    display: grid;
    gap: 8px;
    justify-items: center;
    text-align: center;
}
.car-card__avail-note {
    margin: 0;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(255, 245, 245, 0.96);
    border: 1px solid rgba(220, 38, 38, 0.22);
    color: #b91c1c;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.18);
}
.car-card.is-date-unavailable {
    position: relative;
}
.car-card.is-date-unavailable .primary-btn.is-disabled,
.car-card .primary-btn.is-disabled {
    opacity: 0.55;
    pointer-events: none;
    cursor: not-allowed;
    background: #94a3b8 !important;
    border-color: #94a3b8 !important;
}

/* Cars banner filter */
.page-banner--with-filter {
    padding: 40px 0 44px;
}
.page-banner--with-filter .page-banner__car {
    opacity: 0.18;
    width: min(420px, 38%);
}
.page-banner--with-filter .page-banner__title {
    max-width: none;
    margin-bottom: 8px;
}
.page-banner--with-filter .page-banner__subtitle {
    max-width: 420px;
    margin-bottom: 12px;
    font-size: 14px;
}
.page-banner__layout--split {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    align-items: end;
}
.page-banner__top {
    display: contents;
}
.page-banner__intro {
    display: contents;
}
.page-banner__filter {
    width: 100%;
    position: relative;
    z-index: 2;
}
.cars-filter-toggle {
    display: none;
}
.cars-filter-sheet__head {
    display: none;
}
.cars-filter-sheet__apply {
    display: none;
}

/* Mobile cars banner redesign + filter sheet */
@media (max-width: 991.98px) {
    .page-banner--with-filter {
        padding: 18px 0 20px;
    }
    .page-banner--with-filter .page-banner__car {
        opacity: 0.1;
        width: min(280px, 58%);
        right: -8%;
        bottom: -6%;
    }
    .page-banner--with-filter .page-banner__layout--split {
        gap: 0;
    }
    .page-banner__content--cars {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .page-banner__content--cars .page-banner__crumbs {
        order: 1;
        margin: 0;
        font-size: 12px;
        opacity: 0.92;
    }
    .page-banner__content--cars .page-banner__top {
        order: 2;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 12px;
    }
    .page-banner__content--cars .page-banner__intro {
        display: block;
        min-width: 0;
        flex: 1 1 auto;
    }
    .page-banner__content--cars .page-banner__brand {
        margin-bottom: 2px;
        font-size: 12px;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }
    .page-banner__content--cars .page-banner__title {
        margin: 0;
        font-size: 28px;
        line-height: 1.1;
        letter-spacing: -0.03em;
    }
    .page-banner__content--cars .page-banner__subtitle {
        order: 3;
        margin: 0;
        max-width: 100%;
        font-size: 13px;
        line-height: 1.4;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        overflow: hidden;
        opacity: 0.88;
    }
    .cars-filter-toggle {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        gap: 6px;
        margin: 0;
        min-height: 42px;
        padding: 0 16px;
        border-radius: 12px;
        border: 0;
        background: #67C761;
        color: #0d1416;
        font-size: 13px;
        font-weight: 800;
        line-height: 1;
        box-shadow: 0 8px 18px rgba(103, 199, 97, 0.35);
        cursor: pointer;
    }
    .cars-filter-toggle i {
        font-size: 17px;
    }
    .cars-filter-toggle[aria-expanded="true"] {
        background: #fff;
        color: #1f6b1b;
        box-shadow: 0 8px 18px rgba(13, 20, 22, 0.16);
    }
    .page-banner__filter {
        display: none;
    }
    .page-banner__filter.is-open {
        display: flex !important;
        align-items: flex-end;
        justify-content: center;
        position: fixed;
        inset: 0;
        z-index: 1200;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        background: rgba(13, 20, 22, 0.55);
        overflow: hidden;
    }
    .page-banner__filter.is-open .cars-filter-sheet {
        width: 100%;
        max-height: min(92vh, 780px);
        display: flex;
        flex-direction: column;
        background: #fff;
        border-radius: 20px 20px 0 0;
        box-shadow: 0 -12px 40px rgba(13, 20, 22, 0.28);
        overflow: hidden;
        animation: carsFilterSheetIn 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    }
    @keyframes carsFilterSheetIn {
        from {
            transform: translateY(24px);
            opacity: 0.6;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }
    .page-banner__filter.is-open .cars-filter-sheet__head {
        display: flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin: 0;
        padding: 14px 16px;
        border-bottom: 1px solid rgba(13, 20, 22, 0.08);
        color: #0d1416;
        background: #fff;
    }
    .page-banner__filter.is-open .cars-filter-sheet__head strong {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 16px;
        font-weight: 800;
        color: #0d1416;
    }
    .page-banner__filter.is-open .cars-filter-sheet__head strong i {
        color: #2f8f2a;
    }
    .cars-filter-sheet__close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border: 0;
        border-radius: 999px;
        background: rgba(13, 20, 22, 0.06);
        color: #0d1416;
        font-size: 20px;
        cursor: pointer;
    }
    .page-banner__filter.is-open .cars-banner-filter {
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0;
        padding: 14px 14px calc(14px + env(safe-area-inset-bottom, 0px));
        border-radius: 0;
        background: #fff;
        box-shadow: none;
        gap: 12px;
        border: 0;
        backdrop-filter: none;
    }
    .page-banner__filter.is-open .cars-banner-filter__field label {
        color: rgba(13, 20, 22, 0.72);
    }
    .page-banner__filter.is-open .pickup-dropdown--banner .pickup-dropdown__trigger {
        background: #fff;
        border: 1.5px solid rgba(13, 20, 22, 0.18);
        box-shadow: none;
    }
    .page-banner__filter.is-open .pickup-dropdown--banner .pickup-dropdown__trigger:hover,
    .page-banner__filter.is-open .pickup-dropdown--banner.is-open .pickup-dropdown__trigger {
        border-color: rgba(103, 199, 97, 0.65);
        box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.16);
    }
    .page-banner__filter.is-open .cars-banner-filter .datetime-12h--compact .datetime-12h__card {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 12px;
        background: #f4f7f3;
        border: 1.5px solid rgba(13, 20, 22, 0.16);
        box-shadow: none;
    }
    .page-banner__filter.is-open .cars-banner-filter .dt-date-dropdown__trigger {
        background: #fff;
        border: 1.5px solid rgba(13, 20, 22, 0.16);
        box-shadow: none;
    }
    .page-banner__filter.is-open .cars-banner-filter .dt-date-dropdown.is-open .dt-date-dropdown__trigger {
        border-color: rgba(103, 199, 97, 0.65);
        box-shadow: 0 0 0 2px rgba(103, 199, 97, 0.18);
        background: #fff;
    }
    .page-banner__filter.is-open .cars-banner-filter .datetime-12h__timebox {
        height: 42px;
        min-height: 42px;
        overflow: visible;
        background: #fff;
        border: 1.5px solid rgba(13, 20, 22, 0.16);
        box-shadow: none;
    }
    .page-banner__filter.is-open .cars-banner-filter .dt-time-dropdown__trigger {
        background: transparent;
        border: 0;
        box-shadow: none;
    }
    .page-banner__filter.is-open .cars-filter-sheet__apply {
        display: inline-flex;
        width: 100%;
        justify-content: center;
        margin-top: 4px;
    }
    body.cars-filter-open {
        overflow: hidden;
    }
    body.cars-filter-open .floating-actions,
    body.cars-filter-open #backToTopBtn,
    body.cars-filter-open .mobile-bottom-nav {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}
@media (min-width: 992px) {
    .cars-filter-toggle,
    .cars-filter-sheet__head,
    .cars-filter-sheet__apply {
        display: none !important;
    }
    .page-banner__filter,
    .page-banner__filter[hidden] {
        display: block !important;
        position: relative !important;
        inset: auto !important;
        background: transparent !important;
        padding: 0 !important;
        overflow: visible !important;
    }
    .page-banner__filter .cars-filter-sheet {
        display: contents;
    }
    .page-banner__content--cars .page-banner__top,
    .page-banner__content--cars .page-banner__intro {
        display: contents;
    }
}
/* Home hero */
.home-hero {
    position: relative;
    overflow: hidden;
    background: #fff;
}
.dark .home-hero {
    background: #0D1416;
}
.home-hero__stage {
    display: contents;
}
.home-hero__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: start;
}
.home-hero__copy {
    order: 1;
}
.home-hero__media {
    order: 2;
}
.home-hero__form {
    order: 3;
    width: 100%;
    max-width: 460px;
}
.home-hero__stage-bg {
    display: none;
}
.home-hero__media-frame {
    display: none;
}
.home-hero__media-dim {
    display: none;
}
@media (min-width: 768px) {
    .home-hero__media {
        position: relative;
    }
    .home-hero__media-frame {
        display: inline-block;
        position: relative;
        max-width: 100%;
        line-height: 0;
        vertical-align: top;
    }
    .home-hero__media-bg {
        display: inline-block;
        max-width: 100%;
        height: auto;
        vertical-align: top;
    }
    .home-hero__media-dim {
        display: block;
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(
            180deg,
            rgba(13, 20, 22, 0.48) 0%,
            rgba(13, 20, 22, 0.32) 35%,
            rgba(13, 20, 22, 0.14) 65%,
            rgba(13, 20, 22, 0.04) 100%
        );
    }
    .dark .home-hero__media-dim {
        background: linear-gradient(
            180deg,
            rgba(13, 20, 22, 0.58) 0%,
            rgba(13, 20, 22, 0.4) 38%,
            rgba(13, 20, 22, 0.18) 68%,
            rgba(13, 20, 22, 0.06) 100%
        );
    }
    .home-hero__stroke,
    .home-hero__bullets,
    .home-hero__media .banner-images {
        z-index: 2;
    }
    .home-hero__bullets li {
        text-shadow: 0 1px 3px rgba(13, 20, 22, 0.45);
    }
}
@media (max-width: 767.98px) {
    .home-hero {
        overflow: visible;
        background: #fff;
        z-index: 1;
    }
    .dark .home-hero {
        background: #0D1416;
    }
    /* Green + photo only behind title + cars */
    .home-hero__stage {
        display: block;
        position: relative;
        z-index: 1;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding-left: calc(50vw - 50%);
        padding-right: calc(50vw - 50%);
        /* Extra space under the car so form can overlap green, not the vehicle */
        padding-bottom: 170px;
        background-color: #67C761;
        overflow: hidden;
    }
    .home-hero__stage-bg {
        display: block;
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
        z-index: 0;
        pointer-events: none;
    }
    .home-hero__stage::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        /* Soft black fade so white text stays readable over bright banner photos */
        background: linear-gradient(
            180deg,
            rgba(13, 20, 22, 0.62) 0%,
            rgba(13, 20, 22, 0.42) 28%,
            rgba(13, 20, 22, 0.18) 55%,
            rgba(13, 20, 22, 0.06) 78%,
            rgba(13, 20, 22, 0) 100%
        );
    }
    .dark .home-hero__stage::after {
        background: linear-gradient(
            180deg,
            rgba(13, 20, 22, 0.72) 0%,
            rgba(13, 20, 22, 0.5) 30%,
            rgba(13, 20, 22, 0.22) 58%,
            rgba(13, 20, 22, 0.08) 80%,
            rgba(13, 20, 22, 0) 100%
        );
    }
    .home-hero__copy,
    .home-hero__media {
        position: relative;
        z-index: 1;
        order: unset;
    }
    .home-hero__media {
        /* Keep car fully in view above the form overlap zone */
        padding-bottom: 8px;
    }
    .home-hero .hero-title__static {
        color: #fff;
        text-shadow: 0 1px 3px rgba(13, 20, 22, 0.35);
    }
    .dark .home-hero .hero-title__static {
        color: #fff;
    }
    .home-hero__copy > p {
        color: #fff;
        text-shadow: 0 1px 3px rgba(13, 20, 22, 0.45);
    }
    .home-hero__form {
        position: relative;
        z-index: 2;
        order: unset;
        /* ~30% of form overlaps the green area under the car */
        margin-top: -150px;
        margin-bottom: 8px;
        max-width: none;
        box-shadow: 0 12px 40px rgba(13, 20, 22, 0.1);
    }
    /* Space between reservation form and "3 Easy Steps" title */
    .home-after-hero {
        padding-top: 72px !important;
    }
}

/* Testimonials — always dark (like site dark mode) */
.testimonials-section {
    background: #0D1416;
    color: #fff;
}
.testimonials-section__card {
    background: #171E20;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: none;
}
.testimonials-section__card p {
    color: #fff;
}
.testimonials-section__card span {
    color: rgba(255, 255, 255, 0.65);
}
.testimonials-section .testimonials-swiper-pagination .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.35);
    opacity: 1;
}
.testimonials-section .testimonials-swiper-pagination .swiper-pagination-bullet-active {
    background: #67C761;
}

/* Home subscribe — faded brand watermark */
.home-subscribe-section {
    position: relative;
    overflow: hidden;
    padding-top: 60px;
    padding-bottom: 60px;
}
@media (min-width: 768px) {
    .home-subscribe-section {
        padding-top: 80px;
        padding-bottom: 80px;
    }
}
@media (min-width: 992px) {
    .home-subscribe-section {
        padding-top: 100px;
        padding-bottom: 100px;
    }
}
@media (min-width: 1200px) {
    .home-subscribe-section {
        padding-top: 120px;
        padding-bottom: 120px;
    }
}
.home-subscribe-section__watermark {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: max-content;
    max-width: none;
    margin: 0;
    padding: 0;
    font-family: var(--font-body), "Figtree", sans-serif;
    font-size: 160px;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    color: rgba(13, 20, 22, 0.055);
    pointer-events: none;
    user-select: none;
    z-index: 0;
    transform: translate(-50%, -50%);
    transform-origin: center center;
}
.dark .home-subscribe-section__watermark {
    color: rgba(255, 255, 255, 0.06);
}
.home-subscribe-section__content {
    position: relative;
    z-index: 1;
}

/* Home blog — between testimonials and FAQ */
.home-blog-section {
    padding-top: 50px;
    padding-bottom: 50px;
}
@media (min-width: 768px) {
    .home-blog-section {
        padding-top: 70px;
        padding-bottom: 70px;
    }
}
@media (min-width: 992px) {
    .home-blog-section {
        padding-top: 85px;
        padding-bottom: 85px;
    }
}
@media (min-width: 1200px) {
    .home-blog-section {
        padding-top: 100px;
        padding-bottom: 100px;
    }
}
.home-blog-section__head {
    margin-bottom: 22px;
    max-width: 640px;
}
.home-blog-section__intro {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: rgba(13, 20, 22, 0.7);
}
.dark .home-blog-section__intro {
    color: rgba(255, 255, 255, 0.7);
}
@media (min-width: 768px) {
    .home-blog-section__intro {
        font-size: 16px;
    }
}
.home-blog-carousel {
    position: relative;
}
.home-blog-carousel .homeBlogSwiper {
    overflow: hidden;
    padding-bottom: 4px;
}
.home-blog-carousel .swiper-slide {
    height: auto;
}
.home-blog-carousel__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 18px;
}
.home-blog-nav {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(13, 20, 22, 0.12);
    border-radius: 50%;
    background: #fff;
    color: #0D1416;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.dark .home-blog-nav {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.home-blog-nav:hover {
    color: #fff;
    background: #67C761;
    border-color: #67C761;
}
.home-blog-swiper-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto !important;
    position: static !important;
}
.home-blog-swiper-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    margin: 0 !important;
    background: rgba(13, 20, 22, 0.22);
    opacity: 1;
    transition: width 0.25s ease, background 0.25s ease;
}
.dark .home-blog-swiper-pagination .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.28);
}
.home-blog-swiper-pagination .swiper-pagination-bullet-active {
    width: 22px;
    border-radius: 999px;
    background: #67C761;
}
.home-blog-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-width: 0;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    box-shadow: 0 8px 20px rgba(13, 20, 22, 0.05);
}
.dark .home-blog-card {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: none;
}
.home-blog-card__media {
    display: block;
    overflow: hidden;
    height: 96px;
    background: #0D1416;
}
.home-blog-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s ease;
}
.home-blog-card:hover .home-blog-card__media img {
    transform: scale(1.06);
}
.home-blog-card__body {
    padding: 10px 11px 12px;
}
.home-blog-card__meta {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 7px;
    font-size: 11px;
    color: rgba(13, 20, 22, 0.55);
}
.dark .home-blog-card__meta {
    color: rgba(255, 255, 255, 0.55);
}
.home-blog-card__meta img {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
}
.home-blog-card__meta a {
    color: #0D1416;
    font-weight: 600;
}
.dark .home-blog-card__meta a {
    color: #fff;
}
.home-blog-card__meta a:hover {
    color: #67C761;
}
.home-blog-card h3 {
    margin: 0 0 8px;
    font-size: 12.5px;
    line-height: 1.35;
    font-weight: 700;
}
.home-blog-card h3 a {
    color: inherit;
}
.home-blog-card h3 a:hover {
    color: #67C761;
}
.home-blog-card__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 10.5px;
    color: rgba(13, 20, 22, 0.55);
}
.dark .home-blog-card__stats {
    color: rgba(255, 255, 255, 0.55);
}
.home-blog-card__stats li {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.home-blog-card__stats i {
    color: #67C761;
    font-size: 12px;
}

/* Blog listing meta — flex icons (no absolute overlap) */
.blog-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.62);
}
.dark .blog-meta {
    color: rgba(255, 255, 255, 0.62);
}
.blog-meta li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}
.blog-meta i {
    flex: none;
    color: #67C761;
    font-size: 16px;
    line-height: 1;
}
.blog-meta span {
    line-height: 1.3;
}

/* Blog details */
.blog-details__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
    align-items: start;
}
.blog-details__article {
    min-width: 0;
}
.blog-details__hero {
    overflow: hidden;
    border-radius: 16px;
    margin-bottom: 20px;
    background: #171E20;
}
.blog-details__hero img {
    display: block;
    width: 100%;
    height: min(420px, 56vw);
    object-fit: cover;
}
.blog-details__meta {
    margin-bottom: 14px;
}
.blog-details__title {
    margin: 0 0 12px;
    font-size: 28px;
    line-height: 1.25;
    font-weight: 800;
    color: #0D1416;
}
.dark .blog-details__title {
    color: #fff;
}
.blog-details__excerpt {
    margin: 0 0 22px;
    font-size: 17px;
    line-height: 1.6;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.72);
}
.dark .blog-details__excerpt {
    color: rgba(255, 255, 255, 0.72);
}
.blog-details__content p {
    margin: 0 0 16px;
    font-size: 15px;
    line-height: 1.75;
}
.blog-details__cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 18px;
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid rgba(13, 20, 22, 0.08);
}
.dark .blog-details__cta {
    border-color: rgba(255, 255, 255, 0.1);
}
.blog-details__back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    color: #67C761;
}
.blog-details__back:hover {
    text-decoration: underline;
}
.blog-details__sidebar {
    display: grid;
    gap: 18px;
}
.blog-details__widget {
    padding: 22px 20px;
    border-radius: 16px;
    background: #F4F7F4;
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.dark .blog-details__widget {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.08);
}
.blog-details__widget h3 {
    margin: 0 0 8px;
    font-size: 18px;
    line-height: 1.3;
}
.blog-details__widget > p {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.55;
}
.blog-details__related {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 12px;
}
.blog-details__related a {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    color: inherit;
}
.blog-details__related img {
    width: 72px;
    height: 56px;
    object-fit: cover;
    border-radius: 10px;
    background: #0D1416;
}
.blog-details__related strong {
    display: block;
    margin-bottom: 4px;
    font-size: 14px;
    line-height: 1.35;
}
.blog-details__related small {
    color: rgba(13, 20, 22, 0.55);
    font-size: 12px;
}
.dark .blog-details__related small {
    color: rgba(255, 255, 255, 0.55);
}
.blog-details__related a:hover strong {
    color: #67C761;
}
@media (min-width: 992px) {
    .blog-details__layout {
        grid-template-columns: minmax(0, 1.7fr) minmax(260px, 0.8fr);
        gap: 36px;
    }
    .blog-details__sidebar {
        position: sticky;
        top: 110px;
    }
    .blog-details__title {
        font-size: 34px;
    }
    .blog-details__hero img {
        height: 420px;
    }
}
@media (min-width: 768px) {
    .home-blog-card__media {
        height: 130px;
    }
    .home-blog-card__body {
        padding: 14px 14px 16px;
    }
    .home-blog-card__meta {
        margin-bottom: 9px;
        font-size: 12px;
    }
    .home-blog-card__meta img {
        width: 26px;
        height: 26px;
    }
    .home-blog-card h3 {
        margin-bottom: 10px;
        font-size: 15px;
        line-height: 1.35;
    }
    .home-blog-card__stats {
        font-size: 12px;
        gap: 10px 14px;
    }
    .home-blog-card__stats i {
        font-size: 14px;
    }
}
@media (min-width: 1200px) {
    .home-blog-card__media {
        height: 150px;
    }
    .home-blog-card h3 {
        font-size: 16px;
    }
}

/* How It Works */
.how-it-works__intro {
    margin: 0 auto;
    max-width: 480px;
    color: rgba(13, 20, 22, 0.65);
    font-size: 15px;
    font-weight: 500;
}
.dark .how-it-works__intro {
    color: rgba(255, 255, 255, 0.65);
}
.how-it-works__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    max-width: 1080px;
    margin-inline: auto;
}
.how-it-works__connector {
    display: none;
}
.how-it-works__card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 24px 20px 26px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    box-shadow: 0 10px 28px rgba(13, 20, 22, 0.06);
}
.dark .how-it-works__card {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: none;
}
.how-it-works__top {
    position: relative;
    width: 88px;
    height: 88px;
    margin-bottom: 18px;
}
.how-it-works__step {
    position: absolute;
    top: -6px;
    left: -6px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #67C761;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.02em;
    box-shadow: 0 4px 12px rgba(103, 199, 97, 0.4);
}
.how-it-works__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 88px;
    height: 88px;
    border-radius: 22px;
    background: #E9F0E5;
    color: #0D1416;
    font-size: 36px;
    line-height: 1;
}
.dark .how-it-works__icon {
    background: #0D1416;
    color: #fff;
}
.how-it-works__card h3 {
    margin: 0 0 8px;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    color: #0D1416;
}
.dark .how-it-works__card h3 {
    color: #fff;
}
.how-it-works__card p {
    margin: 0;
    max-width: 260px;
    color: rgba(13, 20, 22, 0.62);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.55;
}
.dark .how-it-works__card p {
    color: rgba(255, 255, 255, 0.62);
}
@media (min-width: 768px) {
    .how-it-works__grid {
        grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr);
        align-items: stretch;
        gap: 0 10px;
    }
    .how-it-works__connector {
        display: block;
        align-self: center;
        height: 2px;
        margin-top: -40px;
        background: linear-gradient(90deg, rgba(103, 199, 97, 0.15), #67C761, rgba(103, 199, 97, 0.15));
        border-radius: 999px;
    }
}
@media (min-width: 1024px) {
    .how-it-works__card {
        padding: 30px 22px 32px;
        transition: transform 0.25s ease, box-shadow 0.25s ease;
    }
    .how-it-works__card:hover {
        transform: translateY(-5px);
        box-shadow: 0 18px 40px rgba(13, 20, 22, 0.1);
    }
    .how-it-works__top {
        width: 96px;
        height: 96px;
        margin-bottom: 20px;
    }
    .how-it-works__icon {
        width: 96px;
        height: 96px;
        font-size: 40px;
        border-radius: 24px;
    }
    .how-it-works__card h3 {
        font-size: 20px;
    }
    .how-it-works__card p {
        font-size: 15px;
    }
}
@media (min-width: 1024px) {
    .home-hero__stage {
        display: contents;
    }
    .home-hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: auto auto;
        column-gap: 25px;
        row-gap: 18px;
        align-items: start;
    }
    .home-hero__copy {
        grid-column: 1;
        grid-row: 1;
        order: unset;
    }
    .home-hero__form {
        grid-column: 1;
        grid-row: 2;
        order: unset;
        margin-top: 0;
        max-width: 460px;
    }
    .home-hero__media {
        grid-column: 2;
        grid-row: 1 / span 2;
        order: unset;
        align-self: stretch;
        min-height: 520px;
    }
}

/* Hero typing title — fixed line height so layout doesn't jump */
.hero-title {
    display: block;
}
.hero-typed-line {
    position: relative;
    display: block;
    min-height: 1.2em;
}
.hero-typed-sizer {
    display: block;
    visibility: hidden;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}
.hero-typed-live {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
}
.hero-title__static {
    display: block;
}
.dark .hero-title__static {
    color: #fff;
}
.dark .home-hero__copy > p {
    color: rgba(255, 255, 255, 0.72);
}
.hero-typed {
    display: inline;
}
.hero-typed__cursor {
    display: inline-block;
    width: 0.08em;
    height: 0.9em;
    margin-left: 0.08em;
    vertical-align: -0.05em;
    background: currentColor;
    color: #67C761;
    animation: hero-typed-blink 0.85s steps(1, end) infinite;
}
@keyframes hero-typed-blink {
    0%,
    45% {
        opacity: 1;
    }
    50%,
    100% {
        opacity: 0;
    }
}
@media (min-width: 768px) {
    .hero-typed-line {
        min-height: 1em;
    }
}

/* Hide hero CTA on mobile — reservation form is below */
/* Home Start a Reservation — matches cars page filter fields */
.home-reservation-filter {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    width: 100%;
}
.home-reservation-filter__field label {
    display: block;
    margin-bottom: 6px;
    color: rgba(13, 20, 22, 0.72);
    font-size: 13px;
    font-weight: 600;
}
.dark .home-reservation-filter__field label {
    color: rgba(255, 255, 255, 0.78);
}
.home-reservation-filter__field .form-select {
    width: 100%;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    border-radius: 8px !important;
    background: #fff !important;
    border: 1px solid rgba(13, 20, 22, 0.15) !important;
    color: #0D1416 !important;
    box-sizing: border-box;
}
.dark .home-reservation-filter__field .form-select {
    background: #0D1416 !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
}
.home-reservation-filter .datetime-12h--compact .datetime-12h__card {
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.12);
}
.dark .home-reservation-filter .datetime-12h--compact .datetime-12h__card {
    background: #0D1416;
    border-color: rgba(255, 255, 255, 0.12);
}
.home-reservation-filter__action {
    margin-top: 4px;
}
.home-reservation-filter__btn {
    width: 100%;
    justify-content: space-between;
    align-items: center;
    min-height: 48px;
    padding: 5px 5px 5px 4px !important;
    font-size: 15px !important;
}
.home-reservation-filter__btn span {
    flex: 1 1 auto;
    text-align: left;
    padding-left: 16px !important;
    padding-right: 10px !important;
}
.home-reservation-filter__btn i {
    flex: none !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    font-size: 18px !important;
    border-radius: 5px !important;
}
.home-reservation-filter .dt-time-dropdown__menu,
.home-reservation-filter .dt-date-dropdown__panel {
    z-index: 40;
}

.cars-banner-filter {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    width: 100%;
    padding: 14px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 12px 32px rgba(13, 20, 22, 0.18);
}
.cars-banner-filter__field {
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.cars-banner-filter__field label {
    display: block;
    margin-bottom: 6px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.cars-banner-filter__field--pickup {
    grid-column: 1 / -1;
    width: 100%;
    position: relative;
    z-index: 5;
}
.cars-banner-filter__field--pickup label i {
    margin-right: 4px;
    color: #67C761;
}
.home-reservation-filter__field--pickup {
    width: 100%;
    position: relative;
    z-index: 5;
}
.home-reservation-filter__field--pickup label i {
    margin-right: 4px;
    color: #67C761;
}

/* Custom pickup dropdown */
.pickup-dropdown {
    position: relative;
    width: 100%;
}
.pickup-dropdown__trigger {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px 0 10px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    border-radius: 12px;
    background: #fff;
    color: #0D1416;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.dark .pickup-dropdown__trigger {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.pickup-dropdown__trigger:hover,
.pickup-dropdown.is-open .pickup-dropdown__trigger {
    border-color: rgba(103, 199, 97, 0.55);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.18);
}
.pickup-dropdown__lead {
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(103, 199, 97, 0.14);
    color: #67C761;
    font-size: 18px;
}
.pickup-dropdown__value {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}
.pickup-dropdown__value.is-placeholder {
    font-weight: 600;
    color: rgba(13, 20, 22, 0.45);
}
.dark .pickup-dropdown__value.is-placeholder {
    color: rgba(255, 255, 255, 0.45);
}
.pickup-dropdown__caret {
    flex: none;
    font-size: 18px;
    color: rgba(13, 20, 22, 0.45);
    transition: transform 0.2s ease;
}
.dark .pickup-dropdown__caret {
    color: rgba(255, 255, 255, 0.5);
}
.pickup-dropdown.is-open .pickup-dropdown__caret {
    transform: rotate(180deg);
    color: #67C761;
}
.pickup-dropdown__menu {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    z-index: 90;
    display: grid;
    gap: 4px;
    padding: 8px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(103, 199, 97, 0.22);
    box-shadow: 0 16px 40px rgba(13, 20, 22, 0.16);
}
.dark .pickup-dropdown__menu {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
}
.pickup-dropdown__menu[hidden] {
    display: none !important;
}
.pickup-dropdown__option {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 8px 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #0D1416;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.dark .pickup-dropdown__option {
    color: #fff;
}
.pickup-dropdown__option:hover {
    background: rgba(103, 199, 97, 0.12);
}
.pickup-dropdown__option.is-selected {
    background: rgba(103, 199, 97, 0.16);
    color: #0D1416;
}
.dark .pickup-dropdown__option.is-selected {
    color: #fff;
    background: rgba(103, 199, 97, 0.22);
}
.pickup-dropdown__option-icon {
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(13, 20, 22, 0.05);
    color: #67C761;
    font-size: 17px;
}
.dark .pickup-dropdown__option-icon {
    background: rgba(255, 255, 255, 0.06);
}
.pickup-dropdown__option.is-selected .pickup-dropdown__option-icon {
    background: #67C761;
    color: #fff;
}
.pickup-dropdown__option-text {
    flex: 1 1 auto;
    font-size: 14px;
    font-weight: 700;
}
.pickup-dropdown__check {
    flex: none;
    opacity: 0;
    color: #67C761;
    font-size: 18px;
}
.pickup-dropdown__option.is-selected .pickup-dropdown__check {
    opacity: 1;
}

/* Banner variant on dark green glass panel */
.pickup-dropdown--banner .pickup-dropdown__trigger {
    min-height: 46px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(255, 255, 255, 0.35);
}
.pickup-dropdown--banner .pickup-dropdown__menu {
    z-index: 95;
}

/* Booking form variant */
.pickup-dropdown--booking .pickup-dropdown__trigger {
    min-height: 48px;
    border-radius: 10px;
    border-color: rgba(13, 20, 22, 0.12);
    background: #fff;
}
.dark .pickup-dropdown--booking .pickup-dropdown__trigger {
    background: #0D1416;
    border-color: rgba(255, 255, 255, 0.12);
}
.cars-banner-filter,
.cars-banner-filter__field,
.page-banner__filter {
    overflow: visible;
}
/* Do NOT mix overflow-x:hidden with overflow-y:visible — browsers compute y as auto and show a scrollbar.
   Use clip on x so horizontal bleed is cut without forcing a vertical scrollbar. */
.page-banner--with-filter {
    overflow-x: clip;
    overflow-y: visible;
}
.cars-banner-filter .datetime-12h--compact .datetime-12h__card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(176px, 1.05fr);
    align-items: start;
    gap: 10px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow: none;
    overflow: visible;
}
.cars-banner-filter .datetime-12h__part-label {
    margin-bottom: 5px;
    font-size: 11px;
}
.cars-banner-filter .datetime-12h__part--time {
    min-width: 0;
}
.cars-banner-filter .datetime-12h__timebox {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
    max-width: 100%;
    height: 40px;
    min-height: 40px;
    padding: 3px;
    box-sizing: border-box;
    /* Dropdown menus must escape; fit content with flex so AM/PM doesn't spill out */
    overflow: visible;
}
.cars-banner-filter .dt-time-dropdown {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    height: 100%;
    overflow: visible;
}
.cars-banner-filter .dt-time-dropdown__trigger {
    min-width: 0;
    min-height: 0 !important;
    height: 100%;
    overflow: hidden;
    padding-inline: 6px;
    font-size: 13px !important;
}
.cars-banner-filter .dt-time-dropdown__menu {
    width: 120px;
    min-width: 120px;
    z-index: 90;
}
.cars-banner-filter .dt-date-dropdown__panel {
    z-index: 90;
}
.cars-banner-filter .datetime-12h__ampm {
    flex: 0 0 auto;
    width: auto;
    max-width: 46%;
    align-self: stretch;
}
.cars-banner-filter .datetime-12h__ampm button {
    min-width: 30px;
    padding: 0 4px;
    height: auto;
    font-size: 11px;
}
.cars-banner-filter .datetime-12h--compact .dt-date-dropdown__trigger {
    min-height: 40px !important;
    height: 40px;
}

/* Mobile: keep date/time stacked so nothing overlaps */
@media (max-width: 575.98px) {
    .cars-banner-filter .datetime-12h--compact .datetime-12h__card {
        grid-template-columns: 1fr;
    }
}

/* From | To in one row */
@media (min-width: 768px) {
    .page-banner__filter {
        max-width: 900px !important;
    }
    .cars-banner-filter {
        grid-template-columns: 1fr 1fr;
        gap: 14px;
        padding: 16px 18px;
        align-items: stretch;
    }
    .cars-banner-filter__field--datetime {
        min-width: 0;
    }
}
.site-logo-link {
    display: inline-block;
    line-height: 0;
}
.site-logo {
    display: block;
    height: 28px;
    width: auto;
}
.site-logo--dark {
    display: none;
}
.dark .site-logo--light {
    display: none;
}
.dark .site-logo--dark {
    display: block;
}
@media (min-width: 768px) {
    .site-logo {
        height: 36px;
    }
}
@media (min-width: 1024px) {
    .site-logo {
        height: 42px;
    }
}

/* Footer brand column under logo */
.footer-brand__tagline {
    margin: 0 0 18px;
    max-width: 380px;
    color: #d9d9d9;
    font-size: 14px;
    line-height: 1.65;
    font-weight: 500;
}
.footer-brand__social {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}
.footer-brand__social a {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.04);
    color: #fff;
    font-size: 18px;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.footer-brand__social a:hover {
    background: #67C761;
    border-color: #67C761;
    color: #0D1416;
    transform: translateY(-2px);
}

/* Updated sidebar panel */
.sidebar-close-btn {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 10px;
    background: #f4f4f4;
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}
.dark .sidebar-close-btn {
    background: #171E20;
    color: #fff;
}
.sidebar-close-btn:hover {
    background: #67C761;
    color: #0D1416;
}
.sidebar-panel__intro {
    margin: 0 0 18px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.45;
    color: rgba(13, 20, 22, 0.62);
}
.dark .sidebar-panel__intro {
    color: rgba(255, 255, 255, 0.62);
}
.sidebar-menu {
    list-style: none;
    margin: 0 0 18px;
    padding: 0;
    display: grid;
    gap: 6px;
}
.sidebar-menu__link {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    padding: 0 12px;
    border-radius: 12px;
    color: #0D1416;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    transition: background 0.2s ease, color 0.2s ease;
}
.dark .sidebar-menu__link {
    color: #fff;
}
.sidebar-menu__link i {
    width: 22px;
    font-size: 20px;
    color: #67C761;
    line-height: 1;
}
.sidebar-menu__link:hover,
.sidebar-menu__link.active {
    background: rgba(103, 199, 97, 0.12);
    color: #67C761;
}
.sidebar-auth {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 12px;
}
.sidebar-auth--secondary {
    margin-bottom: 20px;
}
.sidebar-auth__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 42px;
    padding: 0 12px;
    border-radius: 10px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    background: #fff;
    color: #0D1416;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
}
.dark .sidebar-auth__btn {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.sidebar-auth__btn--solid {
    background: #0D1416;
    border-color: #0D1416;
    color: #fff;
}
.dark .sidebar-auth__btn--solid {
    background: #67C761;
    border-color: #67C761;
    color: #0D1416;
}
.sidebar-contact {
    margin-bottom: 18px;
    padding: 14px;
    border-radius: 14px;
    background: #f4f4f4;
}
.dark .sidebar-contact {
    background: #171E20;
}
.sidebar-contact__title {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.55);
}
.dark .sidebar-contact__title {
    color: rgba(255, 255, 255, 0.55);
}
.sidebar-contact__row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 34px;
    color: #0D1416;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}
.dark .sidebar-contact__row {
    color: #fff;
}
.sidebar-contact__row i {
    color: #67C761;
    font-size: 18px;
}
.sidebar-contact__row:hover {
    color: #67C761;
}
.sidebar-social {
    display: flex;
    align-items: center;
    gap: 8px;
}
.sidebar-social a {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #f4f4f4;
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}
.dark .sidebar-social a {
    background: #171E20;
    color: #fff;
}
.sidebar-social a:hover {
    background: #67C761;
    color: #0D1416;
}
.sidebar-book-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 52px;
    padding: 8px 8px 8px 18px;
    border-radius: 12px;
    background: #0D1416;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    font-weight: 700;
}
.sidebar-book-btn i {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #67C761;
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}
.sidebar-book-btn:hover {
    color: #fff;
    background: #151d20;
}
.sidebar-modal-footer {
    padding: 16px 20px !important;
}

/* Auth pages (login / register) */
.auth-topbar {
    padding: 16px 0;
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
    background: #fff;
}
.dark .auth-topbar {
    background: #0D1416;
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.auth-topbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.auth-topbar__back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: #0D1416;
    text-decoration: none;
}
.dark .auth-topbar__back {
    color: #fff;
}
.auth-topbar__back:hover {
    color: #67C761;
}
.auth-page {
    background: #f4f4f4;
}
.dark .auth-page {
    background: #0D1416;
}
.auth-page__wrap {
    display: grid;
    grid-template-columns: 1fr;
    min-height: calc(100vh - 74px);
}
.auth-page__panel {
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    padding: 28px 16px 40px;
}
.auth-page__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
}
.auth-page__icon {
    flex: none;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: rgba(103, 199, 97, 0.15);
    color: #67C761;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}
.auth-page__head--brand {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}
.auth-page__brand {
    display: inline-flex;
    line-height: 0;
}
.auth-page__logo {
    display: block;
    height: 48px;
    width: auto;
    max-width: min(220px, 70vw);
    object-fit: contain;
}
.auth-page__logo--dark {
    display: none;
}
.dark .auth-page__logo--light {
    display: none;
}
.dark .auth-page__logo--dark {
    display: block;
}
.auth-page__title {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    color: #0D1416;
}
.dark .auth-page__title {
    color: #fff;
}
.auth-page__subtitle {
    margin: 4px 0 0;
    font-size: 13px;
    font-weight: 500;
    color: rgba(13, 20, 22, 0.55);
}
.dark .auth-page__subtitle {
    color: rgba(255, 255, 255, 0.55);
}
.auth-form {
    display: grid;
    gap: 12px;
}
.auth-form__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
.auth-form__field {
    min-width: 0;
}
.auth-form__row {
    display: flex;
    justify-content: flex-end;
}
.auth-form__link {
    font-size: 13px;
    font-weight: 600;
    color: #67C761;
    text-decoration: none;
}
.auth-form__link:hover {
    text-decoration: underline;
}
.auth-submit {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 52px;
    margin-top: 4px;
    padding: 8px 8px 8px 18px;
    border: 0;
    border-radius: 12px;
    background: #0D1416;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}
.auth-submit i {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #67C761;
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}
.auth-submit:hover {
    background: #151d20;
}
.auth-divider {
    position: relative;
    text-align: center;
    margin: 22px 0 16px;
}
.auth-divider::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: rgba(13, 20, 22, 0.12);
}
.dark .auth-divider::before {
    background: rgba(255, 255, 255, 0.12);
}
.auth-divider span {
    position: relative;
    z-index: 1;
    display: inline-block;
    padding: 0 12px;
    background: #f4f4f4;
    font-size: 12px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.5);
}
.dark .auth-divider span {
    background: #0D1416;
    color: rgba(255, 255, 255, 0.5);
}
.auth-page .is-hidden,
.auth-form.is-hidden,
#authForgotView.is-hidden,
#authLoginView.is-hidden {
    display: none !important;
}
.forgot-steps {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}
.forgot-steps__item {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    background: rgba(13, 20, 22, 0.08);
    color: rgba(13, 20, 22, 0.45);
}
.dark .forgot-steps__item {
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.45);
}
.forgot-steps__item.is-active,
.forgot-steps__item.is-done {
    background: #67C761;
    color: #0D1416;
}
.forgot-steps__line {
    flex: 1;
    height: 2px;
    background: rgba(13, 20, 22, 0.1);
}
.dark .forgot-steps__line {
    background: rgba(255, 255, 255, 0.12);
}
.auth-form__status {
    min-height: 18px;
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
}
.auth-form__status.is-success {
    color: #67C761;
}
.auth-form__status.is-error {
    color: #dc2626;
}
.forgot-hint {
    margin: -2px 0 4px;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.6);
}
.dark .forgot-hint {
    color: rgba(255, 255, 255, 0.6);
}
.auth-otp-input {
    letter-spacing: 0.28em;
    font-weight: 700;
    text-align: center;
}
.auth-text-btn {
    appearance: none;
    border: 0;
    background: transparent;
    color: #67C761;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    padding: 4px 0;
    text-align: center;
}
.auth-text-btn:hover {
    text-decoration: underline;
}
.auth-form__link {
    appearance: none;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 0;
    font: inherit;
}
.auth-gmail-btn {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    border-radius: 12px;
    background: #fff;
    color: #0D1416;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}
.dark .auth-gmail-btn {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.auth-gmail-btn i,
.auth-gmail-btn__icon {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    display: block;
}
.auth-gmail-btn i {
    font-size: 20px;
    color: #ea4335;
}
.auth-gmail-btn:hover {
    border-color: #67C761;
    background: rgba(103, 199, 97, 0.06);
    color: #0D1416;
    text-decoration: none;
}
.dark .auth-gmail-btn:hover {
    color: #fff;
}
.auth-gmail-btn:disabled,
.auth-gmail-btn[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}
.auth-page__switch {
    margin: 18px 0 0;
    text-align: center;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.65);
}
.dark .auth-page__switch {
    color: rgba(255, 255, 255, 0.65);
}
.auth-page__switch a {
    color: #67C761;
    font-weight: 700;
    text-decoration: none;
}
.auth-page__switch a:hover {
    text-decoration: underline;
}
.auth-page__switch {
    margin-top: 20px;
}
.auth-theme-toggle {
    position: fixed;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px));
    right: 12px;
    z-index: 35;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 0;
    background: #fff;
    color: #0D1416;
    font-size: 18px;
    box-shadow: 0 8px 24px rgba(149, 157, 165, 0.3);
    cursor: pointer;
}
.dark .auth-theme-toggle {
    background: #000;
    color: #fff;
}
@media (min-width: 992px) {
    .auth-theme-toggle {
        bottom: 30px;
        right: 30px;
    }
}
.auth-page__aside {
    display: none;
    position: relative;
    min-height: 100%;
    background-size: cover;
    background-position: center;
}
.auth-page__aside::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(13, 20, 22, 0.35) 0%, rgba(13, 20, 22, 0.82) 100%);
}
.auth-page__aside-content {
    position: relative;
    z-index: 1;
    max-width: 420px;
    margin-top: auto;
    padding: 40px;
    color: #fff;
}
.auth-page__badge {
    display: inline-block;
    margin-bottom: 12px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(103, 199, 97, 0.2);
    color: #67C761;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
}
.auth-page__aside-content h2 {
    margin: 0 0 10px;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
}
.auth-page__aside-content p {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.78);
}
@media (min-width: 768px) {
    .auth-page__panel {
        padding: 40px 24px 48px;
    }
    .auth-form__grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (min-width: 1024px) {
    .auth-page__wrap {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    }
    .auth-page__panel {
        max-width: 520px;
        margin: 0 0 0 auto;
        padding: 48px 48px 48px 24px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .auth-page__aside {
        display: flex;
        align-items: flex-end;
    }
    .auth-divider span {
        background: #f4f4f4;
    }
    .dark .auth-divider span {
        background: #0D1416;
    }
}

/* Account / profile / bookings */
.account-page {
    padding-top: 24px;
}
.account-header {
    display: grid;
    gap: 14px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
}
.dark .account-header {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.account-header__title {
    margin: 0;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.15;
    color: #0D1416;
}
.dark .account-header__title {
    color: #fff;
}
.account-header__subtitle {
    margin: 6px 0 0;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.58);
}
.dark .account-header__subtitle {
    color: rgba(255, 255, 255, 0.58);
}
.account-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 6px;
    border-radius: 14px;
    background: #f4f4f4;
}
.dark .account-nav {
    background: #171E20;
}
.account-nav__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 42px;
    padding: 0 10px;
    border-radius: 10px;
    background: transparent;
    color: rgba(13, 20, 22, 0.7);
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}
.dark .account-nav__link {
    color: rgba(255, 255, 255, 0.7);
}
.account-nav__link i {
    color: #67C761;
    font-size: 17px;
}
.account-nav__link.is-active {
    background: #fff;
    color: #0D1416;
    box-shadow: 0 1px 3px rgba(13, 20, 22, 0.08);
}
.dark .account-nav__link.is-active {
    background: #0D1416;
    color: #fff;
}
.account-main {
    min-width: 0;
}
.profile-summary {
    display: grid;
    gap: 14px;
    margin-bottom: 18px;
    padding: 16px;
    border-radius: 16px;
    background: #E9F0E5;
    border: 1px solid rgba(103, 199, 97, 0.22);
}
.dark .profile-summary {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.08);
}
.profile-summary__identity {
    display: flex;
    align-items: center;
    gap: 12px;
}
.profile-summary__avatar {
    flex: none;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #67C761;
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 800;
}
.profile-summary__info h2 {
    margin: 0 0 4px;
    font-size: 20px;
    color: #0D1416;
}
.dark .profile-summary__info h2 {
    color: #fff;
}
.profile-summary__info p {
    margin: 0;
    color: rgba(13, 20, 22, 0.65);
    font-size: 14px;
}
.dark .profile-summary__info p {
    color: rgba(255, 255, 255, 0.65);
}
.profile-summary__meta {
    display: inline-block;
    margin-top: 6px;
    font-size: 12px;
    color: #67C761;
    font-weight: 700;
}
.profile-summary__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.profile-summary__stats div {
    padding: 10px 8px;
    border-radius: 12px;
    background: #fff;
    text-align: center;
}
.dark .profile-summary__stats div {
    background: #0D1416;
}
.profile-summary__stats strong {
    display: block;
    font-size: 18px;
    color: #67C761;
}
.profile-summary__stats span {
    font-size: 11px;
    color: rgba(13, 20, 22, 0.55);
}
.dark .profile-summary__stats span {
    color: rgba(255, 255, 255, 0.55);
}
.profile-form__section {
    margin-bottom: 18px;
    padding: 18px;
    border-radius: 16px;
    background: #f4f4f4;
}
.dark .profile-form__section {
    background: #171E20;
}
.profile-form__section h3 {
    margin: 0 0 14px;
    font-size: 16px;
}
.profile-form__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
.profile-docs {
    display: grid;
    gap: 10px;
}
.profile-docs__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 12px;
    background: #fff;
}
.dark .profile-docs__item {
    background: #0D1416;
}
.profile-docs__item i {
    font-size: 22px;
    color: #67C761;
}
.profile-docs__item strong {
    display: block;
    font-size: 13px;
}
.profile-docs__item span {
    font-size: 13px;
    color: rgba(13, 20, 22, 0.6);
}
.dark .profile-docs__item span {
    color: rgba(255, 255, 255, 0.6);
}
.profile-form__help {
    margin: -4px 0 14px;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.55);
}
.dark .profile-form__help {
    color: rgba(255, 255, 255, 0.55);
}
.profile-form__section .booking-docs {
    margin-top: 4px;
}
.profile-form__section .booking-docs__block + .booking-docs__block {
    margin-top: 16px;
}
.profile-upload {
    position: relative;
}
.profile-upload__input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
.profile-upload__drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 140px;
    padding: 16px;
    border: 1px dashed rgba(13, 20, 22, 0.2);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    text-align: center;
}
.dark .profile-upload__drop {
    background: #0D1416;
    border-color: rgba(255, 255, 255, 0.18);
}
.profile-upload__icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(103, 199, 97, 0.14);
    color: #67C761;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    margin-bottom: 4px;
}
.profile-upload__title {
    font-size: 14px;
    font-weight: 700;
    color: #0D1416;
}
.dark .profile-upload__title {
    color: #fff;
}
.profile-upload__hint {
    font-size: 12px;
    color: rgba(13, 20, 22, 0.5);
}
.dark .profile-upload__hint {
    color: rgba(255, 255, 255, 0.5);
}
.profile-upload__preview {
    position: relative;
    min-height: 140px;
    border-radius: 12px;
    overflow: hidden;
    background: #0D1416;
}
.profile-upload__preview.is-hidden {
    display: none !important;
}
.profile-upload.has-file .profile-upload__drop {
    display: none;
}
.profile-upload__preview img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    display: block;
}
.profile-upload__remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.92);
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.profile-summary__avatar {
    background-size: cover;
    background-position: center;
}
.profile-summary__avatar.has-image {
    font-size: 0;
}
.profile-form__status {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 600;
}
.profile-form__status.is-success {
    color: #67C761;
}
.profile-form__status.is-error {
    color: #dc2626;
}
.profile-form__actions {
    margin-top: 14px;
}
.profile-form__section .profile-form__actions {
    margin-bottom: 0;
}
.profile-form__submit {
    max-width: 240px;
}
.profile-form > .profile-form__section:last-child {
    margin-bottom: 28px;
}
.account-page {
    padding-bottom: calc(48px + env(safe-area-inset-bottom, 0px));
}
@media (max-width: 991.98px) {
    .account-page {
        padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
    }
}
@media (min-width: 768px) {
    .account-header {
        grid-template-columns: 1fr auto;
        align-items: end;
        gap: 20px;
    }
    .account-nav {
        min-width: 280px;
    }
}
.current-bookings {
    margin-bottom: 28px;
    padding: 18px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(103, 199, 97, 0.12) 0%, rgba(103, 199, 97, 0.04) 100%);
    border: 1px solid rgba(103, 199, 97, 0.28);
}
.dark .current-bookings {
    background: linear-gradient(180deg, rgba(103, 199, 97, 0.14) 0%, rgba(23, 30, 32, 0.9) 100%);
    border-color: rgba(103, 199, 97, 0.28);
}
.current-bookings__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.current-bookings__head h2,
.booking-history-head h2 {
    margin: 0 0 4px;
    font-size: 20px;
    line-height: 1.25;
}
.current-bookings__head p,
.booking-history-head p {
    margin: 0;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.62);
}
.dark .current-bookings__head p,
.dark .booking-history-head p {
    color: rgba(255, 255, 255, 0.62);
}
.current-bookings__count {
    flex: none;
    min-width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #67C761;
    color: #0D1416;
    font-size: 14px;
    font-weight: 800;
}
.booking-history-head {
    margin-bottom: 12px;
}
.booking-card--current {
    background: #fff;
    border: 1px solid rgba(103, 199, 97, 0.22);
    box-shadow: 0 8px 20px rgba(13, 20, 22, 0.06);
}
.dark .booking-card--current {
    background: #0D1416;
    border-color: rgba(103, 199, 97, 0.28);
}
.booking-card__live {
    position: absolute;
    left: 10px;
    top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 26px;
    padding: 0 10px;
    border-radius: 999px;
    background: #67C761;
    color: #0D1416;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.booking-card--current .booking-card__media {
    position: relative;
}
.booking-empty--compact {
    padding: 28px 16px;
    background: rgba(255, 255, 255, 0.7);
}
.dark .booking-empty--compact {
    background: rgba(13, 20, 22, 0.55);
}
.booking-cancel-modal {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.booking-cancel-modal[hidden] {
    display: none !important;
}
.booking-cancel-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(13, 20, 22, 0.55);
    backdrop-filter: blur(3px);
}
.booking-cancel-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(460px, 100%);
    border-radius: 18px;
    background: #fff;
    padding: 22px 20px 18px;
    box-shadow: 0 24px 48px rgba(13, 20, 22, 0.28);
}
.dark .booking-cancel-modal__dialog {
    background: #171E20;
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.booking-cancel-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.06);
    color: #0D1416;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    cursor: pointer;
}
.dark .booking-cancel-modal__close {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}
.booking-cancel-modal__icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(220, 38, 38, 0.12);
    color: #dc2626;
    font-size: 24px;
    margin-bottom: 12px;
}
.booking-cancel-modal__dialog h3 {
    margin: 0 0 6px;
    font-size: 20px;
}
.booking-cancel-modal__lead {
    margin: 0 0 16px;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.65);
}
.dark .booking-cancel-modal__lead {
    color: rgba(255, 255, 255, 0.65);
}
.booking-cancel-modal__form label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 700;
}
.booking-cancel-modal__form textarea {
    width: 100%;
    min-height: 110px;
    resize: vertical;
    border-radius: 12px;
    border: 1px solid rgba(13, 20, 22, 0.14);
    background: #f8faf8;
    padding: 12px 14px;
    font: inherit;
    color: #0D1416;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.dark .booking-cancel-modal__form textarea {
    background: #0D1416;
    border-color: rgba(255, 255, 255, 0.14);
    color: #fff;
}
.booking-cancel-modal__form textarea:focus {
    border-color: rgba(103, 199, 97, 0.65);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.2);
}
.booking-cancel-modal__hint {
    margin: 8px 0 0;
    font-size: 12px;
    color: #dc2626;
}
.booking-cancel-modal__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
    justify-content: flex-end;
}

.booking-tabs-bar {
    position: sticky;
    top: var(--booking-tabs-top, 72px);
    z-index: 8;
    margin: 0 0 16px;
    padding: 10px 0 12px;
    background: #fff;
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
    box-shadow: 0 10px 18px rgba(13, 20, 22, 0.04);
}
.dark .booking-tabs-bar {
    background: #0D1416;
    border-bottom-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 10px 18px rgba(0, 0, 0, 0.2);
}
.booking-tabs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    margin-bottom: 0;
    padding-bottom: 2px;
}
.booking-tabs__btn {
    appearance: none;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: #fff;
    color: rgba(13, 20, 22, 0.65);
    border-radius: 999px;
    min-height: 40px;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}
.dark .booking-tabs__btn {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.65);
}
.booking-tabs__btn span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    margin-left: 6px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.08);
    font-size: 11px;
}
.dark .booking-tabs__btn span {
    background: rgba(255, 255, 255, 0.1);
}
.booking-tabs__btn.is-active {
    background: #67C761;
    border-color: #67C761;
    color: #0D1416;
}
.booking-tabs__btn.is-active span {
    background: rgba(13, 20, 22, 0.12);
    color: #0D1416;
}
.booking-tab-panel.is-hidden {
    display: none !important;
}
.booking-list {
    display: grid;
    gap: 12px;
}
.booking-card {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px;
    border-radius: 16px;
    background: #f4f4f4;
}
.dark .booking-card {
    background: #171E20;
}
.booking-card__media {
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #ddd;
}
.booking-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.booking-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}
.booking-card__id {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #67C761;
    margin-bottom: 4px;
}
.booking-card__body h3 {
    margin: 0;
    font-size: 17px;
    line-height: 1.25;
}
.booking-status {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}
.booking-status--current {
    background: rgba(103, 199, 97, 0.2);
    color: #1f7a1a;
}
.booking-status--confirmed {
    background: rgba(103, 199, 97, 0.16);
    color: #2f8f2a;
}
.booking-status--completed {
    background: rgba(59, 130, 246, 0.14);
    color: #2563eb;
}
.booking-status--cancelled {
    background: rgba(220, 38, 38, 0.12);
    color: #dc2626;
}
.booking-card__meta {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.booking-card__meta li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    line-height: 1.35;
    color: rgba(13, 20, 22, 0.72);
}
.dark .booking-card__meta li {
    color: rgba(255, 255, 255, 0.72);
}
.booking-card__meta i {
    color: #67C761;
    margin-top: 1px;
}
.booking-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}
.booking-card__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid transparent;
    background: #0D1416;
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
}
.booking-card__btn:hover {
    color: #fff;
    background: #151d20;
}
.booking-card__btn--ghost {
    background: transparent;
    color: #0D1416;
    border: 1px solid rgba(13, 20, 22, 0.14);
}
.dark .booking-card__btn--ghost {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.14);
}
.booking-card__btn.booking-card__btn--danger {
    background: #dc2626;
    border-color: #dc2626;
    color: #fff;
    cursor: pointer;
}
.booking-card__btn.booking-card__btn--danger:hover {
    background: #b91c1c;
    border-color: #b91c1c;
    color: #fff;
}
.booking-card__btn.booking-card__btn--review {
    background: #67C761;
    border-color: #67C761;
    color: #0D1416;
    cursor: pointer;
}
.booking-card__btn.booking-card__btn--review:hover {
    background: #57b652;
    border-color: #57b652;
    color: #0D1416;
}
.booking-card__btn.booking-card__btn--review.is-done {
    background: rgba(103, 199, 97, 0.16);
    border-color: rgba(103, 199, 97, 0.35);
    color: #2f8f2a;
    pointer-events: none;
}
.booking-card__review-note.is-hidden {
    display: none !important;
}
.booking-cancel-modal__icon--review {
    background: rgba(103, 199, 97, 0.16);
    color: #2f8f2a;
}
.review-field-label {
    margin-top: 14px;
}
.review-stars {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 4px 0 8px;
}
.review-stars__btn {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.05);
    color: rgba(13, 20, 22, 0.28);
    font-size: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.dark .review-stars__btn {
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.28);
}
.review-stars__btn:hover,
.review-stars__btn.is-active {
    color: #f5b301;
    background: rgba(245, 179, 1, 0.12);
}
.review-stars__btn:hover {
    transform: translateY(-1px);
}
.booking-empty {
    text-align: center;
    padding: 36px 18px;
    border-radius: 16px;
    background: #f4f4f4;
}
.dark .booking-empty {
    background: #171E20;
}
.booking-empty i {
    font-size: 36px;
    color: #67C761;
}
.booking-empty h3 {
    margin: 10px 0 6px;
    font-size: 18px;
}
.booking-empty p {
    margin: 0 0 16px;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.6);
}
.dark .booking-empty p {
    color: rgba(255, 255, 255, 0.6);
}
.booking-empty__cta {
    max-width: 220px;
    margin: 0 auto;
}
.booking-detail__hero {
    display: grid;
    gap: 14px;
    margin-bottom: 16px;
    padding: 12px;
    border-radius: 16px;
    background: #f4f4f4;
}
.dark .booking-detail__hero {
    background: #171E20;
}
.booking-detail__hero img {
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: 12px;
}
.booking-detail__hero-body h2 {
    margin: 10px 0 6px;
    font-size: 22px;
}
.booking-detail__hero-body p {
    margin: 0;
    font-size: 14px;
    color: rgba(13, 20, 22, 0.65);
}
.dark .booking-detail__hero-body p {
    color: rgba(255, 255, 255, 0.65);
}
.booking-detail__grid {
    display: grid;
    gap: 12px;
}
.booking-detail__card {
    padding: 16px;
    border-radius: 14px;
    background: #f4f4f4;
}
.dark .booking-detail__card {
    background: #171E20;
}
.booking-detail__card h3 {
    margin: 0 0 12px;
    font-size: 15px;
}
.booking-detail__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}
.booking-detail__list li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
}
.booking-detail__list span {
    color: rgba(13, 20, 22, 0.55);
}
.dark .booking-detail__list span {
    color: rgba(255, 255, 255, 0.55);
}
.booking-detail__list strong {
    text-align: right;
}
.booking-detail__total {
    color: #67C761;
    font-size: 16px;
}
.booking-detail__card--warn {
    background: rgba(220, 38, 38, 0.08);
}
.booking-detail__card--warn p {
    margin: 0;
    font-size: 14px;
}
.booking-detail__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}
.booking-detail__cta {
    max-width: 240px;
}

/* Invoice */
.invoice-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}
.invoice-toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.invoice-download-btn {
    max-width: 220px;
    min-height: 44px;
}
.invoice-sheet {
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    border-radius: 16px;
    padding: 20px;
    color: #0D1416;
}
.dark .invoice-sheet {
    background: #171E20;
    border-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}
.invoice-sheet__top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
}
.dark .invoice-sheet__top {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.invoice-sheet__logo {
    height: 42px;
    width: auto;
    display: block;
    margin-bottom: 6px;
}
.invoice-sheet__brand {
    margin: 0;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.55);
}
.dark .invoice-sheet__brand {
    color: rgba(255, 255, 255, 0.55);
}
.invoice-sheet__meta {
    text-align: right;
}
.invoice-sheet__badge {
    display: inline-block;
    margin-bottom: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(103, 199, 97, 0.16);
    color: #2f8f2a;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}
.invoice-sheet__meta h1 {
    margin: 0 0 6px;
    font-size: 22px;
    color: inherit;
}
.invoice-sheet__meta p {
    margin: 0 0 2px;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.6);
}
.dark .invoice-sheet__meta p {
    color: rgba(255, 255, 255, 0.6);
}
.invoice-sheet__parties {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-bottom: 18px;
}
.invoice-sheet__parties > div:last-child {
    text-align: right;
}
.invoice-sheet__parties h3 {
    margin: 0 0 8px;
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #67C761;
}
.invoice-sheet__parties strong {
    display: block;
    margin-bottom: 4px;
    font-size: 15px;
}
.invoice-sheet__parties p {
    margin: 0 0 2px;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.7);
}
.dark .invoice-sheet__parties p {
    color: rgba(255, 255, 255, 0.7);
}
.invoice-table-wrap {
    overflow-x: auto;
    margin-bottom: 18px;
}
.invoice-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 520px;
}
.invoice-table th,
.invoice-table td {
    padding: 12px 10px;
    text-align: left;
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
    font-size: 13px;
    vertical-align: top;
}
.dark .invoice-table th,
.dark .invoice-table td {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.invoice-table th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(13, 20, 22, 0.5);
}
.dark .invoice-table th {
    color: rgba(255, 255, 255, 0.5);
}
.invoice-table td small {
    display: block;
    margin-top: 4px;
    color: rgba(13, 20, 22, 0.5);
}
.dark .invoice-table td small {
    color: rgba(255, 255, 255, 0.5);
}
.invoice-table:not(.invoice-table--trip) th:last-child,
.invoice-table:not(.invoice-table--trip) td:last-child,
.invoice-table:not(.invoice-table--trip) th:nth-child(3),
.invoice-table:not(.invoice-table--trip) td:nth-child(3) {
    text-align: right;
}
.invoice-table--trip {
    min-width: 0;
    border: 1px solid rgba(13, 20, 22, 0.1);
}
.dark .invoice-table--trip {
    border-color: rgba(255, 255, 255, 0.12);
}
.invoice-table--trip th,
.invoice-table--trip td {
    border: 1px solid rgba(13, 20, 22, 0.1);
    text-align: left;
}
.dark .invoice-table--trip th,
.dark .invoice-table--trip td {
    border-color: rgba(255, 255, 255, 0.12);
}
.invoice-table--trip thead th {
    background: #f4f4f4;
    font-weight: 700;
}
.dark .invoice-table--trip thead th {
    background: #0D1416;
}
.invoice-table--trip td {
    font-weight: 600;
}
.invoice-sheet__totals {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.invoice-sheet__notes h3 {
    margin: 0 0 6px;
    font-size: 13px;
}
.invoice-sheet__notes p {
    margin: 0 0 6px;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.65);
}
.dark .invoice-sheet__notes p {
    color: rgba(255, 255, 255, 0.65);
}
.invoice-sheet__warn {
    color: #dc2626 !important;
}
.invoice-sheet__sum {
    border-radius: 12px;
    background: #f4f4f4;
    padding: 12px;
}
.dark .invoice-sheet__sum {
    background: #0D1416;
}
.invoice-sheet__sum > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    font-size: 13px;
}
.invoice-sheet__grand {
    margin-top: 6px;
    padding-top: 10px !important;
    border-top: 1px solid rgba(13, 20, 22, 0.1);
    font-size: 16px !important;
}
.dark .invoice-sheet__grand {
    border-top-color: rgba(255, 255, 255, 0.12);
}
.invoice-sheet__grand strong {
    color: #67C761;
    font-size: 20px;
}
.invoice-sheet__footer {
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px dashed rgba(13, 20, 22, 0.15);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
}
.dark .invoice-sheet__footer {
    border-top-color: rgba(255, 255, 255, 0.15);
}
.invoice-sheet__footer p {
    margin: 0;
    font-size: 12px;
    color: rgba(13, 20, 22, 0.55);
}
.dark .invoice-sheet__footer p {
    color: rgba(255, 255, 255, 0.55);
}
@media (min-width: 768px) {
    .invoice-sheet {
        padding: 28px;
    }
    .invoice-sheet__parties {
        grid-template-columns: 1fr 1fr;
    }
    .invoice-sheet__totals {
        grid-template-columns: 1.2fr 0.8fr;
        align-items: start;
    }
}
@media print {
    body * {
        visibility: hidden;
    }
    .invoice-sheet,
    .invoice-sheet * {
        visibility: visible;
    }
    .invoice-sheet {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        border: 0;
        border-radius: 0;
        padding: 0;
        background: #fff !important;
        color: #000 !important;
        box-shadow: none;
    }
    .invoice-sheet__parties {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 24px !important;
        align-items: start;
    }
    .invoice-sheet__parties > div {
        min-width: 0;
    }
    .invoice-sheet__parties > div:last-child {
        text-align: right !important;
    }
    .invoice-sheet__top {
        display: flex !important;
        justify-content: space-between !important;
        align-items: flex-start !important;
    }
    .invoice-sheet__totals {
        display: grid !important;
        grid-template-columns: 1.2fr 0.8fr !important;
        gap: 20px !important;
    }
    .invoice-table,
    .invoice-table--trip {
        min-width: 0 !important;
        width: 100% !important;
    }
    .invoice-table--trip th,
    .invoice-table--trip td {
        border: 1px solid #ccc !important;
        color: #000 !important;
        background: #fff !important;
    }
    .invoice-table--trip thead th {
        background: #f4f4f4 !important;
    }
    .no-print,
    .mobile-bottom-nav,
    .floating-actions,
    #backToTopBtn,
    header,
    .account-header,
    footer {
        display: none !important;
    }
}
@media (min-width: 768px) {
    .profile-form__grid {
        grid-template-columns: 1fr 1fr;
    }
    .profile-form__field--full {
        grid-column: 1 / -1;
    }
    .booking-card {
        grid-template-columns: 180px minmax(0, 1fr);
        align-items: stretch;
    }
    .booking-card__media {
        aspect-ratio: auto;
        min-height: 100%;
    }
    .booking-detail__hero {
        grid-template-columns: 280px minmax(0, 1fr);
        align-items: center;
    }
    .booking-detail__grid {
        grid-template-columns: 1fr 1fr;
    }
}
/* Home — Our Offices cards */
.home-offices {
    display: grid;
    grid-template-columns: 1fr;
    gap: 25px;
}
.home-office-card {
    overflow: hidden;
    border-radius: 15px;
    background: #171E20;
    color: #fff;
}
.home-office-card__media {
    position: relative;
    height: 200px;
    overflow: hidden;
}
.home-office-card__media img,
.home-office-card__media iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    object-fit: cover;
}
.home-office-card__media:has(img)::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(13, 20, 22, 0.15) 0%, rgba(13, 20, 22, 0.55) 100%);
    pointer-events: none;
}
.home-office-card__tag {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 30px;
    background: #67C761;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    pointer-events: none;
}
.home-office-card__body {
    padding: 22px 20px 24px;
}
.home-office-card__brand {
    display: block;
    margin-bottom: 8px;
    font-weight: 700;
    color: #67C761;
}
.home-office-card__body h3 {
    margin: 0 0 18px;
    color: #fff !important;
    font-size: 20px;
    line-height: 1.25;
}
.home-office-card__list {
    margin: 0 0 22px;
    padding: 0;
    list-style: none;
}
.home-office-card__list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 16px;
}
.home-office-card__list li:last-child {
    margin-bottom: 0;
}
.home-office-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    color: #67C761;
    font-size: 20px;
}
.home-office-card__list span:not(.home-office-card__icon) {
    display: block;
    padding-top: 8px;
    color: #d9d9d9;
    font-size: 14px;
    line-height: 1.45;
}
.home-office-card__list small {
    display: block;
    margin-bottom: 2px;
    color: #bbbbbb;
    font-size: 12px;
}
.home-office-card__list a {
    display: block;
    font-weight: 600;
    color: #fff;
    word-break: break-word;
}
.home-office-card__list a:hover {
    color: #67C761;
}
.home-office-card__actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
}
.home-office-card__actions .primary-btn {
    flex: 1 1 auto;
    min-width: 0;
    padding: 4px;
    font-size: 13px;
    white-space: nowrap;
}
.home-office-card__actions .primary-btn span {
    flex: 1 1 auto;
    min-width: 0;
    padding-left: 12px !important;
    padding-right: 8px !important;
}
.home-office-card__actions .primary-btn i {
    flex: none !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    font-size: 16px !important;
    border-radius: 5px !important;
}
.home-office-card__whatsapp {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: 5px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    font-weight: 500;
    font-size: 13px;
    color: #fff;
    white-space: nowrap;
}
.home-office-card__whatsapp i {
    font-size: 18px;
}
.home-office-card__whatsapp:hover {
    color: #67C761;
    border-color: #67C761;
}
@media (min-width: 768px) {
    .home-office-card {
        display: grid;
        grid-template-columns: 1fr 1fr;
        min-height: 320px;
    }
    .home-office-card__media {
        height: auto;
        min-height: 100%;
    }
    .home-office-card__media iframe {
        min-height: 320px;
    }
    .home-office-card__body {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 30px;
    }
    .home-office-card__body h3 {
        font-size: 24px;
    }
}
@media (min-width: 1024px) {
    .home-offices--multi {
        grid-template-columns: 1fr 1fr;
    }
    .home-office-card__body {
        padding: 35px;
    }
}

/* Why Choose Go Speed — collage matches desktop on mobile */
.why-choose-images {
    position: relative;
    text-align: center;
    padding-top: 120px;
    min-height: 360px;
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
}
.why-choose-images__main,
.why-choose-images__top,
.why-choose-images__badge {
    border-radius: 15px;
    overflow: hidden;
}
.why-choose-images__main,
.why-choose-images__top {
    border: 5px solid #fff;
}
.dark .why-choose-images__main,
.dark .why-choose-images__top {
    border-color: #000;
}
.why-choose-images img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}
.why-choose-images__main {
    position: relative;
    z-index: 1;
    max-width: 78%;
    margin-left: auto;
    margin-right: auto;
    rotate: -5deg;
}
.why-choose-images__top {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    width: 58%;
    max-width: 240px;
    rotate: 5deg;
}
.why-choose-images__badge {
    position: absolute;
    top: 28px;
    left: 0;
    z-index: 3;
    width: 38%;
    max-width: 160px;
    rotate: -5deg;
}
@media (min-width: 768px) {
    .why-choose-images {
        padding-top: 210px;
        min-height: 0;
        max-width: none;
    }
    .why-choose-images__main,
    .why-choose-images__top {
        border-width: 10px;
    }
    .why-choose-images__main {
        max-width: 465px;
    }
    .why-choose-images__top {
        width: auto;
        max-width: 350px;
    }
    .why-choose-images__badge {
        top: 35px;
        width: auto;
        max-width: 220px;
    }
}
@media (min-width: 1024px) {
    .why-choose-images {
        max-width: none;
    }
    .why-choose-images__main {
        max-width: 400px;
    }
    .why-choose-images__top {
        right: 25px;
        max-width: 240px;
    }
    .why-choose-images__badge {
        top: 55px;
        max-width: 190px;
    }
}
@media (min-width: 1280px) {
    .why-choose-images__main {
        max-width: 465px;
    }
    .why-choose-images__top {
        right: 0;
        max-width: 350px;
    }
    .why-choose-images__badge {
        max-width: 220px;
    }
}
@media (min-width: 1536px) {
    .why-choose-images__top {
        max-width: 430px;
    }
    .why-choose-images__badge {
        top: 10px;
        left: 40px;
        max-width: 280px;
    }
}
@media (min-width: 1024px) {
    .account-page {
        padding-top: 36px;
    }
    .account-header__title {
        font-size: 32px;
    }
    .profile-summary {
        grid-template-columns: 1fr auto;
        align-items: center;
    }
    .page-banner--with-filter {
        padding: 48px 0 52px;
    }
    .page-banner__layout--split {
        grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.4fr);
        gap: 28px;
        align-items: center;
    }
    .page-banner__filter {
        max-width: min(980px, 100%);
        margin-left: auto;
    }
}

/* ============================================================
   Admin panel
   ============================================================ */
.admin-body {
    margin: 0;
    min-height: 100vh;
    background: #f5f7f5;
    color: #0d1416;
    font-family: "Segoe UI", Tahoma, sans-serif;
}
.admin-body,
.admin-main,
.admin-content,
.admin-table-wrap {
    scrollbar-width: thin;
    scrollbar-color: rgba(103, 199, 97, 0.55) transparent;
}
.admin-body::-webkit-scrollbar,
.admin-main::-webkit-scrollbar,
.admin-content::-webkit-scrollbar,
.admin-table-wrap::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.admin-body::-webkit-scrollbar-track,
.admin-main::-webkit-scrollbar-track,
.admin-content::-webkit-scrollbar-track,
.admin-table-wrap::-webkit-scrollbar-track {
    background: transparent;
}
.admin-body::-webkit-scrollbar-thumb,
.admin-main::-webkit-scrollbar-thumb,
.admin-content::-webkit-scrollbar-thumb,
.admin-table-wrap::-webkit-scrollbar-thumb {
    background: rgba(103, 199, 97, 0.45);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
.admin-body::-webkit-scrollbar-thumb:hover,
.admin-main::-webkit-scrollbar-thumb:hover,
.admin-content::-webkit-scrollbar-thumb:hover,
.admin-table-wrap::-webkit-scrollbar-thumb:hover {
    background: rgba(103, 199, 97, 0.75);
    border: 2px solid transparent;
    background-clip: padding-box;
}
.admin-shell {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    min-height: 100vh;
}
.admin-sidebar {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 14px 16px;
    background-color: #0d1416;
    background-image:
        linear-gradient(180deg, #121a1c 0%, #0d1416 55%, #0a1012 100%);
    color: #fff;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;
    border-right: 1px solid rgba(103, 199, 97, 0.12);
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.03);
}
.admin-sidebar__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    flex: 0 0 auto;
}
.admin-sidebar__head .admin-brand {
    flex: 1;
    min-width: 0;
    padding-bottom: 8px;
}
.admin-sidebar__close {
    display: none;
    place-items: center;
    width: 40px;
    height: 40px;
    margin-top: 4px;
    border: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    flex: 0 0 auto;
}
.admin-sidebar__close:hover {
    background: rgba(255, 255, 255, 0.14);
}
.admin-nav-backdrop {
    display: none;
}
.admin-topbar__menu {
    display: none;
}
.admin-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: inherit;
    text-decoration: none;
    padding: 6px 10px 14px;
    flex: 0 0 auto;
}
.admin-brand__logo {
    display: block;
    height: 42px;
    width: auto;
    max-width: 168px;
    object-fit: contain;
}
.admin-brand__mark {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: linear-gradient(145deg, #79d473 0%, #67C761 55%, #4fb849 100%);
    color: #0d1416;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(103, 199, 97, 0.28);
}
.admin-brand strong {
    display: block;
    font-size: 15px;
    letter-spacing: 0.01em;
}
.admin-brand__meta {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.admin-brand small {
    color: rgba(255, 255, 255, 0.5);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 11px;
}
.admin-nav {
    display: flex;
    flex-direction: column;
    gap: 14px;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
    padding: 2px 6px 8px 2px;
    /* Match sidebar so rounded active links don’t bleed body #f5f7f5 through corners */
    background: #0d1416;
    border-radius: 12px;
    scrollbar-width: thin;
    scrollbar-color: rgba(103, 199, 97, 0.55) transparent;
}
/* Modern thin scrollbar — kill default white Windows track */
.admin-nav::-webkit-scrollbar {
    width: 6px;
}
.admin-nav::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}
.admin-nav::-webkit-scrollbar-track {
    background: transparent;
    margin: 8px 0;
}
.admin-nav::-webkit-scrollbar-thumb {
    background: rgba(103, 199, 97, 0.35);
    border-radius: 999px;
    border: 1px solid transparent;
    background-clip: padding-box;
}
.admin-nav::-webkit-scrollbar-thumb:hover {
    background: rgba(103, 199, 97, 0.7);
}
.admin-nav::-webkit-scrollbar-corner {
    background: transparent;
}
.admin-nav__group {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.admin-nav__label {
    display: block;
    padding: 2px 12px 7px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.38);
}
.admin-nav__link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 11px;
    color: rgba(255, 255, 255, 0.72);
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 600;
    background: transparent;
    box-shadow: none;
    isolation: isolate;
    transform: translateZ(0);
    transition: background 0.15s ease, color 0.15s ease;
}
.admin-nav__link i {
    font-size: 17px;
    width: 1.1em;
    text-align: center;
    opacity: 0.9;
}
.admin-nav__link:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}
.admin-nav__link.is-active,
.admin-nav__link.is-active:hover,
.admin-nav__link.is-active:focus {
    background: #67C761;
    color: #0d1416;
    box-shadow: none;
    outline: none;
}
.admin-nav__link.is-active i {
    opacity: 1;
}
.admin-sidebar__foot {
    display: flex;
    flex-direction: column;
    gap: 3px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-top: 12px;
    flex: 0 0 auto;
}
.admin-sidebar__foot .admin-nav__link {
    color: rgba(255, 255, 255, 0.58);
}
.admin-sidebar__foot .admin-nav__link:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}
.admin-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.admin-topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 16px 28px;
    background: rgba(255, 255, 255, 0.82);
    border-bottom: 1px solid rgba(13, 20, 22, 0.08);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 8px 24px rgba(13, 20, 22, 0.04);
}
.admin-topbar__left {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.admin-topbar__titles {
    min-width: 0;
}
.admin-topbar__crumb {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.48);
}
.admin-topbar__crumb a {
    color: inherit;
    text-decoration: none;
}
.admin-topbar__crumb a:hover {
    color: #2f8f2a;
}
.admin-topbar__crumb i {
    font-size: 14px;
    opacity: 0.7;
}
.admin-topbar__crumb span {
    color: #1f6b1b;
}
.admin-topbar__title {
    margin: 0;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
}
.admin-topbar__right {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
}
.admin-topbar__actions {
    display: flex;
    align-items: center;
    gap: 8px;
}
.admin-topbar__icon-btn {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.04);
    border: 1px solid rgba(13, 20, 22, 0.08);
    color: #0d1416;
    text-decoration: none;
    font-size: 18px;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.admin-topbar__icon-btn:hover {
    background: rgba(103, 199, 97, 0.16);
    border-color: rgba(103, 199, 97, 0.35);
    color: #1f6b1b;
}
.admin-topbar__user {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 6px 12px 6px 6px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    box-shadow: 0 6px 16px rgba(13, 20, 22, 0.04);
}
.admin-topbar__avatar {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: linear-gradient(145deg, #79d473 0%, #67C761 55%, #4fb849 100%);
    color: #0d1416;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.02em;
    flex: 0 0 auto;
}
.admin-topbar__user-meta {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.25;
}
.admin-topbar__user-meta strong {
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}
.admin-topbar__user-meta small {
    display: block;
    font-size: 11px;
    font-weight: 550;
    color: rgba(13, 20, 22, 0.52);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}
.admin-content {
    padding: 20px 28px 28px;
    flex: 1 0 auto;
}
.admin-footer {
    margin-top: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 14px 28px;
    background: rgba(255, 255, 255, 0.78);
    border-top: 1px solid rgba(13, 20, 22, 0.08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: rgba(13, 20, 22, 0.55);
    font-size: 12.5px;
    font-weight: 600;
}
.admin-footer__left,
.admin-footer__right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.admin-footer__brand {
    color: #0d1416;
    font-weight: 800;
}
.admin-footer__dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #67C761;
    flex: 0 0 auto;
}
.admin-footer__right a {
    color: #2f8f2a;
    text-decoration: none;
    font-weight: 700;
}
.admin-footer__right a:hover {
    text-decoration: underline;
}
.admin-footer__right span {
    color: rgba(13, 20, 22, 0.45);
}
.admin-flash {
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
}
.admin-flash--ok {
    background: rgba(103, 199, 97, 0.18);
    color: #1f6b1b;
}
.admin-flash--error {
    background: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}

/* Dashboard — clean light */
.dash {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.dash-intro {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
}
.dash-intro__date {
    margin: 0 0 4px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.48);
}
.dash-intro__text {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.72);
}
.dash-intro__chips {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.dash-chip {
    position: relative;
    overflow: hidden;
    min-width: 150px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 8px 20px rgba(13, 20, 22, 0.03);
}
.dash-chip__glow {
    position: absolute;
    right: -18px;
    top: -22px;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(103, 199, 97, 0.28), transparent 70%);
    pointer-events: none;
}
.dash-chip__glyph {
    position: absolute;
    right: 10px;
    bottom: 8px;
    font-size: 28px;
    color: rgba(103, 199, 97, 0.18);
    pointer-events: none;
}
.dash-chip span:not(.dash-chip__glow) {
    position: relative;
    z-index: 1;
    display: block;
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.dash-chip strong {
    position: relative;
    z-index: 1;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #0d1416;
}
.dash-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.dash-kpi {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px 18px 12px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.035);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.dash-kpi:hover {
    border-color: rgba(103, 199, 97, 0.35);
    box-shadow: 0 14px 28px rgba(13, 20, 22, 0.05);
    transform: translateY(-1px);
}
.dash-kpi.is-alert {
    border-color: rgba(245, 158, 11, 0.35);
}
.dash-kpi__orb {
    position: absolute;
    right: -28px;
    top: -36px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(103, 199, 97, 0.22), transparent 68%);
    pointer-events: none;
}
.dash-kpi.is-alert .dash-kpi__orb {
    background: radial-gradient(circle, rgba(245, 158, 11, 0.22), transparent 68%);
}
.dash-kpi__watermark {
    position: absolute;
    right: 10px;
    top: 54px;
    font-size: 72px;
    line-height: 1;
    color: rgba(103, 199, 97, 0.08);
    pointer-events: none;
    transform: rotate(-8deg);
}
.dash-kpi.is-alert .dash-kpi__watermark {
    color: rgba(245, 158, 11, 0.1);
}
.dash-kpi__top,
.dash-kpi__value,
.dash-kpi__hint,
.dash-kpi__graphic {
    position: relative;
    z-index: 1;
}
.dash-kpi__top {
    display: flex;
    align-items: center;
    gap: 10px;
}
.dash-kpi__icon {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(103, 199, 97, 0.12);
    color: #2f8f2a;
    font-size: 17px;
}
.dash-kpi.is-alert .dash-kpi__icon {
    background: rgba(245, 158, 11, 0.12);
    color: #b45309;
}
.dash-kpi__label {
    font-size: 12px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.45);
}
.dash-kpi__value {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    color: #0d1416;
}
.dash-kpi__hint {
    font-size: 12.5px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.45);
}
.dash-kpi__graphic {
    margin-top: auto;
    padding: 8px 8px 6px;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(103, 199, 97, 0.08), rgba(103, 199, 97, 0.03));
    border: 1px solid rgba(103, 199, 97, 0.1);
    min-height: 48px;
}
.dash-kpi.is-alert .dash-kpi__graphic {
    background: linear-gradient(180deg, rgba(245, 158, 11, 0.1), rgba(245, 158, 11, 0.03));
    border-color: rgba(245, 158, 11, 0.14);
}
.dash-spark {
    display: block;
    width: 100%;
    height: 42px;
}
.dash-meter {
    position: relative;
    height: 10px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.06);
    overflow: hidden;
    margin-top: 8px;
}
.dash-meter__bar {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #79d473, #67C761);
    box-shadow: 0 0 12px rgba(103, 199, 97, 0.35);
}
.dash-meter__label {
    display: inline-block;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 750;
    color: rgba(13, 20, 22, 0.45);
}
.dash-rings {
    position: relative;
    height: 42px;
    margin-top: 0;
}
.dash-rings span {
    position: absolute;
    left: 8px;
    top: 50%;
    translate: 0 -50%;
    border: 2px solid rgba(103, 199, 97, 0.4);
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(103, 199, 97, 0.06);
}
.dash-rings span:nth-child(1) { width: 14px; height: 14px; }
.dash-rings span:nth-child(2) { width: 28px; height: 28px; opacity: 0.75; }
.dash-rings span:nth-child(3) { width: 42px; height: 42px; opacity: 0.45; }
.dash-kpi.is-alert .dash-rings span {
    border-color: rgba(245, 158, 11, 0.45);
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.06);
}
.dash-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(260px, 0.85fr);
    gap: 14px;
}
.dash-grid--tables {
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.9fr);
    align-items: start;
}
.dash-side {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.dash-card {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.035);
}
.dash-card__bloom {
    position: absolute;
    right: -40px;
    top: -50px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(103, 199, 97, 0.16), transparent 70%);
    pointer-events: none;
}
.dash-card__bloom--soft {
    background: radial-gradient(circle, rgba(107, 155, 255, 0.14), transparent 70%);
}
.dash-card__head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.dash-card__head h2 {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #0d1416;
}
.dash-card__head p {
    margin: 4px 0 0;
    font-size: 12.5px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.45);
}
.dash-legend {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 12px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.55);
}
.dash-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.dash-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}
.dash-dot--green { background: #67C761; }
.dash-dot--ink { background: rgba(13, 20, 22, 0.55); }
.dash-chart {
    position: relative;
    z-index: 1;
    width: 100%;
}
.dash-chart--lg { height: 300px; }
.dash-chart--sm { height: 180px; }
.dash-status-list {
    position: relative;
    z-index: 1;
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.dash-status-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.03);
    font-size: 13px;
    font-weight: 650;
}
.dash-status-list span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(13, 20, 22, 0.55);
}
.dash-swatch {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    flex: 0 0 auto;
}
.dash-status-list strong {
    color: #0d1416;
}
.dash-rank,
.dash-inbox {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.dash-rank li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(13, 20, 22, 0.05);
}
.dash-rank li:last-child,
.dash-inbox li:last-child {
    border-bottom: 0;
}
.dash-rank__n {
    width: 28px;
    height: 28px;
    border-radius: 9px;
    display: inline-grid;
    place-items: center;
    background: rgba(103, 199, 97, 0.14);
    color: #2f8f2a;
    font-size: 12px;
    font-weight: 800;
    flex: 0 0 auto;
}
.dash-rank__body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.dash-rank__body strong {
    font-size: 13.5px;
    font-weight: 750;
}
.dash-rank__body small,
.dash-inbox small {
    font-size: 12px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.45);
}
.dash-inbox a {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(13, 20, 22, 0.05);
    text-decoration: none;
    color: inherit;
}
.dash-inbox a:hover strong {
    color: #2f8f2a;
}
.dash-inbox strong {
    font-size: 13.5px;
    font-weight: 750;
}
.dash-inbox span {
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.68);
}

/* Legacy stats (compat) */
.admin-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}
.admin-stat {
    display: block;
    padding: 16px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    text-decoration: none;
    color: inherit;
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.035);
}
.admin-stat--warn {
    border-color: rgba(217, 119, 6, 0.35);
}
.admin-stat__label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.55);
    margin-bottom: 8px;
}
.admin-stat__value {
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
}
.admin-panel {
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.035);
    margin-bottom: 16px;
}
.admin-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.admin-panel__head h2 {
    margin: 0;
    font-size: 16px;
    letter-spacing: -0.02em;
}
.admin-panel__head-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}
.admin-panel__head-actions form {
    margin: 0;
}
.admin-table-wrap {
    overflow-x: auto;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.06);
    background: #fff;
}
.admin-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13.5px;
}
.admin-table th,
.admin-table td {
    text-align: left;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(13, 20, 22, 0.05);
    vertical-align: middle;
}
.admin-table th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(13, 20, 22, 0.42);
    background: #f7f9f7;
    font-weight: 800;
}
.admin-table tbody tr:last-child td {
    border-bottom: 0;
}
.admin-table tbody tr:hover td {
    background: rgba(103, 199, 97, 0.05);
}
.admin-table td:first-child {
    border-left: 3px solid transparent;
}
.admin-table tbody tr:hover td:first-child {
    border-left-color: #67C761;
}
.admin-table__row-link {
    cursor: pointer;
}
.admin-table__row-link:focus {
    outline: none;
}
.admin-table__row-link:focus-visible td {
    background: rgba(103, 199, 97, 0.08);
}
.admin-table__row-link:focus-visible td:first-child {
    border-left-color: #67C761;
}
.admin-table__empty {
    text-align: center !important;
    color: rgba(13, 20, 22, 0.5);
    padding: 32px 8px !important;
    background: transparent !important;
}
.admin-table__code,
.admin-table code {
    display: inline-flex;
    align-items: center;
    padding: 3px 7px;
    border-radius: 7px;
    background: rgba(13, 20, 22, 0.045);
    font-size: 12px;
    font-weight: 700;
    color: #0d1416;
}
.admin-table__money,
.admin-table__metric {
    font-weight: 800;
    letter-spacing: -0.01em;
}
.admin-table__entity {
    display: flex;
    align-items: center;
    gap: 10px;
}
.admin-table__rank {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: rgba(103, 199, 97, 0.14);
    color: #2f8f2a;
    font-size: 12px;
    font-weight: 800;
    flex: 0 0 auto;
}
.admin-muted {
    color: rgba(13, 20, 22, 0.55);
    font-size: 13px;
}
.admin-link {
    color: #2f8f2a;
    font-weight: 700;
    text-decoration: none;
}
.admin-link:hover {
    text-decoration: underline;
}
.admin-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    background: rgba(13, 20, 22, 0.06);
    text-transform: capitalize;
}
.admin-pill--confirmed,
.admin-pill.is-ok {
    background: rgba(103, 199, 97, 0.18);
    color: #1f6b1b;
}
.admin-pill--cancelled,
.admin-pill.is-bad {
    background: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}
.admin-pill--completed {
    background: rgba(37, 99, 235, 0.12);
    color: #1d4ed8;
}
.admin-pill--pending,
.admin-pill.is-warn {
    background: rgba(217, 119, 6, 0.14);
    color: #b45309;
}
.admin-pill--started {
    background: rgba(14, 165, 233, 0.14);
    color: #0369a1;
}
.admin-filters {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 16px;
    padding: 16px;
    background: rgba(255, 255, 255, 0.94);
    border-radius: 18px;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 10px 28px rgba(13, 20, 22, 0.04);
}
.admin-filters__field label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 6px;
    color: rgba(13, 20, 22, 0.6);
}
.admin-filters__field input,
.admin-filters__field select,
.admin-form input,
.admin-form select,
.admin-form textarea {
    width: 100%;
    border: 1px solid rgba(13, 20, 22, 0.14);
    border-radius: 11px;
    padding: 10px 12px;
    font: inherit;
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.admin-form input[type="checkbox"],
.admin-form input[type="radio"],
.admin-filters__field input[type="checkbox"],
.admin-filters__field input[type="radio"] {
    width: auto;
    min-width: 0;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    accent-color: #67C761;
    vertical-align: middle;
}
.admin-form input[type="file"] {
    padding: 8px 10px;
}
.admin-filters__field input:focus,
.admin-filters__field select:focus,
.admin-form input:focus,
.admin-form select:focus,
.admin-form textarea:focus {
    outline: none;
    border-color: rgba(103, 199, 97, 0.7);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.18);
}
.admin-form input[type="checkbox"]:focus,
.admin-form input[type="radio"]:focus {
    border-color: transparent;
    box-shadow: none;
}
.admin-filters__actions {
    display: flex;
    gap: 8px;
}
.admin-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 12px;
    padding: 10px 14px;
    min-height: 40px;
    background: linear-gradient(145deg, #79d473 0%, #67C761 55%, #58b853 100%);
    color: #0d1416;
    font-weight: 750;
    font-size: 13.5px;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(103, 199, 97, 0.22);
    transition: filter 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
}
.admin-btn i {
    font-size: 16px;
    line-height: 1;
}
.admin-btn span {
    line-height: 1.1;
}
.admin-btn:hover {
    filter: brightness(1.03);
    text-decoration: none;
    color: #0d1416;
}
.admin-btn:active {
    transform: translateY(1px);
}
.admin-btn:disabled,
.admin-btn.is-disabled {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
    filter: none;
}
.admin-btn--ghost {
    background: #fff;
    border-color: rgba(13, 20, 22, 0.12);
    color: #0d1416;
    box-shadow: none;
}
.admin-btn--ghost:hover {
    background: rgba(103, 199, 97, 0.1);
    border-color: rgba(103, 199, 97, 0.35);
    color: #1f6b1b;
    filter: none;
}
.admin-btn--soft {
    background: rgba(13, 20, 22, 0.045);
    border-color: rgba(13, 20, 22, 0.08);
    color: #0d1416;
    box-shadow: none;
}
.admin-btn--soft:hover {
    background: rgba(103, 199, 97, 0.14);
    border-color: rgba(103, 199, 97, 0.3);
    color: #1f6b1b;
    filter: none;
}
.admin-btn--ok {
    background: linear-gradient(145deg, #79d473 0%, #67C761 55%, #58b853 100%);
    color: #0d1416;
}
.admin-btn--danger {
    background: linear-gradient(145deg, #ef4444 0%, #dc2626 55%, #b91c1c 100%);
    color: #fff;
    box-shadow: 0 8px 18px rgba(220, 38, 38, 0.22);
}
.admin-btn--danger:hover {
    color: #fff;
}
.admin-btn--sm {
    min-height: 34px;
    padding: 7px 11px;
    border-radius: 10px;
    font-size: 12.5px;
    gap: 6px;
    box-shadow: none;
}
.admin-btn--sm i {
    font-size: 14px;
}
.admin-btn--icon {
    width: 36px;
    min-height: 36px;
    padding: 0;
    border-radius: 10px;
}
.admin-btn--icon span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.admin-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
.admin-actions form {
    display: inline;
    margin: 0;
}
.admin-filters__actions .admin-btn,
.admin-panel__head .admin-btn,
.admin-form > .admin-btn,
.admin-pay-card__actions .admin-btn {
    min-width: auto;
}
.admin-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.admin-panel--wide {
    grid-column: 1 / -1;
}

/* Rental inclusions admin */
.inc-page {
    display: grid;
    gap: 16px;
}
.inc-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(220px, 0.8fr);
    gap: 16px;
    align-items: stretch;
    padding: 20px 22px;
    border-radius: 20px;
    border: 1px solid rgba(103, 199, 97, 0.28);
    background:
        radial-gradient(circle at 100% 0%, rgba(103, 199, 97, 0.18), transparent 46%),
        linear-gradient(145deg, #f7fff6 0%, #ffffff 55%, #f4faf3 100%);
    box-shadow: 0 12px 28px rgba(13, 20, 22, 0.04);
}
.inc-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #3f9e3a;
}
.inc-hero__copy h2 {
    margin: 0 0 6px;
    font-size: 24px;
    letter-spacing: -0.03em;
    color: #0d1416;
}
.inc-hero__copy p {
    margin: 0;
    max-width: 46ch;
    font-size: 14px;
    line-height: 1.5;
    color: rgba(13, 20, 22, 0.62);
}
.inc-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.inc-stat {
    display: grid;
    place-content: center;
    gap: 4px;
    padding: 14px 10px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(13, 20, 22, 0.06);
    text-align: center;
}
.inc-stat small {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.5);
}
.inc-stat strong {
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    color: #0d1416;
}
.inc-layout {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.3fr);
    gap: 16px;
    align-items: start;
}
.inc-editor {
    position: sticky;
    top: 96px;
}
.inc-editor.is-editing {
    border-color: rgba(103, 199, 97, 0.45);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.12), 0 10px 24px rgba(13, 20, 22, 0.035);
}
.inc-editor .admin-panel__head h2,
.inc-list-panel .admin-panel__head h2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.inc-editor .admin-panel__head h2 i,
.inc-list-panel .admin-panel__head h2 i {
    color: #3f9e3a;
}
.inc-editor__lead {
    margin: -4px 0 14px;
    font-size: 13px;
    line-height: 1.45;
    color: rgba(13, 20, 22, 0.58);
}
.inc-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 4px;
}
.inc-form__hint {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: rgba(13, 20, 22, 0.5);
}
.inc-form__switch-label {
    display: block;
    margin: 10px 0 6px;
    font-size: 13px;
    font-weight: 700;
}
.inc-status {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 4px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.04);
    border: 1px solid rgba(13, 20, 22, 0.06);
}
.inc-status__opt {
    position: relative;
    margin: 0 !important;
    cursor: pointer;
}
.admin-form .inc-status__opt input[type="radio"],
.inc-form .inc-status__opt input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0 !important;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    opacity: 0;
    appearance: none;
    box-shadow: none !important;
    background: transparent !important;
}
.inc-status__opt span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.55);
    background: transparent;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.inc-status__opt span i {
    font-size: 1rem;
}
.inc-status__opt input:checked + span {
    background: #fff;
    color: #0d1416;
    box-shadow: 0 2px 8px rgba(13, 20, 22, 0.08);
}
.inc-status__opt input[value="1"]:checked + span {
    color: #2f7d2b;
}
.inc-status__opt input[value="1"]:checked + span i {
    color: #67C761;
}
.inc-status__opt input[value="0"]:checked + span {
    color: #9a3412;
}
.inc-status__opt:hover span {
    color: rgba(13, 20, 22, 0.78);
}
.inc-preview {
    margin-top: 14px;
    padding: 14px;
    border-radius: 14px;
    background: #f4f4f4;
    border: 1px solid rgba(13, 20, 22, 0.05);
}
.inc-preview__label {
    display: block;
    margin-bottom: 10px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.48);
}
.inc-preview__item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #0d1416;
}
.inc-preview__item i {
    color: #67C761;
    font-size: 1.25rem;
}
.inc-preview__item strong {
    font-weight: 700;
}
.inc-form__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}
.inc-count {
    display: inline-grid;
    place-items: center;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(103, 199, 97, 0.14);
    color: #2f7d2b;
    font-size: 12px;
    font-weight: 800;
}
.inc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}
.inc-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.inc-item:hover {
    border-color: rgba(103, 199, 97, 0.35);
    box-shadow: 0 8px 18px rgba(13, 20, 22, 0.04);
}
.inc-item.is-current {
    border-color: rgba(103, 199, 97, 0.55);
    background: rgba(103, 199, 97, 0.06);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.12);
}
.inc-item.is-off {
    opacity: 0.72;
}
.inc-item__main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}
.inc-item__icon {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: rgba(103, 199, 97, 0.14);
    color: #3f9e3a;
    flex: 0 0 auto;
}
.inc-item.is-off .inc-item__icon {
    background: rgba(13, 20, 22, 0.06);
    color: rgba(13, 20, 22, 0.4);
}
.inc-item__copy {
    min-width: 0;
}
.inc-item__copy strong {
    display: block;
    font-size: 14px;
    letter-spacing: -0.01em;
    color: #0d1416;
}
.inc-item__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}
.inc-chip {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.05);
    color: rgba(13, 20, 22, 0.62);
    font-size: 11px;
    font-weight: 700;
}
.inc-chip.is-used {
    background: rgba(103, 199, 97, 0.14);
    color: #2f7d2b;
}
.inc-item__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}
.inc-item__actions form {
    margin: 0;
}
.inc-empty {
    display: grid;
    justify-items: center;
    gap: 6px;
    padding: 36px 18px;
    text-align: center;
    border-radius: 14px;
    border: 1px dashed rgba(13, 20, 22, 0.14);
    background: rgba(13, 20, 22, 0.02);
}
.inc-empty__icon {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: 4px;
    border-radius: 14px;
    background: rgba(103, 199, 97, 0.14);
    color: #3f9e3a;
    font-size: 1.4rem;
}
.inc-empty strong {
    font-size: 15px;
    color: #0d1416;
}
.inc-empty p {
    margin: 0;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.55);
}
@media (max-width: 980px) {
    .inc-hero,
    .inc-layout,
    .inc-form__row {
        grid-template-columns: 1fr;
    }
    .inc-editor {
        position: static;
    }
    .inc-item {
        grid-template-columns: 1fr;
    }
    .inc-item__actions {
        justify-content: flex-start;
    }
}

/* Shared CMS admin pages */
.cms-page {
    display: grid;
    gap: 16px;
}
.cms-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(220px, 0.8fr);
    gap: 16px;
    align-items: stretch;
    padding: 20px 22px;
    border-radius: 20px;
    border: 1px solid rgba(103, 199, 97, 0.28);
    background:
        radial-gradient(circle at 100% 0%, rgba(103, 199, 97, 0.18), transparent 46%),
        linear-gradient(145deg, #f7fff6 0%, #ffffff 55%, #f4faf3 100%);
    box-shadow: 0 12px 28px rgba(13, 20, 22, 0.04);
}
.cms-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #3f9e3a;
}
.cms-hero__copy h2 {
    margin: 0 0 6px;
    font-size: 24px;
    letter-spacing: -0.03em;
    color: #0d1416;
}
.cms-hero__copy p {
    margin: 0;
    max-width: 52ch;
    font-size: 14px;
    line-height: 1.5;
    color: rgba(13, 20, 22, 0.62);
}
.cms-hero__stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(84px, 1fr));
    gap: 10px;
}
.cms-stat {
    display: grid;
    place-content: center;
    gap: 4px;
    padding: 14px 10px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(13, 20, 22, 0.06);
    text-align: center;
}
.cms-stat small {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.5);
}
.cms-stat strong {
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    color: #0d1416;
}
.cms-layout {
    display: grid;
    grid-template-columns: minmax(280px, 0.95fr) minmax(0, 1.25fr);
    gap: 16px;
    align-items: start;
}
.cms-layout--stack {
    grid-template-columns: 1fr;
}
.cms-editor {
    position: sticky;
    top: 96px;
}
.cms-editor.is-editing {
    border-color: rgba(103, 199, 97, 0.45);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.12), 0 10px 24px rgba(13, 20, 22, 0.035);
}
.cms-editor .admin-panel__head h2,
.cms-list-panel .admin-panel__head h2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.cms-editor .admin-panel__head h2 i,
.cms-list-panel .admin-panel__head h2 i {
    color: #3f9e3a;
}
.cms-editor__lead {
    margin: -4px 0 14px;
    font-size: 13px;
    line-height: 1.45;
    color: rgba(13, 20, 22, 0.58);
}
.cms-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.cms-form-hint {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: rgba(13, 20, 22, 0.5);
}
.cms-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}
.cms-count {
    display: inline-grid;
    place-items: center;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(103, 199, 97, 0.14);
    color: #2f7d2b;
    font-size: 12px;
    font-weight: 800;
}
.cms-choice {
    margin-top: 4px;
}
.cms-choice__label {
    display: block;
    margin: 10px 0 6px;
    font-size: 13px;
    font-weight: 700;
}
.cms-choice__group {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 4px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.04);
    border: 1px solid rgba(13, 20, 22, 0.06);
}
.cms-choice__opt {
    position: relative;
    display: block !important;
    margin: 0 !important;
    cursor: pointer;
}
.admin-form .cms-choice__opt input[type="radio"] {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    opacity: 0;
    appearance: none;
    box-shadow: none !important;
    background: transparent !important;
}
.cms-choice__opt span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.55);
    background: transparent;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.cms-choice__opt span i {
    font-size: 1rem;
}
.cms-choice__opt input:checked + span {
    background: #fff;
    color: #0d1416;
    box-shadow: 0 2px 8px rgba(13, 20, 22, 0.08);
}
.cms-choice__opt input[value="1"]:checked + span,
.cms-choice__opt input[value="yes"]:checked + span {
    color: #2f7d2b;
}
.cms-choice__opt input[value="1"]:checked + span i,
.cms-choice__opt input[value="yes"]:checked + span i {
    color: #67C761;
}
.cms-choice__opt input[value="0"]:checked + span {
    color: #9a3412;
}
.cms-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}
.cms-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.cms-item:hover {
    border-color: rgba(103, 199, 97, 0.35);
    box-shadow: 0 8px 18px rgba(13, 20, 22, 0.04);
}
.cms-item.is-current {
    border-color: rgba(103, 199, 97, 0.55);
    background: rgba(103, 199, 97, 0.06);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.12);
}
.cms-item.is-off {
    opacity: 0.72;
}
.cms-item__main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}
.cms-item__icon {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: rgba(103, 199, 97, 0.14);
    color: #3f9e3a;
    flex: 0 0 auto;
    overflow: hidden;
}
.cms-item__icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cms-item.is-off .cms-item__icon {
    background: rgba(13, 20, 22, 0.06);
    color: rgba(13, 20, 22, 0.4);
}
.cms-item__copy {
    min-width: 0;
}
.cms-item__copy strong {
    display: block;
    font-size: 14px;
    letter-spacing: -0.01em;
    color: #0d1416;
}
.cms-item__copy p,
.cms-item__sub {
    margin: 4px 0 0;
    font-size: 12.5px;
    line-height: 1.45;
    color: rgba(13, 20, 22, 0.55);
}
.cms-item__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}
.cms-chip {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.05);
    color: rgba(13, 20, 22, 0.62);
    font-size: 11px;
    font-weight: 700;
}
.cms-item__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}
.cms-item__actions form {
    margin: 0;
}
.cms-empty {
    display: grid;
    justify-items: center;
    gap: 6px;
    padding: 36px 18px;
    text-align: center;
    border-radius: 14px;
    border: 1px dashed rgba(13, 20, 22, 0.14);
    background: rgba(13, 20, 22, 0.02);
}
.cms-empty__icon {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: 4px;
    border-radius: 14px;
    background: rgba(103, 199, 97, 0.14);
    color: #3f9e3a;
    font-size: 1.4rem;
}
.cms-empty strong {
    font-size: 15px;
    color: #0d1416;
}
.cms-empty p {
    margin: 0;
    font-size: 13px;
    color: rgba(13, 20, 22, 0.55);
}
.cms-setting-card {
    padding: 14px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: #fff;
    margin-bottom: 10px;
}
.cms-setting-card:last-of-type {
    margin-bottom: 0;
}
.cms-setting-card label {
    margin-top: 0;
}
.cms-setting-card__key {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12.5px;
    font-weight: 700;
    color: #2f7d2b;
}
.cms-thumb {
    display: block;
    width: 100%;
    max-width: 240px;
    border-radius: 12px;
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.cms-thumb--round {
    width: 64px;
    height: 64px;
    max-width: 64px;
    object-fit: cover;
    border-radius: 50%;
}
.cms-blog-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
    gap: 16px;
    align-items: start;
}
.cms-para-block {
    margin-bottom: 12px;
    padding: 12px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.03);
    border: 1px solid rgba(13, 20, 22, 0.06);
}
.cms-user-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
}
.cms-user-avatar {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(103, 199, 97, 0.16);
    color: #2f7d2b;
    font-size: 13px;
    font-weight: 800;
}
.cms-hero-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.cms-hero-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: #fff;
    color: rgba(13, 20, 22, 0.72);
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
}
.cms-hero-tab:hover {
    border-color: rgba(103, 199, 97, 0.45);
    color: #0d1416;
}
.cms-hero-tab.is-active {
    background: rgba(103, 199, 97, 0.16);
    border-color: rgba(103, 199, 97, 0.45);
    color: #2f7d2b;
}
.cms-hero-tab i {
    font-size: 1rem;
}

@media (max-width: 980px) {
    .cms-hero,
    .cms-layout,
    .cms-form-row,
    .cms-blog-grid,
    .cms-user-card {
        grid-template-columns: 1fr;
    }
    .cms-editor {
        position: static;
    }
    .cms-item {
        grid-template-columns: 1fr;
    }
    .cms-item__actions {
        justify-content: flex-start;
    }
}
.admin-dl {
    margin: 0;
    display: grid;
    gap: 10px;
}
.admin-dl > div {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 8px;
}
.admin-dl dt {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.5);
    text-transform: uppercase;
}
.admin-dl dd {
    margin: 0;
    font-weight: 600;
}
.admin-form label {
    display: block;
    margin: 10px 0 6px;
    font-size: 13px;
    font-weight: 700;
}
.admin-form label.cms-check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    margin: 4px 0 14px;
}
.admin-form label.cms-check input {
    width: 18px;
    height: 18px;
    margin: 0;
}
.admin-form button {
    margin-top: 14px;
}
.admin-pay-card {
    padding: 14px 0;
    border-top: 1px solid rgba(13, 20, 22, 0.06);
}
.admin-pay-card:first-of-type {
    border-top: 0;
    padding-top: 0;
}
.admin-pay-card__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}
.admin-pay-card__top strong {
    font-size: 18px;
    letter-spacing: -0.02em;
}
.admin-pay-card__meta {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.45;
}
.admin-pay-card__hint {
    margin: 0 0 12px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.035);
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.62);
    line-height: 1.45;
}
.admin-pay-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Booking detail ops console */
#bk-trip,
#bk-customer,
#bk-payments,
[id^="bk-payment-"] {
    scroll-margin-top: 88px;
}
.bk-hero {
    display: grid;
    grid-template-columns: 148px minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
    margin: 0 0 16px;
    padding: 16px;
    border-radius: 22px;
    border: 1px solid rgba(13, 20, 22, 0.07);
    background:
        radial-gradient(ellipse 60% 80% at 100% 0%, rgba(103, 199, 97, 0.16), transparent 55%),
        linear-gradient(180deg, #ffffff 0%, #f7faf7 100%);
    box-shadow: 0 14px 32px rgba(13, 20, 22, 0.045);
    overflow: hidden;
}
.bk-hero__media {
    border-radius: 16px;
    overflow: hidden;
    background: rgba(13, 20, 22, 0.04);
    min-height: 120px;
    display: grid;
    place-items: center;
}
.bk-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.bk-hero__fallback {
    width: 100%;
    height: 100%;
    min-height: 120px;
    display: grid;
    place-items: center;
    color: #2f8f2a;
    font-size: 42px;
    background: rgba(103, 199, 97, 0.12);
}
.bk-hero__body {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    min-width: 0;
}
.bk-hero__eyebrow {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.bk-hero__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.bk-hero__title-row h1 {
    margin: 0;
    font-size: 24px;
    letter-spacing: -0.03em;
}
.bk-hero__title-row code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 22px;
    font-weight: 800;
    background: rgba(13, 20, 22, 0.05);
    padding: 4px 10px;
    border-radius: 10px;
}
.bk-hero__sub {
    margin: 0 0 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    color: rgba(13, 20, 22, 0.62);
    font-size: 14px;
    font-weight: 600;
}
.bk-hero__sub strong {
    color: #0d1416;
}
.bk-hero__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}
.bk-hero__meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.045);
    font-size: 12px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.7);
}
.bk-hero__total {
    flex: 0 0 auto;
    min-width: 150px;
    padding: 14px 16px;
    border-radius: 16px;
    background: #0d1416;
    color: #fff;
    text-align: right;
}
.bk-hero__total span {
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
    margin-bottom: 4px;
}
.bk-hero__total strong {
    display: block;
    font-size: 26px;
    letter-spacing: -0.03em;
    line-height: 1.1;
}
.bk-hero__total > small {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 650;
    color: rgba(103, 199, 97, 0.95);
}
.bk-trip-timer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(103, 199, 97, 0.14);
    border: 1px solid rgba(103, 199, 97, 0.28);
    text-align: left;
}
.bk-trip-timer.is-overdue {
    background: rgba(248, 113, 113, 0.16);
    border-color: rgba(248, 113, 113, 0.4);
}
.bk-trip-timer.is-stopped {
    background: rgba(96, 165, 250, 0.14);
    border-color: rgba(96, 165, 250, 0.35);
}
.bk-trip-timer__clock {
    position: relative;
    display: block;
    width: 42px;
    height: 42px;
    min-width: 42px;
    min-height: 42px;
    max-width: 42px;
    max-height: 42px;
    aspect-ratio: 1 / 1;
    flex: 0 0 42px;
    align-self: center;
    box-sizing: border-box;
    border-radius: 50%;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 50%, #fff 0 46%, transparent 47%),
        conic-gradient(from 0deg, #67C761, #2f8f2a, #67C761);
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.65), 0 6px 14px rgba(0, 0, 0, 0.25);
}
.bk-trip-timer__clock::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    pointer-events: none;
    animation: bk-trip-clock-pulse 1.2s ease-in-out infinite;
    box-shadow: 0 0 0 0 rgba(103, 199, 97, 0.35);
}
.bk-trip-timer.is-overdue .bk-trip-timer__clock {
    background:
        radial-gradient(circle at 50% 50%, #fff 0 46%, transparent 47%),
        conic-gradient(from 0deg, #f87171, #b91c1c, #f87171);
}
.bk-trip-timer__face {
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(13, 20, 22, 0.08);
}
.bk-trip-timer__hand {
    position: absolute;
    left: 50%;
    bottom: 50%;
    width: 2px;
    background: #0d1416;
    transform-origin: bottom center;
    border-radius: 999px;
}
.bk-trip-timer__hand--hour {
    height: 10px;
    margin-left: -1px;
    animation: bk-trip-hand-hour 60s linear infinite;
}
.bk-trip-timer__hand--minute {
    height: 14px;
    width: 1.5px;
    margin-left: -0.75px;
    background: #1f6b1b;
    animation: bk-trip-hand-minute 2s linear infinite;
}
.bk-trip-timer.is-overdue .bk-trip-timer__hand--minute {
    background: #b91c1c;
}
.bk-trip-timer.is-stopped .bk-trip-timer__clock::after,
.bk-trip-timer.is-stopped .bk-trip-timer__hand--hour,
.bk-trip-timer.is-stopped .bk-trip-timer__hand--minute {
    animation-play-state: paused;
}
.bk-trip-timer__copy {
    min-width: 0;
}
.bk-trip-timer__copy small {
    display: block;
    margin: 0;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.85);
}
.bk-trip-timer__copy strong {
    display: block;
    margin-top: 2px;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #9ef29a;
    font-variant-numeric: tabular-nums;
}
.bk-trip-timer.is-overdue .bk-trip-timer__copy strong {
    color: #fecaca;
}
.bk-trip-timer.is-stopped .bk-trip-timer__copy strong {
    color: #bfdbfe;
}
.bk-trip-timer__copy em {
    display: block;
    margin-top: 2px;
    font-style: normal;
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.55);
}
.bk-trip-timer.is-overdue .bk-trip-timer__copy em {
    color: #fecaca;
}
@keyframes bk-trip-hand-minute {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes bk-trip-hand-hour {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes bk-trip-clock-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(103, 199, 97, 0.0); opacity: 1; }
    50% { box-shadow: 0 0 0 4px rgba(103, 199, 97, 0.22); opacity: 1; }
}

.admin-trip-notices {
    display: grid;
    gap: 8px;
    margin: 0 0 14px;
}
.admin-trip-notice .bk-trip-timer__clock {
    width: 42px;
    height: 42px;
    min-width: 42px;
    min-height: 42px;
    max-width: 42px;
    max-height: 42px;
    justify-self: center;
}
.admin-trip-notice {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 14px;
    text-decoration: none;
    color: inherit;
    background: rgba(103, 199, 97, 0.1);
    border: 1px solid rgba(103, 199, 97, 0.22);
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.admin-trip-notice:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(13, 20, 22, 0.08);
    text-decoration: none;
    color: inherit;
}
.admin-trip-notice.is-overdue {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.28);
}
.admin-trip-notice__copy strong {
    display: block;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -0.01em;
}
.admin-trip-notice.is-overdue .admin-trip-notice__copy strong {
    color: #b91c1c;
}
.admin-trip-notice__copy small {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
}
.admin-trip-notice__timer {
    text-align: right;
    min-width: 92px;
}
.admin-trip-notice__timer strong {
    display: block;
    font-size: 16px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #1f6b1b;
}
.admin-trip-notice__timer.is-overdue strong,
.admin-trip-notice.is-overdue .admin-trip-notice__timer strong {
    color: #b91c1c;
}
.admin-trip-notice__timer em {
    display: block;
    margin-top: 2px;
    font-style: normal;
    font-size: 11px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.5);
}
.admin-trip-notice.is-overdue .admin-trip-notice__timer em {
    color: #b91c1c;
}
.admin-trip-notice__chevron {
    font-size: 20px;
    color: rgba(13, 20, 22, 0.35);
}
@media (max-width: 720px) {
    .admin-trip-notice {
        grid-template-columns: 42px minmax(0, 1fr);
    }
    .admin-trip-notice__timer {
        grid-column: 2;
        text-align: left;
    }
    .admin-trip-notice__chevron {
        display: none;
    }
}

.bk-chips {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}
.bk-chip {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 13px;
    border-radius: 16px;
    border: 1px solid rgba(13, 20, 22, 0.07);
    background: #fff;
    box-shadow: 0 8px 20px rgba(13, 20, 22, 0.03);
}
.bk-chip__icon {
    width: 34px;
    height: 34px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    background: rgba(103, 199, 97, 0.14);
    color: #2f8f2a;
    font-size: 17px;
    flex: 0 0 auto;
}
.bk-chip small {
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
    margin-bottom: 2px;
}
.bk-chip strong {
    display: block;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: -0.01em;
    line-height: 1.3;
}

.bk-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 16px;
    align-items: start;
}
.bk-main,
.bk-side {
    min-width: 0;
}
.bk-side {
    position: relative;
    z-index: 2;
}
.bk-panel--sticky {
    position: sticky;
    top: 96px;
    z-index: 30;
    background: #fff;
    /* Do not use isolation:isolate — it traps the status dropdown under following panels. */
    overflow: visible;
}
.bk-panel--sticky:has(.bk-status-dd.is-open) {
    z-index: 80;
}
.bk-side .bk-panel:not(.bk-panel--sticky) {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.bk-side .bk-panel:not(.bk-panel--sticky) .bk-trip-photos,
.bk-side .bk-panel:not(.bk-panel--sticky) img {
    position: relative;
    z-index: 0;
}
.bk-side__lead {
    margin: -4px 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.45;
}
.bk-start-trip-note {
    margin: 8px 0 4px;
    font-size: 12px;
    font-weight: 600;
    color: #b45309;
    line-height: 1.45;
}
.bk-cancel-reason {
    margin-top: 2px;
}
.bk-status-dd {
    position: relative;
    z-index: 40;
}
.bk-status-dd.is-open {
    z-index: 90;
}
.bk-status-dd.is-open .bk-status-dd__list {
    z-index: 91;
}
.bk-status-dd__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid rgba(13, 20, 22, 0.14);
    border-radius: 11px;
    background: #fff;
    color: #0d1416;
    font: inherit;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.bk-status-dd__btn:hover {
    border-color: rgba(103, 199, 97, 0.55);
}
.bk-status-dd.is-open .bk-status-dd__btn,
.bk-status-dd__btn:focus-visible {
    outline: none;
    border-color: rgba(103, 199, 97, 0.7);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.18);
}
.bk-status-dd__btn i {
    font-size: 1.15rem;
    color: rgba(13, 20, 22, 0.45);
    transition: transform 0.18s ease;
}
.bk-status-dd.is-open .bk-status-dd__btn i {
    transform: rotate(180deg);
}
.bk-status-dd__list {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 6px);
    margin: 0;
    padding: 6px;
    list-style: none;
    border: 1px solid rgba(13, 20, 22, 0.12);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(13, 20, 22, 0.12);
    max-height: 280px;
    overflow: auto;
}
.bk-status-dd__option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 600;
    color: #0d1416;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
}
.bk-status-dd__option:hover {
    background: rgba(103, 199, 97, 0.12);
}
.bk-status-dd__option.is-selected {
    background: rgba(103, 199, 97, 0.18);
    color: #0d1416;
}
.bk-status-dd__option.is-selected i {
    color: #3f9e3a;
}
.bk-status-dd__option.is-locked {
    color: rgba(13, 20, 22, 0.42);
    cursor: pointer;
}
.bk-status-dd__option.is-locked:hover {
    background: rgba(180, 83, 9, 0.08);
    color: #9a3412;
}
.bk-status-dd__option.is-locked i {
    color: rgba(180, 83, 9, 0.85);
}
.bk-count {
    display: inline-grid;
    place-items: center;
    min-width: 26px;
    height: 26px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.05);
    font-size: 12px;
    font-weight: 800;
}

.bk-trip {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
    padding: 14px;
    border-radius: 14px;
    background: rgba(103, 199, 97, 0.08);
}
.bk-trip__rail {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 0;
}
.bk-trip__rail span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #67C761;
    box-shadow: 0 0 0 4px rgba(103, 199, 97, 0.2);
}
.bk-trip__rail i {
    flex: 1;
    width: 2px;
    margin: 6px 0;
    background: linear-gradient(180deg, #67C761, rgba(103, 199, 97, 0.25));
}
.bk-trip__points {
    display: grid;
    gap: 14px;
}
.bk-trip__points small {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.45);
    margin-bottom: 2px;
}
.bk-trip__points strong {
    display: block;
    font-size: 15px;
    letter-spacing: -0.01em;
}
.bk-trip__points p {
    margin: 3px 0 0;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
}

.bk-kv {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.bk-kv > div {
    padding: 11px 12px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.03);
    border: 1px solid rgba(13, 20, 22, 0.04);
}
.bk-kv__wide {
    grid-column: 1 / -1;
}
.bk-kv small {
    display: block;
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.bk-kv strong {
    display: block;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.35;
    word-break: break-word;
}
.bk-kv code {
    font-size: 12.5px;
    font-weight: 750;
}

.bk-customer {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.bk-customer__avatar {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #0d1416;
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.04em;
    flex: 0 0 auto;
}
.bk-customer__info {
    min-width: 0;
}
.bk-customer__info strong {
    display: block;
    font-size: 16px;
    letter-spacing: -0.02em;
    margin-bottom: 3px;
}
.bk-customer__info p {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
}
.bk-customer-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(220px, 0.9fr);
    gap: 16px;
    align-items: start;
}
.bk-customer-layout__info .bk-customer {
    margin-bottom: 12px;
}
.bk-customer-layout__docs {
    padding: 12px;
    border-radius: 14px;
    background: rgba(13, 20, 22, 0.03);
    border: 1px solid rgba(13, 20, 22, 0.05);
    min-height: 100%;
}
.bk-customer-docs__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.bk-customer-docs__head small {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.bk-customer-docs__head span {
    font-size: 12px;
    font-weight: 750;
    color: rgba(13, 20, 22, 0.5);
}
.bk-customer-docs__empty {
    margin: 0;
    font-size: 13px;
}
.bk-doc-previews {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}
.bk-doc-card {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 12px;
    min-width: 0;
    padding: 10px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    align-items: start;
}
.bk-doc-card.is-verified {
    border-color: rgba(103, 199, 97, 0.45);
    background: linear-gradient(180deg, rgba(103, 199, 97, 0.06), #fff 42%);
}
.bk-doc-card.is-rejected {
    border-color: rgba(220, 38, 38, 0.35);
    background: linear-gradient(180deg, rgba(220, 38, 38, 0.05), #fff 42%);
}
.bk-doc-card__media {
    position: relative;
    min-width: 0;
}
.bk-doc-card__media .bk-doc-status {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 2;
    box-shadow: 0 4px 10px rgba(13, 20, 22, 0.12);
}
.bk-doc-card .bk-doc-preview {
    position: relative;
    width: 100%;
    display: block;
    overflow: hidden;
    border-radius: 10px;
}
.bk-doc-card .bk-doc-preview img,
.bk-doc-card .bk-doc-preview__file {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    object-fit: cover;
    display: block;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.bk-doc-card__zoom {
    position: absolute;
    right: 6px;
    bottom: 6px;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    font-size: 14px;
    pointer-events: none;
}
.bk-doc-card__body {
    min-width: 0;
    display: grid;
    gap: 8px;
    align-content: start;
}
.bk-doc-card__title {
    margin: 0;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #0d1416;
}
.bk-doc-card__note {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    color: #b91c1c;
    line-height: 1.35;
}
.bk-doc-card__form {
    margin: 0;
    display: grid;
    gap: 8px;
}
.bk-doc-card__btns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}
.bk-doc-card__note-input {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 8px 10px;
    border-radius: 9px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    background: #fafbfa;
    font-size: 12px;
    font-weight: 600;
}
.bk-doc-card__note-input:focus {
    outline: none;
    border-color: rgba(103, 199, 97, 0.65);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.14);
    background: #fff;
}
.bk-doc-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0;
    padding: 8px 10px;
    border-radius: 9px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: rgba(13, 20, 22, 0.04);
    color: rgba(13, 20, 22, 0.75);
    font-size: 12px;
    font-weight: 750;
    cursor: pointer;
    white-space: nowrap;
}
.bk-doc-card__btn:hover {
    background: rgba(13, 20, 22, 0.07);
}
.bk-doc-card__btn--ok {
    background: rgba(103, 199, 97, 0.16);
    border-color: rgba(103, 199, 97, 0.35);
    color: #1f6b1b;
}
.bk-doc-card__btn--ok:hover {
    background: rgba(103, 199, 97, 0.24);
}
.bk-doc-card__btn--danger {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.22);
    color: #b91c1c;
}
.bk-doc-card__btn--danger:hover {
    background: rgba(220, 38, 38, 0.14);
}
.bk-doc-status {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.bk-doc-status--pending {
    background: rgba(245, 158, 11, 0.16);
    color: #b45309;
}
.bk-doc-status--verified {
    background: rgba(103, 199, 97, 0.2);
    color: #1f6b1b;
}
.bk-doc-status--rejected {
    background: rgba(220, 38, 38, 0.14);
    color: #b91c1c;
}
@media (max-width: 560px) {
    .bk-doc-card {
        grid-template-columns: 1fr;
    }
}
.bk-doc-preview {
    width: 100%;
}
.bk-doc-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.bk-doc-card__note {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    color: #b91c1c;
    line-height: 1.35;
}
.bk-doc-card__actions {
    display: grid;
    gap: 6px;
}
.bk-doc-card__form {
    margin: 0;
    display: grid;
    gap: 6px;
}
.bk-doc-card__form--reject {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}
.bk-doc-card__note-input {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    font-size: 11px;
    font-weight: 600;
}
.bk-doc-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0;
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: rgba(13, 20, 22, 0.04);
    color: rgba(13, 20, 22, 0.75);
    font-size: 11px;
    font-weight: 750;
    cursor: pointer;
    white-space: nowrap;
}
.bk-doc-card__btn:hover {
    background: rgba(13, 20, 22, 0.07);
}
.bk-doc-card__btn--ok {
    background: rgba(103, 199, 97, 0.16);
    border-color: rgba(103, 199, 97, 0.35);
    color: #1f6b1b;
}
.bk-doc-card__btn--ok:hover {
    background: rgba(103, 199, 97, 0.24);
}
.bk-doc-card__btn--danger {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.22);
    color: #b91c1c;
}
.bk-doc-card__btn--danger:hover {
    background: rgba(220, 38, 38, 0.14);
}
.bk-doc-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.bk-doc-status--pending {
    background: rgba(245, 158, 11, 0.14);
    color: #b45309;
}
.bk-doc-status--verified {
    background: rgba(103, 199, 97, 0.18);
    color: #1f6b1b;
}
.bk-doc-status--rejected {
    background: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}
.bk-doc-preview {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-decoration: none;
    color: inherit;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: zoom-in;
    font: inherit;
}
.bk-doc-preview img,
.bk-doc-preview__file {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    object-fit: cover;
    display: block;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.bk-doc-preview__file {
    display: grid;
    place-items: center;
    color: #dc2626;
    font-size: 26px;
    background: linear-gradient(180deg, #fff 0%, #f8faf8 100%);
    cursor: pointer;
}
.bk-doc-preview:hover img,
.bk-doc-preview:hover .bk-doc-preview__file {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(13, 20, 22, 0.1);
}
.bk-doc-preview__label {
    font-size: 11px;
    font-weight: 750;
    color: rgba(13, 20, 22, 0.62);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bk-doc-edit {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(13, 20, 22, 0.08);
}
.bk-doc-edit__title {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -0.01em;
}
.bk-doc-edit__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}
.bk-doc-edit__item {
    min-width: 0;
    display: grid;
    gap: 8px;
}
.bk-doc-edit__label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 24px;
    flex-wrap: wrap;
}
.bk-doc-edit__label {
    margin: 0;
    font-size: 12px;
    font-weight: 750;
    margin-right: auto;
}
.bk-doc-edit__remove {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 2px 8px;
    border: 0;
    border-radius: 999px;
    background: rgba(220, 38, 38, 0.1);
    color: #b91c1c;
    font-size: 11px;
    font-weight: 750;
    cursor: pointer;
}
.bk-doc-edit__remove[hidden] {
    display: none !important;
}
.bk-doc-edit__remove:hover {
    background: rgba(220, 38, 38, 0.16);
}
.bk-doc-edit__preview {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: rgba(13, 20, 22, 0.03);
}
.bk-doc-edit__preview.is-pending {
    border-color: rgba(103, 199, 97, 0.55);
    box-shadow: 0 0 0 2px rgba(103, 199, 97, 0.12);
}
.bk-doc-edit__thumb {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}
.bk-doc-edit__thumb[hidden] {
    display: none !important;
}
.bk-doc-edit__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.bk-doc-edit__thumb img[hidden] {
    display: none !important;
}
.bk-doc-edit__file,
.bk-doc-edit__empty {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    gap: 4px;
    text-decoration: none;
    color: rgba(13, 20, 22, 0.55);
    font-size: 12px;
    font-weight: 650;
}
.bk-doc-edit__file[hidden],
.bk-doc-edit__empty[hidden] {
    display: none !important;
}
.bk-doc-edit__file {
    color: #dc2626;
}
.bk-doc-edit__file i {
    font-size: 28px;
}
.bk-doc-edit__badge {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #67C761;
    color: #0d1416;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.bk-doc-edit__badge[hidden] {
    display: none !important;
}
.bk-doc-edit__pick {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 10px;
    border: 1px dashed rgba(13, 20, 22, 0.18);
    background: #fff;
    cursor: pointer;
    overflow: hidden;
}
.bk-doc-edit__pick:hover {
    border-color: rgba(103, 199, 97, 0.55);
    background: rgba(103, 199, 97, 0.06);
}
.bk-doc-edit__pick input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    font-size: 0;
}
.bk-doc-edit__pick span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: rgba(13, 20, 22, 0.72);
    pointer-events: none;
}
.bk-doc-edit__hint {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.45);
}
@media (max-width: 900px) {
    .bk-doc-edit__grid {
        grid-template-columns: 1fr;
    }
}

.bk-facts {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}
.bk-facts li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 10px 11px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.03);
}
.bk-facts i {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(103, 199, 97, 0.14);
    color: #2f8f2a;
    flex: 0 0 auto;
}
.bk-facts small {
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
    margin-bottom: 2px;
}
.bk-facts strong {
    display: block;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.35;
}

.bk-trip-photos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    position: relative;
    z-index: 0;
    overflow: hidden;
}
.bk-trip-photos__item {
    display: block;
    position: relative;
    z-index: 0;
    overflow: hidden;
    border-radius: 12px;
    aspect-ratio: 1;
    background: rgba(13, 20, 22, 0.05);
}
.bk-trip-photos__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.bk-trip-photos__item.is-checked {
    box-shadow: 0 0 0 2px #67C761;
}
.bk-trip-photos__check {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: #1f6b1b;
    color: #fff;
    display: inline-grid;
    place-items: center;
    font-size: 14px;
}
.bk-complete-section {
    margin: 0 0 16px;
    padding: 14px;
    border-radius: 14px;
    background: rgba(13, 20, 22, 0.03);
    border: 1px solid rgba(13, 20, 22, 0.06);
}
.bk-complete-section > strong,
.bk-complete-section__head strong {
    display: block;
    margin-bottom: 10px;
    font-size: 14px;
}
.bk-complete-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}
.bk-complete-section__head strong {
    margin: 0;
}
.bk-complete-checkall {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    margin: 0 !important;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}
.bk-complete-checkall input {
    width: auto !important;
    margin: 0 !important;
}
.bk-complete-empty {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.5);
}
.bk-complete-photos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
    max-height: 240px;
    overflow-y: auto;
}
.bk-complete-photo {
    position: relative;
    display: block;
    margin: 0;
    overflow: hidden;
    border-radius: 12px;
    aspect-ratio: 1;
    border: 2px solid transparent;
    background: rgba(13, 20, 22, 0.05);
}
.bk-complete-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.bk-complete-photo__check {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 2;
    margin: 0 !important;
    cursor: pointer;
}
.bk-complete-photo__input {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none;
    width: 0 !important;
    height: 0 !important;
}
.bk-complete-photo__mark {
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    color: transparent;
    font-size: 14px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    box-shadow: 0 4px 10px rgba(13, 20, 22, 0.12);
}
.bk-complete-photo__zoom {
    position: absolute;
    left: 6px;
    bottom: 6px;
    z-index: 2;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    font-size: 16px;
    box-shadow: 0 6px 14px rgba(13, 20, 22, 0.18);
}
.bk-complete-photo__zoom:hover {
    background: #1f6b1b;
}
.bk-complete-photo:has(.bk-complete-photo__input:checked) {
    border-color: #67C761;
}
.bk-complete-photo:has(.bk-complete-photo__input:checked) img {
    filter: brightness(0.92);
}
.bk-complete-photo__input:checked + .bk-complete-photo__mark {
    background: #1f6b1b;
    border-color: #1f6b1b;
    color: #fff;
}
.bk-photo-zoom {
    position: fixed;
    inset: 0;
    z-index: 1500;
    display: grid;
    place-items: center;
    padding: 16px;
}
.bk-photo-zoom[hidden] {
    display: none !important;
}
.bk-photo-zoom__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 12, 14, 0.78);
    backdrop-filter: blur(4px);
}
.bk-photo-zoom__panel {
    position: relative;
    z-index: 1;
    width: min(920px, 100%);
    max-height: min(92vh, 860px);
    display: flex;
    flex-direction: column;
    border-radius: 18px;
    overflow: hidden;
    background: #0d1416;
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.4);
}
.bk-photo-zoom__toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.06);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.bk-photo-zoom__btn {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    font-size: 20px;
}
.bk-photo-zoom__btn:hover {
    background: rgba(103, 199, 97, 0.35);
}
.bk-photo-zoom__btn--close {
    margin-left: 8px;
}
.bk-photo-zoom__level {
    min-width: 58px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    font-weight: 750;
}
.bk-photo-zoom__stage {
    flex: 1 1 auto;
    min-height: 280px;
    max-height: min(78vh, 720px);
    overflow: auto;
    display: grid;
    place-items: center;
    padding: 18px;
    cursor: grab;
}
.bk-photo-zoom__stage.is-zoomed {
    cursor: zoom-in;
}
.bk-photo-zoom__stage img {
    max-width: min(100%, 860px);
    max-height: min(70vh, 640px);
    object-fit: contain;
    transform-origin: center center;
    transition: transform 0.15s ease;
    user-select: none;
    -webkit-user-drag: none;
}
.bk-complete-field {
    margin-top: 8px;
}
.bk-complete-field label {
    display: block;
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 750;
    color: rgba(13, 20, 22, 0.55);
}
.bk-complete-field input,
.bk-complete-field textarea {
    width: 100%;
    margin: 0;
    box-sizing: border-box;
    border: 1px solid rgba(13, 20, 22, 0.16);
    border-radius: 11px;
    padding: 10px 12px;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    color: #0d1416;
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.bk-complete-field textarea {
    min-height: 84px;
    resize: vertical;
    line-height: 1.45;
}
.bk-complete-field input:focus,
.bk-complete-field textarea:focus {
    outline: none;
    border-color: rgba(103, 199, 97, 0.75);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.18);
}
.bk-complete-field input::placeholder,
.bk-complete-field textarea::placeholder {
    color: rgba(13, 20, 22, 0.4);
    font-weight: 550;
}
.bk-complete-extra {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 10px;
}
.bk-complete-qr-actions {
    margin-top: 10px;
}
.bk-complete-qr {
    margin-top: 12px;
    padding: 14px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.08);
    text-align: center;
}
.bk-complete-qr__amount span {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.45);
}
.bk-complete-qr__amount strong {
    display: block;
    margin-top: 2px;
    font-size: 28px;
    font-weight: 800;
    color: #1f6b1b;
}
.bk-complete-qr__note {
    margin: 6px 0 12px;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
}
.bk-complete-qr__box {
    position: relative;
    width: 220px;
    height: 220px;
    margin: 0 auto 12px;
}
.bk-complete-qr__box img:first-child {
    width: 220px;
    height: 220px;
    display: block;
    border-radius: 12px;
    background: #fff;
}
.bk-complete-qr__logo {
    position: absolute !important;
    left: 50%;
    top: 50%;
    width: 36px !important;
    height: 36px !important;
    translate: -50% -50%;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(13, 20, 22, 0.18);
    background: #fff;
}
.bk-complete-qr__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 750;
    color: #1f6b1b;
    text-decoration: none;
}
.bk-complete-qr__link:hover {
    text-decoration: underline;
}
@media (max-width: 640px) {
    .bk-complete-extra {
        grid-template-columns: 1fr;
    }
    .bk-complete-photos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.bk-start-trip__compose {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 8px 0 10px;
    max-height: min(48vh, 420px);
    overflow-y: auto;
}
.bk-trip-compose__card,
.bk-trip-compose__add {
    position: relative;
    aspect-ratio: 1;
    border-radius: 14px;
    overflow: hidden;
}
.bk-trip-compose__card {
    background: rgba(13, 20, 22, 0.05);
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.bk-trip-compose__card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.bk-trip-compose__card span {
    position: absolute;
    left: 8px;
    bottom: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    font-size: 11px;
    font-weight: 750;
}
.bk-trip-compose__remove {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 9px;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
}
.bk-trip-compose__remove:hover {
    background: #b42318;
}
.bk-trip-compose__add {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 1.5px dashed rgba(103, 199, 97, 0.55);
    background: linear-gradient(180deg, rgba(103, 199, 97, 0.1), rgba(103, 199, 97, 0.03));
    color: #1f6b1b;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
}
.bk-trip-compose__add i {
    font-size: 26px;
    line-height: 1;
}
.bk-trip-compose__add:hover {
    border-color: #67C761;
    background: rgba(103, 199, 97, 0.14);
}
.bk-start-trip__hint {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.4;
}
.bk-start-trip__error {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 700;
    color: #b91c1c;
}
.bk-source-sheet {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: grid;
    align-items: end;
    justify-items: center;
    padding: 16px;
}
.bk-source-sheet[hidden] {
    display: none !important;
}
.bk-source-sheet__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 12, 14, 0.45);
}
.bk-source-sheet__panel {
    position: relative;
    z-index: 1;
    width: min(420px, 100%);
    display: grid;
    gap: 8px;
    padding: 16px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 20px 50px rgba(13, 20, 22, 0.22);
}
.bk-source-sheet__panel > strong {
    display: block;
    margin-bottom: 4px;
    font-size: 15px;
}
.bk-source-sheet__btn {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 10px;
    align-items: center;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: #fbfcfb;
    text-align: left;
    cursor: pointer;
    font: inherit;
}
.bk-source-sheet__btn i {
    grid-row: 1 / span 2;
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: rgba(103, 199, 97, 0.14);
    color: #1f6b1b;
    font-size: 18px;
}
.bk-source-sheet__btn span {
    font-size: 14px;
    font-weight: 750;
    color: #0d1416;
}
.bk-source-sheet__btn small {
    font-size: 12px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.5);
}
.bk-source-sheet__btn:hover {
    border-color: rgba(103, 199, 97, 0.45);
    background: rgba(103, 199, 97, 0.08);
}
.bk-source-sheet__cancel {
    margin-top: 4px;
    padding: 12px;
    border: 0;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.05);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.bk-review__rating {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 8px;
    color: #eab308;
    font-size: 18px;
}
.bk-review__rating strong {
    margin-left: 6px;
    color: #0d1416;
    font-size: 14px;
}
.bk-review__meta {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 650;
    color: rgba(13, 20, 22, 0.55);
}
.bk-review__text {
    margin: 0;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.03);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    color: rgba(13, 20, 22, 0.8);
}
.bk-edit-form {
    margin-top: 4px;
}
.bk-edit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 14px;
}
.bk-edit-grid > div {
    min-width: 0;
}
.bk-edit-grid__wide {
    grid-column: 1 / -1;
}
.bk-edit-form label {
    margin-top: 0;
}
.bk-edit-form input,
.bk-edit-form select,
.bk-edit-form textarea {
    width: 100%;
    border: 1px solid rgba(13, 20, 22, 0.12);
    border-radius: 10px;
    padding: 10px 12px;
    font: inherit;
    font-weight: 600;
    background: #fafbfa;
}
.bk-edit-form input:focus,
.bk-edit-form select:focus,
.bk-edit-form textarea:focus {
    outline: none;
    border-color: rgba(103, 199, 97, 0.7);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.16);
    background: #fff;
}
.bk-edit-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}
.admin-pay-card__top-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.admin-docs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}
.admin-doc {
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-decoration: none;
    color: inherit;
    font-size: 13px;
    font-weight: 650;
}
.admin-doc img,
.admin-doc__file {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 12px;
    background: rgba(13, 20, 22, 0.05);
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.admin-doc__file {
    display: grid;
    place-items: center;
    font-size: 28px;
    color: rgba(13, 20, 22, 0.45);
}
.admin-back {
    margin: 0 0 12px;
}
@media (max-width: 960px) {
    body.admin-nav-lock {
        overflow: hidden;
    }
    .admin-shell {
        grid-template-columns: 1fr;
    }
    .admin-nav-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 90;
        border: 0;
        padding: 0;
        margin: 0;
        background: rgba(13, 20, 22, 0.48);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s ease;
    }
    .admin-shell.is-nav-open .admin-nav-backdrop {
        opacity: 1;
        pointer-events: auto;
    }
    .admin-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: min(300px, 88vw);
        height: 100vh;
        max-height: none;
        z-index: 100;
        transform: translateX(-105%);
        transition: transform 0.22s ease;
        box-shadow: 12px 0 32px rgba(13, 20, 22, 0.28);
    }
    .admin-shell.is-nav-open .admin-sidebar {
        transform: translateX(0);
    }
    .admin-sidebar__close {
        display: grid;
    }
    .admin-topbar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 80;
        align-items: center;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 8px;
        min-height: 60px;
        padding: calc(10px + env(safe-area-inset-top, 0px)) 12px 10px;
        background: #fff;
    }
    .admin-main {
        padding-top: calc(60px + env(safe-area-inset-top, 0px));
    }
    .admin-topbar__menu {
        display: inline-grid;
        place-items: center;
        width: 42px;
        height: 42px;
        border: 1px solid rgba(13, 20, 22, 0.1);
        border-radius: 12px;
        background: #fff;
        color: #0d1416;
        font-size: 22px;
        cursor: pointer;
        flex: 0 0 auto;
        box-shadow: 0 4px 12px rgba(13, 20, 22, 0.05);
    }
    .admin-topbar__menu:hover,
    .admin-topbar__menu[aria-expanded="true"] {
        background: rgba(103, 199, 97, 0.16);
        border-color: rgba(103, 199, 97, 0.4);
        color: #1f6b1b;
    }
    .admin-topbar__left {
        flex: 1;
        min-width: 0;
        align-items: center;
        gap: 10px;
    }
    .admin-topbar__titles {
        min-width: 0;
        display: flex;
        align-items: center;
    }
    .admin-topbar__crumb {
        display: none;
    }
    .admin-topbar__title {
        font-size: 18px;
        line-height: 1.2;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .admin-topbar__right {
        width: auto;
        flex: 0 0 auto;
        justify-content: flex-end;
        gap: 6px;
    }
    .admin-topbar__actions {
        display: none;
    }
    .admin-topbar__icon-btn {
        width: 38px;
        height: 38px;
        border-radius: 11px;
        font-size: 17px;
    }
    .admin-topbar__user {
        padding: 4px;
        border-radius: 12px;
        gap: 0;
    }
    .admin-topbar__avatar {
        width: 34px;
        height: 34px;
        border-radius: 10px;
    }
    .admin-topbar__user-meta {
        display: none;
    }
    .admin-content {
        padding: 16px 18px 24px;
    }
    .admin-footer {
        padding: 14px 18px;
    }
    .dash-hero {
        flex-direction: column;
    }
    .dash-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .dash-charts,
    .dash-split,
    .dash-grid,
    .dash-grid--tables,
    .admin-filters,
    .admin-detail-grid,
    .admin-dl > div,
    .bk-layout,
    .bk-chips,
    .bk-kv,
    .bk-hero,
    .bk-hero__body,
    .bk-customer-layout,
    .bk-edit-grid {
        grid-template-columns: 1fr;
    }
    .bk-doc-previews {
        grid-template-columns: 1fr;
    }
    .bk-hero__body {
        display: grid;
    }
    .bk-hero__total {
        text-align: left;
    }
    .bk-panel--sticky {
        /* Keep positioned so z-index wins over Quick facts below (static ignores z-index). */
        position: relative;
        top: auto;
        z-index: 5;
    }
    .bk-panel--sticky:has(.bk-status-dd.is-open) {
        z-index: 80;
    }
    .dash-chart-card--wide {
        grid-column: auto;
    }
}
@media (min-width: 520px) and (max-width: 960px) {
    .admin-topbar__user {
        padding: 4px 10px 4px 4px;
        gap: 8px;
    }
    .admin-topbar__user-meta {
        display: flex;
    }
    .admin-topbar__user-meta small {
        display: none;
    }
    .admin-topbar__user-meta strong {
        max-width: 120px;
    }
}
@media (max-width: 1200px) and (min-width: 961px) {
    .dash-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .dash-grid,
    .dash-grid--tables,
    .bk-chips {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .bk-layout {
        grid-template-columns: 1fr;
    }
}

/* Admin modal (refund etc.) */
.admin-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding: 20px;
}
.admin-modal[hidden] {
    display: none !important;
}
.admin-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(13, 20, 22, 0.45);
    backdrop-filter: blur(3px);
}
.admin-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(420px, 100%);
    max-height: min(92vh, 920px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #fff;
    border-radius: 20px;
    padding: 24px 22px 20px;
    box-shadow: 0 24px 60px rgba(13, 20, 22, 0.22);
    border: 1px solid rgba(13, 20, 22, 0.08);
}
.admin-modal__dialog--wide {
    width: min(640px, 100%);
}
.admin-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.05);
    color: #0d1416;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 18px;
}
.admin-modal__close:hover {
    background: rgba(13, 20, 22, 0.08);
}
.admin-modal__icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(103, 199, 97, 0.14);
    color: #2f8f2a;
    font-size: 24px;
    margin-bottom: 12px;
}
.admin-modal__icon--danger {
    background: rgba(220, 38, 38, 0.12);
    color: #dc2626;
}
.admin-modal__dialog h3 {
    margin: 0 0 6px;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.admin-modal__lead {
    margin: 0 0 16px;
    font-size: 13.5px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.45;
}
.admin-modal__form label {
    display: block;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.5);
}
.admin-modal__form input[type="text"],
.admin-modal__form input[type="number"],
.admin-modal__form input[type="email"],
.admin-modal__form input[type="search"],
.admin-modal__form textarea,
.admin-modal__form select {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid rgba(13, 20, 22, 0.16);
    border-radius: 11px;
    padding: 10px 12px;
    font: inherit;
    background: #fff;
}
.admin-modal__form input[type="text"]:focus,
.admin-modal__form input[type="number"]:focus,
.admin-modal__form textarea:focus,
.admin-modal__form select:focus {
    outline: none;
    border-color: rgba(103, 199, 97, 0.75);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.18);
}
.admin-modal__amount {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(13, 20, 22, 0.12);
    border-radius: 12px;
    padding: 4px 12px;
    background: #fafbfa;
}
.admin-modal__amount span {
    font-size: 18px;
    font-weight: 800;
    color: rgba(13, 20, 22, 0.55);
}
.admin-modal__amount input {
    flex: 1;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.02em;
    padding: 10px 0;
    outline: none;
    min-width: 0;
    width: 100%;
}
.admin-modal__amount:focus-within {
    border-color: rgba(103, 199, 97, 0.65);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.16);
    background: #fff;
}
.admin-modal__hint {
    margin: 8px 0 0;
    font-size: 12.5px;
    font-weight: 650;
    color: rgba(13, 20, 22, 0.45);
}
.admin-modal__error {
    margin: 8px 0 0;
    font-size: 12.5px;
    font-weight: 700;
    color: #dc2626;
}
.admin-modal__actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}
.admin-modal__undo {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    display: grid;
    gap: 10px;
}
.admin-modal__undo-note {
    margin: 0;
    font-size: 13px;
    color: #64748b;
    line-height: 1.45;
}

/* Cars list — AJAX toast + delete modal options */
.cars-toast {
    position: fixed;
    top: 18px;
    right: 18px;
    z-index: 1200;
    max-width: min(360px, calc(100vw - 32px));
    padding: 12px 14px;
    border-radius: 12px;
    background: #0d1416;
    color: #fff;
    font-size: 13.5px;
    font-weight: 700;
    box-shadow: 0 16px 36px rgba(13, 20, 22, 0.22);
}
.cars-toast.is-error {
    background: #b91c1c;
}
.cars-delete-options {
    display: grid;
    gap: 10px;
    margin-top: 4px;
}
.cars-delete-option {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    text-align: left;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: #f8faf8;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.cars-delete-option:hover {
    border-color: rgba(103, 199, 97, 0.45);
    background: rgba(103, 199, 97, 0.08);
    transform: translateY(-1px);
}
.cars-delete-option--danger:hover {
    border-color: rgba(220, 38, 38, 0.4);
    background: rgba(220, 38, 38, 0.06);
}
.cars-delete-option:disabled {
    opacity: 0.6;
    cursor: wait;
    transform: none;
}
.cars-delete-option__icon {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: rgba(103, 199, 97, 0.14);
    color: #2f8f2a;
    font-size: 18px;
    flex: 0 0 auto;
}
.cars-delete-option--danger .cars-delete-option__icon {
    background: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}
.cars-delete-option__copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.cars-delete-option__copy strong {
    font-size: 14px;
    letter-spacing: -0.01em;
    color: #0d1416;
}
.cars-delete-option__copy small {
    font-size: 12.5px;
    line-height: 1.4;
    color: rgba(13, 20, 22, 0.55);
    font-weight: 600;
}

/* Cars page — data table UI */
.cars-page {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.cars-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 14px;
    flex-wrap: wrap;
    padding: 16px 18px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.035);
}
.cars-hero__eyebrow {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.cars-hero h1 {
    margin: 0;
    font-size: 26px;
    letter-spacing: -0.03em;
    line-height: 1.1;
}
.cars-hero__sub {
    margin: 6px 0 0;
    font-size: 13.5px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
}
.cars-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.cars-stat {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 8px 18px rgba(13, 20, 22, 0.03);
}
.cars-stat__icon {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(103, 199, 97, 0.12);
    color: #2f8f2a;
    font-size: 16px;
    flex: 0 0 auto;
}
.cars-stat--ok .cars-stat__icon {
    background: rgba(103, 199, 97, 0.16);
}
.cars-stat--bad .cars-stat__icon {
    background: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}
.cars-stat small {
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.cars-stat strong {
    display: block;
    margin-top: 2px;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.cars-dt-panel {
    padding-top: 14px;
}
.cars-dt-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    margin-bottom: 12px;
}
.cars-dt-toolbar__left,
.cars-dt-toolbar__right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
}
.cars-dt-toolbar__left {
    flex: 1 1 auto;
    min-width: 0;
}
.cars-dt-toolbar__right {
    flex: 0 0 auto;
}
.cars-dt-search {
    position: relative;
    display: block;
    flex: 1 1 auto;
    min-width: 160px;
}
.cars-dt-search i {
    position: absolute;
    left: 12px;
    top: 50%;
    translate: 0 -50%;
    color: rgba(13, 20, 22, 0.4);
    pointer-events: none;
}
.cars-dt-search input {
    width: 100%;
    height: 40px;
    padding: 0 12px 0 36px;
    border: 1px solid rgba(13, 20, 22, 0.14);
    border-radius: 11px;
    background: #fff;
    font: inherit;
    font-size: 13.5px;
    font-weight: 600;
}
.cars-dt-search input:focus {
    outline: none;
    border-color: rgba(103, 199, 97, 0.7);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.16);
}
.cars-dt-select {
    height: 40px;
    padding: 0 12px;
    border: 1px solid rgba(13, 20, 22, 0.14);
    border-radius: 11px;
    background: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 650;
    color: #0d1416;
    flex: 0 0 auto;
    max-width: 160px;
}
.cars-dt-length {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 650;
    color: rgba(13, 20, 22, 0.55);
}
.cars-dt-wrap {
    border-radius: 14px;
}
.cars-dt .cars-dt-th {
    white-space: nowrap;
    user-select: none;
}
.cars-dt .cars-dt-th.is-sortable {
    cursor: pointer;
}
.cars-dt .cars-dt-th.is-sortable::after {
    content: "↕";
    margin-left: 6px;
    font-size: 10px;
    opacity: 0.35;
}
.cars-dt .cars-dt-th.is-sorted.asc::after {
    content: "↑";
    opacity: 0.9;
    color: #2f8f2a;
}
.cars-dt .cars-dt-th.is-sorted.desc::after {
    content: "↓";
    opacity: 0.9;
    color: #2f8f2a;
}
.cars-dt-th--actions {
    text-align: right !important;
    width: 1%;
}
.cars-dt td:last-child {
    text-align: right;
    white-space: nowrap;
    vertical-align: middle;
}
.cars-dt-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: nowrap;
}
.cars-dt-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 32px;
    padding: 0 10px;
    border-radius: 9px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: #f4f6f5;
    color: #0d1416;
    font: inherit;
    font-size: 12.5px;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
    white-space: nowrap;
}
.cars-dt-action i {
    font-size: 14px;
    line-height: 1;
}
.cars-dt-action:hover {
    background: #fff;
    border-color: rgba(103, 199, 97, 0.45);
    color: #1f6b1b;
    transform: translateY(-1px);
}
.cars-dt-action--danger {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.18);
    color: #b91c1c;
}
.cars-dt-action--danger:hover {
    background: #dc2626;
    border-color: #dc2626;
    color: #fff;
}
@media (max-width: 1100px) {
    .cars-dt-action span {
        display: none;
    }
    .cars-dt-action {
        width: 32px;
        padding: 0;
    }
}
.cars-dt-sortcol {
    width: 48px;
    color: rgba(13, 20, 22, 0.45);
    font-weight: 750;
}
.cars-dt-car {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 220px;
}
.cars-dt-thumb {
    width: 56px;
    height: 42px;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(13, 20, 22, 0.05);
    border: 1px solid rgba(13, 20, 22, 0.08);
    flex: 0 0 auto;
}
.cars-dt-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cars-dt-thumb__fallback {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: rgba(13, 20, 22, 0.3);
    font-size: 18px;
}
.cars-dt-car__copy strong {
    display: block;
    font-size: 14px;
    letter-spacing: -0.01em;
}
.cars-dt-cat {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(103, 199, 97, 0.12);
    color: #1f6b1b;
    font-size: 12px;
    font-weight: 750;
}
.cars-dt-specs {
    font-size: 13px;
    font-weight: 650;
    color: rgba(13, 20, 22, 0.72);
    max-width: 180px;
}
.cars-dt-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
}
.cars-dt-info {
    margin: 0;
    font-size: 13px;
    font-weight: 650;
    color: rgba(13, 20, 22, 0.55);
}
.cars-dt-pager {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cars-dt-page {
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    border-radius: 10px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
    color: #0d1416;
    cursor: pointer;
}
.cars-dt-page:hover:not(:disabled) {
    border-color: rgba(103, 199, 97, 0.45);
    background: rgba(103, 199, 97, 0.08);
}
.cars-dt-page.is-active {
    background: #67C761;
    border-color: #67C761;
    color: #fff;
}
.cars-dt-page:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

/* Status toggle switch */
.cars-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
    margin: 0;
}
.cars-switch input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}
.cars-switch__track {
    position: relative;
    width: 42px;
    height: 24px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.18);
    transition: background 0.18s ease;
    flex: 0 0 auto;
}
.cars-switch__thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(13, 20, 22, 0.2);
    transition: transform 0.18s ease;
}
.cars-switch.is-on .cars-switch__track,
.cars-switch input:checked + .cars-switch__track {
    background: #67C761;
}
.cars-switch.is-on .cars-switch__thumb,
.cars-switch input:checked + .cars-switch__track .cars-switch__thumb {
    transform: translateX(18px);
}
.cars-switch__text {
    font-size: 12.5px;
    font-weight: 750;
    color: rgba(13, 20, 22, 0.62);
    min-width: 78px;
}
.cars-switch.is-on .cars-switch__text,
.cars-switch:has(input:checked) .cars-switch__text {
    color: #1f6b1b;
}
.cars-switch input:disabled + .cars-switch__track {
    opacity: 0.55;
}

/* Car view — full-screen right offcanvas */
.cars-offcanvas {
    position: fixed;
    inset: 0;
    z-index: 1300;
    pointer-events: none;
}
.cars-offcanvas[hidden] {
    display: block !important;
    visibility: hidden;
}
.cars-offcanvas.is-open {
    pointer-events: auto;
    visibility: visible;
}
.cars-offcanvas__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 12, 14, 0.48);
    opacity: 0;
    transition: opacity 0.65s ease;
    backdrop-filter: blur(4px);
}
.cars-offcanvas.is-open .cars-offcanvas__backdrop {
    opacity: 1;
}
.cars-offcanvas__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: 100vw;
    max-width: 100vw;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    box-shadow: none;
    transform: translateX(100%);
    transition: transform 0.72s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
}
.cars-offcanvas.is-open .cars-offcanvas__panel {
    transform: translateX(0);
}
.cars-offcanvas__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px clamp(18px, 4vw, 40px);
    border-bottom: 1px solid rgba(13, 20, 22, 0.06);
    background: #fff;
    flex: 0 0 auto;
}
.cars-offcanvas__eyebrow {
    margin: 0 0 2px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.4);
}
.cars-offcanvas__head-title {
    display: block;
    font-size: 18px;
    letter-spacing: -0.02em;
}
.cars-offcanvas__close {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid rgba(13, 20, 22, 0.1);
    background: #f4f6f5;
    color: #0d1416;
    cursor: pointer;
    font-size: 20px;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.cars-offcanvas__close:hover {
    background: #fff;
    border-color: rgba(103, 199, 97, 0.45);
    color: #1f6b1b;
    transform: scale(1.03);
}
.cars-offcanvas__scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    background:
        linear-gradient(180deg, #fbfcfb 0%, #f5f7f6 100%);
}
.cars-offcanvas__foot {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 16px clamp(18px, 4vw, 40px) 20px;
    border-top: 1px solid rgba(13, 20, 22, 0.07);
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
}
.cars-offcanvas__foot[hidden] {
    display: none !important;
}
.cars-offcanvas__foot .admin-btn {
    min-width: 160px;
    justify-content: center;
}
.cars-view {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    background: transparent;
    box-shadow: none;
}
.cars-view__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    gap: 28px;
    align-items: start;
    padding: 24px clamp(18px, 4vw, 40px) 28px;
}
.cars-view__gallery {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: transparent;
}
.cars-view__stage {
    position: relative;
    height: clamp(280px, 42vh, 460px);
    border-radius: 22px;
    overflow: hidden;
    background:
        linear-gradient(160deg, rgba(103, 199, 97, 0.14), rgba(13, 20, 22, 0.06));
    box-shadow: 0 18px 40px rgba(13, 20, 22, 0.1);
}
.cars-view__stage--empty {
    display: grid;
    place-items: center;
}
.cars-view__stage--multi [data-gallery-main] {
    cursor: pointer;
}
.cars-view__stage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cars-view__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 0;
    background: rgba(255, 255, 255, 0.94);
    color: #0d1416;
    display: inline-grid;
    place-items: center;
    font-size: 22px;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
    transition: transform 0.15s ease, background 0.15s ease;
}
.cars-view__nav:hover {
    background: #fff;
    transform: translateY(-50%) scale(1.05);
}
.cars-view__nav--prev { left: 14px; }
.cars-view__nav--next { right: 14px; }
.cars-view__counter {
    position: absolute;
    right: 14px;
    bottom: 14px;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: 0.02em;
}
.cars-view__thumbs {
    display: flex;
    gap: 10px;
    padding: 4px 2px 2px;
    overflow-x: auto;
    background: transparent;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}
.cars-view__thumbs::-webkit-scrollbar {
    height: 6px;
}
.cars-view__thumbs::-webkit-scrollbar-thumb {
    background: rgba(13, 20, 22, 0.18);
    border-radius: 999px;
}
.cars-view__thumb {
    flex: 0 0 auto;
    width: 88px;
    height: 64px;
    padding: 0;
    border-radius: 14px;
    overflow: hidden;
    border: 2px solid transparent;
    background: #fff;
    cursor: pointer;
    opacity: 0.78;
    box-shadow: 0 6px 16px rgba(13, 20, 22, 0.08);
    transition: opacity 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.cars-view__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cars-view__thumb:hover {
    opacity: 1;
    transform: translateY(-2px);
}
.cars-view__thumb.is-active {
    opacity: 1;
    border-color: #67C761;
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.2), 0 8px 18px rgba(13, 20, 22, 0.1);
}
.cars-view__fallback {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    font-size: 64px;
    color: rgba(13, 20, 22, 0.28);
}
.cars-view__body {
    padding: 8px 4px 0;
    background: transparent;
}
.cars-view__eyebrow {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.4);
}
.cars-view__body h3 {
    margin: 0;
    font-size: clamp(26px, 3vw, 34px);
    letter-spacing: -0.035em;
    line-height: 1.12;
    color: #0d1416;
}
.cars-view__tagline {
    margin: 10px 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.5;
    max-width: 42ch;
}
.cars-view__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}
.cars-view__price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 20px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(103, 199, 97, 0.14), rgba(103, 199, 97, 0.05));
    border: 1px solid rgba(103, 199, 97, 0.18);
    margin-bottom: 16px;
}
.cars-view__price small {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.45);
    margin-bottom: 2px;
}
.cars-view__price span {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.5);
}
.cars-view__price strong {
    font-size: clamp(28px, 3vw, 34px);
    font-weight: 800;
    color: #1f6b1b;
    letter-spacing: -0.03em;
    line-height: 1;
}
.cars-view__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.cars-view__grid > div {
    padding: 14px 14px 13px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.06);
    box-shadow: 0 4px 12px rgba(13, 20, 22, 0.03);
}
.cars-view__grid small {
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.4);
    margin-bottom: 5px;
}
.cars-view__grid strong {
    font-size: 14px;
    font-weight: 750;
    color: #0d1416;
}
.cars-view__overview-card {
    margin-top: 14px;
    padding: 16px 18px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.06);
}
.cars-view__overview-card small {
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.4);
    margin-bottom: 8px;
}
.cars-view__overview-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.72);
}

@media (max-width: 960px) {
    .cars-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .cars-dt-toolbar {
        flex-wrap: wrap;
    }
    .cars-dt-toolbar__left {
        width: 100%;
        flex-wrap: wrap;
    }
    .cars-dt-toolbar__right {
        width: 100%;
        justify-content: flex-end;
    }
    .cars-dt-search {
        flex: 1 1 100%;
        min-width: 100%;
    }
    .cars-dt-select {
        max-width: none;
        flex: 1 1 auto;
    }
    .cars-offcanvas__panel {
        width: 100vw;
        max-width: 100vw;
        box-shadow: none;
    }
    .cars-offcanvas__head,
    .cars-offcanvas__foot {
        padding-left: 18px;
        padding-right: 18px;
    }
    .cars-view__layout {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 16px 18px 22px;
    }
    .cars-view__gallery {
        position: static;
    }
    .cars-view__stage {
        height: min(38vh, 300px);
        border-radius: 18px;
    }
    .cars-view__thumb {
        width: 74px;
        height: 54px;
        border-radius: 12px;
    }
    .cars-view__body {
        padding: 0;
    }
    .cars-offcanvas__foot .admin-btn {
        flex: 1 1 auto;
        min-width: 0;
    }
}
@media (max-width: 640px) {
    .cars-view__grid {
        grid-template-columns: 1fr 1fr;
    }
    .cars-view__price {
        padding: 16px;
    }
}


/* Dedicated admin login (admin/login.php) */
.admin-login-body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(ellipse 80% 50% at 20% -10%, rgba(103, 199, 97, 0.22), transparent 55%),
        radial-gradient(ellipse 60% 40% at 100% 100%, rgba(103, 199, 97, 0.12), transparent 50%),
        linear-gradient(165deg, #0a1012 0%, #121a1c 45%, #0d1416 100%);
    color: #fff;
    font-family: inherit;
}
.admin-login {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px 16px;
}
.admin-login__card {
    width: min(420px, 100%);
    background: rgba(18, 26, 28, 0.92);
    border: 1px solid rgba(103, 199, 97, 0.18);
    border-radius: 18px;
    padding: 28px 26px 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}
.admin-login__brand {
    display: inline-flex;
    margin-bottom: 18px;
    line-height: 0;
}
.admin-login__logo {
    height: 48px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
}
.admin-login__head h1 {
    margin: 0;
    font-size: 24px;
    font-weight: 750;
    letter-spacing: -0.02em;
    color: #ffffff;
}
.admin-login__head p {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, 0.58);
    font-size: 14px;
    line-height: 1.45;
}
.admin-login__status {
    margin: 16px 0 0;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 650;
}
.admin-login__status.is-error {
    background: rgba(220, 38, 38, 0.14);
    color: #fecaca;
    border: 1px solid rgba(248, 113, 113, 0.35);
}
.admin-login__form {
    display: grid;
    gap: 8px;
    margin-top: 20px;
}
.admin-login__form label {
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
    margin-top: 6px;
}
.admin-login__form input {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 15px;
    outline: none;
}
.admin-login__form input:focus {
    border-color: rgba(103, 199, 97, 0.65);
    box-shadow: 0 0 0 3px rgba(103, 199, 97, 0.16);
}
.admin-login__submit {
    margin-top: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 10px;
    background: linear-gradient(145deg, #79d473 0%, #67C761 55%, #4fb849 100%);
    color: #0d1416;
    font-weight: 800;
    font-size: 15px;
    padding: 13px 16px;
    cursor: pointer;
}
.admin-login__submit:hover {
    filter: brightness(1.04);
}
.admin-login__hint {
    margin: 16px 0 0;
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.42);
}
.admin-login__back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    color: rgba(255, 255, 255, 0.62);
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 650;
}
.admin-login__back:hover {
    color: #67C761;
}

/* ============================================================
   Admin � Car edit (ce-*)
   ============================================================ */
.ce-hero {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 16px;
    align-items: stretch;
    margin-bottom: 14px;
    padding: 14px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.035);
}
.ce-hero__media {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    background: linear-gradient(160deg, rgba(103, 199, 97, 0.16), rgba(13, 20, 22, 0.06));
    min-height: 132px;
}
.ce-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ce-hero__fallback {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    min-height: 132px;
    font-size: 42px;
    color: rgba(13, 20, 22, 0.28);
}
.ce-hero__body {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}
.ce-hero__eyebrow {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.ce-hero__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin-bottom: 6px;
}
.ce-hero__title-row h1 {
    margin: 0;
    font-size: 22px;
    letter-spacing: -0.03em;
    line-height: 1.15;
}
.ce-hero__title-row code {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 8px;
    background: rgba(13, 20, 22, 0.05);
    font-size: 12px;
    font-weight: 700;
}
.ce-hero__sub {
    margin: 0 0 10px;
    font-size: 13.5px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.4;
}
.ce-hero__sub strong {
    color: #0d1416;
}
.ce-hero__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.ce-hero__total {
    flex: 0 0 auto;
    text-align: right;
    min-width: 120px;
}
.ce-hero__total span {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
    margin-bottom: 4px;
}
.ce-hero__total strong {
    display: block;
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #1f6b1b;
    line-height: 1;
}
.ce-hero__total small {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 650;
    color: rgba(13, 20, 22, 0.45);
}
.ce-chips {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}
.ce-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 8px 18px rgba(13, 20, 22, 0.03);
}
.ce-chip__icon {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(103, 199, 97, 0.12);
    color: #2f8f2a;
    font-size: 16px;
    flex: 0 0 auto;
}
.ce-chip small {
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(13, 20, 22, 0.42);
}
.ce-chip strong {
    display: block;
    margin-top: 2px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.ce-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.95fr);
    gap: 18px;
    align-items: start;
}
.ce-layout--single {
    grid-template-columns: 1fr;
}
.ce-main {
    min-width: 0;
}
.ce-main .ce-form {
    display: block;
}
.ce-main .admin-panel:last-child,
.ce-panel--inclusions {
    margin-bottom: 0;
}
.ce-side {
    min-width: 0;
    position: sticky;
    top: 96px;
    align-self: start;
    z-index: 5;
}
.ce-panel--gallery {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
    max-height: calc(100vh - 112px);
    overflow: hidden;
}
.ce-panel--locked {
    max-height: none;
}
.ce-gallery-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    margin-top: 4px;
}
.ce-panel--sticky {
    position: sticky;
    top: 96px;
}
.ce-count {
    display: inline-grid;
    place-items: center;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(103, 199, 97, 0.14);
    color: #1f6b1b;
    font-size: 12px;
    font-weight: 800;
}
.ce-form .admin-panel__head h2,
.ce-side .admin-panel__head h2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ce-form .admin-panel__head h2 i,
.ce-side .admin-panel__head h2 i {
    color: #2f8f2a;
    font-size: 18px;
}
.ce-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 14px;
}
.ce-field-grid--tight {
    gap: 10px;
}
.ce-field {
    min-width: 0;
}
.ce-field--wide {
    grid-column: 1 / -1;
}
.ce-field label,
.ce-upload label,
.ce-gallery__meta label {
    display: block;
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 750;
    color: rgba(13, 20, 22, 0.58);
}
.ce-form .ce-field input,
.ce-form .ce-field select,
.ce-form .ce-field textarea,
.ce-gallery__meta .ce-field input {
    margin: 0;
}
.ce-toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}
.ce-toggle {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    margin: 0 !important;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: rgba(103, 199, 97, 0.06);
    cursor: pointer;
    font-weight: 700;
}
.ce-toggle input {
    width: auto !important;
    margin: 0 !important;
}
.ce-toggle span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}
.ce-toggle--compact {
    margin: 0 !important;
    background: rgba(13, 20, 22, 0.03);
    flex: 1 1 auto;
}
.ce-inclusions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.ce-inclusion {
    display: flex !important;
    align-items: flex-start;
    gap: 10px;
    margin: 0 !important;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: #fbfcfb;
    cursor: pointer;
    font-weight: 650;
    line-height: 1.35;
}
.ce-inclusion input {
    width: auto !important;
    margin: 2px 0 0 !important;
    flex: 0 0 auto;
}
.ce-inclusion span {
    font-size: 13px;
}
.ce-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0 8px;
    padding: 14px 16px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(13, 20, 22, 0.07);
    box-shadow: 0 10px 24px rgba(13, 20, 22, 0.035);
}
.ce-form-actions .admin-btn {
    margin-top: 0;
}
.ce-upload {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0 0 12px;
    flex: 0 0 auto;
}
.ce-dropzone {
    position: relative;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0 !important;
    padding: 22px 16px;
    border-radius: 16px;
    border: 1.5px dashed rgba(103, 199, 97, 0.55);
    background: linear-gradient(180deg, rgba(103, 199, 97, 0.1), rgba(103, 199, 97, 0.03));
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.ce-dropzone:hover,
.ce-dropzone.is-drag {
    border-color: #67C761;
    background: rgba(103, 199, 97, 0.14);
    transform: translateY(-1px);
}
.ce-dropzone input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100% !important;
    height: 100%;
    margin: 0 !important;
}
.ce-dropzone__icon {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.9);
    color: #1f6b1b;
    font-size: 22px;
    margin-bottom: 6px;
    box-shadow: 0 6px 14px rgba(13, 20, 22, 0.06);
}
.ce-dropzone strong {
    font-size: 14px;
    font-weight: 800;
    color: #0d1416;
}
.ce-dropzone small {
    font-size: 12px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.5);
    line-height: 1.35;
}
.ce-dropzone__files {
    margin-top: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.06);
    font-size: 12px;
    font-weight: 700;
    color: #0d1416;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ce-upload__opts {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.ce-upload__opts .admin-btn {
    margin-top: 0;
    flex: 0 0 auto;
}
.ce-upload--compose.is-drag {
    outline: 2px dashed rgba(103, 199, 97, 0.7);
    outline-offset: 4px;
    border-radius: 16px;
}
.ce-upload-compose {
    display: grid;
    gap: 10px;
    max-height: min(58vh, 640px);
    overflow-y: auto;
    padding-right: 2px;
}
.ce-upload-add {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 140px;
    padding: 18px 14px;
    border-radius: 14px;
    border: 1.5px dashed rgba(103, 199, 97, 0.55);
    background: linear-gradient(180deg, rgba(103, 199, 97, 0.1), rgba(103, 199, 97, 0.03));
    color: #1f6b1b;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.ce-upload-add i {
    font-size: 28px;
    line-height: 1;
}
.ce-upload-add:hover {
    border-color: #67C761;
    background: rgba(103, 199, 97, 0.14);
    transform: translateY(-1px);
}
.ce-upload-card__remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 10px;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    font-size: 16px;
}
.ce-upload-card__remove:hover {
    background: #b42318;
}
.ce-upload-hint {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.48);
    line-height: 1.4;
}
.ce-upload-hint strong {
    color: #1f6b1b;
}
.ce-upload-preview {
    display: grid;
    gap: 10px;
    max-height: min(52vh, 560px);
    overflow-y: auto;
    padding-right: 2px;
}
.ce-upload-preview__item {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    aspect-ratio: 1;
    background: rgba(13, 20, 22, 0.05);
    border: 2px solid transparent;
}
.ce-upload-preview__item.is-primary {
    border-color: #67C761;
}
.ce-upload-preview__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ce-upload-preview__item span {
    position: absolute;
    left: 6px;
    bottom: 6px;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(13, 20, 22, 0.72);
    color: #fff;
    font-size: 10px;
    font-weight: 750;
}
.ce-upload-card {
    padding: 10px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: #fbfcfb;
}
.ce-upload-card.is-primary {
    border-color: rgba(103, 199, 97, 0.5);
    background: rgba(103, 199, 97, 0.07);
}
.ce-upload-card__media {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    margin-bottom: 10px;
    background: rgba(13, 20, 22, 0.05);
}
.ce-upload-card__media img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}
.ce-upload-card__primary {
    position: absolute;
    left: 8px;
    top: 8px;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    margin: 0 !important;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(13, 20, 22, 0.08);
    cursor: pointer;
    font-size: 12px;
    font-weight: 750;
    color: #0d1416;
    box-shadow: 0 6px 14px rgba(13, 20, 22, 0.08);
}
.ce-upload-card__primary input {
    width: auto !important;
    margin: 0 !important;
}
.ce-upload-card.is-primary .ce-upload-card__primary {
    background: #1f6b1b;
    border-color: #1f6b1b;
    color: #fff;
}
.ce-upload-card__fields {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(88px, 0.6fr);
    gap: 8px;
}
.ce-upload-card__fields .ce-field label {
    margin-bottom: 4px;
}
.ce-upload-card__fields input[type="text"],
.ce-upload-card__fields input[type="number"] {
    width: 100%;
    height: 36px;
    padding: 0 10px;
    border: 1px solid rgba(13, 20, 22, 0.14);
    border-radius: 10px;
    background: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
}
.ce-gallery-empty {
    margin: 0;
    padding: 28px 16px;
    border-radius: 14px;
    background: rgba(13, 20, 22, 0.03);
    text-align: center;
    color: rgba(13, 20, 22, 0.55);
}
.ce-gallery-empty i {
    display: block;
    font-size: 28px;
    color: rgba(13, 20, 22, 0.28);
    margin-bottom: 8px;
}
.ce-gallery-empty p {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}
.ce-gallery-locked {
    padding: 28px 18px;
    text-align: center;
    border-radius: 14px;
    background: rgba(13, 20, 22, 0.03);
}
.ce-gallery-locked i {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: #fff;
    color: rgba(13, 20, 22, 0.4);
    font-size: 20px;
    margin-bottom: 10px;
    box-shadow: 0 6px 14px rgba(13, 20, 22, 0.05);
}
.ce-gallery-locked strong {
    display: block;
    font-size: 15px;
    margin-bottom: 6px;
}
.ce-gallery-locked p {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: rgba(13, 20, 22, 0.55);
    line-height: 1.45;
}
.ce-gallery {
    display: grid;
    gap: 12px;
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 4px;
    align-content: start;
    overscroll-behavior: contain;
}
.ce-gallery::-webkit-scrollbar {
    width: 8px;
}
.ce-gallery::-webkit-scrollbar-track {
    background: rgba(13, 20, 22, 0.04);
    border-radius: 999px;
}
.ce-gallery::-webkit-scrollbar-thumb {
    background: rgba(13, 20, 22, 0.18);
    border-radius: 999px;
}
.ce-gallery::-webkit-scrollbar-thumb:hover {
    background: rgba(13, 20, 22, 0.28);
}
.ce-gallery__card {
    padding: 10px;
    border-radius: 14px;
    border: 1px solid rgba(13, 20, 22, 0.08);
    background: #fbfcfb;
}
.ce-gallery__card.is-primary {
    border-color: rgba(103, 199, 97, 0.45);
    background: rgba(103, 199, 97, 0.06);
}
.ce-gallery__media {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    margin-bottom: 10px;
    background: rgba(13, 20, 22, 0.05);
}
.ce-gallery__media img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}
.ce-gallery__badge {
    position: absolute;
    left: 8px;
    top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(31, 107, 27, 0.92);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}
.ce-gallery__meta .admin-btn {
    margin-top: 8px;
}
.ce-gallery__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}
.ce-gallery__actions form {
    margin: 0;
}
.ce-gallery__actions .admin-btn {
    margin-top: 0;
}
@media (max-width: 1100px) {
    .ce-layout {
        grid-template-columns: 1fr;
    }
    .ce-side {
        position: static;
    }
    .ce-panel--gallery {
        max-height: min(75vh, 780px);
    }
    .ce-panel--locked {
        max-height: none;
    }
    .ce-panel--sticky {
        position: static;
    }
}

@media (max-width: 960px) {
    .ce-hero {
        grid-template-columns: 1fr;
    }
    .ce-hero__body {
        flex-direction: column;
    }
    .ce-hero__total {
        text-align: left;
    }
    .ce-chips,
    .ce-field-grid,
    .ce-inclusions {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 640px) {
    .ce-chips {
        grid-template-columns: 1fr 1fr;
    }
}

.upi-preview {
    display: grid;
    justify-items: center;
    gap: 8px;
    padding: 22px 18px;
    border-radius: 16px;
    background: #f4f9f3;
    border: 1px solid rgba(103, 199, 97, 0.22);
    text-align: center;
}
.upi-preview img {
    width: 220px;
    height: 220px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(13, 20, 22, 0.08);
}
.upi-preview strong {
    font-size: 15px;
    color: #0D1416;
}
.upi-preview code {
    font-size: 13px;
    color: #3f9e3a;
    word-break: break-all;
}
.upi-preview p {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.45;
    color: rgba(13, 20, 22, 0.55);
    max-width: 280px;
}