﻿body.about-page { background: #fff; color: #302724; }
.about-page-main { --about-green: #c98f86; --about-dark: #263a20; max-width: 1440px; margin: auto; padding: clamp(28px, 6vw, 84px) clamp(16px, 5vw, 72px); }
.about-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(28px, 6vw, 80px); max-width: 1220px; margin: 0 auto; padding: clamp(18px, 4vw, 48px); border-radius: 22px; background-color: #f8f5f1; background-image: var(--about-page-background-image); background-position: center; background-size: cover; }
.about-story-image { margin: 0; overflow: hidden; border-radius: 18px; background: #fbf5f3; }
.about-story-image img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.about-eyebrow { color: var(--about-green); font-size: 10px; font-weight: 700; letter-spacing: 2px; }
.about-story-copy h1 { margin: 14px 0 20px; color: var(--about-dark); font-size: clamp(34px, 4.5vw, 58px); font-weight: 500; letter-spacing: -1.5px; line-height: 1.08; }
.about-story-copy p { max-width: 560px; color: #716f67; font-size: 15px; line-height: 1.9; }
.about-story-copy .about-details-content { max-width: 560px; color: #716f67; font-size: 15px; line-height: 1.9; }
.about-story-copy .about-details-content > :last-child { margin-bottom: 0; }
.about-intro-cta { display: inline-flex; align-items: center; gap: 14px; margin-top: 14px; padding: 13px 18px; border-radius: 6px; background: var(--about-green); color: #fff; font-size: 13px; text-decoration: none; }
.about-intro-cta:hover { background: #9b6259; color: #fff; }
.about-page-main a:focus-visible { outline: 2px solid #9b6259; outline-offset: 4px; }
@media (max-width: 767.98px) {
    .about-page-main { padding-block: 28px 48px; }
    .about-story { grid-template-columns: 1fr; gap: 26px; }
    .about-story-image img { aspect-ratio: 4 / 3; }
}
