:root {
  --berry: #a96859;
  --berry-dark: #3f2119;
  --blush: #d8b5aa;
  --soft-blue: #c9beb5;
  --cream: #f8ecdc;
  --paper: #f3e1cf;
  --ink: #35251f;
  --muted: #74635b;
  --gold: #b98f71;
  --line: rgba(63, 33, 25, 0.14);
  --serif: "Playfair Display", Georgia, serif;
  --sans: "DM Sans", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: var(--sans); font-size: 1rem; line-height: 1.65; }
a { color: inherit; }
img { display: block; max-width: 100%; }
.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: 1rem; top: 1rem; transform: translateY(-200%); padding: .75rem 1rem; background: #fff; color: var(--berry); border-radius: .4rem; }
.skip-link:focus { transform: none; }

.announcement { min-height: 2.25rem; display: grid; place-items: center; padding: .45rem 1rem; background: var(--berry-dark); color: #fff; text-align: center; font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.site-header { position: relative; z-index: 20; height: 5.25rem; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(1.25rem, 4vw, 4.5rem); background: rgba(255,248,242,.96); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: .8rem; text-decoration: none; }
.brand-logo { display: block; width: clamp(13rem, 21vw, 19rem); height: 4.2rem; object-fit: contain; object-position: left center; }
.site-nav { display: flex; align-items: center; gap: clamp(1.1rem, 2.7vw, 2.3rem); }
.site-nav a { text-decoration: none; font-size: .9rem; font-weight: 600; }
.site-nav a:not(.nav-button):hover { color: var(--berry); }
.nav-button { padding: .65rem 1rem; border: 1px solid var(--berry); color: var(--berry); border-radius: 999px; }
.nav-button:hover { background: var(--berry); color: #fff; }
.menu-button { display: none; width: 2.75rem; height: 2.75rem; padding: .65rem; border: 0; background: transparent; }
.menu-button span:not(.sr-only) { display: block; height: 2px; margin: .28rem 0; background: var(--berry-dark); transition: transform .2s, opacity .2s; }

.hero { position: relative; min-height: min(47rem, calc(100vh - 7.5rem)); display: grid; align-items: center; overflow: hidden; }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,248,242,.98) 0%, rgba(255,248,242,.91) 34%, rgba(255,248,242,.28) 60%, rgba(255,248,242,.02) 100%); }
.hero-content { position: relative; z-index: 2; width: min(45rem, 56%); margin-left: clamp(1.25rem, 8vw, 8rem); padding: 5rem 0; }
.eyebrow { margin: 0 0 1rem; color: var(--berry); font-size: .78rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
h1, h2, h3 { margin-top: 0; }
h1 { margin-bottom: 1.45rem; color: var(--berry-dark); font: 700 clamp(3.15rem, 6.3vw, 6.65rem)/.94 var(--serif); letter-spacing: -.055em; }
h1 em { color: var(--berry); font-weight: 600; }
.hero-lede { max-width: 34rem; margin: 0 0 2rem; color: #4e3f44; font-size: clamp(1rem, 1.5vw, 1.17rem); line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 3.2rem; padding: .78rem 1.35rem; border-radius: 999px; text-decoration: none; font-weight: 700; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--berry); color: #fff; box-shadow: 0 12px 30px rgba(124,40,72,.2); }
.button-primary:hover { background: var(--berry-dark); }
.text-link { color: var(--berry-dark); font-weight: 700; text-underline-offset: .3rem; }

.section-pad { padding: clamp(5rem, 9vw, 8.5rem) clamp(1.25rem, 7vw, 7rem); }
.section-intro { max-width: 45rem; margin-bottom: 3rem; }
.section-intro h2, .story-copy h2, .launch-section h2 { margin-bottom: 1rem; color: var(--berry-dark); font: 700 clamp(2.35rem, 4.5vw, 4.5rem)/1.05 var(--serif); letter-spacing: -.035em; }
.section-intro > p:last-child { max-width: 37rem; margin: 0; color: var(--muted); font-size: 1.08rem; }
.category-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; }
.category-card { grid-column: span 2; }
.category-card { min-height: 25rem; display: flex; flex-direction: column; justify-content: space-between; padding: 1.5rem; border-radius: 1.2rem; overflow: hidden; transition: transform .25s, box-shadow .25s; }
.category-card:hover { transform: translateY(-5px); box-shadow: 0 22px 44px rgba(82,22,47,.12); }
.category-card-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.coming-soon { display: inline-flex; align-items: center; min-height: 1.8rem; padding: .35rem .7rem; border: 1px solid currentColor; border-radius: 999px; font-size: .68rem; font-weight: 700; letter-spacing: .1em; line-height: 1; text-transform: uppercase; opacity: .88; }
.size-range-tab { color: inherit; background: transparent; cursor: pointer; font-family: inherit; }
.size-range-tab:hover, .size-range-tab:focus-visible { opacity: 1; outline: 2px solid currentColor; outline-offset: 3px; }
.category-link-tab { color: inherit; text-decoration: none; }
.category-link-tab:hover, .category-link-tab:focus-visible { opacity: 1; outline: 2px solid currentColor; outline-offset: 3px; }
.category-card p { margin: 0 0 .35rem; font-size: .77rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.category-card h3 { margin-bottom: .6rem; font: 700 clamp(2.2rem, 3vw, 3.5rem)/1 var(--serif); }
.category-card div > span { display: block; max-width: 13rem; line-height: 1.45; }
.berry-card { background: var(--berry); color: #fff; }
.blue-card { background: var(--soft-blue); color: #3f3029; }
.gold-card { background: #cda187; color: #382219; }
.cream-card { color: var(--berry-dark); background: #f0d9d4; border: 1px solid rgba(124,40,72,.12); }
.rose-card { color: #fff; background: #8f4f5f; }
.birthday-card { color: var(--berry-dark); background: #e6c5ba; border: 1px solid rgba(124,40,72,.12); }
.coming-note { margin: 2rem 0 0; color: var(--muted); text-align: center; }
.coming-note a { color: var(--berry); font-weight: 700; text-underline-offset: .25rem; }

.size-guide-dialog { width: min(94vw, 46rem); max-height: 90vh; padding: 0; color: var(--ink); background: var(--cream); border: 0; border-radius: 1.25rem; box-shadow: 0 28px 80px rgba(63,33,25,.32); }
.size-guide-dialog::backdrop { background: rgba(40,24,19,.65); backdrop-filter: blur(4px); }
.size-guide-inner { position: relative; padding: clamp(1.5rem, 5vw, 3rem); }
.size-guide-inner h2 { margin: 0 0 1.5rem; color: var(--berry-dark); font: 700 clamp(2rem, 6vw, 3.5rem)/1.05 var(--serif); }
.size-guide-close { position: absolute; top: 1rem; right: 1rem; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; color: var(--berry-dark); background: transparent; border: 1px solid var(--line); border-radius: 50%; font-size: 1.6rem; line-height: 1; cursor: pointer; }
.size-category-tabs, .individual-size-tabs, .gender-tabs { display: flex; flex-wrap: wrap; gap: .65rem; }
.size-category-tabs button, .individual-size-tabs button, .gender-tabs button { min-height: 2.75rem; padding: .65rem 1rem; color: var(--berry-dark); background: #fffaf5; border: 1px solid var(--line); border-radius: 999px; font: inherit; font-weight: 700; cursor: pointer; }
.size-category-tabs button[aria-selected="true"], .individual-size-tabs button[aria-selected="true"], .gender-tabs button[aria-selected="true"] { color: #fff; background: var(--berry); border-color: var(--berry); }
.size-range-label { margin: 1.5rem 0 .75rem; color: var(--muted); font-weight: 700; }
.size-gender-panel { min-height: 8rem; margin-top: 1.5rem; padding: 1.25rem; background: rgba(255,255,255,.55); border: 1px solid var(--line); border-radius: 1rem; }
.size-gender-panel h3 { margin: 0 0 .85rem; color: var(--berry-dark); font: 700 1.5rem/1.2 var(--serif); }
.size-gender-panel p { margin: .85rem 0 0; color: var(--muted); }

.brands-section { background: #fff8f2; border-top: 1px solid var(--line); }
.brands-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .8fr); align-items: end; gap: clamp(2rem, 7vw, 7rem); margin-bottom: 2.75rem; }
.brands-heading h2 { margin: 0; color: var(--berry-dark); font: 700 clamp(2.35rem, 4.5vw, 4.5rem)/1.05 var(--serif); letter-spacing: -.035em; }
.brands-heading > p { max-width: 36rem; margin: 0; color: var(--muted); font-size: 1.08rem; }
.brand-partner-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.brand-partner-card { min-height: 15rem; padding: 1.6rem; background: var(--cream); border: 1px solid var(--line); border-radius: 1.2rem; }
.brand-partner-card > span { color: var(--berry); font: 600 1rem/1 var(--serif); }
.brand-partner-card h3 { margin: 3.8rem 0 .65rem; color: var(--berry-dark); font: 700 1.65rem/1.15 var(--serif); }
.brand-partner-card p { margin: 0; color: var(--muted); }
.vendor-vote-card, .vendor-spotlight-card { display: flex; flex-direction: column; align-items: flex-start; }
.vendor-vote-card h3, .vendor-spotlight-card h3 { margin-top: 2.6rem; }
.spotlight-star { width: 2.75rem; height: 2.75rem; display: grid; place-items: center; font-size: 2.5rem !important; line-height: 1; }
.vendor-vote-button { min-height: 2.75rem; margin: 0; padding: .7rem 1rem; color: #fff; background: var(--berry); border: 0; border-radius: 999px; font: inherit; font-weight: 700; cursor: pointer; }
.vendor-vote-button:hover { background: var(--berry-dark); }
.brands-note { margin: 1.5rem 0 0; color: var(--muted); font-size: .82rem; text-align: center; }

.vendor-vote-dialog { width: min(92vw, 37rem); max-height: 90vh; padding: 0; color: var(--ink); background: var(--cream); border: 0; border-radius: 1.25rem; box-shadow: 0 28px 80px rgba(63,33,25,.32); }
.vendor-vote-dialog::backdrop { background: rgba(40,24,19,.65); backdrop-filter: blur(4px); }
.vendor-vote-dialog-inner { position: relative; padding: clamp(1.5rem, 5vw, 2.75rem); }
.vendor-vote-dialog h2 { margin: 0 0 .75rem; color: var(--berry-dark); font: 700 clamp(2rem, 6vw, 3.25rem)/1.05 var(--serif); }
.vendor-vote-dialog-inner > p:not(.eyebrow) { margin: 0 0 1.5rem; color: var(--muted); }
.vendor-vote-close { position: absolute; top: 1rem; right: 1rem; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; color: var(--berry-dark); background: transparent; border: 1px solid var(--line); border-radius: 50%; font-size: 1.6rem; line-height: 1; cursor: pointer; }
.vendor-vote-dialog form { display: grid; gap: .55rem; }
.vendor-vote-dialog label { margin-top: .45rem; color: var(--berry-dark); font-size: .9rem; font-weight: 700; }
.vendor-vote-dialog label span { color: var(--muted); font-size: .78rem; font-weight: 500; }
.vendor-vote-dialog input { width: 100%; min-height: 3rem; padding: .7rem .85rem; color: var(--ink); background: #fffaf5; border: 1px solid var(--line); border-radius: .65rem; font: inherit; }
.vendor-vote-dialog input:focus { outline: 3px solid rgba(169,104,89,.22); border-color: var(--berry); }
.vendor-vote-submit { margin-top: 1rem; border: 0; cursor: pointer; }
.vendor-vote-help { margin: .25rem 0 0; color: var(--muted); font-size: .78rem; text-align: center; }

.birthday-section { display: grid; grid-template-columns: minmax(18rem, .75fr) minmax(0, 1.25fr); background: #f0d9d4; color: var(--berry-dark); }
.birthday-kicker { min-height: 34rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.1rem; padding: clamp(3rem, 7vw, 6rem); color: #fff; text-align: center; background: radial-gradient(circle at 20% 15%, rgba(255,255,255,.2), transparent 28%), linear-gradient(145deg, var(--berry), #8f4f5f); }
.birthday-kicker::before, .birthday-kicker::after { content: "✦"; color: #f6d4c8; font-size: 1.5rem; }
.birthday-kicker span { font-size: .76rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.birthday-kicker strong { max-width: 25rem; font: 700 clamp(3.1rem, 6vw, 5.8rem)/.95 var(--serif); letter-spacing: -.05em; }
.birthday-copy { align-self: center; max-width: 54rem; padding: clamp(4rem, 8vw, 7.5rem); }
.birthday-copy h1, .birthday-copy h2 { margin-bottom: 1.35rem; color: var(--berry-dark); font: 700 clamp(2.55rem, 5vw, 5rem)/1 var(--serif); letter-spacing: -.045em; }
.birthday-copy > p { max-width: 43rem; color: #5f4941; }
.birthday-copy .birthday-lead { margin-bottom: .8rem; color: var(--berry-dark); font-size: 1.15rem; font-weight: 600; }
.birthday-copy .birthday-pitch { margin: 1.65rem 0 1rem; color: var(--berry); font: italic 600 1.4rem/1.3 var(--serif); }
.birthday-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: 0 0 2rem; }
.birthday-options article { padding: 1.15rem; background: rgba(255,255,255,.62); border: 1px solid rgba(63,33,25,.12); border-radius: 1rem; }
.birthday-options article > span { color: var(--berry); font: 600 .82rem/1 var(--serif); }
.birthday-options h3 { margin: .7rem 0 .35rem; color: var(--berry-dark); font: 700 1.12rem/1.2 var(--serif); }
.birthday-options p { margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.5; }
.birthday-button { color: #fff; background: var(--berry-dark); cursor: default; }

.promise-section { display: grid; grid-template-columns: .95fr 1.05fr; background: var(--berry-dark); color: #fff; }
.promise-quote { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 38rem; padding: clamp(4rem, 7vw, 7rem); background: radial-gradient(circle at 20% 12%, rgba(233,184,189,.24), transparent 35%), var(--berry); }
.quote-mark { position: absolute; top: 2rem; left: 2rem; color: rgba(255,255,255,.12); font: 700 15rem/1 var(--serif); }
.promise-heading { position: relative; margin: 0 0 2rem; color: #f3cbd0; font-size: .82rem; font-weight: 700; letter-spacing: .18em; line-height: 1.2; text-transform: uppercase; }
.promise-quote blockquote { position: relative; margin: 0; font: 600 clamp(2.2rem, 4vw, 4rem)/1.16 var(--serif); letter-spacing: -.035em; }
.promise-quote blockquote em { color: #f3cbd0; }
.promise-quote > p { margin: 1.5rem 0 0; color: #f3cbd0; font-weight: 700; }
.promise-points { display: grid; align-content: center; gap: 2.25rem; padding: clamp(4rem, 7vw, 7rem); }
.promise-points article { display: grid; grid-template-columns: 3rem 1fr; column-gap: 1rem; }
.promise-points article > span { grid-row: 1 / 3; width: 3rem; height: 3rem; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; color: #efcbd0; font: 600 1.2rem/1 var(--serif); }
.promise-points h3 { margin: 0 0 .25rem; font: 600 1.5rem/1.2 var(--serif); }
.promise-points p { max-width: 28rem; margin: 0; color: rgba(255,255,255,.73); }

.story-section { display: grid; grid-template-columns: minmax(16rem, .65fr) minmax(0, 1.35fr); gap: clamp(3rem, 8vw, 9rem); background: var(--paper); }
.story-label { position: sticky; top: 2rem; align-self: start; text-align: center; }
.story-label .eyebrow { text-align: left; }
.story-monogram { width: min(100%, 22rem); aspect-ratio: 1; display: grid; place-items: center; margin: 2rem auto 1.25rem; overflow: hidden; background: linear-gradient(145deg, var(--berry), var(--berry-dark)); border: .6rem solid #ead7ce; border-radius: 48% 52% 48% 52% / 55% 45% 55% 45%; box-shadow: 0 25px 55px rgba(82,22,47,.18); }
.story-monogram img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.story-role { margin: 0; color: var(--berry); font-size: .78rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.story-copy { max-width: 51rem; }
.story-copy h2 { margin-bottom: 1.2rem; }
.story-copy p { margin: 0 0 1.25rem; color: #55474d; font-size: 1.05rem; }
.story-copy .story-lead { color: var(--berry); font: 600 1.5rem/1.5 var(--serif); }
.story-copy .story-close { padding: 1.5rem 0 1.5rem 1.5rem; border-left: 3px solid var(--gold); color: var(--berry-dark); font-weight: 600; }
.story-copy .signature { margin-top: 2rem; color: var(--berry); font: italic 600 1.6rem/1 var(--serif); }
.story-gallery { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; margin-top: clamp(1rem, 3vw, 2.5rem); }
.story-photo { position: relative; min-height: 19rem; margin: 0; overflow: hidden; background: #ead7ce; border-radius: 1.2rem; box-shadow: 0 18px 40px rgba(82,22,47,.12); }
.story-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 38%; }
.story-photo figcaption { position: absolute; right: 1rem; bottom: 1rem; left: 1rem; padding: .75rem 1rem; color: #fff; background: rgba(82,22,47,.78); border-radius: .75rem; font: italic 600 1.05rem/1.25 var(--serif); backdrop-filter: blur(6px); }
.photo-placeholder { min-height: 19rem; display: grid; place-content: center; justify-items: center; padding: 2rem; text-align: center; color: var(--berry-dark); background: linear-gradient(145deg, rgba(255,248,242,.85), rgba(216,181,170,.38)); border: 1px dashed rgba(169,104,89,.55); border-radius: 1.2rem; }
.photo-placeholder span { width: 3.25rem; height: 3.25rem; display: grid; place-items: center; margin-bottom: 1rem; color: var(--berry); border: 1px solid rgba(169,104,89,.35); border-radius: 50%; font-size: 1.4rem; }
.photo-placeholder p { margin: 0; color: var(--berry-dark); font: 600 1.5rem/1.2 var(--serif); }
.photo-placeholder small { margin-top: .45rem; color: var(--muted); font-size: .82rem; }

.launch-section { display: flex; align-items: center; justify-content: space-between; gap: 3rem; padding: clamp(4rem, 8vw, 7rem) clamp(1.25rem, 7vw, 7rem); background: var(--soft-blue); color: #3f3029; }
.launch-section > div { max-width: 50rem; }
.launch-section h2 { max-width: 45rem; color: var(--berry-dark); }
.launch-section > div > p:last-child { max-width: 42rem; margin: 0; font-size: 1.08rem; }
.launch-section .eyebrow { color: var(--berry-dark); }
.button-light { flex: 0 0 auto; background: var(--cream); color: var(--berry-dark); box-shadow: 0 12px 30px rgba(37,61,72,.12); }

.app-section { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(1.25rem, 3vw, 2.5rem); padding: clamp(3.5rem, 6vw, 5.5rem) clamp(1.25rem, 7vw, 7rem); background: var(--berry); color: #fff; }
.app-mark { width: clamp(7.5rem, 13vw, 10rem); aspect-ratio: 1.45; display: grid; place-items: center; padding: .8rem; border: 1px solid rgba(255,255,255,.55); border-radius: 1.5rem; background: var(--cream); box-shadow: 0 16px 36px rgba(63,33,25,.18); }
.app-mark img { display: block; width: 100%; height: auto; }
.app-copy { max-width: 46rem; }
.app-copy .eyebrow { margin-bottom: .55rem; color: #f8e4df; }
.app-copy h2 { margin: 0 0 .55rem; color: #fff; font: 700 clamp(2.1rem, 4vw, 3.75rem)/1.05 var(--serif); letter-spacing: -.035em; }
.app-copy p:last-child { margin: 0; color: rgba(255,255,255,.82); font-size: 1.05rem; }
.app-coming-soon { flex: 0 0 auto; color: var(--berry-dark); background: var(--cream); cursor: default; }

.site-footer { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; padding: 2.5rem clamp(1.25rem, 5vw, 5rem); background: var(--cream); }
.site-footer p { margin: 0; color: var(--muted); font-size: .86rem; }
.site-footer > p:nth-child(2) { text-align: center; font-family: var(--serif); font-style: italic; font-size: 1rem; }
.copyright { text-align: right; }
.footer-social { color: var(--berry); font-weight: 700; text-underline-offset: .2rem; }

@media (max-width: 950px) {
  .category-grid { grid-template-columns: repeat(2, 1fr); }
  .category-card { grid-column: auto; }
  .category-card { min-height: 19rem; }
  .promise-section { grid-template-columns: 1fr; }
  .birthday-section { grid-template-columns: 1fr; }
  .birthday-kicker { min-height: 24rem; }
  .brand-partner-grid { grid-template-columns: 1fr; }
  .brand-partner-card { min-height: 12rem; }
  .brand-partner-card h3 { margin-top: 2.5rem; }
  .vendor-vote-button { margin-top: 0; }
  .promise-quote { min-height: 30rem; }
  .story-section { grid-template-columns: 1fr; }
  .story-label { position: static; max-width: 18rem; }
  .story-gallery { grid-template-columns: 1fr; }
  .story-photo { min-height: 28rem; }
  .photo-placeholder { min-height: 14rem; }
  .site-footer { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .copyright { text-align: center; }
}

@media (max-width: 740px) {
  .site-header { height: 4.5rem; padding: 0 1.15rem; }
  .menu-button { display: block; }
  .site-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: .75rem 1.2rem 1.2rem; background: var(--cream); border-bottom: 1px solid var(--line); box-shadow: 0 18px 35px rgba(82,22,47,.1); }
  .site-nav.open { display: flex; }
  .site-nav a { padding: .8rem; }
  .site-nav .nav-button { margin-top: .4rem; text-align: center; }
  .menu-button[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .menu-button[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-button[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .hero { min-height: 42rem; align-items: end; }
  .hero-image { object-position: 65% center; }
  .hero-shade { background: linear-gradient(0deg, rgba(255,248,242,.99) 0%, rgba(255,248,242,.9) 48%, rgba(255,248,242,.1) 78%); }
  .hero-content { width: auto; margin: 0; padding: 13rem 1.25rem 3.5rem; }
  h1 { font-size: clamp(3rem, 14vw, 4.8rem); }
  .category-grid { grid-template-columns: 1fr; }
  .category-card { min-height: 16rem; }
  .birthday-kicker { min-height: 20rem; padding: 3.5rem 1.25rem; }
  .birthday-copy { padding: 4rem 1.25rem; }
  .birthday-options { grid-template-columns: 1fr; }
  .brands-heading { grid-template-columns: 1fr; gap: 1rem; }
  .promise-quote, .promise-points { padding: 4rem 1.3rem; }
  .story-photo { min-height: 0; }
  .story-photo img { height: auto; object-fit: contain; object-position: center; }
  .story-photo figcaption { position: static; border-radius: 0; }
  .launch-section { align-items: flex-start; flex-direction: column; }
  .button-light { width: 100%; }
  .app-section { grid-template-columns: auto 1fr; }
  .app-coming-soon { grid-column: 1 / -1; width: 100%; }
  .brand-logo { width: 12.5rem; height: 3.55rem; }
}

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