/* ============================================================
   TRAPWRLD — MAIN STYLESHEET
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --white:      #ffffff;
  --black:      #0a0a0a;
  --black-soft: #111111;
  --gold:       #c9a96e;
  --gold-dark:  #a8854a;
  --stone:      #b5a898;
  --stone-light: rgba(181,168,152,.1);
  --stone-mid:  rgba(181,168,152,.3);
  --muted:      #777777;
  --light-gray: #f2f2f2;
  --border:     rgba(0,0,0,0.1);
  --serif:      'Cormorant Garamond', Georgia, serif;
  --sans:       'Inter', system-ui, sans-serif;
}

html { scroll-behavior: smooth; }

body {
  background: var(--white);
  color: var(--black);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
ul { list-style: none; }
button { cursor: pointer; font-family: var(--sans); }

/* ── FLASH ──────────────────────────────────────────────── */
.flash-stack {
  position: fixed; top: 130px; right: 1.5rem; z-index: 500;
  display: flex; flex-direction: column; gap: 0.5rem;
}
.flash {
  display: flex; align-items: center; gap: 1rem;
  padding: 12px 18px; font-size: 13px; min-width: 280px;
  border-left: 3px solid;
  background: var(--white);
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}
.flash--success { border-color: #27ae60; color: #27ae60; }
.flash--error   { border-color: #e74c3c; color: #e74c3c; }
.flash--info    { border-color: var(--stone); color: var(--black); }
.flash-close    { margin-left: auto; background: none; border: none; font-size: 18px; color: var(--muted); }

/* ── TOP BAR ────────────────────────────────────────────── */
.topbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 2.5rem; height: 46px;
  background: var(--white);
  border-bottom: 1px solid var(--border);
}
.topbar-contact { font-size: 11px; color: var(--muted); letter-spacing: 0.07em; text-transform: uppercase; }
.topbar-contact a { color: var(--black); transition: color .2s; }
.topbar-contact a:hover { color: var(--stone); }
.topbar-socials { display: flex; gap: 1rem; align-items: center; }
.topbar-socials a { color: var(--muted); font-size: 11px; letter-spacing: 0.08em; transition: color .2s; display:flex; align-items:center; }
.topbar-socials a:hover { color: var(--black); }
.topbar-socials svg { width:14px; height:14px; fill:currentColor; }

/* ── NAV ────────────────────────────────────────────────── */
nav {
  position: fixed; top: 46px; left: 0; right: 0; z-index: 99;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 2.5rem; height: 70px;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  transition: box-shadow .3s;
}
nav.scrolled { box-shadow: 0 2px 20px rgba(0,0,0,0.07); }

.nav-logo { display: flex; align-items: center; gap: .75rem; }
.nav-logo-img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; border: 1px solid var(--border); }
.nav-logo-text { font-family: 'Bebas Neue', 'Oswald', sans-serif; font-size: 26px; font-weight: 400; letter-spacing: .12em; color: var(--black); text-transform: uppercase; }

.nav-links { display: flex; gap: 2.5rem; }
.nav-links a { color: rgba(10,10,10,.5); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 500; transition: color .2s; }
.nav-links a:hover, .nav-links a.active { color: var(--black); }

.nav-actions { display: flex; align-items: center; gap: 1.25rem; }
.nav-actions a { color: rgba(10,10,10,.5); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 500; transition: color .2s; }
.nav-actions a:hover { color: var(--black); }

.cart-btn {
  display: flex; align-items: center; gap: .4rem;
  background: none; border: none; padding: 0;
  font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  font-weight: 500; color: rgba(10,10,10,.5); transition: color .2s;
}
.cart-btn:hover { color: var(--black); }
.cart-badge {
  width: 18px; height: 18px; background: var(--black); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; color: var(--white); font-weight: 600;
}

.nav-hamburger {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; padding: 4px;
}
.nav-hamburger span { display: block; width: 22px; height: 1.5px; background: var(--black); transition: .2s; }

/* ── MOBILE NAV ─────────────────────────────────────────── */
/* Mobile nav — full screen slide-in (styles in header.php) */
.mobile-nav { display: flex; } /* always rendered, controlled by transform */

/* ── CART DRAWER ────────────────────────────────────────── */
.cart-backdrop {
  position: fixed; inset: 0; background: rgba(10,10,10,.4);
  z-index: 200; opacity: 0; pointer-events: none; transition: opacity .3s;
}
.cart-backdrop.open { opacity: 1; pointer-events: all; }

.cart-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 400px;
  background: var(--white); z-index: 201;
  transform: translateX(100%); transition: transform .35s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column; border-left: 1px solid var(--border);
}
.cart-drawer.open { transform: translateX(0); }

.cart-header {
  padding: 1.4rem 1.75rem; border-bottom: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center;
  flex-shrink: 0;
}
.cart-title-text { font-family: var(--serif); font-size: 20px; font-weight: 400; letter-spacing: .06em; }
.cart-close { background: none; border: none; font-size: 26px; color: var(--muted); transition: color .2s; line-height: 1; padding: 0; }
.cart-close:hover { color: var(--black); }

.cart-body { flex: 1; overflow-y: auto; padding: 1.5rem 1.75rem; display: flex; flex-direction: column; gap: 1rem; }
.cart-loading { color: var(--muted); font-size: 13px; text-align: center; padding: 3rem 0; }

.cart-empty-msg { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 3rem 0; text-align: center; }
.cart-empty-msg p { font-size: 13px; color: var(--muted); }
.cart-empty-msg a { font-size: 10px; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; border-bottom: 1px solid rgba(0,0,0,.25); padding-bottom: 2px; color: var(--black); }

.cart-item { display: flex; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border); }
.cart-item-img { width: 68px; height: 85px; object-fit: cover; flex-shrink: 0; background: var(--light-gray); }
.cart-item-info { flex: 1; min-width: 0; }
.cart-item-name { font-family: var(--serif); font-size: 16px; font-weight: 400; margin-bottom: 2px; }
.cart-item-variant { font-size: 11px; color: var(--muted); margin-bottom: 6px; }
.cart-item-row { display: flex; justify-content: space-between; align-items: center; }
.cart-item-price { font-size: 13px; font-weight: 500; }
.cart-qty { display: flex; align-items: stretch; border: 1px solid var(--border); }
.cart-qty button {
  width: 30px; height: 30px; border: none; background: var(--white);
  font-size: 15px; font-weight: 600; color: var(--black);
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s; flex-shrink: 0;
}
.cart-qty button:hover { background: var(--black); color: var(--white); }
.cart-qty button:disabled { opacity: .3; cursor: not-allowed; background: var(--white); color: var(--black); }
.cart-qty span {
  font-size: 13px; font-weight: 600; min-width: 32px; text-align: center;
  display: flex; align-items: center; justify-content: center;
  border-left: 1px solid var(--border); border-right: 1px solid var(--border);
}
.cart-item-remove { background: none; border: none; font-size: 18px; color: var(--muted); padding: 0; transition: color .2s; }
.cart-item-remove:hover { color: var(--black); }

.cart-footer { padding: 1.25rem 1.75rem; border-top: 1px solid var(--border); flex-shrink: 0; }
.cart-discount-row { display: flex; gap: .5rem; margin-bottom: 1rem; }
.cart-discount-row input { flex: 1; padding: 9px 12px; border: 1px solid var(--border); font-size: 12px; letter-spacing: .05em; font-family: var(--sans); text-transform: uppercase; outline: none; }
.cart-discount-row input:focus { border-color: var(--black); }
@media (max-width: 768px) {
  .cart-discount-row input { font-size: 16px; }
}
.cart-discount-row button { padding: 9px 16px; background: var(--black); color: var(--white); border: none; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 500; transition: background .2s; }
.cart-discount-row button:hover { background: #333; }
.cart-totals { display: flex; flex-direction: column; gap: 6px; margin-bottom: 1.25rem; }
.cart-totals-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); }
.cart-totals-row.total { font-size: 15px; font-weight: 600; color: var(--black); margin-top: 4px; padding-top: 10px; border-top: 1px solid var(--border); }
.cart-totals-row.discount { color: #27ae60; }
.cart-checkout-btn {
  display: block; width: 100%; padding: 15px; text-align: center;
  background: var(--black); color: var(--white);
  font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600;
  border: none; transition: background .2s;
}
.cart-checkout-btn:hover { background: #222; }

/* ── BUTTONS ─────────────────────────────────────────────── */
.btn-primary {
  display: inline-block; padding: 14px 42px;
  background: var(--black); color: var(--white);
  font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  border: none; transition: background .2s, transform .15s; cursor: pointer;
}
.btn-primary:hover { background: #222; transform: translateY(-1px); }

.btn-ghost {
  display: inline-block; padding: 12px 32px;
  border: 1px solid rgba(0,0,0,.25); color: var(--black);
  font-size: 10px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
  background: none; transition: background .2s, border-color .2s, color .2s; cursor: pointer;
}
.btn-ghost:hover { background: var(--black); border-color: var(--black); color: var(--white); }

.btn-gold {
  display: inline-block; padding: 14px 42px;
  background: var(--stone); color: var(--black);
  font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  border: none; transition: background .2s; cursor: pointer;
}
.btn-gold:hover { background: #9e8e80; }

/* ── FORMS ───────────────────────────────────────────────── */
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 1.25rem; }
.form-group label { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 500; color: var(--black); }
.form-group input,
.form-group select,
.form-group textarea {
  padding: 11px 14px; border: 1px solid var(--border);
  font-size: 14px; font-family: var(--sans); color: var(--black);
  background: var(--white); outline: none; transition: border-color .2s;
  border-radius: 0;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color: var(--black); }
.form-group textarea { resize: vertical; min-height: 100px; }
.form-error { font-size: 12px; color: #e74c3c; margin-top: 3px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-note { font-size: 12px; color: var(--muted); margin-top: -0.75rem; margin-bottom: 1.25rem; }

/* ── PAGE WRAPPER ────────────────────────────────────────── */
.page-top { padding-top: 116px; }

/* ── HERO ────────────────────────────────────────────────── */
.hero {
  position: relative; height: 100vh; min-height: 680px;
  display: flex; align-items: flex-end; overflow: hidden;
  margin-top: 116px;
}
.hero-bg {
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(to bottom, rgba(10,10,10,.2) 0%, rgba(10,10,10,0) 35%, rgba(10,10,10,.75) 100%),
              linear-gradient(to right, rgba(10,10,10,.55) 0%, rgba(10,10,10,0) 65%);
}
.hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; z-index: 1; filter: brightness(.82) contrast(1.06); }
.hero-content { position: relative; z-index: 3; padding: 0 2.5rem 5rem; max-width: 680px; }
.hero-eyebrow { font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--stone); margin-bottom: 1.2rem; font-weight: 500; }
.hero-title { font-family: var(--serif); font-size: clamp(72px,11vw,130px); font-weight: 300; line-height: .88; color: #fff; margin-bottom: 2rem; }
.hero-sub { font-size: 13px; line-height: 2; color: rgba(255,255,255,.62); max-width: 360px; margin-bottom: 2.5rem; letter-spacing: .02em; }
.hero-scroll { position: absolute; bottom: 2.5rem; right: 2.5rem; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: .5rem; color: rgba(255,255,255,.3); font-size: 9px; letter-spacing: .22em; text-transform: uppercase; }
.hero-scroll-line { width: 1px; height: 56px; background: linear-gradient(to bottom, rgba(181,168,152,.7), transparent); animation: scrollPulse 2.2s ease-in-out infinite; }
@keyframes scrollPulse { 0%,100%{opacity:.4;transform:scaleY(1)} 50%{opacity:1;transform:scaleY(.65)} }

/* ── MARQUEE ─────────────────────────────────────────────── */
.marquee-section { padding: 2rem 0; overflow: hidden; background: var(--white); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.marquee-track { display: flex; white-space: nowrap; animation: marquee 22s linear infinite; width: max-content; }
.marquee-track:hover { animation-play-state: paused; }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.marquee-item { font-family: var(--serif); font-size: 13px; letter-spacing: .28em; text-transform: uppercase; color: rgba(10,10,10,.25); display: inline-flex; align-items: center; padding: 0 3rem; gap: 3rem; }
.marquee-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--black); opacity: .2; flex-shrink: 0; }

/* ── SECTION SHARED ──────────────────────────────────────── */
.section-eyebrow { font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--stone); margin-bottom: 1.5rem; font-weight: 500; }
.section-title { font-family: var(--serif); font-size: clamp(48px,7vw,88px); font-weight: 300; line-height: .95; letter-spacing: .04em; text-transform: uppercase; color: var(--black); }
.section-title--white { color: var(--white); }
.inner { max-width: 1320px; margin: 0 auto; }

/* ── HERITAGE ────────────────────────────────────────────── */
.heritage-section { padding: 9rem 2.5rem; background: var(--white); }
.heritage-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: start; }
.heritage-title { margin-bottom: 3rem; }
.heritage-body { font-size: 14px; line-height: 2; color: rgba(10,10,10,.5); max-width: 420px; }
.heritage-body p { margin-bottom: 1.4rem; }
.heritage-body .quote-line { font-family: var(--serif); font-size: 20px; font-style: italic; color: var(--black); font-weight: 300; line-height: 1.6; display: block; margin-top: 2.2rem; padding-top: 2.2rem; border-top: 1px solid rgba(0,0,0,.1); }
.heritage-images { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.heritage-img-wrap:first-child { margin-top: 5rem; }
.heritage-img-wrap:last-child  { margin-top: -3rem; }
.heritage-img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center top; transition: filter .4s; }
.heritage-img:hover { filter: brightness(.9); }

/* ── PHILOSOPHY ──────────────────────────────────────────── */
.philosophy { background: var(--white); text-align: center; padding: 10rem 2.5rem; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.philosophy-quote { font-family: var(--serif); font-size: clamp(28px,4vw,50px); font-weight: 300; font-style: italic; line-height: 1.4; color: var(--black); margin-bottom: 2rem; }
.philosophy-quote em { color: var(--stone); font-style: normal; }
.philosophy-attr { font-size: 10px; letter-spacing: .25em; text-transform: uppercase; color: var(--muted); }

/* ── VIDEO / ESSENCE ─────────────────────────────────────── */
.essence-section { padding: 9rem 2.5rem; background: var(--white); }
.essence-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3rem; }
.essence-sub { max-width: 360px; font-size: 13px; line-height: 1.9; color: rgba(10,10,10,.45); text-align: right; }
.video-wrap { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: #111; }
.video-wrap video { width: 100%; height: 100%; object-fit: cover; }
.video-overlay { position: absolute; inset: 0; background: linear-gradient(to bottom,rgba(10,10,10,.05),rgba(10,10,10,.35)); pointer-events: none; }
.video-controls { position: absolute; bottom: 1.5rem; right: 1.5rem; display: flex; gap: .6rem; }
.video-btn { width: 42px; height: 42px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 16px; transition: background .2s, border-color .2s; }
.video-btn:hover { background: rgba(201,169,110,.3); border-color: var(--stone); }

/* ── PRODUCT GRID ────────────────────────────────────────── */
.collection-section { padding: 2rem 2.5rem 9rem; background: var(--white); }
.collection-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3rem; padding-bottom: 2.5rem; border-bottom: 1px solid var(--border); }
.collection-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); }
.product-card { background: var(--white); overflow: hidden; }
.product-img-wrap { position: relative; aspect-ratio: 3/4; overflow: hidden; background: var(--light-gray); }
.product-img { width: 100%; height: 100%; object-fit: cover; object-position: center top; transition: transform .6s ease; }
.product-card:hover .product-img { transform: scale(1.04); }
.product-overlay { position: absolute; inset: 0; background: rgba(10,10,10,.45); opacity: 0; transition: opacity .3s; display: flex; align-items: center; justify-content: center; }
.product-card:hover .product-overlay { opacity: 1; }
.product-badge { position: absolute; top: 1rem; left: 1rem; padding: 4px 12px; background: var(--black); color: var(--white); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; font-weight: 500; }
.product-badge--sale { background: #e74c3c; }
.product-info { padding: 1.25rem 1.5rem; border-top: 1px solid var(--border); }
.product-name { font-family: var(--serif); font-size: 18px; font-weight: 400; color: var(--black); margin-bottom: .3rem; }
.product-price { font-size: 13px; color: var(--black); font-weight: 500; }
.product-price .compare { text-decoration: line-through; color: var(--muted); margin-left: .5rem; font-weight: 400; }

/* ── SHOP PAGE ───────────────────────────────────────────── */
.shop-layout { display: grid; grid-template-columns: 220px 1fr; gap: 3rem; padding: 3rem 2.5rem 6rem; padding-top: 2rem; }
.shop-filters h3 { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; margin-bottom: 1rem; padding-bottom: .75rem; border-bottom: 1px solid var(--border); }
.filter-group { margin-bottom: 2rem; }
.shop-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border); }
.shop-count { font-size: 12px; color: var(--muted); }
.shop-sort select { padding: 8px 12px; border: 1px solid var(--border); font-size: 12px; font-family: var(--sans); background: var(--white); }
.shop-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); }

/* ── PRODUCT DETAIL ──────────────────────────────────────── */
.product-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; padding: 3rem 2.5rem 6rem; }
.product-gallery { position: sticky; top: 140px; }
.product-gallery-main { aspect-ratio: 3/4; overflow: hidden; background: var(--light-gray); margin-bottom: 1rem; }
.product-gallery-main img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.product-gallery-main img:hover { transform: scale(1.03); }
.product-gallery-thumbs { display: grid; grid-template-columns: repeat(4,1fr); gap: .5rem; }
.product-gallery-thumbs img { aspect-ratio: 1; object-fit: cover; cursor: pointer; border: 2px solid transparent; transition: border-color .2s; opacity: .7; }
.product-gallery-thumbs img.active, .product-gallery-thumbs img:hover { border-color: var(--black); opacity: 1; }
.product-detail-info .product-name { font-family: var(--serif); font-size: clamp(32px,4vw,52px); font-weight: 300; line-height: 1.1; margin-bottom: 1rem; }
.product-detail-price { font-size: 22px; font-weight: 500; margin-bottom: 2rem; }
.product-detail-price .compare { font-size: 16px; text-decoration: line-through; color: var(--muted); margin-left: .75rem; font-weight: 400; }
.variant-label { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; margin-bottom: .75rem; }
.variant-options { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.variant-btn { padding: 8px 18px; border: 1px solid var(--border); font-size: 12px; background: var(--white); cursor: pointer; transition: .15s; font-family: var(--sans); }
.variant-btn:hover { border-color: var(--black); }
.variant-btn.selected { border-color: var(--black); background: var(--black); color: var(--white); }
.variant-btn:disabled { opacity: .35; cursor: not-allowed; }
.add-to-cart-form { display: flex; gap: .75rem; margin-bottom: 2rem; }
.qty-input { width: 60px; border: 1px solid var(--border); text-align: center; font-size: 15px; font-family: var(--sans); padding: 0 8px; }
.product-detail-desc { font-size: 14px; line-height: 2; color: rgba(10,10,10,.6); margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--border); }

/* ── CART PAGE ───────────────────────────────────────────── */
.cart-page { display: grid; grid-template-columns: 1fr 360px; gap: 3rem; padding: 3rem 2.5rem 6rem; }
.cart-page-item { display: grid; grid-template-columns: 90px 1fr auto; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--border); align-items: start; }
.cart-page-item img { width: 90px; height: 110px; object-fit: cover; background: var(--light-gray); }
.cart-page-summary { background: var(--light-gray); padding: 2rem; align-self: start; position: sticky; top: 140px; }
.summary-title { font-family: var(--serif); font-size: 22px; font-weight: 400; margin-bottom: 1.5rem; }
.summary-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); margin-bottom: .75rem; }
.summary-row.total { font-size: 16px; font-weight: 600; color: var(--black); padding-top: 1rem; border-top: 1px solid var(--border); margin-top: .5rem; }
.summary-row.discount { color: #27ae60; }

/* ── CHECKOUT ────────────────────────────────────────────── */
.checkout-layout { display: grid; grid-template-columns: 1fr 380px; gap: 4rem; padding: 3rem 2.5rem 6rem; max-width: 1320px; margin: 0 auto; }
.checkout-form-title { font-family: var(--serif); font-size: 26px; font-weight: 400; margin-bottom: 2rem; letter-spacing: .03em; }
.checkout-section { margin-bottom: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid var(--border); }
.checkout-section h3 { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; margin-bottom: 1.5rem; color: var(--black); }
.order-summary-sidebar { background: var(--light-gray); padding: 2rem; align-self: start; position: sticky; top: 140px; }

/* ── ACCOUNT ─────────────────────────────────────────────── */
.account-layout { display: grid; grid-template-columns: 220px 1fr; gap: 3rem; padding: 3rem 2.5rem 6rem; max-width: 1320px; margin: 0 auto; }
.account-nav { align-self: start; position: sticky; top: 140px; }
.account-nav h3 { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; margin-bottom: 1.25rem; color: var(--muted); }
.account-nav a { display: block; padding: .65rem 0; font-size: 13px; color: rgba(10,10,10,.55); border-bottom: 1px solid var(--border); transition: color .2s; }
.account-nav a:hover, .account-nav a.active { color: var(--black); }
.account-title { font-family: var(--serif); font-size: 36px; font-weight: 300; margin-bottom: 2rem; }
.orders-table { width: 100%; border-collapse: collapse; }
.orders-table th { font-size: 10px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; padding: .75rem 1rem; text-align: left; border-bottom: 2px solid var(--border); }
.orders-table td { padding: 1rem; border-bottom: 1px solid var(--border); font-size: 13px; }
.status-badge { display: inline-block; padding: 3px 10px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; }
.status-badge--paid, .status-badge--delivered { background: #eafaf1; color: #27ae60; }
.status-badge--pending   { background: #fef9e7; color: #f39c12; }
.status-badge--shipped   { background: #eaf4fb; color: #2980b9; }
.status-badge--processing{ background: #fef6e7; color: #d68910; }
.status-badge--cancelled, .status-badge--refunded { background: #fdedec; color: #e74c3c; }

/* ── AUTH PAGES ──────────────────────────────────────────── */
.auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 2rem; background: var(--light-gray); padding-top: 140px; }
.auth-box { background: var(--white); padding: 3rem; max-width: 440px; width: 100%; border: 1px solid var(--border); }
.auth-logo { font-family: var(--serif); font-size: 28px; font-weight: 300; letter-spacing: .14em; text-transform: lowercase; text-align: center; margin-bottom: 2rem; display: block; color: var(--black); }
.auth-title { font-family: var(--serif); font-size: 26px; font-weight: 400; margin-bottom: .5rem; }
.auth-sub { font-size: 13px; color: var(--muted); margin-bottom: 2rem; }
.auth-link { font-size: 12px; color: var(--muted); text-align: center; margin-top: 1.25rem; }
.auth-link a { color: var(--black); border-bottom: 1px solid var(--border); }

/* ── PAGE HEADER ─────────────────────────────────────────── */
.page-header { padding: 5rem 2.5rem 3rem; border-bottom: 1px solid var(--border); max-width: 1320px; margin: 0 auto; }
.page-header h1 { font-family: var(--serif); font-size: clamp(36px,5vw,64px); font-weight: 300; letter-spacing: .04em; text-transform: uppercase; }
.page-header p { font-size: 14px; color: var(--muted); margin-top: 1rem; max-width: 500px; line-height: 1.8; }

/* ── BREADCRUMB ──────────────────────────────────────────── */
.breadcrumb { display: flex; gap: .5rem; align-items: center; font-size: 11px; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 1rem; }
.breadcrumb a { color: var(--muted); transition: color .2s; }
.breadcrumb a:hover { color: var(--black); }
.breadcrumb span { color: var(--black); }

/* ── PAGINATION ──────────────────────────────────────────── */
.pagination { display: flex; gap: .5rem; justify-content: center; padding: 3rem 0; }
.pagination a, .pagination span { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); font-size: 13px; transition: .15s; }
.pagination a:hover { background: var(--black); color: var(--white); border-color: var(--black); }
.pagination span { background: var(--black); color: var(--white); border-color: var(--black); }

/* ── FADE ANIMATION ──────────────────────────────────────── */
.fade-up { opacity: 0; transform: translateY(28px); transition: opacity .75s ease, transform .75s ease; }
.fade-up.visible { opacity: 1; transform: translateY(0); }

/* ── FOOTER ──────────────────────────────────────────────── */
footer {
  background: var(--white);
  color: var(--black);
  border-top: 1px solid var(--border);
}
.footer-main {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 4rem;
  max-width: 1320px;
  margin: 0 auto;
  padding: 5rem 2.5rem 4rem;
}
.footer-brand-logo {
  font-family: 'Bebas Neue', 'Oswald', sans-serif;
  font-size: 36px;
  font-weight: 400;
  letter-spacing: .12em;
  color: var(--black);
  margin-bottom: 1.2rem;
  display: block;
  text-transform: uppercase;
  text-decoration: none;
}
.footer-tagline {
  font-size: 12px;
  line-height: 2;
  color: var(--muted);
  max-width: 260px;
  margin-bottom: 2rem;
}
.footer-socials { display: flex; gap: .75rem; }
.footer-socials a {
  width: 38px;
  height: 38px;
  border: 1px solid var(--border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--black);
  transition: background .2s, border-color .2s, color .2s;
}
.footer-socials a:hover {
  background: var(--black);
  border-color: var(--black);
  color: var(--white);
}
.footer-socials svg { width: 16px; height: 16px; fill: currentColor; }
.footer-col h4 {
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--black);
  font-weight: 600;
  margin-bottom: 1.5rem;
}
.footer-col li { margin-bottom: .75rem; }
.footer-col a {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .04em;
  transition: color .2s;
  text-decoration: none;
}
.footer-col a:hover { color: var(--black); }
.footer-bottom {
  border-top: 1px solid var(--border);
  padding: 1.5rem 2.5rem;
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer-copy { font-size: 11px; color: var(--muted); letter-spacing: .05em; }
.footer-creative { font-family: var(--serif); font-size: 14px; font-style: italic; color: rgba(10,10,10,.25); }

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 1024px) {
  .heritage-grid { grid-template-columns: 1fr; gap: 3rem; }
  .heritage-img-wrap:first-child, .heritage-img-wrap:last-child { margin-top: 0; }
  .essence-header { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .essence-sub { text-align: left; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 3rem; }
  .product-detail { grid-template-columns: 1fr; }
  .product-gallery { position: static; }
  .cart-page { grid-template-columns: 1fr; }
  .checkout-layout { grid-template-columns: 1fr; }
  .account-layout { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  nav .nav-links { display: none; }
  .nav-hamburger { display: flex; }
  .nav-actions a { display: none !important; }
  .cart-btn-text { display: none; }
  .collection-grid, .shop-grid { grid-template-columns: 1fr 1fr; }
  .shop-layout { grid-template-columns: 1fr; }
  .shop-filters { display: none; }

}
@media (max-width: 600px) {
  .topbar { display: none; }
  nav { top: 0; }
  .hero { margin-top: 70px; }
  .page-top { padding-top: 70px; }
  .auth-page { padding-top: 90px; }
  .collection-grid, .shop-grid { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr; padding: 3rem 1.5rem 2rem; }
  .footer-bottom { flex-direction: column; gap: .75rem; padding: 1.25rem 1.5rem; }
  .cart-drawer { width: 100%; }
  .form-row { grid-template-columns: 1fr; }
  .heritage-images { grid-template-columns: 1fr; }
  /* Collection header stacks on mobile so View All doesn't overflow */
  .collection-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
  }
  .collection-section { padding: 2rem 1.25rem 5rem; }
  .heritage-section { padding: 5rem 1.25rem; }
  .essence-section { padding: 5rem 1.25rem; }
  .philosophy { padding: 6rem 1.25rem; }
}

/* ── ABOUT PAGE ──────────────────────────────────────────── */
.about { background: var(--white); }

/* ── HERO — full width image with text overlay ─────────── */
.ab-hero {
  margin-top: 116px;
  position: relative;
  height: 92vh;
  min-height: 580px;
  max-height: 820px;
  overflow: hidden;
  background: #e8e4e0;
}
.ab-hero img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
  filter: brightness(.75);
}
.ab-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(10,10,10,.05) 0%,
    rgba(10,10,10,.0) 40%,
    rgba(10,10,10,.55) 100%
  );
}
.ab-hero-content {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  justify-content: flex-end;
  padding: 4rem 5rem;
  max-width: 900px;
}
.ab-eyebrow {
  font-size: 9px; letter-spacing: .32em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; margin-bottom: 1.5rem;
  display: flex; align-items: center; gap: .75rem;
}
.ab-eyebrow::before { content: ''; width: 24px; height: 1px; background: var(--stone); }
.ab-hero-title {
  font-family: var(--serif);
  font-size: clamp(52px, 8vw, 108px);
  font-weight: 300; line-height: .92;
  color: #fff; text-transform: uppercase; letter-spacing: .03em;
  margin-bottom: 2rem;
}
.ab-hero-title em { font-style: italic; color: var(--stone); }
.ab-hero-lead {
  font-size: 13px; line-height: 1.9; color: rgba(255,255,255,.55);
  max-width: 440px; letter-spacing: .02em;
}
/* Small tag top-right */
.ab-hero-tag {
  position: absolute; top: 3rem; right: 4rem;
  font-size: 9px; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(255,255,255,.25);
}

/* ── INTRO STATS ──────────────────────────────────────── */
.ab-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--border);
}
.ab-stat {
  padding: 2.75rem 3rem;
  border-right: 1px solid var(--border);
}
.ab-stat:last-child { border-right: none; }
.ab-stat-num {
  font-family: var(--serif); font-size: 11px; letter-spacing: .12em;
  color: var(--stone); margin-bottom: 1rem; display: block;
  text-transform: uppercase;
}
.ab-stat-val {
  font-family: var(--serif); font-size: 20px; font-weight: 300;
  color: var(--black); line-height: 1.3;
}

/* ── DIRECTOR SECTION ─────────────────────────────────── */
.ab-director {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--border);
}
.ab-director-left {
  padding: 7rem 5rem;
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column; justify-content: center;
}
.ab-section-label {
  font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; margin-bottom: 1.5rem;
}
.ab-name {
  font-family: var(--serif);
  font-size: clamp(56px, 7vw, 100px);
  font-weight: 300; line-height: .9;
  color: var(--black); text-transform: uppercase;
  letter-spacing: .02em; margin-bottom: 3rem;
}
.ab-body {
  font-size: 13px; line-height: 2.1; color: rgba(10,10,10,.5);
  margin-bottom: 1.25rem;
}
.ab-body strong { color: var(--black); font-weight: 500; }
.ab-quote {
  font-family: var(--serif); font-size: clamp(16px, 1.8vw, 21px);
  font-weight: 300; font-style: italic; line-height: 1.65;
  color: var(--black); border-left: 2px solid var(--stone);
  padding-left: 1.5rem; margin: 2.5rem 0;
}
.ab-director-right {
  padding: 7rem 5rem;
  display: flex; flex-direction: column; justify-content: center;
  background: #faf9f7;
}

/* ── PHILOSOPHY ───────────────────────────────────────── */
.ab-philosophy {
  padding: 8rem 5rem;
  max-width: 1100px; margin: 0 auto;
  border-bottom: 1px solid var(--border);
}
.ab-philosophy-title {
  font-family: var(--serif);
  font-size: clamp(44px, 6vw, 86px);
  font-weight: 300; line-height: .94;
  color: var(--black); text-transform: uppercase;
  letter-spacing: .02em; margin-bottom: 5rem;
  max-width: 700px;
}
.ab-philosophy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
}

/* ── VALUES ───────────────────────────────────────────── */
.ab-values {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  border-bottom: 1px solid var(--border);
}
.ab-value {
  padding: 3rem 2.5rem;
  border-right: 1px solid var(--border);
}
.ab-value:last-child { border-right: none; }
.ab-value-num {
  font-size: 9px; letter-spacing: .2em; color: var(--stone);
  display: block; margin-bottom: 1.5rem; text-transform: uppercase;
}
.ab-value-title {
  font-family: var(--serif); font-size: 22px; font-weight: 300;
  color: var(--black); margin-bottom: .75rem;
  text-transform: uppercase; letter-spacing: .03em;
}
.ab-value-body { font-size: 12px; line-height: 1.9; color: var(--muted); }

/* ── CLOSING ──────────────────────────────────────────── */
.ab-closing {
  padding: 10rem 2.5rem;
  text-align: center;
  background: var(--white);
  border-bottom: 1px solid var(--border);
}
.ab-closing-inner { max-width: 820px; margin: 0 auto; }
.ab-closing-pre {
  font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--stone); margin-bottom: 2.5rem; display: block;
}
.ab-closing-quote {
  font-family: var(--serif);
  font-size: clamp(34px, 5vw, 62px);
  font-weight: 300; line-height: 1.15;
  color: var(--black); letter-spacing: .02em; margin-bottom: 3rem;
}
.ab-closing-quote em { font-style: italic; color: var(--stone); }
.ab-closing-tag {
  font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(10,10,10,.25); display: flex; align-items: center;
  justify-content: center; gap: 1.25rem;
}
.ab-closing-tag::before,.ab-closing-tag::after {
  content: ''; width: 36px; height: 1px; background: var(--border); display: block;
}

/* ── CTA ──────────────────────────────────────────────── */
.ab-cta {
  display: grid; grid-template-columns: 1fr 1fr;
}
.ab-cta-item {
  padding: 4rem 3.5rem;
  border-right: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
}
.ab-cta-item:last-child { border-right: none; }
.ab-cta-label {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: .75rem;
}
.ab-cta-title {
  font-family: var(--serif); font-size: clamp(22px,3vw,34px);
  font-weight: 300; color: var(--black);
  text-transform: uppercase; letter-spacing: .02em;
}
.ab-cta-link {
  display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap;
  font-size: 10px; letter-spacing: .2em; text-transform: uppercase;
  font-weight: 600; color: var(--black); text-decoration: none;
  border-bottom: 1px solid var(--black); padding-bottom: 2px;
  transition: color .2s, border-color .2s; flex-shrink: 0;
}
.ab-cta-link:hover { color: var(--stone); border-color: var(--stone); }

/* ── RESPONSIVE ───────────────────────────────────────── */
@media(max-width:1024px) {
  .ab-director { grid-template-columns: 1fr; }
  .ab-director-left { padding: 4rem 2.5rem; border-right: none; border-bottom: 1px solid var(--border); }
  .ab-director-right { padding: 4rem 2.5rem; background: var(--white); }
  .ab-philosophy { padding: 5rem 2.5rem; }
  .ab-philosophy-grid { grid-template-columns: 1fr; gap: 2rem; }
  .ab-values { grid-template-columns: 1fr 1fr; }
  .ab-value:nth-child(2) { border-right: none; }
  .ab-value:nth-child(3) { border-top: 1px solid var(--border); }
  .ab-value:nth-child(4) { border-top: 1px solid var(--border); border-right: none; }
  .ab-cta { grid-template-columns: 1fr; }
  .ab-cta-item { border-right: none; border-bottom: 1px solid var(--border); }
  .ab-cta-item:last-child { border-bottom: none; }
}
@media(max-width:768px) {
  .ab-hero { margin-top: 70px; height: 100svh; max-height: none; }
  .ab-hero-content { padding: 2.5rem 1.5rem 3rem; }
  .ab-hero-tag { top: 1.5rem; right: 1.5rem; }
  .ab-stats { grid-template-columns: 1fr; }
  .ab-stat { border-right: none; border-bottom: 1px solid var(--border); padding: 2rem 1.5rem; }
  .ab-stat:last-child { border-bottom: none; }
  .ab-director-left,.ab-director-right { padding: 3.5rem 1.5rem; }
  .ab-philosophy { padding: 4rem 1.5rem; }
  .ab-values { grid-template-columns: 1fr; }
  .ab-value { border-right: none; border-bottom: 1px solid var(--border); padding: 2.5rem 1.5rem; }
  .ab-value:nth-child(3),.ab-value:nth-child(4) { border-top: none; }
  .ab-value:last-child { border-bottom: none; }
  .ab-closing { padding: 6rem 1.5rem; }
  .ab-cta-item { padding: 3rem 1.5rem; flex-direction: column; align-items: flex-start; gap: 1.5rem; }
}

/* ── CONTACT PAGE ────────────────────────────────────────── */
.contact-page { padding-top: 116px; background: var(--white); min-height: 100vh; }

/* HERO — white with border bottom */
.contact-hero {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  padding: 6rem 2.5rem 5rem;
  display: flex; justify-content: space-between; align-items: flex-end; gap: 3rem;
}
.contact-hero-left { max-width: 560px; }
.contact-eyebrow {
  font-size: 9px; letter-spacing: .32em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; margin-bottom: 1.5rem;
}
.contact-title {
  font-family: var(--serif); font-size: clamp(52px,8vw,96px);
  font-weight: 300; line-height: .9; color: var(--black);
  text-transform: uppercase; letter-spacing: .04em;
}
.contact-title em { font-style: italic; color: rgba(10,10,10,.2); }
.contact-hero-right {
  display: flex; flex-direction: column; gap: 2rem; min-width: 260px;
}
.contact-info-label {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: .5rem;
}
.contact-info-value { font-size: 13px; color: var(--black); line-height: 1.7; }
.contact-info-value a { color: var(--stone); transition: opacity .2s; }
.contact-info-value a:hover { opacity: .7; }

/* MAIN */
.contact-main {
  display: grid; grid-template-columns: 1fr 1.4fr;
  max-width: 1200px; margin: 0 auto; padding: 6rem 2.5rem 8rem;
  gap: 7rem; align-items: start;
}
.contact-channels-title {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 2.5rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--border);
}
.contact-channel {
  display: flex; align-items: flex-start; gap: 1.5rem;
  padding: 1.5rem 0; border-bottom: 1px solid var(--border);
}
.contact-channel-icon {
  width: 40px; height: 40px; border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0; color: var(--muted);
}
.contact-channel-name {
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
  font-weight: 600; color: var(--black); margin-bottom: .3rem;
}
.contact-channel-val { font-size: 13px; color: var(--muted); line-height: 1.6; }
.contact-channel-val a { color: var(--black); border-bottom: 1px solid rgba(0,0,0,.12); }
.contact-channel-val a:hover { border-color: var(--black); }
.contact-socials { margin-top: 3rem; }
.contact-socials-title {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 1.25rem;
}
.contact-social-link {
  display: flex; align-items: center; gap: 1rem;
  font-size: 12px; color: var(--black); letter-spacing: .06em;
  transition: color .2s; padding: .5rem 0; border-bottom: 1px solid var(--border);
}
.contact-social-link:hover { color: var(--stone); }
.contact-social-link span {
  font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--muted); margin-left: auto;
}

/* FORM */
.contact-form-title {
  font-family: var(--serif); font-size: 32px; font-weight: 300;
  color: var(--black); margin-bottom: .5rem; letter-spacing: .03em;
}
.contact-form-sub { font-size: 13px; color: var(--muted); margin-bottom: 2.5rem; line-height: 1.7; }
.contact-success {
  padding: 3rem; border: 1px solid rgba(39,174,96,.2);
  background: #f0fdf4; text-align: center;
}
.contact-success-icon {
  width: 56px; height: 56px; border-radius: 50%; background: #dcfce7;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; margin: 0 auto 1.5rem;
}
.contact-success h3 { font-family: var(--serif); font-size: 24px; font-weight: 300; margin-bottom: .75rem; }
.contact-success p { font-size: 13px; color: var(--muted); line-height: 1.8; }
.contact-form { display: flex; flex-direction: column; }
.contact-field {
  position: relative; border-bottom: 1px solid var(--border);
  transition: border-color .2s;
}
.contact-field:focus-within { border-color: var(--black); }
.contact-field label {
  display: block; font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--muted); padding: 1.25rem 0 .3rem; font-weight: 500;
}
.contact-field input,.contact-field textarea,.contact-field select {
  display: block; width: 100%; border: none; outline: none; background: transparent;
  font-size: 14px; font-family: var(--sans); color: var(--black);
  padding: .3rem 0 1.25rem; resize: none;
}
.contact-field textarea { min-height: 120px; }
.contact-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
.contact-submit { margin-top: 2.5rem; display: flex; align-items: center; gap: 1.5rem; }
.contact-submit-btn {
  padding: 15px 48px; background: var(--black); color: var(--white); border: none;
  font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600;
  font-family: var(--sans); cursor: pointer; transition: background .2s, transform .15s;
}
.contact-submit-btn:hover { background: #222; transform: translateY(-1px); }
.contact-submit-note { font-size: 11px; color: var(--muted); letter-spacing: .04em; }

@media(max-width:1024px){ .contact-main{grid-template-columns:1fr;gap:4rem;} }
@media(max-width:768px){
  .contact-page{padding-top:70px;}
  .contact-hero{flex-direction:column;padding:4rem 1.5rem 3rem;}
  .contact-main{padding:4rem 1.5rem 6rem;}
  .contact-form-row{grid-template-columns:1fr;}
}

/* ── SHOP PAGE ───────────────────────────────────────────── */
.shop-layout { display: grid; grid-template-columns: 220px 1fr; gap: 3rem; padding: 3rem 2.5rem 6rem; padding-top: 2rem; }
.shop-filters h3 { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; margin-bottom: 1rem; padding-bottom: .75rem; border-bottom: 1px solid var(--border); }
.filter-group { margin-bottom: 2rem; }
.shop-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border); }
.shop-count { font-size: 12px; color: var(--muted); }
.shop-sort select { padding: 8px 12px; border: 1px solid var(--border); font-size: 12px; font-family: var(--sans); background: var(--white); }
.shop-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); }

/* ── PRODUCT DETAIL ──────────────────────────────────────── */
.product-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; padding: 3rem 2.5rem 6rem; }
.product-gallery { position: sticky; top: 140px; }
.product-gallery-main { aspect-ratio: 3/4; overflow: hidden; background: var(--light-gray); margin-bottom: 1rem; }
.product-gallery-main img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.product-gallery-main img:hover { transform: scale(1.03); }
.product-gallery-thumbs { display: grid; grid-template-columns: repeat(4,1fr); gap: .5rem; }
.product-gallery-thumbs img { aspect-ratio: 1; object-fit: cover; cursor: pointer; border: 2px solid transparent; transition: border-color .2s; opacity: .7; }
.product-gallery-thumbs img.active, .product-gallery-thumbs img:hover { border-color: var(--black); opacity: 1; }
.product-detail-info .product-name { font-family: var(--serif); font-size: clamp(32px,4vw,52px); font-weight: 300; line-height: 1.1; margin-bottom: 1rem; }
.product-detail-price { font-size: 22px; font-weight: 500; margin-bottom: 2rem; }
.product-detail-price .compare { font-size: 16px; text-decoration: line-through; color: var(--muted); margin-left: .75rem; font-weight: 400; }
.variant-label { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; margin-bottom: .75rem; }
.variant-options { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.variant-btn { padding: 8px 18px; border: 1px solid var(--border); font-size: 12px; background: var(--white); cursor: pointer; transition: .15s; font-family: var(--sans); }
.variant-btn:hover { border-color: var(--black); }
.variant-btn.selected { border-color: var(--black); background: var(--black); color: var(--white); }
.variant-btn:disabled { opacity: .35; cursor: not-allowed; }
.add-to-cart-form { display: flex; gap: .75rem; margin-bottom: 2rem; }
.qty-input { width: 60px; border: 1px solid var(--border); text-align: center; font-size: 15px; font-family: var(--sans); padding: 0 8px; }
.product-detail-desc { font-size: 14px; line-height: 2; color: rgba(10,10,10,.6); margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--border); }

/* ── CART PAGE ───────────────────────────────────────────── */
.cart-page { display: grid; grid-template-columns: 1fr 360px; gap: 3rem; padding: 3rem 2.5rem 6rem; }
.cart-page-item { display: grid; grid-template-columns: 90px 1fr auto; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--border); align-items: start; }
.cart-page-item img { width: 90px; height: 110px; object-fit: cover; background: var(--light-gray); }
.cart-page-summary { background: var(--light-gray); padding: 2rem; align-self: start; position: sticky; top: 140px; }
.summary-title { font-family: var(--serif); font-size: 22px; font-weight: 400; margin-bottom: 1.5rem; }
.summary-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); margin-bottom: .75rem; }
.summary-row.total { font-size: 16px; font-weight: 600; color: var(--black); padding-top: 1rem; border-top: 1px solid var(--border); margin-top: .5rem; }
.summary-row.discount { color: #27ae60; }

/* ── CHECKOUT ────────────────────────────────────────────── */
.checkout-layout { display: grid; grid-template-columns: 1fr 380px; gap: 4rem; padding: 3rem 2.5rem 6rem; max-width: 1320px; margin: 0 auto; }
.checkout-form-title { font-family: var(--serif); font-size: 26px; font-weight: 400; margin-bottom: 2rem; letter-spacing: .03em; }
.checkout-section { margin-bottom: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid var(--border); }
.checkout-section h3 { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; margin-bottom: 1.5rem; color: var(--black); }
.order-summary-sidebar { background: var(--light-gray); padding: 2rem; align-self: start; position: sticky; top: 140px; }

/* ── ACCOUNT ─────────────────────────────────────────────── */
.account-layout { display: grid; grid-template-columns: 220px 1fr; gap: 3rem; padding: 3rem 2.5rem 6rem; max-width: 1320px; margin: 0 auto; }
.account-nav { align-self: start; position: sticky; top: 140px; }
.account-nav h3 { font-size: 11px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; margin-bottom: 1.25rem; color: var(--muted); }
.account-nav a { display: block; padding: .65rem 0; font-size: 13px; color: rgba(10,10,10,.55); border-bottom: 1px solid var(--border); transition: color .2s; }
.account-nav a:hover, .account-nav a.active { color: var(--black); }
.account-title { font-family: var(--serif); font-size: 36px; font-weight: 300; margin-bottom: 2rem; }
.orders-table { width: 100%; border-collapse: collapse; }
.orders-table th { font-size: 10px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; padding: .75rem 1rem; text-align: left; border-bottom: 2px solid var(--border); }
.orders-table td { padding: 1rem; border-bottom: 1px solid var(--border); font-size: 13px; }
.status-badge { display: inline-block; padding: 3px 10px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; }
.status-badge--paid, .status-badge--delivered { background: #eafaf1; color: #27ae60; }
.status-badge--pending   { background: #fef9e7; color: #f39c12; }
.status-badge--shipped   { background: #eaf4fb; color: #2980b9; }
.status-badge--processing{ background: #fef6e7; color: #d68910; }
.status-badge--cancelled, .status-badge--refunded { background: #fdedec; color: #e74c3c; }

/* ── AUTH PAGES ──────────────────────────────────────────── */
.auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 2rem; background: var(--light-gray); padding-top: 140px; }
.auth-box { background: var(--white); padding: 3rem; max-width: 440px; width: 100%; border: 1px solid var(--border); }
.auth-logo { font-family: var(--serif); font-size: 28px; font-weight: 300; letter-spacing: .14em; text-transform: lowercase; text-align: center; margin-bottom: 2rem; display: block; color: var(--black); }
.auth-title { font-family: var(--serif); font-size: 26px; font-weight: 400; margin-bottom: .5rem; }
.auth-sub { font-size: 13px; color: var(--muted); margin-bottom: 2rem; }
.auth-link { font-size: 12px; color: var(--muted); text-align: center; margin-top: 1.25rem; }
.auth-link a { color: var(--black); border-bottom: 1px solid var(--border); }

/* ── PAGE HEADER ─────────────────────────────────────────── */
.page-header { padding: 5rem 2.5rem 3rem; border-bottom: 1px solid var(--border); max-width: 1320px; margin: 0 auto; }
.page-header h1 { font-family: var(--serif); font-size: clamp(36px,5vw,64px); font-weight: 300; letter-spacing: .04em; text-transform: uppercase; }
.page-header p { font-size: 14px; color: var(--muted); margin-top: 1rem; max-width: 500px; line-height: 1.8; }

/* ── BREADCRUMB ──────────────────────────────────────────── */
.breadcrumb { display: flex; gap: .5rem; align-items: center; font-size: 11px; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 1rem; }
.breadcrumb a { color: var(--muted); transition: color .2s; }
.breadcrumb a:hover { color: var(--black); }
.breadcrumb span { color: var(--black); }

/* ── PAGINATION ──────────────────────────────────────────── */
.pagination { display: flex; gap: .5rem; justify-content: center; padding: 3rem 0; }
.pagination a, .pagination span { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); font-size: 13px; transition: .15s; }
.pagination a:hover { background: var(--black); color: var(--white); border-color: var(--black); }
.pagination span { background: var(--black); color: var(--white); border-color: var(--black); }

/* ── FADE ANIMATION ──────────────────────────────────────── */
.fade-up { opacity: 0; transform: translateY(28px); transition: opacity .75s ease, transform .75s ease; }
.fade-up.visible { opacity: 1; transform: translateY(0); }

/* ── FOOTER ──────────────────────────────────────────────── */
footer {
  background: var(--white);
  color: var(--black);
  border-top: 1px solid var(--border);
}
.footer-main {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 4rem;
  max-width: 1320px;
  margin: 0 auto;
  padding: 5rem 2.5rem 4rem;
}
.footer-brand-logo {
  font-family: 'Bebas Neue', 'Oswald', sans-serif;
  font-size: 36px;
  font-weight: 400;
  letter-spacing: .12em;
  color: var(--black);
  margin-bottom: 1.2rem;
  display: block;
  text-transform: uppercase;
  text-decoration: none;
}
.footer-tagline {
  font-size: 12px;
  line-height: 2;
  color: var(--muted);
  max-width: 260px;
  margin-bottom: 2rem;
}
.footer-socials { display: flex; gap: .75rem; }
.footer-socials a {
  width: 38px;
  height: 38px;
  border: 1px solid var(--border);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--black);
  transition: background .2s, border-color .2s, color .2s;
}
.footer-socials a:hover {
  background: var(--black);
  border-color: var(--black);
  color: var(--white);
}
.footer-socials svg { width: 16px; height: 16px; fill: currentColor; }
.footer-col h4 {
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--black);
  font-weight: 600;
  margin-bottom: 1.5rem;
}
.footer-col li { margin-bottom: .75rem; }
.footer-col a {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .04em;
  transition: color .2s;
  text-decoration: none;
}
.footer-col a:hover { color: var(--black); }
.footer-bottom {
  border-top: 1px solid var(--border);
  padding: 1.5rem 2.5rem;
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer-copy { font-size: 11px; color: var(--muted); letter-spacing: .05em; }
.footer-creative { font-family: var(--serif); font-size: 14px; font-style: italic; color: rgba(10,10,10,.25); }

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 1024px) {
  .heritage-grid { grid-template-columns: 1fr; gap: 3rem; }
  .heritage-img-wrap:first-child, .heritage-img-wrap:last-child { margin-top: 0; }
  .essence-header { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .essence-sub { text-align: left; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 3rem; }
  .product-detail { grid-template-columns: 1fr; }
  .product-gallery { position: static; }
  .cart-page { grid-template-columns: 1fr; }
  .checkout-layout { grid-template-columns: 1fr; }
  .account-layout { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  nav .nav-links { display: none; }
  .nav-hamburger { display: flex; }
  .nav-actions a { display: none !important; }
  .cart-btn-text { display: none; }
  .collection-grid, .shop-grid { grid-template-columns: 1fr 1fr; }
  .shop-layout { grid-template-columns: 1fr; }
  .shop-filters { display: none; }

}
@media (max-width: 600px) {
  .topbar { display: none; }
  nav { top: 0; }
  .hero { margin-top: 70px; }
  .page-top { padding-top: 70px; }
  .auth-page { padding-top: 90px; }
  .collection-grid, .shop-grid { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr; padding: 3rem 1.5rem 2rem; }
  .footer-bottom { flex-direction: column; gap: .75rem; padding: 1.25rem 1.5rem; }
  .cart-drawer { width: 100%; }
  .form-row { grid-template-columns: 1fr; }
  .heritage-images { grid-template-columns: 1fr; }
  /* Collection header stacks on mobile so View All doesn't overflow */
  .collection-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
  }
  .collection-section { padding: 2rem 1.25rem 5rem; }
  .heritage-section { padding: 5rem 1.25rem; }
  .essence-section { padding: 5rem 1.25rem; }
  .philosophy { padding: 6rem 1.25rem; }
}

/* ── ABOUT PAGE ──────────────────────────────────────────── */
.about { background: var(--white); }

/* ── HERO — full width image with text overlay ─────────── */
.ab-hero {
  margin-top: 116px;
  position: relative;
  height: 92vh;
  min-height: 580px;
  max-height: 820px;
  overflow: hidden;
  background: #e8e4e0;
}
.ab-hero img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
  filter: brightness(.75);
}
.ab-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(10,10,10,.05) 0%,
    rgba(10,10,10,.0) 40%,
    rgba(10,10,10,.55) 100%
  );
}
.ab-hero-content {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  justify-content: flex-end;
  padding: 4rem 5rem;
  max-width: 900px;
}
.ab-eyebrow {
  font-size: 9px; letter-spacing: .32em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; margin-bottom: 1.5rem;
  display: flex; align-items: center; gap: .75rem;
}
.ab-eyebrow::before { content: ''; width: 24px; height: 1px; background: var(--stone); }
.ab-hero-title {
  font-family: var(--serif);
  font-size: clamp(52px, 8vw, 108px);
  font-weight: 300; line-height: .92;
  color: #fff; text-transform: uppercase; letter-spacing: .03em;
  margin-bottom: 2rem;
}
.ab-hero-title em { font-style: italic; color: var(--stone); }
.ab-hero-lead {
  font-size: 13px; line-height: 1.9; color: rgba(255,255,255,.55);
  max-width: 440px; letter-spacing: .02em;
}
/* Small tag top-right */
.ab-hero-tag {
  position: absolute; top: 3rem; right: 4rem;
  font-size: 9px; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(255,255,255,.25);
}

/* ── INTRO STATS ──────────────────────────────────────── */
.ab-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--border);
}
.ab-stat {
  padding: 2.75rem 3rem;
  border-right: 1px solid var(--border);
}
.ab-stat:last-child { border-right: none; }
.ab-stat-num {
  font-family: var(--serif); font-size: 11px; letter-spacing: .12em;
  color: var(--stone); margin-bottom: 1rem; display: block;
  text-transform: uppercase;
}
.ab-stat-val {
  font-family: var(--serif); font-size: 20px; font-weight: 300;
  color: var(--black); line-height: 1.3;
}

/* ── DIRECTOR SECTION ─────────────────────────────────── */
.ab-director {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--border);
}
.ab-director-left {
  padding: 7rem 5rem;
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column; justify-content: center;
}
.ab-section-label {
  font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; margin-bottom: 1.5rem;
}
.ab-name {
  font-family: var(--serif);
  font-size: clamp(56px, 7vw, 100px);
  font-weight: 300; line-height: .9;
  color: var(--black); text-transform: uppercase;
  letter-spacing: .02em; margin-bottom: 3rem;
}
.ab-body {
  font-size: 13px; line-height: 2.1; color: rgba(10,10,10,.5);
  margin-bottom: 1.25rem;
}
.ab-body strong { color: var(--black); font-weight: 500; }
.ab-quote {
  font-family: var(--serif); font-size: clamp(16px, 1.8vw, 21px);
  font-weight: 300; font-style: italic; line-height: 1.65;
  color: var(--black); border-left: 2px solid var(--stone);
  padding-left: 1.5rem; margin: 2.5rem 0;
}
.ab-director-right {
  padding: 7rem 5rem;
  display: flex; flex-direction: column; justify-content: center;
  background: #faf9f7;
}

/* ── PHILOSOPHY ───────────────────────────────────────── */
.ab-philosophy {
  padding: 8rem 5rem;
  max-width: 1100px; margin: 0 auto;
  border-bottom: 1px solid var(--border);
}
.ab-philosophy-title {
  font-family: var(--serif);
  font-size: clamp(44px, 6vw, 86px);
  font-weight: 300; line-height: .94;
  color: var(--black); text-transform: uppercase;
  letter-spacing: .02em; margin-bottom: 5rem;
  max-width: 700px;
}
.ab-philosophy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
}

/* ── VALUES ───────────────────────────────────────────── */
.ab-values {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  border-bottom: 1px solid var(--border);
}
.ab-value {
  padding: 3rem 2.5rem;
  border-right: 1px solid var(--border);
}
.ab-value:last-child { border-right: none; }
.ab-value-num {
  font-size: 9px; letter-spacing: .2em; color: var(--stone);
  display: block; margin-bottom: 1.5rem; text-transform: uppercase;
}
.ab-value-title {
  font-family: var(--serif); font-size: 22px; font-weight: 300;
  color: var(--black); margin-bottom: .75rem;
  text-transform: uppercase; letter-spacing: .03em;
}
.ab-value-body { font-size: 12px; line-height: 1.9; color: var(--muted); }

/* ── CLOSING ──────────────────────────────────────────── */
.ab-closing {
  padding: 10rem 2.5rem;
  text-align: center;
  background: var(--white);
  border-bottom: 1px solid var(--border);
}
.ab-closing-inner { max-width: 820px; margin: 0 auto; }
.ab-closing-pre {
  font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--stone); margin-bottom: 2.5rem; display: block;
}
.ab-closing-quote {
  font-family: var(--serif);
  font-size: clamp(34px, 5vw, 62px);
  font-weight: 300; line-height: 1.15;
  color: var(--black); letter-spacing: .02em; margin-bottom: 3rem;
}
.ab-closing-quote em { font-style: italic; color: var(--stone); }
.ab-closing-tag {
  font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(10,10,10,.25); display: flex; align-items: center;
  justify-content: center; gap: 1.25rem;
}
.ab-closing-tag::before,.ab-closing-tag::after {
  content: ''; width: 36px; height: 1px; background: var(--border); display: block;
}

/* ── CTA ──────────────────────────────────────────────── */
.ab-cta {
  display: grid; grid-template-columns: 1fr 1fr;
}
.ab-cta-item {
  padding: 4rem 3.5rem;
  border-right: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
}
.ab-cta-item:last-child { border-right: none; }
.ab-cta-label {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: .75rem;
}
.ab-cta-title {
  font-family: var(--serif); font-size: clamp(22px,3vw,34px);
  font-weight: 300; color: var(--black);
  text-transform: uppercase; letter-spacing: .02em;
}
.ab-cta-link {
  display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap;
  font-size: 10px; letter-spacing: .2em; text-transform: uppercase;
  font-weight: 600; color: var(--black); text-decoration: none;
  border-bottom: 1px solid var(--black); padding-bottom: 2px;
  transition: color .2s, border-color .2s; flex-shrink: 0;
}
.ab-cta-link:hover { color: var(--stone); border-color: var(--stone); }

/* ── RESPONSIVE ───────────────────────────────────────── */
@media(max-width:1024px) {
  .ab-director { grid-template-columns: 1fr; }
  .ab-director-left { padding: 4rem 2.5rem; border-right: none; border-bottom: 1px solid var(--border); }
  .ab-director-right { padding: 4rem 2.5rem; background: var(--white); }
  .ab-philosophy { padding: 5rem 2.5rem; }
  .ab-philosophy-grid { grid-template-columns: 1fr; gap: 2rem; }
  .ab-values { grid-template-columns: 1fr 1fr; }
  .ab-value:nth-child(2) { border-right: none; }
  .ab-value:nth-child(3) { border-top: 1px solid var(--border); }
  .ab-value:nth-child(4) { border-top: 1px solid var(--border); border-right: none; }
  .ab-cta { grid-template-columns: 1fr; }
  .ab-cta-item { border-right: none; border-bottom: 1px solid var(--border); }
  .ab-cta-item:last-child { border-bottom: none; }
}
@media(max-width:768px) {
  .ab-hero { margin-top: 70px; height: 100svh; max-height: none; }
  .ab-hero-content { padding: 2.5rem 1.5rem 3rem; }
  .ab-hero-tag { top: 1.5rem; right: 1.5rem; }
  .ab-stats { grid-template-columns: 1fr; }
  .ab-stat { border-right: none; border-bottom: 1px solid var(--border); padding: 2rem 1.5rem; }
  .ab-stat:last-child { border-bottom: none; }
  .ab-director-left,.ab-director-right { padding: 3.5rem 1.5rem; }
  .ab-philosophy { padding: 4rem 1.5rem; }
  .ab-values { grid-template-columns: 1fr; }
  .ab-value { border-right: none; border-bottom: 1px solid var(--border); padding: 2.5rem 1.5rem; }
  .ab-value:nth-child(3),.ab-value:nth-child(4) { border-top: none; }
  .ab-value:last-child { border-bottom: none; }
  .ab-closing { padding: 6rem 1.5rem; }
  .ab-cta-item { padding: 3rem 1.5rem; flex-direction: column; align-items: flex-start; gap: 1.5rem; }
}

/* ── CONTACT PAGE ────────────────────────────────────────── */
.contact-page { padding-top: 116px; background: var(--white); min-height: 100vh; }

/* HERO — white with border bottom */
.contact-hero {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  padding: 6rem 2.5rem 5rem;
  display: flex; justify-content: space-between; align-items: flex-end; gap: 3rem;
}
.contact-hero-left { max-width: 560px; }
.contact-eyebrow {
  font-size: 9px; letter-spacing: .32em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; margin-bottom: 1.5rem;
}
.contact-title {
  font-family: var(--serif); font-size: clamp(52px,8vw,96px);
  font-weight: 300; line-height: .9; color: var(--black);
  text-transform: uppercase; letter-spacing: .04em;
}
.contact-title em { font-style: italic; color: rgba(10,10,10,.2); }
.contact-hero-right {
  display: flex; flex-direction: column; gap: 2rem; min-width: 260px;
}
.contact-info-label {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: .5rem;
}
.contact-info-value { font-size: 13px; color: var(--black); line-height: 1.7; }
.contact-info-value a { color: var(--stone); transition: opacity .2s; }
.contact-info-value a:hover { opacity: .7; }

/* MAIN */
.contact-main {
  display: grid; grid-template-columns: 1fr 1.4fr;
  max-width: 1200px; margin: 0 auto; padding: 6rem 2.5rem 8rem;
  gap: 7rem; align-items: start;
}
.contact-channels-title {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 2.5rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--border);
}
.contact-channel {
  display: flex; align-items: flex-start; gap: 1.5rem;
  padding: 1.5rem 0; border-bottom: 1px solid var(--border);
}
.contact-channel-icon {
  width: 40px; height: 40px; border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0; color: var(--muted);
}
.contact-channel-name {
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
  font-weight: 600; color: var(--black); margin-bottom: .3rem;
}
.contact-channel-val { font-size: 13px; color: var(--muted); line-height: 1.6; }
.contact-channel-val a { color: var(--black); border-bottom: 1px solid rgba(0,0,0,.12); }
.contact-channel-val a:hover { border-color: var(--black); }
.contact-socials { margin-top: 3rem; }
.contact-socials-title {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 1.25rem;
}
.contact-social-link {
  display: flex; align-items: center; gap: 1rem;
  font-size: 12px; color: var(--black); letter-spacing: .06em;
  transition: color .2s; padding: .5rem 0; border-bottom: 1px solid var(--border);
}
.contact-social-link:hover { color: var(--stone); }
.contact-social-link span {
  font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--muted); margin-left: auto;
}

/* FORM */
.contact-form-title {
  font-family: var(--serif); font-size: 32px; font-weight: 300;
  color: var(--black); margin-bottom: .5rem; letter-spacing: .03em;
}
.contact-form-sub { font-size: 13px; color: var(--muted); margin-bottom: 2.5rem; line-height: 1.7; }
.contact-success {
  padding: 3rem; border: 1px solid rgba(39,174,96,.2);
  background: #f0fdf4; text-align: center;
}
.contact-success-icon {
  width: 56px; height: 56px; border-radius: 50%; background: #dcfce7;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; margin: 0 auto 1.5rem;
}
.contact-success h3 { font-family: var(--serif); font-size: 24px; font-weight: 300; margin-bottom: .75rem; }
.contact-success p { font-size: 13px; color: var(--muted); line-height: 1.8; }
.contact-form { display: flex; flex-direction: column; }
.contact-field {
  position: relative; border-bottom: 1px solid var(--border);
  transition: border-color .2s;
}
.contact-field:focus-within { border-color: var(--black); }
.contact-field label {
  display: block; font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--muted); padding: 1.25rem 0 .3rem; font-weight: 500;
}
.contact-field input,.contact-field textarea,.contact-field select {
  display: block; width: 100%; border: none; outline: none; background: transparent;
  font-size: 14px; font-family: var(--sans); color: var(--black);
  padding: .3rem 0 1.25rem; resize: none;
}
.contact-field textarea { min-height: 120px; }
.contact-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
.contact-submit { margin-top: 2.5rem; display: flex; align-items: center; gap: 1.5rem; }
.contact-submit-btn {
  padding: 15px 48px; background: var(--black); color: var(--white); border: none;
  font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600;
  font-family: var(--sans); cursor: pointer; transition: background .2s, transform .15s;
}
.contact-submit-btn:hover { background: #222; transform: translateY(-1px); }
.contact-submit-note { font-size: 11px; color: var(--muted); letter-spacing: .04em; }

@media(max-width:1024px){ .contact-main{grid-template-columns:1fr;gap:4rem;} }
@media(max-width:768px){
  .contact-page{padding-top:70px;}
  .contact-hero{flex-direction:column;padding:4rem 1.5rem 3rem;}
  .contact-main{padding:4rem 1.5rem 6rem;}
  .contact-form-row{grid-template-columns:1fr;}
}

/* ── SHOP PAGE (sp) ──────────────────────────────────────── */
.sp { padding-top: 116px; background: var(--white); min-height: 100vh; }

.sp-head {
  border-bottom: 1px solid var(--border);
  padding: 4rem 2.5rem 0;
  max-width: 1400px;
  margin: 0 auto;
}
.sp-breadcrumb {
  font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 2rem;
  display: flex; align-items: center; gap: .5rem;
}
.sp-breadcrumb a { color: var(--muted); transition: color .2s; }
.sp-breadcrumb a:hover { color: var(--black); }
.sp-breadcrumb span { color: var(--black); }
.sp-breadcrumb::before {
  content: ''; display: block; width: 20px; height: 1px;
  background: var(--stone); opacity: .6;
}
.sp-head-row {
  display: flex; justify-content: space-between; align-items: flex-end;
  padding-bottom: 2.5rem; gap: 2rem;
}
.sp-title {
  font-family: var(--serif); font-size: clamp(52px,7vw,96px);
  font-weight: 300; line-height: .88; color: var(--black);
  text-transform: uppercase; letter-spacing: .04em;
}
.sp-title em { font-style: italic; color: rgba(10,10,10,.15); }
.sp-head-right {
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 1rem; flex-shrink: 0;
}
.sp-count { font-size: 11px; letter-spacing: .1em; color: var(--muted); text-transform: uppercase; }
.sp-sort select {
  appearance: none; -webkit-appearance: none;
  padding: 10px 36px 10px 14px; border: 1px solid var(--border);
  font-size: 11px; letter-spacing: .08em; font-family: var(--sans);
  color: var(--black); cursor: pointer; outline: none; transition: border-color .2s;
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E") no-repeat right 12px center;
}
.sp-sort select:hover { border-color: var(--black); }

.sp-cats {
  max-width: 1400px; margin: 0 auto; padding: 1.75rem 2.5rem;
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  border-bottom: 1px solid var(--border);
  overflow-x: auto; scrollbar-width: none;
}
.sp-cats::-webkit-scrollbar { display: none; }
.sp-cat-pill {
  display: inline-block; padding: 7px 20px; font-size: 10px;
  letter-spacing: .14em; text-transform: uppercase; font-weight: 500;
  color: var(--muted); border: 1px solid var(--border);
  text-decoration: none; white-space: nowrap;
  transition: background .2s, color .2s, border-color .2s;
}
.sp-cat-pill:hover { border-color: var(--black); color: var(--black); }
.sp-cat-pill.active { background: var(--black); color: var(--white); border-color: var(--black); }

.sp-body { max-width: 1400px; margin: 0 auto; padding: 0 2.5rem 8rem; }
.sp-grid {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 1px; background: var(--border); margin-bottom: 1px;
  grid-auto-flow: dense;
}
.sp-card {
  background: var(--white); display: block;
  text-decoration: none; color: inherit;
  position: relative; overflow: hidden;
}
.sp-card:nth-child(8n+1) { grid-column: span 2; }
.sp-card-img-wrap {
  position: relative; height: 520px;
  overflow: hidden; background: #f0f0f0;
}
.sp-card:nth-child(8n+1) .sp-card-img-wrap { height: 520px; }
.sp-card-img {
  width: 100%; height: 100%; object-fit: contain; object-position: center;
  transition: transform .9s cubic-bezier(.4,0,.2,1), filter .6s;
  filter: brightness(.94) saturate(.88);
}
.sp-card:hover .sp-card-img { transform: scale(1.05); filter: brightness(1) saturate(1); }
.sp-card-overlay {
  position: absolute; inset: 0; background: rgba(10,10,10,0);
  transition: background .4s;
  display: flex; align-items: flex-end; padding: 1.5rem; z-index: 1;
}
.sp-card:hover .sp-card-overlay { background: rgba(10,10,10,.28); }
.sp-card-view {
  font-size: 9px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--white); font-weight: 600; padding: 10px 24px;
  border: 1px solid rgba(255,255,255,.45);
  opacity: 0; transform: translateY(10px);
  transition: opacity .3s .05s, transform .3s .05s; white-space: nowrap;
}
.sp-card:hover .sp-card-view { opacity: 1; transform: translateY(0); }
/* Stone bottom line on hover */
.sp-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 2px; background: var(--stone);
  transform: scaleX(0); transform-origin: left;
  transition: transform .45s cubic-bezier(.4,0,.2,1); z-index: 2;
}
.sp-card:hover::after { transform: scaleX(1); }
.sp-badge {
  position: absolute; top: 1rem; left: 1rem;
  padding: 4px 12px; font-size: 8px; letter-spacing: .12em;
  text-transform: uppercase; font-weight: 600; z-index: 2;
}
.sp-badge--new  { background: var(--black); color: var(--white); }
.sp-badge--sale { background: #b03a2e; color: var(--white); }
.sp-card-info {
  padding: 1.1rem 1.25rem 1.4rem; border-top: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
}
.sp-card-name { font-family: var(--serif); font-size: 16px; font-weight: 400; color: var(--black); line-height: 1.25; }
.sp-card-cat { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-top: .2rem; }
.sp-card-price { text-align: right; flex-shrink: 0; }
.sp-card-price-now { font-size: 14px; font-weight: 500; color: var(--black); display: block; }
.sp-card-price-was { font-size: 11px; text-decoration: line-through; color: var(--muted); display: block; }

.sp-empty { text-align: center; padding: 8rem 2rem; color: var(--muted); }
.sp-empty-title { font-family: var(--serif); font-size: 36px; font-weight: 300; color: var(--black); margin-bottom: 1rem; }
.sp-empty p { font-size: 13px; margin-bottom: 2rem; }

.sp-pagination { display: flex; justify-content: center; align-items: center; gap: .4rem; padding: 4rem 0 0; }
.sp-page-btn {
  width: 42px; height: 42px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--border); font-size: 12px; color: var(--black);
  text-decoration: none; transition: background .2s, color .2s, border-color .2s;
}
.sp-page-btn:hover,.sp-page-btn.active { background: var(--black); color: var(--white); border-color: var(--black); }
.sp-page-dots { font-size: 14px; color: var(--muted); padding: 0 .5rem; }

.sp-result-bar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.5rem 0 2rem; border-bottom: 1px solid var(--border); margin-bottom: 1px;
}
.sp-result-text { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.sp-active-filter {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: 5px 14px; border: 1px solid var(--border);
  font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--black);
}
.sp-active-filter a { color: var(--muted); text-decoration: none; font-size: 14px; line-height: 1; transition: color .2s; }
.sp-active-filter a:hover { color: var(--black); }

@media(max-width:1024px) {
  .sp-grid { grid-template-columns: repeat(2,1fr); }
  .sp-card:nth-child(8n+1) { grid-column: span 2; }
  .sp-card-img-wrap,.sp-card:nth-child(8n+1) .sp-card-img-wrap { height: 520px; }
}
@media(max-width:768px) {
  .sp { padding-top: 116px; }
  .sp-head { padding: 3rem 1.5rem 0; }
  .sp-head-row { flex-direction: column; align-items: flex-start; gap: 1.5rem; padding-bottom: 2rem; }
  .sp-head-right { align-items: flex-start; width: 100%; }
  .sp-sort select { width: 100%; }
  .sp-cats { padding: 1.25rem 1.5rem; }
  .sp-body { padding: 0 1.5rem 5rem; }
  .sp-grid { grid-template-columns: repeat(2,1fr); }
  .sp-card:nth-child(8n+1) { grid-column: span 2; }
  .sp-card-img-wrap,.sp-card:nth-child(8n+1) .sp-card-img-wrap { height: 380px; }
  .sp-card-name { font-size: 14px; }
}
@media(max-width:480px) {
  .sp { padding-top: 70px; }
  .sp-head { padding: 2.5rem 1.25rem 0; }
  .sp-grid { grid-template-columns: 1fr 1fr; gap: 1px; }
  .sp-card:nth-child(8n+1) { grid-column: span 2; }
  .sp-card-img-wrap { height: 220px; }
  .sp-card:nth-child(8n+1) .sp-card-img-wrap { height: 280px; }
  .sp-cats { padding: 1rem 1.25rem; gap: .4rem; }
  .sp-body { padding: 0 1.25rem 4rem; }
  .sp-card-info { padding: .85rem 1rem 1rem; }
  .sp-card-name { font-size: 13px; }
  .sp-card-cat { display: none; }
  .sp-card-price-now { font-size: 13px; }
}
/* ── PRODUCT PAGE (pd) ───────────────────────────────────── */
.pd { padding-top: 116px; background: var(--white); }

.pd-breadcrumb {
  padding: 1.5rem 2.5rem 0;
  font-size: 10px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted); display: flex; gap: .5rem; align-items: center; flex-wrap: wrap;
}
.pd-breadcrumb a { color: var(--muted); transition: color .2s; }
.pd-breadcrumb a:hover { color: var(--black); }
.pd-breadcrumb span { color: var(--black); }

/* Full bleed layout — no max-width cap */
.pd-inner {
  display: grid;
  grid-template-columns: 45% 55%;
  width: 100%;
  padding: 0;
  align-items: start;
  border-top: 1px solid var(--border);
  margin-top: 1.5rem;
}

/* ── GALLERY — vertical stack, full left column ── */
.pd-gallery {
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 1px;
  background: var(--border);
  min-height: 80vh;
}
.pd-gallery-frame {
  position: relative; overflow: hidden;
  background: #f4f3f1;
}
.pd-gallery-frame img {
  width: 100%; display: block;
  aspect-ratio: 1/1; object-fit: cover; object-position: center top;
}
.pd-gallery-frame.main-frame img { aspect-ratio: 4/5; object-fit: contain; }

/* ── INFO PANEL ── */
.pd-info {
  position: sticky; top: 116px;
  padding: 2.5rem 3rem 3rem;
  overflow-y: visible;
}

.pd-eyebrow {
  font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; margin-bottom: .75rem; display: block;
}
.pd-name {
  font-family: var(--serif);
  font-size: clamp(26px, 2.4vw, 38px);
  font-weight: 300; line-height: 1.08; color: var(--black);
  letter-spacing: .02em; margin-bottom: 1.5rem; text-transform: uppercase;
}
.pd-price { display: flex; align-items: baseline; gap: 1rem; margin-bottom: 0; }
.pd-price-now { font-size: 22px; font-weight: 500; color: var(--black); letter-spacing: .02em; }
.pd-compare { font-size: 14px; text-decoration: line-through; color: var(--muted); font-weight: 400; }
.pd-div { height: 1px; background: var(--border); margin: 1.5rem 0; }

.pd-lbl {
  font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  font-weight: 600; color: var(--black); margin-bottom: .85rem;
  display: flex; align-items: center; justify-content: space-between;
}
.pd-lbl-val { font-weight: 400; color: var(--stone); text-transform: none; letter-spacing: 0; font-size: 11px; }

/* Swatches */
.pd-swatches { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: 1.75rem; }
.pd-sw {
  width: 28px; height: 28px; border-radius: 50%; cursor: pointer;
  border: 1.5px solid transparent; outline: 2px solid transparent; outline-offset: 2px;
  transition: outline-color .2s, transform .15s; position: relative; overflow: hidden; flex-shrink: 0;
}
.pd-sw:hover { transform: scale(1.1); }
.pd-sw.active { outline-color: var(--black); }
.pd-sw.oos { opacity: .25; cursor: not-allowed; }
.pd-sw.oos::after { content: ''; position: absolute; top: 50%; left: 0; right: 0; height: 1px; background: rgba(0,0,0,.5); transform: rotate(-45deg); }
.pd-sw-l { position: absolute; left: 0; top: 0; bottom: 0; width: 50%; border-radius: 50% 0 0 50%; }
.pd-sw-r { position: absolute; right: 0; top: 0; bottom: 0; width: 50%; border-radius: 0 50% 50% 0; }
.pd-sw[data-h1="#ffffff"] { border-color: #ccc; }

/* Sizes */
.pd-sizes { display: flex; gap: .3rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.pd-sz {
  min-width: 50px; height: 44px; padding: 0 12px;
  border: 1px solid var(--border); background: var(--white);
  font-size: 11px; font-weight: 600; letter-spacing: .1em;
  font-family: var(--sans); color: var(--black); cursor: pointer;
  transition: background .12s, border-color .12s, color .12s; text-transform: uppercase;
}
.pd-sz:hover:not(.oos):not(.sel) { border-color: var(--black); }
.pd-sz.sel { background: var(--black); color: var(--white); border-color: var(--black); }
.pd-sz.oos { opacity: .28; cursor: not-allowed; text-decoration: line-through; }

.pd-stock { font-size: 10px; margin-bottom: 1.25rem; font-weight: 600; min-height: 14px; letter-spacing: .12em; text-transform: uppercase; }
.pd-stock.low  { color: #c0392b; }
.pd-stock.ok   { color: #27ae60; }
.pd-stock.none { color: #c0392b; }

/* ATC */
.pd-atc { display: flex; gap: 0; margin-bottom: 1.5rem; }
.pd-qty {
  width: 56px; border: 1px solid var(--black); border-right: none;
  text-align: center; font-size: 15px; font-family: var(--sans);
  font-weight: 500; color: var(--black); outline: none; background: var(--white); flex-shrink: 0;
}
.pd-btn {
  flex: 1; height: 52px; background: var(--black); color: var(--white);
  border: none; font-size: 10px; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; font-family: var(--sans); cursor: pointer; transition: background .2s;
}
.pd-btn:hover:not(:disabled) { background: #1c1c1c; }
.pd-btn:disabled { background: #bbb; cursor: not-allowed; color: rgba(255,255,255,.7); }

.pd-desc { font-size: 13px; line-height: 1.9; color: rgba(10,10,10,.5); margin: 0; }

.pd-ship { display: flex; flex-direction: column; gap: .6rem; }
.pd-ship-item { display: flex; align-items: center; gap: .65rem; font-size: 11px; color: var(--muted); }
.pd-ship-item svg { color: var(--stone); flex-shrink: 0; }

/* ── MOBILE GALLERY — swipe slider with thumbs ── */
.pd-slides-wrap { overflow: hidden; background: #f4f3f1; position: relative; }
.pd-slides {
  display: flex; transition: transform .35s cubic-bezier(.4,0,.2,1);
}
.pd-slide {
  flex-shrink: 0; width: 100%;
}
.pd-slide img { width: 100%; aspect-ratio: 1/1; object-fit: cover; object-position: center top; display: block; }
/* Arrow buttons */
.pd-slide-prev, .pd-slide-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; background: rgba(255,255,255,.85);
  border: none; font-size: 20px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 5; color: var(--black);
}
.pd-slide-prev { left: .75rem; }
.pd-slide-next { right: .75rem; }
/* Thumbnails row */
.pd-mobile-thumbs {
  display: flex; gap: 4px; padding: 6px 0; overflow-x: auto; scrollbar-width: none;
}
.pd-mobile-thumbs::-webkit-scrollbar { display: none; }
.pd-mobile-thumb {
  flex-shrink: 0; width: 56px; height: 68px;
  object-fit: cover; object-position: center top;
  border: 2px solid transparent; opacity: .5; cursor: pointer; transition: opacity .2s, border-color .2s;
}
.pd-mobile-thumb.active { border-color: var(--black); opacity: 1; }
/* Dots */
.pd-dots { display: flex; justify-content: center; gap: 5px; padding: 4px 0; }
.pd-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--border); transition: background .2s; }
.pd-dot.active { background: var(--black); }

@media(max-width:1100px) {
  .pd-inner { grid-template-columns: 48% 52%; }
}
@media(max-width:900px) {
  .pd-inner { grid-template-columns: 1fr; border-top: none; }
  .pd-gallery { display: none !important; }
  .pd-mobile-gallery { display: block !important; }
  .pd-info { position: static; max-height: none; padding: 2rem 1.5rem 4rem; }
}
@media(max-width:600px) {
  .pd { padding-top: 70px; }
  .pd-breadcrumb { padding: 1.25rem 1.5rem 0; font-size: 9px; }
  .pd-info { padding: 1.75rem 1.25rem 4rem; }
}
@media(min-width:901px) {
    .pd-mob-thumbs { display: none !important; }
  .pd-mob-arrow { display: none !important; }
}

/* ── MOBILE GALLERY ─────────────────────────────────────── */
.pd-mobile-gallery {
  display: none;
  position: relative;
  background: #f4f3f1;
  width: 100%;
}
.pd-mob-main {
  width: 100%; aspect-ratio: 3/4;
  object-fit: contain; object-position: center;
  display: block; background: #f4f3f1;
}
.pd-mob-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; background: rgba(255,255,255,.88);
  border: 1px solid rgba(0,0,0,.1); display: flex; align-items: center;
  justify-content: center; z-index: 10; cursor: pointer; font-size: 22px;
  color: var(--black); font-weight: 300;
}
.pd-mob-arrow-l { left: .75rem; }
.pd-mob-arrow-r { right: .75rem; }
.pd-mob-counter {
  position: absolute; bottom: .75rem; right: .75rem;
  background: rgba(0,0,0,.45); color: #fff;
  font-size: 10px; letter-spacing: .1em; padding: 3px 8px;
}
.pd-mob-thumbs {
  display: flex; gap: 5px; padding: .6rem .75rem;
  overflow-x: auto; scrollbar-width: none;
  border-bottom: 1px solid var(--border); background: var(--white);
}
.pd-mob-thumbs::-webkit-scrollbar { display: none; }
.pd-mob-thumb {
  width: 52px; height: 64px; flex-shrink: 0;
  object-fit: contain; background: #f4f3f1;
  border: 1.5px solid transparent; opacity: .5;
  cursor: pointer; transition: opacity .2s, border-color .2s;
}
.pd-mob-thumb.active { border-color: var(--black); opacity: 1; }

/* ── CONTACT PAGE (ct) ───────────────────────────────────── */
.ct-page { padding-top: 116px; background: var(--white); min-height: 100vh; }

/* Hero */
.ct-hero {
  display: grid; grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--border);
  max-width: 1300px; margin: 0 auto;
  padding: 5rem 2.5rem 4rem; gap: 4rem; align-items: end;
}
.ct-pre {
  font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; display: block; margin-bottom: 1.5rem;
}
.ct-headline {
  font-family: var(--serif); font-size: clamp(60px, 9vw, 110px);
  font-weight: 300; line-height: .88; color: var(--black);
  text-transform: uppercase; letter-spacing: .03em; margin-bottom: 2rem;
}
.ct-headline em { font-style: italic; color: var(--stone); }
.ct-subline { font-size: 13px; line-height: 2; color: var(--muted); max-width: 380px; }
.ct-hero-meta { display: flex; flex-direction: column; gap: 2rem; justify-content: flex-end; }
.ct-meta-label {
  font-size: 9px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--muted); display: block; margin-bottom: .4rem;
}
.ct-meta-val { font-size: 14px; color: var(--black); font-weight: 400; text-decoration: none; }
a.ct-meta-val:hover { color: var(--stone); }

/* Body grid */
.ct-body {
  display: grid; grid-template-columns: 1fr 1.5fr;
  max-width: 1300px; margin: 0 auto; padding: 0;
  border-bottom: 1px solid var(--border);
}
.ct-left { padding: 4rem 3rem 5rem 2.5rem; border-right: 1px solid var(--border); }
.ct-right { padding: 4rem 2.5rem 5rem 3.5rem; }

.ct-section-label {
  font-size: 9px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--muted); font-weight: 600; margin-bottom: 1.5rem;
  padding-bottom: .75rem; border-bottom: 1px solid var(--border);
}

/* Channels */
.ct-channels { margin-bottom: 3rem; }
.ct-channel {
  display: flex; align-items: flex-start; gap: 1rem;
  padding: 1.25rem 0; border-bottom: 1px solid var(--border);
}
.ct-channel:last-child { border-bottom: none; }
.ct-channel-icon {
  width: 36px; height: 36px; border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  color: var(--muted); flex-shrink: 0;
}
.ct-channel-name {
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
  font-weight: 600; color: var(--black); margin-bottom: .25rem;
}
.ct-channel-val { font-size: 12px; color: var(--muted); line-height: 1.7; text-decoration: none; }
a.ct-channel-val:hover { color: var(--black); }

/* Socials */
.ct-social {
  display: flex; align-items: center; gap: 1rem;
  padding: 1rem 0; border-bottom: 1px solid var(--border);
  text-decoration: none; transition: background .15s;
}
.ct-social:last-child { border-bottom: none; }
.ct-social-icon {
  width: 36px; height: 36px; border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  color: var(--black); flex-shrink: 0; transition: background .2s, color .2s;
}
.ct-social:hover .ct-social-icon { background: var(--black); color: var(--white); border-color: var(--black); }
.ct-social-name { font-size: 12px; font-weight: 500; color: var(--black); }
.ct-social-handle { font-size: 11px; color: var(--muted); }
.ct-social-arrow { margin-left: auto; color: var(--muted); opacity: 0; transition: opacity .2s, transform .2s; }
.ct-social:hover .ct-social-arrow { opacity: 1; transform: translateX(3px); }

/* Form */
.ct-form { display: flex; flex-direction: column; gap: 0; }
.ct-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
.ct-field { border-bottom: 1px solid var(--border); transition: border-color .2s; }
.ct-field:focus-within { border-color: var(--black); }
.ct-label {
  display: block; font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--muted); padding: 1.1rem 0 .3rem; font-weight: 500;
}
.ct-input {
  display: block; width: 100%; border: none; outline: none;
  background: transparent; font-size: 14px; font-family: var(--sans);
  color: var(--black); padding: .25rem 0 1.1rem; resize: none;
}
.ct-textarea { min-height: 130px; }
.ct-form-footer {
  display: flex; align-items: center; gap: 1.5rem; margin-top: 2.5rem;
}
.ct-submit {
  padding: 14px 48px; background: var(--black); color: var(--white); border: none;
  font-size: 10px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600;
  font-family: var(--sans); cursor: pointer; transition: background .2s, transform .15s;
}
.ct-submit:hover { background: #222; transform: translateY(-1px); }
.ct-submit-note { font-size: 11px; color: var(--muted); letter-spacing: .04em; }

/* Success */
.ct-success {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 3rem 0;
}
.ct-success-icon {
  width: 52px; height: 52px; border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  color: var(--black); margin-bottom: 1.5rem;
}
.ct-success-title { font-family: var(--serif); font-size: 28px; font-weight: 300; margin-bottom: .75rem; color: var(--black); }
.ct-success-body { font-size: 13px; color: var(--muted); line-height: 1.8; }

/* Responsive */
@media(max-width:1024px) {
  .ct-body { grid-template-columns: 1fr; }
  .ct-left { border-right: none; border-bottom: 1px solid var(--border); padding: 3rem 2.5rem; }
  .ct-right { padding: 3rem 2.5rem; }
}
@media(max-width:768px) {
  .ct-page { padding-top: 70px; }
  .ct-hero { grid-template-columns: 1fr; gap: 2.5rem; padding: 3.5rem 1.5rem 3rem; }
  .ct-hero-meta { flex-direction: row; flex-wrap: wrap; gap: 1.5rem; }
  .ct-left { padding: 2.5rem 1.5rem; }
  .ct-right { padding: 2.5rem 1.5rem; }
  .ct-form-row { grid-template-columns: 1fr; }
  .ct-form-footer { flex-direction: column; align-items: flex-start; }
  .ct-submit { width: 100%; text-align: center; }
}

/* ── HOMEPAGE (h-) ───────────────────────────────────────── */

/* Hero */
.h-hero {
  position: relative;
  height: 100vh; min-height: 600px;
  overflow: hidden;
  margin-top: 116px;
  display: flex; align-items: flex-end;
}
.h-hero-slides {
  position: absolute; inset: 0; z-index: 0;
}
.h-hero-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  filter: brightness(.72);
  opacity: 0;
  transition: opacity 2.2s cubic-bezier(.4,0,.2,1);
}
.h-hero-img.active { opacity: 1; }
.h-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(10,10,10,.7) 0%, rgba(10,10,10,.1) 60%, transparent 100%);
}
.h-hero-content {
  position: relative; z-index: 2;
  width: 100%;
  padding: 0 2.5rem 4rem;
  display: flex; flex-direction: column;
}
.h-pre {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: rgba(255,255,255,.4); font-weight: 500; margin-bottom: 1.5rem;
}
.h-title {
  font-family: var(--serif);
  font-size: clamp(80px, 14vw, 180px);
  font-weight: 300; line-height: .85;
  color: #fff; text-transform: uppercase;
  letter-spacing: .04em; margin-bottom: 3rem;
}
.h-title em { font-style: italic; color: var(--stone); }
.h-hero-foot {
  display: flex; align-items: flex-end;
  justify-content: space-between; gap: 2rem;
}
.h-cta {
  display: inline-block;
  padding: 14px 42px;
  background: var(--white); color: var(--black);
  font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  text-decoration: none; transition: background .2s, color .2s;
  flex-shrink: 0;
}
.h-cta:hover { background: var(--stone); color: var(--white); }
.h-tagline {
  font-family: var(--serif); font-size: clamp(14px,1.5vw,18px);
  font-weight: 300; font-style: italic;
  color: rgba(255,255,255,.4); line-height: 1.5; text-align: right;
}
.h-scroll-hint {
  position: absolute; right: 2.5rem; bottom: 4rem; z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: .5rem;
  font-size: 8px; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(255,255,255,.25);
}
.h-scroll-line {
  width: 1px; height: 50px;
  background: linear-gradient(to bottom, rgba(181,168,152,.6), transparent);
  animation: scrollPulse 2.2s ease-in-out infinite;
}

/* Marquee */
.h-marquee {
  padding: 1.25rem 0; overflow: hidden;
  background: var(--white);
  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
}
.h-marquee-track {
  display: flex; white-space: nowrap;
  animation: marquee 28s linear infinite;
  width: max-content;
}
.h-marquee-track:hover { animation-play-state: paused; }
.h-marquee-item {
  font-size: 11px; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(10,10,10,.3); padding: 0 2rem;
  display: inline-flex; align-items: center; gap: 2rem;
}
.h-marquee-sep { color: var(--stone); font-size: 14px; }

/* Strip */
.h-strip {
  display: grid; grid-template-columns: repeat(4,1fr);
  border-bottom: 1px solid var(--border);
}
.h-strip-item {
  padding: 2rem 2.5rem;
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column; gap: .5rem;
}
.h-strip-item:last-child { border-right: none; }
.h-strip-num {
  font-family: var(--serif); font-size: 11px;
  color: var(--stone); letter-spacing: .1em;
}
.h-strip-label {
  font-size: 12px; color: var(--black); letter-spacing: .04em;
}

/* Shared text */
.h-eyebrow {
  font-size: 9px; letter-spacing: .28em; text-transform: uppercase;
  color: var(--stone); font-weight: 500; display: block; margin-bottom: 1.25rem;
}
.h-heading {
  font-family: var(--serif); font-size: clamp(44px,6vw,80px);
  font-weight: 300; line-height: .92; color: var(--black);
  text-transform: uppercase; letter-spacing: .03em; margin-bottom: 2rem;
}
.h-heading-sm {
  font-family: var(--serif); font-size: clamp(32px,4vw,52px);
  font-weight: 300; color: var(--black); text-transform: uppercase;
  letter-spacing: .03em;
}
.h-body {
  font-size: 13px; line-height: 2.1; color: rgba(10,10,10,.5);
  margin-bottom: 2rem; max-width: 400px;
}
.h-link {
  font-size: 10px; letter-spacing: .2em; text-transform: uppercase;
  font-weight: 600; color: var(--black); text-decoration: none;
  border-bottom: 1px solid var(--black); padding-bottom: 2px;
  transition: color .2s, border-color .2s;
}
.h-link:hover { color: var(--stone); border-color: var(--stone); }

/* Editorial split */
.h-split {
  display: grid; grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--border);
}
.h-split-img {
  position: relative; overflow: hidden;
  background: var(--light-gray); min-height: 560px;
}
.h-split-img img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  display: block;
  transition: transform .8s cubic-bezier(.4,0,.2,1);
}
.h-split:hover .h-split-img img { transform: scale(1.03); }
.h-split-copy {
  padding: 5rem 5rem 5rem 6rem;
  display: flex; flex-direction: column; justify-content: center;
  border-left: 1px solid var(--border);
}

/* Collection */
.h-collection {
  padding: 4rem 2.5rem 0;
  border-bottom: 1px solid var(--border);
}
.h-collection-head {
  display: flex; justify-content: space-between; align-items: flex-end;
  margin-bottom: 2rem; padding-bottom: 2rem;
  border-bottom: 1px solid var(--border);
}
.h-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--border);
}
.h-card {
  background: var(--white); display: block;
  text-decoration: none; color: inherit;
  position: relative; overflow: hidden;
}
.h-card-img {
  position: relative; overflow: hidden;
  background: var(--light-gray);
  height: 520px;
}
.h-card-img img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  transition: transform .9s cubic-bezier(.4,0,.2,1), filter .6s;
  filter: brightness(.94) saturate(.88);
}
.h-card:hover .h-card-img img { transform: scale(1.05); filter: brightness(1) saturate(1); }
/* Overlay — same as shop, text bottom-left */
.h-card-overlay {
  position: absolute; inset: 0;
  background: rgba(10,10,10,0);
  transition: background .4s;
  display: flex; align-items: flex-end; padding: 1.5rem; z-index: 1;
}
.h-card:hover .h-card-overlay { background: rgba(10,10,10,.28); }
.h-card-overlay span {
  font-size: 9px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--white); font-weight: 600;
  padding: 10px 24px; border: 1px solid rgba(255,255,255,.45);
  opacity: 0; transform: translateY(10px);
  transition: opacity .3s .05s, transform .3s .05s; white-space: nowrap;
}
.h-card:hover .h-card-overlay span { opacity: 1; transform: translateY(0); }
/* Stone bottom line on hover — same as shop */
.h-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 2px; background: var(--stone);
  transform: scaleX(0); transform-origin: left;
  transition: transform .45s cubic-bezier(.4,0,.2,1); z-index: 2;
}
.h-card:hover::after { transform: scaleX(1); }
.h-card-info {
  padding: 1.1rem 1.25rem 1.4rem;
  border-top: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
}
.h-card-name {
  font-family: var(--serif); font-size: 16px; font-weight: 400; color: var(--black); line-height: 1.25;
}
.h-card-price { font-size: 14px; font-weight: 500; color: var(--black); text-align: right; flex-shrink: 0; }
.h-card-was { font-size: 11px; text-decoration: line-through; color: var(--muted); display: block; }

/* Manifesto */
.h-manifesto {
  padding: 9rem 2.5rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
.h-manifesto-inner { max-width: 760px; margin: 0 auto; }
.h-manifesto-quote {
  font-family: var(--serif);
  font-size: clamp(36px, 5.5vw, 68px);
  font-weight: 300; font-style: italic;
  line-height: 1.15; color: var(--black);
  letter-spacing: .02em; margin: 1.5rem 0 2rem;
}
.h-manifesto-quote em { color: var(--stone); font-style: normal; }

/* Bottom CTA */
.h-cta-strip {
  padding: 8rem 2.5rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
.h-cta-strip-inner { max-width: 600px; margin: 0 auto; }
.h-cta-title {
  font-family: var(--serif);
  font-size: clamp(36px,5vw,60px);
  font-weight: 300; line-height: 1.1;
  color: var(--black); text-transform: uppercase;
  letter-spacing: .03em; margin-bottom: 2.5rem;
}

/* ── HOMEPAGE RESPONSIVE ─────────────────────────────────── */
@media(max-width:1024px) {
  .h-split { grid-template-columns: 1fr; }
  .h-split-img { min-height: 50vw; }
  .h-split-copy { padding: 4rem 2.5rem; border-left: none; border-top: 1px solid var(--border); }
  .h-strip { grid-template-columns: 1fr 1fr; }
  .h-strip-item:nth-child(2) { border-right: none; }
  .h-strip-item:nth-child(3) { border-top: 1px solid var(--border); }
  .h-strip-item:nth-child(4) { border-top: 1px solid var(--border); border-right: none; }
  .h-grid { grid-template-columns: 1fr 1fr; }
  .h-card-img { height: 380px; }
}
@media(max-width:768px) {
  .h-hero { margin-top: 70px; }
  .h-hero-content { padding: 0 1.5rem 3rem; }
  .h-hero-foot { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
  .h-tagline { text-align: left; }
  .h-scroll-hint { display: none; }
  .h-collection { padding: 3rem 1.5rem 0; }
  .h-collection-head { flex-direction: column; align-items: flex-start; gap: 1rem; }
  .h-manifesto { padding: 6rem 1.5rem; }
  .h-cta-strip { padding: 5rem 1.5rem; }
  .h-strip { grid-template-columns: 1fr 1fr; }
}
@media(max-width:600px) {
  .h-grid { grid-template-columns: 1fr 1fr; grid-auto-flow: dense; }
  .h-card-img { height: 260px; }
  .h-card:nth-child(1) { grid-column: span 2; }
  .h-card:nth-child(1) .h-card-img { height: 320px; }
  .h-split-img { min-height: 70vw; }
  .h-strip { grid-template-columns: 1fr; }
  .h-strip-item { border-right: none; border-bottom: 1px solid var(--border); padding: 1.5rem; }
  .h-strip-item:last-child { border-bottom: none; }
  .h-strip-item:nth-child(3),.h-strip-item:nth-child(4) { border-top: none; }
}
/* ── HOMEPAGE DIVIDER TITLE (between the two lookbook splits) ── */
.h-divider-title {
  padding: 6rem 2.5rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
  background: var(--white);
}
.h-divider-text {
  font-family: var(--serif);
  font-size: clamp(56px, 9vw, 130px);
  font-weight: 300; line-height: 1;
  color: var(--black);
  text-transform: uppercase;
  letter-spacing: .04em;
}
@media(max-width:768px) {
  .h-divider-title { padding: 4rem 1.5rem; }
}



/* ── CHECKOUT MOBILE OVERFLOW FIX ─────────────────────────── */
@media (max-width: 768px) {
  .checkout-layout {
    grid-template-columns: 1fr !important;
    padding: 2rem 1.25rem 4rem !important;
    gap: 2rem !important;
    max-width: 100% !important;
    overflow-x: hidden;
  }
  .order-summary-sidebar {
    position: static !important;
  }
}
@media (max-width: 600px) {
  body { overflow-x: hidden; }
  .checkout-layout { padding: 1.5rem 1rem 3rem !important; }
  /* Phone code + number row must wrap on very narrow screens */
  .checkout-section [style*="flex:0 0 140px"],
  .checkout-section select[name="phone_code"] {
    flex: 1 1 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .checkout-section div[style*="display:flex"][style*="gap:.5rem"] {
    flex-wrap: wrap !important;
  }
  .checkout-section input[name="phone"] {
    flex: 1 1 100% !important;
    min-width: 0 !important;
  }
  /* Saved address cards must not overflow */
  .checkout-section label[style*="border"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ── PREVENT iOS AUTO-ZOOM ON INPUT FOCUS (site-wide safety net) ── */
@media (max-width: 768px) {
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  input[type="number"],
  input[type="search"],
  textarea,
  select {
    font-size: 16px !important;
  }
}

/* ── GOOGLE SIGN-IN BUTTON ───────────────────────────────── */
.google-btn {
  display: flex; align-items: center; justify-content: center; gap: .75rem;
  width: 100%; padding: 13px;
  background: var(--white); border: 1px solid var(--border);
  font-size: 13px; font-weight: 500; color: var(--black);
  text-decoration: none; transition: border-color .2s, background .2s;
}
.google-btn:hover { border-color: rgba(0,0,0,.3); background: #fafafa; }
.auth-divider {
  display: flex; align-items: center; gap: 1rem;
  margin: 1.5rem 0; color: var(--muted); font-size: 11px;
  text-transform: uppercase; letter-spacing: .08em;
}
.auth-divider::before, .auth-divider::after {
  content: ''; flex: 1; height: 1px; background: var(--border);
}

/* ── MANIFESTO QUOTE — DIVIDER VARIANT (shorter, used between hero and content) ── */
.h-manifesto--divider {
  padding: 1.5rem 2rem;
}
.h-manifesto--divider .h-manifesto-quote {
  font-size: clamp(28px, 4vw, 48px);
  margin: 0;
}
.h-manifesto-quote--bold {
  font-weight: 500;
  font-style: italic;
}
.h-manifesto-quote--bold em {
  font-weight: 500;
  font-style: italic;
}
@media(max-width:768px) {
  .h-manifesto--divider { padding: 1.25rem 1.5rem; }
}