/* Per-site visual identity. Loaded after style.css / home-luxe.css on every storefront page.
   body.theme-bracelet = BVDIY (warm, soft, crystal studio)
   body.theme-diamond  = diamond (cool, sharp, platinum studio) */

body.theme-bracelet {
  --ivory: #faf4ec;
  --paper: #fffcf7;
  --stone: #f1e5d8;
  --ink: #2c201e;
  --ink-soft: #52413c;
  --ink-deep: #1e1514;
  --muted: #86746b;
  --gold: #a65e49;
  --gold-deep: #8c4a38;
  --gold-soft: #e4c3b3;
  --line: rgba(44, 32, 30, 0.12);
  --line-strong: rgba(44, 32, 30, 0.24);
  --line-solid: #e6d8c9;
  --header-bg: rgba(250, 244, 236, 0.94);
  --b1: #8e6bb0; --b2: #f2ece3; --b3: #e89aa8; --b4: #c98b72; --b5: #7fc8b4; --b6: #e8c25a;
  --radius: 10px;
  --radius-lg: 18px;
  --btn-radius: 999px;
  --card-radius: 18px;

  --clr-primary: var(--ink);
  --clr-primary-dark: var(--ink-deep);
  --clr-primary-light: var(--stone);
  --clr-accent: var(--gold);
  --clr-dark: var(--ink-deep);
  --clr-text: var(--ink-soft);
  --clr-text-light: var(--muted);
  --clr-bg: var(--paper);
  --clr-bg-alt: var(--stone);
  --clr-border: var(--line-solid);
}

body.theme-diamond {
  --ivory: #f2f5f9;
  --paper: #fbfcfe;
  --stone: #e5ebf2;
  --ink: #0e1b2e;
  --ink-soft: #34465c;
  --ink-deep: #08111f;
  --muted: #667689;
  --gold: #3d6a98;
  --gold-deep: #2c5278;
  --gold-soft: #b6c8da;
  --line: rgba(14, 27, 46, 0.12);
  --line-strong: rgba(14, 27, 46, 0.26);
  --line-solid: #d5dde7;
  --header-bg: rgba(242, 245, 249, 0.94);
  --radius: 0px;
  --radius-lg: 0px;
  --btn-radius: 0px;
  --card-radius: 0px;

  --clr-primary: var(--ink);
  --clr-primary-dark: var(--ink-deep);
  --clr-primary-light: var(--stone);
  --clr-accent: var(--gold);
  --clr-dark: var(--ink-deep);
  --clr-text: var(--ink-soft);
  --clr-text-light: var(--muted);
  --clr-bg: var(--paper);
  --clr-bg-alt: var(--stone);
  --clr-border: var(--line-solid);
}

body.theme-bracelet,
body.theme-diamond {
  --section: clamp(72px, 8.5vw, 124px);
  --font-heading: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-family: var(--font-body);
  background: var(--paper);
  color: var(--ink-soft);
}

/* ---------- Inner pages: type, header, footer ---------- */
body.theme-bracelet h1, body.theme-bracelet h2, body.theme-bracelet h3,
body.theme-diamond h1, body.theme-diamond h2, body.theme-diamond h3 {
  font-family: var(--font-heading);
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -0.005em;
}
body.theme-bracelet :is(.site-header, .site-footer, .page-header) h1,
body.theme-diamond :is(.site-header, .site-footer, .page-header) h1 { letter-spacing: -0.01em; }
body.theme-bracelet .page-header h1, body.theme-diamond .page-header h1 { font-size: clamp(2.6rem, 5vw, 4rem); line-height: 1.05; font-weight: 500; }
body.theme-bracelet .site-footer h3, body.theme-diamond .site-footer h3 { color: #fff; }

body.theme-bracelet .site-header, body.theme-diamond .site-header { background: var(--header-bg); backdrop-filter: saturate(140%) blur(14px); -webkit-backdrop-filter: saturate(140%) blur(14px); border-bottom: 1px solid var(--line); }
body.theme-bracelet .header-top, body.theme-diamond .header-top { background: var(--ink); color: rgba(255, 255, 255, 0.82); font-family: var(--font-body); }
body.theme-bracelet .header-main, body.theme-diamond .header-main { background: transparent; border-bottom: 0; }
body.theme-bracelet .main-nav a, body.theme-diamond .main-nav a { font-family: var(--font-body); font-weight: 450; color: var(--ink-soft); }
body.theme-bracelet .main-nav a:hover, body.theme-bracelet .main-nav a.active,
body.theme-diamond .main-nav a:hover, body.theme-diamond .main-nav a.active { color: var(--gold-deep); }
body.theme-bracelet .main-nav a.active::after, body.theme-diamond .main-nav a.active::after { background: var(--gold); }
body.theme-bracelet .page-header, body.theme-diamond .page-header { background: var(--stone); border-bottom: 1px solid var(--line); }
body.theme-bracelet .page-header p, body.theme-diamond .page-header p { color: var(--muted); }

body.theme-bracelet .site-footer, body.theme-diamond .site-footer { background: var(--ink-deep); }

/* Buttons on inner pages follow each site's corner language */
body.theme-bracelet .btn, body.theme-diamond .btn { border-radius: var(--btn-radius); font-family: var(--font-body); }
body.theme-bracelet .btn-primary, body.theme-diamond .btn-primary { background: var(--ink); border-color: var(--ink); color: #fff; }
body.theme-bracelet .btn-primary:hover, body.theme-diamond .btn-primary:hover { background: var(--gold-deep); border-color: var(--gold-deep); }
body.theme-bracelet :is(.product-card, .blog-card, .post-card) img { border-radius: 14px; }

/* ---------- Home (lx-*) shared ---------- */
body.theme-bracelet .lx-header, body.theme-diamond .lx-header { background: var(--header-bg); }
body.theme-bracelet .lx-footer, body.theme-diamond .lx-footer { background: var(--ink-deep); }
body.theme-bracelet .lx-consult, body.theme-diamond .lx-consult { background: var(--ink-deep); }
body.theme-bracelet .lx-btn, body.theme-diamond .lx-btn { border-radius: var(--btn-radius); }
.lx-hero-notes--plain { border-top: 0; padding-top: 0; margin-top: 36px; }

/* ---------- BVDIY home ---------- */
.lx-bhero { position: relative; overflow: hidden; padding: clamp(36px, 5vw, 72px) 0 clamp(72px, 9vw, 130px); background:
  radial-gradient(ellipse 60% 70% at 78% 40%, rgba(228, 195, 179, 0.55), transparent 70%),
  radial-gradient(ellipse 40% 50% at 8% 90%, rgba(142, 107, 176, 0.10), transparent 70%), var(--ivory); }
.lx-bhero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.lx-bhero h1 { font-size: clamp(52px, 6.6vw, 96px); }
.lx-bhero h1 em { color: var(--gold); }
.lx-stage { position: relative; width: min(100%, 560px); aspect-ratio: 1; margin-inline: auto; display: grid; place-items: center; }
.lx-stage::before { content: ''; position: absolute; inset: 4%; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff 0%, #fbf3ea 55%, #f1e1d2 100%); box-shadow: 0 40px 90px rgba(140, 74, 56, 0.16), inset 0 0 0 1px rgba(166, 94, 73, 0.14); }
.lx-stage::after { content: ''; position: absolute; inset: 13.7%; border-radius: 50%; border: 1px solid rgba(166, 94, 73, 0.32); z-index: 0; }
.lx-stage .lx-bead-ring { position: absolute; inset: 9%; width: auto; aspect-ratio: auto; animation: lx-turn 90s linear infinite; z-index: 1; }
.lx-stage .lx-bead-ring::before { display: none; }
.lx-stage .lx-bead-ring img { width: 11%; height: 11%; filter: drop-shadow(0 8px 10px rgba(60, 30, 20, 0.22)); }
.lx-stage-core { position: relative; z-index: 1; text-align: center; padding: 0 18%; }
.lx-stage-core strong { display: block; font-family: var(--serif); font-weight: 500; font-size: clamp(30px, 4vw, 46px); line-height: 1.05; color: var(--ink); }
.lx-stage-core span { display: block; margin-top: 10px; font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold-deep); }
.lx-chip { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; background: rgba(255, 252, 247, 0.92); border: 1px solid var(--line); box-shadow: 0 10px 28px rgba(60, 30, 20, 0.10); font-size: 12px; letter-spacing: 0.08em; color: var(--ink); white-space: nowrap; }
.lx-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--gold); }
.lx-chip--a { top: 3%; left: -5%; }
.lx-chip--b { top: 46%; right: -4%; }
.lx-chip--c { bottom: 7%; left: 6%; }
@keyframes lx-turn { to { transform: rotate(360deg); } }

.lx-formats { background: var(--paper); }
.lx-format-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2.4vw, 32px); }
.lx-format { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--card-radius); background: var(--ivory); overflow: hidden; transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease), border-color 0.5s; }
.lx-format:hover { transform: translateY(-4px); box-shadow: 0 24px 50px rgba(140, 74, 56, 0.12); border-color: var(--gold-soft); }
.lx-format-art { display: grid; place-items: center; aspect-ratio: 5 / 3.4; background: radial-gradient(ellipse at 50% 55%, #fff 0%, var(--stone) 85%); }
.lx-format-art svg { width: 52%; max-width: 210px; overflow: visible; filter: drop-shadow(0 8px 10px rgba(60, 30, 20, 0.14)); transition: transform 0.9s var(--ease); }
.lx-format:hover .lx-format-art svg { transform: rotate(-6deg) scale(1.04); }
.lx-format-body { padding: clamp(22px, 2.6vw, 34px); border-top: 1px solid var(--line); }
.lx-format-body h3 { font-size: clamp(26px, 2.6vw, 34px); }
.lx-format-body p { margin: 10px 0 22px; color: var(--muted); font-size: 15px; }
.lx-format-cta { margin-top: clamp(32px, 4vw, 56px); text-align: center; }

body.theme-bracelet .lx-materials { background: var(--stone); }
body.theme-bracelet .lx-material-list { border: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.6vw, 20px); }
body.theme-bracelet .lx-material-list li { border: 1px solid var(--line); border-radius: var(--card-radius); background: var(--paper); overflow: hidden; }
body.theme-bracelet .lx-step-num, body.theme-bracelet .lx-studio-index { color: var(--gold); }
body.theme-bracelet .lx-product-media { border-radius: 16px; }
body.theme-bracelet .lx-quick-add button { border-radius: 999px; }
body.theme-bracelet .lx-quick-add { padding: 14px; }
body.theme-bracelet .lx-promise, body.theme-bracelet .lx-steps li { background: transparent; }

/* ---------- diamond home ---------- */
.lx-dhero { position: relative; overflow: hidden; color: #fff; background:
  radial-gradient(ellipse 55% 80% at 82% 45%, rgba(86, 130, 180, 0.38), transparent 70%),
  linear-gradient(135deg, #0a1628 0%, #0e1b2e 55%, #12263f 100%); }
.lx-dhero::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 90px); pointer-events: none; }
.lx-dhero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: center; padding-block: clamp(48px, 6vw, 96px); }
body.theme-diamond .lx-dhero h1 { color: #fff; font-size: clamp(54px, 6.8vw, 100px); }
body.theme-diamond .lx-dhero h1 em { color: #a9c6e6; }
.lx-dhero .lx-eyebrow { color: #a9c6e6; }
.lx-dhero .lx-lede { color: rgba(255, 255, 255, 0.74); }
.lx-dhero .lx-btn-dark { background: #fff; color: var(--ink); }
.lx-dhero .lx-btn-dark:hover { background: #a9c6e6; }
.lx-dhero .lx-btn-line { border-color: rgba(255, 255, 255, 0.4); color: #fff; }
.lx-dhero .lx-btn-line:hover { background: #fff; color: var(--ink); border-color: #fff; }
.lx-dhero .lx-hero-notes { border-top-color: rgba(255, 255, 255, 0.18); color: rgba(255, 255, 255, 0.62); }
.lx-dhero .lx-hero-notes li::before { background: #a9c6e6; }
.lx-dframe { position: relative; margin: 0; aspect-ratio: 1; max-width: 560px; justify-self: end; width: 100%; background: #e9edf2; box-shadow: 0 50px 100px rgba(0, 0, 0, 0.45); }
.lx-dframe::before { content: ''; position: absolute; inset: -14px 14px 14px -14px; border: 1px solid rgba(169, 198, 230, 0.45); pointer-events: none; }
.lx-dframe img { position: relative; width: 100%; height: 100%; object-fit: cover; }
.lx-dframe figcaption { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 20px; background: linear-gradient(transparent, rgba(8, 17, 31, 0.62)); color: #fff; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; }
.lx-dframe figcaption a { border-bottom: 1px solid rgba(255, 255, 255, 0.6); padding-bottom: 3px; }

.lx-shapes { background: var(--paper); }
.lx-shape-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.lx-shape { display: block; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--paper); transition: background-color 0.4s var(--ease); }
.lx-shape:hover { background: #fff; }
.lx-shape-media { display: block; aspect-ratio: 1; overflow: hidden; background: #e9edf2; }
.lx-shape-media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.18); transition: transform 1s var(--ease); }
.lx-shape:hover .lx-shape-media img { transform: scale(1.28); }
.lx-shape-name { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; font-family: var(--serif); font-size: 22px; color: var(--ink); }
.lx-shape-name span { font-family: var(--sans); font-size: 12px; color: var(--gold); transition: transform 0.4s var(--ease); }
.lx-shape:hover .lx-shape-name span { transform: translateX(4px); }
.lx-shape-cta { margin-top: clamp(28px, 4vw, 48px); text-align: center; }

.lx-facts { background: var(--ink); color: #fff; }
body.theme-diamond .lx-facts h2, body.theme-diamond .lx-facts h3 { color: #fff; }
.lx-facts .lx-eyebrow { color: #a9c6e6; }
.lx-facts .lx-section-head > p:not(.lx-eyebrow) { color: rgba(255, 255, 255, 0.64); }
.lx-fact-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255, 255, 255, 0.16); }
.lx-fact-grid > div { padding: clamp(32px, 4vw, 52px) clamp(18px, 2.6vw, 40px) 0 0; }
.lx-fact-grid > div + div { padding-left: clamp(18px, 2.6vw, 40px); border-left: 1px solid rgba(255, 255, 255, 0.16); }
.lx-fact-grid b { display: block; font-family: var(--serif); font-weight: 400; font-size: 54px; line-height: 1; color: #a9c6e6; margin-bottom: 22px; }
.lx-fact-grid h3 { font-size: 26px; margin-bottom: 10px; }
.lx-fact-grid p { color: rgba(255, 255, 255, 0.64); font-size: 15px; }

body.theme-diamond .lx-btn { letter-spacing: 0.24em; }
body.theme-diamond .lx-product-media { background: #e9edf2; }

@media (max-width: 1080px) {
  .lx-shape-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px) {
  .lx-bhero-grid, .lx-dhero-grid { grid-template-columns: 1fr; }
  .lx-stage { order: -1; width: min(86%, 420px); }
  .lx-chip { display: none; }
  .lx-format-grid { grid-template-columns: 1fr; }
  .lx-dframe { justify-self: center; max-width: 440px; order: -1; margin-right: 14px; }
  .lx-dframe::before { inset: -10px 10px 10px -10px; }
  .lx-shape-grid { grid-template-columns: repeat(3, 1fr); }
  body.theme-bracelet .lx-material-list { grid-template-columns: repeat(2, 1fr); }
  .lx-fact-grid { grid-template-columns: 1fr; }
  .lx-fact-grid > div, .lx-fact-grid > div + div { padding: 32px 0 0; border-left: 0; }
}
@media (max-width: 560px) {
  .lx-shape-grid { grid-template-columns: repeat(2, 1fr); }
  .lx-shape-name { font-size: 19px; padding: 12px 14px; }
  .lx-dframe figcaption { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lx-stage .lx-bead-ring { animation: none; }
}

/* Headings inside dark bands must beat the themed heading colour */
body.theme-bracelet .lx-consult h2, body.theme-diamond .lx-consult h2,
body.theme-bracelet .lx-footer h3, body.theme-diamond .lx-footer h3,
body.theme-bracelet .lx-footer-col h3, body.theme-diamond .lx-footer-col h3 { color: var(--paper); }
body.theme-bracelet .lx-footer-col h3, body.theme-diamond .lx-footer-col h3 { font-family: var(--sans); font-weight: 450; }
body.theme-bracelet :is(h1, h2), body.theme-diamond :is(h1, h2) { text-wrap: balance; }
body.theme-bracelet .lx-footer-mail { color: var(--gold-soft); }
body.theme-diamond .lx-footer-mail { color: #a9c6e6; border-bottom-color: rgba(169, 198, 230, 0.4); }
body.theme-diamond .lx-footer-col a:hover { color: #a9c6e6; }
body.theme-diamond .lx-consult::before { border-color: rgba(169, 198, 230, 0.18); box-shadow: 0 0 0 48px rgba(169, 198, 230, 0.02); }
body.theme-diamond .lx-eyebrow--light, body.theme-diamond .lx-announce span[aria-hidden] { color: #a9c6e6; }

body.theme-bracelet .sidebar h3, body.theme-diamond .sidebar h3,
body.theme-bracelet .blog-sidebar h3, body.theme-diamond .blog-sidebar h3 { font-family: var(--font-body); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); }

body.theme-bracelet, body.theme-diamond { --designer-active: var(--ink); }
body.theme-bracelet :is(.designer-segment, .designer-preset-grid) button.active,
body.theme-diamond :is(.designer-segment, .designer-preset-grid) button.active { color: #fff; }

/* diamond: trust bar and story */
.lx-trust { background: var(--paper); border-bottom: 1px solid var(--line); }
.lx-trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.lx-trust-grid p { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 24px 12px; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-soft); }
.lx-trust-grid p + p { border-left: 1px solid var(--line); }
.lx-trust-grid svg { flex: none; color: var(--gold); }
.lx-story { background: var(--stone); }
.lx-story-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.lx-story-mark { font-family: var(--serif); font-weight: 300; font-size: clamp(160px, 24vw, 340px); line-height: 0.8; letter-spacing: -0.06em; text-align: center; color: transparent; -webkit-text-stroke: 1px var(--gold); }
.lx-story h2 { margin-bottom: 26px; }
.lx-story p:not(.lx-eyebrow) { max-width: 36em; margin-bottom: 18px; color: var(--ink-soft); }
.lx-story .lx-link { margin-top: 12px; }
@media (max-width: 900px) {
  .lx-trust-grid { grid-template-columns: 1fr; }
  .lx-trust-grid p { justify-content: flex-start; padding: 16px 4px; }
  .lx-trust-grid p + p { border-left: 0; border-top: 1px solid var(--line); }
  .lx-story-grid { grid-template-columns: 1fr; }
  .lx-story-mark { font-size: 150px; text-align: left; }
}

body.theme-bracelet .about-hero, body.theme-diamond .about-hero { background: var(--ivory); }
body.theme-bracelet .about-intro, body.theme-diamond .about-intro { background: var(--paper); }

/* natural-material notes */
body.theme-bracelet .lx-disclaimer,
body.theme-bracelet .lx-footer-note,
body.theme-bracelet .footer-note {
  margin: 1.4rem auto 0;
  max-width: 46rem;
  text-align: center;
  font-size: 0.82rem;
  line-height: 1.6;
  color: var(--muted, #6b6f78);
}
body.theme-bracelet .lx-footer-note,
body.theme-bracelet .footer-note { margin: 0 auto 1rem; padding: 0 1rem; }