:root {
    --primary: #5d3db7;
    --primary-dark: #2e2f8c;
    --secondary: #d65be6;
    --secondary-soft: #f0b2fb;
    --accent: #8b4bd4;
    --dark: #10142f;
    --light: #f7f5ff;
    --text: #2a2f4a;
    --white: #ffffff;
    --border: rgba(93, 61, 183, 0.12);
    --shadow: 0 18px 45px rgba(33, 28, 88, 0.14);
    --radius-lg: 28px;
}
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; color: var(--text); background: #fff; overflow-x:hidden; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4 { font-family: 'Playfair Display', serif; }
a { text-decoration: none; }
.skip-link { position:absolute; top:-50px; left:10px; background:#000; color:#fff; padding:.75rem 1rem; z-index:9999; }
.skip-link:focus { top:10px; }
.navbar { padding:1rem 0; transition: background-color .25s ease, box-shadow .25s ease, padding .25s ease; background: rgba(10,12,35,.2); }
.navbar.scrolled { background: rgba(14,18,49,.96); box-shadow:0 10px 35px rgba(0,0,0,.18); padding:.7rem 0; }
.brand-logo { width:220px; max-width:100%; }
.nav-link { font-weight:600; color:rgba(255,255,255,.88)!important; }
.nav-link:hover,.nav-link.active { color:#fff!important; }
.nav-cta,.btn-primary { background:linear-gradient(135deg, var(--secondary), var(--primary)); border:none; box-shadow:0 12px 25px rgba(110,65,194,.25); }
.btn-primary:hover,.nav-cta:hover { background:linear-gradient(135deg,#de74eb,#6744ca); }
.hero-section { position:relative; min-height:100vh; display:flex; align-items:center; padding:8rem 0 5rem; background:linear-gradient(135deg,#10142f 0%,#232a71 45%,#5d3db7 100%); overflow:hidden; }
.hero-overlay { position:absolute; inset:0; background:radial-gradient(circle at 10% 20%, rgba(214,91,230,.26), transparent 20%), linear-gradient(90deg, rgba(8,10,27,.72) 0%, rgba(8,10,27,.42) 45%, rgba(8,10,27,.08) 100%); }
.hero-shape { position:absolute; border-radius:50%; filter:blur(18px); opacity:.25; }
.hero-shape-1 { width:420px; height:420px; background:var(--secondary); right:-100px; top:80px; }
.hero-shape-2 { width:320px; height:320px; background:#88a6ff; left:-120px; bottom:-100px; }
.eyebrow,.section-heading { text-transform:uppercase; letter-spacing:.18em; font-size:.78rem; font-weight:800; }
.eyebrow,.hero-subtitle,.value-chip,.text-white-75 { color:rgba(255,255,255,.9); }
.hero-title { color:#fff; font-weight:800; margin:1rem 0 1.2rem; line-height:1.02; max-width:640px; }
.hero-subtitle { font-size:1.1rem; max-width:640px; margin-bottom:2rem; }
.hero-portrait-wrap { position:relative; display:flex; justify-content:center; align-items:center; min-height:540px; }
.hero-glow { position:absolute; width:78%; height:78%; background:radial-gradient(circle, rgba(255,255,255,.42) 0%, rgba(214,91,230,.26) 35%, transparent 72%); border-radius:50%; filter:blur(8px); }
.hero-portrait { position:relative; z-index:2; max-height:760px; object-fit:contain; filter:drop-shadow(0 24px 55px rgba(0,0,0,.3)); }
.hero-actions .btn { min-width:190px; }
.value-chip { background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.15); border-radius:999px; padding:.9rem 1rem; text-align:center; font-weight:700; }
.trust-bar { background:var(--dark); color:#fff; padding:1.3rem 0; }
.section-padding { padding:5.5rem 0; }
.section-heading { color:var(--secondary); margin-bottom:.9rem; }
.section-title { font-size:clamp(2rem,4vw,3.25rem); line-height:1.05; margin-bottom:1rem; color:var(--dark); }
.section-intro { max-width:720px; }
.section-art-card,.content-panel,.issue-card,.mission-panel,.cta-panel,.signup-card { border-radius:var(--radius-lg); box-shadow:var(--shadow); }
.section-art-card { background:linear-gradient(145deg,#f5efff,#ffffff); padding:2.25rem; border:1px solid var(--border); }
.content-panel { background:#fff; border:1px solid var(--border); padding:2rem; }
.lead-copy { font-size:1.1rem; line-height:1.8; }
.mini-feature { display:flex; gap:1rem; align-items:flex-start; padding:1rem 1.1rem; border:1px solid var(--border); border-radius:18px; height:100%; background:#fff; }
.mini-feature-number { display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg, var(--secondary), var(--primary)); color:#fff; font-weight:800; font-size:.95rem; }
.mini-feature-text { font-weight:600; line-height:1.55; }
.issues-section { background:var(--light); }
.issue-card { background:#fff; padding:2rem; transition:transform .25s ease, box-shadow .25s ease; border:1px solid rgba(93, 61, 183, 0.08); }
.issue-card:hover { transform:translateY(-6px); box-shadow:0 22px 38px rgba(48,37,115,.14); }
.issue-icon { width:68px; height:68px; border-radius:18px; display:inline-flex; align-items:center; justify-content:center; font-size:1.75rem; color:#fff; margin-bottom:1rem; background:linear-gradient(135deg, var(--secondary), var(--primary)); }
.issue-card p { line-height:1.75; }
.mission-section { background:linear-gradient(135deg,#201751 0%,#39257c 55%,#7b43ca 100%); }
.mission-panel { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16); padding:2rem; backdrop-filter:blur(10px); }
.mission-list { list-style:none; margin:0; padding:0; }
.mission-list li { color:#fff; padding:0 0 1rem 2rem; position:relative; font-size:1.05rem; line-height:1.7; }
.mission-list li::before { content:"\f26e"; font-family:bootstrap-icons; position:absolute; left:0; top:.1rem; color:#ffd7ff; }
.cta-panel { background:#fff; padding:2.3rem; border:1px solid rgba(93,61,183,.1); }
.signup-card { color:#fff; padding:2.3rem; background:linear-gradient(145deg, var(--primary), var(--secondary)); }
.focus-item { display:flex; gap:.9rem; align-items:center; padding:.9rem 0; font-weight:600; border-bottom:1px solid rgba(255,255,255,.18); }
.focus-item span { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.16); font-size:.85rem; font-weight:800; }
.signup-divider { margin:1.5rem 0; border-color:rgba(255,255,255,.22); }
.donate-box { background:rgba(255,255,255,.12); padding:1.25rem; border-radius:18px; }
.volunteer-form .form-control,.volunteer-form .form-select { min-height:52px; border-radius:14px; border:1px solid rgba(93,61,183,.18); }
.volunteer-form textarea.form-control { min-height:140px; }
.form-label { font-weight:600; }
.text-link { color:var(--primary); font-weight:600; }
.site-footer { background:#10142f; padding:3rem 0; }
.footer-logo { width:220px; max-width:100%; }
.footer-title { color:#fff; font-size:1.2rem; margin-bottom:1rem; }
.footer-links a { color:rgba(255,255,255,.72); }
.footer-links a:hover { color:#fff; }
.alert-fixed { max-width:840px; margin:0 auto 1.5rem; }
.reveal-up,.reveal-right { opacity:0; transform:translateY(30px); transition:opacity .7s ease, transform .7s ease; }
.reveal-right { transform:translateX(30px); }
.reveal-up.visible,.reveal-right.visible { opacity:1; transform:translate(0,0); }
.delay-1 { transition-delay:.1s; } .delay-2 { transition-delay:.2s; } .delay-3 { transition-delay:.3s; }
@media (max-width: 991.98px) {
    .navbar-collapse { margin-top:1rem; background:rgba(16,20,47,.96); padding:1rem; border-radius:18px; }
    .hero-section { min-height:auto; padding-top:8rem; text-align:center; }
    .hero-title,.hero-subtitle { margin-left:auto; margin-right:auto; }
    .hero-actions,.hero-badges { justify-content:center; }
    .hero-portrait-wrap { min-height:420px; }
}
@media (max-width: 767.98px) {
    .brand-logo { width:170px; }
    .section-padding { padding:4rem 0; }
    .hero-title { font-size:clamp(2.4rem,8vw,3.8rem); }
    .hero-subtitle { font-size:1rem; }
    .hero-portrait { max-height:450px; }
    .cta-panel,.signup-card,.issue-card,.mission-panel,.section-art-card,.content-panel { padding:1.5rem; }
    .volunteer-form .btn-lg,.hero-actions .btn-lg { width:100%; }
}
