:root{--d:0ms}
html{scroll-padding-top:90px}
.bg-grid{background-image:linear-gradient(rgba(167,243,208,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(167,243,208,.08) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse at center,#000 30%,transparent 80%)}
.blob{position:absolute;border-radius:9999px;filter:blur(90px);pointer-events:none}
.text-gradient{background:linear-gradient(90deg,#c7f43a,#34d399);-webkit-background-clip:text;background-clip:text;color:transparent}
.glass{background:rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.15)}
.btn-primary,.btn-dark,.btn-ghost,.btn-outline{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.9rem;border-radius:9999px;padding:.8rem 1.6rem;transition:all .25s;white-space:nowrap}
.btn-primary{background:#c7f43a;color:#05201c;box-shadow:0 10px 30px -10px rgba(199,244,58,.6)}
.btn-primary:hover{transform:translateY(-2px);background:#d6ff55}
.btn-dark{background:#05201c;color:#fff}.btn-dark:hover{background:#065f46;transform:translateY(-2px)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.35);color:#fff}.btn-ghost:hover{background:#fff;color:#05201c}
.btn-outline{border:1.5px solid #05201c;color:#05201c}.btn-outline:hover{background:#05201c;color:#fff}
.social{width:2.25rem;height:2.25rem;border-radius:9999px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#fff;transition:.25s}
.social:hover{background:#c7f43a;color:#05201c;transform:translateY(-3px)}
.card-hover{transition:transform .3s,box-shadow .3s}.card-hover:hover{transform:translateY(-8px)}
.cd-box{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(10px);border-radius:1rem;padding:.9rem .25rem;text-align:center}
.cd-box b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-size:1.75rem;line-height:1;color:#c7f43a}
.cd-box span{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.6)}
@media(min-width:640px){.cd-box b{font-size:2.25rem}.cd-box{padding:1.1rem .5rem}}
.hero-bg{background:url(../img/hero-bg.svg) center/cover no-repeat;background-color:#05201c}
.kenburns{animation:kb 24s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.08) translateX(-1.5%)}}
.hs-slide{opacity:0;transform:translateX(60px) scale(.96);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.hs-slide.active{opacity:1;transform:none;pointer-events:auto}
.hs-slide.leaving{transform:translateX(-60px) scale(.96)}
.hs-in{opacity:0;transform:translateY(20px)}
.hs-slide.active .hs-in{animation:hsin .7s .25s both;animation-delay:calc(.25s + var(--i,0)*.12s)}
@keyframes hsin{to{opacity:1;transform:none}}
.hs-dot{width:2rem;height:.4rem;border-radius:9999px;background:rgba(255,255,255,.25);overflow:hidden;padding:0}
.hs-dot span{display:block;height:100%;width:0;background:#c7f43a}
.hs-dot.done span{width:100%}
.hs-dot.active span{animation:hsbar var(--dur,4500ms) linear forwards}
@keyframes hsbar{to{width:100%}}
.hs-nav{width:2.25rem;height:2.25rem;border-radius:9999px;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff;transition:.25s}
.hs-nav:hover{background:#c7f43a;color:#05201c}
.orbit-ring{position:absolute;left:50%;top:50%;width:31rem;height:31rem;margin:-15.5rem 0 0 -15.5rem;border-radius:9999px;border:1.5px dashed rgba(199,244,58,.35);animation:spin 40s linear infinite}
.orbit-badge{position:absolute;left:50%;top:50%;width:2.5rem;height:2.5rem;margin:-1.25rem;border-radius:9999px;display:grid;place-items:center;background:#c7f43a;color:#05201c;box-shadow:0 8px 24px -6px rgba(199,244,58,.6);transform:rotate(var(--a)) translateY(-15.5rem)}
.marquee{animation:marquee 35s linear infinite}.marquee:hover{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.float-slow{animation:float 7s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-16px)}}
.orbit{transform-origin:200px 200px;animation:spin 30s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.animate-fade{animation:fade .8s both;animation-delay:var(--d)}
@keyframes fade{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.js .reveal{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease;transition-delay:var(--d)}
.js .reveal.in{opacity:1;transform:none}
.tab-btn{background:#fff;color:#05201c;border:1px solid #e2e8f0}.tab-btn:hover{border-color:#10b981}
.tab-btn.active{background:#05201c;color:#c7f43a;border-color:#05201c}
.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}
.field span{display:block;font-size:.8rem;font-weight:700;color:#05201c;margin-bottom:.4rem}
.field input,.field select,.field textarea{width:100%;background:#fff;border:1.5px solid #e2e8f0;border-radius:.9rem;padding:.8rem 1rem;font-size:.95rem;outline:none;transition:.2s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#10b981;box-shadow:0 0 0 4px rgba(16,185,129,.15)}
details summary::-webkit-details-marker{display:none}
#site-header.scrolled{box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
#to-top.show{opacity:1;pointer-events:auto}
.form-control, .form-select {
  width: 100%;
  background: #fff;
  border: 1.5px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  color: #05201c;
  outline: none;
  transition: all 0.2s ease;
}
.form-control:focus, .form-select:focus {
  border-color: #10b981;
  box-shadow: 0 0 0 4px rgba(16,185,129,.15);
  outline: none;
}
.form-group {
  margin-bottom: 1.25rem;
}
.control-label {
  display: block;
  font-weight: 600;
  color: #05201c;
  margin-bottom: 0.4rem;
  font-size: 0.9rem;
}
.input-group {
  position: relative;
  display: flex;
  align-items: stretch;
  width: 100%;
}
.input-group-addon {
  padding: 0.75rem 1.1rem;
  font-size: 0.95rem;
  color: #05201c;
  background-color: #f1f5f9;
  border: 1.5px solid #e2e8f0;
  border-right: 0;
  border-top-left-radius: 0.75rem;
  border-bottom-left-radius: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.input-group .form-control, .input-group select.form-control {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.container-fluid.about {
  max-width: 80rem;
  margin-left: auto;
  margin-right: auto;
  padding: 2.5rem 1.5rem;
}
.table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  margin-bottom: 1.5rem;
}
.table th {
  background-color: #05201c;
  color: #ffffff;
  padding: 0.9rem 1rem;
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.table td {
  padding: 0.9rem 1rem;
  border-bottom: 1px solid #f1f5f9;
  color: #334155;
  font-size: 0.925rem;
  vertical-align: middle;
}
.table-striped tbody tr:nth-of-type(even) {
  background-color: #f8fafc;
}
.table-hover tbody tr:hover {
  background-color: #f1f5f9;
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}}

/* ==========================================================================
   CONSOLIDATED SITE-WIDE STYLES & UTILITIES
   ========================================================================== */

/* Form Validation Highlight (Abstract Submission & Become a Sponsor) */
input.error, select.error {
  border-color: #f43f5e !important;
  background-color: #fff1f2 !important;
  box-shadow: 0 0 0 2px rgba(244, 63, 94, 0.2) !important;
}

/* Visibility Utility (safe with jQuery .show() / .hide() / .css()) */
.is-hidden {
  display: none;
}

/* Max-width Utility */
.max-w-900 {
  max-width: 900px;
}

/* Animation Delays (Stagger Transitions) */
.delay-0   { --d: 0ms; }
.delay-50  { --d: 50ms; }
.delay-60  { --d: 60ms; }
.delay-70  { --d: 70ms; }
.delay-80  { --d: 80ms; }
.delay-100 { --d: 100ms; }
.delay-120 { --d: 120ms; }
.delay-140 { --d: 140ms; }
.delay-150 { --d: 150ms; }
.delay-160 { --d: 160ms; }
.delay-180 { --d: 180ms; }
.delay-200 { --d: 200ms; }
.delay-210 { --d: 210ms; }
.delay-240 { --d: 240ms; }
.delay-250 { --d: 250ms; }
.delay-280 { --d: 280ms; }
.delay-300 { --d: 300ms; }
.delay-350 { --d: 350ms; }
.delay-360 { --d: 360ms; }
.delay-400 { --d: 400ms; }
.delay-420 { --d: 420ms; }

/* Negative Animation Delays */
.anim-delay-neg-2 { animation-delay: -2s; }
.anim-delay-neg-4 { animation-delay: -4s; }

/* Orbit Badge Rotations */
.orbit-a-0   { --a: 0deg; }
.orbit-a-90  { --a: 90deg; }
.orbit-a-180 { --a: 180deg; }
.orbit-a-270 { --a: 270deg; }

/* Hero Slide Stagger Indices */
.hs-i-1 { --i: 1; }
.hs-i-2 { --i: 2; }
.hs-i-3 { --i: 3; }

/* Avatar / Testimonial Image Dimensions */
.avatar-52 {
  width: 52px;
  height: 52px;
  min-width: 52px;
}

/* Registration Form Dynamic Participant Fields */
#fields .input-group {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  padding: 1.25rem;
  background-color: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  margin-bottom: 0.75rem;
}
@media (min-width: 640px) {
  #fields .input-group {
    grid-template-columns: 160px 1fr;
    align-items: center;
  }
}
#fields #name_scents1 span {
  font-weight: 700;
  color: #05201c;
  font-size: 0.95rem !important;
  margin-bottom: 0 !important;
  height: auto !important;
  display: inline-block;
}
#fields #pn_input1 p {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin: 0;
}
#fields #pn_input1 input {
  margin-bottom: 0 !important;
}

/* Testimonials Slider Scrollbar Suppression */
#testimonials-slider::-webkit-scrollbar {
  display: none;
}

/* App Launch Modal & Animations */
.app-launch-modal {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 330px;
  background: white;
  box-shadow: 0 10px 40px -10px rgba(0,0,0,0.3), inset 0 0 15px 0 rgba(245,158,11,0.25);
  border: 1px solid rgba(245,158,11,0.4);
  border-radius: 16px;
  padding: 16px;
  display: none;
  z-index: 9999;
  animation: fadeInModal 0.4s ease-in-out;
}
.download-text {
  animation: blink 1s infinite;
}
@keyframes fadeInModal {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.close-btn {
  position: absolute;
  top: 8px;
  right: 12px;
  cursor: pointer;
  font-size: 18px;
  color: #777;
}
.close-btn:hover {
  color: #000;
}
.cta-btn {
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: transform 0.2s;
}
.cta-btn:hover {
  transform: scale(1.03);
}
@media (max-width: 576px) {
  .app-launch-modal {
    right: 12px !important;
    left: 12px !important;
    width: auto !important;
  }
}

/* Student Volunteer Specific Styles */
.sv-callout {
  background: rgba(0, 33, 71, 0.04);
  border-left: 4px solid #002147;
}
.sv-callout-text {
  font-size: 0.96rem;
  line-height: 1.6;
}
.sv-text-muted {
  color: #475569;
}
.sv-note-text {
  font-size: 0.92rem;
  color: #475569;
}
.sv-card-gradient {
  background: linear-gradient(135deg, #f8fafc 0%, #edf2f7 100%);
}
.sv-lead-p-sm {
  font-size: 1rem;
}
.sv-desc-sm {
  color: #475569;
  font-size: 0.95rem;
}
.sv-success-text {
  font-size: 0.95rem;
}
.sv-muted-text {
  font-size: 0.94rem;
  line-height: 1.6;
}
.sv-list-spaced {
  line-height: 1.7;
  font-size: 0.95rem;
}
.sv-contact-box {
  background: linear-gradient(135deg, #002147, #1e3a8a);
}
.sv-contact-footer {
  font-size: 0.9rem;
  line-height: 1.5;
}