@font-face { font-family: 'InterVar'; src: url(../fonts/inter.woff2) format('woff2'); font-weight: 400 800; font-style: normal; }

:root{
  --ink:#1C1626; --ink-soft:#6E6478;
  --purple:#7837FF; --purple-deep:#4B1FA8;
  --coral:#FF7A59; --coral-soft:#FFE4D9;
  --lavender:#F3EEFC; --section-alt:#F8F4F2;
  --border:#EFE5EC; --white:#FFFFFF;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--white);color:var(--ink);font-family:'InterVar',sans-serif;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
h1,h2,h3{margin:0; font-weight:800; letter-spacing:-.02em; text-wrap:balance; color:var(--ink);}
p{margin:0;}
a{color:inherit;}
.wrap{max-width:1120px; margin:0 auto; padding-left:clamp(20px,5vw,40px); padding-right:clamp(20px,5vw,40px);}
.hl{color:var(--purple);}

/* ---------- scroll-reveal animations ---------- */
.reveal{opacity:0; transition:opacity .75s cubic-bezier(.2,.65,.2,1), transform .75s cubic-bezier(.2,.65,.2,1);}
.reveal-up{transform:translateY(30px);}
.reveal-left{transform:translateX(-48px);}
.reveal-right{transform:translateX(48px);}
.reveal.is-visible{opacity:1; transform:translate(0,0);}
.stagger > *:nth-child(1){transition-delay:0ms;}
.stagger > *:nth-child(2){transition-delay:110ms;}
.stagger > *:nth-child(3){transition-delay:220ms;}
.stagger > *:nth-child(4){transition-delay:330ms;}
.stagger > *:nth-child(5){transition-delay:440ms;}
.stagger > *:nth-child(6){transition-delay:550ms;}
.stagger > *:nth-child(7){transition-delay:660ms;}
.stagger > *:nth-child(8){transition-delay:770ms;}
@media (prefers-reduced-motion: reduce){
  .reveal, .reveal.is-visible{transition:none !important; opacity:1 !important; transform:none !important;}
}

/* ---------- nav ---------- */
.nav{position:sticky; top:0; z-index:20; background:rgba(255,255,255,.9); backdrop-filter:blur(8px); border-bottom:1px solid var(--border);}
.nav-inner{max-width:1120px; margin:0 auto; padding:16px clamp(20px,5vw,40px); display:flex; align-items:center; justify-content:space-between; gap:16px;}
.nav-brand{display:flex; align-items:center; gap:10px; font-weight:800; font-size:17px;}
.nav-brand img{height:38px; width:auto; display:block;}
.footer-logo{height:56px; width:auto; margin:0 auto 18px; display:block;}
.nav-links{display:flex; gap:28px; font-size:14.5px; font-weight:500;}
.nav-links a{text-decoration:none; color:var(--ink); padding-bottom:2px; border-bottom:2px solid transparent;}
.nav-links a:hover, .nav-links a:focus-visible{color:var(--purple);}
.nav-links a.active{color:var(--purple); border-bottom-color:var(--purple);}
.nav-links a:focus-visible{outline:2px solid var(--purple); outline-offset:4px; border-radius:2px;}

.btn{display:inline-flex; align-items:center; gap:8px; font-size:14.5px; font-weight:700; border-radius:999px; padding:12px 22px; text-decoration:none; border:none; cursor:pointer;}
.btn-solid{background:var(--ink); color:#fff;}
.btn-solid:hover, .btn-solid:focus-visible{background:var(--purple-deep);}
.btn-purple{background:var(--purple); color:#fff;}
.btn-purple:hover, .btn-purple:focus-visible{background:var(--purple-deep);}
.btn-outline{background:transparent; color:var(--ink); border:1.5px solid var(--border);}
.btn-outline:hover, .btn-outline:focus-visible{border-color:var(--ink);}
.btn:focus-visible{outline:2px solid var(--purple-deep); outline-offset:3px;}
.btn-lg{padding:16px 30px; font-size:16px;}
.btn:disabled{opacity:.6; cursor:not-allowed;}

/* ---------- hero: split layout (home) ---------- */
.hero{padding:clamp(48px,7vw,80px) 0 clamp(64px,9vw,100px);}
.hero-grid{display:grid; grid-template-columns:1fr 0.95fr; gap:clamp(32px,5vw,64px); align-items:center;}
.pill-badge{display:inline-flex; align-items:center; gap:6px; background:var(--ink); color:#fff; font-size:13px; font-weight:700; border-radius:999px; padding:8px 16px; margin-bottom:24px;}
.hero h1{font-size:clamp(34px,4.6vw,54px); line-height:1.08; margin-bottom:22px;}
.hero .lede{font-size:17px; line-height:1.65; color:var(--ink-soft); max-width:46ch; margin-bottom:32px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.hero-photo{position:relative;}
.hero-photo .blob{position:absolute; width:85%; height:85%; background:var(--coral-soft); border-radius:40% 60% 55% 45%/50% 45% 55% 50%; top:-8%; right:-10%; z-index:0;}
.hero-photo .frame{position:relative; z-index:1; border-radius:32px; overflow:hidden; box-shadow:0 30px 60px -25px rgba(28,22,38,.35);}

/* ---------- page hero (services / events / contact) ---------- */
.page-hero{padding:clamp(56px,8vw,96px) 0 clamp(40px,6vw,64px); text-align:center; background:linear-gradient(180deg,#FBFAFE 0%, #FFFFFF 70%); position:relative; overflow:hidden;}
.page-hero .ghost{position:absolute; top:-140px; right:-140px; width:420px; height:420px; border-radius:50%; border:60px solid var(--lavender); opacity:.6; pointer-events:none;}
.page-hero-inner{position:relative; z-index:2; max-width:720px; margin:0 auto;}
.page-hero h1{font-size:clamp(32px,4.4vw,48px); line-height:1.1; margin-bottom:18px;}
.page-hero p{font-size:16.5px; line-height:1.7; color:var(--ink-soft); max-width:60ch; margin:0 auto 12px;}

/* ---------- section shells ---------- */
.section{padding:clamp(56px,8vw,96px) 0;}
.section-alt{background:var(--section-alt);}
.eyebrow{display:block; font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--purple); margin-bottom:14px;}
.head-center{text-align:center; max-width:700px; margin:0 auto clamp(40px,5vw,60px);}
.head-center h2{font-size:clamp(26px,3.4vw,36px);}
.head-left h2{font-size:clamp(26px,3.4vw,36px); margin-bottom:16px;}

/* ---------- journey steps: left-aligned timeline ---------- */
.steps{max-width:640px; margin:0 auto;}
.step{display:flex; gap:24px; position:relative; padding-bottom:38px;}
.step:last-child{padding-bottom:0;}
.step::before{content:""; position:absolute; left:21px; top:44px; bottom:-2px; width:2px; background:var(--border);}
.step:last-child::before{display:none;}
.step-chip{width:44px; height:44px; border-radius:14px; background:var(--purple); color:#fff; font-weight:800; font-size:16px; display:flex; align-items:center; justify-content:center; flex-shrink:0; position:relative; z-index:1;}
.step-text{padding-top:9px;}
.step p{font-size:15.5px; line-height:1.6; color:var(--ink-soft); max-width:46ch; margin:0; text-align:left;}
.step p strong{color:var(--ink); font-weight:700;}

/* ---------- why: photo split ---------- */
.why{display:grid; grid-template-columns:0.95fr 1.05fr; gap:clamp(32px,5vw,60px); align-items:center;}
.why-photo{border-radius:28px; overflow:hidden; box-shadow:0 25px 50px -25px rgba(28,22,38,.3);}
.why-copy p{font-size:16px; line-height:1.75; color:var(--ink-soft); margin-bottom:16px;}
.why-copy p:last-child{margin-bottom:0;}

/* ---------- services ---------- */
.service-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.service-card{display:block; background:#fff; border-radius:24px; overflow:hidden; box-shadow:0 18px 40px -28px rgba(28,22,38,.4); border:1px solid var(--border); text-decoration:none; transition:transform .18s ease, box-shadow .18s ease;}
.service-card:hover, .service-card:focus-visible{transform:translateY(-5px); box-shadow:0 26px 46px -24px rgba(28,22,38,.5);}
.service-card:focus-visible{outline:2px solid var(--purple-deep); outline-offset:3px;}
.service-media{position:relative;}
.service-media img{aspect-ratio:1; object-fit:cover; width:100%;}
.service-tag{position:absolute; top:12px; left:12px; background:rgba(255,255,255,.92); backdrop-filter:blur(4px); color:var(--purple-deep); font-size:11.5px; font-weight:700; border-radius:999px; padding:6px 12px;}
.sc-body{padding:18px 18px 20px; display:flex; align-items:center; justify-content:space-between; gap:10px;}
.service-card h3{font-size:16px; font-weight:700;}
.sc-arrow{color:var(--purple); font-size:18px; flex-shrink:0; transition:transform .18s ease;}
.service-card:hover .sc-arrow, .service-card:focus-visible .sc-arrow{transform:translateX(3px);}
.also-row{margin-top:28px; display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-size:14px; color:var(--ink-soft);}
.tag{background:var(--lavender); color:var(--purple-deep); font-size:12.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; border-radius:999px; padding:6px 13px;}

/* ---------- full services page: card with description ---------- */
.service-full-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.service-full-card{background:#fff; border-radius:24px; overflow:hidden; box-shadow:0 18px 40px -28px rgba(28,22,38,.4); border:1px solid var(--border); scroll-margin-top:100px;}
.service-full-card img{aspect-ratio:1; object-fit:cover; width:100%;}
.service-full-card .sfc-body{padding:18px 18px 22px;}
.service-full-card h3{font-size:16.5px; margin-bottom:8px;}
.service-full-card p{font-size:13.5px; line-height:1.6; color:var(--ink-soft);}

/* ---------- events / video cards ---------- */
.video-grid{display:grid; grid-template-columns:1fr 1fr; gap:28px;}
.video-card{background:var(--section-alt); border-radius:24px; overflow:hidden; border:1px solid var(--border);}
.video-card video{width:100%; max-height:520px; object-fit:cover; background:#000; display:block;}
.video-meta{padding:18px 20px 22px;}
.video-meta h3{font-size:18px; margin-bottom:4px;}
.video-meta p{font-size:13.5px; color:var(--ink-soft);}

/* ---------- stat ---------- */
.stat-band{background:var(--ink); border-radius:32px; padding:clamp(44px,6vw,64px) 20px; text-align:center; color:#fff;}
.stat-band .num{font-size:clamp(42px,6.5vw,64px); font-weight:800; color:#fff; letter-spacing:-.02em; line-height:1;}
.stat-band .label{font-size:14px; font-weight:600; color:#C9BEDA; letter-spacing:.03em; text-transform:uppercase; margin-top:10px;}

/* ---------- contact form ---------- */
.contact-wrap{max-width:620px; margin:0 auto;}
.field{margin-bottom:20px;}
.field label{display:block; font-size:14px; font-weight:700; margin-bottom:8px;}
.field input, .field textarea{
  width:100%; border:1.5px solid var(--border); background:#fff; border-radius:14px;
  padding:13px 16px; font-size:15px; font-family:inherit; color:var(--ink); resize:vertical;
}
.field input:focus, .field textarea:focus{outline:2px solid var(--purple); outline-offset:1px;}
.contact-meta{text-align:center; color:var(--ink-soft); font-size:14.5px; margin-bottom:34px;}
.form-status{display:none; text-align:center; border-radius:14px; padding:16px 18px; font-size:14.5px; font-weight:600; margin-top:18px;}
.form-status.show{display:block;}
.form-status.success{background:#E9F7EE; color:#1F7A3F;}
.form-status.error{background:#FDEAE6; color:#B3311A;}

/* ---------- footer ---------- */
.footer{text-align:center; padding:clamp(48px,7vw,72px) 0 40px;}
.footer .contact-line{font-size:14.5px; color:var(--ink-soft); margin-bottom:6px;}
.footer .contact-line a{text-decoration:none;}
.footer .contact-line a:hover{color:var(--purple);}
.footer .copy{font-size:12.5px; color:#B0A6BC;}

/* ---------- cta band (closing section on every page) ---------- */
.cta-band{text-align:center;}
.cta-band h2{font-size:clamp(26px,3.4vw,36px); margin-bottom:14px;}
.cta-band p{font-size:15.5px; color:var(--ink-soft); margin-bottom:28px;}

@media (max-width:860px){
  .hero-grid, .why{grid-template-columns:1fr;}
  .hero-photo{order:-1;}
  .service-grid, .service-full-grid{grid-template-columns:repeat(2,1fr);}
  .video-grid{grid-template-columns:1fr;}
  .nav-links{display:none;}
}
