/* Scoped, standalone FAQ. No framework or remote font dependencies. */
.wi-faq {
    --gold: #c89b3c;
    --ink: #0a0a0a;
    --crimson: #b31217;
    --burgundy: #6f0b0b;
    --ivory: #f7edda;
    position: relative;
    isolation: isolate;
    width: 100%;
    background: #faf8f4;
    color: var(--ink);
    font: 16px/1.6 Arial, Helvetica, sans-serif;
    user-select: none;
    -webkit-user-select: none;
    container-type: inline-size;
}

    .wi-faq *,
    .wi-faq *::before,
    .wi-faq *::after {
        box-sizing: border-box;
    }

    .wi-faq::before {
        content: "";
        position: absolute;
        inset: 0 0 0 24%;
        z-index: -2;
        background: url("assets/faq-ambiance.png") right center/cover no-repeat;
        pointer-events: none;
    }

    .wi-faq::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient( 90deg, #faf8f4 0%, #faf8f4 35%, #faf8f4f5 43%, #faf8f4bd 51%, #faf8f400 65% );
        pointer-events: none;
    }

.wi-faq__inner {
    max-width: 1536px;
    margin: auto;
    padding: 46px 5.65% 74px;
    min-height: 960px;
}

.wi-faq__content {
    width: 51%;
    max-width: 700px;
}

.wi-faq p,
.wi-faq h2,
.wi-faq h3 {
    margin: 0;
}

.wi-faq__eyebrow {
    display: flex;
    align-items: center;
    gap: 28px;
    font-size: 12px;
    letter-spacing: 4px;
}

    .wi-faq__eyebrow span {
        width: 46px;
        height: 1px;
        background: var(--ink);
    }

.wi-faq__title {
    font: bold clamp(76px, 7.5cqi, 112px) / 1 Georgia, "Times New Roman", serif !important;
    letter-spacing: -5px;
    padding-top: 22px;
}

.wi-faq__tagline {
    font: italic clamp(25px, 3cqi, 44px) / 1.15 Georgia, "Times New Roman", serif;
    letter-spacing: -1.4px;
    margin: 4px 0 14px !important;
}

    .wi-faq__tagline em {
        color: var(--burgundy);
        font-weight: 400;
    }

.wi-faq__intro {
    max-width: 535px;
    font-size: 16px;
    letter-spacing: 0.45px;
    color: #42403d;
    line-height: 1.65;
    margin-bottom: 22px !important;
}

.wi-faq__list {
    counter-reset: faq-question;
    border-top: 1px solid #767069;
    margin-top: 24px;
}

.wi-faq__item {
    counter-increment: faq-question;
    border-bottom: 1px solid #767069;
}

.wi-faq__question {
    font: inherit;
}

.wi-faq__trigger {
    display: flex;
    align-items: center;
    gap: 22px;
    width: 100%;
    min-height: 55px;
    border: 0;
    border-radius: 0;
    padding: 12px 8px 12px 0;
    background: transparent;
    color: inherit;
    text-align: left;
    font: 20px/1.35 Georgia, "Times New Roman", serif;
    cursor: pointer;
    touch-action: manipulation;
    transition: background 0.2s, color 0.2s;
}

    .wi-faq__trigger:hover {
        background: #f7edda85;
        color: var(--burgundy);
    }

    .wi-faq__trigger:focus-visible {
        outline: 2px solid var(--gold);
        outline-offset: 3px;
    }

.wi-faq__number {
    flex: 0 0 32px;
    font: 12px/1 Arial, sans-serif;
    letter-spacing: 1px;
    color: #48443f;
    user-select: none;
    -webkit-user-select: none;
}

    .wi-faq__number::before {
        content: counter(faq-question, decimal-leading-zero);
    }

.wi-faq__question-text,
.wi-faq__answer,
.wi-faq__answer * {
    user-select: text;
    -webkit-user-select: text;
}

.wi-faq__plus {
    position: relative;
    flex: 0 0 16px;
    height: 16px;
    margin-left: auto;
    user-select: none;
}

    .wi-faq__plus::before,
    .wi-faq__plus::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        width: 16px;
        height: 1px;
        background: currentColor;
    }

    .wi-faq__plus::after {
        transform: rotate(90deg);
        transition: transform 0.22s;
    }

.wi-faq__trigger[aria-expanded="true"] {
    color: var(--burgundy);
}

    .wi-faq__trigger[aria-expanded="true"] .wi-faq__plus::after {
        transform: rotate(0);
    }

.wi-faq__answer {
    padding: 0 36px 20px 54px;
    font-size: 14px;
    line-height: 1.75;
    color: #42403d;
    animation: wi-faq-answer 0.2s ease-out;
}

    .wi-faq__answer[hidden] {
        display: none !important;
    }

.wi-faq__closing {
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: 10px;
    letter-spacing: 3px;
    margin-top: 48px !important;
}

    .wi-faq__closing span {
        width: 40px;
        height: 1px;
        background: var(--ink);
        flex-shrink: 0;
    }

@keyframes wi-faq-answer {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Exact hero CTA rules, scoped to the FAQ. */
.wi-faq__contact {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    min-height: 46px;
    padding: 12px 23px;
    border-radius: 0px;
    background: #0a0a0a;
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.3px;
    box-shadow: 0 5px 18px #0a0a0a15;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    transition: transform 0.25s, box-shadow 0.25s;
}

    .wi-faq__contact::before {
        content: "";
        position: absolute;
        z-index: -1;
        inset: -80% -35%;
        background: radial-gradient(ellipse at 15% 80%, #c89b3c 0, transparent 55%), radial-gradient(ellipse at 85% 20%, #b31217 0, transparent 55%);
        opacity: 0.55;
        transform: translateX(-8%);
        transition: transform 0.5s, opacity 0.4s;
    }

    .wi-faq__contact:hover::before,
    .wi-faq__contact:focus-visible::before {
        opacity: 1;
        transform: translateX(8%) rotate(8deg);
    }

    .wi-faq__contact:hover {
        transform: translateY(-2px);
        box-shadow: -5px 5px 18px #c89b3c25, 5px 4px 18px #b3121725;
    }

    .wi-faq__contact:focus-visible {
        outline: 3px solid var(--gold);
        outline-offset: 5px;
    }

    .wi-faq__contact svg {
        transition: transform 0.25s;
    }

    .wi-faq__contact:hover svg {
        transform: translateX(3px);
    }

@container (max-width:1000px) {
    .wi-faq__content {
        width: 64%;
    }

    .wi-faq::after {
        background: linear-gradient( 90deg, #faf8f4 15%, #faf8f4f5 52%, #faf8f400 100% );
    }

    .wi-faq__inner {
        min-height: 850px;
    }

    .wi-faq__tagline {
        font-size: 32px;
    }
}

@container (max-width:650px) {
    .wi-faq__inner {
        padding: 36px 24px 42px;
        min-height: 0;
    }

    .wi-faq__content {
        width: 100%;
        max-width: none;
    }

    .wi-faq::before {
        inset: 0;
        background-position: 65% top;
        opacity: 0.16;
    }

    .wi-faq::after {
        background: linear-gradient(90deg, #faf8f4f5, #faf8f4d9);
    }

    .wi-faq__eyebrow {
        font-size: 9px;
        letter-spacing: 2.7px;
        gap: 16px;
    }

    .wi-faq__title {
        font-size: 80px !important;
        padding-top: 20px;
    }

    .wi-faq__tagline {
        font-size: 30px;
        letter-spacing: -0.8px;
    }

    .wi-faq__intro {
        font-size: 14px;
    }

    .wi-faq__trigger {
        font-size: 18px;
        gap: 12px;
        min-height: 64px;
    }

    .wi-faq__number {
        flex-basis: 24px;
        font-size: 10px;
    }

    .wi-faq__answer {
        padding-left: 36px;
        padding-right: 16px;
    }

    .wi-faq__closing {
        letter-spacing: 2px;
        font-size: 9px;
        gap: 14px;
        margin-top: 34px !important;
    }

    .wi-faq__contact {
        min-height: 44px;
        padding: 11px 22px;
        font-size: 12px;
        gap: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wi-faq *,
    .wi-faq *::before,
    .wi-faq *::after {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}

/* Contact and shopping additions. Bootstrap owns the outer .container. */
.wi-faq__contact {
    border: 0;
    cursor: pointer;
    font-family: inherit;
    line-height: 1.6;
}

.wi-faq__continue {
    margin-top: 26px;
}

.wi-faq__modal {
    color: var(--ink);
    background: #faf8f4;
    border: 1px solid #c89b3c70;
    border-top: 3px solid var(--gold);
    width: min(540px, calc(100% - 32px));
    max-height: calc(100dvh - 32px);
    margin: auto;
    padding: 38px;
    overflow: auto;
    box-shadow: 0 24px 90px #0005;
    font: 15px/1.6 Arial, Helvetica, sans-serif;
}

    .wi-faq__modal[open] {
        animation: wi-faq-answer 0.22s ease-out;
    }

    .wi-faq__modal::backdrop {
        background: #0a0a0aa6;
    }

.wi-faq__dismiss {
    position: absolute;
    right: 12px;
    top: 8px;
    width: 44px;
    height: 44px;
    border: 0;
    background: transparent;
    color: var(--burgundy);
    font-size: 30px;
    cursor: pointer;
}

.wi-faq__modal-eyebrow {
    font-size: 10px;
    letter-spacing: 3px;
    color: var(--burgundy);
}

.wi-faq__modal-title {
    font: 36px/1.12 Georgia, serif !important;
    margin: 14px 0 !important;
}

    .wi-faq__modal-title em {
        color: var(--burgundy);
    }

.wi-faq__modal-intro {
    color: #57514b;
    font-size: 14px;
    margin-bottom: 24px !important;
}

.wi-faq__form label {
    display: block;
    font-size: 12px;
    letter-spacing: 0.4px;
    margin-top: 18px;
}

.wi-faq__form input,
.wi-faq__form textarea {
    display: block;
    width: 100%;
    margin-top: 7px;
    border: 1px solid #bdb3a2;
    border-radius: 0;
    background: #fffdf9;
    color: var(--ink);
    padding: 12px;
    font: 16px/1.5 Arial, sans-serif;
    user-select: text;
    -webkit-user-select: text;
}

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

    .wi-faq__form input:focus,
    .wi-faq__form textarea:focus {
        outline: 2px solid var(--gold);
        outline-offset: 2px;
    }

.wi-faq__dismiss:focus-visible {
    outline: 2px solid var(--gold);
}

.wi-faq__form-status {
    font-size: 13px;
    color: var(--burgundy);
    margin: 14px 0 !important;
}

.wi-faq__contact:disabled {
    opacity: 0.6;
    cursor: wait;
}

@media (max-width: 480px) {
    .wi-faq__modal {
        padding: 30px 22px;
    }

    .wi-faq__modal-title {
        font-size: 30px !important;
    }
}