:root {
  --font-body: "Plus Jakarta Sans", sans-serif;
  --font-title: "Cormorant Garamond", serif;
  --font-subtitle: "Plus Jakarta Sans", sans-serif;
  --sans: var(--font-body);
  --serif: var(--font-title);
  --motion-fast: .34s;
  --motion-medium: .78s;
  --motion-slow: 1.32s;
  --motion-stagger: .1s;
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
  --motion-cinematic-ease: cubic-bezier(.16, 1, .3, 1);
}

body,
button,
input,
select,
textarea {
  font-family: var(--font-body) !important;
}

body {
  font-size: 14px !important;
  font-weight: 400;
}

h1,
h2 {
  font-family: var(--font-title) !important;
  text-rendering: optimizeLegibility;
  -webkit-text-stroke: .12px currentColor;
}

h3 {
  font-family: var(--font-subtitle) !important;
  letter-spacing: -.015em;
}

main > section:first-child h1 {
  font-size: clamp(48px, 4.6vw, 68px) !important;
  font-weight: 600 !important;
  line-height: .96 !important;
  letter-spacing: -.035em !important;
}

main section h2 {
  font-size: clamp(42px, 4vw, 58px) !important;
  font-weight: 600 !important;
  line-height: .98 !important;
  letter-spacing: -.025em !important;
}

.eyebrow,
.section-index,
.section-kicker {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .16em !important;
}

.hero-lead,
.hero-slogan,
.section-lead,
.section-desc,
.overview-copy > p:not(.eyebrow),
.philosophy-copy > p:not(.eyebrow),
.portal-copy > p:not(.eyebrow),
.partnership-copy > p:not(.eyebrow),
.contact-copy > p:not(.eyebrow) {
  font-size: 13px !important;
  line-height: 1.72 !important;
}

.siltron-nav a,
.estate-nav a,
.site-nav a,
.petro-nav a,
.minerals-nav a,
.ma-nav a,
.header-tools,
.header-tools > span,
.header-tools > a,
.header-contact {
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .1em !important;
}

.gold-button,
.outline-button,
.light-button,
.primary-button,
.secondary-button,
.services-button,
.target-cta,
.contact-form button,
.partnership-form button,
.portal-form > button {
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  transition-duration: var(--motion-fast) !important;
  transition-timing-function: var(--motion-ease) !important;
}

.siltron-header,
.estate-header,
.site-header,
.petro-header,
.minerals-header,
.ma-header {
  transition-duration: var(--motion-fast) !important;
  transition-timing-function: var(--motion-ease) !important;
}

[data-reveal],
.reveal {
  transition-duration: var(--motion-medium) !important;
  transition-timing-function: var(--motion-ease) !important;
  will-change: opacity, transform;
}

[data-reveal="left"] { transform: translate3d(-44px, 0, 0); }
[data-reveal="right"] { transform: translate3d(44px, 0, 0); }
[data-reveal="up"] { transform: translate3d(0, 44px, 0); }
[data-reveal].is-visible,
.reveal.is-visible { transform: translate3d(0, 0, 0); }

main article,
main article::before,
main article::after,
main button,
main a {
  transition-timing-function: var(--motion-ease) !important;
}

main article img,
main figure img {
  transition-duration: var(--motion-medium) !important;
  transition-timing-function: var(--motion-cinematic-ease) !important;
}

main > section:first-child .eyebrow {
  animation: sector-rise var(--motion-medium) var(--motion-ease) .04s both;
}

main > section:first-child h1 {
  animation: sector-rise var(--motion-medium) var(--motion-ease) .12s both;
}

main > section:first-child .hero-lead,
main > section:first-child .hero-slogan {
  animation: sector-rise var(--motion-medium) var(--motion-ease) .2s both;
}

main > section:first-child .hero-actions {
  animation: sector-rise var(--motion-medium) var(--motion-ease) .28s both;
}

.scroll-cue i,
.scroll-cue span {
  animation-duration: 1.8s !important;
}

@keyframes sector-rise {
  from { opacity: 0; transform: translate3d(0, 32px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@media (max-width: 820px) {
  body { font-size: 13px !important; }

  main > section:first-child h1 {
    font-size: clamp(40px, 11vw, 48px) !important;
    line-height: 1.02 !important;
  }

  main section h2 {
    font-size: clamp(36px, 9vw, 43px) !important;
    line-height: 1.02 !important;
  }

  .hero-lead,
  .hero-slogan,
  .section-lead,
  .section-desc,
  .overview-copy > p:not(.eyebrow),
  .philosophy-copy > p:not(.eyebrow),
  .portal-copy > p:not(.eyebrow),
  .partnership-copy > p:not(.eyebrow),
  .contact-copy > p:not(.eyebrow) {
    font-size: 12px !important;
  }

  .siltron-nav a,
  .estate-nav a,
  .site-nav a,
  .petro-nav a,
  .minerals-nav a,
  .ma-nav a {
    font-family: var(--font-title) !important;
    font-size: clamp(34px, 8vw, 42px) !important;
    font-weight: 600 !important;
    letter-spacing: -.02em !important;
  }

  .gold-button,
  .outline-button,
  .light-button,
  .primary-button,
  .secondary-button,
  .services-button,
  .target-cta,
  .contact-form button,
  .partnership-form button,
  .portal-form > button {
    font-size: 10px !important;
  }

  [data-reveal="left"] { transform: translate3d(-24px, 0, 0); }
  [data-reveal="right"] { transform: translate3d(24px, 0, 0); }
  [data-reveal="up"] { transform: translate3d(0, 24px, 0); }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }

  [data-reveal],
  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}
