:root {
  --graphite: #0e0e0e;
  --charcoal: #1a1a1a;
  --taupe: #3a352f;
  --sand: #d9c6b3;
  --ivory: #f4efe8;
  --bronze: #b9987a;
  --burgundy: #6b1f2b;
  --olive: #55624b;
  --stone: #8a8a8a;
  --border-dark: rgba(244, 239, 232, 0.16);
  --border-light: rgba(14, 14, 14, 0.16);
  --serif: "Playfair Display", Georgia, serif;
  --sans: "Inter", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--graphite); background: var(--ivory); font-family: var(--sans); font-size: 16px; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
p, h1, h2 { margin: 0; }

.container { position: relative; width: min(1180px, calc(100% - 80px)); margin: 0 auto; }
.section-dark { color: var(--ivory); background: var(--graphite); }
.section-light { color: var(--graphite); background: var(--ivory); }

.brand { display: inline-flex; align-items: center; gap: 9px; font-family: var(--serif); font-size: 22px; letter-spacing: -0.055em; line-height: 1; }
.brand img { width: 25px; height: 22px; object-fit: contain; filter: invert(1); }
.brand span { white-space: nowrap; }
.brand em { font-style: italic; font-weight: 500; }
.topbar { display: flex; align-items: center; justify-content: space-between; padding-top: 28px; }
.topbar-note, .section-index, .eyebrow, .direction, .formula { text-transform: uppercase; letter-spacing: 0.13em; font-size: 10px; font-weight: 500; }
.topbar-note { color: rgba(244, 239, 232, 0.6); }

.hero { position: relative; overflow: hidden; min-height: min(760px, 100svh); }
.hero-visual { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14,14,14,.98) 0%, rgba(14,14,14,.88) 33%, rgba(14,14,14,.43) 61%, rgba(14,14,14,.18) 100%), linear-gradient(0deg, rgba(14,14,14,.6), transparent 55%), url("assets/delta-hero.png") center / cover no-repeat; opacity: .76; }
.grain { position: absolute; inset: 0; opacity: .16; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.58'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; pointer-events: none; }
.hero-rule { position: absolute; top: 0; bottom: 0; left: max(calc((100% - 1180px) / 2 + 67%), 68%); width: 1px; background: linear-gradient(to bottom, transparent, rgba(217,198,179,.4) 30%, rgba(217,198,179,.15) 75%, transparent); }
.hero-content { min-height: inherit; display: flex; flex-direction: column; }
.hero-copy { width: min(685px, 100%); margin: auto 0; padding: 72px 0 58px; }
.eyebrow { display: flex; align-items: center; gap: 10px; color: var(--taupe); }
.eyebrow span { width: 25px; height: 1px; background: currentColor; }
.eyebrow--light { color: var(--sand); }
h1, h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -0.052em; line-height: .98; }
h1 { max-width: 690px; margin: 23px 0 26px; font-size: clamp(48px, 5.7vw, 85px); }
.hero-description { max-width: 530px; color: rgba(244, 239, 232, .78); font-size: 16px; line-height: 1.65; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 30px; min-height: 51px; margin-top: 33px; padding: 0 19px 0 22px; border: 1px solid transparent; font-size: 12px; font-weight: 600; transition: transform .25s ease, background .25s ease; }
.button:hover { transform: translateY(-3px); }
.button b { font-family: var(--serif); font-size: 23px; font-weight: 500; line-height: 1; }
.button--sand { color: var(--graphite); background: var(--sand); }
.button--sand:hover { background: var(--ivory); }
.hero-bottom { display: flex; align-items: end; justify-content: space-between; gap: 26px; padding: 0 0 30px; }
.formula { line-height: 1.7; color: rgba(244, 239, 232, .75); }
.formula i { color: var(--bronze); font-size: 15px; font-style: normal; padding: 0 2px; }
.direction { white-space: nowrap; color: var(--sand); }
.direction i { font-style: normal; color: var(--bronze); padding: 0 3px; }

.intro { padding: 112px 0 105px; overflow: hidden; }
.intro-layout { display: grid; grid-template-columns: 125px 1fr; column-gap: 28px; }
.section-index { padding-top: 8px; color: var(--stone); }
.intro-main h2 { width: min(780px, 100%); font-size: clamp(37px, 4.25vw, 61px); }
.intro-details { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(210px, .78fr); gap: 50px; margin: 41px 0 47px; max-width: 840px; color: #494540; font-size: 15px; line-height: 1.65; }
.intro-lead { color: var(--graphite); font-weight: 500; }
.formula--dark { color: #4d4944; border-top: 1px solid var(--border-light); padding-top: 19px; }
.formula--dark i { color: var(--burgundy); }
.questions { grid-column: 2; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 77px; border-top: 1px solid var(--border-light); }
.questions p { padding: 17px 7px 0 0; font-family: var(--serif); font-size: 21px; letter-spacing: -0.035em; line-height: 1.15; }
.questions span { display: block; margin-bottom: 25px; color: var(--bronze); font: 500 10px var(--sans); letter-spacing: .12em; }

.outcome { padding: 101px 0 75px; }
.section-heading h2 { margin-top: 20px; font-size: clamp(42px, 4.4vw, 66px); }
.outcome-grid { display: grid; grid-template-columns: 1.12fr .88fr; gap: 50px; margin-top: 60px; }
.score-block { min-height: 277px; padding: 27px 29px; background: var(--charcoal); display: flex; flex-direction: column; }
.score-block p { font-family: var(--serif); font-size: 25px; letter-spacing: -.03em; line-height: 1.1; }
.score-block strong { margin-top: auto; color: var(--sand); font: 500 clamp(60px, 7vw, 97px)/.75 var(--serif); letter-spacing: -.08em; }
.score-block span { margin-top: 15px; color: rgba(244,239,232,.56); font-size: 11px; }
.outcome-list { padding: 0; margin: 0; list-style: none; border-top: 1px solid var(--border-dark); }
.outcome-list li { position: relative; padding: 20px 20px 20px 24px; border-bottom: 1px solid var(--border-dark); font-family: var(--serif); font-size: 22px; letter-spacing: -.03em; }
.outcome-list li::before { content: "→"; position: absolute; left: 0; color: var(--bronze); font-size: 14px; top: 23px; }
.status-row { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 64px; padding-top: 20px; border-top: 1px solid var(--border-dark); }
.status-title { text-transform: uppercase; color: rgba(244,239,232,.56); font-size: 10px; letter-spacing: .13em; }
.statuses { display: flex; gap: 39px; }
.statuses p { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.dot { width: 9px; height: 9px; border-radius: 50%; }
.dot--olive { background: var(--olive); } .dot--bronze { background: var(--bronze); } .dot--burgundy { background: var(--burgundy); }

.profile { padding: 109px 0 103px; }
.profile-layout { display: grid; grid-template-columns: .79fr 1.21fr; gap: clamp(55px, 10vw, 154px); align-items: center; }
.profile-art { position: relative; width: min(100%, 365px); aspect-ratio: 3/4; overflow: hidden; background: var(--taupe); color: var(--ivory); }
.profile-art::before { content: ""; position: absolute; z-index: 1; inset: 18px; border: 1px solid rgba(244,239,232,.48); pointer-events: none; }
.profile-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 26%; filter: grayscale(100%) contrast(1.04); }
.profile-art p { position: absolute; z-index: 2; right: 30px; bottom: 29px; margin: 0; padding: 5px 7px; color: var(--sand); background: rgba(14,14,14,.72); font-size: 9px; letter-spacing: .14em; }
.profile-copy { max-width: 570px; }
.profile-copy h2 { margin: 16px 0 21px; font-size: clamp(47px, 5vw, 71px); }
.profile-description { max-width: 470px; color: #4a4641; font-size: 15px; line-height: 1.65; }
.profile-impact { display: flex; align-items: baseline; gap: 20px; margin: 33px 0 39px; }
.profile-impact strong { color: var(--burgundy); font: 500 clamp(39px, 4vw, 55px)/1 var(--serif); letter-spacing: -.06em; white-space: nowrap; }
.profile-impact span { max-width: 160px; font-size: 11px; line-height: 1.45; color: #59544e; }
.fact-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--border-light); }
.fact-grid p { min-height: 76px; padding: 13px 17px 11px 0; border-bottom: 1px solid var(--border-light); display: flex; flex-direction: column; gap: 5px; }
.fact-grid p:nth-child(odd) { border-right: 1px solid var(--border-light); padding-right: 17px; }
.fact-grid p:nth-child(even) { padding-left: 17px; }
.fact-grid b { font: 600 14px/1.15 var(--sans); }
.fact-grid span { font-size: 10px; line-height: 1.35; color: #69635d; }

.diagnostic { position: relative; overflow: hidden; padding: 99px 0; }
.diagnostic::before { content: "Δ"; position: absolute; right: -3vw; bottom: -32vw; color: rgba(217,198,179,.04); font: 500 66vw/.9 var(--serif); }
.diagnostic-line { position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, var(--burgundy), var(--bronze), transparent 78%); }
.diagnostic-layout { display: grid; grid-template-columns: 1fr 360px; gap: 83px; align-items: center; }
.diagnostic-copy h2 { margin: 19px 0 23px; font-size: clamp(47px, 5.1vw, 74px); }
.diagnostic-copy > p:last-child { max-width: 565px; color: rgba(244,239,232,.74); font-size: 16px; line-height: 1.6; }
.offer-card { position: relative; z-index: 1; padding: 30px; color: var(--graphite); background: var(--sand); }
.offer-card > p { font-family: var(--serif); font-size: 23px; line-height: 1.1; letter-spacing: -.035em; }
.price { display: flex; align-items: baseline; gap: 16px; margin: 26px 0 0; }
.price s { color: #766d64; font-size: 13px; }
.price strong { font: 500 60px/.8 var(--serif); letter-spacing: -.08em; }
.offer-card .button { width: 100%; margin-top: 31px; color: var(--ivory); background: var(--graphite); }
.offer-card .button:hover { background: var(--burgundy); }

.footer { padding: 23px 0 26px; border-top: 1px solid var(--border-dark); }
.footer-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.footer-link { color: var(--sand); font-size: 11px; letter-spacing: .13em; text-transform: uppercase; }
.mobile-cta { display: none; }

.reveal { animation: reveal .75s cubic-bezier(.2,.8,.2,1) both; }
@keyframes reveal { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 760px) {
  body { padding-bottom: 60px; }
  .container { width: min(100% - 40px, 600px); }
  .topbar { padding-top: 21px; }
  .topbar-note { display: none; }
  .hero { min-height: 720px; }
  .hero-visual { background-position: 63% center; opacity: .61; }
  .hero-rule { left: auto; right: 29px; }
  .hero-copy { padding: 76px 0 36px; margin: auto 0; }
  h1 { max-width: 500px; margin: 20px 0 21px; font-size: clamp(46px, 13vw, 66px); }
  .hero-description { max-width: 410px; font-size: 14px; line-height: 1.58; }
  .button { min-height: 49px; margin-top: 26px; font-size: 11px; }
  .hero-bottom { display: block; padding-bottom: 23px; }
  .formula { font-size: 8px; letter-spacing: .095em; overflow-x: auto; white-space: nowrap; padding-bottom: 7px; scrollbar-width: none; }
  .formula::-webkit-scrollbar { display: none; }
  .direction { margin-top: 16px; font-size: 8px; }
  .intro, .profile { padding: 71px 0; }
  .intro-layout { display: block; }
  .section-index { margin-bottom: 35px; padding: 0; }
  .intro-main h2 { font-size: clamp(35px, 10.2vw, 52px); }
  .intro-details { display: block; margin: 29px 0 31px; font-size: 14px; }
  .intro-lead { margin-top: 21px; }
  .questions { display: block; margin-top: 49px; }
  .questions p { padding: 17px 0; border-bottom: 1px solid var(--border-light); font-size: 21px; }
  .questions span { display: inline-block; min-width: 38px; margin: 0 9px 0 0; }
  .outcome { padding: 71px 0 61px; }
  .section-heading h2 { font-size: clamp(38px, 11vw, 54px); }
  .outcome-grid { grid-template-columns: 1fr; gap: 28px; margin-top: 37px; }
  .score-block { min-height: 227px; padding: 23px; }
  .score-block p { font-size: 22px; }
  .outcome-list li { padding: 17px 20px 17px 23px; font-size: 20px; }
  .status-row { display: block; margin-top: 41px; }
  .statuses { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 20px; }
  .statuses p { font-size: 11px; }
  .profile-layout { grid-template-columns: 1fr; gap: 45px; }
  .profile-art { width: min(100%, 450px); }
  .profile-copy h2 { margin: 14px 0 19px; font-size: 56px; }
  .profile-description { font-size: 14px; }
  .profile-impact { align-items: flex-start; flex-direction: column; gap: 9px; margin: 28px 0 31px; }
  .profile-impact span { max-width: 270px; }
  .diagnostic { padding: 72px 0; }
  .diagnostic-layout { grid-template-columns: 1fr; gap: 42px; }
  .diagnostic-copy h2 { font-size: clamp(42px, 12vw, 57px); }
  .diagnostic-copy > p:last-child { font-size: 14px; }
  .offer-card { padding: 25px 22px; }
  .footer { padding: 24px 0; }
  .footer-row { flex-wrap: wrap; }
  .footer-row .direction { display: none; }
  .mobile-cta { position: fixed; z-index: 20; display: flex; align-items: center; justify-content: space-between; left: 10px; right: 10px; bottom: 9px; min-height: 47px; padding: 0 17px; color: var(--ivory); background: var(--graphite); border: 1px solid rgba(217,198,179,.5); box-shadow: 0 9px 25px rgba(0,0,0,.25); font-size: 11px; font-weight: 600; }
  .mobile-cta span { color: var(--sand); font: 21px var(--serif); }
}

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