/*
Theme Name:  Badlaav Native
Theme URI:   https://badlaavfoundation.in
Description: Elementor-native v2.3 theme for Badlaav Foundation. Zero layout opinions — all visual design lives in Elementor templates. Registers brand tokens, animation classes, and font preloads.
Author:      Badlaav Foundation
Author URI:  https://badlaavfoundation.in
Version:     2.3.0
Requires at least: 6.3
Tested up to:      6.7
Requires PHP:      8.1
License:     GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: badlaav-native
Tags:        full-site-editing, elementor, custom-logo
*/

/* =============================================================================
   BRAND TOKENS  — available as CSS variables everywhere
   ============================================================================= */
:root {
  --bl-ink:     #1B2951;
  --bl-sky:     #2E8DD8;
  --bl-teal:    #0DAFA4;
  --bl-lime:    #8DC640;
  --bl-saffron: #E8A33D;
  --bl-terra:   #D17456;
  --bl-plum:    #6B4A7E;
  --bl-cream:   #F7F3EB;
  --bl-cream2:  #FAF7F0;
  --bl-stone:   #E5E0D5;
  --bl-wg:      #6B6B66;
  --bl-H:       clamp(28px, 4vw, 60px);
  --bl-SV:      clamp(64px, 7vw, 100px);
}

/* =============================================================================
   BASE RESET  (minimal — Elementor handles layout)
   ============================================================================= */
*, *::before, *::after { box-sizing: border-box; }
html  { scroll-behavior: smooth; }
body  {
  font-family: 'DM Sans', system-ui, sans-serif;
  background: var(--bl-cream);
  color: var(--bl-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
}
img   { display: block; max-width: 100%; }
a     { text-decoration: none; }

/* =============================================================================
   STICKY NAV STATE  — Elementor sticky adds .elementor-sticky--active
   ============================================================================= */
.elementor-sticky--active { box-shadow: 0 2px 24px rgba(0,0,0,.30); transition: box-shadow .3s; }

/* =============================================================================
   GRADIENT BAR  — apply .bl-grad-bar to any divider / container
   ============================================================================= */
.bl-grad-bar {
  height: 5px;
  background: linear-gradient(to right, var(--bl-ink), var(--bl-sky), var(--bl-teal),
              var(--bl-lime), var(--bl-saffron), var(--bl-terra), var(--bl-plum));
}

/* =============================================================================
   MARQUEE TICKER  — .badlaav-marquee on container, .badlaav-marquee-track on inner
   ============================================================================= */
.badlaav-marquee { overflow: hidden; }
.badlaav-marquee-track {
  display: flex; gap: 3rem;
  animation: bl-marquee 28s linear infinite;
  width: max-content;
}
.badlaav-marquee:hover .badlaav-marquee-track { animation-play-state: paused; }
@keyframes bl-marquee { to { transform: translateX(-50%); } }

/* =============================================================================
   SECTION TAG  — .bl-sec-tag on text widget
   ============================================================================= */
.bl-sec-tag {
  font-size: 11px; font-weight: 500; letter-spacing: .22em;
  text-transform: uppercase; color: var(--bl-wg);
  display: flex; align-items: center; gap: 14px;
}
.bl-sec-tag::before {
  content: ''; display: inline-block;
  width: 32px; height: 1px;
  background: var(--bl-stone); flex-shrink: 0;
}
.bl-sec-tag--dark { color: rgba(247,243,235,.38); }
.bl-sec-tag--dark::before { background: rgba(247,243,235,.18); }

/* =============================================================================
   LINE REVEAL  — overflow clip container for GSAP line animations
   ============================================================================= */
.bl-line-wrap { display: block; overflow: hidden; }

/* =============================================================================
   CARD ACCENT BARS  — top 4px colour stripe on programme cards
   ============================================================================= */
.bl-accent-teal   { border-top: 4px solid var(--bl-teal)   !important; }
.bl-accent-sky    { border-top: 4px solid var(--bl-sky)    !important; }
.bl-accent-lime   { border-top: 4px solid var(--bl-lime)   !important; }
.bl-accent-saffron{ border-top: 4px solid var(--bl-saffron)!important; }
.bl-accent-plum   { border-top: 4px solid var(--bl-plum)   !important; }
.bl-accent-terra  { border-top: 4px solid var(--bl-terra)  !important; }

/* =============================================================================
   UTILITY
   ============================================================================= */
.u-overflow-hidden { overflow: hidden !important; }
.u-relative        { position: relative !important; }
.u-no-select       { user-select: none !important; }
.u-pointer-none    { pointer-events: none !important; }
.u-w-full          { width: 100% !important; }

/* =============================================================================
   ELEMENTOR OVERRIDE  — remove default section padding so templates are exact
   ============================================================================= */
.elementor-section.elementor-section-boxed > .elementor-container { max-width: 100%; }
.elementor-widget-heading .elementor-heading-title { margin: 0; }

/* =============================================================================
   ACCESSIBILITY — reduced motion
   ============================================================================= */
@media (prefers-reduced-motion: reduce) {
  [class*="badlaav-"] {
    opacity: 1 !important; transform: none !important;
    clip-path: none !important; transition: none !important;
    animation: none !important;
  }
  .badlaav-marquee-track { animation: none !important; flex-wrap: wrap; }
  .bl-line-wrap { overflow: visible !important; }
}
/* ── BADLAAV HEADER EXTRAS ─────────────────────────────── */
#bf-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:10000;background:linear-gradient(to right,#2E8DD8,#0DAFA4,#8DC640,#E8A33D,#D17456,#6B4A7E);transform-origin:0 50%;transform:scaleX(0);pointer-events:none;animation:bf-grow linear both;animation-timeline:scroll(root block);}
@keyframes bf-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
#bf-back-top{position:fixed;bottom:32px;right:32px;z-index:9998;width:46px;height:46px;border-radius:50%;background:rgba(27,41,81,.95);border:1.5px solid rgba(247,243,235,.15);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .3s,transform .3s,border-color .2s,box-shadow .2s;box-shadow:0 4px 20px rgba(0,0,0,.3);}
#bf-back-top.show{opacity:1;transform:translateY(0);pointer-events:auto;}
#bf-back-top:hover{border-color:rgba(141,198,64,.6);box-shadow:0 4px 20px rgba(0,0,0,.4),0 0 0 3px rgba(141,198,64,.12);}
#bf-back-top svg{color:#F7F3EB;opacity:.7;transition:opacity .2s,transform .2s;}
#bf-back-top:hover svg{opacity:1;transform:translateY(-2px);}
#bf-back-top::before{content:'';position:absolute;inset:-3px;border-radius:50%;background:conic-gradient(from 0deg,#2E8DD8,#0DAFA4,#8DC640,#E8A33D,#D17456,#6B4A7E,#2E8DD8);z-index:-1;opacity:0;transition:opacity .2s;}
#bf-back-top:hover::before{opacity:.7;}
#bf-overlay{position:fixed;inset:0;z-index:9997;background:rgba(0,0,0,0);pointer-events:none;transition:background .35s;}
#bf-overlay.open{background:rgba(0,0,0,.5);pointer-events:auto;}
#bf-drawer{position:fixed;top:0;right:0;bottom:0;width:min(320px,90vw);background:rgba(18,27,52,.98);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border-left:1px solid rgba(247,243,235,.08);z-index:9998;padding:88px 28px 40px;transform:translateX(100%);transition:transform .35s cubic-bezier(.32,.72,0,1);overflow-y:auto;}
#bf-drawer.open{transform:translateX(0);}
.bf-drawer-link{display:flex;justify-content:space-between;align-items:center;font-family:'DM Sans',sans-serif;font-size:15px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:rgba(247,243,235,.7);padding:17px 0;border-bottom:1px solid rgba(247,243,235,.07);transition:color .2s;cursor:pointer;text-decoration:none;}
.bf-drawer-link:hover{color:#F7F3EB;}
.bf-sub-items{max-height:0;overflow:hidden;transition:max-height .3s ease;border-bottom:1px solid rgba(247,243,235,.07);}
.bf-sub-items.open{max-height:200px;}
.bf-sub-link{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:13px;color:rgba(247,243,235,.55);transition:color .15s,background .15s;text-decoration:none;}
.bf-sub-link:hover{color:#F7F3EB;background:rgba(247,243,235,.06);}
.bf-drawer-cta{display:block;text-align:center;margin-top:28px;padding:14px;background:#8DC640;color:#fff;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;border-radius:10px;text-decoration:none;}
.bf-drawer-socials{display:flex;gap:20px;margin-top:20px;padding-top:20px;border-top:1px solid rgba(247,243,235,.07);}
.bf-drawer-social{font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:rgba(247,243,235,.38);text-decoration:none;transition:color .2s;}
.bf-drawer-social:hover{color:rgba(247,243,235,.7);}