/*
 * Kortan V7
 * One coherent type system inspired by the Roman serif KORTAN wordmark.
 */

:root {
  --display: "Cormorant Garamond", Garamond, Georgia, serif;
  --roman: "Cinzel", "Times New Roman", serif;
  --sans: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --serif: var(--display);
}

body {
  font-family: var(--sans);
  font-weight: 400;
  letter-spacing: -.008em;
  text-rendering: optimizeLegibility;
}

/* Brand language */
.brand-name {
  font-family: var(--roman);
  font-weight: 500;
  line-height: 1;
  letter-spacing: .205em;
}

.brand-sub {
  margin-top: 7px;
  font-family: var(--display);
  font-size: .78rem;
  font-weight: 500;
  font-style: italic;
  line-height: 1;
  letter-spacing: .09em;
}

/* Editorial headings */
h1,
h2,
h3,
.home-collection h2,
.collection-tab strong,
.product-info strong,
.product-info em,
.service-row h3,
.modal-content h2,
.modal-content > em,
.concierge-links strong,
.contact-signature span {
  font-family: var(--display);
}

h1,
h2,
h3,
.home-collection h2,
.collection-tab strong,
.product-info strong,
.service-row h3,
.modal-content h2,
.concierge-links strong {
  font-weight: 500;
}

h1 em,
h2 em,
.product-info em,
.modal-content > em,
.contact-signature span {
  font-weight: 400;
  font-style: italic;
}

/* Interface language */
.site-nav a,
.header-cta,
.button,
.eyebrow,
.hero-kicker,
.filter,
.catalog-status,
.service-no,
.concierge-head span,
.concierge-head small,
.concierge-links span,
.concierge-addresses span {
  font-family: var(--sans);
  font-weight: 600;
}

.hero-v2 h1 {
  margin: 22px 0 20px;
  font-size: clamp(4.4rem, 6.1vw, 7.1rem);
  font-weight: 500;
  line-height: .78;
  letter-spacing: -.045em;
}

.hero-v2 h1 em {
  display: block;
  margin-top: 23px;
  font-size: .5em;
  line-height: 1;
  letter-spacing: -.025em;
}

.hero-v2 .hero-copy > p:not(.hero-kicker) {
  font-family: var(--sans);
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: -.012em;
}

.story-title h2,
.catalog-head h2,
.services-head h2,
.contact-title h2 {
  font-weight: 500;
  line-height: .92;
  letter-spacing: -.04em;
}

.story-title h2 em,
.catalog-head h2 em,
.services-head h2 em,
.contact-title h2 em {
  font-weight: 400;
}

.home-collection h2 {
  line-height: .92;
  letter-spacing: -.035em;
}

.collection-tab strong {
  line-height: 1;
  letter-spacing: -.02em;
}

.product-info strong {
  line-height: 1.05;
  letter-spacing: -.02em;
}

.service-row h3,
.concierge-links strong {
  line-height: 1.08;
  letter-spacing: -.018em;
}

@media (max-width: 760px) {
  .site-header .brand-name {
    font-size: 1.48rem !important;
    letter-spacing: .2em !important;
  }

  .site-header .brand-sub {
    margin-top: 6px;
    font-size: .61rem !important;
  }

  .hero-v2 h1 {
    margin: 20px 0 19px !important;
    font-size: clamp(3.25rem, 13.2vw, 4.25rem) !important;
    line-height: .82 !important;
    letter-spacing: -.042em !important;
  }

  .hero-v2 h1 em {
    margin-top: 20px !important;
    font-size: .49em !important;
    line-height: 1.06 !important;
    letter-spacing: -.02em !important;
  }

  .hero-v2 .hero-copy > p:not(.hero-kicker) {
    max-width: 340px !important;
    font-size: .82rem !important;
    line-height: 1.65 !important;
  }

  .site-nav.open a {
    font-family: var(--display) !important;
    font-size: clamp(2.8rem, 12vw, 3.8rem) !important;
    font-weight: 500 !important;
    line-height: .96 !important;
    letter-spacing: -.025em !important;
  }

  .catalog-head h2,
  .services-head h2,
  .contact .contact-title h2 {
    line-height: .98 !important;
    letter-spacing: -.035em !important;
  }

  .catalog-head h2 em,
  .services-head h2 em,
  .contact .contact-title h2 em {
    margin-top: 9px;
    line-height: 1 !important;
  }

  .service-row h3 {
    line-height: 1.06 !important;
  }
}

@media (max-width: 380px) {
  .hero-v2 h1 {
    font-size: 3rem !important;
  }
}