/* =====================================================================
   CRAFTED PLEASURE — theme.css
   Ported from static prototype. Swap Google Font imports for
   licensed Gilroy/Shakila Script WOFF2s before launch.
   ===================================================================== */

/* ── Design Tokens ────────────────────────────────────────────────── */
:root {
  --cream:      #F6F1E8;
  --ink:        #141210;
  --pink:       #E2174F;
  --card-white: #FFFDF8;
  --body-gray:  #56504A;
  --muted:      #6B6359;
  --hairline:   #D9CFBE;
  --pink-tint:  #FDEEF2;
  --success:    #1F8A5B;
  --disabled:   #B9B0A3;

  --wood-maple:  #E6D3AC;
  --wood-cherry: #B06E3E;
  --wood-walnut: #6E4B32;
  --wood-oak:    #41332B;

  --leather-black:   #1C1A19;
  --leather-cognac:  #9A5B2E;
  --leather-oxblood: #5A2026;

  --engrave-wood-bg:  #C89B66;
  --engrave-wood-ink: #4A2F18;
  --engrave-foil-ink: #E8DCC8;

  --font-display: 'Urbanist', Arial, Helvetica, sans-serif;
  --font-script:  'Caveat', cursive;
  --font-mono:    'IBM Plex Mono', 'Courier New', monospace;
  --font-body:    'Urbanist', Arial, Helvetica, sans-serif;

  --px: clamp(20px, 5vw, 56px);
  --py: clamp(32px, 5vw, 64px);

  --border:      2px solid var(--ink);
  --border-thin: 1px solid var(--hairline);
  --border-pink: 2px solid var(--pink);
}

/* ── Reset ────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.7;
  min-height: 100vh;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
input, select, textarea { font-family: inherit; font-size: inherit; }
ul, ol { list-style: none; }

/* ── Typography ──────────────────────────────────────────────────── */
.t-display { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; letter-spacing: -0.01em; line-height: 0.98; }
.t-script  { font-family: var(--font-script); font-weight: 700; color: var(--pink); }
.t-mono    { font-family: var(--font-mono); font-weight: 500; text-transform: uppercase; letter-spacing: 0.08em; }
.t-mono-sm { font-size: 11px; letter-spacing: 0.1em; }
.t-body    { color: var(--body-gray); line-height: 1.75; }
.t-pink    { color: var(--pink); }
.t-muted   { color: var(--muted); }

h1 { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; }
h2 { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; }
h3 { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.divider  { height: 2px; background: var(--ink); }
.hidden   { display: none !important; }

/* ── Buttons ─────────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 800; font-size: clamp(13px,1.5vw,15px);
  text-transform: uppercase; letter-spacing: 0.06em;
  padding: 16px 32px; min-height: 52px; border: var(--border);
  cursor: pointer; text-decoration: none; white-space: nowrap;
}
.btn-ink  { background: var(--ink); color: var(--cream); }
.btn-pink { background: var(--pink); color: var(--cream); border-color: var(--pink); }
.btn-outline { background: transparent; color: var(--ink); }
.btn-sm { padding: 10px 20px; min-height: 44px; font-size: 13px; }
.btn:hover { opacity: 0.92; }
.btn-pink-link {
  background: none; border: none; padding: 0;
  font-family: var(--font-display); font-weight: 700; font-size: 13px;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--pink);
  text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 2px;
  cursor: pointer; min-height: 44px; display: inline-flex; align-items: center;
}

/* ── Section layout ──────────────────────────────────────────────── */
.section { padding: var(--py) var(--px); }
.section-ink  { background: var(--ink); color: var(--cream); }
.section-pink { background: var(--pink); color: var(--cream); }
.section-kicker {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--muted); margin-bottom: 16px;
}
.section-ink .section-kicker { color: var(--hairline); }
.section-title { font-size: clamp(32px,4.5vw,46px); margin-bottom: 20px; }

/* ── Age Gate ────────────────────────────────────────────────────── */
#age-gate {
  position: fixed; inset: 0; background: rgba(20,18,16,0.92);
  z-index: 9999; display: flex; align-items: center; justify-content: center; padding: var(--px);
}
.age-gate__card {
  background: var(--cream); border: var(--border);
  max-width: 520px; width: 100%; padding: clamp(32px,6vw,56px); text-align: center;
}
.age-gate__logo  { margin: 0 auto 24px; height: 48px; object-fit: contain; }
.age-gate__script { font-size: 28px; margin-bottom: 16px; display: block; }
.age-gate__title  { font-size: clamp(22px,4vw,30px); margin-bottom: 12px; }
.age-gate__body   { color: var(--body-gray); font-size: 14px; margin-bottom: 28px; }
.age-gate__confirm { width: 100%; margin-bottom: 16px; }
.age-gate__leave  { display: block; font-size: 13px; color: var(--muted); text-decoration: none; margin-bottom: 20px; }
.age-gate__leave:hover { text-decoration: underline; }
.age-gate__note   { font-size: 10px; letter-spacing: 0.08em; color: var(--muted); text-transform: uppercase; }

/* ── Navigation ──────────────────────────────────────────────────── */
.site-nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px var(--px); border-bottom: var(--border); background: var(--cream);
  position: sticky; top: 0; z-index: 100;
}
.site-nav__logo img { height: 36px; width: auto; }
.site-nav__links    { display: flex; gap: clamp(16px,2.5vw,32px); align-items: center; }
.site-nav__link     { font-family: var(--font-display); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none; color: var(--ink); }
.site-nav__link:hover { color: var(--pink); }
.site-nav__right    { display: flex; align-items: center; gap: 16px; }
.site-nav__cart     { font-family: var(--font-display); font-weight: 800; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; background: var(--pink); color: var(--cream); border: 2px solid var(--pink); padding: 8px 16px; min-height: 40px; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.site-nav__cart:hover { opacity: 0.9; }
.nav-cart-count { font-weight: 900; }
.site-nav--slim .site-nav__links { display: none; }

/* ── Breadcrumb ──────────────────────────────────────────────────── */
.breadcrumb { display: flex; align-items: center; gap: 8px; padding: 12px var(--px); border-bottom: var(--border-thin); font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
.breadcrumb a { text-decoration: none; color: var(--muted); }
.breadcrumb a:hover { color: var(--pink); }
.breadcrumb__sep { color: var(--muted); }
.breadcrumb__current { color: var(--ink); }

/* ── Marquee ─────────────────────────────────────────────────────── */
.marquee-band  { background: var(--pink); overflow: hidden; border-bottom: var(--border); }
.marquee-track {
  display: inline-block; white-space: nowrap; animation: marquee 36s linear infinite;
  font-family: var(--font-display); font-weight: 800; font-size: clamp(15px,2vw,20px);
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--cream); padding: 13px 0;
}
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── Hero ────────────────────────────────────────────────────────── */
.hero { padding: var(--py) var(--px); display: flex; gap: clamp(32px,4vw,64px); align-items: flex-start; flex-wrap: wrap; border-bottom: var(--border); }
.hero__left   { flex: 2; min-width: min(100%,360px); }
.hero__right  { flex: 1; min-width: min(100%,280px); }
.hero__kicker { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--muted); text-transform: uppercase; margin-bottom: 20px; }
.hero__headline { font-size: clamp(50px,8.5vw,104px); line-height: 0.95; margin-bottom: 24px; }
.hero__headline-pink { color: var(--pink); display: block; }
.hero__script  { font-size: clamp(28px,4vw,48px); display: inline-block; transform: rotate(-5deg); margin-left: 8px; vertical-align: top; }
.hero__actions { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.hero__img-wrap { position: relative; }
.hero__img     { width: 100%; aspect-ratio: 4/5; object-fit: cover; border: var(--border); }
.hero__img-cap { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-top: 8px; }

/* ── Product Grid ────────────────────────────────────────────────── */
.product-grid { padding: var(--py) var(--px); border-bottom: var(--border); }
.product-grid__inner { background: var(--ink); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: 2px; }
.product-tile { background: var(--cream); padding: clamp(20px,3vw,32px); display: flex; flex-direction: column; gap: 16px; }
.product-tile__header { display: flex; justify-content: space-between; align-items: flex-start; }
.product-tile__idx   { font-size: clamp(48px,6vw,72px); font-family: var(--font-display); font-weight: 900; color: var(--pink); line-height: 1; }
.product-tile__price { font-family: var(--font-display); font-weight: 800; font-size: 20px; color: var(--pink); }
.product-tile__img   { width: 100%; aspect-ratio: 4/5; object-fit: cover; border: var(--border); }
.product-tile__name  { font-size: clamp(18px,2.5vw,24px); margin-bottom: 4px; }
.product-tile__script { font-size: 22px; display: block; margin-bottom: 8px; }
.product-tile__specs { border-top: var(--border); }
.product-tile__spec-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: var(--border-thin); font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
.product-tile__spec-val { color: var(--body-gray); text-transform: none; }
.product-tile__actions { display: flex; flex-direction: column; gap: 10px; margin-top: auto; }
.product-tile--custom  { background: repeating-linear-gradient(-45deg, var(--cream) 0 12px, #EFE7D8 12px 24px); }
.product-tile__dashed  { border: 2px dashed var(--ink); padding: clamp(16px,3vw,28px); display: flex; flex-direction: column; gap: 12px; height: 100%; }
.product-tile__custom-script { font-size: 36px; }
.product-tile__custom-steps  { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--muted); }

/* ── Engraving Section ───────────────────────────────────────────── */
.engraving-section { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,340px),1fr)); border-bottom: var(--border); }
.engraving-section__text { padding: var(--py) var(--px); border-right: var(--border); display: flex; flex-direction: column; gap: 16px; }
.engraving-section__preview { background: var(--engrave-wood-bg); background-image: repeating-linear-gradient(90deg, rgba(74,47,24,0.04) 0 1px, transparent 1px 8px); padding: var(--py) var(--px); display: flex; align-items: center; justify-content: center; min-height: 240px; }
.engraving-section__preview-text { font-family: var(--font-script); font-size: clamp(32px,5vw,56px); color: var(--engrave-wood-ink); text-align: center; word-break: break-all; }
.engraving-input-wrap { position: relative; }
.engraving-input { width: 100%; border: var(--border); background: var(--card-white); padding: 14px 16px; font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.04em; outline: none; }
.engraving-input:focus { border-color: var(--pink); }
.engraving-counter { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-top: 8px; }

/* ── Materials ───────────────────────────────────────────────────── */
.materials-section { padding: var(--py) var(--px); border-bottom: var(--border); }
.materials-section__header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 24px; flex-wrap: wrap; gap: 8px; }
.materials-section__grid   { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,260px),1fr)); gap: 32px; }
.materials-section__col-title { font-size: 18px; margin-bottom: 12px; border-bottom: var(--border); padding-bottom: 10px; }
.material-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: var(--border-thin); }
.material-row__swatch { width: 16px; height: 16px; border: var(--border); flex-shrink: 0; }
.material-row__name   { font-weight: 700; font-size: 14px; flex: 1; }
.material-row__note   { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; color: var(--muted); text-transform: uppercase; }

/* ── Custom Band ─────────────────────────────────────────────────── */
.custom-band { padding: var(--py) var(--px); border-bottom: var(--border); }
.custom-band__inner { background: var(--pink); padding: clamp(32px,5vw,56px); display: flex; flex-direction: column; gap: 20px; }
.custom-band__script { font-size: clamp(28px,4vw,42px); display: inline-block; transform: rotate(-3deg); color: var(--cream); margin-left: 8px; }
.custom-band__body   { color: var(--cream); opacity: 0.9; max-width: 56ch; }
.custom-band__actions { display: flex; gap: 16px; flex-wrap: wrap; }
.custom-band__btn-outline { background: transparent; color: var(--cream); border: 2px solid var(--cream); }

/* ── Workshop Strip ──────────────────────────────────────────────── */
.workshop-strip { display: grid; grid-template-columns: 1fr 1fr; border-bottom: var(--border); background: var(--ink); gap: 2px; }
.workshop-strip__img  { width: 100%; height: 100%; object-fit: cover; display: block; }
.workshop-strip__text { padding: var(--py) var(--px); color: var(--cream); background: var(--ink); display: flex; flex-direction: column; gap: 16px; }
.workshop-strip__kicker { color: var(--hairline); }
.workshop-strip__badges { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.workshop-strip__badge  { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; border: 1px solid var(--hairline); padding: 5px 10px; color: var(--hairline); }
@media (max-width: 600px) { .workshop-strip { grid-template-columns: 1fr; } }

/* ── Footer ──────────────────────────────────────────────────────── */
.site-footer { background: var(--ink); color: var(--cream); padding: var(--py) var(--px); border-top: var(--border); }
.site-footer__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; flex-wrap: wrap; margin-bottom: 32px; }
.site-footer__title  { font-size: clamp(24px,3.5vw,36px); margin-bottom: 4px; }
.site-footer__script { font-size: 26px; margin-bottom: 16px; display: block; color: var(--cream); opacity: 0.7; }
.footer-form { display: flex; max-width: 400px; width: 100%; }
.footer-form__input { flex: 1; background: transparent; border: 2px solid var(--cream); border-right: none; padding: 12px 16px; color: var(--cream); font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; outline: none; }
.footer-form__input::placeholder { color: rgba(246,241,232,0.5); }
.footer-form__input:focus { border-color: var(--pink); }
.footer-form__btn  { background: var(--pink); color: var(--cream); border: 2px solid var(--pink); padding: 12px 20px; font-family: var(--font-display); font-weight: 800; font-size: 13px; letter-spacing: 0.06em; cursor: pointer; text-transform: uppercase; white-space: nowrap; }
.site-footer__bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; border-top: 1px solid rgba(246,241,232,0.15); padding-top: 20px; }
.footer-legal { display: flex; gap: 16px; flex-wrap: wrap; }
.footer-legal a { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--hairline); text-decoration: none; }
.footer-legal a:hover { color: var(--cream); }
.footer-copyright { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; color: var(--hairline); text-transform: uppercase; }

/* ── Product Page ────────────────────────────────────────────────── */
.product-page { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--ink); border-bottom: var(--border); }
@media (max-width: 720px) { .product-page { grid-template-columns: 1fr; } }
.product-gallery { padding: var(--py) var(--px); background: var(--cream); }
.product-gallery__main   { width: 100%; aspect-ratio: 4/5; max-height: 620px; object-fit: cover; border: var(--border); display: block; }
.product-gallery__thumbs { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.product-gallery__thumb  { width: 80px; height: 80px; object-fit: cover; border: 2px solid var(--ink); cursor: pointer; flex-shrink: 0; }
.product-gallery__thumb.active { border-color: var(--pink); border-width: 3px; }
.product-gallery__note   { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin-top: 12px; }

.product-config { padding: var(--py) var(--px); background: var(--cream); display: flex; flex-direction: column; gap: 24px; }
.product-config__name { font-size: clamp(24px,3.5vw,36px); margin-bottom: 4px; }
.product-config__tag  { font-size: 22px; }
.product-config__desc { color: var(--body-gray); font-size: 14px; line-height: 1.7; }

/* Configurator controls */
.config-group { display: flex; flex-direction: column; gap: 10px; }
.config-group__label    { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; }
.config-group__selected { color: var(--pink); }
.swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.swatch { width: 52px; height: 52px; border: 2px solid var(--ink); cursor: pointer; flex-shrink: 0; }
.swatch.active { border: 3px solid var(--pink); }
.finish-options { display: flex; flex-direction: column; gap: 4px; }
.finish-option { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 2px solid var(--ink); cursor: pointer; background: var(--cream); }
.finish-option.active { border-color: var(--pink); background: var(--pink-tint); }
.finish-option__left  { flex: 1; }
.finish-option__name  { font-weight: 700; font-size: 14px; margin-bottom: 3px; }
.finish-option__note  { color: var(--body-gray); font-size: 12px; }
.finish-option__price { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.06em; flex-shrink: 0; }

.engraving-block { border: var(--border); padding: 16px; background: var(--card-white); }
.engraving-block__title { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 10px; }
.engraving-block__input { width: 100%; border: var(--border); background: var(--cream); padding: 12px 14px; font-family: var(--font-mono); font-size: 14px; outline: none; }
.engraving-block__input:focus { border-color: var(--pink); }
.engraving-preview { margin-top: 12px; padding: 16px; border: var(--border); min-height: 72px; display: flex; align-items: center; justify-content: center; font-family: var(--font-script); font-size: clamp(22px,3vw,32px); text-align: center; word-break: break-all; }

.price-row  { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.price-total { font-family: var(--font-display); font-weight: 900; font-size: clamp(32px,4.5vw,42px); color: var(--pink); }
.price-note  { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }
.product-specs { border-top: var(--border); margin-top: 8px; }
.spec-row     { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: var(--border-thin); }
.spec-row__key { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
.spec-row__val { color: var(--body-gray); font-size: 14px; }
.product-info-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,240px),1fr)); border-top: var(--border); }
.product-info-col   { padding: var(--py) var(--px); border-right: var(--border); }
.product-info-col:last-child { border-right: none; }
.product-info-col__title { font-size: 16px; margin-bottom: 10px; }
.product-info-col__body  { color: var(--body-gray); font-size: 14px; line-height: 1.7; }

/* ── Cart ────────────────────────────────────────────────────────── */
.cart-page { padding: var(--py) var(--px); }
.cart-page__layout { display: grid; grid-template-columns: 1fr 340px; gap: 32px; align-items: start; }
@media (max-width: 800px) { .cart-page__layout { grid-template-columns: 1fr; } }
.cart-title        { font-size: clamp(28px,5vw,48px); margin-bottom: 4px; }
.cart-title-script { font-size: 28px; margin-bottom: 24px; display: block; }
.cart-item { display: flex; gap: 20px; padding: 20px; border: var(--border); background: var(--card-white); margin-bottom: 8px; align-items: flex-start; }
.cart-item__img    { width: 120px; height: 120px; object-fit: cover; border: var(--border); flex-shrink: 0; }
.cart-item__info   { flex: 1; }
.cart-item__name   { font-size: 16px; margin-bottom: 6px; }
.cart-item__detail { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; color: var(--muted); text-transform: uppercase; margin-bottom: 4px; }
.cart-item__engraving { display: inline-flex; align-items: center; gap: 6px; border: var(--border-pink); padding: 4px 10px; background: var(--pink-tint); margin-bottom: 8px; }
.cart-item__engraving-text { font-family: var(--font-script); font-size: 18px; color: var(--pink); }
.cart-item__price  { font-size: 18px; font-weight: 800; }
.cart-item__remove { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; background: none; border: none; cursor: pointer; color: var(--muted); padding: 0; text-decoration: underline; margin-top: 8px; display: block; }
.cart-item__remove:hover { color: var(--pink); }
.cart-empty { border: 2px dashed var(--ink); padding: clamp(32px,6vw,64px); text-align: center; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.cart-empty__script { font-size: 36px; }
.cart-summary { border: var(--border); padding: 24px; background: var(--card-white); display: flex; flex-direction: column; gap: 12px; position: sticky; top: 80px; }
.cart-summary__title { font-size: 18px; margin-bottom: 4px; border-bottom: var(--border); padding-bottom: 12px; }
.summary-row { display: flex; justify-content: space-between; align-items: center; font-size: 14px; }
.summary-row--total { font-family: var(--font-display); font-weight: 900; font-size: 20px; border-top: var(--border); padding-top: 12px; margin-top: 4px; }
.summary-trust { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }

/* ── Checkout ────────────────────────────────────────────────────── */
.checkout-page { padding: var(--py) var(--px); }
.checkout-confirm { text-align: center; padding: var(--py) 0; }
.checkout-confirm__script { font-size: clamp(36px,5vw,54px); margin-bottom: 12px; display: block; }
.checkout-confirm__title  { font-size: clamp(24px,4vw,36px); margin-bottom: 16px; }
.checkout-confirm__body   { color: var(--body-gray); max-width: 50ch; margin: 0 auto 24px; }
.order-number-chip { display: inline-flex; align-items: center; gap: 8px; border: var(--border); padding: 10px 20px; font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; background: var(--card-white); margin: 16px auto; }
.order-number-chip__label { color: var(--muted); font-size: 11px; }
.order-number-chip__val   { font-weight: 700; color: var(--ink); font-size: 15px; }

/* ── Massanfertigung ─────────────────────────────────────────────── */
.custom-hero { padding: var(--py) var(--px); border-bottom: var(--border); }
.custom-hero__kicker   { margin-bottom: 16px; }
.custom-hero__headline { font-size: clamp(36px,6vw,64px); margin-bottom: 12px; }
.custom-hero__body     { color: var(--body-gray); max-width: 60ch; }
.paths-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); gap: 2px; background: var(--ink); border-bottom: var(--border); }
.path-card  { background: var(--cream); padding: var(--py) var(--px); display: flex; flex-direction: column; gap: 12px; }
.path-card__price { font-size: clamp(28px,4vw,40px); color: var(--pink); }
.path-card__steps { font-size: 11px; letter-spacing: 0.1em; color: var(--muted); }
.path-card__title { font-size: clamp(20px,3vw,28px); }
.path-card__body  { color: var(--body-gray); font-size: 14px; line-height: 1.7; }
.process-section  { padding: var(--py) var(--px); border-bottom: var(--border); }
.process-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,220px),1fr)); gap: 24px; margin-top: 24px; }
.process-step__num   { font-family: var(--font-script); font-size: 36px; color: var(--pink); margin-bottom: 4px; }
.process-step__title { font-size: 16px; margin-bottom: 8px; }
.process-step__body  { color: var(--body-gray); font-size: 13px; line-height: 1.7; }
.lists-section { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); gap: 2px; background: var(--ink); border-bottom: var(--border); }
.list-col       { background: var(--cream); padding: var(--py) var(--px); }
.list-col__title { font-size: clamp(20px,3vw,26px); margin-bottom: 20px; }
.list-item { display: flex; gap: 10px; padding: 10px 0; border-bottom: var(--border-thin); font-size: 14px; color: var(--body-gray); line-height: 1.6; }
.list-item::before { content: "+"; color: var(--pink); font-weight: 900; flex-shrink: 0; margin-top: 1px; }
.list-item--arrow::before { content: "→"; }
.cta-band { background: var(--ink); color: var(--cream); padding: var(--py) var(--px); display: flex; flex-direction: column; gap: 16px; border-bottom: var(--border); }
.cta-band__title { font-size: clamp(28px,4vw,44px); }
.cta-band__body  { color: rgba(246,241,232,0.8); max-width: 60ch; }

/* ── Über uns ─────────────────────────────────────────────────────── */
.about-hero { padding: var(--py) var(--px); border-bottom: var(--border); }
.about-hero__kicker   { margin-bottom: 12px; }
.about-hero__headline { font-size: clamp(32px,5.5vw,64px); margin-bottom: 16px; }
.about-hero__body     { color: var(--body-gray); max-width: 60ch; }
.photo-band { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; background: var(--ink); border-bottom: var(--border); overflow: hidden; }
.photo-band__img { width: 100%; aspect-ratio: 4/5; object-fit: cover; display: block; }
@media (max-width: 600px) { .photo-band { grid-template-columns: 1fr; } }
.story-section { display: grid; grid-template-columns: 1fr 2fr; gap: 2px; background: var(--ink); border-bottom: var(--border); }
@media (max-width: 700px) { .story-section { grid-template-columns: 1fr; } }
.story-section__sidebar { padding: var(--py) var(--px); background: var(--cream); border-right: var(--border); }
.story-section__content { padding: var(--py) var(--px); background: var(--cream); }
.story-section__p { color: var(--body-gray); font-size: 15px; line-height: 1.8; margin-bottom: 16px; }
.values-section { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,240px),1fr)); gap: 2px; background: var(--ink); border-bottom: var(--border); }
.value-card { background: var(--cream); padding: var(--py) var(--px); }
.value-card__num   { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 8px; }
.value-card__title { font-size: clamp(18px,2.5vw,24px); margin-bottom: 10px; }
.value-card__body  { color: var(--body-gray); font-size: 14px; line-height: 1.7; }

/* ── Legal Hub ───────────────────────────────────────────────────── */
.legal-layout { display: grid; grid-template-columns: 200px 1fr; border-bottom: var(--border); min-height: 600px; }
@media (max-width: 680px) { .legal-layout { grid-template-columns: 1fr; } }
.legal-tabs { border-right: var(--border); background: var(--cream); position: sticky; top: 0; align-self: start; }
.legal-tab { display: block; padding: 16px 20px; font-family: var(--font-display); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.04em; text-decoration: none; border-bottom: var(--border-thin); color: var(--ink); cursor: pointer; background: none; width: 100%; text-align: left; }
.legal-tab:hover { background: var(--pink-tint); }
.legal-tab.active { background: var(--pink); color: var(--cream); }
.legal-content { padding: var(--py) var(--px); background: var(--cream); }
.legal-notice  { background: var(--pink-tint); border: var(--border-pink); padding: 14px 18px; font-size: 13px; color: var(--body-gray); margin-bottom: 28px; line-height: 1.6; }
.legal-title   { font-size: clamp(24px,3.5vw,36px); margin-bottom: 4px; }
.legal-kicker  { margin-bottom: 20px; }
.legal-section { margin-bottom: 28px; }
.legal-section__h { font-size: 16px; margin-bottom: 8px; border-bottom: var(--border-thin); padding-bottom: 6px; }
.legal-section__p { color: var(--body-gray); font-size: 14px; line-height: 1.8; white-space: pre-wrap; }

/* ── 404 ──────────────────────────────────────────────────────────── */
.not-found { padding: var(--py) var(--px); text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 60vh; gap: 12px; }
.not-found__number  { font-size: clamp(120px,22vw,260px); font-family: var(--font-display); font-weight: 900; color: var(--pink); line-height: 1; }
.not-found__script  { font-size: clamp(28px,4vw,42px); transform: rotate(-5deg); display: inline-block; }
.not-found__title   { font-size: clamp(20px,3vw,30px); margin-top: -8px; }
.not-found__body    { color: var(--body-gray); max-width: 40ch; }
.not-found__actions { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }

/* ── Font Picker ─────────────────────────────────────────────────── */
.font-picker {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
  margin-bottom: 12px;
}
.font-option {
  border: 2px solid var(--ink);
  background: var(--card-white);
  padding: 8px 14px;
  font-size: 18px;
  cursor: pointer;
  color: var(--ink);
  line-height: 1.2;
  transition: none;
}
.font-option.active {
  border-color: var(--pink);
  background: var(--pink-tint);
  color: var(--ink);
}
.font-option:hover { border-color: var(--pink); }

/* ── WooCommerce overrides ────────────────────────────────────────── */

/* Reset WC default page wrappers */
.woocommerce-page .site-main,
.cp-wc-main { display: block; }

/* WC notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border: var(--border) !important;
  border-left: 4px solid var(--pink) !important;
  background: var(--card-white) !important;
  color: var(--ink) !important;
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0.06em !important;
  padding: 14px 18px !important;
  margin: 16px var(--px) !important;
  list-style: none !important;
  border-radius: 0 !important;
}
.woocommerce-message a.button,
.woocommerce-info a.button    { color: var(--pink) !important; font-weight: 700; text-decoration: underline; background: none !important; border: none !important; padding: 0 !important; }

/* WC add-to-cart button on product page */
.single_add_to_cart_button.button {
  background: var(--pink) !important;
  color: var(--cream) !important;
  border: 2px solid var(--pink) !important;
  border-radius: 0 !important;
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 18px 32px !important;
  width: 100% !important;
  cursor: pointer !important;
}
.single_add_to_cart_button.button:hover { opacity: 0.92 !important; }
.single_add_to_cart_button.button:disabled,
.single_add_to_cart_button.button.disabled { background: var(--disabled) !important; border-color: var(--disabled) !important; cursor: not-allowed !important; }

/* WC quantity field — hide it (stock=1, no reason to pick quantity) */
.quantity { display: none !important; }

/* WC form fields in checkout (Germanized styling) */
.woocommerce-checkout .form-row label,
.woocommerce-checkout .form-row .label {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  margin-bottom: 6px !important;
}
.woocommerce-checkout .form-row .input-text,
.woocommerce-checkout .form-row select {
  border: var(--border) !important;
  background: var(--card-white) !important;
  padding: 13px 16px !important;
  font-size: 15px !important;
  outline: none !important;
  width: 100% !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.woocommerce-checkout .form-row .input-text:focus,
.woocommerce-checkout .form-row select:focus { border-color: var(--pink) !important; }

/* Checkout order button (Germanized sets the label) */
#place_order {
  background: var(--pink) !important;
  color: var(--cream) !important;
  border: 2px solid var(--pink) !important;
  border-radius: 0 !important;
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 20px 32px !important;
  width: 100% !important;
  cursor: pointer !important;
}
#place_order:disabled { background: var(--disabled) !important; border-color: var(--disabled) !important; cursor: not-allowed !important; }

/* WC checkout page layout */
.woocommerce-checkout { padding: var(--py) var(--px); }
.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3 {
  font-family: var(--font-display) !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  font-size: clamp(18px,2.5vw,24px) !important;
  margin-bottom: 20px !important;
  border-bottom: var(--border) !important;
  padding-bottom: 12px !important;
}

/* WC order review table in checkout */
.woocommerce-checkout-review-order-table { width: 100% !important; border-collapse: collapse !important; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td { border-bottom: var(--border-thin) !important; padding: 10px 0 !important; font-size: 14px !important; }
.woocommerce-checkout-review-order-table .order-total td,
.woocommerce-checkout-review-order-table .order-total th { font-family: var(--font-display) !important; font-weight: 900 !important; font-size: 18px !important; border-top: var(--border) !important; }

/* Payment method labels */
.wc_payment_method label { font-size: 14px !important; font-weight: 600 !important; }

/* WC cart/checkout breadcrumb hidden — we have our own */
.woocommerce-breadcrumb { display: none !important; }

/* WC star ratings */
.star-rating { color: var(--pink) !important; }

/* Remove WC page heading rendered by template */
.woocommerce-products-header { display: none; }

/* cp-main wrapper */
.cp-main { display: block; }