.about-page .about { padding: 65px 0 85px; background: #f6f3ed; }
.about-page .about::before, .about-page .about::after { display: none; }
.about-page .about > .wrap { display: block; }
.about-intro { max-width: 760px; margin: 0 auto 44px; text-align: center; }
.about-eyebrow { display: block; font-size: .65rem; letter-spacing: .15em; color: var(--rose-deep); margin-bottom: 18px; }
.about-intro h1 { font: 400 clamp(2.5rem, 5vw, 4.3rem)/1.08 Georgia, serif; letter-spacing: -.035em; }
.about-intro > p { font-size: .95rem; color: var(--muted); margin-top: 22px; }
.about-story { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 50px; padding: 30px; background: #fffdf9; border: 1px solid #dfd8cd; border-radius: 14px; }
.about-story > img { width: 100%; height: auto; aspect-ratio: 1.1; object-fit: cover; border-radius: 8px; }
.about-year { display: block; font: italic 3.7rem/1 Georgia, serif; color: var(--rose-deep); margin-bottom: 22px; }
.about-story h2 { font: 400 clamp(1.8rem, 3vw, 2.6rem)/1.15 Georgia, serif; }
.about-story p, .about-purpose p { color: var(--muted); font-size: .88rem; line-height: 1.85; margin-top: 18px; }
.about-story a { display: inline-flex; gap: 20px; border-bottom: 1px solid var(--rose-deep); color: var(--rose-deep); padding: 8px 0; font-size: .8rem; margin-top: 20px; }
.about-purpose-grid { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 26px; margin-top: 30px; align-items: stretch; }
.about-purpose { min-width: 0; padding: 34px; border: 1px solid #dfd8cd; border-radius: 14px; background: #fffdf9; }
.about-purpose h2 { font: 400 clamp(2rem, 3.3vw, 2.8rem)/1.15 Georgia, serif; letter-spacing: -.035em; color: #704452; }
.about-purpose h2::after { content: ""; display: block; width: 100%; height: 2px; margin-top: 18px; background: linear-gradient(90deg, #b4677a, #d8bd91); border-radius: 2px; }
.about-contact { display:grid; grid-template-columns:190px minmax(0,1fr) auto; align-items:center; gap:34px; margin-top:46px; padding:20px 36px 20px 20px; border:1px solid #875465; border-radius:24px; background:#704452; box-shadow:0 16px 40px #48273514; }
.about-contact-image { width:100%; height:210px; object-fit:cover; border-radius:14px; }
.about-contact h2 { max-width:440px; color:#fffaf3; font:400 clamp(1.9rem,3.2vw,2.65rem)/1.12 Georgia,serif; letter-spacing:-.035em; }
.about-contact h2 em { display:block; color:#eac5c9; font-weight:400; }
.about-contact p { max-width:360px; color:#eadcdd; font-size:.85rem; line-height:1.7; margin-top:16px; }
.about-contact > a { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:52px; padding:16px 22px; border:1px solid #f3e5da; border-radius:12px; background:#fff8ef; color:#704452; box-shadow:0 5px 16px #32141b12; font-size:.82rem; font-weight:600; white-space:nowrap; transition:background .2s,transform .2s; }
.about-contact > a:hover { background:#f0dcda; color:#58323e; transform:translateY(-2px); }
.about-contact > a:focus-visible { outline:2px solid #fff8ef; outline-offset:5px; }
@media(max-width:1000px) { .about-contact { grid-template-columns:155px minmax(0,1fr); gap:24px; padding:20px 26px 24px 20px; } .about-contact-image { grid-row:1/3; height:100%; min-height:230px; } .about-contact > a { justify-self:start; } }
@media(max-width:800px) { .about-story { gap: 28px; padding: 24px; } .about-purpose-grid { grid-template-columns: 1fr; } .about-story h2 { font-size: 1.8rem; } }
@media(max-width:560px) { .about-page .about { padding: 40px 0 55px; } .about-story { grid-template-columns: 1fr; padding: 20px; } .about-purpose { padding: 26px 22px; } .about-contact { grid-template-columns:1fr; gap:22px; padding:16px 16px 24px; border-radius:20px; } .about-contact-image { grid-row:auto; min-height:0; height:190px; object-position:center 58%; } .about-contact > div { padding:0 8px; } .about-contact > a { width:calc(100% - 16px); margin:0 8px; } .about-intro h1 { font-size: 2.5rem; } }
