/* ================================================================
   cRyPtO sMaRt — BMW-INSPIRED MASTER THEME
   Color tokens & layout patterns extracted from real bmw.in CSS.
   This single file replaces all old stylesheets site-wide.
   ================================================================ */

:root{
  /* — Surfaces — */
  --bg:           #ffffff;
  --bg-alt:       #f6f6f6;
  --bg-soft:      #f2f2f2;
  --line:         #e6e6e6;
  --line-strong:  #c8c8c8;

  /* — Text — */
  --ink:          #262626;      /* BMW signature near-black */
  --ink-2:        #4d4d4d;
  --ink-3:        #8e8e8e;
  --ink-on-dark:  #ffffff;

  /* — Brand — */
  --brand:        #1c69d4;      /* BMW interactive blue */
  --brand-hover:  #0653b6;
  --brand-soft:   #dde8f9;

  /* — Status (kept minimal for things like alerts only) — */
  --success:      #1f7a3d;
  --danger:       #af1523;

  /* — Spacing scale — */
  --sp-1: 8px;  --sp-2: 16px;  --sp-3: 24px;
  --sp-4: 32px; --sp-5: 48px;  --sp-6: 64px;
  --sp-7: 80px; --sp-8: 120px;

  /* — Layout — */
  --shell:        1280px;
  --shell-wide:   1440px;

  /* — Motion — */
  --t:            cubic-bezier(.4,0,.2,1);
  --t-slow:       cubic-bezier(.22,.61,.36,1);
}

/* ================================================================
   RESET
   ================================================================ */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body{
  font-family:'Inter Tight','Inter','Arial','Helvetica',sans-serif;
  font-size:16px;
  line-height:1.55;
  color:var(--ink);
  background:var(--bg);
  font-feature-settings:'ss01','cv11';
  overflow-x:hidden;
}
img,video,svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; border:none; background:none; color:inherit; }
ul,ol{ list-style:none; }

/* ================================================================
   TYPOGRAPHY
   ================================================================ */
.eyebrow{
  font-size:11px;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-2);
}
.eyebrow-light{ color:rgba(255,255,255,.85); }

.h-display{
  font-size:clamp(48px, 7vw, 96px);
  font-weight:200;
  line-height:.98;
  letter-spacing:-.015em;
  text-transform:uppercase;
}
.h-display strong{ font-weight:700; }

.h-section{
  font-size:clamp(32px, 4.5vw, 56px);
  font-weight:300;
  line-height:1.05;
  letter-spacing:-.005em;
  text-transform:uppercase;
}
.h-section strong{ font-weight:700; }

.h-card{
  font-size:22px;
  font-weight:600;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.005em;
}

.lede{
  font-size:clamp(16px,1.15vw,18px);
  color:var(--ink-2);
  max-width:600px;
  line-height:1.7;
}

p{ line-height:1.7; }

.tagline{
  font-size:clamp(20px,2vw,30px);
  font-weight:400;
  letter-spacing:.02em;
  text-transform:uppercase;
  margin-bottom:16px;
}

/* ================================================================
   BUTTONS — BMW rectangular, sharp, restrained
   ================================================================ */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 30px;
  font-size:13px;
  font-weight:500;
  letter-spacing:.05em;
  text-transform:uppercase;
  border-radius:0;
  transition:all .28s var(--t);
  white-space:nowrap;
  cursor:pointer;
  border:1px solid transparent;
}
.btn-primary{ background:var(--brand); color:#fff; }
.btn-primary:hover{ background:var(--brand-hover); transform:translateY(-1px); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--ink); }
.btn-ghost:hover{ background:var(--ink); color:#fff; }
.btn-ghost-light{ background:transparent; color:#fff; border-color:#fff; }
.btn-ghost-light:hover{ background:#fff; color:var(--ink); }
.btn-link{
  padding:0;
  color:var(--ink);
  font-weight:500;
  font-size:14px;
  letter-spacing:.04em;
  text-transform:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.btn-link::after{
  content:'›';
  font-size:18px;
  line-height:1;
  transition:transform .25s var(--t);
}
.btn-link:hover{ color:var(--brand); }
.btn-link:hover::after{ transform:translateX(4px); }

/* ================================================================
   NAV — BMW pattern: transparent over hero, white on scroll
   ================================================================ */
.bmw-nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  background:rgba(0,0,0,0);
  border-bottom:1px solid transparent;
  transition:background .35s var(--t), border-color .35s var(--t);
}
.bmw-nav.scrolled{
  background:rgba(255,255,255,.97);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.bmw-nav-inner{
  max-width:var(--shell-wide);
  margin:0 auto;
  padding:14px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.bmw-brand{ display:flex; align-items:center; gap:10px; }
.bmw-brand-logo{
  width:44px; height:44px;
  background:#fff;
  border-radius:50%;
  padding:4px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .35s var(--t);
  flex-shrink:0;
}
.bmw-nav.scrolled .bmw-brand-logo{ background:transparent; }
.bmw-brand-logo img{
  width:100%; height:100%;
  object-fit:contain;
}
.bmw-brand-text{
  font-weight:700;
  font-size:14px;
  letter-spacing:.04em;
  color:#fff;
  transition:color .35s var(--t);
  white-space:nowrap;
}
.bmw-nav.scrolled .bmw-brand-text{ color:var(--ink); }

.bmw-nav-links{
  display:flex;
  gap:32px;
}
.bmw-nav-links a{
  font-size:13px;
  font-weight:500;
  letter-spacing:.03em;
  color:#fff;
  transition:color .25s var(--t);
  position:relative;
  padding-bottom:4px;
}
.bmw-nav.scrolled .bmw-nav-links a{ color:var(--ink); }
.bmw-nav-links a::after{
  content:'';
  position:absolute;
  left:0; right:0; bottom:-2px;
  height:1px;
  background:var(--brand);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .3s var(--t);
}
.bmw-nav-links a:hover{ color:var(--brand); }
.bmw-nav-links a:hover::after{ transform:scaleX(1); }

.bmw-nav-cta{ display:flex; gap:14px; align-items:center; }
.bmw-nav-icons{ display:flex; gap:18px; color:#fff; transition:color .35s var(--t); }
.bmw-nav.scrolled .bmw-nav-icons{ color:var(--ink); }
.bmw-nav-icons a{
  width:22px; height:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:color .25s var(--t);
}
.bmw-nav-icons a:hover{ color:var(--brand); }
.bmw-nav-icons svg{ width:22px; height:22px; }

.bmw-menu-btn{
  display:none;
  flex-direction:column;
  gap:5px;
  padding:8px;
  background:none;
  border:none;
  cursor:pointer;
}
.bmw-menu-btn span{
  width:22px; height:2px;
  background:#fff;
  transition:background .35s var(--t);
}
.bmw-nav.scrolled .bmw-menu-btn span{ background:var(--ink); }

@media (max-width:1023px){
  .bmw-nav-links{ display:none; }
  .bmw-nav-icons{ display:none; }
  .bmw-nav-cta .btn{ display:none; }
  .bmw-menu-btn{ display:flex; }
}

/* — Mobile drawer — */
.bmw-mobile-drawer{
  position:fixed;
  top:0; right:-100%;
  width:88%;
  max-width:380px;
  height:100vh;
  background:#fff;
  z-index:101;
  padding:80px 32px 32px;
  transition:right .35s var(--t);
  box-shadow:-12px 0 32px rgba(0,0,0,.12);
  overflow-y:auto;
}
.bmw-mobile-drawer.open{ right:0; }
.bmw-mobile-drawer a{
  display:block;
  padding:16px 0;
  font-size:18px;
  font-weight:500;
  color:var(--ink);
  border-bottom:1px solid var(--line);
}
.bmw-mobile-drawer a:hover{ color:var(--brand); }
.bmw-drawer-close{
  position:absolute;
  top:24px; right:24px;
  width:32px; height:32px;
  font-size:22px;
  color:var(--ink);
  background:none;
  border:none;
  cursor:pointer;
}
.bmw-drawer-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.4);
  z-index:99;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s var(--t);
}
.bmw-drawer-overlay.show{
  opacity:1;
  pointer-events:auto;
}

/* ================================================================
   FULL-BLEED CINEMATIC SECTION — BMW's master pattern
   ================================================================ */
.bmw-cine{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:flex-end;
  padding:120px 0 80px;
  overflow:hidden;
}
.bmw-cine.short{ min-height:78vh; }

.bmw-cine-media{
  position:absolute;
  inset:0;
  z-index:0;
  background-size:cover;
  background-position:center;
}
/* dark gradient overlay on left for text legibility */
.bmw-cine-media::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg,
    rgba(0,0,0,.75) 0%,
    rgba(0,0,0,.45) 30%,
    rgba(0,0,0,.10) 60%,
    rgba(0,0,0,0) 80%);
}
.bmw-cine-media.placeholder::after{
  content:attr(data-prompt);
  position:absolute;
  top:80px; right:24px;
  z-index:2;
  max-width:340px;
  padding:12px 16px;
  text-align:right;
  color:rgba(255,255,255,.5);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-weight:500;
  border:1px dashed rgba(255,255,255,.3);
}

.bmw-cine-inner{
  position:relative;
  z-index:2;
  max-width:var(--shell);
  margin:0 auto;
  width:100%;
  padding:0 32px;
  color:#fff;
}
.bmw-cine .eyebrow{
  color:#fff;
  opacity:.9;
  margin-bottom:20px;
  font-size:13px;
  letter-spacing:.5em;
  font-weight:300;
}
.bmw-cine h1, .bmw-cine h2{
  font-size:clamp(56px, 9vw, 128px);
  font-weight:200;
  line-height:.95;
  letter-spacing:-.02em;
  text-transform:uppercase;
  margin-bottom:24px;
  color:#fff;
}
.bmw-cine h1 strong, .bmw-cine h2 strong{
  font-weight:700;
  display:block;
}
.bmw-cine .tagline{
  font-size:clamp(20px,2vw,28px);
  font-weight:400;
  letter-spacing:.02em;
  text-transform:uppercase;
  margin-bottom:18px;
  color:#fff;
}
.bmw-cine .sub{
  font-size:clamp(15px,1.1vw,17px);
  max-width:520px;
  color:rgba(255,255,255,.88);
  margin-bottom:32px;
  line-height:1.6;
}
.bmw-cine-btns{ display:flex; gap:12px; flex-wrap:wrap; }

/* ================================================================
   FIND YOUR PATH (3-up quick actions, BMW pattern)
   ================================================================ */
.bmw-findpath{
  background:var(--bg);
  padding:100px 0 110px;
  text-align:center;
}
.bmw-findpath .head{
  font-size:clamp(30px, 3.8vw, 48px);
  font-weight:300;
  letter-spacing:-.005em;
  margin-bottom:64px;
  color:var(--ink);
}
.bmw-findpath .head strong{ font-weight:700; }
.bmw-findpath-grid{
  max-width:var(--shell);
  margin:0 auto;
  padding:0 32px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:48px;
}
.bmw-fp-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:20px;
}
.bmw-fp-card .ico{
  width:96px; height:96px;
  display:block;
}
.bmw-fp-card h3{
  font-size:22px;
  font-weight:400;
  color:var(--ink);
  margin:4px 0 4px;
}
@media (max-width:767px){
  .bmw-findpath-grid{ grid-template-columns:1fr; gap:64px; }
}

/* ================================================================
   SPLIT OFFER — image-left / text-right
   ================================================================ */
.bmw-splitoffer{
  background:var(--bg);
  padding:100px 0;
}
.bmw-splitoffer-inner{
  max-width:var(--shell-wide);
  margin:0 auto;
  padding:0 32px;
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:80px;
  align-items:center;
}
.bmw-splitoffer-media{
  aspect-ratio:16/10;
  background:linear-gradient(135deg,#1a3a72,#0f2347);
  background-size:cover;
  background-position:center;
  position:relative;
  overflow:hidden;
}
.bmw-splitoffer-media.placeholder::after{
  content:attr(data-prompt);
  position:absolute;
  bottom:16px; left:16px; right:16px;
  color:rgba(255,255,255,.5);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  border:1px dashed rgba(255,255,255,.3);
  padding:10px 14px;
}
.bmw-splitoffer-copy h2{
  font-size:clamp(32px,3.5vw,48px);
  font-weight:300;
  letter-spacing:-.005em;
  margin-bottom:24px;
  color:var(--ink);
  text-transform:uppercase;
}
.bmw-splitoffer-copy h2 strong{ font-weight:700; }
.bmw-splitoffer-copy p{
  font-size:17px;
  color:var(--ink-2);
  line-height:1.7;
  margin-bottom:28px;
  max-width:480px;
}
@media (max-width:1023px){
  .bmw-splitoffer-inner{ grid-template-columns:1fr; gap:40px; }
}

/* ================================================================
   NEWSLETTER STRIP
   ================================================================ */
.bmw-newsletter{
  background:var(--bg-alt);
  padding:28px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.bmw-newsletter-inner{
  max-width:var(--shell);
  margin:0 auto;
  padding:0 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.bmw-newsletter-left{ display:flex; align-items:center; gap:18px; }
.bmw-newsletter-logo{
  width:46px; height:46px;
  border-radius:50%;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:4px;
  border:1px solid var(--line);
  flex-shrink:0;
}
.bmw-newsletter-logo img{ width:100%; height:100%; object-fit:contain; }
.bmw-newsletter-text{ font-size:15px; color:var(--ink); }
.bmw-newsletter-link{
  font-size:14px;
  font-weight:500;
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.bmw-newsletter-link::after{ content:'›'; font-size:18px; }
.bmw-newsletter-link:hover{ color:var(--brand); }

/* ================================================================
   GENERAL CONTENT SECTION (kept for restyling existing pages)
   ================================================================ */
.bmw-section{
  background:var(--bg);
  padding:100px 0;
}
.bmw-section.alt{ background:var(--bg-alt); }
.bmw-section.dark{ background:var(--ink); color:#fff; }
.bmw-section.dark p,
.bmw-section.dark li{ color:rgba(255,255,255,.8); }
.bmw-section-inner{
  max-width:var(--shell);
  margin:0 auto;
  padding:0 32px;
}
.bmw-section-head{
  margin-bottom:64px;
  max-width:760px;
}
.bmw-section-head .eyebrow{ margin-bottom:16px; }
.bmw-section-head h2{ margin-bottom:16px; }
.bmw-section-head p{
  font-size:17px;
  color:var(--ink-2);
  line-height:1.7;
}
.bmw-section.dark .bmw-section-head p{ color:rgba(255,255,255,.75); }

/* — Generic card grid — */
.bmw-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.bmw-card{
  background:var(--bg);
  border:1px solid var(--line);
  padding:32px;
  transition:all .3s var(--t);
  display:flex;
  flex-direction:column;
  gap:16px;
}
.bmw-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 32px rgba(0,0,0,.08);
}
.bmw-card h3{
  font-size:20px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.005em;
  color:var(--ink);
}
.bmw-card p{
  font-size:14px;
  color:var(--ink-2);
  line-height:1.6;
}
@media (max-width:1023px){ .bmw-cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:639px){  .bmw-cards{ grid-template-columns:1fr; } }

/* — Two-column split (for about/info pages) — */
.bmw-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
}
.bmw-split.flip > *:first-child{ order:2; }
@media (max-width:1023px){
  .bmw-split{ grid-template-columns:1fr; gap:40px; }
  .bmw-split.flip > *:first-child{ order:initial; }
}

/* — Stats — */
.bmw-stats{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.bmw-stat{
  background:var(--bg);
  padding:36px 28px;
}
.bmw-stat .num{
  font-size:48px;
  font-weight:300;
  line-height:1;
  color:var(--brand);
  margin-bottom:8px;
  letter-spacing:-.02em;
}
.bmw-stat .lbl{
  font-size:12px;
  color:var(--ink-2);
  text-transform:uppercase;
  letter-spacing:.1em;
  font-weight:500;
}

/* — Prose (for blog posts, terms, privacy, etc.) — */
.bmw-prose{
  max-width:760px;
  margin:0 auto;
  padding:120px 32px 80px;
  font-size:17px;
  line-height:1.8;
  color:var(--ink);
}
.bmw-prose h1{
  font-size:clamp(36px,5vw,56px);
  font-weight:300;
  letter-spacing:-.01em;
  text-transform:uppercase;
  margin-bottom:32px;
  line-height:1.05;
}
.bmw-prose h1 strong{ font-weight:700; }
.bmw-prose h2{
  font-size:28px;
  font-weight:600;
  margin:48px 0 16px;
  letter-spacing:-.005em;
}
.bmw-prose h3{
  font-size:21px;
  font-weight:600;
  margin:32px 0 12px;
}
.bmw-prose p{ margin-bottom:20px; color:var(--ink-2); }
.bmw-prose ul, .bmw-prose ol{
  margin:0 0 20px 24px;
  color:var(--ink-2);
}
.bmw-prose li{ margin-bottom:10px; line-height:1.7; }
.bmw-prose a{
  color:var(--brand);
  border-bottom:1px solid var(--brand-soft);
  transition:border-color .2s var(--t);
}
.bmw-prose a:hover{ border-bottom-color:var(--brand); }
.bmw-prose strong{ color:var(--ink); font-weight:600; }

/* ================================================================
   FOOTER
   ================================================================ */
.bmw-footer{
  background:var(--ink);
  color:rgba(255,255,255,.7);
  padding:80px 0 24px;
  font-size:13px;
}
.bmw-footer-inner{
  max-width:var(--shell);
  margin:0 auto;
  padding:0 32px;
}
.bmw-footer-cols{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:48px;
  padding-bottom:56px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.bmw-footer-cols h4{
  font-size:11px;
  font-weight:600;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.15em;
  margin-bottom:20px;
}
.bmw-footer-cols ul li{ margin-bottom:12px; }
.bmw-footer-cols a{
  color:rgba(255,255,255,.65);
  transition:color .25s var(--t);
}
.bmw-footer-cols a:hover{ color:#fff; }
.bmw-footer-brand-row{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}
.bmw-footer-brand-row img{
  width:38px; height:38px;
  background:#fff;
  border-radius:50%;
  padding:3px;
}
.bmw-footer-brand-row span{
  font-weight:700;
  font-size:14px;
  color:#fff;
  letter-spacing:.04em;
}
.bmw-footer-brand p{
  max-width:280px;
  line-height:1.6;
  margin-top:8px;
}
.bmw-footer-bottom{
  padding:24px 0;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  font-size:12px;
  color:rgba(255,255,255,.5);
}
.bmw-footer-bottom a{ color:rgba(255,255,255,.5); }
.bmw-footer-bottom a:hover{ color:#fff; }
@media (max-width:1023px){ .bmw-footer-cols{ grid-template-columns:1fr 1fr; } }
@media (max-width:639px){  .bmw-footer-cols{ grid-template-columns:1fr; } }

/* ================================================================
   SCROLL REVEAL — subtle, fires once, no loops
   ================================================================ */
.bmw-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .8s var(--t-slow), transform .8s var(--t-slow);
}
.bmw-reveal.in{
  opacity:1;
  transform:translateY(0);
}

/* ================================================================
   FORMS (for contact, signup, etc.)
   ================================================================ */
.bmw-form{
  display:flex;
  flex-direction:column;
  gap:20px;
  max-width:540px;
}
.bmw-form label{
  font-size:12px;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ink-2);
  margin-bottom:6px;
}
.bmw-form input,
.bmw-form textarea,
.bmw-form select{
  font-family:inherit;
  font-size:15px;
  color:var(--ink);
  background:var(--bg);
  border:1px solid var(--line);
  border-bottom:1px solid var(--ink);
  padding:14px 16px;
  border-radius:0;
  transition:border-color .25s var(--t);
  width:100%;
}
.bmw-form input:focus,
.bmw-form textarea:focus,
.bmw-form select:focus{
  outline:none;
  border-color:var(--brand);
}
.bmw-form textarea{ min-height:140px; resize:vertical; }

/* ================================================================
   PLACEHOLDER GRADIENTS (replace with real images when ready)
   ================================================================ */
.bg-hero-cine{
  background-image:url('../images/hero-locked-in-desktop.jpg');
  background-size:cover;
  background-position:center right;
}
@media (max-width:767px){
  .bg-hero-cine{
    background-image:url('../images/hero-locked-in-mobile.jpg');
  }
}
.bg-chakra{
  background:radial-gradient(ellipse at 65% 40%, #1c69d4 0%, #0a2860 35%, #050d22 70%, #000 100%);
}
.bg-netra{
  background:radial-gradient(ellipse at 55% 50%, #5e2a8a 0%, #2a1145 35%, #0e0820 70%, #000 100%);
}
.bg-gurukul{
  background:radial-gradient(ellipse at 70% 60%, #8a5a2a 0%, #4a2e10 35%, #1a1006 70%, #000 100%);
}
.bg-premium{
  background:linear-gradient(135deg,#1a3a72 0%,#0f2347 100%);
}

/* — hide placeholder label on hero (real image is loaded) — */
.bmw-cine.hero .bmw-cine-media::after{ display:none; }

/* ================================================================
   UTILITY
   ================================================================ */
.text-center{ text-align:center; }
.no-select{ user-select:none; }
.hidden{ display:none !important; }
@media (max-width:1023px){
  .hide-tablet{ display:none !important; }
}
@media (max-width:767px){
  .hide-mobile{ display:none !important; }
}


/* ================================================================
   OCCASION OVERLAY — festive welcome (Ram Navami / Diwali / etc.)
   Triggered by /js/occasion.js when /data/occasions.json has
   active:true and today falls within startDate..endDate.
   ================================================================ */
#occasionOverlay{
  position:fixed;
  inset:0;
  z-index:100000;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .6s var(--t);
}
#occasionOverlay.oc-show{ opacity:1; pointer-events:auto }
#occasionOverlay.oc-hide{ opacity:0; pointer-events:none }
.oc-backdrop{
  position:absolute;
  inset:0;
  background:rgba(38,38,38,.92);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.oc-content{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:24px;
  padding:32px;
  max-width:720px;
  width:90%;
  animation:ocSlideUp .7s var(--t-slow) both;
}
#occasionOverlay.oc-show .oc-content{ animation:ocSlideUp .7s var(--t-slow) both }
#occasionOverlay.oc-hide .oc-content{ animation:ocSlideDown .5s var(--t) both }
.oc-img{
  width:100%;
  max-height:70vh;
  object-fit:contain;
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 80px rgba(28,105,212,.18);
}
.oc-close{
  position:absolute;
  top:-12px; right:-12px;
  width:42px; height:42px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.25);
  background:var(--ink);
  color:#fff;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:3;
  transition:all .25s var(--t);
}
.oc-close:hover{
  background:var(--brand);
  border-color:var(--brand);
  transform:scale(1.08);
}
.oc-enter{
  font-family:inherit;
  font-size:12px;
  font-weight:500;
  background:var(--brand);
  color:#fff;
  padding:14px 36px;
  letter-spacing:.12em;
  text-transform:uppercase;
  border:none;
  cursor:pointer;
  transition:background .25s var(--t), transform .25s var(--t);
  position:relative;
  overflow:hidden;
  border-radius:0;
}
.oc-enter::before{
  content:'';
  position:absolute;
  top:0; left:-100%;
  width:100%; height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);
  transition:left .55s var(--t-slow);
}
.oc-enter:hover{ background:var(--brand-hover); transform:translateY(-1px) }
.oc-enter:hover::before{ left:100% }

@keyframes ocSlideUp{
  from{ opacity:0; transform:translateY(40px) }
  to  { opacity:1; transform:translateY(0)    }
}
@keyframes ocSlideDown{
  from{ opacity:1; transform:translateY(0)   }
  to  { opacity:0; transform:translateY(30px)}
}
@media(max-width:768px){
  #occasionOverlay{ align-items:flex-start; overflow-y:auto; padding:24px 0 }
  .oc-content{ padding:16px; gap:14px; width:94%; margin:auto }
  .oc-img{ max-height:60vh }
  .oc-close{ top:-6px; right:-6px; width:36px; height:36px; font-size:18px }
  .oc-enter{ padding:12px 28px; font-size:11px }
}
@media(max-width:480px){
  .oc-img{ max-height:50vh }
  .oc-content{ gap:12px; padding:12px }
}


/* ================================================================
   MAITRAYI — FULL BMW RETINT (full pill + chat panel + accents)
   Redefines --mt-* CSS variables after maitrayi.css loads.
   maitrayi.css itself stays byte-for-byte untouched — this is a
   pure cascade override. Roll back by deleting this block.
   ================================================================ */
:root{
  /* Gold → BMW blue family */
  --mt-gold:      #1c69d4;
  --mt-gold-v:    #3a7ee0;
  --mt-gold-l:    #5a96e8;
  --mt-gold-p:    #dde8f9;
  --mt-gold-d:    #0653b6;

  /* Glow → BMW blue */
  --mt-glow:      rgba(28,105,212,.45);
  --mt-glow-soft: rgba(28,105,212,.18);

  /* Dark surfaces → BMW deep navy-ink (not warm brown) */
  --mt-ink-0: #060a13;
  --mt-ink-1: #0a1020;
  --mt-ink-2: #0e162a;
  --mt-ink-3: #131c33;

  /* Saffron / maroon accents → BMW supporting tones */
  --mt-maroon: #0a1830;
  --mt-saffron: #3a7ee0;
  --mt-lotus: #f0f5fc;

  /* Surfaces */
  --mt-chip-bg: rgba(20,28,48,.78);
  --mt-bubble-me:  linear-gradient(145deg, rgba(28,105,212,.92) 0%, rgba(6,83,182,.92) 100%);
  --mt-bubble-her: linear-gradient(145deg, rgba(28,105,212,.08) 0%, rgba(58,126,224,.02) 100%);

  /* Shadows — use BMW blue glow instead of gold */
  --mt-shadow-deep: 0 30px 80px rgba(0,0,0,.65), 0 0 0 1px rgba(28,105,212,.14) inset, 0 0 40px rgba(28,105,212,.08) inset;

  /* Text tones — cool whites instead of cream/champagne */
  --mt-t0: #ffffff;
  --mt-t1: #e6eef9;
  --mt-t2: #a0b3cf;
  --mt-t3: #6a7c99;
  --mt-t4: #4a5a78;
}

/* Pill label: warm brown → cool BMW dark gradient */
.mt-pill-label{
  background:linear-gradient(135deg,#0a1020 0%,#0e162a 50%,#0a1020 100%) !important;
  border-color:var(--mt-gold-d) !important;
  box-shadow:0 6px 22px rgba(0,0,0,.45), inset 0 0 12px rgba(28,105,212,.12) !important;
}
.mt-pill-label::before{
  background:linear-gradient(135deg,rgba(28,105,212,.12),transparent 60%) !important;
}

/* Pill text: gold-d → BMW brand */
.mt-pill-ask{ color:var(--mt-gold-v) !important; }
.mt-pill-name{ color:#ffffff !important; }
.mt-pill-status{ color:var(--mt-gold-l) !important; }

/* Pill avatar ring */
.mt-pill-avatar{
  border-color:var(--mt-gold) !important;
  box-shadow:0 0 18px var(--mt-glow), 0 4px 14px rgba(0,0,0,.4) !important;
}
.mt-pill-avatar::after{
  background:radial-gradient(circle at 30% 30%, rgba(28,105,212,.4), transparent 70%) !important;
}
.mt-pill:hover .mt-pill-avatar{
  box-shadow:0 0 28px var(--mt-glow), 0 0 0 3px rgba(28,105,212,.25), 0 6px 18px rgba(0,0,0,.5) !important;
}

/* Pill close button */
.mt-pill-close:hover{
  background:#0e162a !important;
  border-color:var(--mt-gold) !important;
  color:var(--mt-gold-p) !important;
}

/* Send button & action pill */
.mt-action-pill{ background:var(--mt-gold) !important; color:#fff !important; }
.mt-action-pill:hover{ background:var(--mt-gold-d) !important; }

/* Mic button when speaking */
.mt-mic.mt-active, .mt-mic:hover{
  background:var(--mt-gold) !important;
  color:#fff !important;
}

/* Chat panel itself */
.mt-panel{
  background:linear-gradient(160deg,#0a1020 0%,#060a13 100%) !important;
  border-color:rgba(28,105,212,.18) !important;
}

/* Hero (top of chat panel) */
.mt-hero{
  background:linear-gradient(140deg, rgba(28,105,212,.08) 0%, rgba(10,16,32,0) 100%) !important;
  border-bottom-color:rgba(28,105,212,.15) !important;
}
.mt-hero-name{ color:#ffffff !important; }
.mt-hero-sub{ color:var(--mt-t2) !important; }
.mt-hero-status{ color:var(--mt-gold-l) !important; }
.mt-hero-portrait{
  border-color:var(--mt-gold) !important;
  box-shadow:0 0 24px var(--mt-glow), 0 6px 20px rgba(0,0,0,.5) !important;
}
.mt-hero-portrait::before,
.mt-hero-portrait::after{
  background:conic-gradient(from 0deg, var(--mt-gold), var(--mt-gold-v), var(--mt-gold), transparent) !important;
}
.mt-hero-close{
  color:var(--mt-t2) !important;
}
.mt-hero-close:hover{
  color:var(--mt-gold) !important;
  background:rgba(28,105,212,.10) !important;
}

/* User message bubble (right side) */
.mt-msg-me .mt-msg-bubble{
  background:var(--mt-bubble-me) !important;
  color:#fff !important;
  border-color:rgba(28,105,212,.4) !important;
}
.mt-msg-me .mt-msg-time{ color:rgba(255,255,255,.7) !important; }

/* Maitrayi message bubble (left side) */
.mt-msg-her .mt-msg-bubble{
  background:var(--mt-bubble-her) !important;
  color:var(--mt-t0) !important;
  border-color:rgba(28,105,212,.16) !important;
}
.mt-msg-her .mt-msg-time{ color:var(--mt-t3) !important; }

/* Avatar in chat */
.mt-msg-av{ border-color:var(--mt-gold) !important; }

/* Input row */
.mt-input-row{
  background:rgba(10,16,32,.65) !important;
  border-top-color:rgba(28,105,212,.18) !important;
}
.mt-input{
  background:rgba(20,28,48,.6) !important;
  color:#fff !important;
  border-color:rgba(28,105,212,.22) !important;
}
.mt-input::placeholder{ color:var(--mt-t3) !important; }
.mt-input:focus{ border-color:var(--mt-gold) !important; }

/* Chips */
.mt-chip, .mt-chip-cat{
  background:var(--mt-chip-bg) !important;
  border-color:rgba(28,105,212,.22) !important;
  color:var(--mt-t1) !important;
}
.mt-chip:hover, .mt-chip-cat:hover{
  background:rgba(28,105,212,.15) !important;
  border-color:var(--mt-gold) !important;
  color:#fff !important;
}

/* Command bar */
.mt-cmd-bar{ background:rgba(10,16,32,.8) !important; }
.mt-cmd-btn{ color:var(--mt-t2) !important; }
.mt-cmd-btn:hover{ color:var(--mt-gold-l) !important; }
.mt-cmd-btn-badge{ background:var(--mt-gold) !important; color:#fff !important; }

/* Equaliser / dots / pulsing decorations */
.mt-eq-bar{ background:var(--mt-gold) !important; }
.mt-dot{ background:var(--mt-gold) !important; }

/* Backdrop */
.mt-backdrop{ background:rgba(6,10,19,.78) !important; }

/* Bloom petals (decorative) */
.mt-bloom-petal{
  background:radial-gradient(circle at 30% 30%, var(--mt-gold-v), var(--mt-gold-d)) !important;
}

/* Scrollbar inside chat */
.mt-chat::-webkit-scrollbar-thumb{ background:rgba(28,105,212,.4) !important; }
.mt-chat::-webkit-scrollbar-thumb:hover{ background:var(--mt-gold) !important; }

/* === BMW-style footer social icons === */
.bmw-footer-social{display:flex;flex-direction:column;gap:14px}
.bmw-footer-social h4{
  margin:0 0 4px;
  font-size:11px;
  font-weight:600;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#fff;
}
.bmw-social-row{
  display:flex;
  gap:10px;
  list-style:none;
  padding:0;
  margin:0;
  flex-wrap:nowrap;
}
.bmw-social-row li{margin:0;flex-shrink:0}
.bmw-social-row a{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;
  border:1px solid rgba(255,255,255,0.2);
  color:rgba(255,255,255,0.85);
  transition:all .25s ease;
  background:transparent;
}
.bmw-social-row a:hover{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
  transform:translateY(-2px);
}
.bmw-social-row a svg{display:block;fill:currentColor}
@media (max-width:980px){
  .bmw-social-row a{width:36px;height:36px}
}
@media (max-width:720px){
  .bmw-social-row{gap:8px}
  .bmw-social-row a{width:34px;height:34px}
}
@media (max-width:400px){
  .bmw-social-row{gap:6px}
  .bmw-social-row a{width:32px;height:32px}
}

/* === BMW theme overrides for store-tour play button === */
:root{
  --cst-gold: #1c69d4;
  --cst-gold-light: #3a7ee0;
  --cst-gold-dark: #0653b6;
}
.cst-btn{
  border-radius:0 !important;
  background:#fff !important;
  color:var(--ink,#262626) !important;
  border:1px solid var(--line,#e6e6e6) !important;
  box-shadow:none !important;
  font-family:'Inter Tight',sans-serif !important;
  max-width:520px;
  margin:0 auto;
}
.cst-btn:hover{
  background:var(--brand,#1c69d4) !important;
  color:#fff !important;
  border-color:var(--brand,#1c69d4) !important;
  transform:translateY(-2px);
}
.cst-btn:hover .cst-btn-icon{ background:rgba(255,255,255,0.15) !important; }
.cst-btn:hover .cst-btn-sub{ color:rgba(255,255,255,0.85) !important; }
.cst-btn-icon{
  background:var(--brand,#1c69d4) !important;
  color:#fff !important;
  border-radius:0 !important;
  border:none !important;
}
.cst-btn-icon svg{ fill:#fff; }
.cst-btn-title{
  color:inherit !important;
  font-weight:700 !important;
  letter-spacing:.02em !important;
  text-transform:uppercase;
  font-size:14px !important;
}
.cst-btn-sub{
  color:var(--ink-3,#8e8e8e) !important;
  font-size:11px !important;
  letter-spacing:.15em !important;
  text-transform:uppercase;
}
.cst-mount-wrap{
  display:flex;
  justify-content:center;
  padding:24px 0;
}