/* FreightRun carrier landing pages (AAA Cooper and future carriers)
   Scope: .frcar wrapper, frcar- child classes. Quote shell: .frcarq (no descendant rules, keeps #quote-frm untouched). */

.frcar {
    --frcar-navy: #0D2137;
    --frcar-blue: #1565C0;
    --frcar-red: #e42822;
    --frcar-bg: #f7f9fc;
    --frcar-ink: #1d2a3a;
    --frcar-muted: #5b6b7e;
    --frcar-line: #dfe6ef;
    font-family: 'Figtree',Arial,sans-serif;
    color: var(--frcar-ink);
    font-size: 17px;
    line-height: 1.6;
}

    .frcar *, .frcar *::before, .frcar *::after {
        box-sizing: border-box
    }

    .frcar p {
        margin: 0 0 14px;
        line-height: 1.6
    }

    .frcar a {
        color: var(--frcar-blue)
    }

    .frcar h1, .frcar h2, .frcar h3 {
        font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
        font-weight: 700;
        line-height: 1.05;
        margin: 0;
        letter-spacing: .2px;
    }

    .frcar ul {
        margin: 0;
        padding: 0;
        list-style: none
    }

        .frcar ul li {
            margin: 0
        }
    /* A legacy global li rule uses !important (Calibri 20px black), so list items need !important here, scoped to .frcar only */
    .frcar li {
        font-family: 'Figtree',Arial,sans-serif !important;
        font-size: inherit !important;
        line-height: 1.5 !important;
        color: inherit !important;
        text-align: left !important
    }
    /* Same legacy issue on h2 (Calibri 26px black !important), so section headings are locked here too */
    .frcar h2.frcar-h2 {
        font-family: 'Barlow Condensed','Arial Narrow',sans-serif !important;
        font-size: 40px !important;
        line-height: 1.05 !important;
        font-weight: 700 !important;
        color: var(--frcar-navy) !important
    }

    .frcar .frcar-close h2.frcar-h2 {
        color: #fff !important
    }

/* Layout */
.frcar-wrap {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 20px
}

.frcar-sec {
    padding: 64px 0
}

.frcar-sec-alt {
    background: var(--frcar-bg)
}

.frcar-h2 {
    font-size: 40px;
    color: var(--frcar-navy);
    margin-bottom: 14px
}

.frcar-lead {
    font-size: 18px;
    color: var(--frcar-muted);
    max-width: 680px;
    margin-bottom: 34px
}

/* Hero */
.frcar-hero {
    background: var(--frcar-navy);
    background-image: repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 120px);
    color: #fff;
    padding: 40px 0 44px;
    border-bottom: 6px solid var(--frcar-red);
}

.frcar-hero-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 48px;
    align-items: center
}

.frcar-hero h1 {
    font-size: 50px;
    color: #fff;
    margin-bottom: 14px
}

.frcar-estes .frcar-hero h1 {
    font-size: 44px
}

.frcar-hero-sub {
    font-size: 19px;
    color: #c9d6e6;
    max-width: 560px;
    margin-bottom: 18px
}

.frcar-checks {
    color: #fff;
    font-size: 17px
}

    .frcar-checks li {
        position: relative;
        padding-left: 32px;
        margin-bottom: 8px
    }

        .frcar-checks li::before {
            content: "";
            position: absolute;
            left: 0;
            top: 5px;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: var(--frcar-blue);
            box-shadow: inset 0 0 0 5px var(--frcar-blue),inset 0 0 0 9px #fff;
        }

.frcar-cta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
    margin-top: 22px
}

.frcar-btn {
    display: inline-block;
    background: var(--frcar-red);
    color: #fff;
    font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
    font-weight: 700;
    font-size: 22px;
    padding: 14px 30px;
    border-radius: 6px;
    text-decoration: none;
    letter-spacing: .3px;
    transition: background .15s ease;
}

.frcar a.frcar-btn {
    color: #fff;
    text-decoration: none
}

    .frcar a.frcar-btn:hover, .frcar a.frcar-btn:focus {
        background: #c11d18;
        color: #fff
    }

    .frcar a.frcar-btn:focus-visible {
        outline: 3px solid #fff;
        outline-offset: 3px
    }

.frcar-cta-note {
    font-size: 15px;
    color: #c9d6e6
}

/* Hero carrier label (signature element) */
.frcar-label {
    background: #fff;
    color: var(--frcar-navy);
    border-radius: 4px;
    box-shadow: 0 18px 40px rgba(0,0,0,.35);
    transform: rotate(-1.5deg);
    font-size: 15px;
    overflow: hidden;
}

.frcar-label-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 2px solid var(--frcar-navy)
}

.frcar-label-name {
    font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 1
}

.frcar-label-tag {
    background: var(--frcar-navy);
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    padding: 4px 10px;
    border-radius: 3px
}

.frcar-label-grid {
    display: grid;
    grid-template-columns: 1fr 1fr
}

.frcar-label-cell {
    padding: 12px 18px;
    border-bottom: 1px solid var(--frcar-line)
}

    .frcar-label-cell:nth-child(odd) {
        border-right: 1px solid var(--frcar-line)
    }

.frcar-label-cell-wide {
    grid-column: 1 / -1;
    border-right: 0
}

.frcar-label-k {
    display: block;
    font-size: 12px;
    color: var(--frcar-muted);
    margin-bottom: 2px
}

.frcar-label-v {
    display: block;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.3
}

.frcar-label-bar {
    height: 54px;
    margin: 14px 18px 6px;
    background: repeating-linear-gradient(90deg,var(--frcar-navy) 0 2px,transparent 2px 4px,var(--frcar-navy) 4px 7px,transparent 7px 9px,var(--frcar-navy) 9px 10px,transparent 10px 13px);
}

.frcar-label-foot {
    padding: 0 18px 14px;
    font-size: 12px;
    color: var(--frcar-muted);
    letter-spacing: 2px
}

/* Trust strip */
.frcar-trust {
    background: #fff;
    border-bottom: 1px solid var(--frcar-line)
}

    .frcar-trust ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px 44px;
        padding: 18px 0
    }

    .frcar-trust ul {
        color: var(--frcar-navy);
        font-size: 16px
    }

    .frcar-trust li {
        font-weight: 600
    }

    .frcar-trust strong {
        color: var(--frcar-blue)
    }

/* Why FreightRun */
.frcar-why {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px 48px
}

.frcar-why-item {
    border-left: 4px solid var(--frcar-blue);
    padding: 4px 0 4px 20px
}

.frcar-why-t {
    font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--frcar-navy);
    margin-bottom: 6px;
    line-height: 1.1
}

.frcar-why-item p {
    color: var(--frcar-muted);
    margin: 0
}

/* About AAA Cooper */
.frcar-about {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 48px;
    align-items: start
}

.frcar-svc {
    background: #fff;
    border: 1px solid var(--frcar-line);
    border-radius: 8px;
    padding: 26px 28px
}

.frcar-svc-t {
    font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--frcar-navy);
    margin-bottom: 12px
}

.frcar-svc li {
    padding: 10px 0;
    border-bottom: 1px solid var(--frcar-line);
    display: flex;
    justify-content: space-between;
    gap: 12px
}

    .frcar-svc li:last-child {
        border-bottom: 0
    }

    .frcar-svc li span {
        color: var(--frcar-muted);
        font-size: 15px;
        text-align: right
    }

/* Steps (real sequence) */
.frcar-steps {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 32px;
    counter-reset: frcarstep
}

.frcar-step {
    position: relative;
    padding-top: 58px
}

    .frcar-step::before {
        counter-increment: frcarstep;
        content: counter(frcarstep);
        position: absolute;
        top: 0;
        left: 0;
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: var(--frcar-navy);
        color: #fff;
        font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
        font-weight: 700;
        font-size: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .frcar-step:not(:last-child)::after {
        content: "";
        position: absolute;
        top: 22px;
        left: 56px;
        right: -20px;
        border-top: 2px dashed #b9c7d8;
    }

.frcar-step-t {
    font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--frcar-navy);
    margin-bottom: 6px;
    line-height: 1.1
}

.frcar-step p {
    color: var(--frcar-muted);
    margin: 0
}

/* After booking */
.frcar-after {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 0;
    border-top: 2px solid var(--frcar-navy)
}

.frcar-after-item {
    padding: 24px 24px 8px 0
}

    .frcar-after-item + .frcar-after-item {
        padding-left: 24px;
        border-left: 1px solid var(--frcar-line)
    }

.frcar-after-t {
    font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--frcar-navy);
    margin-bottom: 6px;
    line-height: 1.1
}

.frcar-after-item p {
    color: var(--frcar-muted)
}

/* FAQ */
.frcar-faq {
    max-width: 820px
}

    .frcar-faq details {
        border-bottom: 1px solid var(--frcar-line)
    }

    .frcar-faq summary {
        cursor: pointer;
        list-style: none;
        padding: 18px 40px 18px 0;
        position: relative;
        font-weight: 700;
        font-size: 18px;
        color: var(--frcar-navy);
    }

        .frcar-faq summary::-webkit-details-marker {
            display: none
        }

        .frcar-faq summary::after {
            content: "+";
            position: absolute;
            right: 6px;
            top: 12px;
            font-size: 28px;
            font-weight: 400;
            color: var(--frcar-blue);
            transition: transform .2s ease;
        }

    .frcar-faq details[open] summary::after {
        transform: rotate(45deg)
    }

    .frcar-faq summary:focus-visible {
        outline: 3px solid var(--frcar-blue);
        outline-offset: 2px
    }

    .frcar-faq details p {
        color: var(--frcar-muted);
        padding-right: 40px
    }

/* Closing CTA */
.frcar-close {
    background: var(--frcar-blue);
    color: #fff;
    padding: 56px 0;
    text-align: center
}

    .frcar-close .frcar-h2 {
        color: #fff
    }

    .frcar-close p {
        color: #e3ecf8;
        font-size: 18px;
        max-width: 620px;
        margin: 0 auto 26px
    }

.frcar-disclaimer {
    font-size: 13px;
    color: var(--frcar-muted);
    text-align: center;
    padding: 22px 20px 34px;
    max-width: 900px;
    margin: 0 auto
}

/* Content blocks for longer carrier pages (tables, bullet lists, images) */
.frcar-sec p {
    max-width: 780px
}

.frcar-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--frcar-line);
    border-radius: 8px;
    background: #fff;
    margin: 6px 0 10px
}

.frcar-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
    min-width: 560px
}

    .frcar-table th {
        background: var(--frcar-navy);
        color: #fff;
        text-align: left;
        font-weight: 700;
        padding: 13px 18px;
        font-size: 15px
    }

    .frcar-table td {
        background: #fff;
        padding: 13px 18px;
        border-top: 1px solid var(--frcar-line);
        vertical-align: top;
        color: var(--frcar-ink)
    }

    .frcar-table tr:nth-child(even) td {
        background: var(--frcar-bg)
    }

    .frcar-table td.frcar-col-label {
        font-weight: 700;
        color: var(--frcar-navy);
        white-space: nowrap
    }

.frcar-table-2 td.frcar-col-label {
    width: 42%
}

.frcar-bullets {
    margin: 8px 0 6px;
    max-width: 860px
}

    .frcar-bullets li {
        position: relative;
        padding: 12px 0 12px 34px;
        border-bottom: 1px solid var(--frcar-line)
    }

        .frcar-bullets li:last-child {
            border-bottom: 0
        }

        .frcar-bullets li::before {
            content: "";
            position: absolute;
            left: 4px;
            top: 21px;
            width: 12px;
            height: 12px;
            background: var(--frcar-red);
            transform: rotate(45deg)
        }

    .frcar-bullets strong {
        color: var(--frcar-navy)
    }

.frcar-img {
    margin: 28px 0 0;
    border-radius: 8px;
    overflow: hidden;
    max-width: 860px
}

    .frcar-img img {
        display: block;
        width: 100%;
        height: auto
    }

.frcar-sec .frcar-btn {
    margin-top: 26px
}

.frcar-two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start
}

@media (max-width:979px) {
    .frcar-two {
        grid-template-columns: 1fr;
        gap: 28px
    }
}

@media (max-width:640px) {
    .frcar-table {
        font-size: 15px
    }

        .frcar-table th, .frcar-table td {
            padding: 11px 12px
        }
}

/* Related links grid (keeps SEO cross links tidy on carrier pages) */
.frcar-links {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 12px
}

    .frcar-links a {
        display: block;
        background: #fff;
        border: 1px solid var(--frcar-line);
        border-radius: 8px;
        padding: 14px 16px;
        font-weight: 600;
        color: var(--frcar-navy);
        text-decoration: none;
        transition: border-color .15s ease
    }

        .frcar-links a:hover, .frcar-links a:focus {
            border-color: var(--frcar-blue);
            color: var(--frcar-blue)
        }

        .frcar-links a span {
            display: block;
            font-weight: 400;
            font-size: 14px;
            color: var(--frcar-muted);
            margin-top: 2px
        }

@media (max-width:979px) {
    .frcar-links {
        grid-template-columns: 1fr 1fr
    }
}

@media (max-width:640px) {
    .frcar-links {
        grid-template-columns: 1fr
    }
}

/* Quote shell: sits OUTSIDE .frcar. The injected form uses its own fixed 940px Bootstrap container,
   so the shell adds NO side padding, border, or width limit around #quote-frm. Heading only gets styling. */
.frcarq {
    background: #f7f9fc;
    padding: 44px 0 52px;
    scroll-margin-top: 90px;
    font-family: 'Figtree',Arial,sans-serif
}

.frcarq-head {
    font-family: 'Barlow Condensed','Arial Narrow',sans-serif;
    font-weight: 700;
    font-size: 36px;
    line-height: 1.1;
    color: #0D2137;
    margin: 0 0 6px;
    padding-left: 14px;
    border-left: 6px solid #1565C0
}

.frcarq-sub {
    font-size: 16px;
    color: #5b6b7e;
    margin: 0 0 22px;
    max-width: 720px
}

@media (max-width:979px) {
    .frcar-hero-grid, .frcar-about {
        grid-template-columns: 1fr;
        gap: 40px
    }

    .frcar-label {
        max-width: 460px;
        transform: none
    }

    .frcar-steps, .frcar-after {
        grid-template-columns: 1fr
    }

    .frcar-step:not(:last-child)::after {
        display: none
    }

    .frcar-after-item, .frcar-after-item + .frcar-after-item {
        padding: 22px 0 6px;
        border-left: 0;
        border-bottom: 1px solid var(--frcar-line)
    }
}

@media (max-width:640px) {
    .frcar {
        font-size: 16px
    }

    .frcar-sec {
        padding: 46px 0
    }

    .frcar-hero {
        padding: 32px 0 36px
    }

        .frcar-hero h1, .frcar-estes .frcar-hero h1 {
            font-size: 36px
        }

    .frcar-label {
        display: none
    }

    .frcar h2.frcar-h2 {
        font-size: 32px !important
    }

    .frcar-why {
        grid-template-columns: 1fr
    }

    .frcar-btn {
        width: 100%;
        text-align: center
    }

    .frcarq {
        padding: 28px 0 36px
    }

    .frcarq-head, .frcarq-sub {
        margin-left: 12px;
        margin-right: 12px
    }

    .frcarq-head {
        font-size: 28px
    }
}

@media (prefers-reduced-motion:reduce) {
    .frcar *, .frcar *::after {
        transition: none
    }

    .frcarq {
        scroll-behavior: auto
    }
}