
:root{
  --bg:#f4f4f1;
  --paper:#ffffff;
  --paper-2:#fafaf8;
  --line:rgba(12,12,12,.14);
  --line-strong:rgba(12,12,12,.28);
  --text:#0b0b0b;
  --muted:rgba(12,12,12,.62);
  --soft:rgba(12,12,12,.46);
  --header-h:88px;
  --max:1460px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:linear-gradient(180deg,#fcfcfb 0%,#f1f1ee 100%)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}
.site-shell{min-height:100vh}
.site-header{position:sticky;top:0;z-index:60;height:var(--header-h);border-bottom:1px solid var(--line);background:rgba(255,255,255,.9);backdrop-filter:blur(16px)}
.inner{width:min(calc(100% - 44px),var(--max));margin:0 auto}
.header-grid{height:100%;display:grid;grid-template-columns:270px 1fr auto;align-items:center;gap:28px}
.logo-link{display:inline-flex;align-items:center;overflow:visible;padding:4px 10px 4px 0}.wordmark{display:block;transition:opacity .2s ease}.wordmark:hover{opacity:.8}.header-logo{width:212px;height:auto;object-fit:contain}
.main-nav{display:flex;align-items:center;justify-content:center;gap:34px;font-size:12px;font-weight:600;letter-spacing:.26em;text-transform:uppercase}
.main-nav a,.cart-link{position:relative;padding:10px 0;color:var(--soft)}
.main-nav a:hover,.main-nav a.active,.cart-link:hover{color:var(--text)}
.main-nav a.active::after,.main-nav a:hover::after,.cart-link:hover::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--text)}
.header-actions{display:flex;align-items:center;gap:20px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;font-weight:600}
.cart-link span{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin-left:10px;border:1px solid var(--line-strong);font-size:11px;line-height:1;background:#fff;color:var(--text)}
.menu-toggle{display:none;border:0;background:none;padding:6px;margin-left:8px;cursor:pointer}.menu-toggle span{display:block;width:20px;height:1px;background:#111;margin:5px 0}
.mobile-panel{display:none;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96)}.mobile-panel nav{display:flex;flex-direction:column;padding:10px 20px 18px}.mobile-panel a{padding:14px 0;border-bottom:1px solid var(--line);text-transform:uppercase;letter-spacing:.22em;font-size:12px;font-weight:600}
main{padding-bottom:44px}
.hero{position:relative}.hero-full{min-height:calc(100vh - var(--header-h));background-size:cover;background-position:center right;border-bottom:1px solid var(--line)}
.hero-overlay{display:flex;align-items:flex-end;min-height:calc(100vh - var(--header-h));padding:90px 0 72px}
.hero-copy{max-width:500px}.minimal-copy{padding:0}.kicker,.eyebrow{font-size:11px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--soft)}
.display-words{margin:0 0 24px;font-size:clamp(48px,6vw,96px);letter-spacing:.11em;line-height:.9;font-weight:300;text-transform:uppercase}.display-words span{display:block}
.lede{max-width:420px;margin:0 0 34px;font-size:13px;line-height:2;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.hero-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.button{display:inline-flex;align-items:center;justify-content:center;min-width:176px;height:52px;padding:0 18px;border:1px solid var(--text);background:transparent;font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;transition:background .2s ease,color .2s ease,transform .2s ease;cursor:pointer;border-radius:0}
.button:hover{background:#0d0d0d;color:#fff;transform:translateY(-1px)}.button.black{background:#0d0d0d;color:#fff}.button.black:hover{background:#fff;color:#0d0d0d}
.section{padding:96px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:34px}
.section-title{margin:0;font-size:clamp(28px,4vw,58px);line-height:.95;letter-spacing:.06em;text-transform:uppercase;font-weight:300}.section-copy{max-width:390px;font-size:14px;line-height:1.9;color:var(--muted)}
.material-grid{display:grid;grid-template-columns:1.18fr .82fr;gap:0;border:1px solid var(--line);background:#fff}.material-image{min-height:620px;border-right:1px solid var(--line)}.material-image img{width:100%;height:100%;object-fit:cover}
.material-content{display:grid;grid-template-rows:auto auto 1fr;min-height:620px}.material-copy{padding:54px 46px 38px;border-bottom:1px solid var(--line)}
.material-copy h3,.architect-copy h3,.product-copy h1,.product-spec h2,.catalog-intro h1,.empty-state h1,.cart-empty h2{margin:18px 0 16px;font-size:clamp(30px,3.2vw,56px);line-height:.98;letter-spacing:.08em;font-weight:300;text-transform:uppercase}
.material-copy p,.architect-copy p,.product-copy p,.product-spec p,.filter-copy,.empty-state p,.catalog-intro p,.summary-note,.cart-empty p{font-size:14px;line-height:1.9;color:var(--muted)}
.raw-rock{padding:46px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 140px;gap:24px;align-items:center}.raw-rock img{width:100%;max-width:140px;justify-self:end}.raw-rock .tiny{font-size:11px;line-height:2.1;color:var(--soft);letter-spacing:.22em;text-transform:uppercase}
.mini-link{margin-top:22px;display:inline-flex;gap:10px;align-items:center;font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase}.mini-link::after{content:"→";font-size:16px}
.architect-grid{display:grid;grid-template-columns:.72fr .28fr;border-left:1px solid var(--line);border-top:1px solid var(--line);border-right:1px solid var(--line);background:#fff}.architect-image{min-height:360px;border-right:1px solid var(--line);overflow:hidden}.architect-image img{width:100%;height:100%;object-fit:cover}.architect-copy{padding:44px 38px;border-bottom:1px solid var(--line)}
.collection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--line);background:#fff}.product-card{display:flex;flex-direction:column;min-height:100%;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.collection-grid .product-card:nth-child(3n){border-right:0}.collection-grid.two-up{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-grid.two-up .product-card:nth-child(2n){border-right:0}
.card-media{padding:26px 26px 0}.card-media img{width:100%;aspect-ratio:1.34/1;object-fit:cover;background:#f2f2ef}.card-body{display:flex;flex-direction:column;gap:16px;padding:22px 26px 26px}.card-top{display:flex;justify-content:space-between;gap:18px;align-items:start}.card-title{margin:0;font-size:14px;letter-spacing:.24em;font-weight:700;text-transform:uppercase}.card-sub{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--soft);line-height:1.8}.card-price{font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.card-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:auto}
.text-link{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;background:none;border:0;padding:0;cursor:pointer;color:var(--text)}.text-link::after{content:"→"}
.button-link{font:inherit}
.site-footer{border-top:1px solid var(--line);background:#fff;padding:24px 0 42px}.footer-grid{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--soft)}
.catalog-hero{padding:42px 0 24px;border-bottom:1px solid var(--line)}.catalog-intro{display:grid;grid-template-columns:minmax(260px,.46fr) minmax(420px,.54fr);gap:46px;align-items:end}.catalog-intro-wide{grid-template-columns:minmax(280px,.4fr) minmax(420px,.6fr)}
.catalog-layout{display:grid;grid-template-columns:260px 1fr;gap:0;background:#fff;border-left:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.sidebar{border-right:1px solid var(--line);padding:28px 24px;background:#fbfbfa}.filter-group{padding:18px 0;border-bottom:1px solid var(--line)}.filter-label{margin:0 0 16px;font-size:11px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--soft)}.filter-list{display:grid;gap:12px;font-size:12px;letter-spacing:.18em;text-transform:uppercase}.filter-pill-row{display:flex;gap:10px;flex-wrap:wrap}.filter-pill{border:1px solid var(--line);padding:9px 11px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;background:#fff}.catalog-main{padding:28px}.catalog-bar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px;font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase}.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}.catalog-grid .product-card{border-top:0;border-left:0}
.product-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:0;border:1px solid var(--line);background:#fff}.product-visual{border-right:1px solid var(--line);display:grid;grid-template-rows:minmax(420px,1fr) 240px}.product-visual .primary{padding:28px;border-bottom:1px solid var(--line);background:#fbfbfa}.product-visual .primary img{width:100%;height:100%;object-fit:cover}.product-visual .secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.product-visual .secondary figure{margin:0;border-right:1px solid var(--line)}.product-visual .secondary figure:last-child{border-right:0}.product-visual .secondary img{width:100%;height:100%;object-fit:cover}.product-copy{padding:42px 42px 34px}.product-copy .meta{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:20px}.product-meta-line{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:32px}.meta-card{padding:18px 18px 22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.meta-card strong{display:block;margin-bottom:10px;font-size:11px;letter-spacing:.24em;text-transform:uppercase}.product-spec{margin-top:34px;padding-top:32px;border-top:1px solid var(--line)}.product-spec h2{font-size:28px;margin-top:0}.related-section{padding-top:36px}
.placeholder-box{border:1px solid var(--line);background:#fff;padding:48px;display:grid;place-items:center;min-height:58vh}.empty-state{text-align:center;max-width:640px}.empty-state .logo-icon{width:88px;margin:0 auto 24px}
.cart-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:0;border:1px solid var(--line);background:#fff}.cart-list{min-height:360px}.cart-item{display:grid;grid-template-columns:160px 1fr auto;gap:0;border-bottom:1px solid var(--line)}.cart-item-media{padding:18px;border-right:1px solid var(--line)}.cart-item-media img{width:100%;aspect-ratio:1.15/1;object-fit:cover;background:#f3f3f0}.cart-item-body{padding:22px 24px;display:flex;flex-direction:column;gap:14px}.cart-item-title{margin:0;font-size:16px;letter-spacing:.18em;text-transform:uppercase}.cart-item-sub{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--soft)}.cart-item-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.qty-control{display:inline-flex;align-items:center;border:1px solid var(--line)}.qty-control button{width:34px;height:34px;border:0;background:#fff;cursor:pointer}.qty-control span{display:inline-grid;place-items:center;width:34px;height:34px;border-left:1px solid var(--line);border-right:1px solid var(--line);font-size:12px;font-weight:700}.remove-link{background:none;border:0;padding:0;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;color:var(--soft)}.cart-item-total{padding:22px 24px;border-left:1px solid var(--line);display:flex;align-items:flex-start;justify-content:flex-end;font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.cart-summary{border-left:1px solid var(--line);padding:26px;display:flex;flex-direction:column;gap:18px;background:#fbfbfa}.summary-row{display:flex;justify-content:space-between;gap:18px;font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;padding-bottom:14px;border-bottom:1px solid var(--line)}.summary-row.total{font-size:14px}.summary-note{margin:6px 0 0}.cart-empty{padding:48px;display:grid;place-items:center;text-align:center;min-height:360px}
@media (max-width:1100px){.header-grid{grid-template-columns:240px 1fr auto}.catalog-intro,.product-layout,.material-grid,.architect-grid,.cart-layout{grid-template-columns:1fr}.hero-overlay{align-items:flex-start;padding-top:72px}.material-image{border-right:0;border-bottom:1px solid var(--line)}.architect-image{border-right:0;border-bottom:1px solid var(--line)}.catalog-layout{grid-template-columns:1fr}.sidebar,.cart-summary{border-right:0;border-left:0;border-bottom:1px solid var(--line)}.product-visual{border-right:0;border-bottom:1px solid var(--line)}.cart-item{grid-template-columns:140px 1fr}.cart-item-total{grid-column:2;border-left:0;border-top:1px solid var(--line)}}
@media (max-width:860px){.main-nav,.header-actions .cart-link{display:none}.menu-toggle{display:block}.mobile-panel.open{display:block}.header-grid{grid-template-columns:1fr auto}.header-logo{width:184px}.display-words{font-size:42px}.section{padding:72px 0}.collection-grid,.catalog-grid{grid-template-columns:1fr}.collection-grid .product-card,.collection-grid .product-card:nth-child(3n),.collection-grid.two-up .product-card,.collection-grid.two-up .product-card:nth-child(2n){border-right:0}.raw-rock{grid-template-columns:1fr}.raw-rock img{justify-self:start}.catalog-main{padding:20px}.product-copy{padding:28px 24px 26px}.cart-item{grid-template-columns:1fr}.cart-item-media,.cart-item-total{border-right:0;border-left:0}.hero-full{background-position:70% center}.hero-overlay{padding-bottom:46px}}


/* ===== Merged architectural builder additions ===== */
:root{
  --radius: 2px;
  --radius-lg: 10px;
}
.button,
.menu-toggle,
.mobile-panel,
.product-card,
.catalog-intro,
.sidebar,
.cart-summary,
.cart-item,
.meta-card,
.primary,
.secondary figure,
.card-media img,
.catalog-intro img,
.filter-pill,
.mini-link,
.cart-link,
.control-card,
.builder-card,
.preview-shell,
.builder-stage,
.builder-toolbar,
.builder-frame-tile,
.vto-action,
.vto-topbar,
.vto-bottom,
.vto-chip,
.vto-frame-tile,
.vto-card,
.note-card{
  border-radius: var(--radius) !important;
}
.button{
  text-transform: uppercase;
  letter-spacing: .12em;
}
.button.black{ background:#111; }
.hero-copy .button,
.hero-cta .button{ min-width: 188px; text-align: center; }
.main-nav a,
.cart-link,
.mobile-panel a{ letter-spacing: .08em; text-transform: uppercase; font-size: 12px; }
.section-head .kicker,
.kicker,
.eyebrow{ letter-spacing: .18em; text-transform: uppercase; }
.preview-shell{
  position:relative;
  display:grid;
  grid-template-columns: 1.3fr .7fr;
  gap:24px;
  padding:24px;
  border:1px solid var(--line);
  background:#f6f6f3;
}
.preview-stage{
  position:relative;
  min-height:540px;
  border:1px solid var(--line);
  background:
    radial-gradient(circle at 20% 10%, rgba(255,255,255,.95), rgba(255,255,255,0) 36%),
    linear-gradient(160deg, #f5f5f2 0%, #ededeb 100%);
  overflow:hidden;
}
.preview-stage canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.preview-label{
  position:absolute; left:20px; top:18px; z-index:2;
  background:rgba(255,255,255,.85);
  border:1px solid var(--line);
  padding:10px 12px;
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
}
.preview-cta{
  display:flex; flex-direction:column; justify-content:space-between; gap:16px;
}
.preview-cta .section-copy{ max-width: 34ch; }
.preview-bullets{
  display:grid; gap:10px; color:var(--muted); font-size:14px; line-height:1.6;
}
.dual-feature{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:24px;
}
.note-card{
  border:1px solid var(--line);
  background:#f7f7f4;
  padding:18px;
  display:grid;
  gap:16px;
}
.note-card img{
  width:100%;
  display:block;
  border:1px solid var(--line);
  background:#efefec;
}
.builder-hero{
  padding-top:40px;
}
.builder-shell{
  display:grid;
  grid-template-columns: minmax(0,1fr) 300px;
  gap:24px;
}
.builder-card{
  position:relative;
  border:1px solid var(--line);
  background:#f6f6f3;
  overflow:hidden;
}
.builder-stage{
  position:relative;
  min-height:720px;
  background:
    radial-gradient(circle at 15% 8%, rgba(255,255,255,.95), rgba(255,255,255,0) 34%),
    linear-gradient(165deg, #f5f5f2 0%, #e8e8e5 100%);
}
.builder-stage canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.builder-floating{
  position:absolute; z-index:3;
  display:flex; flex-direction:column; gap:14px;
  padding:12px;
  border:1px solid rgba(17,17,17,.08);
  background:rgba(255,255,255,.82);
  backdrop-filter: blur(18px);
}
.builder-floating.left-top{ top:18px; left:18px; }
.builder-floating.left-mid{ top:200px; left:18px; }
.float-label{
  font-size:11px; letter-spacing:.18em; text-transform:uppercase;
}
.disc-row, .color-disc-grid{
  display:flex; flex-wrap:wrap; gap:10px;
}
.color-disc{
  width:34px; height:34px; border-radius:999px;
  border:1px solid rgba(17,17,17,.16);
  cursor:pointer; position:relative;
  box-shadow: inset 0 1px 4px rgba(255,255,255,.45), 0 6px 16px rgba(0,0,0,.06);
}
.color-disc.active::after{
  content:"";
  position:absolute; inset:-5px; border:1px solid #111;
  border-radius:999px;
}
.builder-toolbar{
  position:absolute; right:18px; bottom:18px; z-index:3;
  display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end;
  max-width:calc(100% - 36px);
}
.builder-toolbar .button{ min-width: 180px; }
.builder-side{
  display:grid; gap:18px;
  align-content:start;
}
.control-card{
  border:1px solid var(--line);
  padding:18px;
  background:#f7f7f4;
  display:grid; gap:14px;
}
.builder-frame-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:16px;
  margin-top:22px;
}
.builder-frame-tile{
  border:1px solid var(--line);
  background:#f8f8f5;
  padding:14px;
  display:grid; gap:12px;
  cursor:pointer;
  transition:transform .16s ease, border-color .16s ease, background .16s ease;
}
.builder-frame-tile:hover{ transform:translateY(-2px); }
.builder-frame-tile.active{
  border-color:#111;
  background:#fff;
}
.builder-frame-tile img{
  width:100%; aspect-ratio:1.25/1; object-fit:contain;
  border:1px solid var(--line);
  background:#f0f0ed;
}
.builder-meta{
  display:flex; justify-content:space-between; gap:12px; align-items:flex-start;
}
.builder-tag{ color:var(--muted); font-size:13px; }
.builder-price{ font-size:14px; }
.variant-readout{
  display:grid; gap:10px;
}
.variant-line{
  display:flex; justify-content:space-between; gap:12px; padding-top:10px;
  border-top:1px solid var(--line);
  color:var(--muted);
}
.variant-line strong{ color:#111; font-weight:600; }
.tryon-layout{
  position:relative;
  min-height:100vh;
  background:#d7d7d5;
}
#vto-stage{
  position:fixed; inset:0;
}
#vto-stage video,
#vto-stage canvas{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
#vto-stage video,
#vto-stage canvas{ transform: scaleX(-1); }
.vto-topbar{
  position:fixed; top:18px; left:18px; right:18px; z-index:5;
  display:flex; justify-content:space-between; gap:18px; align-items:flex-start;
}
.vto-card{
  border:1px solid rgba(17,17,17,.1);
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(20px);
  padding:14px 16px;
  display:grid; gap:10px;
  min-width:min(420px, 100%);
}
.vto-brand{ display:flex; align-items:center; gap:16px; }
.vto-brand img{ height:26px; width:auto; display:block; }
.vto-chip-row{
  display:flex; flex-wrap:wrap; gap:8px;
}
.vto-chip{
  border:1px solid rgba(17,17,17,.12);
  background:#fff;
  padding:8px 10px;
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
}
.vto-actions-top{
  display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end;
}
.vto-actions-top .button{ min-width:160px; }
.vto-status{
  position:fixed; left:18px; bottom:186px; z-index:5;
  border:1px solid rgba(17,17,17,.12);
  background:rgba(255,255,255,.84);
  padding:10px 12px; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
}
.vto-bottom{
  position:fixed; left:18px; right:18px; bottom:18px; z-index:5;
  display:grid; gap:12px;
}
.vto-frame-strip{
  display:grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap:10px;
}
.vto-frame-tile{
  border:1px solid rgba(17,17,17,.12);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(20px);
  padding:10px;
  text-decoration:none; color:inherit;
  display:grid; gap:8px;
}
.vto-frame-tile.active{ border-color:#111; }
.vto-frame-tile img{
  width:100%; aspect-ratio:1.3/1; object-fit:contain;
  border:1px solid var(--line);
  background:#f2f2ef;
}
.vto-frame-meta{
  display:flex; justify-content:space-between; gap:8px; align-items:center;
  font-size:12px;
}
.vto-action-bar{
  display:flex; gap:12px; justify-content:space-between; align-items:center;
}
.vto-action-group{ display:flex; gap:12px; flex-wrap:wrap; }
.vto-action{
  border:1px solid rgba(17,17,17,.12);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(20px);
  padding:12px 14px;
}
.product-variant-box{
  margin-top:22px;
  border:1px solid var(--line);
  background:#f8f8f5;
  padding:16px;
  display:grid; gap:12px;
}
.product-swatch-row{
  display:flex; gap:12px; flex-wrap:wrap;
}
.product-swatch{
  display:inline-flex; align-items:center; gap:8px; padding:8px 10px;
  border:1px solid var(--line); text-decoration:none; color:inherit;
  background:#fff;
}
.product-swatch .dot{
  width:14px; height:14px; border-radius:999px; border:1px solid rgba(17,17,17,.16);
}
.product-swatch.active{ border-color:#111; }
.product-cta-stack{ display:flex; flex-wrap:wrap; gap:12px; }
.empty-state-note{
  border:1px solid var(--line);
  background:#f8f8f5;
  padding:18px;
}
.cart-item-options{
  color:var(--muted); font-size:13px; margin-top:8px;
}
@media (max-width: 1100px){
  .preview-shell, .builder-shell, .dual-feature{ grid-template-columns:1fr; }
  .builder-stage{ min-height:620px; }
}
@media (max-width: 860px){
  .builder-frame-grid{ grid-template-columns:1fr 1fr; }
  .vto-topbar{ position:absolute; top:12px; left:12px; right:12px; }
  .vto-card{ min-width:0; width:100%; }
  .vto-actions-top{ width:100%; justify-content:flex-start; }
  .vto-status{ bottom:264px; left:12px; }
  .vto-frame-strip{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .preview-stage{ min-height:360px; }
  .builder-stage{ min-height:480px; }
  .builder-floating{ position:absolute; left:12px !important; right:auto; transform:none; gap:10px; padding:10px; }
  .builder-floating.left-mid{ top:126px; }
  .builder-toolbar{ left:12px; right:12px; bottom:12px; justify-content:stretch; }
  .builder-toolbar .button{ flex:1 1 100%; min-width:0; }
  .builder-frame-grid{ grid-template-columns:1fr; }
  .vto-bottom{ left:12px; right:12px; bottom:12px; }
  .vto-frame-strip{ grid-template-columns: repeat(2, minmax(0,1fr)); max-height: 220px; overflow:auto; }
  .vto-action-bar{ flex-direction:column; align-items:stretch; }
  .vto-action-group{ width:100%; }
  .vto-action-group .button{ flex:1 1 calc(50% - 6px); min-width:0; }
}


.preview-stage #builderViewer,
.builder-stage #builderViewer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.hero-builder-full{
  position:relative;
  min-height:calc(100vh - var(--header-h));
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 18% 12%, rgba(255,255,255,.92), rgba(255,255,255,0) 34%),
    linear-gradient(160deg, #f6f6f3 0%, #ecece8 100%);
}
.hero-builder-full #builderViewer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.hero-builder-backdrop{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.06) 36%, rgba(255,255,255,.16) 100%),
    radial-gradient(circle at 50% 22%, rgba(255,255,255,.18), rgba(255,255,255,0) 44%);
  pointer-events:none;
  z-index:1;
}
.hero-builder-overlay{
  position:relative;
  z-index:2;
  min-height:calc(100vh - var(--header-h));
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  padding:32px 0 26px;
}
.hero-builder-copy{
  max-width:760px;
  display:grid;
  gap:10px;
}
.hero-builder-copy-centered{
  width:100%;
  margin-top:8px;
  justify-items:center;
  text-align:center;
}
.hero-builder-copy-centered .kicker{
  margin:0;
}
.hero-builder-copy .display-words{
  max-width:none;
  margin:0;
  font-size:clamp(28px, 4.4vw, 78px);
  letter-spacing:.08em;
  line-height:.94;
}
.hero-builder-copy .display-words span{
  display:block;
  white-space:nowrap;
}
.hero-cta-bottom-center{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:flex-end;
  padding-bottom:4px;
}
.hero-cta-bottom-center .button{
  min-width:220px;
}

.hero-intro-strip{
  padding-top:30px;
}
.hero-intro-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px, 460px);
  gap:28px;
  align-items:end;
}
.hero-intro-actions{
  display:grid;
  gap:18px;
  justify-items:start;
}
@media (max-width:1100px){
  .hero-builder-overlay{
    padding-top:72px;
  }
  .hero-intro-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:860px){
  .hero-builder-full,
  .hero-builder-overlay{
    min-height:calc(100svh - var(--header-h));
  }
  .hero-builder-overlay{
    justify-content:space-between;
    padding:20px 0 18px;
  }
  .hero-builder-copy{
    max-width:100%;
    gap:8px;
  }
  .hero-builder-copy-centered{
    margin-top:0;
  }
  .hero-builder-copy-centered .kicker{
    font-size:10px;
    letter-spacing:.18em;
  }
  .hero-builder-copy .display-words{
    max-width:none;
    font-size:clamp(20px, 5.8vw, 34px);
    letter-spacing:.06em;
    line-height:.98;
  }
  .hero-cta-bottom-center .button{
    min-width:0;
    width:min(100%, 260px);
  }
}
