.contact-hero, .team-hero { width: min(1120px, calc(100% - 40px)); min-height: 360px; display: flex; align-items: center; margin: 10px auto 0; padding: clamp(42px, 7vw, 82px); border-radius: 28px; color: #fff; background: linear-gradient(125deg, rgba(11, 63, 63, .95), rgba(212, 154, 28, .86)), url("../images/happymama - Copy.jpg") center / cover; }
.team-hero { background-image: linear-gradient(125deg, rgba(11, 63, 63, .95), rgba(212, 154, 28, .86)), url("../images/directorman.png"); background-position: center 26%; }
.contact-hero > div, .team-hero > div { max-width: 650px; }.contact-hero .page-eyebrow, .team-hero .page-eyebrow { color: #f7d56b; }.contact-hero h1, .team-hero h1 { margin: 13px 0 18px; font: 700 clamp(2.3rem, 5vw, 4.2rem) / 1.12 "Noto Serif Oriya", serif; }.contact-hero p, .team-hero p { margin: 0; color: #fbf4dc; font-size: 1.06rem; line-height: 1.7; }
.contact-section, .team-section { width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 92px 0; }.contact-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; }.contact-intro h2, .contact-page-form h2 { margin: 14px 0; font: 700 clamp(1.9rem, 3.2vw, 2.8rem) / 1.15 "Noto Serif Oriya", serif; }.contact-intro > p { color: #6b5b4a; line-height: 1.7; }.contact-methods { display: grid; gap: 12px; margin-top: 30px; }.contact-methods a { display: grid; gap: 3px; padding: 17px 20px; border: 1px solid #eadfca; border-radius: 13px; color: #74570b; text-decoration: none; }.contact-methods span { color: #6b5b4a; }.contact-page-form { display: grid; gap: 9px; padding: clamp(26px, 4vw, 42px); border-radius: 20px; background: #f3ead9; }.contact-page-form h2 { margin-top: 0; }.contact-page-form label { font-size: .9rem; font-weight: 700; }.contact-page-form input, .contact-page-form textarea { width: 100%; padding: 12px; border: 1px solid #d8c8a9; border-radius: 8px; font: inherit; background: #fff; }.contact-page-form button { justify-self: start; margin-top: 8px; padding: 13px 22px; border: 0; border-radius: 999px; color: #fff; background: var(--brand-primary); font-weight: 700; cursor: pointer; }
.team-page-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 36px; }.team-page-grid article { overflow: hidden; border: 1px solid #eadfca; border-radius: 18px; background: #fff; box-shadow: 0 10px 25px rgba(83, 62, 15, .05); }.team-page-grid img { display: block; width: 100%; aspect-ratio: .88; object-fit: cover; }.team-page-grid div { padding: 21px; }.team-page-grid h3 { margin: 0 0 6px; font: 700 1.3rem "Noto Serif Oriya", serif; }.team-page-grid p { margin: 0; color: #a6770c; font-weight: 700; }
html[data-theme="dark"] .contact-intro > p, html[data-theme="dark"] .contact-methods span { color: #cfc1aa; } html[data-theme="dark"] .contact-methods a, html[data-theme="dark"] .team-page-grid article { border-color: #514536; background: #30281e; } html[data-theme="dark"] .contact-page-form { background: #2a231a; } html[data-theme="dark"] .contact-page-form input, html[data-theme="dark"] .contact-page-form textarea { border-color: #514536; color: #eee4d1; background: #211c16; } html[data-theme="dark"] .team-page-grid h3 { color: #f8ecd3; }
@media (max-width: 760px) { .contact-hero, .team-hero, .contact-section, .team-section { width: min(100% - 40px, 1120px); }.contact-hero, .team-hero { min-height: 315px; }.contact-section, .team-section { padding: 65px 0; }.contact-layout { grid-template-columns: 1fr; gap: 34px; }.team-page-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 430px) { .contact-hero, .team-hero, .contact-section, .team-section { width: min(100% - 28px, 1120px); }.team-page-grid { grid-template-columns: 1fr; } }