/* ============================================================
   CONTACT PAGE  (contact.php)
   Figma: "Contact us page" — frame 480:1046 (desktop),
   480:1501 (tablet), 480:1992 (phone)
============================================================ */

/* ---- Philosophy strip ----
   Contact-specific classes: fully independent of the homepage's
   .philosophy-section / .philosophy-heading styles in style.css.
   Only the .js-scroll-reveal scroll-word effect (main.js) is shared. */
.contact-philosophy {
    background: var(--cream);
    /* fixed header is 90px tall — generous vertical padding makes the strip
       read as its own moment; bottom keeps the about image well below */
    padding: 320px 200px 340px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.contact-philosophy-heading {
    text-align: center;
    width: 100%;
    margin-bottom: 0;
}
/* fluid size — scales with the viewport between the two bounds */
.contact-philosophy-heading h2 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: clamp(34px, 4vw, 58px);
    font-weight: 600;
    color: #667085;
    line-height: 1.21;
    letter-spacing: 0;
}
.contact-philosophy-heading h2 em { font-style: italic; color: var(--gold); }

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width: 743px) {
    .contact-philosophy { padding: 180px 24px 160px; }
    .contact-philosophy-heading h2 { font-size: 34px; }
}