:root {
  --asphalt: #17191a;
  --stone: #f2efe8;
  --paper: #faf9f6;
  --silver: #a9adb0;
  --midnight: #273845;
  --headlight: #d8e6e9;
  --line: rgba(23, 25, 26, .16);
  --sans: "Instrument Sans", Arial, sans-serif;
  --serif: "Instrument Serif", Georgia, serif;
  --shell: min(1380px, calc(100vw - 64px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--stone); color: var(--asphalt); font-family: var(--sans); font-size: 16px; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
.section-shell { width: var(--shell); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; left: 16px; top: -80px; background: var(--paper); padding: 12px 18px; }
.skip-link:focus { top: 16px; }

.site-header { width: 100%; min-height: 84px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 32px; border-bottom: 1px solid var(--line); background: rgba(242,239,232,.94); backdrop-filter: blur(16px); position: sticky; top: 0; z-index: 50; transition: box-shadow .3s ease; }
.site-header.is-scrolled { box-shadow: 0 14px 30px rgba(23,25,26,.06); }
.brand { justify-self: start; display: inline-flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 650; letter-spacing: .15em; white-space: nowrap; }
.brand-mark { width: 28px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.primary-nav { display: flex; gap: 36px; font-size: 13px; }
.primary-nav a, .site-footer nav a { position: relative; }
.primary-nav a::after, .site-footer nav a::after { content: ""; position: absolute; left: 0; bottom: -5px; width: 100%; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .25s ease; }
.primary-nav a:hover::after, .site-footer nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.header-cta { justify-self: end; border: 1px solid var(--asphalt); padding: 10px 16px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.menu-toggle { display: none; border: 0; background: transparent; width: 40px; height: 40px; padding: 8px; }
.menu-toggle > span:not(.sr-only) { display: block; width: 100%; height: 1px; background: var(--asphalt); margin: 5px 0; }

.hero { min-height: calc(100vh - 116px); display: grid; grid-template-columns: .88fr 1.12fr; gap: 64px; align-items: center; padding-block: 72px; }
.hero-copy { padding-left: 4vw; }
.eyebrow, .section-index { margin: 0 0 24px; font-size: 11px; font-weight: 650; letter-spacing: .18em; text-transform: uppercase; }
.hero h1 { margin: 0; font-size: clamp(64px, 7.4vw, 124px); line-height: .82; letter-spacing: -.065em; font-weight: 540; }
.hero h1 em { font-family: var(--serif); font-weight: 400; }
.hero-lede { max-width: 560px; margin: 40px 0 32px; font-size: clamp(17px, 1.5vw, 22px); color: rgba(23,25,26,.72); }
.button-row { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; padding: 0 24px; border: 1px solid transparent; font-size: 12px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; transition: transform .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--midnight); color: var(--paper); }
.button-light { background: var(--paper); color: var(--asphalt); }
.text-link { display: inline-flex; gap: 12px; align-items: center; padding-bottom: 4px; border-bottom: 1px solid currentColor; font-size: 13px; font-weight: 600; }

.hero-visual { min-height: 650px; position: relative; overflow: hidden; background: var(--asphalt); }
.visual-atmosphere { position: absolute; inset: 0; background: radial-gradient(circle at 50% 40%, rgba(216,230,233,.24), transparent 27%), linear-gradient(145deg, transparent 0 38%, rgba(255,255,255,.055) 38% 40%, transparent 40% 100%), linear-gradient(180deg, #2b3033, #121414); }
.product-stage { position: absolute; inset: 0; display: grid; place-items: center; perspective: 1000px; }
.diffuser { width: min(75%, 560px); aspect-ratio: 5.4 / 1; display: flex; filter: drop-shadow(0 26px 24px rgba(0,0,0,.5)); transform: rotate(-7deg) rotateY(-8deg); }
.diffuser-cap { width: 11%; background: linear-gradient(90deg, #070808, #34393b 48%, #0b0c0d); border-radius: 50% 0 0 50%; border-right: 2px solid #555b5e; }
.diffuser-body { flex: 1; display: flex; justify-content: center; align-items: center; gap: 5.5%; background: linear-gradient(180deg, #44494b 0, #111315 18%, #050606 60%, #292d2f 100%); box-shadow: inset 0 0 0 1px #3c4143; }
.diffuser-body span { width: 4%; height: 30%; background: #030404; border-radius: 50%; transform: skewX(-12deg); box-shadow: inset 1px 1px 2px #5c6264; }
.diffuser-control { width: 18%; border-radius: 0 48% 48% 0; background: linear-gradient(90deg, #0b0c0d, #3d4244 55%, #101112); display: flex; gap: 18%; align-items: center; justify-content: center; box-shadow: inset 2px 0 0 #575d60; }
.diffuser-control i { width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 7px solid #9ba2a5; }
.diffuser-control i:last-child { transform: rotate(180deg); }
.vent-lines { position: absolute; width: 115%; bottom: 18%; transform: rotate(-7deg); opacity: .34; }
.vent-lines i { display: block; height: 11px; margin: 18px 0; background: linear-gradient(90deg, #050606, #394043, #060707); box-shadow: 0 2px 0 rgba(255,255,255,.08); }
.stage-note { position: absolute; z-index: 3; margin: 0; color: rgba(250,249,246,.65); font-size: 10px; text-transform: uppercase; letter-spacing: .16em; }
.stage-note-top { top: 28px; right: 28px; }
.stage-note-bottom { bottom: 24px; left: 28px; }

.proof-strip { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--paper); border-block: 1px solid var(--line); }
.proof-strip div { min-height: 92px; display: flex; gap: 18px; align-items: center; justify-content: center; border-right: 1px solid var(--line); padding: 16px; }
.proof-strip div:last-child { border: 0; }
.proof-strip span { font-family: var(--serif); color: var(--silver); font-style: italic; }
.proof-strip strong { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }

.manifesto { padding-block: 140px; }
.manifesto-grid { display: grid; grid-template-columns: 1.45fr .55fr; gap: 80px; align-items: start; }
.manifesto h2, .section-heading h2, .signup-section h2 { margin: 0; font-size: clamp(44px, 5vw, 82px); line-height: .96; letter-spacing: -.045em; font-weight: 520; }
.manifesto-copy { padding-top: 10px; max-width: 480px; }
.manifesto-copy p { font-size: 18px; color: rgba(23,25,26,.72); }
.manifesto-copy .text-link { margin-top: 20px; }

.scent-section { background: var(--paper); padding-block: 120px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 64px; }
.section-heading > p { max-width: 400px; margin: 0; color: rgba(23,25,26,.62); }
.scent-grid { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); }
.scent-card { min-height: 440px; padding: 22px; border-right: 1px solid var(--line); display: flex; flex-direction: column; transition: flex .3s ease, background .3s ease; overflow: hidden; }
.scent-card:last-child { border: 0; }
.scent-number { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
.core-object { width: 34px; height: 210px; margin: 52px auto auto; border-radius: 20px; background: linear-gradient(90deg, rgba(255,255,255,.55), rgba(23,25,26,.22), rgba(255,255,255,.38)); box-shadow: 0 16px 24px rgba(23,25,26,.12); transform: rotate(5deg); transition: transform .35s ease; }
.scent-card:hover .core-object { transform: rotate(-3deg) translateY(-8px); }
.scent-card h3 { margin: 28px 0 2px; font-family: var(--serif); font-size: 30px; font-weight: 400; }
.scent-card p { margin: 0; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; }
.scent-01 { background: #dbe4e5; }.scent-02 { background: #eee0a9; }.scent-03 { background: #ddd8e5; }.scent-04 { background: #e8d3b6; }.scent-05 { background: #c9c5bf; }

.how-section { padding-block: 130px; }
.how-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.how-grid article { padding: 28px 48px 0 0; border-right: 1px solid var(--line); min-height: 390px; position: relative; }
.how-grid article + article { padding-left: 48px; }
.how-grid article:last-child { border: 0; }
.how-grid article > span { font-family: var(--serif); font-style: italic; color: var(--silver); }
.how-grid h3 { margin: 34px 0 8px; font-size: 22px; }
.how-grid p { max-width: 300px; margin: 0; color: rgba(23,25,26,.64); }
.step-icon { height: 130px; margin-top: 42px; display: grid; place-items: center; }
.step-icon i { display: block; position: relative; width: 88px; height: 24px; border-radius: 16px; background: var(--asphalt); }
.clip-icon i::after { content: ""; position: absolute; width: 34px; height: 7px; background: var(--silver); right: -28px; top: 9px; border-radius: 4px; }
.turn-icon i::after { content: "↻"; position: absolute; font-size: 42px; right: -52px; top: -22px; color: var(--midnight); }
.drive-icon i { transform: rotate(-5deg); box-shadow: 30px 28px 0 -8px var(--silver), 66px 52px 0 -10px var(--silver); }

.discovery-section { background: var(--midnight); color: var(--paper); padding-block: 72px; }
.discovery-card { display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; align-items: center; min-height: 650px; }
.discovery-copy { padding-left: 5vw; }
.discovery-copy h2 { margin: 0; font-family: var(--serif); font-size: clamp(52px, 6vw, 92px); font-weight: 400; line-height: .95; }
.discovery-copy > p:not(.eyebrow) { max-width: 500px; color: rgba(250,249,246,.72); font-size: 18px; }
.discovery-copy ul { list-style: none; padding: 0; margin: 30px 0; border-top: 1px solid rgba(250,249,246,.2); }
.discovery-copy li { padding: 11px 0; border-bottom: 1px solid rgba(250,249,246,.2); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; }
.discovery-visual { min-height: 520px; display: grid; place-items: center; position: relative; }
.package-box { width: 300px; height: 390px; background: var(--stone); color: var(--asphalt); box-shadow: 40px 42px 70px rgba(0,0,0,.32); padding: 34px; transform: rotate(-4deg); display: flex; flex-direction: column; justify-content: space-between; }
.package-box span { font-size: 34px; line-height: .88; letter-spacing: -.04em; font-weight: 650; }
.package-box small { font-size: 10px; letter-spacing: .16em; }
.core-stack { position: absolute; right: 7%; bottom: 12%; display: flex; gap: 8px; transform: rotate(8deg); }
.core-stack i { display: block; width: 19px; height: 130px; border-radius: 12px; background: #dbe4e5; box-shadow: 0 12px 20px rgba(0,0,0,.2); }
.core-stack i:nth-child(2){background:#eee0a9}.core-stack i:nth-child(3){background:#ddd8e5}.core-stack i:nth-child(4){background:#e8d3b6}.core-stack i:nth-child(5){background:#c9c5bf}

.guide-section { padding-block: 130px; }
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.article-grid article { border-top: 1px solid var(--line); padding-top: 14px; }
.article-image { aspect-ratio: 1.4; margin: 0 0 22px; background-color: var(--silver); position: relative; overflow: hidden; }
.article-image::before, .article-image::after { content: ""; position: absolute; }
.article-a { background: linear-gradient(145deg, #d9d5cc, #75818a); }.article-a::before { width: 70%; height: 18%; background: var(--asphalt); left: 15%; top: 42%; border-radius: 30px; transform: rotate(-7deg); }
.article-b { background: linear-gradient(160deg, #22282b, #879195); }.article-b::before { inset: 18% -10%; background: repeating-linear-gradient(0deg, transparent 0 22px, rgba(0,0,0,.7) 23px 33px); transform: rotate(-7deg); }
.article-c { background: linear-gradient(180deg, #cddde1 0 48%, #f2efe8 48%); }.article-c::before { width: 120%; height: 3px; background: var(--asphalt); bottom: 27%; left: -10%; transform: rotate(-8deg); }
.article-grid article > p { margin: 0 0 10px; font-size: 10px; text-transform: uppercase; letter-spacing: .14em; }
.article-grid h3 { margin: 0 0 20px; max-width: 360px; font-family: var(--serif); font-size: 29px; font-weight: 400; line-height: 1.05; }
.article-grid article > a { font-size: 12px; border-bottom: 1px solid; }

.signup-section { background: var(--asphalt); color: var(--paper); text-align: center; padding-block: 120px; }
.signup-inner { max-width: 900px; }
.signup-section h2 { font-family: var(--serif); font-weight: 400; }
.signup-section > div > p:not(.eyebrow):not(.form-note) { color: rgba(250,249,246,.68); font-size: 18px; }
.signup-form { max-width: 650px; margin: 38px auto 14px; display: flex; border-bottom: 1px solid rgba(250,249,246,.45); }
.signup-form input { flex: 1; min-width: 0; padding: 18px 4px; background: transparent; border: 0; color: var(--paper); outline: 0; }
.signup-form input::placeholder { color: rgba(250,249,246,.5); }
.signup-form button { background: transparent; color: var(--paper); border: 0; padding: 0 4px; text-transform: uppercase; letter-spacing: .12em; font-size: 11px; cursor: pointer; }
.form-note { font-size: 10px; color: rgba(250,249,246,.4); }

.site-footer { padding-block: 64px 28px; display: grid; grid-template-columns: 1.2fr .8fr 1fr; gap: 30px; align-items: start; }
.footer-brand { grid-row: span 2; }
.site-footer > p { margin: 0; font-family: var(--serif); font-size: 24px; font-style: italic; }
.site-footer nav { display: flex; justify-content: flex-end; gap: 24px; font-size: 12px; }
.footer-legal { grid-column: 2 / -1; display: flex; justify-content: flex-end; gap: 22px; padding-top: 40px; color: rgba(23,25,26,.55); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }

.reveal { opacity: 0; transform: translateY(18px); animation: reveal .7s ease forwards; }
.hero-visual.reveal { animation-delay: .15s; }
@keyframes reveal { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

@media (max-width: 1040px) {
  :root { --shell: min(100% - 40px, 900px); }
  .site-header { grid-template-columns: 1fr auto; padding-inline: 20px; }
  .menu-toggle { display: block; justify-self: end; }
  .header-cta { display: none; }
  .primary-nav { display: none; position: absolute; top: 84px; left: 0; right: 0; padding: 24px; background: var(--stone); border-bottom: 1px solid var(--line); flex-direction: column; gap: 18px; }
  .primary-nav.is-open { display: flex; }
  .hero { grid-template-columns: 1fr; padding-top: 64px; }
  .hero-copy { padding: 0; }
  .hero-visual { min-height: 560px; }
  .proof-strip { grid-template-columns: repeat(2,1fr); }
  .proof-strip div:nth-child(2) { border-right: 0; }
  .proof-strip div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .manifesto-grid { grid-template-columns: 1fr; }
  .scent-grid { grid-template-columns: repeat(2, 1fr); }
  .scent-card { border-bottom: 1px solid var(--line); }
  .scent-card:nth-child(2n) { border-right: 0; }
  .scent-card:last-child { grid-column: 1 / -1; }
  .discovery-card { grid-template-columns: 1fr 1fr; gap: 20px; }
  .discovery-copy { padding: 0; }
}

@media (max-width: 700px) {
  :root { --shell: calc(100% - 32px); }
  .site-header { min-height: 72px; }
  .primary-nav { top: 72px; }
  .brand { font-size: 11px; letter-spacing: .11em; }
  .brand-mark { width: 24px; }
  .hero { min-height: auto; gap: 48px; padding-block: 56px 32px; }
  .hero h1 { font-size: clamp(57px, 17vw, 84px); }
  .hero-visual { min-height: 430px; width: calc(100% + 32px); margin-left: -16px; }
  .diffuser { width: 82%; }
  .stage-note-top { display: none; }
  .proof-strip { grid-template-columns: 1fr; }
  .proof-strip div { justify-content: flex-start; padding-left: 28px; border: 0; border-bottom: 1px solid var(--line); min-height: 68px; }
  .proof-strip div:nth-child(2) { border-bottom: 1px solid var(--line); }
  .manifesto, .scent-section, .how-section, .guide-section { padding-block: 84px; }
  .manifesto-grid { gap: 34px; }
  .manifesto h2, .section-heading h2, .signup-section h2 { font-size: 45px; }
  .section-heading { align-items: start; flex-direction: column; margin-bottom: 40px; }
  .scent-grid { grid-template-columns: 1fr; }
  .scent-card, .scent-card:nth-child(2n) { min-height: 360px; border-right: 0; border-bottom: 1px solid var(--line); }
  .scent-card:last-child { grid-column: auto; }
  .core-object { height: 150px; margin-top: 30px; }
  .how-grid { grid-template-columns: 1fr; }
  .how-grid article, .how-grid article + article { min-height: 320px; border-right: 0; border-bottom: 1px solid var(--line); padding: 28px 0; }
  .discovery-section { padding-block: 80px; }
  .discovery-card { grid-template-columns: 1fr; }
  .discovery-visual { min-height: 430px; }
  .package-box { width: 230px; height: 320px; }
  .article-grid { grid-template-columns: 1fr; gap: 52px; }
  .signup-section { padding-block: 84px; }
  .signup-form { flex-direction: column; border: 0; gap: 12px; }
  .signup-form input { border-bottom: 1px solid rgba(250,249,246,.45); }
  .signup-form button { min-height: 50px; background: var(--paper); color: var(--asphalt); }
  .site-footer { grid-template-columns: 1fr; }
  .footer-brand { grid-row: auto; }
  .site-footer nav { justify-content: flex-start; flex-wrap: wrap; }
  .footer-legal { grid-column: auto; justify-content: flex-start; flex-wrap: wrap; }
}

/* Soft elevation pass: rounded, floating surfaces without losing the automotive restraint. */
:root {
  --radius-xl: 44px;
  --radius-lg: 30px;
  --radius-md: 22px;
  --radius-pill: 999px;
  --float-shadow: 0 26px 70px rgba(35, 43, 47, .11);
  --soft-shadow: 0 12px 34px rgba(35, 43, 47, .08);
}
body { background: radial-gradient(circle at 8% 18%, rgba(216,230,233,.5), transparent 26rem), radial-gradient(circle at 92% 54%, rgba(232,211,182,.3), transparent 30rem), var(--stone); }
.site-header { width: calc(100% - 32px); min-height: 70px; margin: 14px 16px 0; padding-inline: 24px; top: 12px; border: 1px solid rgba(23,25,26,.12); border-radius: var(--radius-pill); box-shadow: 0 10px 35px rgba(23,25,26,.07); }
.primary-nav a, .header-cta, .button, .signup-form, .signup-form button { border-radius: var(--radius-pill); }
.header-cta { padding-inline: 18px; background: rgba(250,249,246,.55); }
.button { box-shadow: 0 10px 24px rgba(39,56,69,.13); }
.button:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(39,56,69,.18); }
.hero { gap: clamp(42px,5vw,82px); }
.hero-visual { border-radius: var(--radius-xl); box-shadow: var(--float-shadow); transform: translateY(-4px); }
.visual-atmosphere { border-radius: inherit; }
.diffuser { animation: product-float 7s ease-in-out infinite; }
.stage-note { padding: 7px 11px; border: 1px solid rgba(250,249,246,.15); border-radius: var(--radius-pill); background: rgba(23,25,26,.25); backdrop-filter: blur(8px); }
.proof-strip { width: var(--shell); margin: 26px auto 0; border: 1px solid rgba(23,25,26,.1); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--soft-shadow); }
.proof-strip div { background: rgba(250,249,246,.78); }
.manifesto { position: relative; }
.manifesto::before { content:""; position:absolute; z-index:-1; width:320px; height:320px; right:4%; top:18%; border-radius:50%; background:rgba(216,230,233,.32); }
.scent-section { width: calc(100% - 32px); margin-inline: 16px; border-radius: var(--radius-xl); box-shadow: var(--soft-shadow); }
.scent-grid { gap: 14px; border: 0; }
.scent-card, .scent-card:nth-child(2n), .scent-card:last-child { border: 1px solid rgba(23,25,26,.08); border-radius: var(--radius-lg); box-shadow: 0 8px 22px rgba(23,25,26,.055); transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease; }
.scent-card:hover { transform: translateY(-12px) rotate(.35deg); box-shadow: 0 24px 42px rgba(23,25,26,.13); }
.core-object { animation: core-float 6s ease-in-out infinite; }
.scent-card:nth-child(2) .core-object { animation-delay: -.8s; }.scent-card:nth-child(3) .core-object { animation-delay: -1.6s; }.scent-card:nth-child(4) .core-object { animation-delay: -2.4s; }.scent-card:nth-child(5) .core-object { animation-delay: -3.2s; }
.how-grid { gap: 18px; border: 0; }
.how-grid article, .how-grid article + article, .how-grid article:last-child { min-height: 390px; padding: 32px; border: 1px solid rgba(23,25,26,.09); border-radius: var(--radius-lg); background: rgba(250,249,246,.72); box-shadow: var(--soft-shadow); transition: transform .35s ease, box-shadow .35s ease; }
.how-grid article:nth-child(2) { transform: translateY(22px); }.how-grid article:hover { transform: translateY(-7px); box-shadow: var(--float-shadow); }.how-grid article:nth-child(2):hover { transform: translateY(15px); }
.step-icon { border-radius: var(--radius-md); background: linear-gradient(145deg, rgba(216,230,233,.48), rgba(250,249,246,.25)); }
.discovery-section { background: transparent; color: var(--paper); padding-block: 56px; }
.discovery-card { padding: 70px; border-radius: var(--radius-xl); background: radial-gradient(circle at 80% 20%, rgba(216,230,233,.13), transparent 30%), var(--midnight); box-shadow: 0 34px 80px rgba(23,25,26,.18); overflow: hidden; }
.package-box { border-radius: var(--radius-lg); animation: package-float 7.5s ease-in-out infinite; }.core-stack i { border-radius: var(--radius-pill); }
.article-grid { gap: 22px; }.article-grid article { padding: 14px 14px 26px; border: 1px solid rgba(23,25,26,.08); border-radius: var(--radius-lg); background: rgba(250,249,246,.67); box-shadow: var(--soft-shadow); transition: transform .35s ease, box-shadow .35s ease; }.article-grid article:hover { transform: translateY(-8px); box-shadow: var(--float-shadow); }.article-image { border-radius: calc(var(--radius-lg) - 8px); }.article-grid article > p, .article-grid article > h3, .article-grid article > a { margin-left: 8px; margin-right: 8px; }
.signup-section { padding-block: 72px; background: transparent; color: var(--paper); }.signup-inner { max-width: min(1120px,calc(100% - 32px)); padding: 90px clamp(24px,7vw,100px); border-radius: var(--radius-xl); background: radial-gradient(circle at 18% 12%, rgba(216,230,233,.12), transparent 28%), var(--asphalt); box-shadow: var(--float-shadow); }.signup-form { padding: 7px 7px 7px 22px; border: 1px solid rgba(250,249,246,.28); background: rgba(250,249,246,.06); }.signup-form input { padding-block: 12px; }.signup-form button { padding-inline: 22px; background: var(--paper); color: var(--asphalt); }
@keyframes product-float { 0%,100% { transform:rotate(-7deg) rotateY(-8deg) translateY(0); } 50% { transform:rotate(-5.5deg) rotateY(-6deg) translateY(-13px); } }
@keyframes core-float { 0%,100% { translate:0 0; } 50% { translate:0 -9px; } }
@keyframes package-float { 0%,100% { transform:rotate(-4deg) translateY(0); } 50% { transform:rotate(-2.5deg) translateY(-12px); } }
@media (max-width:1040px) { .site-header { grid-template-columns:1fr auto; }.primary-nav { top:78px; left:12px; right:12px; border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--float-shadow); }.proof-strip { width:var(--shell); }.scent-grid { gap:12px; }.discovery-card { padding:52px; } }
@media (max-width:700px) { .site-header { width:calc(100% - 20px); min-height:64px; margin:10px 10px 0; padding-inline:16px; }.primary-nav { top:70px; }.hero-visual { width:100%; margin-left:0; min-height:430px; border-radius:var(--radius-lg); }.proof-strip { grid-template-columns:1fr; border-radius:var(--radius-md); }.scent-section { width:calc(100% - 16px); margin-inline:8px; border-radius:var(--radius-lg); }.scent-card, .scent-card:nth-child(2n), .scent-card:last-child { border-bottom:0; }.how-grid { gap:14px; }.how-grid article, .how-grid article + article, .how-grid article:last-child { min-height:300px; padding:26px; border-bottom:0; }.how-grid article:nth-child(2), .how-grid article:nth-child(2):hover { transform:none; }.discovery-card { padding:42px 24px; border-radius:var(--radius-lg); }.article-grid { gap:20px; }.signup-inner { padding-block:68px; border-radius:var(--radius-lg); }.signup-form { padding:8px; background:rgba(250,249,246,.06); }.signup-form input { padding:14px 10px; border-bottom:0; } }

/* Commerce shell */
.header-actions { justify-self: end; display: flex; align-items: center; gap: 9px; }
.header-account, .header-cart { min-height: 42px; border: 1px solid rgba(23,25,26,.14); background: rgba(250,249,246,.58); border-radius: var(--radius-pill); display: inline-flex; align-items: center; justify-content: center; }
.header-account { width: 42px; }
.header-account svg, .header-cart svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.header-cart { gap: 8px; padding: 0 8px 0 15px; font-size: 11px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.header-cart svg { display: none; }
.header-cart b { min-width: 26px; height: 26px; padding: 0 7px; display: grid; place-items: center; border-radius: var(--radius-pill); background: var(--midnight); color: var(--paper); font-size: 10px; }
.header-account:hover, .header-cart:hover { background: var(--paper); box-shadow: 0 8px 22px rgba(23,25,26,.08); }

.commerce-shell, .content-shell { padding-block: clamp(64px,8vw,118px); }
.content-header { max-width: 930px; margin-bottom: 54px; }
.content-header h1, .commerce-shell .page-title, .woocommerce-products-header__title { margin: 0; font-family: var(--serif); font-size: clamp(52px,7vw,94px); font-weight: 400; line-height: .92; letter-spacing: -.045em; }
.prose { max-width: 900px; margin-inline: auto; }
.prose > *:not(.content-header):not(.article-hero) { max-width: 760px; margin-inline: auto; }
.prose p, .prose li { font-size: 18px; line-height: 1.75; }
.article-hero { width: 100%; max-height:680px; object-fit:cover; border-radius: var(--radius-xl); margin-bottom: 50px; background:#e7e4dd; }
.article-hero.is-transparent { object-fit:contain; padding:clamp(24px,5vw,70px); background:linear-gradient(145deg,#e6e1d7,#c7d0d0); }

.woocommerce .woocommerce-breadcrumb { width: fit-content; margin: 0 0 28px; padding: 9px 14px; border: 1px solid rgba(23,25,26,.1); border-radius: var(--radius-pill); background: rgba(250,249,246,.64); color: rgba(23,25,26,.58); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.woocommerce .woocommerce-breadcrumb span { padding-inline: 8px; color: var(--silver); }
.woocommerce-products-header { min-height: 300px; margin-bottom: 44px; padding: clamp(38px,6vw,76px); display: flex; align-items: end; border-radius: var(--radius-xl); color: var(--paper); background: radial-gradient(circle at 78% 14%, rgba(216,230,233,.22), transparent 30%), linear-gradient(135deg, var(--midnight), var(--asphalt)); box-shadow: var(--float-shadow); overflow: hidden; }
.woocommerce-products-header::after { content: "Fragrance for every drive."; margin-left: auto; align-self: start; max-width: 190px; font-family: var(--serif); font-size: 25px; font-style: italic; line-height: 1.05; color: rgba(250,249,246,.68); }
.woocommerce .woocommerce-result-count { margin: 15px 0 38px; color: rgba(23,25,26,.58); font-size: 12px; }
.woocommerce .woocommerce-ordering { margin: 0 0 32px; }
.woocommerce .woocommerce-ordering select, .woocommerce select, .woocommerce-page select { min-height: 46px; padding: 0 42px 0 16px; border: 1px solid rgba(23,25,26,.13); border-radius: var(--radius-pill); background: rgba(250,249,246,.72); color: var(--asphalt); }

.woocommerce ul.products { clear: both; margin: 0 0 72px; padding: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: 100%!important; min-width: 0; margin: 0!important; padding: 12px 12px 24px; float: none; border: 1px solid rgba(23,25,26,.08); border-radius: var(--radius-lg); background: rgba(250,249,246,.76); box-shadow: var(--soft-shadow); overflow: hidden; transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease; }
.woocommerce ul.products li.product:hover { transform: translateY(-8px); box-shadow: var(--float-shadow); }
.woocommerce ul.products li.product a img { width: 100%; aspect-ratio: 1/1; margin: 0 0 22px; object-fit: cover; border-radius: calc(var(--radius-lg) - 9px); background: var(--headlight); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.woocommerce ul.products li.product:hover a img { transform: scale(1.015); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { min-height: 2.4em; margin: 0; padding: 0 8px; font-family: var(--serif); font-size: clamp(24px,2.3vw,34px); font-weight: 400; line-height: 1.06; }
.woocommerce ul.products li.product .price { margin: 12px 0 18px; padding-inline: 8px; color: var(--asphalt); font-size: 14px; font-weight: 650; }
.woocommerce span.onsale { min-width: auto; min-height: auto; margin: 20px!important; padding: 8px 13px; border-radius: var(--radius-pill); background: var(--midnight); font-size: 10px; line-height: 1; letter-spacing: .1em; text-transform: uppercase; }
.woocommerce ul.products li.product .button { margin: 0 8px; min-height: 44px; padding: 0 17px; display:inline-flex;align-items:center;justify-content:center;white-space:nowrap; border-radius: var(--radius-pill); background: var(--asphalt); color: var(--paper); font-size: 10px; letter-spacing: .09em; }

.woocommerce div.product { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(370px,.72fr); gap: clamp(34px,6vw,90px); align-items: start; }
.woocommerce div.product div.images, .woocommerce div.product div.summary { width: 100%; float: none; }
.woocommerce div.product div.images { margin: 0; }
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper { margin: 0; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--soft-shadow); background: rgba(250,249,246,.72); }
.woocommerce div.product div.images img { width: 100%; background: var(--headlight); }
.woocommerce div.product div.summary { margin: 0; padding: clamp(30px,4vw,56px); border: 1px solid rgba(23,25,26,.09); border-radius: var(--radius-xl); background: rgba(250,249,246,.78); box-shadow: var(--float-shadow); position: sticky; top: 108px; }
.product-kicker { margin: 0 0 18px; font-size: 10px; font-weight: 650; letter-spacing: .17em; text-transform: uppercase; color: rgba(23,25,26,.56); }
.woocommerce div.product .product_title { margin: 0 0 22px; font-family: var(--serif); font-size: clamp(44px,5vw,70px); font-weight: 400; line-height: .92; letter-spacing: -.04em; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--asphalt); font-size: 24px; font-weight: 650; }
.woocommerce-product-details__short-description { margin-block: 28px; color: rgba(23,25,26,.68); font-size: 17px; }
.woocommerce div.product form.cart { margin: 30px 0 20px; display: flex; gap: 10px; }
.woocommerce .quantity .qty { width: 74px; min-height: 54px; border: 1px solid rgba(23,25,26,.14); border-radius: var(--radius-pill); background: var(--paper); }
.woocommerce div.product form.cart .button, .woocommerce button.button.alt, .woocommerce a.button.alt, .woocommerce input.button.alt { min-height: 54px; flex: 1; border-radius: var(--radius-pill); background: var(--midnight); color: var(--paper); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.woocommerce div.product form.cart .button:hover, .woocommerce button.button.alt:hover, .woocommerce a.button.alt:hover { background: var(--asphalt); }
.price-currency-code { font-size:.58em;font-weight:650;letter-spacing:.08em;vertical-align:.14em }
.product-assurances { display:flex; gap:7px; margin:18px 0 26px; }
.product-assurances span { min-height:40px; padding:10px 15px; display:inline-grid; place-items:center; border-radius:var(--radius-pill); background:rgba(216,230,233,.38); text-align:center; font-size:9px; font-weight:650; letter-spacing:.08em; text-transform:uppercase; }
.woocommerce div.product .product_meta { padding-top: 20px; border-top: 1px solid var(--line); display: grid; gap: 6px; color: rgba(23,25,26,.54); font-size: 11px; }
.woocommerce div.product .woocommerce-tabs, .woocommerce div.product .related, .woocommerce div.product .upsells { grid-column: 1/-1; }
.woocommerce div.product .woocommerce-tabs { margin-top: 45px; padding: clamp(26px,5vw,64px); border-radius: var(--radius-xl); background: rgba(250,249,246,.65); box-shadow: var(--soft-shadow); }
.woocommerce div.product .woocommerce-tabs ul.tabs { margin: 0 0 34px; padding: 0; display: flex; gap: 8px; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { margin: 0; padding: 0; border: 0; border-radius: var(--radius-pill); background: rgba(23,25,26,.06); }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { padding: 11px 17px; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--midnight); color: var(--paper); }
.woocommerce div.product .woocommerce-tabs .panel h2, .related > h2, .upsells > h2 { font-family: var(--serif); font-size: clamp(34px,4vw,54px); font-weight: 400; }

.woocommerce-message, .woocommerce-info, .woocommerce-error { margin: 0 0 28px!important; padding: 18px 22px 18px 58px; border: 1px solid rgba(23,25,26,.1); border-top: 0; border-radius: var(--radius-md); background: rgba(250,249,246,.82); box-shadow: var(--soft-shadow); color: var(--asphalt); }
.woocommerce-message::before, .woocommerce-info::before { color: var(--midnight); top: 18px; }
.woocommerce-error::before { color: #9c473f; top: 18px; }
.woocommerce-message .button, .woocommerce-info .button { border-radius: var(--radius-pill); background: var(--midnight); color: var(--paper); }

.woocommerce table.shop_table { border: 0; border-collapse: separate; border-spacing: 0 10px; }
.woocommerce table.shop_table th { padding: 10px 16px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.woocommerce table.shop_table td { padding: 18px 16px; border-top: 1px solid rgba(23,25,26,.08); border-bottom: 1px solid rgba(23,25,26,.08); background: rgba(250,249,246,.72); }
.woocommerce table.shop_table td:first-child { border-left: 1px solid rgba(23,25,26,.08); border-radius: var(--radius-md) 0 0 var(--radius-md); }
.woocommerce table.shop_table td:last-child { border-right: 1px solid rgba(23,25,26,.08); border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.woocommerce-cart table.cart img { width: 90px; border-radius: 16px; }
.woocommerce a.remove { color: rgba(23,25,26,.5)!important; }
.woocommerce a.remove:hover { background: #9c473f; }
.woocommerce .cart-collaterals .cart_totals { width: min(100%,530px); padding: 30px; border-radius: var(--radius-lg); background: rgba(250,249,246,.78); box-shadow: var(--soft-shadow); }
.woocommerce .cart-collaterals .cart_totals h2, .woocommerce-checkout h3, .woocommerce-account h2 { font-family: var(--serif); font-size: 38px; font-weight: 400; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { border-radius: var(--radius-pill); background: var(--midnight); }

.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form.login, .woocommerce form.register, .woocommerce form.checkout_coupon { border: 1px solid rgba(23,25,26,.12); border-radius: var(--radius-md); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea { min-height: 52px; padding: 12px 16px; background: rgba(250,249,246,.78); }
.woocommerce form .form-row textarea { min-height: 130px; }
.woocommerce form .form-row label { margin-bottom: 5px; font-size: 11px; font-weight: 600; letter-spacing: .06em; }
.woocommerce-checkout #customer_details, .woocommerce-checkout #order_review_heading, .woocommerce-checkout #order_review { padding: clamp(24px,4vw,44px); border-radius: var(--radius-lg); background: rgba(250,249,246,.7); box-shadow: var(--soft-shadow); }
.woocommerce-checkout #order_review_heading { margin: 32px 0 0; padding-bottom: 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.woocommerce-checkout #order_review { border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.woocommerce-checkout #payment { background: rgba(216,230,233,.38); border-radius: var(--radius-md); }
.woocommerce-checkout #payment div.payment_box { background: var(--paper); border-radius: 16px; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--paper); }

.woocommerce-account .woocommerce-MyAccount-navigation { width: 27%; padding: 16px; border-radius: var(--radius-lg); background: rgba(250,249,246,.7); box-shadow: var(--soft-shadow); }
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li a { display: block; padding: 13px 16px; border-radius: var(--radius-pill); font-size: 12px; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background: var(--midnight); color: var(--paper); }
.woocommerce-account .woocommerce-MyAccount-content { width: 69%; padding: clamp(24px,4vw,44px); border-radius: var(--radius-lg); background: rgba(250,249,246,.7); box-shadow: var(--soft-shadow); }

/* WooCommerce block cart and checkout */
.wc-block-components-sidebar-layout { gap: 28px; }
.wc-block-cart-items, .wc-block-components-totals-wrapper, .wc-block-checkout__order-notes, .wc-block-checkout__contact-fields, .wc-block-checkout__billing-fields, .wc-block-checkout__shipping-fields { border-radius: var(--radius-lg); background: rgba(250,249,246,.74); }
.wc-block-cart-items { padding: 8px 22px!important; border: 1px solid rgba(23,25,26,.08)!important; }
.wc-block-components-sidebar { padding: 24px!important; border-radius: var(--radius-lg); background: rgba(250,249,246,.78); box-shadow: var(--soft-shadow); }
.wc-block-components-button, .wc-block-cart__submit-button { min-height: 54px; border-radius: var(--radius-pill)!important; background: var(--midnight); color: var(--paper); font-size: 11px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.wc-block-components-text-input input, .wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input { border-radius: 14px!important; background: var(--paper)!important; }

@media (max-width: 1040px) {
  .header-actions { margin-left: auto; }
  .woocommerce ul.products { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .woocommerce div.product { grid-template-columns: 1fr 1fr; gap: 28px; }
  .woocommerce div.product div.summary { padding: 30px; }
}

@media (max-width: 700px) {
  .header-account { display: none; }
  .header-cart { width: 42px; padding: 0; }
  .header-cart svg { display: block; }
  .header-cart > span { display: none; }
  .header-cart b { position: absolute; margin: -28px -30px 0 0; min-width: 20px; height: 20px; padding: 0 5px; }
  .site-header { grid-template-columns: 1fr auto auto; gap: 7px; }
  .menu-toggle { order: 3; }
  .header-actions { order: 2; }
  .primary-nav { order: 4; }
  .commerce-shell, .content-shell { padding-block: 48px 80px; }
  .content-header { margin-bottom: 34px; }
  .woocommerce-products-header { min-height: 250px; padding: 30px; border-radius: var(--radius-lg); align-items: end; }
  .woocommerce-products-header::after { display: none; }
  .woocommerce ul.products { grid-template-columns: 1fr; gap: 16px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { min-height: 0; }
  .woocommerce div.product { display: block; }
  .woocommerce div.product div.images { margin-bottom: 22px; }
  .woocommerce div.product div.images .woocommerce-product-gallery__wrapper, .woocommerce div.product div.summary, .woocommerce div.product .woocommerce-tabs { border-radius: var(--radius-lg); }
  .woocommerce div.product div.summary { position: static; padding: 28px 22px; }
  .woocommerce div.product .product_title { font-size: 44px; }
  .product-assurances { grid-template-columns: 1fr; }
  .product-assurances span { min-height: 40px; }
  .woocommerce div.product .woocommerce-tabs { margin-top: 28px; padding: 28px 20px; }
  .woocommerce div.product .woocommerce-tabs ul.tabs { overflow-x: auto; }
  .woocommerce div.product form.cart { align-items: stretch; }
  .woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { width: 100%; float: none; }
  .woocommerce-account .woocommerce-MyAccount-navigation { margin-bottom: 18px; }
  .woocommerce table.shop_table_responsive tr { margin-bottom: 14px; padding: 12px; border-radius: var(--radius-md); background: rgba(250,249,246,.75); }
  .woocommerce table.shop_table_responsive tr td { border: 0!important; background: transparent; }
  .wc-block-cart-items { padding-inline: 10px!important; }
}

/* Storefront campaign v0.4 */
.storefront-home { overflow: clip; }
.home .site-header { color: var(--paper); border-color: rgba(255,255,255,.15); background: rgba(13,15,16,.78); box-shadow: 0 14px 38px rgba(0,0,0,.24); }
.home .site-header.is-scrolled { background: rgba(13,15,16,.93); }
.home .brand-mark { stroke: currentColor; }
.home .menu-toggle > span:not(.sr-only) { background: var(--paper); }
.home .header-account, .home .header-cart { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.07); }
.home .header-cart b { background: var(--paper); color: var(--asphalt); }
.campaign-kicker { margin: 0 0 22px; font-size: 10px; font-weight: 650; letter-spacing: .21em; text-transform: uppercase; }

.campaign-hero { min-height: 880px; margin-top: -86px; padding: 150px 0 0; position: relative; overflow: hidden; color: var(--paper); background: #0b0d0e; }
.campaign-backdrop { position: absolute; inset: 0; overflow: hidden; background: radial-gradient(circle at 72% 34%, rgba(180,132,79,.3), transparent 17%), radial-gradient(circle at 58% 50%, rgba(120,133,134,.16), transparent 28%), linear-gradient(120deg,#080a0b 0 39%,#151719 61%,#080a0b); }
.campaign-backdrop::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg,rgba(4,5,5,.94) 0%,rgba(5,6,6,.72) 34%,rgba(4,5,5,.13) 70%,rgba(4,5,5,.32) 100%); }
.campaign-backdrop::after { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(0deg,#090b0c 0%,transparent 39%); }
.campaign-video { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: center; }
.road-glow { position: absolute; width: 62vw; height: 240px; right: -7vw; bottom: 8%; border-radius: 50%; background: radial-gradient(ellipse,rgba(202,149,91,.24),transparent 68%); filter: blur(18px); }
.road-glow,.dashboard-lines { display: none; }
.dashboard-lines { position: absolute; width: 65vw; right: -8vw; bottom: 19%; transform: rotate(-7deg); opacity: .85; }
.dashboard-lines i { display: block; height: 13px; margin: 25px 0; border: 1px solid rgba(214,188,157,.14); border-radius: 999px; background: linear-gradient(180deg,#080909,#2e2e2c 48%,#080909 51%); box-shadow: 0 2px 2px rgba(255,255,255,.08),0 10px 17px rgba(0,0,0,.5); }
.campaign-inner { min-height: 610px; position: relative; z-index: 2; display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: 54px; }
.campaign-copy { padding-left: clamp(0px,2.5vw,38px); }
.campaign-copy h1 { max-width: 680px; margin: 0; font-size: clamp(65px,6.4vw,108px); font-weight: 560; line-height: .87; letter-spacing: -.06em; }
.campaign-copy h1 em { font-family: var(--serif); font-weight: 400; color: #ddc19f; }
.campaign-copy > p:not(.campaign-kicker) { max-width: 550px; margin: 32px 0; color: rgba(250,249,246,.74); font-size: clamp(16px,1.25vw,20px); line-height: 1.55; }
.campaign-actions { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.campaign-button { gap: 14px; color: var(--asphalt); background: var(--paper); box-shadow: 0 14px 35px rgba(0,0,0,.28); }
.campaign-link { display: inline-flex; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.5); font-size: 12px; font-weight: 600; }
.campaign-product { min-height: 500px; position: relative; display: grid; place-items: center; perspective: 1200px; }
.product-label,.concept-note { position: absolute; z-index: 2; margin: 0; font-size: 9px; letter-spacing: .15em; text-transform: uppercase; color: rgba(250,249,246,.52); }
.product-label { top: 13%; right: 8%; padding: 8px 12px; border: 1px solid rgba(255,255,255,.15); border-radius: var(--radius-pill); background: rgba(10,11,12,.36); backdrop-filter: blur(8px); }
.concept-note { bottom: 11%; right: 8%; }
.hero-diffuser { width: min(92%,660px); height: 112px; position: relative; display: flex; filter: drop-shadow(0 38px 32px rgba(0,0,0,.7)); transform: rotate(-7deg) rotateY(-10deg); animation: campaign-float 7s ease-in-out infinite; }
.hero-diffuser-cap { width: 17%; position: relative; display: flex; gap: 11%; justify-content: center; align-items: stretch; padding: 0 12px; background: linear-gradient(180deg,#4c4d4c 0,#121313 13%,#030404 55%,#272827 87%,#050606); box-shadow: inset 0 0 0 1px #454747; }
.hero-diffuser-cap i { width: 4px; background: rgba(0,0,0,.75); box-shadow: 1px 0 rgba(255,255,255,.15); }
.cap-left { border-radius: 54px 5px 5px 54px; }.cap-right { border-radius: 5px 54px 54px 5px; }
.hero-diffuser-body { flex: 1; position: relative; display: flex; align-items: center; justify-content: center; gap: 4%; background: linear-gradient(180deg,#3b3c3b 0,#101111 14%,#030404 56%,#242524 91%,#080909); box-shadow: inset 0 0 0 1px #3c3e3d,inset 0 20px 22px rgba(255,255,255,.025); }
.hero-diffuser-body span { width: 8px; height: 31px; border-radius: 8px; background: #020303; box-shadow: inset 1px 0 #4e504f; transform: rotate(21deg); }
.hero-diffuser-body b { position: absolute; bottom: 13px; font-size: 6px; font-weight: 500; letter-spacing: .24em; color: rgba(255,255,255,.34); }
.hero-clip { width: 118px; height: 22px; position: absolute; left: 43%; bottom: -27px; border-radius: 5px 26px 26px 5px; background: linear-gradient(180deg,#3b3d3c,#050606 45%,#272928); box-shadow: 0 9px 12px rgba(0,0,0,.5); transform: rotate(2deg); }
.campaign-benefits { min-height: 120px; position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(255,255,255,.14); }
.campaign-benefits > div { display: flex; gap: 16px; align-items: center; padding: 24px clamp(16px,2.3vw,34px); border-right: 1px solid rgba(255,255,255,.14); }
.campaign-benefits > div:last-child { border-right: 0; }
.campaign-benefits svg { width: 31px; flex: 0 0 31px; fill: none; stroke: #ddc19f; stroke-width: 1.3; }
.campaign-benefits span { display: flex; flex-direction: column; color: rgba(250,249,246,.55); font-size: 10px; line-height: 1.45; }
.campaign-benefits strong { color: var(--paper); font-size: 11px; font-weight: 600; }

.collection-section,.modern-how,.modern-guide { padding-block: clamp(90px,10vw,150px); }
.modern-heading { display: grid; grid-template-columns: 1.15fr .55fr; gap: 8vw; align-items: end; margin-bottom: 58px; }
.modern-heading h2,.how-intro h2,.modern-signup h2 { margin: 0; font-family: var(--serif); font-size: clamp(49px,5vw,78px); font-weight: 400; line-height: .95; letter-spacing: -.04em; }
.modern-heading > p { margin: 0; color: rgba(23,25,26,.66); font-size: 16px; }
.collection-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 22px; }
.feature-product-card,.small-product-card { border: 1px solid rgba(23,25,26,.08); border-radius: 34px; overflow: hidden; background: rgba(250,249,246,.76); box-shadow: var(--soft-shadow); }
.feature-product-card { min-height: 650px; display: grid; grid-template-rows: 1fr auto; }
.feature-product-visual { min-height: 405px; position: relative; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 62% 30%,#52616a 0,transparent 27%),linear-gradient(145deg,#2a3135,#0d0f10 73%); }
.feature-product-visual > img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; }
.feature-product-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(10,12,13,.42),transparent 42%); }
.soft-orbit { position: absolute; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; }.orbit-one { width: 430px;height:430px;right:-80px;top:-130px }.orbit-two { width: 260px;height:260px;left:-90px;bottom:-120px }
.feature-product-visual small { position: absolute; z-index: 2; left: 25px; bottom: 21px; color: rgba(255,255,255,.7); font-size: 9px; letter-spacing: .15em; text-transform: uppercase; }
.card-diffuser,.mini-diffuser { height: 62px; display: flex; border-radius: 32px; overflow: hidden; filter: drop-shadow(0 24px 22px rgba(0,0,0,.5)); transform: rotate(-7deg); }
.card-diffuser { width: min(68%,510px); }
.card-diffuser i,.mini-diffuser i { width: 18%; background: linear-gradient(180deg,#474948,#050606 50%,#282a29); box-shadow: inset 0 0 0 1px #4a4c4b; }
.card-diffuser b,.mini-diffuser b { flex: 1; background: repeating-linear-gradient(105deg,transparent 0 20px,#030404 21px 26px,transparent 27px 46px),linear-gradient(180deg,#373938,#030404 54%,#282a29); }
.refill-row { position: absolute; z-index: 2; display: flex; gap: 12px; right: 8%; bottom: 10%; transform: rotate(8deg); }.refill-row i { width:15px;height:96px;border:1px solid rgba(255,255,255,.35);border-radius:12px;box-shadow:inset 3px 0 5px rgba(255,255,255,.38),inset -3px 0 5px rgba(23,25,26,.15),0 15px 18px rgba(0,0,0,.26)}.refill-row i:nth-child(1){background:#969b9a}.refill-row i:nth-child(2){background:#72b787}.refill-row i:nth-child(3){background:#66b5d3}.refill-row i:nth-child(4){background:#bd85b3}.refill-row i:nth-child(5){background:#efc94f}
.feature-product-copy { padding: 30px 34px 34px; }.feature-product-copy > span,.small-product-card > div > span { font-size: 9px; letter-spacing: .15em; text-transform: uppercase; color: rgba(23,25,26,.5); }.feature-product-copy h3 { margin: 12px 0 7px; font-family: var(--serif); font-size: 43px; font-weight: 400; }.feature-product-copy > p { max-width: 650px; margin: 0; color: rgba(23,25,26,.62); }.feature-product-copy > div { margin-top: 25px; padding-top: 19px; display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);font-size:13px}.feature-product-copy a { border-bottom:1px solid; font-weight:600 }
.supporting-products { display:grid;gap:22px }.small-product-card { min-height: 314px; display:grid;grid-template-rows:1fr auto}.small-product-art { min-height:160px;position:relative;display:grid;place-items:center;overflow:hidden;background:#e3e1da}.small-product-card > div:last-child { padding:20px 24px 24px }.small-product-card h3 { margin:7px 0 4px;font-family:var(--serif);font-size:29px;font-weight:400}.small-product-card p { margin:0 0 11px;color:rgba(23,25,26,.58);font-size:12px}.small-product-card strong { font-size:12px}.refills-card .small-product-art { background:linear-gradient(145deg,#e8dfc2,#d5ddda)}.refills-card .small-product-art img { width:100%;height:100%;object-fit:cover;object-position:center 53% }.asset-note{position:absolute;left:12px;bottom:10px;padding:5px 8px;border-radius:999px;color:#fff;background:rgba(17,20,21,.72);font-size:7px;letter-spacing:.1em;text-transform:uppercase;backdrop-filter:blur(6px)}.diffuser-card .small-product-art { background:radial-gradient(circle at 50% 35%,#536069,transparent 33%),#171a1b}.mini-diffuser { width:68%;height:37px}.mini-diffuser b { background:repeating-linear-gradient(105deg,transparent 0 12px,#030404 13px 17px,transparent 18px 28px),linear-gradient(180deg,#373938,#030404 54%,#282a29)}
.diffuser-card .small-product-art img { width:100%;height:100%;object-fit:cover; }
.product-card-link { color:inherit;text-decoration:none;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease }
.product-card-link:hover { color:inherit;transform:translateY(-3px);box-shadow:0 24px 55px rgba(23,25,26,.12) }
.product-card-link:focus-visible { outline:2px solid currentColor;outline-offset:5px }
.product-card-cta { font-size:12px;font-weight:600 }
.product-card-arrow { float:right;font-size:17px;line-height:1 }

.palette-section { width: calc(100% - 32px); margin-inline: 16px; padding-block: clamp(85px,9vw,135px); border-radius: 44px; background: #fbfaf7; box-shadow: 0 24px 70px rgba(23,25,26,.07); }
.palette-grid { display:grid;grid-template-columns:repeat(5,1fr);gap:13px }.palette-card { min-height:390px;padding:18px;position:relative;display:flex;flex-direction:column;border-radius:25px;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}.palette-card:hover{transform:translateY(-8px);box-shadow:0 22px 35px rgba(23,25,26,.14)}.palette-card > span{font-family:var(--serif);font-style:italic;color:rgba(23,25,26,.45)}.palette-card h3{margin:auto 0 0;font-family:var(--serif);font-size:31px;font-weight:400}.palette-card p{margin:2px 0 0;font-size:9px;font-weight:650;letter-spacing:.13em;text-transform:uppercase}.palette-art{height:220px;position:relative;display:grid;place-items:center}.palette-art i{position:absolute;display:block;transform:rotate(5deg)}.palette-art i:first-child{width:72px;height:190px;border:1px solid rgba(23,25,26,.08);border-radius:9px;background:linear-gradient(90deg,rgba(255,255,255,.76),rgba(255,255,255,.96) 52%,rgba(255,255,255,.67));box-shadow:0 18px 28px rgba(23,25,26,.15)}.palette-art i:nth-child(2){width:17px;height:142px;border-radius:9px;background:var(--pack);box-shadow:inset 3px 0 4px rgba(255,255,255,.35),inset -3px 0 4px rgba(23,25,26,.13)}.palette-art i:last-child{width:45px;height:4px;translate:0 -74px;border-radius:3px;background:var(--pack)}.palette-lemon{--pack:#efc94f;background:#efcf62}.palette-ocean{--pack:#4aaed2;background:#75bdd7}.palette-lavender{--pack:#b879ae;background:#c69bc0}.palette-osmanthus{--pack:#66ae7c;background:#8bc39a}.palette-cologne{--pack:#868d8c;background:#aeb2b1}.sample-disclaimer{margin:24px 0 0;color:rgba(23,25,26,.48);font-size:10px;text-align:right}

.modern-how { display:grid;grid-template-columns:.72fr 1.28fr;gap:8vw;align-items:start }.how-intro{position:sticky;top:115px}.how-intro h2{margin-bottom:26px}.how-intro > p:not(.campaign-kicker){color:rgba(23,25,26,.64);font-size:17px}.dark-text-link{display:inline-flex;gap:12px;align-items:center;margin-top:18px;padding-bottom:5px;border-bottom:1px solid;font-size:12px;font-weight:650}.how-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.how-steps article{min-height:340px;padding:20px;display:flex;flex-direction:column;border:1px solid rgba(23,25,26,.08);border-radius:27px;background:linear-gradient(145deg,#f1eee7,#e5e0d6);box-shadow:var(--soft-shadow)}.how-steps article > span{font-family:var(--serif);font-style:italic;color:rgba(23,25,26,.4)}.how-steps h3{margin:auto 0 4px;font-family:var(--serif);font-size:31px;font-weight:400}.how-steps p{margin:0;color:rgba(23,25,26,.6);font-size:12px}.instruction-art{height:190px;position:relative;display:grid;place-items:center}.step-photo{margin-top:9px;border-radius:19px;background-color:#e8e2d8;background-image:url('../images/guide-refill-steps.webp');background-blend-mode:multiply;background-repeat:no-repeat;background-size:240% auto;box-shadow:inset 0 0 0 1px rgba(23,25,26,.08)}.step-open{background-position:100% 0}.step-insert{background-position:0 75%}.step-close{background-position:100% 75%}
.how-lifestyle-image { width:100%;margin-top:34px;display:block;aspect-ratio:4/3;object-fit:cover;object-position:center 48%;border-radius:27px;box-shadow:var(--soft-shadow); }
.spec-banner{padding-block:58px;color:var(--paper);background:#111415}.spec-banner > div{display:grid;grid-template-columns:repeat(4,1fr)}.spec-banner div div{padding:10px 32px;border-right:1px solid rgba(255,255,255,.15);display:flex;flex-direction:column}.spec-banner div div:last-child{border:0}.spec-banner span{margin-bottom:4px;color:rgba(255,255,255,.45);font-size:9px;letter-spacing:.15em;text-transform:uppercase}.spec-banner strong{font-family:var(--serif);font-size:24px;font-weight:400}

.modern-guide .modern-heading{align-items:end}.modern-guide .modern-heading > a{justify-self:end}.editorial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.editorial-grid article{padding:12px 12px 25px;border:1px solid rgba(23,25,26,.08);border-radius:27px;background:rgba(250,249,246,.7);box-shadow:var(--soft-shadow)}.editorial-art{aspect-ratio:1.42;display:block;position:relative;overflow:hidden;border-radius:19px;background:linear-gradient(145deg,#1d2224,#7c898d)}.editorial-art img{width:100%;height:100%;object-fit:cover}.editorial-art span{position:absolute;width:68%;height:15%;left:16%;top:43%;border-radius:30px;background:#111415;transform:rotate(-7deg);box-shadow:0 15px 18px rgba(0,0,0,.28)}.editorial-grid article:nth-child(2) .editorial-art{background:repeating-linear-gradient(0deg,#101313 0 17px,#353d40 18px 30px)}.editorial-grid article:nth-child(3) .editorial-art{background:linear-gradient(180deg,#b8cdd1 0 46%,#e7e1d5 47%)}.editorial-grid article>p{margin:19px 9px 8px;color:rgba(23,25,26,.5);font-size:9px;letter-spacing:.14em;text-transform:uppercase}.editorial-grid h3{margin:0 9px 22px;font-family:var(--serif);font-size:29px;font-weight:400;line-height:1.05}.article-link{margin-inline:9px;font-size:11px;font-weight:650}
.modern-signup{min-height:570px;margin-bottom:70px;padding:75px;position:relative;display:grid;place-items:center;border-radius:44px;overflow:hidden;color:var(--paper);text-align:center;background:radial-gradient(circle at 50% 0,rgba(190,139,85,.26),transparent 35%),linear-gradient(135deg,#222729,#090b0c 73%);box-shadow:0 34px 80px rgba(23,25,26,.17)}.modern-signup-copy{max-width:720px;position:relative;z-index:2}.modern-signup-copy>p:not(.campaign-kicker):not(.form-note){color:rgba(255,255,255,.62);font-size:17px}.modern-signup .signup-form{padding:7px 7px 7px 20px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(255,255,255,.05);backdrop-filter:blur(10px)}.modern-signup .signup-form input{padding-block:11px}.modern-signup .signup-form button{padding-inline:22px;border-radius:999px;background:var(--paper);color:var(--asphalt)}.signup-road{position:absolute;inset:0;opacity:.15;transform:rotate(-9deg) scale(1.3)}.signup-road i{display:block;height:18px;margin:62px 0;border-radius:999px;background:linear-gradient(180deg,#000,#fff 50%,#000)}
@keyframes campaign-float{0%,100%{transform:rotate(-7deg) rotateY(-10deg) translateY(0)}50%{transform:rotate(-5.5deg) rotateY(-8deg) translateY(-14px)}}

@media(max-width:1040px){
  .home .primary-nav{color:var(--asphalt);background:rgba(250,249,246,.98)}
  .campaign-hero{margin-top:-82px;padding-top:135px}.campaign-inner{grid-template-columns:1fr;gap:0}.campaign-copy{max-width:760px;padding-top:50px}.campaign-product{min-height:450px}.campaign-benefits{grid-template-columns:repeat(2,1fr)}.campaign-benefits>div:nth-child(2){border-right:0}.campaign-benefits>div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.14)}
  .collection-grid{grid-template-columns:1fr}.supporting-products{grid-template-columns:repeat(2,1fr)}.palette-grid{grid-template-columns:repeat(3,1fr)}.palette-card:last-child{grid-column:2/3}.modern-how{grid-template-columns:1fr}.how-intro{position:static;max-width:720px}.modern-heading{grid-template-columns:1fr .55fr}.spec-banner>div{grid-template-columns:repeat(2,1fr);gap:20px 0}.spec-banner div div:nth-child(2){border-right:0}.editorial-grid{grid-template-columns:repeat(2,1fr)}.editorial-grid article:last-child{grid-column:1/-1}
}
@media(max-width:700px){
  .campaign-hero{min-height:auto;margin-top:-80px;padding-top:123px}.campaign-inner{min-height:0}.campaign-copy{padding-top:38px}.campaign-copy h1{font-size:clamp(55px,16vw,77px)}.campaign-copy>p:not(.campaign-kicker){font-size:16px}.campaign-product{min-height:355px;margin-inline:-15px}.hero-diffuser{width:94%;height:72px}.hero-diffuser-body span{width:5px;height:21px}.hero-clip{width:78px;height:15px;bottom:-19px}.concept-note{bottom:8%;left:5%;right:auto}.product-label{display:none}.campaign-benefits{width:100%;grid-template-columns:1fr;margin-top:10px}.campaign-benefits>div{min-height:76px;border-right:0;border-bottom:1px solid rgba(255,255,255,.14)!important}.campaign-benefits>div:last-child{border-bottom:0!important}
  .campaign-video{object-position:66% center}.campaign-backdrop::before{background:linear-gradient(90deg,rgba(4,5,5,.88),rgba(4,5,5,.5) 62%,rgba(4,5,5,.18))}.campaign-balance{min-height:260px}
  .modern-heading{grid-template-columns:1fr;gap:22px;margin-bottom:36px}.modern-heading h2,.how-intro h2,.modern-signup h2{font-size:45px}.collection-section,.modern-how,.modern-guide{padding-block:80px}.collection-grid{display:block}.feature-product-card{min-height:0;margin-bottom:16px}.feature-product-visual{min-height:310px}.card-diffuser{width:80%;height:44px}.refill-row{right:7%;bottom:14%}.refill-row i{width:10px;height:66px}.feature-product-copy{padding:25px 23px 27px}.feature-product-copy h3{font-size:36px}.feature-product-copy>div{align-items:flex-start;flex-direction:column;gap:14px}.supporting-products{grid-template-columns:1fr;gap:16px}.small-product-card{min-height:285px}
  .palette-section{width:calc(100% - 16px);margin-inline:8px;border-radius:30px}.palette-grid{grid-template-columns:1fr}.palette-card,.palette-card:last-child{grid-column:auto;min-height:330px}.palette-art{height:180px}.sample-disclaimer{text-align:left}
  .how-steps{grid-template-columns:1fr}.how-steps article,.how-steps article:nth-child(2){min-height:340px;margin-top:0}.instruction-art{height:160px}.spec-banner>div{grid-template-columns:1fr}.spec-banner div div,.spec-banner div div:nth-child(2){padding:16px 4px;border-right:0;border-bottom:1px solid rgba(255,255,255,.15)}.spec-banner div div:last-child{border-bottom:0}.editorial-grid{grid-template-columns:1fr}.editorial-grid article:last-child{grid-column:auto}.modern-guide .modern-heading>a{justify-self:start}.modern-signup{width:calc(100% - 20px);min-height:520px;margin-bottom:45px;padding:55px 20px;border-radius:30px}.modern-signup .signup-form{padding:7px;border-radius:22px}.modern-signup .signup-form input{padding-inline:12px}.modern-signup .signup-form button{min-height:48px}
}

/* Customer communications */
.form-trap { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
button:disabled { cursor:wait; opacity:.65; }
.form-note.is-success,.contact-status.is-success { color:#b7dfc1!important; }
.form-note.is-error,.contact-status.is-error { color:#ffb9ad!important; }
.contact-page { padding-block:clamp(72px,9vw,130px); }
.contact-intro { display:grid; grid-template-columns:1.35fr .65fr; gap:clamp(40px,8vw,120px); align-items:end; margin-bottom:58px; }
.contact-intro h1 { max-width:800px; margin:0 0 22px; font-size:clamp(58px,8vw,118px); font-weight:520; line-height:.86; letter-spacing:-.06em; }
.contact-intro>div:first-child>p:last-child { max-width:650px; margin:0; color:rgba(23,25,26,.64); font-size:18px; }
.contact-direct { padding:28px; display:flex; flex-direction:column; border:1px solid rgba(23,25,26,.1); border-radius:var(--radius-lg); background:rgba(250,249,246,.7); box-shadow:var(--soft-shadow); }
.contact-direct span,.contact-direct small { color:rgba(23,25,26,.55); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.contact-direct strong { margin:12px 0 22px; font-family:var(--serif); font-size:clamp(22px,2.5vw,34px); font-weight:400; overflow-wrap:anywhere; }
.contact-card { padding:clamp(26px,5vw,72px); border-radius:var(--radius-xl); background:#111415; color:var(--paper); box-shadow:var(--float-shadow); }
.contact-form { max-width:980px; margin-inline:auto; display:grid; gap:24px; }
.contact-field-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.contact-form label { display:grid; gap:9px; font-size:11px; font-weight:650; letter-spacing:.08em; text-transform:uppercase; }
.contact-form label small { font-size:9px; opacity:.5; }
.contact-form input,.contact-form select,.contact-form textarea { width:100%; padding:15px 17px; border:1px solid rgba(255,255,255,.18); border-radius:16px; outline:0; background:rgba(255,255,255,.07); color:var(--paper); font:inherit; text-transform:none; letter-spacing:normal; }
.contact-form select option { color:var(--asphalt); }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color:rgba(255,255,255,.65); box-shadow:0 0 0 3px rgba(216,230,233,.12); }
.contact-form textarea { resize:vertical; min-height:170px; }
.contact-submit { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.contact-submit .button { min-width:190px; border:1px solid rgba(255,255,255,.12); background:var(--paper); color:var(--asphalt); cursor:pointer; }
.contact-status { margin:0; color:rgba(255,255,255,.52); font-size:11px; }
.contact-privacy { margin:0; color:rgba(255,255,255,.42); font-size:10px; }.contact-privacy a,.form-note a { text-decoration:underline; text-underline-offset:3px; }
@media (max-width:760px) { .contact-intro,.contact-field-grid { grid-template-columns:1fr; }.contact-intro h1{font-size:58px}.contact-card{width:calc(100% + 12px);margin-left:-6px;border-radius:28px}.contact-submit{align-items:flex-start;flex-direction:column}.contact-submit .button{width:100%} }

/* Keep navigation visually consistent across storefront and editorial pages. */
.site-header { color:var(--paper); border-color:rgba(255,255,255,.15); background:rgba(13,15,16,.9); box-shadow:0 14px 38px rgba(0,0,0,.2); }
.site-header.is-scrolled { background:rgba(13,15,16,.96); box-shadow:0 14px 38px rgba(0,0,0,.24); }
.site-header .brand-mark { stroke:currentColor; }
.site-header .menu-toggle>span:not(.sr-only) { background:var(--paper); }
.site-header .header-account,.site-header .header-cart { border-color:rgba(255,255,255,.2); background:rgba(255,255,255,.07); }
.site-header .header-cart b { background:var(--paper); color:var(--asphalt); }
@media(max-width:1040px){ .primary-nav,body.home .primary-nav { color:var(--paper); border-color:rgba(255,255,255,.15); background:rgba(13,15,16,.98); } }

/* The installation step pairs a close construction view with the mounted lifestyle image. */
.clip-detail { margin-top:9px; overflow:hidden; border-radius:19px; background:linear-gradient(145deg,#e8e2d8,#d8d2c7); box-shadow:inset 0 0 0 1px rgba(23,25,26,.08); }
.clip-detail img { width:100%; height:100%; padding:10px 38px 0; object-fit:contain; object-position:center bottom; mix-blend-mode:multiply; }

/* The Mile Guide hub */
.guide-hub { padding-bottom:clamp(90px,10vw,150px); }
.guide-hero { padding-block:clamp(80px,10vw,145px) clamp(70px,8vw,115px); }
.guide-hero>div { display:grid; grid-template-columns:1.25fr .55fr; gap:8vw; align-items:end; }
.guide-hero h1 { max-width:950px; margin:0; font-family:var(--serif); font-size:clamp(62px,8.5vw,132px); font-weight:400; line-height:.84; letter-spacing:-.055em; }
.guide-hero>div>p { margin:0; color:rgba(23,25,26,.64); font-size:17px; }
.guide-library { padding:clamp(32px,5vw,72px); border-radius:var(--radius-xl); background:rgba(250,249,246,.72); box-shadow:var(--float-shadow); }
.guide-library-heading { display:flex; justify-content:space-between; gap:30px; align-items:end; margin-bottom:45px; }
.guide-library-heading h2 { margin:0; font-family:var(--serif); font-size:clamp(42px,5vw,70px); font-weight:400; line-height:.95; }
.guide-library-heading span { font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:rgba(23,25,26,.5); }
.guide-card-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.guide-card { display:grid; grid-template-columns:.8fr 1.2fr; min-height:340px; border:1px solid rgba(23,25,26,.08); border-radius:28px; overflow:hidden; background:var(--paper); }
.guide-card:first-child { grid-column:1/-1; grid-template-columns:1.15fr .85fr; min-height:470px; }
.guide-card-art { min-height:280px; position:relative; display:block; overflow:hidden; background:#172025; }
.guide-card-art img { width:100%; height:100%; object-fit:cover; }
.guide-card-art img.is-transparent { object-fit:contain; padding:clamp(18px,3vw,48px); background:linear-gradient(145deg,#e6e1d7,#9da9aa); }
.guide-card-art span { position:absolute; width:72%; height:16%; left:14%; top:43%; border-radius:999px; background:#111415; transform:rotate(-7deg); box-shadow:0 18px 24px rgba(0,0,0,.24); }
.guide-card-art b { position:absolute; left:20px; top:18px; color:rgba(255,255,255,.7); font-family:var(--serif); font-size:18px; font-weight:400; }
.guide-card-1 .guide-card-art { background:linear-gradient(145deg,#d8d2c5,#65747a); }
.guide-card-2 .guide-card-art { background:repeating-linear-gradient(0deg,#101313 0 19px,#364044 20px 33px); }
.guide-card-3 .guide-card-art { background:linear-gradient(180deg,#aac9d0 0 47%,#e7e1d5 48%); }
.guide-card-4 .guide-card-art { background:radial-gradient(circle at 30% 30%,#d8c9dd,transparent 28%),linear-gradient(145deg,#20282b,#8aa0a3); }
.guide-card-5 .guide-card-art { background:radial-gradient(circle at 70% 38%,#e6d07d,transparent 24%),linear-gradient(135deg,#293235,#b1b8b5); }
.guide-card>div { padding:30px; display:flex; flex-direction:column; align-items:flex-start; }
.guide-card>div>p:first-child { margin:0 0 18px; color:rgba(23,25,26,.48); font-size:9px; font-weight:650; letter-spacing:.14em; text-transform:uppercase; }
.guide-card h2 { margin:0 0 14px; font-family:var(--serif); font-size:clamp(29px,3vw,46px); font-weight:400; line-height:1; }
.guide-card>div>p:not(:first-child) { margin:0 0 26px; color:rgba(23,25,26,.62); font-size:13px; }
.guide-card .article-link { margin:auto 0 0; }
.guide-back { display:inline-flex; margin-bottom:28px; padding-bottom:4px; border-bottom:1px solid; font-size:11px; font-weight:650; letter-spacing:.08em; text-transform:uppercase; }
.guide-next { max-width:760px!important; margin:70px auto 0!important; padding:42px!important; border-radius:var(--radius-lg); background:rgba(216,230,233,.45); }
.guide-next p { margin:0 0 10px; font-size:10px; font-weight:650; letter-spacing:.14em; text-transform:uppercase; }
.guide-next h2 { margin:0 0 26px; font-family:var(--serif); font-size:38px; font-weight:400; line-height:1; }
.guide-product { max-width:760px!important; margin:60px auto 0!important; padding:34px 38px!important; border:1px solid rgba(23,25,26,.1); border-radius:var(--radius-lg); background:linear-gradient(145deg,#f3efe6,#e6e1d7); }
.guide-product>p { margin:0 0 9px; font-size:10px; font-weight:650; letter-spacing:.14em; text-transform:uppercase; }
.guide-product h2 { margin:0 0 9px; font-family:var(--serif); font-size:36px; font-weight:400; line-height:1; }
.guide-product>div { margin-bottom:20px; color:rgba(23,25,26,.64); font-size:15px; }
.guide-product>a { display:inline-flex; padding-bottom:4px; border-bottom:1px solid; font-size:12px; font-weight:650; }
@media(max-width:900px){ .guide-hero>div,.guide-card-grid { grid-template-columns:1fr; }.guide-card,.guide-card:first-child { grid-column:auto; grid-template-columns:1fr; min-height:0; }.guide-card-art { min-height:260px; } }
@media(max-width:700px){ .guide-hero h1{font-size:58px}.guide-library{width:calc(100% - 20px);padding:25px 12px}.guide-library-heading{padding-inline:10px;align-items:flex-start;flex-direction:column}.guide-card{border-radius:22px}.guide-card>div{padding:24px}.guide-next,.guide-product{padding:28px!important} }

/* Optional analytics consent */
.footer-cookie-link { padding:0; border:0; background:transparent; color:inherit; font:inherit; letter-spacing:inherit; text-transform:inherit; cursor:pointer; }
.footer-cookie-link:hover,.footer-cookie-link:focus-visible { color:var(--asphalt); text-decoration:underline; text-underline-offset:3px; }
.consent-banner { width:min(720px,calc(100% - 32px)); padding:28px; position:fixed; right:16px; bottom:16px; z-index:10000; display:grid; grid-template-columns:1fr auto; gap:28px; align-items:end; border:1px solid rgba(255,255,255,.14); border-radius:28px; color:var(--paper); background:rgba(17,20,21,.97); box-shadow:0 28px 80px rgba(0,0,0,.3); backdrop-filter:blur(18px); }
.consent-banner[hidden] { display:none; }
.consent-kicker { margin:0 0 9px; color:rgba(255,255,255,.5); font-size:9px; font-weight:650; letter-spacing:.16em; text-transform:uppercase; }
.consent-copy h2 { margin:0 0 10px; font-family:var(--serif); font-size:31px; font-weight:400; line-height:1; }
.consent-copy>p:not(.consent-kicker) { max-width:510px; margin:0 0 11px; color:rgba(255,255,255,.68); font-size:13px; line-height:1.55; }
.consent-copy>a { color:rgba(255,255,255,.78); font-size:10px; text-decoration:underline; text-underline-offset:3px; }
.consent-actions { min-width:152px; display:grid; gap:9px; }
.consent-button { min-height:43px; padding:10px 17px; border:1px solid rgba(255,255,255,.24); border-radius:999px; font:600 11px/1 var(--sans); cursor:pointer; }
.consent-allow { border-color:var(--paper); color:var(--asphalt); background:var(--paper); }
.consent-decline { color:var(--paper); background:transparent; }
.consent-button:focus-visible,.footer-cookie-link:focus-visible { outline:2px solid #fff; outline-offset:3px; }
@media(max-width:650px){ .consent-banner{grid-template-columns:1fr;gap:20px;padding:23px;border-radius:23px}.consent-actions{grid-template-columns:1fr 1fr}.consent-copy h2{font-size:27px} }