/* ===== EventDesk v2 — EliseAI-faithful design system ===== */
:root{
  --purple:#7638FA;--purple-2:#704EFF;--purple-soft:#C1B8FF;--purple-wash:#F3EFFF;--purple-deep:#0F042D;
  --title:#181819;--body:#515152;--muted:#6B6B6D;
  --white:#fff;--off:#FAFAFB;--off-2:#F5F4F2;--line:#EAEAED;--line-2:#DDDCDA;--line-ctrl:#8F8E8B;
  --ok:#2F9C63;--ok-bg:#E3F6EC;
  --disp:'Inter Tight',system-ui,sans-serif;--sans:'Inter',system-ui,sans-serif;--mono:'IBM Plex Mono',monospace;
  --maxw:1200px;--pad:96px;
  /* Spacing scale (see web-design-guide.md). Additive — snap all spacing to these. */
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;--s-10:40px;--s-12:48px;--s-16:64px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--sans);color:var(--body);background:var(--white);-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}
.sec{padding:var(--pad) 0;}
.sec.off{background:var(--off);}
.sec.dark{background:var(--purple-deep);color:#EDEAFB;}
.center{text-align:center;}

/* type */
h1,h2,h3{font-family:var(--disp);font-weight:500;letter-spacing:-.03em;color:var(--title);margin:0;}
.dark h1,.dark h2,.dark h3{color:#fff;}
.eyebrow{font-family:var(--mono);font-size:13px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--purple);margin:0 0 14px;}
.dark .eyebrow{color:var(--purple-soft);}
.h-xl{font-size:clamp(38px,6vw,64px);line-height:1.02;}
.h-lg{font-size:clamp(30px,4.5vw,48px);line-height:1.05;}
.h-md{font-size:clamp(22px,3vw,30px);line-height:1.1;}
.lede{font-family:var(--sans);font-size:clamp(17px,2vw,19px);font-weight:400;line-height:1.5;color:var(--body);}
.dark .lede{color:#B9B3CC;}
.muted{color:var(--muted);}

/* pill / eyebrow chip */
.pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:13px;font-weight:500;color:var(--purple);background:var(--purple-wash);border:1px solid #E3DBFF;padding:6px 14px;border-radius:999px;}
.dark .pill{color:var(--purple-soft);background:rgba(118,56,250,.16);border-color:rgba(138,107,255,.4);}
.pill .nu{background:var(--purple);color:#fff;border-radius:999px;font-size:10px;font-weight:600;padding:2px 8px;letter-spacing:.03em;}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:15px;font-weight:500;
  padding:12px 22px;border-radius:8px;border:1px solid transparent;cursor:pointer;transition:transform .08s,background .15s;}
.btn:active{transform:translateY(1px);}
.btn .arr{font-size:14px;}
.btn-purple{background:var(--purple);color:#fff;}
.btn-purple:hover{background:var(--purple-2);}
.btn-dark{background:var(--title);color:#fff;}
.btn-white{background:#fff;color:var(--title);}
.btn-ghost{background:transparent;border-color:var(--line-2);color:var(--title);}
.btn-ghost-d{background:transparent;border-color:rgba(255,255,255,.28);color:#fff;}

/* nav (injected) */
.nav{position:sticky;top:0;z-index:50;background:var(--purple-deep);}
.nav.lite{background:#fff;border-bottom:1px solid var(--line);}
.nav-inner{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:16px 32px;}
.nav .logo{font-family:var(--disp);font-weight:600;font-size:20px;letter-spacing:-.03em;color:#fff;display:flex;align-items:center;gap:9px;}
.nav.lite .logo{color:var(--title);}
.nav .logo .dot{width:24px;height:24px;border-radius:7px;background:var(--purple);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;font-family:var(--disp);}
.nav-links{display:flex;gap:28px;align-items:center;font-size:14.5px;font-weight:500;color:#EDEAFB;}
.nav.lite .nav-links{color:var(--title);}
.nav-links .has{position:relative;cursor:pointer;}
.nav-links .has::after{content:" \25BE";font-size:8px;opacity:.5;margin-left:4px;}
.nav-right{display:flex;gap:18px;align-items:center;font-size:14px;font-weight:500;color:#EDEAFB;}
.nav.lite .nav-right{color:var(--title);}
.mega{position:absolute;top:130%;left:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 24px 50px -24px rgba(40,20,90,.35);padding:14px;min-width:300px;display:none;}
.nav-links .has.open .mega{display:block;}
.mega a{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border-radius:8px;color:var(--title);}
.mega a:hover{background:var(--off);}
.mega a .mt{font-weight:600;font-size:14px;}
.mega a .md{font-size:12.5px;color:var(--muted);}
.nav-burger{display:none;background:none;border:none;color:inherit;font-size:22px;cursor:pointer;}
.mobile-menu{display:none;}

/* hero (dark) */
.hero-dark{background:var(--purple-deep);color:#fff;position:relative;overflow:hidden;text-align:center;padding:56px 0 0;}
.hero-dark::before{content:"";position:absolute;top:-25%;left:50%;transform:translateX(-50%);width:80%;height:80%;
  background:radial-gradient(circle,rgba(118,56,250,.55),transparent 60%);pointer-events:none;}
.hero-dark .inner{position:relative;max-width:var(--maxw);margin:0 auto;padding:0 32px;}
.hero-dark h1{max-width:14em;margin:18px auto 18px;}
.hero-dark .lede{max-width:33em;margin:0 auto 26px;}
.hero-ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:34px;}

/* product mockup */
.shot{border-radius:12px 12px 0 0;border:1px solid rgba(255,255,255,.08);border-bottom:none;background:#fff;overflow:hidden;max-width:820px;margin:0 auto;box-shadow:0 26px 60px -30px rgba(0,0,0,.6);}
.shot.light{border:1px solid var(--line);border-radius:12px;box-shadow:0 26px 55px -30px rgba(60,40,130,.45);}
.shot-bar{display:flex;gap:6px;align-items:center;padding:11px 14px;border-bottom:1px solid var(--line);background:var(--off);}
.shot-bar i{width:10px;height:10px;border-radius:50%;background:#E2DFEA;}
.shot-bar .url{margin-left:12px;font-family:var(--mono);font-size:10.5px;color:#b3aec0;}
.shot-body{display:grid;grid-template-columns:150px 1fr;min-height:230px;text-align:left;}
.shot-side{background:var(--off);border-right:1px solid var(--line);padding:16px 12px;}
.shot-side .navi{display:flex;align-items:center;gap:9px;font-size:12.5px;color:#7b7688;font-weight:500;padding:8px 10px;border-radius:8px;margin-bottom:3px;}
.shot-side .navi.on{background:var(--purple-wash);color:var(--purple);font-weight:600;}
.shot-side .navi .ic{width:14px;height:14px;border-radius:4px;background:#dcd6ec;}
.shot-side .navi.on .ic{background:var(--purple);}
.shot-main{padding:18px 20px;}
.shot-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.shot-h .t{font-family:var(--disp);font-size:15px;font-weight:600;color:var(--title);}
.shot-h .chip{font-size:10.5px;font-weight:600;color:var(--purple);background:var(--purple-wash);padding:4px 10px;border-radius:999px;}
.ev{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px;}
.ev .day{text-align:center;background:var(--off-2);border-radius:8px;padding:6px 10px;min-width:46px;}
.ev .day .m{font-family:var(--mono);font-size:9px;color:var(--purple);letter-spacing:.05em;}
.ev .day .d{font-family:var(--disp);font-size:18px;font-weight:600;color:var(--title);line-height:1;}
.ev .meta{flex:1;} .ev .meta .t{font-size:13px;font-weight:600;color:var(--title);} .ev .meta .s{font-size:11.5px;color:var(--muted);}
.ev .bar{width:54px;height:6px;border-radius:99px;background:var(--line);overflow:hidden;} .ev .bar i{display:block;height:100%;background:var(--purple);}
.ev .ok{width:18px;height:18px;border-radius:50%;background:var(--ok-bg);color:var(--ok);display:inline-flex;align-items:center;justify-content:center;font-size:11px;}

/* logo wall */
.wall{display:flex;gap:36px;justify-content:center;align-items:center;flex-wrap:wrap;}
.wall .lab{width:100%;text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;}
.wall span{font-family:var(--disp);font-weight:600;font-size:16px;letter-spacing:-.02em;color:#c4c0ce;}
.dark .wall span{color:#5a5378;}

/* generic grids + cards */
.grid{display:grid;gap:18px;}
.g2{grid-template-columns:repeat(2,1fr);}.g3{grid-template-columns:repeat(3,1fr);}.g4{grid-template-columns:repeat(4,1fr);}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px;}
.card h3{font-size:18px;font-weight:600;margin-bottom:8px;}
.card p{font-size:14px;line-height:1.5;margin:0;}

/* audience card */
.aud{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px;transition:border-color .15s,transform .1s;}
.aud:hover{border-color:var(--purple);transform:translateY(-2px);}
.aud .ico{width:40px;height:40px;border-radius:10px;background:var(--purple-wash);color:var(--purple);display:flex;align-items:center;justify-content:center;font-size:18px;margin-bottom:14px;}
.aud h3{font-size:17px;font-weight:600;margin-bottom:6px;}
.aud p{font-size:13.5px;color:var(--body);line-height:1.5;margin:0 0 12px;}
.aud .go{font-size:13px;font-weight:600;color:var(--purple);}

/* compare old-vs-new */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.compare .col{padding:28px;}
.compare .old{background:var(--off);}
.compare .new{background:#fff;border-left:1px solid var(--line);}
.compare h4{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 16px;}
.compare .old h4{color:var(--muted);} .compare .new h4{color:var(--purple);}
.compare ul{list-style:none;padding:0;margin:0;}
.compare li{font-size:14.5px;line-height:1.5;padding:9px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;}
.compare li:last-child{border:none;}
.compare .old li::before{content:"\2715";color:var(--muted);}
.compare .new li::before{content:"\2713";color:var(--ok);font-weight:700;}

/* stat band */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.stats .n{font-family:var(--disp);font-size:clamp(32px,4vw,46px);font-weight:600;color:#fff;line-height:1;}
.stats .k{font-size:13.5px;color:#B9B3CC;margin-top:8px;}

/* feature row */
.feat{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:36px;border:1px solid var(--line);border-radius:16px;background:#fff;margin-bottom:20px;}
.feat:last-child{margin-bottom:0;}
.feat.rev .ftext{order:2;}
.feat .ftext h3{font-size:clamp(24px,3vw,30px);font-weight:500;margin-bottom:14px;}
.feat .ftext p{font-size:16px;line-height:1.55;margin:0 0 16px;}
.feat .ftext ul{list-style:none;padding:0;margin:0 0 16px;}
.feat .ftext li{font-size:14.5px;padding:6px 0;display:flex;gap:10px;}
.feat .ftext li::before{content:"\2713";color:var(--purple);font-weight:700;}

/* integrations strip */
.integ{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.integ .chip{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--title);background:#fff;border:1px solid var(--line);border-radius:999px;padding:10px 18px;}

/* trust */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.trust .card .ico{font-size:20px;margin-bottom:10px;}

/* testimonials */
.tcar{position:relative;}
.tslide{display:none;}
.tslide.on{display:block;}
.tcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:32px;max-width:760px;margin:0 auto;text-align:center;}
.tcard q{font-family:var(--disp);font-weight:500;font-size:clamp(20px,2.6vw,26px);line-height:1.3;color:var(--title);display:block;margin-bottom:18px;}
.tcard .who{font-size:14px;color:var(--body);}
.tcard .who b{color:var(--title);}
.tdots{display:flex;gap:8px;justify-content:center;margin-top:20px;}
.tdots button{width:9px;height:9px;border-radius:50%;border:none;background:var(--line-2);cursor:pointer;}
.tdots button.on{background:var(--purple);}

/* pricing */
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:start;}
.price{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;}
.price.pick{border:2px solid var(--purple);box-shadow:0 20px 40px -28px rgba(118,56,250,.5);}
.price .tag{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--purple);margin-bottom:10px;}
.price .amt{font-family:var(--disp);font-size:40px;font-weight:600;color:var(--title);}
.price .amt small{font-size:14px;color:var(--muted);font-family:var(--sans);}
.price ul{list-style:none;padding:0;margin:18px 0;}
.price li{font-size:14px;padding:7px 0;display:flex;gap:10px;border-bottom:1px solid var(--line);}
.price li::before{content:"\2713";color:var(--ok);font-weight:700;}

/* faq */
.faq{max-width:780px;margin:0 auto;}
.qa{border-bottom:1px solid var(--line);}
.qa button{width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:20px 0;font-family:var(--disp);font-size:18px;font-weight:500;color:var(--title);display:flex;justify-content:space-between;align-items:center;gap:16px;}
.qa .ans{display:none;padding:0 0 20px;font-size:15px;line-height:1.6;color:var(--body);}
.qa.open .ans{display:block;}
.qa button .pm{color:var(--purple);font-size:22px;font-weight:400;}

/* final cta */
.cta{background:var(--purple-deep);color:#fff;text-align:center;border-radius:18px;padding:56px 40px;position:relative;overflow:hidden;}
.cta::before{content:"";position:absolute;top:-30%;left:50%;transform:translateX(-50%);width:70%;height:90%;background:radial-gradient(circle,rgba(118,56,250,.5),transparent 60%);}
.cta .inner{position:relative;}

/* footer */
.foot{background:var(--title);color:#cfccd6;padding:56px 0 32px;}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px;}
.foot h5{font-size:13px;font-weight:600;color:#fff;margin:0 0 14px;text-transform:uppercase;letter-spacing:.05em;font-family:var(--mono);}
.foot a{display:block;font-size:14px;color:#cfccd6;padding:5px 0;}
.foot a:hover{color:#fff;}
.foot .bottom{border-top:1px solid #2a2a2c;margin-top:40px;padding-top:20px;font-size:13px;color:#8a8a8c;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}

/* responsive */
@media(max-width:900px){
  :root{--pad:56px;}
  .g2,.g3,.g4,.compare,.feat,.stats,.trust,.prices,.foot-grid{grid-template-columns:1fr;}
  .feat.rev .ftext{order:0;}
  .stats{grid-template-columns:repeat(2,1fr);}
  .nav-links,.nav-right .lnk{display:none;}
  .nav-burger{display:block;}
  .shot-body{grid-template-columns:1fr;} .shot-side{display:none;}
}

/* ===== form fields (public pages, Phase 3) — additive ===== */
.field{margin-bottom:18px;}
.label{display:block;font-family:var(--sans);font-size:14px;font-weight:600;color:var(--title);margin-bottom:7px;}
.input,.select,.textarea{width:100%;height:46px;padding:0 14px;border:1px solid var(--line-ctrl);border-radius:8px;font-family:var(--sans);font-size:15px;color:var(--title);background:#fff;outline:none;}
.textarea{height:auto;min-height:120px;padding:12px 14px;line-height:1.5;resize:vertical;}
.input:focus,.select:focus,.textarea:focus{border-color:var(--purple);box-shadow:0 0 0 3px var(--purple-wash);}
.input::placeholder,.textarea::placeholder{color:var(--muted);}
.help{font-size:13px;color:var(--muted);margin-top:7px;}
.error{font-size:13px;color:#C0392B;margin-top:7px;}
.checkbox,.radio{display:inline-flex;align-items:center;gap:9px;font-size:14.5px;color:var(--body);cursor:pointer;}

/* ===== a11y + state foundations (UX pass — EliseAI-preserving) ===== */
/* Visible keyboard focus on every interactive element (WCAG 2.1 AA). */
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible,
[role="button"]:focus-visible,[role="tab"]:focus-visible,summary:focus-visible{
  outline:2px solid var(--purple);outline-offset:2px;
}
/* Selectable rows/cards (radios, tier options) show focus on the container too. */
.radio:focus-within,.checkbox:focus-within{outline:2px solid var(--purple);outline-offset:2px;border-radius:8px;}
/* Button states the kit was missing: disabled affordance + secondary hovers. */
.btn[disabled],.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none;}
.btn-dark:hover{background:#000;}
.btn-white:hover{background:var(--off);}
.btn-ghost:hover{background:var(--off);}
/* Honor reduced-motion: drop non-essential animation/transition. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
}
