/*
Theme Name: Bejew Today Undertown
Theme URI: https://bejewtoday.com/
Author: Johnathan
Description: A custom visual WordPress theme for Bejew Today with a Breslov undertown mood and a restrained Chabad hint.
Version: 1.0
Text Domain: bejewtoday-undertown
*/

:root, [data-theme="light"] {
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.5rem, 1rem + 4vw, 5rem);
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem; --space-12: 3rem; --space-16: 4rem; --space-20: 5rem; --space-24: 6rem;
  --color-bg: #e8dfd2; --color-surface: #f2eadf; --color-surface-2: #ddd0be; --color-surface-offset: #c8b8a2; --color-border: rgba(59,43,24,0.16);
  --color-text: #1f1710; --color-text-muted: #675749; --color-text-faint: #93816f; --color-text-inverse: #f8f0e3;
  --color-primary: #6a2a1f; --color-primary-hover: #542117; --color-accent: #b4893b; --color-glow: rgba(244, 191, 85, 0.35);
  --shadow-sm: 0 12px 32px rgba(36, 22, 10, 0.10); --shadow-lg: 0 24px 80px rgba(36, 22, 10, 0.18);
  --radius-sm: 0.4rem; --radius-md: 0.85rem; --radius-lg: 1.4rem; --radius-xl: 2rem; --radius-full: 999px;
  --font-display: 'Cinzel', Georgia, serif; --font-body: 'Inter', system-ui, sans-serif; --content: 1220px; --transition: 180ms cubic-bezier(0.16,1,0.3,1);
}
[data-theme="dark"] {
  --color-bg: #0e0b09; --color-surface: #15110e; --color-surface-2: #1d1713; --color-surface-offset: #2a2019; --color-border: rgba(235,210,173,0.14);
  --color-text: #efe0c9; --color-text-muted: #b49d80; --color-text-faint: #786753; --color-text-inverse: #120d09;
  --color-primary: #7b231c; --color-primary-hover: #9b2f26; --color-accent: #d0a650; --color-glow: rgba(247, 203, 104, 0.22);
  --shadow-sm: 0 14px 40px rgba(0,0,0,0.35); --shadow-lg: 0 32px 90px rgba(0,0,0,0.55);
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;min-height:100dvh;font-family:var(--font-body);font-size:var(--text-base);line-height:1.65;color:var(--color-text);background:radial-gradient(circle at 50% -10%, rgba(208,166,80,0.12), transparent 28%),radial-gradient(circle at 20% 30%, rgba(123,35,28,0.18), transparent 26%),linear-gradient(180deg, rgba(255,255,255,0.02), transparent 14%),var(--color-bg)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.10;background-image:linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at center, black 40%, transparent 100%)}
a{text-decoration:none;color:inherit} img,svg{display:block;max-width:100%;height:auto} button{font:inherit} .site{position:relative;z-index:1} .container{width:min(calc(100% - 2rem), var(--content));margin-inline:auto}
.skip-link{position:absolute;left:1rem;top:-3rem;padding:.8rem 1rem;border-radius:999px;background:var(--color-primary);color:var(--color-text-inverse);z-index:100}.skip-link:focus{top:1rem}
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb, var(--color-bg) 82%, transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--color-border)}
.header-bar{display:flex;align-items:center;justify-content:space-between;min-height:5rem;gap:var(--space-4)} .brand{display:inline-flex;align-items:center;gap:var(--space-3);text-transform:uppercase;letter-spacing:.14em;font-size:var(--text-xs)}
.brand-mark{width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;color:var(--color-accent);background:linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 82%, transparent), var(--color-surface-2));border:1px solid var(--color-border);box-shadow:var(--shadow-sm)} .brand-mark svg{width:1.7rem;height:1.7rem}
.nav-links{display:flex;gap:var(--space-6);color:var(--color-text-muted);font-size:var(--text-sm)} .nav-links a:hover{color:var(--color-text)} .header-actions{display:flex;align-items:center;gap:var(--space-3)}
.theme-toggle,.button,.button-ghost{min-height:44px;border-radius:var(--radius-full);transition:transform var(--transition), background var(--transition), border-color var(--transition), color var(--transition)}
.theme-toggle{width:44px;display:grid;place-items:center;background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text)}
.button,.button-ghost{display:inline-flex;align-items:center;justify-content:center;padding:0 1.2rem;font-size:var(--text-sm)} .button{background:var(--color-primary);color:var(--color-text-inverse)} .button:hover{background:var(--color-primary-hover)} .button-ghost{background:var(--color-surface);border:1px solid var(--color-border)} .theme-toggle:hover,.button:hover,.button-ghost:hover{transform:translateY(-1px)}
.hero{padding:clamp(4rem, 10vw, 8rem) 0 clamp(3rem, 7vw, 6rem)} .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--space-10);align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:var(--space-2);padding:.5rem .85rem;border-radius:999px;border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));color:var(--color-text-muted);font-size:var(--text-xs);letter-spacing:.18em;text-transform:uppercase}
.hero-copy h1,.section-heading h2,.copy-panel h2,.quote-band h2,.panel h3{font-family:var(--font-display)} .hero-copy h1{margin:var(--space-5) 0 0;font-size:var(--text-3xl);line-height:.92;font-weight:600;max-width:11ch;text-shadow:0 0 24px rgba(0,0,0,0.24)} .hero-copy p{margin-top:var(--space-5);color:var(--color-text-muted);max-width:58ch}
.hero-actions,.hero-notes{display:flex;flex-wrap:wrap}.hero-actions{gap:var(--space-3);margin-top:var(--space-6)} .hero-notes{gap:var(--space-6);margin-top:var(--space-8)} .hero-notes strong{display:block;font-size:var(--text-lg);color:var(--color-text)} .hero-notes span{color:var(--color-text-muted);font-size:var(--text-sm)}
.hero-stage{position:relative;min-height:42rem;overflow:hidden;border-radius:var(--radius-xl);border:1px solid var(--color-border);background:radial-gradient(circle at 50% 18%, var(--color-glow), transparent 20%),linear-gradient(180deg, rgba(255,255,255,0.03), transparent 22%),linear-gradient(180deg, var(--color-surface), var(--color-surface-2));box-shadow:var(--shadow-lg)}
.vault-arch{position:absolute;inset:5% 14% 10% 14%;border-radius:18rem 18rem 2rem 2rem / 16rem 16rem 2rem 2rem;border:1px solid rgba(235,210,173,0.18);background:linear-gradient(180deg, rgba(255,255,255,0.04), transparent 26%),radial-gradient(circle at 50% 14%, rgba(247,203,104,0.20), transparent 18%),linear-gradient(180deg, #1a1410, #0f0c0a 78%);overflow:hidden}
.vault-arch::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg, transparent 0 28px, rgba(255,255,255,0.03) 28px 29px),linear-gradient(180deg, transparent, rgba(0,0,0,0.28));opacity:.45}
.lamp-core{position:absolute;left:50%;top:49%;transform:translate(-50%, -50%);width:min(18rem, 55%);aspect-ratio:1/1.5;filter:drop-shadow(0 0 38px rgba(247,203,104,0.16))}
.float-card{position:absolute;border-radius:var(--radius-lg);background:color-mix(in srgb, var(--color-surface) 72%, transparent);border:1px solid var(--color-border);backdrop-filter:blur(10px);box-shadow:var(--shadow-sm);padding:var(--space-4)} .float-card.top{top:8%;right:7%;width:11rem} .float-card.bottom{left:7%;bottom:9%;width:12rem}.float-card p{color:var(--color-text-muted);font-size:var(--text-sm)}
.section{padding:clamp(3rem, 7vw, 6rem) 0} .section-heading{display:flex;justify-content:space-between;align-items:end;gap:var(--space-4);margin-bottom:var(--space-8)} .section-heading h2{font-size:var(--text-2xl);line-height:1;font-weight:600} .section-heading p{color:var(--color-text-muted);max-width:44ch}
.grid-three{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--space-5)} .panel{min-height:18rem;border-radius:var(--radius-lg);border:1px solid var(--color-border);overflow:hidden;background:linear-gradient(180deg, var(--color-surface), var(--color-surface-2));box-shadow:var(--shadow-sm);padding:var(--space-6);position:relative;display:flex;flex-direction:column;justify-content:flex-end}
.panel::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right, rgba(208,166,80,0.24), transparent 28%), linear-gradient(180deg, transparent, rgba(0,0,0,0.14));pointer-events:none}.panel>*{position:relative}.panel.featured{min-height:24rem}.panel h3{font-size:var(--text-xl);font-weight:600;line-height:1.05}.panel p{margin-top:var(--space-2);color:var(--color-text-muted);max-width:28ch}
.showcase{display:grid;grid-template-columns:.92fr 1.08fr;gap:var(--space-8)} .stone-panel,.copy-panel{border-radius:var(--radius-xl);border:1px solid var(--color-border);box-shadow:var(--shadow-sm)} .stone-panel{min-height:36rem;overflow:hidden;background:linear-gradient(180deg, rgba(255,255,255,0.03), transparent 20%),linear-gradient(180deg, #1b1511, #120f0c 60%, #17110d);position:relative} .stone-panel::before{content:"";position:absolute;inset:0;opacity:.25;background:radial-gradient(circle at 20% 18%, rgba(255,255,255,0.15), transparent 12%),radial-gradient(circle at 68% 42%, rgba(255,255,255,0.08), transparent 16%),repeating-linear-gradient(180deg, rgba(255,255,255,0.03) 0 2px, transparent 2px 72px)}
.copy-panel{padding:clamp(2rem, 4vw, 3.5rem);background:var(--color-surface);display:grid;align-content:center;gap:var(--space-5)} .copy-panel h2{font-size:var(--text-2xl);line-height:1;font-weight:600;max-width:11ch} .copy-panel p{color:var(--color-text-muted)}
.list{display:grid;gap:var(--space-4)} .list-item{display:grid;grid-template-columns:8rem 1fr;gap:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)} .list-item span{text-transform:uppercase;letter-spacing:.16em;font-size:var(--text-xs);color:var(--color-text-faint)}
.quote-band{border-radius:var(--radius-xl);padding:clamp(2rem, 5vw, 4rem);border:1px solid var(--color-border);background:radial-gradient(circle at 10% 20%, rgba(208,166,80,0.16), transparent 20%),linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 18%, var(--color-surface)), var(--color-surface));display:grid;grid-template-columns:1fr auto;gap:var(--space-8);align-items:center} .quote-band h2{font-size:var(--text-2xl);line-height:1;font-weight:600;max-width:13ch} .quote-band p{color:var(--color-text-muted);max-width:48ch}
.footer{padding:var(--space-10) 0 var(--space-12);color:var(--color-text-muted)} .footer-bar{padding-top:var(--space-6);border-top:1px solid var(--color-border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-4)}
@media (max-width:960px){.nav-links{display:none}.hero-grid,.grid-three,.showcase,.quote-band{grid-template-columns:1fr}.section-heading{flex-direction:column;align-items:start}.hero-stage{min-height:32rem}.list-item{grid-template-columns:1fr;gap:var(--space-2)}}
@media (max-width:640px){.header-actions .button-ghost{display:none}.hero-stage{min-height:27rem}.vault-arch{inset:8% 8% 12% 8%}.float-card.top{width:9rem}.float-card.bottom{width:10rem}}