/* Base Theme */
:root{
  --bg: #FAF9F7;
  --surface: #FFFFFF;
  --text: #1E0F1C;
  --muted: #6A5A66;
  --line: rgba(30,15,28,0.10);
  --accent: #A7001E;
  --accent-ink: #FFFFFF;
  --chip-bg: rgba(167,0,30,0.08);
  --chip-ink: #7A0E21;
}

*{box-sizing:border-box}
html,body{height:100%; overflow-x:hidden}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
.bg-anim{position:fixed; inset:0; pointer-events:none; z-index:0}
.orbs{position:absolute; inset:0; overflow:hidden}
.orb{position:absolute; border-radius:50%; filter:blur(20px); opacity:.5; mix-blend-mode:multiply}
.o1{width:460px; height:460px; left:-140px; top:-100px; background:radial-gradient(closest-side, rgba(167,0,30,0.60), transparent 70%); animation:float1 18s ease-in-out infinite}
.o2{width:560px; height:560px; right:-200px; top:8%; background:radial-gradient(closest-side, rgba(30,15,28,0.42), transparent 70%); animation:float2 20s ease-in-out infinite}
.o3{width:400px; height:400px; left:38%; bottom:-160px; background:radial-gradient(closest-side, rgba(167,0,30,0.50), transparent 70%); animation:float3 24s ease-in-out infinite}
.beams{position:absolute; inset:0; background:conic-gradient(from 200deg at 70% 30%, rgba(167,0,30,0.20), transparent 30%, rgba(167,0,30,0.18) 60%, transparent 80%); filter:blur(18px); opacity:.85; animation:rotate 28s linear infinite}
#bg-particles{position:absolute; inset:0}

@keyframes rotate{to{transform:rotate(360deg)}}
@keyframes float1{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,30px)}}
@keyframes float2{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,20px)}}
@keyframes float3{0%,100%{transform:translate(0,0)}50%{transform:translate(20px,-30px)}}

/* layer order: bg-anim below content */
.site-header, main, .footer{position:relative; z-index:1}
.splash{position:fixed; inset:0; z-index:9999; background:#FFFFFF; display:grid; place-items:center; transition:opacity .5s ease, visibility .5s ease}
.splash-inner{display:grid; place-items:center; animation:splashPop .8s ease}
.splash-logo{height:68px; width:auto; opacity:.85}
@keyframes splashPop{0%{transform:scale(.96); opacity:0} 50%{transform:scale(1); opacity:1} 100%{transform:scale(1)} }
.splash.hidden{opacity:0; visibility:hidden}

img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}

.container{width:min(1120px, 92vw); margin-inline:auto}

/* Header */
.site-header{position:sticky; top:0; z-index:10; background:rgba(250,249,247,0.8); backdrop-filter:saturate(180%) blur(12px); border-bottom:1px solid var(--line)}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:14px 0}
.brand{display:flex; align-items:center; gap:10px; font-weight:600; letter-spacing:1px}
.brand-logo{height:28px; width:auto; display:block}
.brand-name{font-family: Fraunces, serif; font-weight:700}
/* nav removed for ultra minimal header */

/* Buttons */
.btn{display:inline-flex; align-items:center; gap:10px; padding:12px 18px; border-radius:999px; border:1px solid var(--line); transition:transform .2s ease, background .2s ease, border-color .2s ease}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--accent); color:var(--accent-ink); border-color:transparent}
.btn-primary:hover{filter:brightness(0.96)}
.btn-ghost{background:transparent}

/* Hero */
.section-hero{position:relative; padding:88px 0 56px; overflow:hidden}
.hero-grid{display:grid; grid-template-columns:1fr; gap:48px; align-items:center}
.display{font-family: Fraunces, serif; font-size: clamp(36px, 6vw, 64px); line-height:1.02; margin:0 0 14px}
.lead{font-size:18px; color:var(--muted); margin:0 0 22px}
.hero-ctas{display:flex; gap:12px; flex-wrap:wrap}
.hero-trust{display:none}
.chip{display:none}
.hero-visual{display:flex; justify-content:center}
.hero-visual img{max-width:520px; width:100%; height:auto}
.hero-visual spline-viewer{width:100%; max-width:720px; aspect-ratio: 16/10; border-radius:14px; overflow:hidden}
.decor-orb{position:absolute; width:380px; height:380px; right:-120px; top:-80px; background:radial-gradient(closest-side, rgba(167,0,30,0.18), transparent); filter:blur(12px); border-radius:50%; pointer-events:none}
.decor-orb{animation:orbFloat 18s ease-in-out infinite}
@keyframes orbFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-10px,8px,0)}}

/* Sections */
.section{padding:72px 0}
.section-tight{padding:48px 0}
.apply-card{border:1px solid var(--line); border-radius:16px; padding:24px; background:#FFF; text-align:center; display:grid; gap:10px; justify-items:center}
.apply-sub{color:var(--muted); margin:0}
.floating{animation:floating 10s ease-in-out infinite}
@keyframes floating{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-6px,0)}}
/* Guarantees */
.guarantees{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr; gap:10px}
.guarantee{display:flex; align-items:center; gap:10px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:#FFF; transition:transform .24s cubic-bezier(.22,.61,.36,1), box-shadow .24s cubic-bezier(.22,.61,.36,1), border-color .24s cubic-bezier(.22,.61,.36,1)}
.check{width:18px; height:18px}
@media (min-width: 640px){
  .guarantees{grid-template-columns:repeat(3,1fr)}
}
.section-head{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; margin-bottom:24px; text-align:center}
.eyebrow{font-size:12px; text-transform:uppercase; letter-spacing:0.14em; color:var(--accent); margin:0}
.title{font-family: Fraunces, serif; font-size: clamp(26px, 4vw, 40px); margin:4px 0 0}

/* Manifesto */
.grid-3{display:grid; grid-template-columns:1fr; gap:24px}
.pillar{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:20px}
.pillar h3{margin:0 0 6px}
.pillar p{margin:0; color:var(--muted)}

/* Timeline */
/* Journey */
.journey-grid{display:grid; grid-template-columns:1fr; gap:16px}
.journey-card{border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#FFFFFF}
.journey-media{height:160px; background:#FFFFFF; display:flex; align-items:center; justify-content:center}
.journey-media img{height:100%; width:auto; transition:transform .4s cubic-bezier(.22,.61,.36,1)}
.journey-card h4{margin:12px 12px 6px}
.journey-card p{margin:0 12px 14px; color:var(--muted)}

/* Card hover effects */
.journey-card, .cocard, .eligibility-card{position:relative; transition:transform .28s cubic-bezier(.22,.61,.36,1), box-shadow .28s cubic-bezier(.22,.61,.36,1), border-color .28s cubic-bezier(.22,.61,.36,1); will-change:transform}
.journey-card::before, .cocard::before, .eligibility-card::before{content:""; position:absolute; width:140%; height:140%; top:-120%; left:-120%; background:linear-gradient(45deg, transparent, rgba(255,255,255,0.14), transparent); transition:top .6s ease, left .6s ease; pointer-events:none}
.journey-card:hover, .cocard:hover, .eligibility-card:hover{transform:translateY(-2px) scale(1.02); box-shadow:0 12px 34px rgba(167,0,30,0.14); border-color:rgba(167,0,30,0.22)}
.journey-card:hover::before, .cocard:hover::before, .eligibility-card:hover::before{top:120%; left:120%}
.journey-card:hover .journey-media img{transform:scale(1.05)}
.cocard:hover .copic img{transform:scale(1.05)}

/* Co-create */
.cocreate-grid{display:grid; grid-template-columns:1fr; gap:16px}
.cocard{border:1px solid var(--line); border-radius:14px; padding:16px; background:var(--surface)}
.copic{height:140px; border-radius:10px; background:linear-gradient(180deg, rgba(30,15,28,0.04), transparent); display:flex; align-items:center; justify-content:center; overflow:hidden}
.copic img{width:100%; height:100%; object-fit:cover; transition:transform .4s cubic-bezier(.22,.61,.36,1)}
.cocard h5{margin:10px 0 6px}
.cocard p{margin:0; color:var(--muted)}

/* Eligibility */
/* Eligibility – minimal */
.eligibility-card{border:1px solid var(--line); border-radius:16px; padding:24px; background:#FFFFFF; text-align:center}
.eligibility-note{color:var(--muted); margin:6px 0 14px}
.criteria{display:grid; grid-template-columns:1fr; gap:8px; list-style:none; padding:0; margin:0 0 16px}
.criteria li{padding:10px 12px; border:1px solid var(--line); border-radius:12px}

/* Form */
.form{border:1px solid var(--line); border-radius:16px; padding:20px; background:var(--surface)}
.form-grid{display:grid; grid-template-columns:1fr; gap:16px}
.field{display:grid; gap:8px}
.field span{font-size:13px; color:var(--muted)}
input, select, textarea{font:inherit; padding:12px 14px; border-radius:12px; border:1px solid var(--line); background:#FFF; transition:border-color .2s ease, box-shadow .2s ease}
input:focus, select:focus, textarea:focus{outline:none; border-color:rgba(167,0,30,0.40); box-shadow:0 0 0 4px rgba(167,0,30,0.08)}
.field.full{grid-column:1/-1}
.consent{display:flex; gap:10px; align-items:flex-start; margin-top:10px; font-size:13px; color:var(--muted)}
.form-actions{display:flex; align-items:center; gap:14px; margin-top:16px}
.form-note{margin:0; color:var(--muted); font-size:13px}
.form-success{margin-top:12px; color:#0E7A3E}

/* FAQ */
.faq{border-top:1px solid var(--line)}
.qa{border-bottom:1px solid var(--line); padding:14px 0}
.qa>summary{cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; font-weight:500}
.qa>summary::marker{display:none}
.qa[open] summary{color:var(--accent)}
.qa p{color:var(--muted); margin:8px 0 0}

/* Footer */
.footer{margin-top:40px; padding:20px 0 40px; border-top:1px solid var(--line); background:linear-gradient(180deg, rgba(30,15,28,0.03), transparent)}
.footer-inner{display:grid; grid-template-columns:1fr; gap:10px; align-items:center}
.footer-brand{display:flex; align-items:center; gap:8px; font-weight:600}
.brand-logo.small{height:22px; width:auto}
.footer-links{display:flex; gap:16px; flex-wrap:wrap}
.legal{grid-column:1/-1; color:var(--muted); margin:0; font-size:12px}

/* Animations */
[data-animate]{opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease}
[data-animate].in{opacity:1; transform:none}

/* Responsive */
@media (max-width: 640px){
  .hero-visual{display:none}
  .hero-copy{text-align:center}
  .hero-ctas{justify-content:center}
}
@media (min-width: 640px){
  .journey-grid{grid-template-columns:repeat(2,1fr)}
  .cocreate-grid{grid-template-columns:repeat(2,1fr)}
  .criteria{grid-template-columns:repeat(2,1fr)}
  .form-grid{grid-template-columns:repeat(2,1fr)}
  .footer-inner{grid-template-columns:1fr auto}
}
@media (min-width: 960px){
  .nav-toggle{display:none}
  .nav{position:static; inset:auto; background:transparent; backdrop-filter:none; transform:none; flex-direction:row; padding:0}
  .nav-link{font-size:14px}
  .hero-grid{grid-template-columns:1.1fr 0.9fr}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .cocreate-grid{grid-template-columns:repeat(3,1fr)}
  .journey-grid{grid-template-columns:repeat(4,1fr)}
}

/* Modal */
.modal{position:fixed; inset:0; z-index:20; display:none}
.modal[open]{display:block}
.modal-backdrop{position:absolute; inset:0; background:rgba(30,15,28,0.46); backdrop-filter:blur(6px)}
.modal-dialog{position:relative; margin:6vh auto; width:min(720px, 92vw); background:#FFF; border:1px solid var(--line); border-radius:16px; overflow:hidden}
.modal-close{position:absolute; right:8px; top:8px; border:0; background:transparent; font-size:28px; line-height:1; color:var(--muted); cursor:pointer}
.modal-head{padding:12px 16px 0}
.progress{height:4px; background:rgba(30,15,28,0.06); border-radius:999px; overflow:hidden}
.progress-bar{height:100%; width:0; background:linear-gradient(90deg, #A7001E, #7A0E21)}
.modal-title{text-align:center; margin:12px 0 0}
.wizard{padding:16px}
.wizard .step{display:none}
.wizard .step.in{display:grid; gap:14px}
.wizard .field span{font-size:13px; color:var(--muted)}
.wizard .wizard-actions{display:flex; justify-content:space-between; gap:10px; margin-top:4px}
.wizard .step[data-step="1"] .wizard-actions{justify-content:center}

/* Toast */
.toast{position:fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(20px); background:#1E0F1C; color:#FFF; padding:12px 16px; border-radius:10px; box-shadow:0 10px 30px rgba(30,15,28,0.18); opacity:0; pointer-events:none; transition:opacity .3s ease, transform .3s ease; z-index:9999}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0)}

@media (prefers-reduced-motion: reduce){
  .journey-card, .cocard, .eligibility-card, .journey-media img, .copic img, .guarantee, .toast{transition:none}
}

/* Very small devices */
@media (max-width: 360px){
  .display{font-size: clamp(28px, 8vw, 34px)}
  .lead{font-size:16px}
  .btn{padding:10px 14px}
  .chip{font-size:11px}
  .pillar, .step, .eligibility, .form{padding:16px}
}