:root {
  --black: #17130f;
  --ink: #241d17;
  --white: #f3eee5;
  --gray: #b9aa98;
  --camel: #b78352;
  --rust: #8e4f31;
  --line: rgba(243,238,229,.2);
  --serif: "Italiana", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--black); color: var(--white); font-family: var(--sans); font-size: 16px; line-height: 1.6; }
a { color: inherit; text-decoration: none; }

.site-header { position: absolute; z-index: 10; inset: 0 0 auto 0; height: 96px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(22px,5vw,76px); border-bottom: 1px solid var(--line); background:linear-gradient(180deg,rgba(23,19,15,.55),transparent); }
.brand { display: inline-flex; align-items: center; gap: 13px; font-size: .78rem; letter-spacing: .26em; font-weight: 600; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid currentColor; font: 1.4rem/1 var(--serif); letter-spacing: 0; }
nav { display: flex; align-items: center; gap: clamp(20px,3.2vw,52px); font-size: .84rem; }
nav a { color: #d2d2cf; transition: color .2s ease; }
nav a:hover, nav a:focus-visible { color: #fff; }
.nav-portal { padding: 10px 0 8px; border-bottom: 1px solid #d4ad83; color: #fff; }
.menu-toggle { display: none; background: none; color: #fff; border: 0; font: inherit; }

.hero { min-height: 850px; height: 100svh; position: relative; display: grid; grid-template-columns: 54% 46%; overflow: hidden; }
.hero-copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 130px clamp(22px,5vw,76px) 60px; background: linear-gradient(90deg,#17130f 0%,#17130f 77%,rgba(23,19,15,.3) 100%); }
.eyebrow { margin: 0 0 28px; font-size: .71rem; font-weight: 600; letter-spacing: .23em; text-transform: uppercase; color: #d4ad83; }
.eyebrow.dark { color: #8e4f31; }
h1,h2,h3,p { margin-top: 0; }
h1 { margin-bottom: 30px; font: clamp(4rem,7.4vw,8.4rem)/.88 var(--serif); letter-spacing: -.03em; font-weight: 400; }
h1 em { color: #c99565; font-weight: 400; }
.hero-intro { max-width: 480px; margin-bottom: 40px; color: #c5b8a8; font-size: 1.1rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 52px; padding: 0 26px; font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; transition: background .2s,color .2s,border-color .2s; }
.button-light { background: #c28b57; color: #17130f; border: 1px solid #c28b57; }
.button-light:hover,.button-light:focus-visible { background: #d6a97e; border-color: #d6a97e; }
.button-line { border: 1px solid #646462; color: #fff; }
.button-line:hover,.button-line:focus-visible { border-color: #fff; }
.hero-image { position: absolute; inset: 0 0 0 42%; background: #251c15 url("hero.png") center/cover no-repeat; filter: sepia(.2) saturate(.92) contrast(1.04) brightness(1.02); }
.hero-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(23,19,15,.78),transparent 35%),linear-gradient(0deg,rgba(46,25,14,.16),transparent 42%); }
.hero-note { position:absolute; right:clamp(22px,3vw,48px); bottom:28px; z-index:2; font-size:.65rem; letter-spacing:.22em; color:#aaa; writing-mode:vertical-rl; }

.proof-bar { display:grid; grid-template-columns:repeat(3,1fr); gap:0; padding:0 clamp(22px,7vw,110px); background:#8e4f31; color:#f7efe5; }
.proof-bar p { margin:0; padding:22px 24px; border-right:1px solid rgba(255,255,255,.2); font-size:.78rem; letter-spacing:.11em; text-transform:uppercase; }
.proof-bar p:first-child { padding-left:0; }
.proof-bar p:last-child { border-right:0; }
.proof-bar span { margin-right:15px; color:#d9af89; font-size:.65rem; }

.statement { display:grid; grid-template-columns: minmax(70px,1fr) 5fr; gap:40px; padding: clamp(90px,12vw,170px) clamp(22px,7vw,110px); background:#eee4d5; color:var(--ink); border-top:5px solid var(--rust); }
.section-number { font-size:.7rem; letter-spacing:.2em; color:#777; }
.statement > div { max-width:1040px; }
.statement h2,.process h2 { margin-bottom:40px; max-width:900px; font:clamp(3rem,6vw,6.8rem)/.96 var(--serif); font-weight:400; letter-spacing:-.02em; }
.large-copy { max-width:730px; margin-left:auto; font-size:clamp(1.08rem,1.6vw,1.35rem); color:#4b4b48; }

.difference { padding:clamp(90px,10vw,145px) clamp(22px,7vw,110px); background:#e3d3bd; color:var(--ink); }
.difference-heading { display:grid; grid-template-columns:1fr 2fr; gap:40px; align-items:end; margin-bottom:70px; }
.difference-heading h2,.occasions h2,.first-appointment h2 { margin:0; font:clamp(3rem,5.2vw,6rem)/.98 var(--serif); font-weight:400; letter-spacing:-.02em; }
.difference-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #9f8b74; }
.difference-grid article { padding:34px clamp(20px,3vw,42px) 10px 0; }
.difference-grid article + article { border-left:1px solid #9f8b74; padding-left:clamp(20px,3vw,42px); }
.feature-kicker { color:#8e4f31; font-size:.7rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.difference-grid h3 { max-width:310px; margin:55px 0 18px; font:2rem/1.08 var(--serif); font-weight:400; }
.difference-grid article > p:last-child { color:#5e5146; }

.collection { padding: clamp(90px,10vw,150px) clamp(22px,7vw,110px); background:linear-gradient(145deg,#17130f 0%,#211810 100%); }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:70px; }
.section-heading h2,.consultation h2 { margin-bottom:0; font:clamp(3rem,5vw,5.7rem)/1 var(--serif); font-weight:400; }
.section-heading > p { max-width:440px; color:#9c9c98; }
.collection-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.collection-grid article { min-height:310px; padding:32px 28px 28px 0; border-right:1px solid var(--line); position:relative; }
.collection-grid article::after { content:""; position:absolute; left:0; bottom:0; width:34px; height:2px; background:var(--rust); }
.collection-grid article + article { padding-left:28px; }
.collection-grid article:last-child { border-right:0; }
.collection-grid span,.steps span { font-size:.66rem; letter-spacing:.18em; color:#777; }
.collection-grid h3 { margin:105px 0 14px; font:2.35rem/1 var(--serif); font-weight:400; }
.collection-grid p { color:#92928e; font-size:.94rem; }

.occasions { display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(50px,9vw,150px); padding:clamp(90px,10vw,150px) clamp(22px,7vw,110px); background:#241a13; }
.occasions h2 { max-width:720px; }
.occasion-list { border-top:1px solid var(--line); }
.occasion-list p { display:grid; grid-template-columns:145px 1fr; gap:25px; margin:0; padding:24px 0; border-bottom:1px solid var(--line); color:#ad9f91; }
.occasion-list span { color:#f3eee5; font-family:var(--serif); font-size:1.25rem; }

.process { display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,8vw,130px); padding:clamp(90px,10vw,150px) clamp(22px,7vw,110px); background:#c9b397; color:var(--ink); }
.process-intro > p:last-child { max-width:510px; color:#555550; }
.steps { list-style:none; margin:0; padding:0; border-top:1px solid #aaa; }
.steps li { display:grid; grid-template-columns:56px 1fr; gap:20px; padding:26px 0; border-bottom:1px solid #aaa; }
.steps h3 { margin-bottom:6px; font:1.75rem/1.2 var(--serif); font-weight:400; }
.steps p { margin-bottom:0; color:#585854; font-size:.94rem; }

.first-appointment { display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(50px,9vw,150px); padding:clamp(90px,10vw,150px) clamp(22px,7vw,110px); background:#eee4d5; color:var(--ink); }
.appointment-copy { align-self:end; color:#574b41; font-size:1.02rem; }
.appointment-copy > p { margin-bottom:30px; }
.appointment-copy ul { list-style:none; margin:0; padding:0; border-top:1px solid #b5a28d; }
.appointment-copy li { padding:14px 0 14px 28px; border-bottom:1px solid #b5a28d; position:relative; }
.appointment-copy li::before { content:""; position:absolute; left:0; top:24px; width:10px; height:1px; background:#8e4f31; }

.consultation { text-align:center; padding:clamp(110px,14vw,210px) 22px; background:linear-gradient(rgba(42,25,15,.96),rgba(23,19,15,.98)); border-top:1px solid rgba(212,173,131,.32); }
.consultation > p:not(.eyebrow) { max-width:610px; margin:30px auto 42px; color:#9d9d99; font-size:1.05rem; }
.consult-actions { display:flex; flex-direction:column; align-items:center; gap:22px; }
.consult-actions span { color:#858581; font-size:.83rem; }
.consult-actions span a { color:#eee; border-bottom:1px solid #777; }

footer { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:35px; padding:44px clamp(22px,5vw,76px); border-top:1px solid var(--line); color:#858581; font-size:.76rem; }
footer p { margin:0; }
footer .brand { color:#fff; }
.mobile-book { display:none; }

@media (max-width: 900px) {
  .site-header { height:78px; }
  .menu-toggle { display:block; }
  nav { display:none; position:absolute; top:78px; left:0; right:0; padding:25px 22px 30px; background:#17130f; border-bottom:1px solid var(--line); flex-direction:column; align-items:flex-start; }
  nav.open { display:flex; }
  .hero { min-height:760px; grid-template-columns:1fr; }
  .hero-copy { padding-top:125px; background:linear-gradient(90deg,rgba(23,19,15,.97) 0%,rgba(23,19,15,.78) 70%,rgba(23,19,15,.56)); }
  .hero-image { inset:0; opacity:.88; }
  .statement { grid-template-columns:1fr; }
  .section-number { display:none; }
  .section-heading { align-items:flex-start; flex-direction:column; }
  .collection-grid { grid-template-columns:1fr 1fr; }
  .collection-grid article:nth-child(2) { border-right:0; }
  .collection-grid article:nth-child(3),.collection-grid article:nth-child(4) { border-top:1px solid var(--line); }
  .collection-grid article:nth-child(3) { padding-left:0; }
  .process { grid-template-columns:1fr; }
  .difference-heading,.occasions,.first-appointment { grid-template-columns:1fr; }
  .difference-grid { grid-template-columns:1fr; }
  .difference-grid article,.difference-grid article + article { border-left:0; border-bottom:1px solid #9f8b74; padding:30px 0; }
  .difference-grid h3 { margin-top:25px; }
  .proof-bar { grid-template-columns:1fr; padding-top:12px; padding-bottom:12px; }
  .proof-bar p,.proof-bar p:first-child { padding:10px 0; border-right:0; }
  footer { grid-template-columns:1fr; text-align:center; justify-items:center; }
}

@media (max-width: 560px) {
  h1 { font-size:clamp(3.45rem,17vw,5.4rem); }
  .hero { min-height:720px; }
  .hero-copy { justify-content:flex-end; padding-bottom:75px; }
  .hero-intro { font-size:1rem; }
  .hero-actions { width:100%; }
  .button { width:100%; }
  .collection-grid { grid-template-columns:1fr; }
  .collection-grid article,.collection-grid article + article { min-height:auto; padding:26px 0; border-right:0; border-top:1px solid var(--line); }
  .collection-grid article:first-child { border-top:0; }
  .collection-grid h3 { margin:45px 0 12px; }
  .occasion-list p { grid-template-columns:1fr; gap:4px; }
  .mobile-book { display:flex; position:fixed; z-index:20; left:14px; right:14px; bottom:14px; min-height:52px; align-items:center; justify-content:center; background:#c28b57; color:#17130f; box-shadow:0 10px 30px rgba(0,0,0,.35); font-size:.73rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
  footer { padding-bottom:95px; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }
