/* =========================================================
   FOUR CORNERS – QUOTATION FORM
   Complete CSS replacement
   ========================================================= */

.fcq-wrap {
    --fcq-red: #CA002B;
    --fcq-red-dark: #a90025;
    --fcq-ink: #302c29;
    --fcq-muted: #716b65;
    --fcq-line: #ded4c8;
    --fcq-paper: #ffffff;
    --fcq-warm: #f7f3ed;
    --fcq-selected: #f0e7da;

    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    color: var(--fcq-ink);
    font-family: inherit;
    font-size: 16px;
    line-height: 1.6;
    overflow: hidden;
    isolation: isolate;
}

.fcq-wrap *,
.fcq-wrap *::before,
.fcq-wrap *::after {
    box-sizing: border-box;
}

.fcq-wrap [hidden] {
    display: none !important;
}

/* =========================================================
   HEADINGS
   ========================================================= */

.fcq-heading {
    padding: 15px 0 28px;
}

.fcq-eyebrow,
.fcq-step,
.fcq-field > span {
    display: block;
    color: #987650;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.fcq-heading h2 {
    margin: 10px 0;
    color: var(--fcq-ink);
    font-family: Georgia, serif;
    font-size: clamp(30px, 4vw, 44px);
    font-weight: 400;
    line-height: 1.2;
}

.fcq-heading p {
    margin: 0;
    color: var(--fcq-muted);
    font-size: 16px;
}

/* =========================================================
   TOP TABS
   ========================================================= */

.fcq-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    margin: 0 0 18px;
    overflow: hidden;
    border: 1px solid var(--fcq-line);
    background: var(--fcq-paper);
}

.fcq-wrap .fcq-tab {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 85px;
    margin: 0 !important;
    padding: 18px 22px !important;

    border: 0 !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;

    background: #fff !important;
    color: var(--fcq-ink) !important;

    text-align: left !important;
    cursor: pointer;
    white-space: normal !important;
    box-shadow: none !important;
    transform: none !important;
}

.fcq-wrap .fcq-tab strong {
    display: block;
    margin: 0 0 5px;
    color: inherit;
    font-family: Georgia, serif;
    font-size: 21px;
    font-weight: 400;
    line-height: 1.3;
}

.fcq-wrap .fcq-tab small {
    display: block;
    color: var(--fcq-muted);
    font-size: 13px;
    line-height: 1.5;
}

.fcq-wrap .fcq-tab.is-active {
    background: var(--fcq-selected) !important;
    border-bottom-color: var(--fcq-red) !important;
    color: var(--fcq-ink) !important;
}

.fcq-wrap .fcq-tab:hover {
    background: var(--fcq-warm) !important;
}

/* =========================================================
   FORM PANELS
   ========================================================= */

.fcq-panel {
    width: 100%;
    margin: 18px 0 !important;
    padding: 25px !important;

    border: 1px solid var(--fcq-line) !important;
    border-radius: 0 !important;

    background: var(--fcq-paper) !important;
    overflow: hidden;
}

.fcq-step {
    margin-bottom: 19px;
    font-size: 12px;
    line-height: 1.5;
}

.fcq-step small {
    color: var(--fcq-muted);
    font-family: Georgia, serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

/* =========================================================
   WHAT DO YOU NEED – CHOICE CARDS
   ========================================================= */

.fcq-choice-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    margin: 0;
    padding: 0;

    border: 1px solid var(--fcq-line);
    background: #fff;
    overflow: hidden;
}

.fcq-wrap .fcq-choice {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 125px;
    margin: 0 !important;
    padding: 20px !important;

    border: 0 !important;
    border-right: 1px solid var(--fcq-line) !important;
    border-radius: 0 !important;

    background: #fff !important;
    color: var(--fcq-ink) !important;

    text-align: left !important;
    vertical-align: top;
    cursor: pointer;

    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;

    box-shadow: none !important;
    transform: none !important;
}

.fcq-wrap .fcq-choice:last-child {
    border-right: 0 !important;
}

.fcq-wrap .fcq-choice span {
    display: block !important;
    margin: 0 0 8px !important;

    color: var(--fcq-ink) !important;
    font-family: Georgia, serif !important;
    font-size: 19px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
}

.fcq-wrap .fcq-choice small {
    display: block !important;
    color: var(--fcq-muted) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;

    white-space: normal !important;
    overflow-wrap: break-word !important;
}

.fcq-wrap .fcq-choice.is-selected {
    background: var(--fcq-selected) !important;
    box-shadow: inset 0 3px 0 var(--fcq-red) !important;
}

.fcq-wrap .fcq-choice:hover {
    background: var(--fcq-warm) !important;
}

/* =========================================================
   PROJECT SIZE FIELDS
   ========================================================= */

.fcq-fields {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: end;
    gap: 18px;
    width: 100%;
}

.fcq-field {
    display: flex !important;
    flex-direction: column;
    gap: 8px;

    width: 100%;
    min-width: 0;
    margin: 0;
}

.fcq-field > span {
    color: #625a52;
    font-size: 12px;
    letter-spacing: 1.2px;
}

.fcq-field em {
    float: right;
    color: var(--fcq-muted);
    font-size: 12px;
    font-style: normal;
    letter-spacing: 0;
    text-transform: none;
}

.fcq-field input,
.fcq-field select,
.fcq-field textarea {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 12px 14px !important;

    border: 1px solid #cfc2b3 !important;
    border-radius: 0 !important;

    background: #fff !important;
    color: var(--fcq-ink) !important;

    font-family: inherit !important;
    font-size: 16px !important;
    line-height: 1.4 !important;

    box-shadow: none !important;
}

.fcq-field input:focus,
.fcq-field select:focus,
.fcq-field textarea:focus {
    border-color: var(--fcq-red) !important;
    outline: none !important;
}

.fcq-field textarea {
    min-height: 110px;
    resize: vertical;
}

.fcq-input-unit {
    position: relative;
    width: 100%;
}

.fcq-input-unit input {
    padding-right: 65px !important;
}

.fcq-unit-label {
    position: absolute;
    top: 50%;
    right: 13px;
    transform: translateY(-50%);

    color: #80766c;
    font-size: 11px;
    letter-spacing: 1px;
    pointer-events: none;
}

/* =========================================================
   AREA UNIT SWITCH
   ========================================================= */

.fcq-unit-toggle {
    display: flex !important;
    align-items: stretch;
    width: fit-content;
    max-width: 100%;
    height: 50px;

    border: 1px solid var(--fcq-line);
    background: var(--fcq-warm);
    overflow: hidden;
}

.fcq-wrap .fcq-unit-toggle button {
    min-width: 65px !important;
    margin: 0 !important;
    padding: 0 16px !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: var(--fcq-warm) !important;
    color: var(--fcq-muted) !important;

    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    cursor: pointer;
    box-shadow: none !important;
}

.fcq-wrap .fcq-unit-toggle button.is-active {
    background: var(--fcq-ink) !important;
    color: #fff !important;
}

/* =========================================================
   PACKAGE CARDS
   ========================================================= */

.fcq-packages {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    margin: 0;
    padding: 0;

    border: 1px solid var(--fcq-line);
    background: #fff;
    overflow: hidden;
}

.fcq-wrap .fcq-package {
    position: relative;
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 100%;

    margin: 0 !important;
    padding: 23px 20px !important;

    border: 0 !important;
    border-right: 1px solid var(--fcq-line) !important;
    border-radius: 0 !important;

    background: #fff !important;
    color: var(--fcq-ink) !important;

    text-align: left !important;
    vertical-align: top;

    cursor: pointer;
    white-space: normal !important;
    overflow-wrap: break-word !important;

    box-shadow: none !important;
    transform: none !important;
}

.fcq-wrap .fcq-package:last-child {
    border-right: 0 !important;
}

.fcq-wrap .fcq-package.is-selected {
    background: var(--fcq-selected) !important;
    box-shadow: inset 0 3px 0 var(--fcq-red) !important;
}

.fcq-wrap .fcq-package:hover {
    background: var(--fcq-warm) !important;
}

.fcq-package-title {
    display: block !important;
    margin: 0 0 9px !important;

    color: var(--fcq-ink) !important;
    font-family: Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
}

.fcq-package > small {
    display: block !important;
    margin: 0 0 15px !important;

    color: var(--fcq-muted) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.fcq-package p {
    display: block !important;
    margin: 9px 0 !important;
    padding: 0 !important;

    color: #625b54 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.65 !important;

    white-space: normal !important;
    overflow-wrap: break-word !important;
}

.fcq-package p b {
    color: #39332e !important;
    font-weight: 600 !important;
}

.fcq-recommended {
    position: absolute !important;
    top: 25px !important;
    right: 16px !important;

    display: block;
    max-width: 45%;

    color: #987650 !important;
    font-size: 10px !important;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 1.4;

    white-space: normal !important;
}

/* =========================================================
   COMPARE SPECIFICATIONS
   ========================================================= */

.fcq-compare {
    margin: 16px 0 !important;
    padding: 17px 20px !important;

    border: 1px solid var(--fcq-line) !important;
    border-radius: 0 !important;

    background: #fff !important;
}

.fcq-compare summary {
    color: var(--fcq-ink);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.1px;
    cursor: pointer;
    list-style: none;
}

.fcq-compare summary::-webkit-details-marker {
    display: none;
}

.fcq-compare-content {
    padding-top: 15px;
    color: var(--fcq-muted);
    font-size: 14px;
    line-height: 1.7;
}

/* =========================================================
   OPTIONAL ADD-ONS
   ========================================================= */

.fcq-addon-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 35px;
    width: 100%;
}

.fcq-addon-grid label {
    display: flex !important;
    align-items: flex-start;
    gap: 11px;

    min-width: 0;
    margin: 0;

    color: #514b45;
    font-size: 14px !important;
    line-height: 1.5 !important;

    cursor: pointer;
}

.fcq-addon-grid input {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin: 3px 0 0;

    accent-color: var(--fcq-red);
    cursor: pointer;
}

.fcq-addon-grid label span {
    display: block;
    min-width: 0;
    overflow-wrap: break-word;
}

.fcq-addon-grid small {
    display: block;
    margin-top: 3px;

    color: #837a71;
    font-size: 12px !important;
    line-height: 1.5;
}

/* =========================================================
   BOTTOM SUMMARY
   ========================================================= */

.fcq-summary {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
}

.fcq-summary-copy {
    flex: 1;
    min-width: 0;
}

.fcq-summary-copy p {
    margin: 0 0 7px;
    color: #625b54;
    font-size: 14px !important;
    line-height: 1.6;
}

.fcq-summary-copy > small {
    color: #837a71;
    font-size: 13px;
}

.fcq-total {
    margin-top: 10px;
    color: var(--fcq-red);
    font-size: 20px;
    font-weight: 600;
}

/* =========================================================
   BUTTONS
   ========================================================= */

.fcq-wrap .fcq-cta,
.fcq-wrap .fcq-submit {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    min-height: 52px !important;
    margin: 0 !important;
    padding: 14px 25px !important;

    border: 1px solid var(--fcq-ink) !important;
    border-radius: 0 !important;

    background: var(--fcq-ink) !important;
    color: #fff !important;

    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    line-height: 1.4 !important;

    text-align: center;
    cursor: pointer;
    white-space: normal !important;

    box-shadow: none !important;
    transform: none !important;
}

.fcq-wrap .fcq-cta:hover,
.fcq-wrap .fcq-submit:hover {
    border-color: var(--fcq-red) !important;
    background: var(--fcq-red) !important;
    color: #fff !important;
}

.fcq-cta span {
    margin-left: 12px;
}

/* =========================================================
   CUSTOMER DETAILS
   ========================================================= */

.fcq-contact > p {
    color: var(--fcq-muted);
    font-size: 15px;
    line-height: 1.6;
}

.fcq-contact .fcq-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fcq-full {
    grid-column: 1 / -1;
}

.fcq-submit-row {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 22px;
}

.fcq-back {
    min-height: 48px;
    padding: 12px 22px;

    border: 1px solid var(--fcq-line);
    border-radius: 0;

    background: #fff;
    color: var(--fcq-ink);

    font-family: inherit;
    font-size: 13px;
    font-weight: 600;

    cursor: pointer;
}

.fcq-back:hover {
    background: var(--fcq-warm);
}

/* =========================================================
   MESSAGES
   ========================================================= */

.fcq-message {
    margin-top: 16px;
    font-size: 14px;
    line-height: 1.6;
}

.fcq-message.is-success {
    color: #287344;
}

.fcq-message.is-error {
    color: #b42318;
}

.fcq-honeypot {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

/* =========================================================
   FOCUS
   ========================================================= */

.fcq-wrap button:focus-visible,
.fcq-wrap input:focus-visible,
.fcq-wrap select:focus-visible,
.fcq-wrap textarea:focus-visible {
    outline: 2px solid var(--fcq-red) !important;
    outline-offset: 3px;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .fcq-wrap {
        font-size: 15px;
    }

    .fcq-panel {
        padding: 20px !important;
    }

    .fcq-choice,
    .fcq-package {
        padding: 17px !important;
    }

    .fcq-package-title {
        font-size: 19px !important;
    }

    .fcq-package p {
        font-size: 13px !important;
    }

    .fcq-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .fcq-heading {
        padding: 10px 0 20px;
    }

    .fcq-heading h2 {
        font-size: 30px;
    }

    .fcq-heading p {
        font-size: 14px;
    }

    .fcq-tabs {
        grid-template-columns: 1fr !important;
    }

    .fcq-wrap .fcq-tab {
        min-height: 70px;
        padding: 15px !important;
        border-bottom: 1px solid var(--fcq-line) !important;
    }

    .fcq-wrap .fcq-tab:last-child {
        border-bottom: 0 !important;
    }

    .fcq-wrap .fcq-tab strong {
        font-size: 19px;
    }

    .fcq-panel {
        margin: 13px 0 !important;
        padding: 17px !important;
    }

    .fcq-choice-grid,
    .fcq-packages {
        grid-template-columns: 1fr !important;
    }

    .fcq-wrap .fcq-choice,
    .fcq-wrap .fcq-package {
        min-height: 0;
        padding: 19px !important;

        border-right: 0 !important;
        border-bottom: 1px solid var(--fcq-line) !important;
    }

    .fcq-wrap .fcq-choice:last-child,
    .fcq-wrap .fcq-package:last-child {
        border-bottom: 0 !important;
    }

    .fcq-wrap .fcq-choice span {
        font-size: 19px !important;
    }

    .fcq-wrap .fcq-choice small {
        font-size: 14px !important;
    }

    .fcq-package-title {
        font-size: 20px !important;
    }

    .fcq-package p {
        font-size: 14px !important;
    }

    .fcq-fields,
    .fcq-contact .fcq-fields {
        grid-template-columns: 1fr !important;
        gap: 15px;
    }

    .fcq-addon-grid {
        grid-template-columns: 1fr !important;
        gap: 16px;
    }

    .fcq-summary {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 18px;
    }

    .fcq-wrap .fcq-cta,
    .fcq-wrap .fcq-submit {
        width: 100% !important;
    }

    .fcq-submit-row {
        flex-direction: column-reverse;
    }

    .fcq-submit-row button {
        width: 100%;
    }

}

/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

    .fcq-wrap {
        font-size: 14px;
    }

    .fcq-panel {
        padding: 13px !important;
    }

    .fcq-step {
        font-size: 11px;
    }

    .fcq-wrap .fcq-choice,
    .fcq-wrap .fcq-package {
        padding: 15px !important;
    }

    .fcq-field input,
    .fcq-field select {
        font-size: 15px !important;
    }

}