/* ═══════════════════════════════════════════════════════════
   YEAH8motion — Master Stylesheet v6.0
   Palette (from YEAH8 logo):
     --pd  : #2D0E6B  Deep Purple   → nav bg, dark sections
     --pm  : #5A1FA0  Mid Purple    → headings, accents
     --pl  : #9B5DE5  Light Purple  → highlights
     --gold: #FFD700  Gold          → CTA buttons, active states
     --pk  : #E91E8C  Pink          → accents, stripe
     --pkl : #FF6FC8  Pink Light
     --teal: #00C9B1  Teal          → eyebrows, tags
     --w   : #FFFFFF  White
     --ow  : #F5F0FF  Off-White     → page background
     --td  : #1A0940  Text Dark
     --tmut: #7A6A9A  Text Muted
═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700;800;900&family=Poppins:wght@400;500;600&display=swap');

/* ─── TOKENS ─────────────────────────────────────────────── */
:root {
  --pd:#2D0E6B; --pm:#5A1FA0; --pl:#9B5DE5;
  --gold:#FFD700; --goldd:#C8A800;
  --pk:#E91E8C; --pkl:#FF6FC8;
  --teal:#00C9B1; --teald:#009E8A;
  --w:#FFFFFF; --ow:#F5F0FF; --gl:#F0EEF8;
  --td:#1A0940; --tm:#4B2D8A; --tmut:#7A6A9A;
  --grn:#1A6B1A; --red:#8B0000;
  --sh-sm:0 4px 16px rgba(45,14,107,.08);
  --sh-md:0 8px 28px rgba(45,14,107,.14);
  --sh-lg:0 16px 48px rgba(45,14,107,.22);
  --radius:16px; --nav-h:68px;
}

/* ─── RESET ──────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Poppins',sans-serif;background:var(--ow);color:var(--td);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
button{cursor:pointer;font-family:inherit}
input,select,textarea{font-family:inherit;width:100%}

/* ─── ANIMATED STRIPE ────────────────────────────────────── */
.stripe{
  height:60px;width:100%;
  background:linear-gradient(90deg,var(--pm),var(--pk),var(--gold),var(--teal),var(--pm));
  background-size:200% 100%;
  animation:stripe-run 4s linear infinite;
}
@keyframes stripe-run{to{background-position:200% 0}}

/* ─── NAV ────────────────────────────────────────────────── */
.nav{
  background:var(--pd);height:var(--nav-h);padding:0 2.5rem;
  display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;z-index:300;
  box-shadow:0 2px 18px rgba(0,0,0,.35);
}
.nav-logo{display:flex;align-items:center;gap:22px;text-decoration:none;flex-shrink:0}
.nav-logo-img{
  width:64px;height:64px;object-fit:contain;border-radius:10px;
  filter:drop-shadow(0 0 8px rgba(255,215,0,.4));
  transition:filter .3s,transform .3s;
}
.nav-logo:hover .nav-logo-img{
  filter:drop-shadow(0 0 16px rgba(255,215,0,.85));
  transform:scale(1.06);
}
.nav-logo-text{display:flex;flex-direction:column;line-height:1}
.nav-logo-name{
  font-family:'Nunito',sans-serif;font-weight:900;
  font-size:1.32rem;color:var(--w);letter-spacing:1.5px;
}
.nav-logo-name span{color:var(--gold)}
.nav-logo-sub{
  font-size:.48rem;color:var(--teal);
  letter-spacing:2.5px;text-transform:uppercase;font-weight:700;margin-top:3px;
}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-btn{
  color:rgba(255,255,255,.92);padding:7px 9px;border-radius:7px;
  font-size:.71rem;font-weight:600;transition:all .18s;white-space:nowrap;
  text-decoration:none;display:inline-block;
}
.nav-btn:hover,.nav-btn.active{background:rgba(255,215,0,.15);color:var(--gold)}
.nav-cta{
  background:var(--gold);color:#1A0940;padding:8px 16px;border-radius:8px;
  font-family:'Nunito',sans-serif;font-weight:900;font-size:.75rem;
  transition:all .18s;margin-left:6px;display:inline-block;text-decoration:none;
}
.nav-cta:hover{background:#ffe033;transform:translateY(-1px);box-shadow:0 4px 14px rgba(255,215,0,.35)}

/* Hamburger */
.nav-hamburger{
  display:none;flex-direction:column;gap:5px;padding:6px;
  background:none;border:none;
}
.nav-hamburger span{
  display:block;width:22px;height:2px;background:rgba(255,255,255,.8);
  border-radius:2px;transition:all .25s;
}
.nav-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-hamburger.open span:nth-child(2){opacity:0}
.nav-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Mobile drawer */
.nav-drawer{
  display:none;position:fixed;top:var(--nav-h);left:0;right:0;
  background:var(--pd);z-index:299;padding:10px 16px 20px;
  border-top:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 32px rgba(0,0,0,.45);
}
.nav-drawer.open{display:block}
.nav-drawer .nav-btn{display:block;padding:12px 14px;font-size:.82rem;border-radius:8px;margin-bottom:3px}
.nav-drawer .nav-cta{display:block;text-align:center;margin-top:10px;padding:12px;border-radius:10px;font-size:.84rem}

/* ─── PAGE HERO (inner pages) ────────────────────────────── */
.page-hero{
  background:var(--pd);
  padding:clamp(2.2rem,5vw,3.2rem) 2rem clamp(1.8rem,4vw,2.6rem);
  text-align:center;position:relative;overflow:hidden;
}
.page-hero::before,.page-hero::after{
  content:'';position:absolute;border-radius:50%;pointer-events:none;
}
.page-hero::before{
  top:-80px;left:-80px;width:280px;height:280px;
  background:radial-gradient(circle,rgba(155,93,229,.3) 0%,transparent 70%);
}
.page-hero::after{
  bottom:-50px;right:-50px;width:260px;height:260px;
  background:radial-gradient(circle,rgba(233,30,140,.25) 0%,transparent 70%);
}
.ph-eyebrow{
  font-family:'Nunito',sans-serif;font-weight:800;font-size:.72rem;
  color:var(--teal);letter-spacing:3.5px;text-transform:uppercase;
  position:relative;z-index:1;margin-bottom:.65rem;display:block;
}
.ph-title{
  font-family:'Nunito',sans-serif;font-weight:900;
  font-size:clamp(1.6rem,4vw,2.2rem);color:var(--w);
  position:relative;z-index:1;margin-bottom:.4rem;line-height:1.15;
}
.ph-title em{color:var(--gold);font-style:normal}
.ph-sub{
  font-size:clamp(.83rem,2vw,.92rem);color:rgba(255,255,255,.62);
  position:relative;z-index:1;max-width:580px;
  margin:0 auto;line-height:1.7;
}

/* ─── SECTION TYPOGRAPHY ─────────────────────────────────── */
.sec-ey{
  font-family:'Nunito',sans-serif;font-weight:800;font-size:.72rem;
  color:var(--teal);letter-spacing:3px;text-transform:uppercase;
  margin-bottom:.55rem;display:block;
}
.sec-h2{
  font-family:'Nunito',sans-serif;font-weight:900;
  font-size:clamp(1.6rem,3vw,2.2rem);color:var(--pm);margin-bottom:.6rem;
}
.sec-desc{font-size:.9rem;color:#5A4880;max-width:640px;line-height:1.75;margin-bottom:2.5rem}

/* ─── BUTTONS ────────────────────────────────────────────── */
.btn-primary{
  background:var(--gold);color:#1A0940;font-family:'Nunito',sans-serif;
  font-weight:900;font-size:.9rem;padding:.85rem 2.2rem;border-radius:50px;
  border:none;cursor:pointer;letter-spacing:.5px;text-decoration:none;
  display:inline-block;transition:all .2s;
}
.btn-primary:hover{background:#ffe033;transform:translateY(-2px);box-shadow:0 6px 20px rgba(255,215,0,.35)}
.btn-outline{
  background:transparent;color:var(--w);font-family:'Nunito',sans-serif;
  font-weight:800;font-size:.9rem;padding:.85rem 2.2rem;border-radius:50px;
  border:2px solid rgba(255,255,255,.4);cursor:pointer;text-decoration:none;
  display:inline-block;transition:all .2s;
}
.btn-outline:hover{border-color:var(--w);background:rgba(255,255,255,.1)}
.btn-purple{
  background:var(--pm);color:var(--w);font-family:'Nunito',sans-serif;
  font-weight:900;font-size:.88rem;padding:.75rem 2rem;border-radius:50px;
  border:none;cursor:pointer;text-decoration:none;display:inline-block;transition:all .2s;
}
.btn-purple:hover{background:var(--pd);transform:translateY(-1px)}
.btn-teal{
  background:var(--teal);color:var(--pd);font-family:'Nunito',sans-serif;
  font-weight:900;font-size:.88rem;padding:.75rem 2rem;border-radius:50px;
  border:none;cursor:pointer;text-decoration:none;display:inline-block;transition:all .2s;
}
.btn-teal:hover{background:var(--teald);transform:translateY(-1px)}
.btn-ghost{
  background:none;border:1.5px solid #ddd;color:var(--tmut);
  font-family:'Nunito',sans-serif;font-weight:700;font-size:.85rem;
  padding:.7rem 1.8rem;border-radius:50px;cursor:pointer;
  display:inline-block;transition:all .2s;
}
.btn-ghost:hover{border-color:var(--pm);color:var(--pm)}
.btn-back{
  background:none;border:1.5px solid #ddd;color:var(--tmut);
  padding:.72rem 1.8rem;border-radius:50px;font-size:.85rem;font-weight:700;
  font-family:'Nunito',sans-serif;cursor:pointer;transition:all .2s;
}
.btn-back:hover{border-color:var(--pm);color:var(--pm)}
.btn-next{
  background:var(--pd);color:#fff;border:none;padding:.72rem 2rem;
  border-radius:50px;font-size:.85rem;font-weight:900;
  font-family:'Nunito',sans-serif;cursor:pointer;transition:all .2s;
}
.btn-next:hover{background:#1A0940;transform:translateY(-1px)}
.btn-gold{
  background:var(--gold);color:#1A0940;border:none;padding:.82rem 2.3rem;
  border-radius:50px;font-size:.9rem;font-weight:900;
  font-family:'Nunito',sans-serif;cursor:pointer;transition:all .2s;
}
.btn-gold:hover{background:#ffe033;transform:translateY(-1px);box-shadow:0 5px 18px rgba(255,215,0,.3)}

/* ─── CARDS ──────────────────────────────────────────────── */
.card{
  background:var(--w);border-radius:var(--radius);
  padding:clamp(1.4rem,3vw,2rem);
  box-shadow:var(--sh-sm);border:1px solid rgba(90,31,160,.1);
  margin-bottom:1.4rem;
}
.card h3{
  font-family:'Nunito',sans-serif;font-weight:900;
  font-size:1.15rem;color:var(--pd);margin-bottom:1rem;
}

/* ─── FORMS ──────────────────────────────────────────────── */
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.fg{display:flex;flex-direction:column;gap:5px}
.fg.full{grid-column:1/-1}
.fg label{
  font-size:.7rem;font-weight:700;color:var(--pd);
  text-transform:uppercase;letter-spacing:.6px;font-family:'Nunito',sans-serif;
}
.fg input,.fg select,.fg textarea{
  border:1.5px solid #ddd;border-radius:9px;padding:.72rem .9rem;
  font-size:.88rem;outline:none;transition:border .2s,box-shadow .2s;
  background:var(--w);color:var(--td);width:100%;
}
.fg input:focus,.fg select:focus,.fg textarea:focus{
  border-color:var(--pm);box-shadow:0 0 0 3px rgba(90,31,160,.1);
}
.fg input::placeholder,.fg textarea::placeholder{color:#bbb}
.fg select option{color:var(--td);background:var(--w)}

/* Form notices and alerts */
.notice{
  background:#FFF8DC;border:1px solid var(--gold);border-radius:12px;
  padding:1.1rem 1.3rem;margin-bottom:1.4rem;font-size:.84rem;color:#5a3d00;
  line-height:1.6;
}
.notice strong{color:var(--pd)}
.box-err{
  background:#FEF0EF;border:1px solid #F5C6C4;border-radius:9px;
  padding:.72rem 1rem;font-size:.8rem;color:var(--red);
  margin-bottom:.8rem;display:none;
}
.box-ok{
  background:#EDF7EE;border:1px solid #A8D5AA;border-radius:9px;
  padding:.72rem 1rem;font-size:.8rem;color:#155724;
  margin-bottom:.8rem;display:none;
}
.check-row{
  display:flex;align-items:flex-start;gap:10px;
  padding:.8rem 1rem;background:var(--ow);border-radius:9px;margin-bottom:.6rem;
}
.check-row input[type=checkbox]{
  width:17px;height:17px;accent-color:var(--pm);
  flex-shrink:0;margin-top:2px;
}
.check-row label{font-size:.84rem;color:var(--td);line-height:1.5}

/* Summary box */
.sum-box{background:var(--ow);border-radius:12px;padding:1.3rem;margin-bottom:1.3rem}
.sum-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:.5rem 0;border-bottom:1px solid rgba(90,31,160,.1);font-size:.88rem;
}
.sum-row:last-child{border-bottom:none;font-weight:700;color:var(--pd);font-size:.98rem}
.sum-lbl{color:var(--tmut)}

/* Step bar */
.step-bar{
  display:flex;align-items:center;justify-content:center;
  margin:1.8rem 0;gap:0;flex-wrap:wrap;
}
.s-item{display:flex;align-items:center;gap:7px}
.s-con{width:50px;height:2px;background:#ddd;margin:0 5px}
.s-con.done{background:var(--grn)}
.s-circle{
  width:34px;height:34px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-size:.82rem;font-weight:700;
  font-family:'Nunito',sans-serif;transition:all .3s;
}
.s-circle.done{background:var(--grn);color:#fff}
.s-circle.active{background:var(--pd);color:#fff}
.s-circle.pending{background:#ddd;color:#999}
.s-lbl{font-size:.75rem;font-weight:700;font-family:'Nunito',sans-serif}
.s-lbl.active{color:var(--pd)}.s-lbl.pending{color:#aaa}

/* Form actions row */
.form-actions{
  display:flex;justify-content:space-between;align-items:center;
  margin-top:1.8rem;flex-wrap:wrap;gap:8px;
}

/* Space selector */
.space-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));
  gap:1rem;margin-bottom:1.3rem;
}
.space-card{
  border:2px solid #ddd;border-radius:12px;padding:1.3rem;
  text-align:center;cursor:pointer;transition:all .2s;background:var(--w);
}
.space-card:hover{border-color:var(--pm);transform:translateY(-2px)}
.space-card.on{border-color:var(--gold);background:var(--ow);box-shadow:var(--sh-sm)}
.space-icon{font-size:2.2rem;margin-bottom:.55rem}
.space-name{font-family:'Nunito',sans-serif;font-weight:900;font-size:.92rem;color:var(--pd);margin-bottom:.2rem}
.space-price{font-size:.78rem;color:var(--tmut)}

/* Counter */
.counter-row{display:flex;align-items:center;gap:10px}
.ctr-btn{
  width:34px;height:34px;border-radius:8px;border:1.5px solid var(--pm);
  background:var(--w);color:var(--pm);font-size:1.1rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;
}
.ctr-btn:hover{background:var(--pm);color:var(--w)}
.ctr-val{font-size:1.2rem;font-weight:900;color:var(--pd);min-width:28px;text-align:center;font-family:'Nunito',sans-serif}

/* Days row */
.day-row{display:flex;gap:7px;flex-wrap:wrap}
.day-btn{
  width:40px;height:40px;border-radius:8px;border:1.5px solid #ddd;
  background:var(--w);font-size:.78rem;font-weight:700;color:var(--tmut);
  cursor:pointer;transition:all .2s;font-family:'Nunito',sans-serif;
}
.day-btn.selected,.day-btn.on{background:var(--pd);color:var(--w);border-color:var(--pd)}

/* Program picker */
.prog-cat{
  font-family:'Nunito',sans-serif;font-weight:900;font-size:.95rem;color:var(--pd);
  margin:1.5rem 0 .6rem;border-bottom:2px solid var(--gold);padding-bottom:5px;
}
.prog-grid-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:7px;margin-bottom:.4rem}
.prog-btn{
  border:1.5px solid #ddd;border-radius:8px;padding:.6rem .85rem;
  background:var(--w);font-size:.8rem;font-weight:600;color:var(--td);
  text-align:left;cursor:pointer;transition:all .2s;font-family:'Poppins',sans-serif;
}
.prog-btn.selected,.prog-btn.on{background:var(--ow);border-color:var(--pm);color:var(--pm)}

/* Tab filter */
.tab-row,.filter-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:1.4rem}
.tab-btn,.ftab{
  padding:.5rem 1.1rem;border-radius:8px;border:1.5px solid #ddd;
  background:var(--w);font-size:.78rem;font-weight:700;
  color:var(--tmut);cursor:pointer;transition:all .18s;font-family:'Nunito',sans-serif;
}
.tab-btn.on,.ftab.on{background:var(--pd);color:var(--w);border-color:var(--pd)}

/* ─── BADGES / PILLS ─────────────────────────────────────── */
.badge{
  display:inline-block;padding:2px 9px;border-radius:20px;
  font-size:.66rem;font-weight:700;white-space:nowrap;
}
.badge-green{background:#E1F5EE;color:#1A5C1A}
.badge-gold{background:#FFF8DC;color:#7A5500}
.badge-red{background:#FDECEA;color:#8B0000}
.badge-blue{background:#E6F1FB;color:#185FA5}
.badge-purple{background:#F0E8FB;color:#4A0088}
.badge-gray{background:#F5F5F5;color:#555}
.pill{
  display:inline-block;padding:2px 9px;border-radius:20px;
  font-size:.7rem;font-weight:700;
  background:var(--ow);color:var(--pm);border:1px solid rgba(90,31,160,.25);
}
.pill-wrap{display:flex;flex-wrap:wrap;gap:5px}
.spot-open{display:inline-block;padding:3px 10px;border-radius:20px;font-size:.7rem;font-weight:700;background:#E1F5EE;color:#1A5C1A}
.spot-low {display:inline-block;padding:3px 10px;border-radius:20px;font-size:.7rem;font-weight:700;background:#FFF3CC;color:#7A5500}
.spot-full{display:inline-block;padding:3px 10px;border-radius:20px;font-size:.7rem;font-weight:700;background:#FDECEA;color:#8B0000}

/* ─── PROGRAM BLOCKS (youth outreach) ───────────────────── */
.programs{display:flex;flex-direction:column;gap:1.75rem}
.block{
  display:grid;grid-template-columns:220px 1fr;
  border-radius:18px;overflow:hidden;min-height:190px;
  box-shadow:0 6px 32px rgba(45,14,107,.13);
}
.block.flip{grid-template-columns:1fr 220px}
.block.flip .block-icon-side{order:2}
.block.flip .block-content{order:1}
.block-icon-side{
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:10px;padding:1.5rem 1rem;
}
.block-icon{font-size:3.2rem;line-height:1}
.block-grade{
  font-family:'Nunito',sans-serif;font-weight:900;font-size:.72rem;
  letter-spacing:1.5px;text-transform:uppercase;padding:4px 12px;
  border-radius:20px;text-align:center;
}
.block-content{padding:1.6rem 1.8rem;display:flex;flex-direction:column;justify-content:center}
.block-tag{
  font-family:'Nunito',sans-serif;font-weight:900;font-size:.68rem;
  letter-spacing:2.5px;text-transform:uppercase;margin-bottom:.45rem;
}
.block-title{font-family:'Nunito',sans-serif;font-weight:900;font-size:1.45rem;line-height:1.15;margin-bottom:.6rem}
.block-desc{font-size:.84rem;line-height:1.65}
.block-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:.85rem}
.block .pill{font-family:'Nunito',sans-serif;font-weight:800}

/* Block color themes */
.b-mindful .block-icon-side{background:#023D36}.b-mindful .block-content{background:#035248}
.b-mindful .block-grade,.b-mindful .pill{background:rgba(0,201,177,.2);color:#00C9B1}
.b-mindful .block-tag{color:#00C9B1}.b-mindful .block-title{color:#CCFAF4}.b-mindful .block-desc{color:#86D8CE}
.b-gods .block-icon-side{background:#3A2200}.b-gods .block-content{background:#4F3000}
.b-gods .block-grade,.b-gods .pill{background:rgba(255,215,0,.18);color:#FFD700}
.b-gods .block-tag{color:#FFD700}.b-gods .block-title{color:#FFF0C0}.b-gods .block-desc{color:#D4B86A}
.b-bball .block-icon-side{background:#3D0530}.b-bball .block-content{background:#5C0745}
.b-bball .block-grade,.b-bball .pill{background:rgba(255,111,200,.2);color:#FF6FC8}
.b-bball .block-tag{color:#FF6FC8}.b-bball .block-title{color:#FFDCF0}.b-bball .block-desc{color:#E8A8CC}
.b-football .block-icon-side{background:#1A1500}.b-football .block-content{background:#2A2000}
.b-football .block-grade,.b-football .pill{background:rgba(255,215,0,.2);color:#FFD700}
.b-football .block-tag{color:#FFD700}.b-football .block-title{color:#FFF5CC}.b-football .block-desc{color:#C8A820}
.b-robot .block-icon-side{background:#1C0850}.b-robot .block-content{background:#2D0E6B}
.b-robot .block-grade,.b-robot .pill{background:rgba(155,93,229,.22);color:#C09FFF}
.b-robot .block-tag{color:#C09FFF}.b-robot .block-title{color:#E8D5FF}.b-robot .block-desc{color:#B49FD8}
.b-rc .block-icon-side{background:#2A1500}.b-rc .block-content{background:#3D1F00}
.b-rc .block-grade,.b-rc .pill{background:rgba(255,165,0,.2);color:#FFA500}
.b-rc .block-tag{color:#FFA500}.b-rc .block-title{color:#FFE4B0}.b-rc .block-desc{color:#CC9955}
.b-ai .block-icon-side{background:#0A0030}.b-ai .block-content{background:#15004A}
.b-ai .block-grade,.b-ai .pill{background:rgba(155,93,229,.25);color:#C09FFF}
.b-ai .block-tag{color:#C09FFF}.b-ai .block-title{color:#E8D5FF}.b-ai .block-desc{color:#B49FD8}
.b-prog .block-icon-side{background:#001F40}.b-prog .block-content{background:#002D5C}
.b-prog .block-grade,.b-prog .pill{background:rgba(0,180,255,.2);color:#00B8FF}
.b-prog .block-tag{color:#00B8FF}.b-prog .block-title{color:#CCF0FF}.b-prog .block-desc{color:#7BBFDD}
.b-cyber .block-icon-side{background:#2A0010}.b-cyber .block-content{background:#3D0018}
.b-cyber .block-grade,.b-cyber .pill{background:rgba(233,30,140,.2);color:#FF4FA0}
.b-cyber .block-tag{color:#FF4FA0}.b-cyber .block-title{color:#FFD0E8}.b-cyber .block-desc{color:#D888AA}
.b-fieldtrip .block-icon-side{background:#021A10}.b-fieldtrip .block-content{background:#033020}
.b-fieldtrip .block-grade,.b-fieldtrip .pill{background:rgba(0,224,150,.2);color:#00E096}
.b-fieldtrip .block-tag{color:#00E096}.b-fieldtrip .block-title{color:#CCFFE8}.b-fieldtrip .block-desc{color:#77D4A8}

/* ─── FLOATING PANE SYSTEM ───────────────────────────────── */
.fp-host{position:relative}
.fp-pane{
  position:absolute;z-index:500;background:var(--pd);color:var(--w);
  border-radius:14px;padding:1rem 1.2rem;width:260px;
  box-shadow:0 14px 44px rgba(0,0,0,.5);
  opacity:0;pointer-events:none;
  transition:opacity .2s,transform .2s;transform:translateY(4px);
}
.fp-pane.up{bottom:calc(100% + 10px);transform:translateY(-4px)}
.fp-pane.down{top:calc(100% + 10px);transform:translateY(4px)}
.fp-host:hover .fp-pane{opacity:1;pointer-events:auto;transform:translateY(0)}
.fp-pane h4{font-family:'Nunito',sans-serif;font-weight:900;font-size:.92rem;margin-bottom:.4rem;color:var(--gold)}
.fp-tag{display:inline-block;font-size:.65rem;font-weight:700;color:var(--teal);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:.6rem}
.fp-row{font-size:.78rem;color:rgba(255,255,255,.7);margin-bottom:.3rem;line-height:1.5}
.fp-row b{color:rgba(255,255,255,.95)}
.fp-pane ul{list-style:none;margin:.4rem 0;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.fp-pane ul li{font-size:.72rem;color:rgba(255,255,255,.75);padding:2px 0}
.fp-pane ul li::before{content:'· ';color:var(--teal)}
.fp-cta{
  display:inline-block;margin-top:.7rem;background:var(--gold);color:#1A0940;
  padding:5px 14px;border-radius:20px;font-size:.72rem;font-weight:900;
  font-family:'Nunito',sans-serif;text-decoration:none;transition:background .15s;
}
.fp-cta:hover{background:#ffe033}

/* ─── SESSION / CAMP CARDS ───────────────────────────────── */
.session-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.2rem}
.sess-card{
  background:var(--w);border-radius:14px;border:1.5px solid #eee;
  padding:1.2rem;cursor:pointer;transition:all .25s;position:relative;
}
.sess-card:hover{border-color:var(--pm);box-shadow:var(--sh-md);transform:translateY(-3px)}
.sess-card.selected{border-color:var(--gold);background:var(--ow)}
.sess-card.full{opacity:.65;cursor:not-allowed}
.sess-name{font-family:'Nunito',sans-serif;font-weight:900;font-size:.95rem;color:var(--pd);margin-bottom:.35rem}
.sess-meta{font-size:.78rem;color:var(--tmut);line-height:1.8}
.cap-bar{margin-top:.65rem;height:5px;background:#eee;border-radius:3px;overflow:hidden}
.cap-fill{height:100%;background:var(--pm);border-radius:3px;transition:width .4s}

/* ─── TABLES ─────────────────────────────────────────────── */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:.8rem;min-width:480px}
th{
  text-align:left;padding:9px 12px;font-size:.64rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.5px;color:var(--tmut);
  border-bottom:2px solid #eee;white-space:nowrap;background:#fafafa;
}
td{padding:10px 12px;border-bottom:1px solid #f4f4f4;color:var(--td);vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:#fafafa}
.act-btn{
  padding:5px 12px;border-radius:6px;border:1.5px solid #ddd;
  background:var(--w);font-size:.72rem;font-weight:600;color:var(--pd);
  cursor:pointer;transition:all .2s;
}
.act-btn:hover{background:var(--pd);color:var(--w);border-color:var(--pd)}
.act-btn.green{background:var(--teal);color:var(--pd);border-color:var(--teal)}
.act-btn.green:hover{background:var(--teald)}

/* ─── DASHBOARD LAYOUT ───────────────────────────────────── */
.dash-layout{display:flex;min-height:calc(100vh - var(--nav-h))}
.sidebar{
  width:230px;background:var(--pd);display:flex;flex-direction:column;
  flex-shrink:0;transition:transform .28s ease;
}
.sb-top{
  padding:16px 16px 14px;border-bottom:1px solid rgba(255,255,255,.1);
  margin-bottom:8px;display:flex;align-items:center;gap:10px;
}
.sb-logo-img{
  width:40px;height:40px;object-fit:contain;border-radius:8px;
  filter:drop-shadow(0 0 6px rgba(255,215,0,.4));
}
.sb-brand-name{font-family:'Nunito',sans-serif;font-weight:900;font-size:.95rem;color:var(--w);line-height:1}
.sb-brand-role{font-size:.52rem;color:var(--gold);letter-spacing:2px;text-transform:uppercase;margin-top:2px;display:block;font-weight:700}
.sb-section{
  padding:12px 16px 4px;font-size:.58rem;font-weight:700;
  letter-spacing:2.5px;color:rgba(255,255,255,.28);text-transform:uppercase;
}
.sb-item{
  display:flex;align-items:center;gap:9px;padding:9px 16px;
  color:rgba(255,255,255,.65);font-size:.79rem;font-weight:600;
  cursor:pointer;transition:all .18s;border-left:3px solid transparent;
  background:none;border-top:none;border-right:none;border-bottom:none;
  width:100%;text-align:left;font-family:'Poppins',sans-serif;text-decoration:none;
}
.sb-item:hover{background:rgba(255,255,255,.06);color:var(--w)}
.sb-item.on{background:rgba(255,215,0,.13);color:var(--gold);border-left-color:var(--gold)}
.sb-icon{font-size:1rem;width:20px;text-align:center;flex-shrink:0}
.sb-spacer{flex:1}
.sb-foot{padding:12px 16px;border-top:1px solid rgba(255,255,255,.1)}
.sb-foot a{
  display:flex;align-items:center;gap:8px;font-size:.76rem;
  color:rgba(255,255,255,.38);text-decoration:none;transition:color .18s;padding:4px 0;
}
.sb-foot a:hover{color:var(--gold)}
.sb-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:298}
.dash-main{flex:1;background:#f0f2f5;overflow-y:auto;min-width:0}
.dash-topbar{
  background:var(--w);padding:10px 20px;display:flex;
  justify-content:space-between;align-items:center;
  border-bottom:1px solid #eee;position:sticky;top:0;z-index:50;gap:10px;
}
.dash-topbar-left{display:flex;align-items:center;gap:10px}
.sb-toggle{display:none;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--pd);padding:4px}
.dash-page-title{font-family:'Nunito',sans-serif;font-weight:900;font-size:1.1rem;color:var(--pd)}
.dash-body{padding:clamp(12px,2.5vw,20px)}
.dash-card{background:var(--w);border-radius:12px;padding:1.3rem;border:1px solid #eee;margin-bottom:1.2rem;box-shadow:var(--sh-sm)}
.dash-card h3{font-family:'Nunito',sans-serif;font-size:.95rem;font-weight:900;color:var(--pd);margin-bottom:.9rem}

/* ─── METRICS ────────────────────────────────────────────── */
.metrics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:1.2rem}
.metric{background:var(--w);border-radius:12px;padding:1rem 1.1rem;border:1px solid #eee;border-top:3px solid var(--gold)}
.metric-num{font-family:'Nunito',sans-serif;font-size:2rem;font-weight:900;color:var(--pd);line-height:1}
.metric-label{font-size:.63rem;font-weight:700;color:var(--tmut);text-transform:uppercase;letter-spacing:.5px;margin-top:.35rem}
.metric.purple{border-top-color:var(--pm)}
.metric.teal{border-top-color:var(--teal)}
.metric.pink{border-top-color:var(--pk)}
.metric.red{border-top-color:#B01028}
.metric.blue{border-top-color:#185FA5}

/* ─── AUTH SCREENS ───────────────────────────────────────── */
.auth-wrap{
  min-height:calc(100vh - var(--nav-h));display:flex;align-items:center;
  justify-content:center;padding:24px 16px;position:relative;overflow:hidden;
  background:linear-gradient(145deg,var(--td) 0%,var(--pd) 100%);
}
.auth-wrap::before{
  content:'';position:absolute;top:-120px;left:-80px;width:400px;height:400px;
  border-radius:50%;background:radial-gradient(circle,rgba(90,31,160,.2) 0%,transparent 70%);
}
.auth-wrap::after{
  content:'';position:absolute;bottom:-80px;right:-60px;width:350px;height:350px;
  border-radius:50%;background:radial-gradient(circle,rgba(233,30,140,.18) 0%,transparent 70%);
}
.auth-card{
  background:rgba(255,255,255,.98);border-radius:20px;
  padding:clamp(1.6rem,4vw,2.3rem);width:100%;max-width:420px;
  box-shadow:0 28px 72px rgba(0,0,0,.38);position:relative;z-index:1;
}
.auth-logo-wrap{text-align:center;margin-bottom:1.3rem}
.auth-logo{
  width:80px;height:80px;object-fit:contain;margin:0 auto .6rem;
  border-radius:14px;filter:drop-shadow(0 4px 12px rgba(255,215,0,.3));
}
.auth-brand{
  font-family:'Nunito',sans-serif;font-weight:900;font-size:1.6rem;
  color:var(--pd);letter-spacing:1.5px;
}
.auth-brand span{color:var(--gold)}
.auth-sub-label{font-size:.68rem;color:var(--tmut);letter-spacing:2px;text-transform:uppercase;font-weight:700}
.auth-tabs{
  display:flex;background:var(--ow);border-radius:10px;
  padding:4px;gap:4px;margin-bottom:1.2rem;
}
.auth-tab{
  flex:1;padding:.5rem;border-radius:7px;border:none;
  font-family:'Nunito',sans-serif;font-weight:800;font-size:.76rem;
  cursor:pointer;transition:all .2s;background:none;color:var(--tmut);
}
.auth-tab.on{background:var(--pd);color:var(--w)}
.forgot-link{
  font-size:.74rem;color:var(--pm);font-weight:600;
  display:block;text-align:right;margin-top:.2rem;cursor:pointer;
}
.forgot-link:hover{text-decoration:underline}

/* ─── MODAL ──────────────────────────────────────────────── */
.modal-bg{
  position:fixed;inset:0;background:rgba(10,6,24,.65);z-index:500;
  display:none;align-items:center;justify-content:center;
  padding:16px;backdrop-filter:blur(4px);
}
.modal-bg.open{display:flex}
.modal{
  background:var(--w);border-radius:18px;
  padding:clamp(1.4rem,4vw,2rem);width:100%;max-width:500px;
  max-height:90vh;overflow-y:auto;box-shadow:0 28px 72px rgba(0,0,0,.4);
}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
.modal-head h3{font-family:'Nunito',sans-serif;font-weight:900;font-size:1.05rem;color:var(--pd)}
.modal-close{background:none;border:none;font-size:1.4rem;color:var(--tmut);cursor:pointer;padding:2px 7px;border-radius:7px}
.modal-close:hover{background:var(--ow)}

/* ─── PAYMENT NOTICE ─────────────────────────────────────── */
.pay-notice{
  background:linear-gradient(135deg,#1a1a2e,#16213e);
  border-radius:12px;padding:1.1rem 1.3rem;margin-bottom:1rem;color:var(--w);
}
.pay-notice h4{font-family:'Nunito',sans-serif;font-weight:900;font-size:.9rem;color:var(--gold);margin-bottom:.3rem}
.pay-notice p{font-size:.77rem;color:rgba(255,255,255,.65);line-height:1.55}
.pay-icons{display:flex;gap:7px;margin-top:.65rem;flex-wrap:wrap}
.pay-icon{background:rgba(255,255,255,.12);border-radius:6px;padding:4px 10px;font-size:.66rem;font-weight:700;color:rgba(255,255,255,.75)}

/* ─── SUCCESS BOX ────────────────────────────────────────── */
.success-box{text-align:center;padding:3rem 1.5rem}
.success-icon{font-size:3.5rem;margin-bottom:.8rem}
.success-box h2{font-family:'Nunito',sans-serif;font-weight:900;font-size:1.8rem;color:var(--pd);margin-bottom:.5rem}
.success-box p{color:var(--tmut);font-size:.88rem;line-height:1.65;margin-bottom:1.2rem}

/* ─── SPINNER ────────────────────────────────────────────── */
.spin{
  display:inline-block;width:14px;height:14px;
  border:2.5px solid rgba(255,255,255,.35);border-top-color:var(--w);
  border-radius:50%;animation:spin .65s linear infinite;
  vertical-align:middle;margin-right:5px;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ─── SEARCH ─────────────────────────────────────────────── */
.search-row{display:flex;gap:8px;margin-bottom:.9rem}
.search-row input{
  flex:1;border:1.5px solid #ddd;border-radius:9px;
  padding:.6rem .9rem;font-size:.82rem;outline:none;
  color:var(--td);background:var(--w);width:100%;
}
.search-row input:focus{border-color:var(--pm);box-shadow:0 0 0 3px rgba(90,31,160,.08)}

/* ─── CHILD CARD ─────────────────────────────────────────── */
.child-card{
  background:var(--w);border-radius:11px;padding:.9rem 1rem;
  border:1px solid #eee;display:flex;align-items:center;gap:12px;
  transition:all .18s;margin-bottom:.7rem;
}
.child-card:hover{border-color:var(--pm);box-shadow:var(--sh-sm)}
.child-avatar{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--teal),var(--pm));
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;
}

/* ─── CTA BAND ───────────────────────────────────────────── */
.cta-band{background:var(--gold);padding:clamp(2rem,4vw,3rem) 2rem;text-align:center}
.cta-band h2{font-family:'Nunito',sans-serif;font-weight:900;font-size:clamp(1.5rem,3vw,1.9rem);color:var(--pd);margin-bottom:.5rem}
.cta-band p{font-size:.88rem;color:rgba(45,14,107,.75);margin-bottom:1.4rem;max-width:540px;margin-left:auto;margin-right:auto;line-height:1.65}
.cta-btn{
  background:var(--pd);color:var(--w);font-family:'Nunito',sans-serif;
  font-weight:900;font-size:.9rem;padding:.85rem 2.3rem;border-radius:50px;
  border:none;cursor:pointer;text-decoration:none;display:inline-block;
  transition:all .2s;margin:.4rem;
}
.cta-btn:hover{background:#1A0940;transform:translateY(-2px)}
.cta-btn.secondary{background:var(--pm)}
.cta-btn.secondary:hover{background:var(--pd)}

/* ─── FOOTER ─────────────────────────────────────────────── */
.footer{background:#1A0940;padding:clamp(2rem,5vw,3rem) 2rem 1.5rem}
.footer-inner{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));
  gap:2rem;margin-bottom:2rem;
}
.footer-logo-row{display:flex;align-items:center;gap:10px;margin-bottom:.75rem}
.footer-logo-img{width:36px;height:36px;object-fit:contain;border-radius:8px}
.footer-logo{font-family:'Nunito',sans-serif;font-weight:900;font-size:1.3rem;color:var(--w)}
.footer-logo span{color:var(--gold)}
.footer-col h4{
  font-family:'Nunito',sans-serif;font-weight:900;font-size:.78rem;
  color:var(--gold);margin-bottom:.8rem;letter-spacing:1px;text-transform:uppercase;
}
.footer-col p,.footer-col a{
  font-size:.78rem;color:rgba(255,255,255,.45);line-height:2.1;
  display:block;text-decoration:none;transition:color .18s;
}
.footer-col a:hover{color:var(--gold)}
.footer-bottom{
  max-width:1100px;margin:0 auto;border-top:1px solid rgba(255,255,255,.1);
  padding-top:1.1rem;text-align:center;font-size:.71rem;color:rgba(255,255,255,.28);
}

/* ─── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:900px){
  .nav-links{display:none}
  .nav-hamburger{display:flex}
}
@media(max-width:700px){
  .sidebar{
    position:fixed;top:var(--nav-h);left:0;
    height:calc(100vh - var(--nav-h));z-index:299;
    transform:translateX(-100%);
  }
  .sidebar.open{transform:translateX(0)}
  .sb-overlay.open{display:block}
  .sb-toggle{display:block}
  .dash-main{width:100%}
  .metrics-grid{grid-template-columns:repeat(2,1fr)}
  .block,.block.flip{grid-template-columns:1fr}
  .block.flip .block-icon-side{order:1}
  .block.flip .block-content{order:2}
  .block-icon-side{min-height:110px}
}
@media(max-width:560px){
  .fgrid{grid-template-columns:1fr}
  .fg.full{grid-column:1}
  .auth-card{padding:1.4rem}
  .session-grid{grid-template-columns:1fr}
  .metrics-grid{grid-template-columns:1fr 1fr}
  .step-bar{gap:3px}
  .s-con{width:30px}
  .space-grid{grid-template-columns:1fr 1fr}
}


/* ===== AUTOMATED UI STABILITY + RESPONSIVE PATCH ===== */

html, body{
  max-width:100%;
  overflow-x:hidden;
}

/* Better layout consistency */
.container,
.section,
.dashboard,
.dashboard-grid,
.portal-container,
.admin-container{
  width:100%;
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
}

/* Responsive tables */
table{
  width:100%;
  border-collapse:collapse;
  display:block;
  overflow-x:auto;
  white-space:nowrap;
}

/* Card consistency */
.card,
.dashboard-card,
.portal-card,
.admin-card{
  background:var(--w);
  border-radius:18px;
  box-shadow:var(--sh-sm);
  padding:1.25rem;
  margin-bottom:1rem;
  border:1px solid rgba(90,31,160,.08);
}

/* Typography improvements */
h1,h2,h3,h4{
  line-height:1.2;
  color:var(--pd);
}

p,li,label,input,textarea,select{
  line-height:1.6;
}

/* Better form appearance */
input,
textarea,
select{
  border:1px solid rgba(90,31,160,.2);
  border-radius:12px;
  padding:.85rem 1rem;
  background:#fff;
  color:var(--td);
}

input:focus,
textarea:focus,
select:focus{
  outline:none;
  border-color:var(--pl);
  box-shadow:0 0 0 3px rgba(155,93,229,.18);
}

/* Button consistency */
button,
.btn{
  transition:all .2s ease;
}

button:hover,
.btn:hover{
  transform:translateY(-1px);
}

/* Navigation fixes */
.nav{
  flex-wrap:wrap;
}

.nav-links{
  flex-wrap:wrap;
}

/* Portal sections */
.admin-panel,
.parent-panel,
.portal-section{
  padding:1.5rem;
  border-radius:20px;
  background:rgba(255,255,255,.96);
}

/* Improve color contrast */
.text-muted,
.muted{
  color:#5c5470 !important;
}

/* Prevent oversized media */
img,
video,
iframe{
  max-width:100%;
  height:auto;
}

/* Mobile improvements */
@media (max-width: 992px){

  .nav{
    height:auto;
    padding:1rem;
  }

  .nav-links{
    width:100%;
    justify-content:center;
    gap:.5rem;
    margin-top:.75rem;
  }

  .dashboard-grid,
  .grid,
  .cards{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .card,
  .dashboard-card,
  .portal-card{
    padding:1rem;
  }

  h1{
    font-size:2rem !important;
  }

  h2{
    font-size:1.6rem !important;
  }

  .hero,
  .banner{
    padding:2rem 1rem !important;
  }
}

/* Small mobile fixes */
@media (max-width: 640px){

  body{
    font-size:15px;
  }

  .nav-btn,
  .nav-cta{
    width:100%;
    text-align:center;
  }

  table{
    font-size:.9rem;
  }

  input,
  textarea,
  select,
  button{
    font-size:16px;
  }
}