:root {
    --page-ink: var(--brand-ink);
    --page-accent: var(--brand-accent);
    --page-soft: var(--brand-mist);
    --page-bg: var(--brand-bg);
}

.about-page { overflow: hidden; background: var(--page-bg); color: var(--page-ink); }
.about-page__hero { display: grid; min-height: 580px; place-items: center; background: var(--brand-navy); color: var(--shop-block-light-text); text-align: center; }
.about-page__hero-inner { width: min(850px, 90%); padding: 90px 0; }
.about-page__eyebrow { margin: 0 0 18px; color: var(--page-accent); font-size: 14px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.about-page__hero .about-page__eyebrow, .about-page__reviews .about-page__eyebrow { color: var(--brand-lavender); }
.about-page h1 { margin: 0; font-size: clamp(48px, 7vw, 92px); letter-spacing: -.045em; line-height: .98; }
.about-page__hero-inner > p:last-child { max-width: 650px; margin: 30px auto 0; font-size: clamp(18px, 2vw, 24px); }
.about-page__section { display: grid; width: min(1200px, 90%); margin: 0 auto; padding: 130px 0; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: clamp(55px, 8vw, 120px); }
.about-page__section--reverse .about-page__copy { order: 2; }
.about-page__copy h2, .about-page__statement h2, .about-page__belief h2, .about-page__reviews h2, .about-page__faq h2 { margin: 0 0 28px; font-size: clamp(42px, 5.5vw, 72px); letter-spacing: -.04em; line-height: 1; }
.about-page__copy h2 span { color: var(--page-accent); }
.about-page__copy p, .about-page__belief p { margin: 0 0 22px; font-size: 18px; line-height: 1.75; }
.about-page__copy blockquote { margin: 34px 0 0; padding: 24px 28px; border-left: 4px solid var(--page-accent); background: var(--page-soft); font-size: 16px; line-height: 1.7; }
.about-page__media { overflow: hidden; aspect-ratio: 4 / 5; background: var(--page-soft); }
.about-page__media--rounded { border-radius: 36px; }
.about-page__media video { width: 100%; height: 100%; object-fit: cover; }
.about-page__button { display: inline-flex; margin-top: 12px; padding: 15px 28px; border: 2px solid var(--brand-navy); border-radius: 999px; background: var(--brand-navy); color: var(--shop-block-light-text); font-weight: 700; transition: transform .2s ease, background .2s ease; }
.about-page__button:hover { transform: translateY(-2px); background: var(--page-accent); border-color: var(--page-accent); }
.about-page__statement { padding: 140px max(5%, calc((100% - 1000px) / 2)); background: var(--page-soft); text-align: center; }
.about-page__statement > p:last-child { max-width: 800px; margin: 0 auto; font-size: 20px; line-height: 1.75; }
.about-page__belief { display: grid; width: min(1100px, 90%); margin: 0 auto; padding: 140px 0; grid-template-columns: 1fr 1fr; gap: 100px; }
.about-page__reviews { padding: 140px 5%; background: var(--brand-navy); color: var(--shop-block-light-text); text-align: center; }
.about-page__reviews p { margin: 0 0 10px; font-size: 20px; }
.about-page__button--light { border-color: var(--shop-block-light-text); background: var(--shop-block-light-text); color: var(--brand-navy); }

html body .page-light-button.shop-button {
    border: 2px solid var(--shop-block-light-text) !important;
    background: var(--shop-block-light-text) !important;
    color: var(--brand-navy) !important;
    text-decoration: none !important;
}

html body .page-light-button.shop-button:hover,
html body .page-light-button.shop-button:focus-visible {
    background: var(--brand-mist) !important;
    color: var(--brand-accent) !important;
}

html body .page-light-button.shop-button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--brand-lavender) 55%, transparent) !important;
    outline-offset: 3px !important;
}
.about-page__faq { width: min(1000px, 90%); margin: 0 auto; padding: 140px 0; }
.about-page__accordion { margin-top: 55px; border-top: 1px solid color-mix(in srgb, var(--brand-ink) 20%, transparent); }
.about-page__faq-item { border-bottom: 1px solid color-mix(in srgb, var(--brand-ink) 20%, transparent); }
.about-page__faq-item h3 { margin: 0; }
.about-page__faq-item button { display: flex; width: 100%; padding: 28px 0; align-items: center; justify-content: space-between; gap: 30px; background: transparent; color: var(--page-ink); text-align: left; font-size: 20px; }
.about-page__faq-icon { position: relative; width: 22px; height: 22px; flex: 0 0 22px; }
.about-page__faq-icon::before, .about-page__faq-icon::after { position: absolute; top: 10px; left: 2px; width: 18px; height: 2px; background: var(--page-accent); content: ''; transition: transform .2s ease; }
.about-page__faq-icon::after { transform: rotate(90deg); }
.about-page__faq-item button[aria-expanded="true"] .about-page__faq-icon::after { transform: rotate(0); }
.about-page__faq-answer { overflow: hidden; }
.about-page__faq-answer-inner { padding: 0 55px 28px 0; font-size: 17px; line-height: 1.75; }
.about-page__faq-answer[hidden] { display: none !important; }
.about-page__faq-answer p { margin: 0 0 15px; }
.about-page__faq-answer a { color: var(--page-accent); font-weight: 700; }

@media (max-width: 1024px) {
    .about-page__hero, .about-page__section, .about-page__belief, .about-page__faq { width: 90%; margin-right: auto; margin-left: auto; }
    .about-page__hero { min-height: 500px; }
    .about-page__section { padding: 95px 0; gap: 50px; }
    .about-page__belief { gap: 55px; }
}

@media (max-width: 640px) {
    .about-page__hero, .about-page__section, .about-page__belief, .about-page__faq { width: 95%; margin-right: auto; margin-left: auto; }
    .about-page__hero { min-height: 450px; }
    .about-page__hero-inner { width: 95%; padding: 70px 0; }
    .about-page__section, .about-page__belief { grid-template-columns: 1fr; padding: 70px 0; gap: 40px; }
    .about-page__section--reverse .about-page__copy { order: initial; }
    .about-page__media { aspect-ratio: 4 / 4.5; }
    .about-page__media--rounded { border-radius: 24px; }
    .about-page__statement, .about-page__reviews { padding: 80px 5%; }
    .about-page__faq { padding: 80px 0; }
    .about-page__faq-item button { padding: 22px 0; font-size: 17px; }
}

/* Customer reviews page. */
.reviews-page { overflow: hidden; background: var(--page-bg); color: var(--page-ink); }
.reviews-page__hero { display: grid; min-height: 580px; place-items: center; background: var(--brand-navy); color: var(--shop-block-light-text); text-align: center; }
.reviews-page__hero-inner { width: min(900px, 90%); padding: 90px 0; }
.reviews-page__eyebrow { margin: 0 0 18px; color: var(--page-accent); font-size: 14px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.reviews-page__hero .reviews-page__eyebrow { color: var(--brand-lavender); }
.reviews-page h1 { margin: 0; font-size: clamp(48px, 7vw, 92px); letter-spacing: -.045em; line-height: .98; }
.reviews-page__hero-inner > p:last-child { max-width: 650px; margin: 30px auto 0; font-size: clamp(18px, 2vw, 24px); }
.reviews-page__intro { display: grid; width: min(1100px, 90%); margin: 0 auto; padding: 140px 0; grid-template-columns: 1fr 1fr; align-items: start; gap: clamp(55px, 8vw, 110px); }
.reviews-page__intro h2, .reviews-page__feed h2, .reviews-page__promise h2, .reviews-page__thanks h2 { margin: 0; font-size: clamp(42px, 5.5vw, 72px); letter-spacing: -.04em; line-height: 1; }
.reviews-page__intro h2 span { color: var(--page-accent); }
.reviews-page__intro-copy p { margin: 0 0 28px; font-size: 18px; line-height: 1.75; }
.reviews-page__intro-copy .reviews-page__verified { padding: 24px 28px; border-left: 4px solid var(--page-accent); background: var(--page-soft); font-size: 16px; line-height: 1.7; }
.reviews-page__feed { padding: 130px max(5%, calc((100% - 1200px) / 2)); background: var(--page-soft); }
.reviews-page__feed-header { margin-bottom: 55px; text-align: center; }
.reviews-page__widgets { display: grid; gap: clamp(34px, 5vw, 64px); }
.reviews-page__widget { width: 100%; min-height: 280px; }
.reviews-page__promise { padding: 140px max(5%, calc((100% - 900px) / 2)); background: var(--brand-navy); color: var(--shop-block-light-text); text-align: center; }
.reviews-page__promise .reviews-page__eyebrow { color: var(--brand-lavender); }
.reviews-page__promise > p:not(.reviews-page__eyebrow) { max-width: 720px; margin: 30px auto 0; font-size: 20px; line-height: 1.7; }
.reviews-page__button { margin-top: 36px; }
.reviews-page__thanks { padding: 140px 5%; text-align: center; }
.reviews-page__thanks p { margin: 0 0 18px; color: var(--page-accent); font-size: clamp(18px, 2vw, 24px); font-weight: 700; }

@media (max-width: 1024px) {
    .reviews-page__hero, .reviews-page__intro, .reviews-page__feed, .reviews-page__promise, .reviews-page__thanks { width: 90%; margin-right: auto; margin-left: auto; }
    .reviews-page__hero { min-height: 500px; }
}

@media (max-width: 640px) {
    .reviews-page__hero, .reviews-page__intro, .reviews-page__feed, .reviews-page__promise, .reviews-page__thanks { width: 95%; margin-right: auto; margin-left: auto; }
    .reviews-page__hero { min-height: 450px; }
    .reviews-page__hero-inner { width: 95%; padding: 70px 0; }
    .reviews-page__intro { padding: 80px 0; grid-template-columns: 1fr; gap: 40px; }
    .reviews-page__feed, .reviews-page__promise, .reviews-page__thanks { padding: 80px 5%; }
    .reviews-page__feed-header { margin-bottom: 40px; }
    .reviews-page__widget { min-height: 220px; }
}