@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Serif:ital,wght@1,700&display=swap');

:root {
  --cream: #f4efe7;
  --cream-strong: #eadfce;
  --charcoal: #211b17;
  --charcoal-soft: #342d28;
  --dark-green: #24492a;
  --dark-green-deep: #16331c;
  --amber: #c88a2e;
  --red-orange: #c24f34;
  --white: #ffffff;
  --border-soft: rgba(33, 27, 23, 0.1);
  --border-strong: rgba(33, 27, 23, 0.18);
  --surface-white: rgba(255, 255, 255, 0.92);
  --surface-soft: rgba(255, 250, 244, 0.84);
  --surface-tint: rgba(244, 237, 228, 0.94);
  --surface-green: rgba(36, 73, 42, 0.08);
  --shadow-soft: 0 8px 22px rgba(33, 27, 23, 0.05);
  --shadow-lift: 0 14px 34px rgba(33, 27, 23, 0.07);
  --shadow-card: 0 12px 30px rgba(33, 27, 23, 0.06);
  --text-muted: #5b534b;
  --text-soft: #786e63;
  --font-sans: 'IBM Plex Sans', sans-serif;
  --font-serif: 'IBM Plex Serif', serif;
  --content-max: 1360px;
  --narrow-max: 1120px;
  --measure: 67ch;
  --measure-wide: 76ch;
  --page-gutter: 18px;
  --section-pad: 60px;
  --nav-height: 76px;
}

@media (min-width: 768px) {
  :root {
    --page-gutter: 34px;
    --section-pad: 80px;
    --nav-height: 82px;
  }
}

@media (min-width: 1024px) {
  :root {
    --page-gutter: 52px;
    --section-pad: 104px;
    --nav-height: 88px;
  }
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  overflow-x: hidden;
  background: var(--cream);
}

body {
  min-width: 320px;
  overflow-x: hidden;
  background: var(--cream);
  color: var(--charcoal);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.68;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection {
  background: rgba(194, 79, 52, 0.18);
  color: var(--charcoal);
}

section {
  scroll-margin-top: calc(var(--nav-height) + 18px);
}

img,
video {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration-color: rgba(33, 27, 23, 0.34);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
  transition:
    color 0.2s ease,
    opacity 0.2s ease,
    background-color 0.2s ease,
    border-color 0.2s ease,
    text-decoration-color 0.2s ease;
}

button,
input,
textarea,
select {
  font: inherit;
  color: inherit;
}

main {
  position: relative;
}

main > section {
  position: relative;
  background: transparent;
}

.container,
.about-page__narrow,
.about-page__quote,
.about-page__values,
.architects-page__wrap,
.fyh-wrap,
.showroom-page__wrap,
.showroom-page__narrow,
.contact-page__container {
  width: min(100% - (var(--page-gutter) * 2), var(--content-max));
  margin: 0 auto;
}

.about-page__narrow,
.about-page__quote,
.architects-page__narrow,
.architects-page__center,
.architects-page__quote-wrap,
.fyh-narrow,
.fyh-center,
.showroom-page__narrow,
.contact-page__narrow,
.contact-page__centered {
  max-width: var(--narrow-max);
}

.architects-page__center,
.fyh-center,
.contact-page__centered {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.about-page__values {
  max-width: 1160px;
}

.brand-name,
.nav-logo__name,
.footer-brand-name {
  font-family: var(--font-sans);
  font-style: normal;
  font-weight: 700;
}

.brand-name {
  color: var(--charcoal);
}

.eyebrow,
.about-page__eyebrow,
.architects-page__eyebrow,
.fyh-eyebrow,
.fyh-hero__label,
.showroom-page__eyebrow,
.contact-page__eyebrow,
.showroom-visit__label,
.fyh-card__brands-label,
.stat-label,
.pull-quote-attr {
  font-family: var(--font-sans);
  font-size: clamp(0.74rem, 0.42vw + 0.66rem, 0.86rem);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.eyebrow,
.about-page__eyebrow,
.architects-page__eyebrow,
.fyh-eyebrow,
.fyh-hero__label,
.showroom-page__eyebrow,
.contact-page__eyebrow,
.fyh-card__brands-label,
.stat-label {
  color: var(--text-soft);
}

.about-page__eyebrow--light,
.architects-page__eyebrow--light,
.fyh-eyebrow--light,
.fyh-hero__label--light,
.showroom-page__eyebrow--light {
  color: var(--white);
}

.about-page__title,
.architects-page__title,
.fyh-title,
.showroom-hero__title,
.contact-page__title {
  font-family: var(--font-sans);
  font-size: clamp(2.7rem, 1.7rem + 2.8vw, 4.65rem);
  font-weight: 700;
  line-height: 0.96;
  letter-spacing: -0.05em;
  color: var(--charcoal);
  text-wrap: balance;
}

.journey-headline,
.one-call-headline,
.architect-headline,
.section-headline,
.about-page__heading,
.about-cta__heading,
.architects-page__section-title,
.architects-cta__title,
.fyh-heading,
.fyh-cta__title,
.fyh-promise__title,
.showroom-page__heading,
.contact-page__heading,
.final-cta-headline {
  font-family: var(--font-sans);
  font-size: clamp(2.15rem, 1.48rem + 1.95vw, 3.45rem);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.045em;
  color: var(--charcoal);
  text-wrap: balance;
}

.journey-zero__name,
.journey-list__name,
.about-values__name,
.architects-recognition__title,
.architects-offer__title,
.architects-process__title,
.fyh-hero__heading,
.fyh-card__title,
.fyh-feature__title {
  font-family: var(--font-sans);
  font-size: clamp(1.25rem, 1.08rem + 0.85vw, 1.95rem);
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: -0.03em;
  color: var(--charcoal);
  text-wrap: balance;
}

.body-text,
.geo-entity-copy,
.about-page__prose,
.about-values__description,
.about-authority__text,
.about-cta__copy,
.architects-page__intro,
.architects-page__credibility,
.architects-page__body,
.architects-recognition__copy,
.architects-offer__copy,
.architects-stats__label,
.architects-process__copy,
.architects-cta__copy,
.fyh-intro,
.fyh-body,
.fyh-hero__copy,
.fyh-card__copy,
.fyh-card__brands,
.fyh-feature__copy,
.fyh-promise__body,
.fyh-promise__note,
.fyh-gallery__caption,
.fyh-geo,
.fyh-brands__note,
.fyh-cta__copy,
.showroom-page__body,
.showroom-page__prose,
.showroom-floor__brands,
.showroom-floor__location,
.showroom-floor__note,
.showroom-staircase__caption,
.showroom-visit__value,
.showroom-visit__geo,
.contact-page__intro,
.contact-page__body,
.contact-map__address,
.contact-map__hours,
.contact-map__phone,
.contact-page__geo,
.contact-page__geo-cta,
.contact-form__notice,
.contact-form__promise,
.contact-call-alt {
  font-family: var(--font-sans);
  font-size: clamp(1rem, 0.96rem + 0.18vw, 1.1rem);
  font-weight: 400;
  line-height: 1.74;
}

.hero-title,
.footer-tagline,
.mobile-tagline {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 700;
}

.hero-title {
  font-size: clamp(3.1rem, 2rem + 3.5vw, 5.5rem);
  line-height: 0.88;
  letter-spacing: -0.06em;
  color: var(--amber);
  text-wrap: balance;
}

.hero-title em {
  font-style: inherit;
}

.pull-quote-text,
.about-pull-quote__text,
.architects-quote__text {
  font-family: var(--font-serif);
  font-size: clamp(1.55rem, 1.05rem + 1.85vw, 2.65rem);
  font-style: italic;
  font-weight: 700;
  line-height: 1.28;
  color: var(--amber);
  text-wrap: balance;
}

.pull-quote-attr,
.about-pull-quote__attribution,
.architects-quote__attribution {
  color: var(--text-soft);
}

.site-img,
.fyh-section-img__img,
.fyh-gallery__img,
.fyh-cta__img,
.hero-video,
.hero-fallback {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.text-center {
  text-align: center;
}

.text-white {
  color: var(--white);
}