:root {
  --ivory: #f7f3eb;
  --ivory-2: #faf7f0;
  --paper: #fffdf8;
  --ink: #171714;
  --muted: #706b61;
  --line: #ded8cd;
  --dark: #080807;
  --max: 1220px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ivory);
  color: var(--ink);
  font-family: Inter, Arial, Helvetica, sans-serif;
  letter-spacing: 0;
}
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; height: 100%; object-fit: cover; }
button, input, select, textarea { font: inherit; }
.container { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; }

.announcement {
  min-height: 30px;
  background: #050505;
  color: #fffdf8;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(250, 247, 240, .94);
  border-bottom: 1px solid rgba(222, 216, 205, .9);
  backdrop-filter: blur(14px);
}
.nav { min-height: 70px; display: flex; align-items: center; gap: 28px; }
.wordmark, .footer-wordmark { font-weight: 800; letter-spacing: .08em; }
.wordmark { font-size: 22px; margin-right: auto; }
.nav-links { display: flex; align-items: center; gap: 26px; color: #302d28; font-size: 14px; font-weight: 700; }
.nav-links a { padding: 24px 0; }
.nav-icons { display: flex; gap: 8px; }
.icon-btn, .nav-toggle {
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink);
  height: 38px;
  min-width: 38px;
  display: grid;
  place-items: center;
}
.nav-toggle { display: none; padding: 0 14px; border-radius: 999px; font-weight: 800; }
.icon-btn { border-radius: 50%; }

.section { padding: 84px 0; }
.eyebrow {
  margin: 0 0 12px;
  color: #85796b;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(42px, 6vw, 82px); line-height: .94; letter-spacing: 0; }
h2 { font-size: clamp(30px, 3.8vw, 52px); line-height: 1; }
h3 { font-size: 18px; }
p { color: var(--muted); line-height: 1.65; }
.btn {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ink);
  border-radius: 999px;
  padding: 0 22px;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}
.btn.primary, .btn.light { background: var(--ink); color: #fff; }
.btn.light { background: #fffdf8; color: #111; border-color: #fffdf8; }
.btn.outline, .btn.dark-outline { background: transparent; color: var(--ink); }

.hero-frame {
  min-height: 590px;
  margin-top: 30px;
  display: grid;
  grid-template-columns: 42% 58%;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--dark);
}
.hero-copy-panel { display: flex; flex-direction: column; justify-content: center; padding: 56px; color: #fffdf8; }
.hero-copy-panel h1 { max-width: 520px; color: #fffdf8; }
.hero-copy-panel p { max-width: 420px; color: #d8d0c3; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.hero-copy-panel .dark-outline { color: #fffdf8; border-color: rgba(255, 253, 248, .5); }
.hero-photo { min-height: 590px; }
.value-cells { padding: 18px 0 0; }
.value-grid { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--paper); border: 1px solid var(--line); }
.value-grid article { min-height: 132px; padding: 24px; border-right: 1px solid var(--line); }
.value-grid article:last-child { border-right: 0; }
.value-grid span { width: 30px; height: 30px; display: block; margin-bottom: 16px; border: 2px solid #171714; border-radius: 50%; position: relative; }
.value-grid span:after { content: ""; position: absolute; inset: 7px; border: 2px solid #171714; }
.value-grid h3 { margin-bottom: 6px; }
.value-grid p { margin: 0; font-size: 14px; }

.section-row { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.text-link { font-weight: 800; border-bottom: 1px solid currentColor; }
.featured-grid, .shop-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.shop-grid { grid-template-columns: repeat(3, 1fr); gap: 24px; }
.product-card { background: var(--paper); border: 1px solid var(--line); }
.product-image { aspect-ratio: 1 / 1; display: block; background: #eee6da; }
.product-info { min-height: 128px; display: flex; flex-direction: column; justify-content: space-between; padding: 16px; }
.product-info h3 { margin-bottom: 5px; }
.product-info p, .product-meta { margin: 0; font-size: 13px; color: var(--muted); }
.product-meta { display: flex; justify-content: space-between; align-items: center; }
.product-meta a { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line); background: #fff; font-size: 22px; color: var(--ink); }

.lifestyle-banner, .custom-banner {
  position: relative;
  min-height: 430px;
  margin-bottom: 92px;
  overflow: hidden;
  background: var(--dark);
  color: #fffdf8;
}
.lifestyle-banner img, .custom-banner img { position: absolute; inset: 0; opacity: .72; }
.lifestyle-banner:before, .custom-banner:before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.78), rgba(0,0,0,.18)); z-index: 1; }
.lifestyle-banner > div, .custom-banner > div { position: relative; z-index: 2; max-width: 520px; padding: 58px; }
.lifestyle-banner h2, .custom-banner h2, .lifestyle-banner p, .custom-banner p { color: #fffdf8; }

.page-hero { padding: 86px 0 46px; }
.page-hero h1 { max-width: 760px; margin-bottom: 18px; }
.page-hero p:last-child { max-width: 650px; font-size: 18px; }
.shop-section { padding-bottom: 88px; }
.shop-controls { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.filter-row { display: flex; gap: 8px; flex-wrap: wrap; }
.filter-btn, .sort-control select { min-height: 42px; border: 1px solid var(--line); background: var(--paper); padding: 0 16px; border-radius: 999px; color: var(--ink); font-weight: 800; }
.filter-btn.active { background: var(--ink); color: #fff; border-color: var(--ink); }
.sort-control { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 13px; font-weight: 800; }
.custom-banner { display: grid; grid-template-columns: 54% 46%; }
.custom-banner img { position: static; opacity: 1; }
.custom-banner:before { display: none; }
.custom-banner > div { padding: 56px; }

.product-page { padding: 44px 0 96px; }
.breadcrumb { display: flex; gap: 10px; margin-bottom: 24px; color: var(--muted); font-size: 13px; font-weight: 700; }
.product-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); gap: 44px; align-items: start; }
.product-main-photo { aspect-ratio: 1 / 1; background: #efe8dc; border: 1px solid var(--line); }
.thumb-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 14px; }
.thumb { aspect-ratio: 1 / 1; padding: 0; border: 2px solid transparent; background: none; cursor: pointer; }
.thumb.active { border-color: #171714; }
.buy-panel { background: var(--paper); border: 1px solid var(--line); padding: 34px; }
.buy-panel h1 { font-size: clamp(38px, 4vw, 58px); margin-bottom: 14px; }
.status-line { font-weight: 800; color: #2c2924; }
.product-description { font-size: 17px; }
.option-block { padding: 22px 0; border-top: 1px solid var(--line); }
.option-block > span { display: block; margin-bottom: 12px; font-size: 13px; font-weight: 800; color: #6b6358; text-transform: uppercase; }
.chip-row, .swatch-row { display: flex; gap: 10px; }
.chip { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 10px 16px; font-weight: 800; }
.chip.active { border-color: var(--ink); background: var(--ink); color: #fff; }
.swatch { width: 34px; height: 34px; border: 3px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px var(--line); }
.swatch.active { box-shadow: 0 0 0 2px var(--ink); }
.swatch.blue { background: #22a6ff; }
.swatch.pink { background: #ff4bad; }
.swatch.lime { background: #b4f24e; }
.quantity div { width: 136px; height: 44px; display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--line); background: #fff; }
.quantity button { width: 42px; height: 42px; border: 0; background: transparent; font-size: 20px; }
.product-actions { margin-top: 8px; }
.feature-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 44px 0; }
.feature-row article { border: 1px solid var(--line); background: var(--paper); padding: 20px; font-weight: 800; }
.accordion-list, .faq-groups { display: grid; gap: 12px; }
.accordion { background: var(--paper); border: 1px solid var(--line); padding: 0 20px; }
.accordion summary { cursor: pointer; padding: 20px 0; font-weight: 800; list-style: none; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary:after { content: "+"; float: right; }
.accordion[open] summary:after { content: "-"; }
.accordion p { padding-bottom: 20px; margin: 0; }

.story-hero { padding: 38px 0 0; background: var(--dark); color: #fffdf8; }
.story-split { display: grid; grid-template-columns: 46% 54%; min-height: 560px; }
.story-split > div { display: flex; flex-direction: column; justify-content: center; padding-right: 50px; }
.story-split h1, .story-split p { color: #fffdf8; }
.story-copy { display: grid; grid-template-columns: .9fr 1.1fr; gap: 64px; }
.story-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; padding-bottom: 94px; }
.story-card-grid article { background: var(--paper); border: 1px solid var(--line); }
.story-card-grid img { aspect-ratio: 4 / 3; }
.story-card-grid h3, .story-card-grid p { padding: 0 18px; }
.story-card-grid h3 { margin-top: 18px; }
.story-card-grid p { padding-bottom: 18px; }

.process-list { display: grid; gap: 20px; padding-bottom: 94px; }
.process-row { display: grid; grid-template-columns: 42% 58%; min-height: 310px; background: var(--paper); border: 1px solid var(--line); }
.process-row > div { display: flex; flex-direction: column; justify-content: center; padding: 40px 52px; }
.process-row span { color: #a79d8e; font-weight: 800; margin-bottom: 14px; }

.use-case-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; padding-bottom: 96px; }
.use-case-grid article { min-height: 360px; position: relative; overflow: hidden; background: #111; }
.use-case-grid article:after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.78), rgba(0,0,0,.1)); }
.use-case-grid div { position: absolute; z-index: 2; left: 28px; right: 28px; bottom: 26px; }
.use-case-grid h2, .use-case-grid p { color: #fffdf8; }
.faq-groups { grid-template-columns: repeat(3, 1fr); align-items: start; padding-bottom: 54px; }
.faq-groups > article { display: grid; gap: 10px; }
.faq-groups h2 { font-size: 28px; margin-bottom: 4px; }
.soft-cta { margin-bottom: 92px; padding: 46px; background: linear-gradient(135deg, #fffdf8, #eee4d5); border: 1px solid var(--line); }
.soft-cta h2 { margin-bottom: 12px; }

.contact-dark { background: var(--dark); padding: 48px 0 78px; }
.contact-card { display: grid; grid-template-columns: 55% 45%; gap: 32px; color: #fffdf8; }
.contact-left { padding: 64px 40px 64px 0; }
.contact-left h1, .contact-left p { color: #fffdf8; }
.contact-facts { display: grid; gap: 14px; margin-top: 34px; }
.contact-facts p { display: flex; align-items: center; gap: 14px; margin: 0; }
.contact-facts span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; color: #fff; font-weight: 800; }
.contact-form { background: var(--paper); color: var(--ink); border: 1px solid var(--line); padding: 28px; display: grid; gap: 14px; }
.contact-form label { display: grid; gap: 7px; color: #5e574e; font-size: 13px; font-weight: 800; }
.contact-form input, .contact-form textarea, .newsletter input { width: 100%; border: 1px solid var(--line); background: #fff; padding: 12px 13px; color: var(--ink); }
.contact-form textarea { min-height: 140px; resize: vertical; }
.notice { display: none; padding: 12px; border: 1px solid #c6ddc1; background: #eef8eb; color: #244b20; font-size: 13px; font-weight: 800; }
.notice.show { display: block; }
.follow-block { position: relative; min-height: 330px; margin: 70px auto 94px; overflow: hidden; background: #111; }
.follow-block:after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.72), rgba(0,0,0,.12)); }
.follow-block > div { position: absolute; z-index: 2; left: 42px; bottom: 36px; max-width: 470px; }
.follow-block h2, .follow-block p { color: #fffdf8; }
.policy-page { min-height: 54vh; max-width: 860px; }

.footer { background: #070706; color: #fffdf8; padding: 52px 0 24px; }
.footer-grid { display: grid; grid-template-columns: 1.45fr .7fr .7fr 1fr; gap: 38px; }
.footer-wordmark { font-size: 40px; margin-bottom: 18px; }
.footer h2 { margin: 0 0 14px; font-size: 14px; text-transform: uppercase; color: #fffdf8; }
.footer p, .copyright { color: #bab2a8; font-size: 14px; }
.footer-links { display: grid; gap: 10px; color: #ddd6cc; font-size: 14px; }
.newsletter { display: flex; margin-bottom: 18px; }
.newsletter button { border: 0; background: #fffdf8; color: #111; padding: 0 14px; font-weight: 800; }
.copyright { margin-top: 42px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.15); }

@media (max-width: 1024px) {
  .hero-frame, .story-split, .product-layout, .contact-card { grid-template-columns: 1fr; }
  .hero-copy-panel, .story-split > div, .contact-left { padding: 42px; }
  .hero-photo { min-height: 430px; }
  .value-grid, .feature-row, .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .featured-grid, .shop-grid, .faq-groups { grid-template-columns: repeat(2, 1fr); }
  .process-row, .custom-banner, .story-copy { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .container { width: min(calc(100% - 32px), var(--max)); }
  .nav { min-height: 64px; flex-wrap: wrap; }
  .nav-toggle { display: grid; }
  .nav-links { display: none; width: 100%; order: 5; padding-bottom: 16px; }
  .nav-links.open { display: grid; gap: 4px; }
  .nav-links a { padding: 12px 0; border-top: 1px solid var(--line); }
  .nav-icons { margin-left: 0; }
  .hero-frame { min-height: 0; margin-top: 18px; }
  .hero-copy-panel { padding: 34px 24px; }
  .hero-photo { min-height: 320px; }
  .value-grid, .featured-grid, .shop-grid, .story-card-grid, .use-case-grid, .faq-groups, .footer-grid { grid-template-columns: 1fr; }
  .value-grid article { border-right: 0; border-bottom: 1px solid var(--line); }
  .section { padding: 58px 0; }
  .section-row, .shop-controls { align-items: start; flex-direction: column; }
  .lifestyle-banner, .custom-banner { min-height: 410px; margin-bottom: 62px; }
  .lifestyle-banner > div, .custom-banner > div, .process-row > div, .soft-cta { padding: 28px; }
  .page-hero { padding: 58px 0 32px; }
  .product-page { padding-top: 28px; }
  .buy-panel { padding: 24px; }
  .feature-row { grid-template-columns: 1fr 1fr; }
  .process-row { min-height: 0; }
  .process-row img { aspect-ratio: 4 / 3; }
}

@media (max-width: 430px) {
  .announcement { padding: 8px 12px; text-align: center; }
  .nav-icons { display: none; }
  h1 { font-size: 42px; }
  .actions, .product-actions { display: grid; }
  .featured-grid, .shop-grid { grid-template-columns: 1fr; }
  .feature-row { grid-template-columns: 1fr; }
  .thumb-row { gap: 8px; }
}

/* ------------------------------------------------------------
   Final brand polish — approved warm ivory / black direction
   ------------------------------------------------------------ */
:root {
  --ivory: #f6f1e8;
  --ivory-2: #fbf8f2;
  --paper: #fffdf9;
  --ink: #151513;
  --muted: #716a60;
  --line: #ddd5c8;
  --line-strong: #c9c0b2;
  --dark: #0b0b0a;
  --max: 1200px;
  --radius-sm: 9px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --shadow-soft: 0 18px 50px rgba(30, 25, 18, .07);
  --shadow-card: 0 12px 32px rgba(30, 25, 18, .06);
}

html { background: var(--ivory); }
body {
  background:
    radial-gradient(circle at 50% -18%, rgba(255,255,255,.8), transparent 35%),
    var(--ivory);
  font-family: Inter, "Segoe UI", Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body, button, input, select, textarea { font-feature-settings: "kern" 1, "liga" 1; }
h1, h2, h3 { color: var(--ink); letter-spacing: -.035em; }
h1 { letter-spacing: -.052em; }
p { color: var(--muted); }
::selection { background: #1b1b18; color: #fff; }
:focus-visible {
  outline: 2px solid #1b1b18;
  outline-offset: 3px;
}

.announcement {
  min-height: 27px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .105em;
  color: #e9e2d8;
}
.site-header { box-shadow: 0 1px 0 rgba(20,18,15,.025); }
.nav { min-height: 68px; }
.wordmark {
  font-size: 20px;
  letter-spacing: .17em;
  transition: opacity .2s ease;
}
.wordmark:hover { opacity: .62; }
.nav-links { gap: 23px; font-size: 13px; }
.nav-links > a:not(.nav-cta) {
  position: relative;
  padding: 25px 0 23px;
  color: #4f4941;
  transition: color .2s ease;
}
.nav-links > a:not(.nav-cta):after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 17px;
  height: 1px;
  background: var(--ink);
  transition: right .22s ease;
}
.nav-links > a:not(.nav-cta):hover,
.nav-links > a:not(.nav-cta).active { color: var(--ink); }
.nav-links > a:not(.nav-cta):hover:after,
.nav-links > a:not(.nav-cta).active:after { right: 0; }
.nav-cta {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 0 14px !important;
  border-radius: 999px;
  background: var(--ink);
  color: #fff !important;
  transition: transform .2s ease, background .2s ease;
}
.nav-cta:hover { transform: translateY(-1px); background: #33312d; }
.nav-cta.active { box-shadow: 0 0 0 2px var(--ivory), 0 0 0 3px var(--ink); }
.nav-icons { margin-left: -10px; }
.icon-btn {
  width: 36px;
  min-width: 36px;
  height: 36px;
  border-color: transparent;
  background: transparent;
  font-size: 17px;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.icon-btn:hover {
  transform: translateY(-1px);
  border-color: var(--line);
  background: var(--paper);
}

.section { padding: 96px 0; }
.eyebrow {
  margin-bottom: 13px;
  color: #80766a;
  font-size: 10px;
  letter-spacing: .15em;
}
.section-row { margin-bottom: 32px; }
.section-row h2 { margin-bottom: 0; }
.text-link {
  border: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-bottom: 4px;
  font-size: 12px;
}
.text-link:after {
  content: "→";
  transition: transform .2s ease;
}
.text-link:hover:after { transform: translateX(4px); }
.btn {
  min-height: 44px;
  padding: 0 20px;
  font-size: 12px;
  letter-spacing: .01em;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,.12); }
.btn.outline:hover { background: var(--ink); color: #fff; }

/* Home */
.home-hero { padding-top: 34px; }
.hero-frame {
  min-height: 610px;
  margin-top: 0;
  border: 0;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
.hero-copy-panel { padding: 62px; }
.hero-copy-panel h1 {
  margin-bottom: 22px;
  font-size: clamp(50px, 5.8vw, 78px);
  line-height: .93;
}
.hero-copy-panel > p:not(.eyebrow) {
  max-width: 390px;
  font-size: 15px;
  line-height: 1.7;
}
.hero-photo { min-height: 610px; }
.hero-photo img { object-position: 53% center; }
.value-cells { padding-top: 16px; }
.value-grid {
  overflow: hidden;
  border-color: var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 8px 26px rgba(30,25,18,.035);
}
.value-grid article {
  min-height: 138px;
  padding: 25px 24px 22px;
  transition: background .2s ease;
}
.value-grid article:hover { background: #fff; }
.value-grid article > i {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: #fff;
  font-size: 17px;
}
.value-grid h3 { margin-bottom: 5px; font-size: 14px; letter-spacing: -.01em; }
.value-grid p { font-size: 11px; line-height: 1.55; }

.featured-grid, .shop-grid { align-items: stretch; }
.product-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(205,197,185,.9);
  border-radius: var(--radius-md);
  background: var(--paper);
  box-shadow: 0 1px 0 rgba(20,18,15,.02);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.product-card:hover {
  transform: translateY(-5px);
  border-color: #c8bfb1;
  box-shadow: var(--shadow-card);
}
.product-image {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: #ece4d9;
}
.product-image img { transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.product-card:hover .product-image img { transform: scale(1.035); }
.image-fallback { filter: saturate(.72) contrast(.95); }
.product-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.48);
  border-radius: 999px;
  background: rgba(14,14,13,.78);
  color: #fff;
  backdrop-filter: blur(8px);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.product-info { min-height: 142px; padding: 17px 17px 15px; }
.product-category {
  margin: 0 0 6px !important;
  color: #8a8175 !important;
  font-size: 9px !important;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.product-info h3 { font-size: 16px; letter-spacing: -.015em; }
.product-info > div > p:not(.product-category) { font-size: 11px; line-height: 1.45; }
.product-meta {
  padding-top: 13px;
  border-top: 1px solid #ece6dd;
  font-size: 10px;
}
.product-meta a {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 14px;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.product-meta a:hover { transform: rotate(-35deg); background: var(--ink); color: #fff; }

.lifestyle-banner {
  min-height: 450px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
.lifestyle-banner:before { background: linear-gradient(90deg, rgba(6,6,6,.88), rgba(6,6,6,.52) 45%, rgba(6,6,6,.08)); }
.lifestyle-banner > div { max-width: 560px; padding: 64px; }
.lifestyle-banner h2 { max-width: 460px; font-size: clamp(42px,4.5vw,60px); letter-spacing: -.05em; }

.editorial-split {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 72px;
  align-items: start;
  margin-bottom: 96px;
  padding: 58px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.editorial-split h2 {
  max-width: 540px;
  margin: 0;
  font-size: clamp(34px,4vw,54px);
  line-height: .98;
}
.editorial-split > p {
  max-width: 580px;
  margin: 24px 0 0;
  font-size: 15px;
  line-height: 1.8;
}

/* Shop */
.page-hero { padding: 96px 0 48px; }
.page-hero h1 { letter-spacing: -.05em; }
.page-hero p:last-child { font-size: 15px; }
.shop-controls {
  margin-bottom: 14px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.filter-btn, .sort-control select {
  min-height: 38px;
  padding: 0 14px;
  font-size: 11px;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.filter-btn:hover { border-color: var(--ink); }
.shop-meta {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
  color: #8d8478;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.shop-grid { gap: 26px 18px; }
.custom-banner {
  overflow: hidden;
  min-height: 390px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
.custom-banner > div { padding: 60px; }
.custom-banner h2 { font-size: clamp(40px,4vw,56px); letter-spacing: -.05em; }

/* Product detail */
.product-page { padding-top: 50px; }
.breadcrumb { margin-bottom: 30px; font-size: 11px; }
.product-layout { gap: 54px; }
.product-main-photo {
  overflow: hidden;
  border-radius: var(--radius-lg);
  border-color: var(--line);
  box-shadow: var(--shadow-card);
}
.thumb-row { gap: 10px; }
.thumb {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  opacity: .66;
  transition: opacity .2s ease, border-color .2s ease, transform .2s ease;
}
.thumb:hover { opacity: 1; transform: translateY(-2px); }
.thumb.active { opacity: 1; border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.buy-panel {
  position: sticky;
  top: 112px;
  border-radius: var(--radius-lg);
  padding: 38px;
  box-shadow: var(--shadow-card);
}
.buy-panel h1 { letter-spacing: -.05em; }
.status-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 20px;
}
.status-line span {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8f4ed;
  color: #625b52;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.status-line span:first-child { border-color: var(--ink); background: var(--ink); color: #fff; }
.product-description { margin-bottom: 14px; font-size: 14px; line-height: 1.7; }
.launch-note {
  margin: 0 0 22px;
  padding: 13px 14px;
  border-left: 2px solid var(--ink);
  background: #f4efe6;
  color: #6a6258;
  font-size: 11px;
  line-height: 1.55;
}
.option-block { padding: 19px 0; }
.chip, .swatch, .quantity button { cursor: pointer; }
.product-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.feature-row { gap: 10px; margin: 52px 0; }
.feature-row article {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 76px;
  border-radius: var(--radius-sm);
  font-size: 11px;
}
.feature-row i {
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  font-size: 16px;
}
.accordion-list { gap: 8px; }
.accordion {
  border-radius: var(--radius-sm);
  transition: border-color .2s ease, background .2s ease;
}
.accordion:hover { border-color: var(--line-strong); }
.accordion[open] { background: #fff; }
.accordion summary { position: relative; padding-right: 28px; font-size: 12px; }
.accordion summary:after { position: absolute; right: 0; }
.accordion p { max-width: 760px; font-size: 12px; line-height: 1.7; }
.related-products {
  margin-top: 96px;
  padding-top: 72px;
  border-top: 1px solid var(--line);
}
.related-products .section-row h2 { font-size: clamp(30px,3.6vw,46px); }

/* Story */
.story-hero { padding-top: 46px; }
.story-split {
  overflow: hidden;
  min-height: 590px;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.story-split > div { padding: 64px 58px; }
.story-split h1 { font-size: clamp(54px,6vw,78px); }
.story-split > img { min-height: 590px; }
.story-copy { gap: 82px; }
.story-copy > div { padding-top: 8px; }
.fact-strip {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  margin-bottom: 72px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--paper);
}
.fact-strip article { padding: 22px; border-right: 1px solid var(--line); }
.fact-strip article:last-child { border-right: 0; }
.fact-strip span {
  display: block;
  margin-bottom: 8px;
  color: #91877a;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.fact-strip strong { font-size: 12px; line-height: 1.45; }
.story-card-grid { gap: 18px; padding-bottom: 72px; }
.story-card-grid article {
  overflow: hidden;
  border-radius: var(--radius-md);
  transition: transform .25s ease, box-shadow .25s ease;
}
.story-card-grid article:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.story-card-grid img { aspect-ratio: 1.28 / 1; transition: transform .45s ease; }
.story-card-grid article:hover img { transform: scale(1.025); }
.vision-block {
  margin-bottom: 96px;
  padding: 56px;
  border-radius: var(--radius-lg);
  background: var(--dark);
  color: #fff;
}
.vision-block .eyebrow { color: #b9b0a4; }
.vision-block h2 { max-width: 760px; margin-bottom: 18px; color: #fff; font-size: clamp(36px,4vw,54px); }
.vision-block > p:last-child { max-width: 680px; margin-bottom: 0; color: #c9c1b6; }

/* Process */
.process-list { gap: 28px; }
.process-row {
  min-height: 360px;
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}
.process-row:nth-child(even) { grid-template-columns: 58% 42%; }
.process-row:nth-child(even) > img { order: 2; }
.process-row:nth-child(even) > div { order: 1; }
.process-row > img { min-height: 360px; }
.process-row > div { padding: 50px 56px; }
.process-number {
  margin: 0 !important;
  color: #d6cdc0 !important;
  font-size: 54px;
  line-height: .8;
  letter-spacing: -.06em;
}
.process-kicker {
  margin: 18px 0 10px;
  color: #948a7c;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.process-row h2 { margin-bottom: 14px; font-size: clamp(32px,3.5vw,46px); letter-spacing: -.04em; }
.process-row > div > p:last-child { max-width: 520px; margin-bottom: 0; font-size: 13px; }
.process-cta {
  display: grid;
  grid-template-columns: 1.25fr .9fr auto;
  gap: 42px;
  align-items: end;
  margin-bottom: 96px;
  padding: 48px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.process-cta h2 { max-width: 640px; margin: 0; font-size: clamp(34px,4vw,50px); }
.process-cta > p { margin: 0; font-size: 13px; }

/* Use cases */
.use-case-grid { gap: 18px; }
.use-case-grid article {
  min-height: 430px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}
.use-case-grid img { transition: transform .55s cubic-bezier(.2,.7,.2,1), filter .4s ease; }
.use-case-grid article:hover img { transform: scale(1.035); filter: saturate(1.08); }
.use-case-grid article:after { background: linear-gradient(0deg, rgba(0,0,0,.82), rgba(0,0,0,.42) 32%, rgba(0,0,0,.04) 72%); }
.use-case-grid div { left: 32px; right: 32px; bottom: 30px; }
.use-case-grid h2 { margin-bottom: 8px; font-size: clamp(30px,3vw,40px); letter-spacing: -.04em; }
.use-case-grid p { max-width: 420px; margin-bottom: 0; color: #d8d1c7; font-size: 12px; }
.soft-cta {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 18px 32px;
  padding: 52px;
  border-radius: var(--radius-lg);
  background: #eee7dc;
}
.soft-cta h2 { grid-column: 1; margin-bottom: 4px; }
.soft-cta p { grid-column: 1; margin: 0; }
.soft-cta .btn { grid-column: 2; grid-row: 1 / span 2; align-self: center; }

/* FAQ */
.faq-hero { padding-bottom: 38px; }
.faq-groups {
  grid-template-columns: minmax(250px,.75fr) 1fr 1fr;
  gap: 16px;
  padding-bottom: 62px;
}
.faq-support {
  grid-row: 1 / span 2;
  min-height: 310px;
  padding: 30px;
  border-radius: var(--radius-md);
  background: var(--dark);
  color: #fff;
}
.faq-support > i {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  margin-bottom: 46px;
  border: 1px solid #514d47;
  border-radius: 50%;
  font-size: 21px;
}
.faq-support h2 { margin-bottom: 10px; color: #fff; font-size: 28px; }
.faq-support p { color: #bfb8ae; font-size: 12px; line-height: 1.65; }
.faq-support .btn { margin-top: 10px; border-color: #5b5650; color: #fff; }
.faq-support .btn:hover { background: #fff; color: var(--ink); }
.faq-groups > article {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(255,253,249,.6);
}
.faq-groups > article:last-child { grid-column: 2 / -1; }
.faq-groups h2 { font-size: 20px; letter-spacing: -.02em; }
.faq-groups .accordion { border-left: 0; border-right: 0; border-radius: 0; background: transparent; }
.faq-groups .accordion:first-of-type { border-top-color: var(--line); }

/* Contact */
.contact-dark { padding: 64px 0 74px; }
.contact-card {
  gap: 0;
  overflow: hidden;
  border: 1px solid #292824;
  border-radius: var(--radius-lg);
  background: #11110f;
  box-shadow: 0 22px 70px rgba(0,0,0,.22);
}
.contact-left { padding: 68px 58px; }
.contact-left h1 { max-width: 570px; font-size: clamp(48px,5.5vw,70px); }
.contact-left > p { max-width: 520px; color: #c0b8ae; }
.contact-facts { margin-top: 42px; padding-top: 18px; border-top: 1px solid #302f2b; }
.contact-facts p { padding: 9px 0; font-size: 12px; color: #d7d0c6; }
.contact-facts span { border-color: #4a4842; background: #191917; font-size: 15px; }
.contact-form {
  padding: 42px;
  border: 0;
  background: #fffdf9;
}
.contact-form label { gap: 8px; margin-bottom: 2px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.contact-form input, .contact-form textarea {
  border-radius: var(--radius-sm);
  padding: 13px 14px;
  outline: 0;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.contact-form input:focus, .contact-form textarea:focus {
  border-color: var(--ink);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(21,21,19,.07);
}
.form-microcopy {
  margin: -2px 0 2px;
  color: #91887c;
  font-size: 10px;
  line-height: 1.55;
}
.follow-block {
  min-height: 390px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
.follow-block > div { left: 48px; bottom: 44px; }
.follow-block h2 { max-width: 500px; font-size: clamp(34px,4vw,50px); }
.follow-block .btn { margin-top: 8px; }

/* Footer */
.footer { padding-top: 62px; }
.footer-grid { gap: 46px; }
.footer-wordmark { font-size: 34px; letter-spacing: .17em; }
.footer-brand > p { max-width: 340px; font-size: 12px; line-height: 1.65; }
.footer h2 { font-size: 10px; letter-spacing: .13em; }
.footer-links { gap: 9px; font-size: 12px; }
.footer-links a { color: #c7c0b6; transition: color .2s ease, transform .2s ease; }
.footer-links a:hover { color: #fff; transform: translateX(2px); }
.footer-status {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  color: #8f8980;
  font-size: 10px;
}
.footer-status span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #a6e36e;
  box-shadow: 0 0 0 4px rgba(166,227,110,.08);
}
.newsletter {
  overflow: hidden;
  border: 1px solid #33322f;
  border-radius: 999px;
}
.newsletter input {
  min-width: 0;
  border: 0;
  background: #11110f;
  color: #a9a198;
  font-size: 11px;
}
.newsletter button {
  min-width: 58px;
  color: #706960;
  background: #d8d1c7;
  font-size: 10px;
}
.newsletter input:disabled, .newsletter button:disabled { opacity: 1; cursor: default; }
.footer-note { margin: -5px 0 16px; font-size: 10px !important; line-height: 1.5; }
.policy-links { padding-top: 14px; border-top: 1px solid #252421; }
.copyright { font-size: 10px; }

@media (max-width: 1024px) {
  .hero-frame { grid-template-columns: 44% 56%; }
  .hero-copy-panel { padding: 44px; }
  .featured-grid { grid-template-columns: repeat(2,1fr); }
  .product-layout { grid-template-columns: minmax(0,1fr) minmax(330px,.84fr); gap: 34px; }
  .buy-panel { top: 104px; padding: 28px; }
  .fact-strip { grid-template-columns: repeat(2,1fr); }
  .fact-strip article:nth-child(2) { border-right: 0; }
  .fact-strip article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .process-cta { grid-template-columns: 1fr 1fr; }
  .process-cta .btn { grid-column: 2; justify-self: start; }
  .faq-groups { grid-template-columns: minmax(230px,.8fr) 1fr; }
  .faq-support { grid-row: 1 / span 3; }
  .faq-groups > article:last-child { grid-column: 2; }
}

@media (max-width: 768px) {
  body { background: var(--ivory); }
  .container { width: min(calc(100% - 28px), var(--max)); }
  .site-header { backdrop-filter: blur(18px); }
  .nav { min-height: 62px; }
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; margin-left: auto; }
  .nav-links {
    position: absolute;
    left: 0;
    right: 0;
    top: 62px;
    padding: 10px 18px 18px;
    border-bottom: 1px solid var(--line);
    background: rgba(255,253,249,.98);
    box-shadow: 0 16px 30px rgba(20,18,15,.08);
  }
  .nav-links > a:not(.nav-cta) { padding: 13px 4px; }
  .nav-links > a:not(.nav-cta):after { display: none; }
  .nav-cta { width: fit-content; margin-top: 8px; }
  .nav-icons { display: none; }
  .section { padding: 68px 0; }
  .home-hero { padding-top: 18px; }
  .hero-frame { grid-template-columns: 1fr; border-radius: var(--radius-md); }
  .hero-copy-panel { min-height: 390px; padding: 38px 28px; }
  .hero-copy-panel h1 { font-size: clamp(46px,13vw,64px); }
  .hero-photo { min-height: 340px; }
  .value-grid { grid-template-columns: repeat(2,1fr); }
  .value-grid article { border-bottom: 1px solid var(--line); }
  .value-grid article:nth-child(2n) { border-right: 0; }
  .product-info { min-height: 132px; }
  .lifestyle-banner { min-height: 430px; border-radius: var(--radius-md); }
  .lifestyle-banner > div { padding: 36px 28px; }
  .editorial-split { grid-template-columns: 1fr; gap: 14px; margin-bottom: 68px; padding: 44px 0; }
  .editorial-split > p { margin-top: 0; }
  .page-hero { padding: 68px 0 36px; }
  .shop-meta { margin-top: 10px; }
  .custom-banner { grid-template-columns: 1fr; min-height: 0; border-radius: var(--radius-md); }
  .custom-banner > div { padding: 38px 28px; }
  .custom-banner img { min-height: 300px; }
  .product-layout { grid-template-columns: 1fr; }
  .buy-panel { position: static; border-radius: var(--radius-md); }
  .feature-row { grid-template-columns: repeat(2,1fr); }
  .product-actions { grid-template-columns: 1fr; }
  .related-products { margin-top: 72px; padding-top: 52px; }
  .story-split { border-radius: var(--radius-md) var(--radius-md) 0 0; }
  .story-split > div { padding: 44px 30px; }
  .story-split > img { min-height: 360px; }
  .story-copy { gap: 24px; }
  .fact-strip { grid-template-columns: 1fr; }
  .fact-strip article { border-right: 0; border-bottom: 1px solid var(--line); }
  .fact-strip article:last-child { border-bottom: 0; }
  .vision-block { margin-bottom: 68px; padding: 38px 28px; border-radius: var(--radius-md); }
  .process-list { gap: 18px; }
  .process-row, .process-row:nth-child(even) { grid-template-columns: 1fr; border-radius: var(--radius-md); }
  .process-row:nth-child(even) > img { order: 1; }
  .process-row:nth-child(even) > div { order: 2; }
  .process-row > img { min-height: 260px; aspect-ratio: 4/3; }
  .process-row > div { padding: 34px 28px; }
  .process-number { font-size: 44px; }
  .process-cta { grid-template-columns: 1fr; gap: 18px; margin-bottom: 68px; padding: 40px 0; }
  .process-cta .btn { grid-column: 1; }
  .use-case-grid { grid-template-columns: 1fr; gap: 14px; }
  .use-case-grid article { min-height: 360px; border-radius: var(--radius-md); }
  .soft-cta { grid-template-columns: 1fr; padding: 36px 28px; border-radius: var(--radius-md); }
  .soft-cta .btn { grid-column: 1; grid-row: auto; justify-self: start; }
  .faq-groups { grid-template-columns: 1fr; }
  .faq-support { grid-row: auto; min-height: 260px; }
  .faq-groups > article:last-child { grid-column: 1; }
  .contact-card { grid-template-columns: 1fr; border-radius: var(--radius-md); }
  .contact-left, .contact-form { padding: 38px 28px; }
  .follow-block { min-height: 360px; margin: 52px auto 68px; border-radius: var(--radius-md); }
  .follow-block > div { left: 28px; right: 28px; bottom: 30px; }
  .footer { padding-top: 48px; }
  .footer-grid { grid-template-columns: repeat(2,1fr); gap: 34px 28px; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 430px) {
  .announcement { min-height: 31px; font-size: 8px; line-height: 1.35; }
  .wordmark { font-size: 17px; }
  .hero-copy-panel { min-height: 350px; }
  .hero-photo { min-height: 300px; }
  .value-grid { grid-template-columns: 1fr; }
  .value-grid article { border-right: 0; }
  .featured-grid, .shop-grid { grid-template-columns: 1fr; }
  .product-image { aspect-ratio: 1.08 / 1; }
  .product-main-photo { border-radius: var(--radius-md); }
  .buy-panel { padding: 24px 20px; }
  .feature-row { grid-template-columns: 1fr; }
  .thumb-row { grid-template-columns: repeat(4,1fr); }
  .story-split h1 { font-size: 48px; }
  .use-case-grid article { min-height: 320px; }
  .contact-left h1 { font-size: 44px; }
  .contact-form { padding: 28px 20px; }
  .footer-grid { grid-template-columns: 1fr; }
}

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