:root {
  --paper: #ece9e2;
  --warm: #c9b99f;
  --ink: #101616;
  --ease: cubic-bezier(.2,.72,.2,1);
}
body {
  font-family: "Manrope", Arial, sans-serif;
  background: #101616;
  letter-spacing: -.01em;
}
.site-header, main, footer { transition-duration: .6s; }
.intro { transition-duration: .55s; }
.site-header {
  height: 106px;
  padding-inline: clamp(24px, 5.5vw, 88px);
  border-bottom-color: rgba(255,255,255,.13);
  background: linear-gradient(180deg, rgba(7,12,12,.76), rgba(7,12,12,.18) 72%, transparent);
}
.brand { gap: 12px; }
.brand__image { width: 174px; height: 64px; }
.brand__image img { width: 260px; left: -40px; top: -93px; }
.brand__by {
  color: rgba(255,255,255,.68);
  font-size: .67rem;
  line-height: 1.35;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.nav {
  gap: clamp(18px, 2vw, 32px);
  font-size: .69rem;
  font-weight: 600;
  letter-spacing: .115em;
  text-transform: uppercase;
}
.nav a { padding-block: 12px; }
.nav .button {
  min-height: 42px;
  padding: 10px 18px;
  border-color: rgba(255,255,255,.45);
  background: rgba(11,17,17,.2);
  color: #fff;
}

.hero {
  min-height: 760px;
  height: max(760px, 100svh);
  align-items: end;
  background: #0b1010;
}
.hero__media { animation-duration: 4.2s; }
.hero__media img {
  object-position: center 54%;
  filter: saturate(.88) contrast(1.04);
}
.hero__media::after {
  background:
    linear-gradient(90deg, rgba(7,12,12,.82) 0%, rgba(7,12,12,.52) 36%, rgba(7,12,12,.05) 72%),
    linear-gradient(0deg, rgba(7,12,12,.72) 0%, transparent 52%),
    linear-gradient(180deg, rgba(7,12,12,.22), transparent 35%);
}
.hero__content {
  width: min(820px, 78vw);
  margin: 0 0 0 clamp(24px, 7vw, 112px);
  padding: 0 0 clamp(76px, 9vh, 112px);
  text-align: left;
}
.kicker {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
  color: rgba(255,255,255,.78);
  font-size: .67rem;
  font-weight: 600;
  letter-spacing: .2em;
}
.kicker::before {
  content: "";
  width: 46px;
  height: 1px;
  background: var(--warm);
}
h1 {
  max-width: none;
  margin: 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(4.7rem, 8.4vw, 8.6rem);
  font-weight: 400;
  line-height: .79;
  letter-spacing: -.055em;
  text-align: left;
  text-transform: none;
  text-shadow: 0 3px 24px rgba(0,0,0,.2);
}
h1 span { display: block; }
h1 span + span { margin-left: clamp(32px, 8vw, 132px); }
h1 em { color: #f1eee8; font-weight: 400; }
.hero__lead {
  max-width: 500px;
  margin: 36px 0 30px;
  color: rgba(255,255,255,.76);
  font-size: .96rem;
  font-weight: 300;
  line-height: 1.75;
}
.hero__actions {
  justify-content: flex-start;
  align-items: center;
  gap: 26px;
}
.hero__actions .button {
  min-height: 48px;
  padding-inline: 22px;
  border-color: #ede9e1;
  background: #ede9e1;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hero__work-link {
  display: inline-flex;
  align-items: center;
  gap: 22px;
  padding: 12px 0 9px;
  border-bottom: 1px solid rgba(255,255,255,.5);
  color: rgba(255,255,255,.9);
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: gap .3s var(--ease), border-color .3s;
}
.hero__work-link:hover { gap: 28px; border-color: #fff; }
.hero__areas {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 32px 0 0;
  color: rgba(255,255,255,.58);
  font-size: .68rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hero__areas strong {
  display: inline;
  margin: 0;
  color: rgba(255,255,255,.82);
  font-size: inherit;
  font-weight: 500;
  letter-spacing: inherit;
}
.hero__areas span {
  padding-left: 18px;
  border-left: 1px solid rgba(255,255,255,.25);
}
.hero__scroll {
  right: clamp(24px, 4vw, 64px);
  bottom: 56px;
  color: rgba(255,255,255,.68);
  font-size: .64rem;
  letter-spacing: .18em;
}
body:not(.intro-active) .hero__content > * {
  opacity: 0;
  animation: premium-copy-in .9s var(--ease) forwards;
}
body:not(.intro-active) .hero__content > :nth-child(1) { animation-delay: .05s; }
body:not(.intro-active) .hero__content > :nth-child(2) { animation-delay: .15s; }
body:not(.intro-active) .hero__content > :nth-child(3) { animation-delay: .3s; }
body:not(.intro-active) .hero__content > :nth-child(4) { animation-delay: .42s; }
body:not(.intro-active) .hero__content > :nth-child(5) { animation-delay: .55s; }
@keyframes premium-copy-in {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}

.service-strip {
  border: 0;
  background: #101616;
  backdrop-filter: none;
}
.service-strip span {
  padding: 19px clamp(14px, 2.5vw, 38px);
  border-right-color: rgba(255,255,255,.1);
  color: rgba(255,255,255,.62);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .095em;
  text-transform: uppercase;
}
.material-band {
  grid-template-columns: minmax(120px,.32fr) minmax(0,1.68fr);
  padding: clamp(70px, 8vw, 116px) clamp(24px, 7vw, 112px);
  border: 0;
  background: var(--paper);
  color: var(--ink);
  backdrop-filter: none;
}
.material-band .eyebrow {
  color: #786f62;
  font-size: .67rem;
  letter-spacing: .18em;
}
.material-band p {
  max-width: 1050px;
  color: var(--ink);
  font: 400 clamp(2.2rem, 4.15vw, 4.45rem)/.98 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.035em;
}

.section { padding: clamp(86px, 10vw, 152px) clamp(24px, 7vw, 112px); }
.eyebrow {
  font-size: .67rem;
  font-weight: 600;
  letter-spacing: .18em;
}
h2 {
  font: 400 clamp(3.3rem, 6.2vw, 6.7rem)/.87 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.045em;
  text-transform: none;
}
.showcase { background: #101616; }
.showcase__head {
  grid-template-columns: minmax(300px,1.12fr) minmax(280px,.88fr);
  align-items: end;
  margin-bottom: clamp(64px, 7vw, 104px);
}
.showcase__head h2 { max-width: 820px; }
.showcase__intro {
  max-width: 530px;
  color: rgba(255,255,255,.58);
  font-size: .94rem;
  font-weight: 300;
  line-height: 1.75;
}
.finish-grid { row-gap: clamp(56px, 7vw, 100px); }
.finish-card {
  border-color: rgba(255,255,255,.1);
  box-shadow: none;
}
.finish-card__media img { filter: brightness(.85) saturate(.92) contrast(1.02); }
.finish-card:hover .finish-card__media img { filter: brightness(.94) saturate(.98) contrast(1.02); }
.finish-card__body { padding: clamp(26px, 3vw, 42px); }
.finish-card__body h3 {
  font: 400 clamp(2rem,3.25vw,3.5rem)/.92 "Cormorant Garamond",Georgia,serif;
  letter-spacing: -.025em;
  text-transform: none;
}
.finish-card__body p { font-size: .65rem; letter-spacing: .15em; }
.capability-grid {
  gap: clamp(22px, 2.4vw, 38px);
  padding-top: clamp(14px, 2vw, 30px);
  border-top: 1px solid rgba(255,255,255,.12);
}
.cap-card {
  border-color: rgba(255,255,255,.09);
  box-shadow: none;
}
.cap-card--handling, .cap-card--saw { grid-column: span 6; }
.cap-card--access {
  grid-template-columns: minmax(360px,1.05fr) minmax(320px,.95fr);
  margin-top: clamp(18px, 3vw, 40px);
}
.cap-card__media img { filter: brightness(.74) saturate(.9) contrast(1.04); }
.cap-card__body h3 {
  font: 400 clamp(2rem,3vw,3.25rem)/.94 "Cormorant Garamond",Georgia,serif;
  letter-spacing: -.025em;
  text-transform: none;
}
.cap-card__body p {
  color: rgba(255,255,255,.62);
  font-size: .88rem;
  font-weight: 300;
  line-height: 1.7;
}

.services {
  grid-template-columns: .9fr 1.1fr;
  background: var(--paper);
  color: var(--ink);
}
.services h2 { color: var(--ink); }
.services .eyebrow { color: #786f62; }
.services__list { border-top-color: rgba(16,22,22,.22); }
.services__list li {
  padding: 26px 0;
  border-bottom-color: rgba(16,22,22,.18);
}
.services__list b { color: #988b78; }
.services__list span {
  font: 400 clamp(1.45rem, 2.25vw, 2.35rem)/1.1 "Cormorant Garamond",Georgia,serif;
}
.services__list i { color: #655f56; }
.contact {
  background: linear-gradient(100deg, rgba(8,13,13,.94), rgba(8,13,13,.76)), url("assets/carrara-quarry-vmenkov.jpg") center 62%/cover;
}
.contact h2 { max-width: 900px; }
.reveal {
  transform: translateY(28px);
  transition-duration: 1s;
}

@media (max-width: 900px) {
  .site-header { height: 86px; padding-inline: 22px; }
  .nav { inset: 86px 0 auto; }
  .hero { min-height: 700px; height: max(700px, 100svh); }
  .hero__content {
    width: min(760px, calc(100% - 48px));
    margin-left: 24px;
    padding-bottom: 68px;
  }
  h1 { font-size: clamp(4.2rem, 12vw, 7.2rem); }
  .hero__media::after {
    background:
      linear-gradient(90deg, rgba(7,12,12,.76), rgba(7,12,12,.18) 78%),
      linear-gradient(0deg, rgba(7,12,12,.82), transparent 64%);
  }
  .material-band { grid-template-columns: 1fr; gap: 22px; }
  .cap-card--handling, .cap-card--saw { grid-column: span 1; }
  .cap-card--access { grid-template-columns: .9fr 1.1fr; }
}
@media (max-width: 600px) {
  .site-header { height: 76px; }
  .brand__image { width: 136px; height: 50px; }
  .brand__image img { width: 203px; left: -31px; top: -73px; }
  .brand__by { display: none; }
  .menu-toggle {
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
  }
  .nav { inset: 76px 0 auto; }
  .hero { min-height: 720px; height: max(720px, 100svh); }
  .hero__media img { object-position: 58% center; }
  .hero__media::after {
    background:
      linear-gradient(0deg, rgba(7,12,12,.92) 0%, rgba(7,12,12,.62) 45%, rgba(7,12,12,.16) 78%),
      linear-gradient(90deg, rgba(7,12,12,.38), transparent 80%);
  }
  .hero__content {
    width: auto;
    margin: 0;
    padding: 0 22px 48px;
    text-align: left;
  }
  .kicker { margin-bottom: 18px; font-size: .6rem; }
  .kicker::before { width: 30px; }
  h1 {
    font-size: clamp(3.85rem, 18.5vw, 5.2rem);
    line-height: .82;
  }
  h1 span + span { margin-left: 22px; }
  .hero__lead {
    max-width: 340px;
    margin: 26px 0 24px;
    font-size: .84rem;
    line-height: 1.65;
  }
  .hero__actions { gap: 20px; }
  .hero__actions .button {
    min-height: 45px;
    padding-inline: 16px;
    font-size: .67rem;
  }
  .hero__work-link { gap: 12px; font-size: .65rem; }
  .hero__areas {
    display: grid;
    gap: 6px;
    margin-top: 24px;
    font-size: .59rem;
    line-height: 1.5;
  }
  .hero__areas span { padding: 0; border: 0; }
  .service-strip {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 0;
    gap: 0;
  }
  .service-strip span {
    padding: 15px 14px;
    border-right: 1px solid rgba(255,255,255,.09) !important;
    border-bottom: 1px solid rgba(255,255,255,.09) !important;
    font-size: .58rem;
    line-height: 1.4;
  }
  .service-strip span:nth-child(even) { border-right: 0 !important; }
  .material-band { padding-block: 66px; }
  .material-band p { font-size: clamp(2.05rem, 10vw, 3.15rem); }
  .section { padding-block: 80px; }
  .showcase__head { margin-bottom: 52px; }
  h2 { font-size: clamp(3.25rem, 15vw, 4.8rem); }
  .finish-card__body h3 { font-size: 2.05rem; }
  .cap-card--access { display: block; margin-top: 28px; }
  .cap-card__body h3 { font-size: 2.2rem; }
  .services { gap: 48px; }
  .services__list li { padding: 21px 0; }
  .services__list span { font-size: 1.48rem; }
}
@media (prefers-reduced-motion: reduce) {
  body:not(.intro-active) .hero__content > * { opacity: 1; animation: none; }
}
@media (max-width: 900px) {
  .showcase__head,
  .services,
  .contact {
    grid-template-columns: 1fr;
  }
  .showcase__intro {
    max-width: 620px;
    margin-top: 4px;
  }
}
@media (max-width: 600px) {
  .showcase__head { display: block; }
  .showcase__intro { margin-top: 28px; }
  .contact { gap: 42px; }
}
.contact {
  background: linear-gradient(100deg, rgba(8,13,13,.94), rgba(8,13,13,.76)), url("carrara-quarry-vmenkov.jpg") center 62%/cover;
}