/* =========================================================
   CARRY AFRICA — MOBILE QUOTE WIZARD
   Load AFTER carry.css / carry-components.css.
   Scoped to .quote-shell-carry so it cannot affect other pages.
   ========================================================= */

.quote-shell-carry {
    --cqm-navy: #061f32;
    --cqm-navy-2: #0a3048;
    --cqm-green: #007a55;
    --cqm-green-2: #0f9f6e;
    --cqm-gold: #ffbd00;
    --cqm-gold-2: #ffcf3d;
    --cqm-red: #c9364f;
    --cqm-blue: #2563eb;
    --cqm-ink: #102033;
    --cqm-muted: #667085;
    --cqm-line: #dfe7ee;
    --cqm-soft: #f5f8fb;
    --cqm-paper: #ffffff;
    --cqm-shadow: 0 18px 48px rgba(6, 31, 50, .10);
    --cqm-radius-xl: 24px;
    --cqm-radius-lg: 19px;
    --cqm-radius-md: 14px;
}

/* Unify the three route partials with the current Carry palette. */
.quote-shell-carry .carry-location-step,
.quote-shell-carry .carry-requirements-step {
    --carry-blue: var(--cqm-green);
    --carry-green: var(--cqm-green);
    --carry-orange: #d99013;
    --carry-ink: var(--cqm-ink);
    --carry-muted: var(--cqm-muted);
    --carry-border: var(--cqm-line);
    --carry-soft-blue: #e8f7f1;
}

/* ---------------------------------------------------------
   Progress panel
   --------------------------------------------------------- */
.quote-shell-carry .carry-wizard-progress {
    position: relative;
    padding: .85rem 1rem;
    border: 1px solid rgba(0, 122, 85, .14);
    border-radius: 18px;
    background:
        radial-gradient(circle at 96% 10%, rgba(255, 189, 0, .16), transparent 28%),
        linear-gradient(180deg, #ffffff, #f8fbfa);
    box-shadow: 0 10px 28px rgba(6, 31, 50, .07);
}

.quote-shell-carry .carry-progress-copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    margin-bottom: .55rem;
}

.quote-shell-carry .carry-progress-step,
.quote-shell-carry .carry-progress-label {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-width: 0;
    font-weight: 850;
}

.quote-shell-carry .carry-progress-step {
    color: var(--cqm-muted);
    font-size: .78rem;
}

.quote-shell-carry .carry-progress-step i {
    color: var(--cqm-green);
}

.quote-shell-carry .carry-progress-label {
    color: var(--cqm-navy);
    font-size: .82rem;
}

.quote-shell-carry .carry-progress-label i {
    color: var(--cqm-gold);
}

.quote-shell-carry .carry-wizard-progress .progress {
    height: 7px !important;
    overflow: hidden;
    border-radius: 999px;
    background: #e9eff2 !important;
}

.quote-shell-carry .carry-wizard-progress .progress-bar {
    border-radius: 999px;
    background: linear-gradient(90deg, var(--cqm-green), var(--cqm-green-2), var(--cqm-gold)) !important;
    box-shadow: 0 0 18px rgba(0, 122, 85, .26);
    transition: width .3s ease;
}

/* ---------------------------------------------------------
   Wizard navigation
   --------------------------------------------------------- */
.quote-shell-carry #wizardNav {
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
    scroll-padding-inline: .5rem;
}

.quote-shell-carry #wizardNav .wizard-pill {
    scroll-snap-align: center;
}

.quote-shell-carry #wizardNav .wizard-pill.completed {
    color: #075c43 !important;
    border-color: #b8e3d4 !important;
    background: #eaf8f3 !important;
}

.quote-shell-carry #wizardNav .wizard-pill.pricing-step:not(.active) {
    color: #684800 !important;
    border-color: #f2d788 !important;
    background: #fff8dd !important;
}

/* ---------------------------------------------------------
   Shared step headers used by steps 4–7
   --------------------------------------------------------- */
.quote-shell-carry .carry-mobile-step-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    border: 1px solid rgba(0, 122, 85, .13);
    border-radius: var(--cqm-radius-xl);
    background:
        radial-gradient(circle at 94% 8%, rgba(255, 189, 0, .13), transparent 30%),
        linear-gradient(180deg, #ffffff, #f8fbfa);
    box-shadow: 0 12px 34px rgba(6, 31, 50, .075);
}

.quote-shell-carry .carry-mobile-step-eyebrow {
    display: inline-block;
    margin-bottom: .35rem;
    color: var(--cqm-green);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.quote-shell-carry .carry-mobile-step-header h4 {
    margin: 0 0 .25rem;
    color: var(--cqm-navy);
    font-weight: 950;
    letter-spacing: -.035em;
    line-height: 1.08;
}

.quote-shell-carry .carry-mobile-step-header p {
    max-width: 760px;
    margin: 0;
    color: var(--cqm-muted);
    font-size: .84rem;
    line-height: 1.55;
}

.quote-shell-carry .carry-mobile-step-number {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: .42rem .7rem;
    border: 1px solid #d9e5e1;
    border-radius: 999px;
    color: var(--cqm-green);
    background: #eef9f5;
    font-size: .72rem;
    font-weight: 900;
    white-space: nowrap;
}

/* ---------------------------------------------------------
   Shared form surfaces
   --------------------------------------------------------- */
.quote-shell-carry .carry-mobile-form-card,
.quote-shell-carry .carry-mobile-section-card,
.quote-shell-carry .weather-impact-card,
.quote-shell-carry .pricing-card,
.quote-shell-carry .carry-review-surface {
    border: 1px solid var(--cqm-line) !important;
    border-radius: var(--cqm-radius-xl) !important;
    background: #fff !important;
    box-shadow: var(--cqm-shadow) !important;
}

.quote-shell-carry .carry-mobile-section-heading {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    margin-bottom: 1rem;
}

.quote-shell-carry .carry-mobile-section-icon {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 13px;
    color: var(--cqm-green);
    background: #e8f7f1;
    font-size: 1.05rem;
}

.quote-shell-carry .carry-mobile-section-heading h5,
.quote-shell-carry .carry-mobile-section-heading h6 {
    margin: 0 0 .15rem;
    color: var(--cqm-navy);
    font-weight: 900;
    letter-spacing: -.02em;
}

.quote-shell-carry .carry-mobile-section-heading p {
    margin: 0;
    color: var(--cqm-muted);
    font-size: .82rem;
    line-height: 1.5;
}

/* Give touch controls a dependable hit area on every viewport. */
.quote-shell-carry input.form-control,
.quote-shell-carry select.form-select,
.quote-shell-carry textarea.form-control {
    min-height: 50px;
}

.quote-shell-carry textarea.form-control {
    min-height: 130px;
}

.quote-shell-carry .form-check-input {
    width: 1.18rem;
    height: 1.18rem;
}

.quote-shell-carry .form-text {
    line-height: 1.45;
}

/* Google address suggestion menu must remain above the sticky controls. */
.pac-container {
    z-index: 2055 !important;
    border: 1px solid #dce5ec !important;
    border-radius: 0 0 14px 14px !important;
    box-shadow: 0 18px 42px rgba(6, 31, 50, .16) !important;
    font-family: Inter, "Segoe UI Variable", "Segoe UI", system-ui, sans-serif !important;
}

/* =========================================================
   MOBILE APP LAYOUT
   ========================================================= */
@media (max-width: 767.98px) {
    body:has(.quote-shell-carry) {
        background: #f3f7f6;
    }

    .quote-shell-carry {
        width: 100%;
        max-width: none;
        padding: .6rem .55rem calc(6.25rem + env(safe-area-inset-bottom));
        overflow: visible;
    }

    /* Keep the current stage visible below the mobile site header. */
    .quote-shell-carry .carry-wizard-progress {
        position: sticky;
        top: 66px;
        z-index: 1025;
        margin: 0 -.05rem .65rem !important;
        padding: .7rem .8rem;
        border-radius: 16px;
        box-shadow: 0 10px 26px rgba(6, 31, 50, .11);
        backdrop-filter: blur(16px);
    }

    .quote-shell-carry .carry-progress-copy {
        margin-bottom: .45rem;
    }

    .quote-shell-carry .carry-progress-step,
    .quote-shell-carry .carry-progress-label {
        font-size: .74rem;
    }

    /* Horizontal app-style step rail. Keep labels visible instead of icons only. */
    .quote-shell-carry #wizardNav {
        width: calc(100% + 1.1rem);
        max-width: none;
        display: flex !important;
        justify-content: flex-start !important;
        gap: .4rem !important;
        margin: 0 -.55rem .55rem !important;
        padding: .48rem .55rem !important;
        overflow-x: auto !important;
        overflow-y: hidden;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .quote-shell-carry #wizardNav::-webkit-scrollbar {
        display: none;
    }

    .quote-shell-carry #wizardNav .wizard-pill,
    .quote-shell-carry #wizardNav .nav-link {
        flex: 0 0 auto !important;
        min-width: 0 !important;
        min-height: 44px;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: .38rem;
        padding: .55rem .72rem !important;
        border-radius: 13px !important;
        font-size: .73rem !important;
        line-height: 1;
        box-shadow: 0 5px 14px rgba(6, 31, 50, .055);
    }

    .quote-shell-carry #wizardNav .wizard-pill span,
    .quote-shell-carry #wizardNav .nav-link span {
        display: inline !important;
    }

    .quote-shell-carry #wizardNav .wizard-pill i,
    .quote-shell-carry #wizardNav .nav-link i {
        margin: 0 !important;
        font-size: .95rem !important;
    }

    .quote-shell-carry #wizardNav .wizard-pill.active {
        min-width: 96px !important;
        background: linear-gradient(135deg, var(--cqm-navy), var(--cqm-green)) !important;
        box-shadow: 0 10px 22px rgba(0, 122, 85, .24) !important;
    }

    .quote-shell-carry #wizardMicrocopy {
        margin: 0 0 .7rem !important;
        font-size: .76rem;
    }

    .quote-shell-carry #wizardMicrocopy > div:not(.d-none) {
        width: 100%;
        display: flex !important;
        align-items: flex-start;
        padding: .7rem .8rem;
        border-radius: 14px;
        line-height: 1.4;
    }

    /* Remove the desktop card around all the inner cards. This is the largest
       improvement on narrow screens: one visual layer instead of three. */
    .quote-shell-carry .tab-content {
        overflow: visible !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .quote-shell-carry .tab-content::before {
        display: none !important;
    }

    .quote-shell-carry .tab-pane {
        overflow: visible;
    }

    .quote-shell-carry .tab-pane > .row,
    .quote-shell-carry .carry-location-step,
    .quote-shell-carry .carry-requirements-step,
    .quote-shell-carry .carry-w3w-step,
    .quote-shell-carry .carry-contact-step,
    .quote-shell-carry .carry-weather-step,
    .quote-shell-carry .carry-price-step,
    .quote-shell-carry .carry-review-step {
        --bs-gutter-x: .8rem;
        --bs-gutter-y: .8rem;
    }

    /* Premium compact step hero. */
    .quote-shell-carry .carry-step-header,
    .quote-shell-carry .carry-w3w-header,
    .quote-shell-carry .carry-mobile-step-header {
        position: relative;
        display: flex;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: .75rem !important;
        padding: 1rem;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,.09);
        border-radius: 20px;
        color: #fff;
        background:
            radial-gradient(circle at 92% 10%, rgba(255,189,0,.25), transparent 30%),
            linear-gradient(135deg, var(--cqm-navy), #064a37 68%, var(--cqm-green));
        box-shadow: 0 16px 38px rgba(6, 31, 50, .17);
    }

    .quote-shell-carry .carry-step-header::after,
    .quote-shell-carry .carry-w3w-header::after,
    .quote-shell-carry .carry-mobile-step-header::after {
        content: "";
        position: absolute;
        right: -58px;
        bottom: -82px;
        width: 150px;
        height: 150px;
        border: 1px solid rgba(255,255,255,.12);
        border-radius: 50%;
        box-shadow: 0 0 0 22px rgba(255,255,255,.035);
        pointer-events: none;
    }

    .quote-shell-carry .carry-step-header > *,
    .quote-shell-carry .carry-w3w-header > *,
    .quote-shell-carry .carry-mobile-step-header > * {
        position: relative;
        z-index: 1;
    }

    .quote-shell-carry .carry-step-eyebrow,
    .quote-shell-carry .carry-w3w-eyebrow,
    .quote-shell-carry .carry-mobile-step-eyebrow {
        margin-bottom: .38rem;
        color: #ffe080 !important;
        font-size: .68rem !important;
        font-weight: 900;
        letter-spacing: .11em;
        text-transform: uppercase;
    }

    .quote-shell-carry .carry-step-header h4,
    .quote-shell-carry .carry-w3w-header h4,
    .quote-shell-carry .carry-mobile-step-header h4 {
        margin: 0 0 .35rem !important;
        color: #fff !important;
        font-size: clamp(1.32rem, 6vw, 1.62rem);
        font-weight: 950 !important;
        letter-spacing: -.035em;
        line-height: 1.08;
    }

    .quote-shell-carry .carry-step-header p,
    .quote-shell-carry .carry-w3w-header p,
    .quote-shell-carry .carry-mobile-step-header p,
    .quote-shell-carry .carry-step-header .text-muted,
    .quote-shell-carry .carry-w3w-header .text-muted,
    .quote-shell-carry .carry-mobile-step-header .text-muted {
        color: rgba(255,255,255,.76) !important;
        font-size: .78rem !important;
        line-height: 1.5;
    }

    .quote-shell-carry .carry-step-number,
    .quote-shell-carry .carry-mobile-step-number {
        align-self: flex-start;
        display: inline-flex;
        align-items: center;
        min-height: 30px;
        padding: .35rem .62rem;
        border: 1px solid rgba(255,255,255,.18);
        border-radius: 999px;
        color: #fff !important;
        background: rgba(255,255,255,.10);
        font-size: .68rem !important;
        font-weight: 850;
    }

    /* Chips scroll in one line instead of consuming half the screen. */
    .quote-shell-carry .carry-route-scenarios,
    .quote-shell-carry .carry-scenario-strip {
        width: calc(100% + .55rem);
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: .4rem !important;
        margin-right: -.55rem;
        padding: .65rem .65rem !important;
        overflow-x: auto;
        border-radius: 16px !important;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .quote-shell-carry .carry-route-scenarios::-webkit-scrollbar,
    .quote-shell-carry .carry-scenario-strip::-webkit-scrollbar {
        display: none;
    }

    .quote-shell-carry .carry-scenario-label {
        width: auto !important;
        flex: 0 0 auto;
        position: sticky;
        left: 0;
        z-index: 2;
        margin: 0 !important;
        padding: .34rem .45rem;
        border-radius: 8px;
        background: rgba(255,255,255,.96);
        box-shadow: 7px 0 12px rgba(255,255,255,.95);
        font-size: .68rem !important;
    }

    .quote-shell-carry .carry-scenario-pill {
        flex: 0 0 auto;
        padding: .38rem .56rem !important;
        font-size: .68rem !important;
        white-space: nowrap;
    }

    /* Cards and spacing */
    .quote-shell-carry .card,
    .quote-shell-carry .carry-route-card,
    .quote-shell-carry .carry-extra-stops-card,
    .quote-shell-carry .carry-route-summary,
    .quote-shell-carry .carry-detail-card,
    .quote-shell-carry .carry-declaration-card,
    .quote-shell-carry .carry-w3w-card,
    .quote-shell-carry .carry-w3w-route-card {
        border-radius: 19px !important;
        box-shadow: 0 10px 28px rgba(6, 31, 50, .075) !important;
    }

    .quote-shell-carry .card-body,
    .quote-shell-carry .carry-detail-card,
    .quote-shell-carry .carry-declaration-card {
        padding: .9rem !important;
    }

    .quote-shell-carry .d-flex.align-items-start.gap-3.mb-4 {
        gap: .65rem !important;
        margin-bottom: .85rem !important;
    }

    .quote-shell-carry .carry-section-icon,
    .quote-shell-carry .carry-route-icon {
        width: 38px !important;
        height: 38px !important;
        border-radius: 12px !important;
        font-size: 1rem !important;
    }

    .quote-shell-carry .tab-pane h5 {
        font-size: 1rem;
        line-height: 1.25;
    }

    .quote-shell-carry .tab-pane h6 {
        font-size: .92rem;
        line-height: 1.3;
    }

    /* Step 1: collection and delivery become a clear vertical journey. */
    .quote-shell-carry .carry-route-card .row.g-4 {
        --bs-gutter-y: .45rem;
    }

    .quote-shell-carry .carry-location-panel {
        padding: .9rem !important;
        border-radius: 17px !important;
        box-shadow: 0 6px 18px rgba(6, 31, 50, .045);
    }

    .quote-shell-carry .carry-location-marker {
        width: 38px !important;
        height: 38px !important;
    }

    .quote-shell-carry .carry-route-connector {
        width: 100% !important;
        height: 36px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
    }

    .quote-shell-carry .carry-route-line-main {
        width: 2px !important;
        height: 100% !important;
    }

    .quote-shell-carry .carry-route-arrow {
        width: 29px !important;
        height: 29px !important;
        transform: rotate(90deg);
        box-shadow: 0 5px 14px rgba(6, 31, 50, .08);
    }

    .quote-shell-carry .carry-address-field .form-control {
        min-height: 52px;
        padding: .72rem .75rem .72rem 2.45rem !important;
        font-size: 16px; /* prevents iOS zoom */
        line-height: 1.25;
    }

    .quote-shell-carry .carry-address-field > i {
        left: .8rem;
    }

    .quote-shell-carry .carry-location-guidance,
    .quote-shell-carry .carry-w3w-notice,
    .quote-shell-carry .carry-w3w-help-card,
    .quote-shell-carry .carry-info-box {
        gap: .6rem !important;
        padding: .75rem .8rem !important;
        border-radius: 14px !important;
        font-size: .75rem !important;
    }

    .quote-shell-carry .carry-toggle-wrapper {
        width: 100%;
        padding: .65rem .7rem;
    }

    .quote-shell-carry .extra-stop-card,
    .quote-shell-carry .carry-extra-w3w-row {
        gap: .55rem !important;
        padding: .75rem !important;
        border-radius: 15px !important;
    }

    .quote-shell-carry .stop-input-wrapper,
    .quote-shell-carry .carry-extra-w3w-content {
        width: calc(100% - 42px) !important;
        flex-basis: calc(100% - 42px) !important;
    }

    /* Step 2/3 route summaries. */
    .quote-shell-carry .carry-route-address {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: .28rem !important;
        align-items: start !important;
        font-size: .78rem;
        overflow-wrap: anywhere;
    }

    .quote-shell-carry .carry-route-address i {
        justify-self: start;
        transform: rotate(90deg);
        color: var(--cqm-green);
    }

    .quote-shell-carry .carry-route-pill,
    .quote-shell-carry .carry-route-count,
    .quote-shell-carry .carry-count-pill {
        font-size: .68rem !important;
    }

    .quote-shell-carry .carry-upload-zone {
        min-height: 0 !important;
        padding: 1.05rem .8rem !important;
        border-radius: 16px !important;
    }

    .quote-shell-carry .carry-detail-prompts {
        display: flex;
        gap: .4rem;
        overflow-x: auto;
        padding-bottom: .2rem;
        scrollbar-width: none;
    }

    .quote-shell-carry .carry-detail-prompts > * {
        flex: 0 0 auto;
    }

    /* what3words */
    .quote-shell-carry .carry-w3w-brand {
        align-self: flex-start !important;
        padding: .45rem .6rem !important;
        border-radius: 12px !important;
        background: #fff !important;
    }

    .quote-shell-carry .carry-w3w-logo {
        max-width: 104px;
    }

    .quote-shell-carry .w3w-field .input-group {
        flex-wrap: nowrap;
    }

    .quote-shell-carry .carry-w3w-prefix {
        padding-inline: .65rem !important;
        font-size: .78rem;
    }

    .quote-shell-carry .w3w-input {
        min-width: 0;
        font-size: 16px;
    }

    /* Contact and generic form cards. */
    .quote-shell-carry .carry-mobile-form-card .card-body,
    .quote-shell-carry .carry-mobile-section-card .card-body {
        padding: .95rem !important;
    }

    .quote-shell-carry .carry-contact-step .row.g-3 {
        --bs-gutter-y: .75rem;
    }

    .quote-shell-carry .carry-contact-step hr {
        margin: 1rem 0 !important;
    }

    .quote-shell-carry label,
    .quote-shell-carry .form-label {
        margin-bottom: .35rem;
        font-size: .78rem;
        line-height: 1.3;
    }

    .quote-shell-carry .form-control,
    .quote-shell-carry .form-select {
        min-height: 50px;
        padding: .68rem .75rem;
        border-radius: 12px;
        font-size: 16px;
    }

    .quote-shell-carry .text-danger.small {
        display: block;
        margin-top: .25rem;
        font-size: .7rem !important;
    }

    /* Weather */
    .quote-shell-carry .weather-impact-card {
        overflow: hidden;
    }

    .quote-shell-carry .weather-impact-card .card-header {
        display: flex !important;
        flex-direction: column;
        align-items: flex-start !important;
        gap: .35rem;
        padding: .85rem .9rem;
        border-bottom: 1px solid var(--cqm-line);
        background: #f7faf9 !important;
    }

    .quote-shell-carry .weather-impact-card .card-header h5 {
        color: var(--cqm-green) !important;
    }

    .quote-shell-carry .weather-impact-card .card-body {
        padding: .9rem !important;
    }

    /* Date and price calendar */
    .quote-shell-carry .pricing-stage {
        padding: 0 !important;
    }

    .quote-shell-carry .pricing-card {
        padding: .72rem !important;
        overflow: hidden;
        border-radius: 19px !important;
    }

    .quote-shell-carry .pp-header {
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr) 40px;
        gap: .35rem !important;
        align-items: center;
        margin-bottom: .7rem;
    }

    .quote-shell-carry .pp-nav {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px;
        display: grid;
        place-items: center;
        padding: 0 !important;
        border: 1px solid var(--cqm-line) !important;
        border-radius: 12px !important;
        color: var(--cqm-navy) !important;
        background: #fff !important;
        font-size: 1.25rem !important;
        font-weight: 900;
    }

    .quote-shell-carry .pp-title {
        min-width: 0;
        text-align: center;
    }

    .quote-shell-carry .pp-month {
        overflow: hidden;
        color: var(--cqm-navy);
        font-size: 1rem !important;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .quote-shell-carry .pp-sub {
        display: grid !important;
        justify-items: center;
        gap: .25rem !important;
        margin-top: .2rem;
        color: var(--cqm-muted);
        font-size: .66rem !important;
        line-height: 1.25;
    }

    .quote-shell-carry .pp-total,
    .quote-shell-carry .price-lock-badge {
        max-width: 100%;
        padding: .25rem .45rem !important;
        border-radius: 999px !important;
        font-size: .64rem !important;
        white-space: normal;
        text-align: center;
    }

    .quote-shell-carry .pp-weekdays,
    .quote-shell-carry .pp-grid {
        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
        gap: .22rem !important;
        width: 100%;
    }

    .quote-shell-carry .pp-weekdays {
        margin-bottom: .25rem;
    }

    .quote-shell-carry .pp-weekdays > * {
        min-width: 0;
        padding: .25rem 0 !important;
        color: var(--cqm-muted);
        font-size: .58rem !important;
        font-weight: 900;
        text-align: center;
        text-transform: uppercase;
    }

    .quote-shell-carry .pp-grid > button,
    .quote-shell-carry .pp-grid > div {
        min-width: 0 !important;
        min-height: 54px;
        padding: .22rem !important;
        overflow: hidden;
        border-radius: 10px !important;
        font-size: clamp(.54rem, 2.55vw, .7rem) !important;
        line-height: 1.1;
        touch-action: manipulation;
    }

    .quote-shell-carry .pp-grid button span,
    .quote-shell-carry .pp-grid div span {
        max-width: 100%;
        overflow: hidden;
        font-size: inherit !important;
        text-overflow: ellipsis;
    }

    .quote-shell-carry .pp-validation {
        margin-top: .6rem;
    }

    /* Review partials are role-specific, so style their common Bootstrap output. */
    .quote-shell-carry .carry-review-surface {
        padding: .85rem;
    }

    .quote-shell-carry .carry-review-surface .table-responsive {
        margin-inline: -.35rem;
        border-radius: 14px;
    }

    .quote-shell-carry .carry-review-surface table {
        min-width: 620px;
        font-size: .76rem;
    }

    /* Bottom controls: one compact app bar, not a tall vertical stack. */
    .quote-shell-carry .wizard-buttons {
        position: fixed !important;
        inset: auto 0 0 0;
        z-index: 1040;
        width: 100%;
        display: grid !important;
        grid-template-columns: minmax(92px, .38fr) minmax(0, 1fr);
        flex-direction: row !important;
        gap: .55rem !important;
        margin: 0 !important;
        padding: .65rem .75rem calc(.65rem + env(safe-area-inset-bottom)) !important;
        border-top: 1px solid rgba(6, 31, 50, .10) !important;
        background: rgba(255,255,255,.95) !important;
        box-shadow: 0 -12px 34px rgba(6, 31, 50, .12);
        backdrop-filter: blur(18px);
    }

    .quote-shell-carry .wizard-buttons .btn,
    .quote-shell-carry #prevBtn,
    .quote-shell-carry #nextBtn,
    .quote-shell-carry #submitBtn {
        width: 100% !important;
        min-width: 0;
        min-height: 50px;
        margin: 0 !important;
        padding: .68rem .7rem !important;
        border-radius: 14px !important;
        font-size: .82rem !important;
        line-height: 1.1;
    }

    .quote-shell-carry #prevBtn {
        color: var(--cqm-navy) !important;
        border: 1px solid #d8e2e7 !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    .quote-shell-carry #nextBtn,
    .quote-shell-carry #submitBtn {
        color: #fff !important;
        border: 0 !important;
        background: linear-gradient(135deg, var(--cqm-navy), var(--cqm-green)) !important;
        box-shadow: 0 10px 22px rgba(0, 122, 85, .24) !important;
    }

    .quote-shell-carry .wizard-buttons .btn:disabled {
        opacity: .52;
        box-shadow: none !important;
    }

    /* When the on-screen keyboard is open, a fixed action bar can cover the
       focused field. The companion progress partial toggles this class. */
    body.carry-mobile-keyboard-open .quote-shell-carry .wizard-buttons {
        position: static !important;
        margin-top: .75rem !important;
    }

    body.carry-mobile-keyboard-open .quote-shell-carry {
        padding-bottom: 1rem;
    }

    /* Mobile modals */
    .quote-shell-carry .modal-dialog,
    .carry-pricing-modal .modal-dialog {
        margin: .5rem;
    }

    .quote-shell-carry .modal-content,
    .carry-pricing-modal .modal-content {
        max-height: calc(100dvh - 1rem);
        overflow: auto;
        border-radius: 20px;
    }
}

@media (max-width: 389.98px) {
    .quote-shell-carry {
        padding-inline: .4rem;
    }

    .quote-shell-carry #wizardNav {
        width: calc(100% + .8rem);
        margin-inline: -.4rem !important;
        padding-inline: .4rem !important;
    }

    .quote-shell-carry #wizardNav .wizard-pill,
    .quote-shell-carry #wizardNav .nav-link {
        padding-inline: .62rem !important;
        font-size: .69rem !important;
    }

    .quote-shell-carry .carry-step-header,
    .quote-shell-carry .carry-w3w-header,
    .quote-shell-carry .carry-mobile-step-header {
        padding: .9rem;
        border-radius: 18px;
    }

    .quote-shell-carry .card-body,
    .quote-shell-carry .carry-detail-card,
    .quote-shell-carry .carry-declaration-card {
        padding: .8rem !important;
    }

    .quote-shell-carry .pp-grid > button,
    .quote-shell-carry .pp-grid > div {
        min-height: 50px;
        padding: .16rem !important;
    }

    .quote-shell-carry .wizard-buttons {
        grid-template-columns: 90px minmax(0, 1fr);
        padding-inline: .55rem !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .quote-shell-carry *,
    .quote-shell-carry *::before,
    .quote-shell-carry *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}
