/*
 * MSA Education — dark responsive design system
 * -------------------------------------------------
 * Brand blue + red are preserved, but the site now uses a premium dark canvas,
 * glass surfaces, image-led cards and a reusable liquid-hover button treatment.
 */

:root {
  --bg: #040814;
  --bg-2: #070d1d;
  --surface: #0b1428;
  --surface-2: #101c35;
  --surface-3: #14223f;
  --line: rgba(170, 193, 235, .16);
  --line-strong: rgba(170, 193, 235, .28);
  --text: #f7f9ff;
  --text-soft: #c8d2e7;
  --muted: #92a0bc;
  --blue: #2563eb;
  --blue-deep: #0b3ea6;
  --blue-bright: #4f8cff;
  --red: #ef233c;
  --red-deep: #b90e22;
  --green: #24d366;
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 30px;
  --shadow: 0 26px 70px rgba(0,0,0,.34);
  --shadow-soft: 0 14px 40px rgba(0,0,0,.2);
  --shell: 1200px;
  --font-display: "Poppins", "Segoe UI", sans-serif;
  --font-body: "Inter", "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font-body); line-height: 1.65; -webkit-font-smoothing: antialiased; }
body.modal-open { overflow: hidden; }
img { display: block; width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
h1,h2,h3,h4 { margin: 0; font-family: var(--font-display); line-height: 1.12; letter-spacing: -.025em; }
p { margin: 0; }
code { color: #9fc1ff; background: rgba(79,140,255,.08); padding: .12rem .35rem; border-radius: 6px; }
.shell { width: min(calc(100% - 40px), var(--shell)); margin-inline: auto; }
.section { padding: clamp(76px, 8vw, 120px) 0; position: relative; }
.section--surface { background: linear-gradient(180deg, rgba(11,20,40,.88), rgba(7,13,29,.9)); border-block: 1px solid var(--line); }
.muted { color: var(--muted); }
.full-width { width: 100%; }

/* Header */
.site-header { position: fixed; z-index: 100; inset: 0 0 auto; border-bottom: 1px solid transparent; transition: .3s ease; }
.site-header::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,8,20,.92), rgba(4,8,20,.72)); backdrop-filter: blur(18px); opacity: .92; z-index: -1; }
.site-header--scrolled { border-color: var(--line); box-shadow: 0 16px 40px rgba(0,0,0,.2); }
.site-header__inner { height: 82px; display: flex; align-items: center; gap: 24px; }
.brand { display: flex; align-items: center; flex: 0 0 auto; }
.brand__wide { width: 220px; height: 52px; object-fit: contain; object-position: left center; }
.brand__mark { display: none; width: 46px; height: 46px; object-fit: contain; }
.desktop-nav { display: flex; align-items: center; justify-content: center; gap: clamp(16px, 2vw, 30px); margin-left: auto; }
.nav-link { position: relative; color: var(--text-soft); font-size: .9rem; font-weight: 650; white-space: nowrap; padding: 28px 0; }
.nav-link::after { content: ""; position: absolute; height: 2px; border-radius: 10px; left: 0; right: 100%; bottom: 21px; background: linear-gradient(90deg, var(--blue-bright), var(--red)); transition: right .25s ease; }
.nav-link:hover, .nav-link.is-active { color: #fff; }
.nav-link:hover::after, .nav-link.is-active::after { right: 0; }
.site-header__actions { display: flex; align-items: center; gap: 10px; }
.header-cta { font-size: .78rem !important; padding: 11px 15px !important; }
.menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); background: rgba(255,255,255,.04); border-radius: 12px; align-items: center; justify-content: center; flex-direction: column; gap: 5px; cursor: pointer; }
.menu-toggle span { width: 20px; height: 2px; background: #fff; transition: .25s ease; }
.menu-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.is-open span:nth-child(2) { opacity: 0; }
.menu-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-nav { display: none; }

/* Liquid hover button */
.liquid-btn { --btn-a: var(--blue); --btn-b: var(--blue-deep); position: relative; isolation: isolate; overflow: hidden; min-height: 46px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; padding: 12px 20px; display: inline-flex; justify-content: center; align-items: center; gap: 8px; color: #fff; background: linear-gradient(135deg,var(--btn-a),var(--btn-b)); cursor: pointer; font-family: var(--font-display); font-size: .88rem; font-weight: 750; line-height: 1; white-space: nowrap; box-shadow: 0 12px 30px color-mix(in srgb, var(--btn-a) 28%, transparent); transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease; }
.liquid-btn::before, .liquid-btn::after { content: ""; position: absolute; z-index: -1; width: 120%; aspect-ratio: 1; border-radius: 42%; background: rgba(255,255,255,.2); left: -10%; top: 90%; transition: top .55s cubic-bezier(.2,.8,.2,1), transform .7s ease; }
.liquid-btn::after { border-radius: 47%; background: rgba(255,255,255,.12); transform: rotate(34deg); transition-duration: .7s; }
.liquid-btn:hover::before, .liquid-btn:hover::after { top: -48%; transform: rotate(180deg); }
.liquid-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 40px color-mix(in srgb, var(--btn-a) 38%, transparent); border-color: rgba(255,255,255,.34); }
.liquid-btn:active { transform: translateY(0); }
.liquid-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.liquid-btn > span { position: relative; z-index: 2; }
.liquid-btn--accent { --btn-a: #f22b43; --btn-b: #b70b20; }
.liquid-btn--ghost { --btn-a: rgba(255,255,255,.045); --btn-b: rgba(255,255,255,.02); border-color: rgba(255,255,255,.22); box-shadow: none; }
.liquid-btn--glass { --btn-a: rgba(255,255,255,.16); --btn-b: rgba(255,255,255,.07); backdrop-filter: blur(12px); box-shadow: none; }

/* Type + section headings */
.eyebrow, .mini-label { display: inline-flex; align-items: center; gap: 8px; color: #80a9ff; text-transform: uppercase; letter-spacing: .14em; font-family: var(--font-display); font-size: .72rem; font-weight: 800; }
.eyebrow::before { content: ""; width: 22px; height: 2px; background: linear-gradient(90deg,var(--red),var(--blue-bright)); }
.mini-label { color: #9bbaff; font-size: .66rem; }
.section-heading { max-width: 720px; margin-bottom: 42px; }
.section-heading h2 { margin-top: 11px; font-size: clamp(2rem, 4vw, 3.45rem); }
.section-heading p { margin-top: 16px; color: var(--text-soft); font-size: 1.03rem; max-width: 66ch; }
.section-heading--center { text-align: center; margin-inline: auto; }
.section-heading--center .eyebrow { justify-content: center; }
.section-row { display: flex; justify-content: space-between; gap: 30px; align-items: flex-start; }
.setup-badge { margin-top: 12px; flex: 0 0 auto; color: #ffd782; border: 1px solid rgba(255,215,130,.3); background: rgba(255,183,0,.08); border-radius: 999px; padding: 8px 12px; font-size: .78rem; }

/* Hero */
.hero { min-height: 760px; height: min(92vh, 900px); position: relative; display: grid; align-items: center; overflow: hidden; padding-top: 82px; }
.hero__slides, .hero__slide, .hero__scrim, .hero__glow { position: absolute; inset: 0; }
.hero__slide { opacity: 0; background-size: cover; background-position: center; transform: scale(1.06); transition: opacity 1.2s ease, transform 7s ease; }
.hero__slide.is-active { opacity: 1; transform: scale(1); }
.hero__scrim { background: linear-gradient(90deg, rgba(3,6,14,.94) 0%, rgba(3,6,14,.82) 40%, rgba(3,6,14,.4) 72%, rgba(3,6,14,.55) 100%); }
.hero__glow { background: radial-gradient(circle at 16% 32%, rgba(37,99,235,.27), transparent 30%), radial-gradient(circle at 68% 76%, rgba(239,35,60,.16), transparent 26%); }
.hero__content { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1.25fr) minmax(320px,.55fr); gap: clamp(40px,8vw,100px); align-items: end; }
.hero__copy { max-width: 770px; }
.hero__kicker { display: inline-flex; padding: 8px 12px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: rgba(3,6,14,.38); backdrop-filter: blur(10px); color: #c6d8ff; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.hero h1 { margin-top: 18px; font-size: clamp(3.1rem, 7vw, 6.7rem); max-width: 10.8ch; text-shadow: 0 10px 45px rgba(0,0,0,.34); }
.hero h1 em { font-style: normal; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.82); background: linear-gradient(90deg,#fff,#90b4ff); -webkit-background-clip: text; background-clip: text; }
.hero__copy > p { max-width: 650px; margin-top: 22px; color: #d4def0; font-size: clamp(1rem,1.6vw,1.18rem); }
.hero__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
.hero__proof { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.hero__proof span { color: #bdc9df; border: 1px solid rgba(255,255,255,.14); background: rgba(4,8,20,.36); border-radius: 999px; padding: 7px 10px; font-size: .72rem; }
.glass-card { border: 1px solid rgba(255,255,255,.18); background: linear-gradient(145deg,rgba(8,15,31,.72),rgba(8,15,31,.4)); backdrop-filter: blur(18px); box-shadow: var(--shadow); }
.hero__side-card { padding: 26px; border-radius: 24px; }
.hero__side-card strong { display: block; margin-top: 9px; font-family: var(--font-display); font-size: 1.32rem; }
.hero__side-card p { margin-top: 10px; color: var(--text-soft); font-size: .9rem; }
.hero__dots { display: flex; gap: 7px; margin-top: 20px; }
.hero__dots button { width: 26px; height: 4px; border: 0; border-radius: 20px; background: rgba(255,255,255,.25); padding: 0; cursor: pointer; }
.hero__dots button.is-active { background: var(--red); width: 40px; }

/* Metrics */
.metric-strip { border-block: 1px solid var(--line); background: rgba(7,13,29,.94); }
.metric-strip__grid { display: grid; grid-template-columns: repeat(4,1fr); }
.metric-strip__grid > div { padding: 30px clamp(15px,3vw,34px); display: flex; gap: 14px; align-items: baseline; border-right: 1px solid var(--line); }
.metric-strip__grid > div:last-child { border-right: 0; }
.metric-strip strong { font-size: clamp(1.9rem,3vw,3rem); font-family: var(--font-display); background: linear-gradient(135deg,#fff,#88adff); -webkit-background-clip: text; color: transparent; }
.metric-strip span { color: var(--muted); font-size: .82rem; line-height: 1.35; }

/* Generic image cards */
.card-grid { display: grid; gap: 22px; }
.card-grid--2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.card-grid--3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.image-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(180deg,rgba(16,28,53,.86),rgba(9,17,34,.95)); box-shadow: var(--shadow-soft); transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease; }
.image-card:hover { transform: translateY(-7px); border-color: rgba(79,140,255,.38); box-shadow: 0 26px 70px rgba(0,0,0,.35); }
.image-card__media { aspect-ratio: 16/9; overflow: hidden; position: relative; }
.image-card__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent,rgba(3,6,14,.28)); }
.image-card__media img { height: 100%; object-fit: cover; transition: transform .7s ease; }
.image-card:hover img { transform: scale(1.06); }
.image-card__body { padding: 25px; }
.image-card h3 { font-size: 1.28rem; margin-top: 6px; }
.image-card p { color: var(--text-soft); margin-top: 10px; }
.image-card .liquid-btn { margin-top: 20px; }

/* Events */
.event-card { min-height: 470px; position: relative; overflow: hidden; border-radius: 24px; border: 1px solid rgba(255,255,255,.14); box-shadow: var(--shadow); }
.event-card > img { position: absolute; inset: 0; height: 100%; object-fit: cover; transition: transform .8s ease; }
.event-card:hover > img { transform: scale(1.08); }
.event-card__overlay { position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,6,14,.14) 10%,rgba(3,6,14,.9) 66%,rgba(3,6,14,.98)); }
.event-card__top { position: relative; z-index: 2; display:flex; justify-content:space-between; padding:20px; }
.event-date { width: 62px; height: 66px; border-radius: 14px; background: rgba(239,35,60,.92); display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 14px 30px rgba(239,35,60,.26); }
.event-date b { font-size: 1.2rem; line-height: 1; }
.event-date small { font-size: .58rem; margin-top: 4px; letter-spacing: .08em; }
.status { padding:7px 10px;border-radius:999px;height:max-content;font-size:.65rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800;background:rgba(8,15,31,.72);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(10px); }
.status--live { background:rgba(239,35,60,.82); }
.event-card__content { position:absolute;z-index:2;inset:auto 0 0;padding:24px; }
.event-card__content h3 { margin-top:5px;font-size:1.45rem; }
.event-card__content p { margin-top:9px;color:#c8d3e8;font-size:.85rem; }
.event-card__content > strong { display:block;margin-top:7px;font-size:.9rem; }
.event-card__content .liquid-btn { margin-top:18px; }
.loading-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:22px; }
.loading-grid div { height:360px;border-radius:24px;background:linear-gradient(90deg,#0b1428,#152442,#0b1428);background-size:200% 100%;animation:shimmer 1.2s infinite; }
@keyframes shimmer { to { background-position:-200% 0; } }
.empty-state { grid-column:1/-1;padding:34px;border-radius:20px;border:1px dashed var(--line-strong);background:rgba(255,255,255,.025);color:var(--text-soft); }
.empty-state h3 { color:#fff;margin-bottom:8px; }

/* Subject ribbon */
.subject-ribbon { display:grid;grid-template-columns:repeat(5,1fr);gap:12px; }
.subject-ribbon__item { min-height:250px;position:relative;overflow:hidden;border-radius:18px;border:1px solid var(--line); }
.subject-ribbon__item img { position:absolute;inset:0;height:100%;object-fit:cover;filter:saturate(.9);transition:.6s ease; }
.subject-ribbon__item::after { content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,6,14,.1),rgba(3,6,14,.92)); }
.subject-ribbon__item span { position:absolute;z-index:2;left:18px;bottom:16px;font-family:var(--font-display);font-size:1.05rem;font-weight:750; }
.subject-ribbon__item:hover img { transform:scale(1.08); }

/* Founder home */
.founder-home { background:radial-gradient(circle at 20% 20%,rgba(37,99,235,.12),transparent 26%); }
.founder-home__grid { display:grid;grid-template-columns:minmax(320px,.8fr) 1.15fr;gap:clamp(40px,7vw,90px);align-items:center; }
.founder-home__image { position:relative;max-width:510px; }
.founder-home__image > img { aspect-ratio:4/5;object-fit:cover;object-position:center 18%;border-radius:30px;border:1px solid var(--line);box-shadow:var(--shadow); }
.founder-home__badge { position:absolute;left:24px;right:24px;bottom:24px;padding:15px 17px;border-radius:15px;background:rgba(5,10,23,.78);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(14px); }
.founder-home__badge b,.founder-home__badge span { display:block; }
.founder-home__badge span { color:var(--muted);font-size:.78rem;margin-top:3px; }
.founder-home h2 { margin-top:12px;font-size:clamp(2rem,4vw,3.6rem); }
.founder-home p { margin:20px 0;color:var(--text-soft);max-width:62ch; }

/* CTA */
.cta-photo { min-height:520px;background-size:cover;background-position:center;display:flex;align-items:center; }
.cta-photo__content { max-width:var(--shell); }
.cta-photo__content h2 { max-width:720px;margin-top:12px;font-size:clamp(2.4rem,5vw,4.8rem); }
.cta-photo__content p { max-width:600px;margin:17px 0 26px;color:var(--text-soft); }
.cta-simple { border-block:1px solid var(--line);background:linear-gradient(90deg,rgba(11,62,166,.18),rgba(239,35,60,.08)); }
.cta-simple__inner { display:flex;justify-content:space-between;align-items:center;gap:30px; }
.cta-simple h2 { margin-top:9px;font-size:clamp(2rem,4vw,3.6rem); }

/* Page heroes */
.page-hero { min-height:520px;padding:170px 0 90px;background-size:cover;background-position:center;display:flex;align-items:end;border-bottom:1px solid var(--line); }
.page-hero h1 { max-width:900px;margin-top:14px;font-size:clamp(2.8rem,6vw,5.8rem); }
.page-hero p { max-width:720px;margin-top:18px;color:#d2ddef;font-size:1.05rem; }

/* About */
.about-intro { display:grid;grid-template-columns:1fr .9fr;gap:70px;align-items:center; }
.lead { color:#fff;font-size:1.18rem;max-width:65ch; }
.about-intro > div:first-child > p + p { margin-top:16px;color:var(--text-soft); }
.credential-pills { display:flex;flex-wrap:wrap;gap:8px;margin-top:24px; }
.credential-pills span,.tag-row span { border:1px solid var(--line);background:rgba(37,99,235,.08);color:#b8ccf3;border-radius:999px;padding:7px 10px;font-size:.72rem; }
.about-intro__visual { position:relative; }
.about-intro__visual > img { aspect-ratio:4/3;object-fit:cover;border-radius:28px;border:1px solid var(--line); }
.floating-quote { position:absolute;left:-28px;right:35px;bottom:-28px;padding:20px;border-radius:16px;background:rgba(8,15,31,.92);border:1px solid var(--line-strong);box-shadow:var(--shadow-soft);font-family:var(--font-display);font-weight:700; }
.founder-message__grid { display:grid;grid-template-columns:minmax(320px,.78fr) 1.25fr;gap:clamp(40px,7vw,90px);align-items:center; }
.founder-message__portrait img { aspect-ratio:4/5;object-fit:cover;object-position:center 18%;border-radius:30px;border:1px solid var(--line);box-shadow:var(--shadow); }
.founder-message h2 { margin-top:12px;font-size:clamp(2rem,4vw,3.7rem); }
.founder-message blockquote { margin:25px 0 0;padding:0 0 0 22px;border-left:3px solid var(--red);color:var(--text-soft);font-size:1.08rem; }
.founder-signoff { margin-top:25px;display:flex;flex-direction:column; }
.founder-signoff span { color:var(--muted);font-size:.8rem; }
.faculty-card { overflow:hidden;border-radius:20px;border:1px solid var(--line);background:var(--surface);transition:.35s ease; }
.faculty-card:hover { transform:translateY(-6px);border-color:rgba(79,140,255,.36); }
.faculty-card__image { aspect-ratio:16/9;overflow:hidden; }
.faculty-card__image img { height:100%;object-fit:cover; }
.faculty-card__image--portrait { aspect-ratio:16/9; }
.faculty-card__image--portrait img { object-position:center 18%; }
.faculty-card__body { padding:22px; }
.faculty-card h3 { margin-top:6px;font-size:1.25rem; }
.faculty-card__role { margin-top:5px;color:#b6c7e6;font-size:.84rem; }
.faculty-card ul { margin:14px 0 0;padding-left:18px;color:var(--muted);font-size:.78rem; }
.faculty-card li+li { margin-top:5px; }

/* Subjects */
.subject-card .image-card__media { aspect-ratio:2.1/1; }
.subject-card h3 { font-size:1.6rem; }
.tag-row { display:flex;flex-wrap:wrap;gap:7px;margin-top:16px; }

/* Forms */
.form-card { padding:clamp(24px,4vw,42px);border-radius:24px;border:1px solid var(--line);background:linear-gradient(150deg,rgba(16,28,53,.9),rgba(7,13,29,.98));box-shadow:var(--shadow); }
.form-card h2 { margin:10px 0 24px;font-size:clamp(1.8rem,3vw,2.7rem); }
.form-stack { display:flex;flex-direction:column;gap:15px; }
.form-stack label { display:flex;flex-direction:column;gap:7px; }
.form-stack label > span { color:#c2cee3;font-size:.78rem;font-weight:700; }
.form-stack input,.form-stack select,.form-stack textarea { width:100%;border:1px solid var(--line-strong);border-radius:12px;background:rgba(3,7,16,.65);color:#fff;padding:13px 14px;outline:none;transition:.2s ease; }
.form-stack textarea { min-height:110px;resize:vertical; }
.form-stack input:focus,.form-stack select:focus,.form-stack textarea:focus { border-color:var(--blue-bright);box-shadow:0 0 0 3px rgba(79,140,255,.1); }
.form-stack select option { background:#07101f; }
.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.form-error { color:#ffc1ca;border:1px solid rgba(239,35,60,.32);background:rgba(239,35,60,.08);padding:10px 12px;border-radius:10px;font-size:.8rem; }
.success-panel { text-align:center;padding:20px 5px; }
.success-panel__icon { width:54px;height:54px;border-radius:50%;background:rgba(36,211,102,.12);border:1px solid rgba(36,211,102,.3);color:#62ed95;display:grid;place-items:center;margin:0 auto 15px;font-size:1.5rem;font-weight:800; }
.success-panel h3 { font-size:1.7rem; }
.success-panel p { color:var(--text-soft);margin:10px auto 20px;max-width:50ch; }

/* Demo modal */
.modal-backdrop { position:fixed;z-index:300;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(10px);display:grid;place-items:center;padding:20px;animation:fade .2s ease; }
@keyframes fade { from{opacity:0} }
.demo-modal { position:relative;width:min(920px,100%);max-height:min(92vh,820px);overflow:auto;border-radius:28px;border:1px solid rgba(255,255,255,.18);background:#07101f;box-shadow:0 40px 120px rgba(0,0,0,.65);display:grid;grid-template-columns:.88fr 1.1fr;animation:pop .32s cubic-bezier(.2,.8,.2,1); }
@keyframes pop { from{opacity:0;transform:translateY(22px) scale(.98)} }
.demo-modal__visual { min-height:100%; }
.demo-modal__visual img { height:100%;object-fit:cover; }
.demo-modal__content { padding:38px; }
.demo-modal__content h3 { margin-top:9px;font-size:clamp(1.8rem,3vw,2.7rem); }
.demo-modal__content > .muted { margin:9px 0 22px; }
.modal-close { position:absolute;z-index:4;right:14px;top:14px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(4,8,20,.72);font-size:1.5rem;line-height:1;cursor:pointer; }

/* Admissions */
.split-layout,.contact-grid { display:grid;grid-template-columns:1fr .9fr;gap:clamp(36px,7vw,80px);align-items:start; }
.benefit-list { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:24px; }
.benefit-list div { border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025);display:flex;align-items:center;gap:12px;padding:9px; }
.benefit-list img { width:58px;height:48px;border-radius:9px;object-fit:cover; }
.benefit-list span { font-size:.83rem;font-weight:650; }
.contact-cards { display:flex;flex-direction:column;gap:12px; }
.contact-cards > * { display:flex;align-items:center;gap:14px;padding:11px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025); }
.contact-cards img { width:86px;height:66px;border-radius:10px;object-fit:cover; }
.contact-cards span { display:flex;flex-direction:column; }
.contact-cards small { color:var(--muted);margin-top:2px; }

/* Quiz */
.quiz-shell { max-width:1050px; }
.quiz-meta { display:flex;gap:7px;margin-top:15px; }
.quiz-meta span { background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:999px;padding:6px 9px;font-size:.7rem;color:var(--muted); }
.quiz-panel { display:grid;grid-template-columns:.78fr 1.1fr;overflow:hidden;border-radius:26px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow); }
.quiz-panel > img { height:100%;object-fit:cover;min-height:520px; }
.quiz-panel__body { padding:clamp(28px,5vw,55px); }
.quiz-panel__body h2 { margin:12px 0 12px;font-size:clamp(2rem,4vw,3.5rem); }
.quiz-panel__body > p { color:var(--text-soft);margin-bottom:23px; }
.question-panel { max-width:780px;margin-inline:auto;border:1px solid var(--line);border-radius:26px;background:linear-gradient(150deg,var(--surface-2),var(--surface));padding:clamp(25px,5vw,48px);box-shadow:var(--shadow); }
.question-panel__progress { display:flex;align-items:center;gap:15px;margin-bottom:28px;color:var(--muted);font-size:.76rem; }
.question-panel__progress > div { flex:1;height:6px;border-radius:20px;background:rgba(255,255,255,.08);overflow:hidden; }
.question-panel__progress i { display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,var(--blue),var(--red)); }
.question-panel h2 { margin:10px 0 24px;font-size:clamp(1.5rem,3vw,2.25rem); }
.answer-list { display:flex;flex-direction:column;gap:10px; }
.answer-list button { text-align:left;display:flex;align-items:center;gap:13px;padding:13px;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:13px;cursor:pointer;transition:.2s ease; }
.answer-list button span { width:34px;height:34px;border-radius:9px;background:rgba(37,99,235,.12);display:grid;place-items:center;color:#a9c2f6;font-weight:800; }
.answer-list button:hover,.answer-list button.is-selected { border-color:var(--blue-bright);background:rgba(37,99,235,.1); }
.answer-list button.is-selected span { background:var(--blue);color:#fff; }
.question-panel__nav { display:flex;justify-content:space-between;gap:12px;margin-top:25px; }
.result-panel { display:grid;grid-template-columns:240px 1fr;gap:35px;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:26px;padding:clamp(28px,5vw,50px);box-shadow:var(--shadow); }
.result-score { aspect-ratio:1;border-radius:50%;display:grid;place-items:center;align-content:center;border:1px solid rgba(79,140,255,.35);background:radial-gradient(circle,rgba(37,99,235,.2),rgba(37,99,235,.04)); }
.result-score span { font-family:var(--font-display);font-size:3rem;font-weight:850; }
.result-score small { color:var(--muted); }
.result-panel h2 { margin:9px 0; }
.result-panel p { color:var(--text-soft); }
.topic-breakdown { margin:18px 0; }
.topic-breakdown > div { display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:8px 0;color:var(--text-soft);font-size:.85rem; }
.notice { padding:12px 14px;margin-bottom:20px;border-radius:12px;border:1px solid rgba(79,140,255,.25);background:rgba(37,99,235,.08);color:#c7d8ff;font-size:.82rem; }
.notice--error { border-color:rgba(239,35,60,.28);background:rgba(239,35,60,.08);color:#ffd1d7; }

/* Not found */
.not-found { min-height:100vh;display:grid;place-items:center;padding:130px 20px 70px;text-align:center;background:radial-gradient(circle at 50% 35%,rgba(37,99,235,.18),transparent 28%); }
.not-found > div { max-width:680px; }
.not-found h1 { margin:12px 0;font-size:clamp(3rem,7vw,6rem); }
.not-found p { color:var(--text-soft);margin-bottom:22px; }

/* Footer + WhatsApp */
.footer { border-top:1px solid var(--line);background:#02050c;padding:70px 0 25px; }
.footer__grid { display:grid;grid-template-columns:1.35fr .72fr .9fr 1fr;gap:38px; }
.footer__brand img { width:260px;max-width:100%; }
.footer__brand p { margin-top:15px;font-family:var(--font-display);font-weight:700; }
.footer__brand small { color:var(--muted);display:block;margin-top:5px; }
.footer h4 { margin-bottom:15px;font-size:.9rem;color:#fff; }
.footer__grid > div:not(.footer__brand) { display:flex;flex-direction:column;align-items:flex-start;gap:9px;color:var(--text-soft);font-size:.83rem; }
.footer__grid > div:not(.footer__brand) a:hover { color:#fff; }
.footer__grid .liquid-btn { margin-top:8px; }
.footer__bottom { display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:50px;padding-top:22px;color:#697891;font-size:.7rem; }
.whatsapp-fab { position:fixed;z-index:90;right:20px;bottom:20px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#06150b;box-shadow:0 18px 44px rgba(36,211,102,.34);transition:.25s ease; }
.whatsapp-fab:hover { transform:translateY(-4px) scale(1.04); }
.whatsapp-fab svg { width:29px;height:29px; }

/* React Admin */
.admin-loading { min-height:100vh;display:grid;place-items:center;background:var(--bg);color:var(--muted); }
.admin-login { min-height:100vh;display:grid;grid-template-columns:1.08fr .92fr;background:var(--bg); }
.admin-login__visual { min-height:100vh;background-size:cover;background-position:center;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(40px,7vw,90px); }
.admin-login__visual img { width:min(420px,70%);margin-bottom:25px; }
.admin-login__visual h1 { font-size:clamp(2.6rem,5vw,5rem);max-width:8ch; }
.admin-login__visual p { max-width:540px;color:var(--text-soft);margin-top:16px; }
.admin-login__form { width:min(470px,calc(100% - 40px));margin:auto;display:flex;flex-direction:column;gap:15px;padding:40px 0; }
.admin-login__form h2 { font-size:2.4rem;margin-top:8px; }
.admin-login__form > p { color:var(--muted);margin-bottom:10px; }
.admin-login__form label { display:flex;flex-direction:column;gap:7px; }
.admin-login__form label span { color:var(--text-soft);font-size:.78rem; }
.admin-login__form input { border:1px solid var(--line-strong);background:var(--surface);color:#fff;border-radius:12px;padding:13px 14px; }
.admin-back { text-align:center;color:var(--muted);font-size:.8rem;margin-top:5px; }
.admin-shell { min-height:100vh;background:#050a15;display:grid;grid-template-columns:250px 1fr; }
.admin-sidebar { position:sticky;top:0;height:100vh;border-right:1px solid var(--line);background:#030711;padding:25px 18px;display:flex;flex-direction:column; }
.admin-sidebar > img { width:190px;margin:0 8px 30px; }
.admin-sidebar nav { display:flex;flex-direction:column;gap:5px; }
.admin-sidebar nav button,.admin-sidebar__bottom button,.admin-sidebar__bottom a { border:0;text-align:left;padding:11px 12px;border-radius:10px;background:transparent;color:#aab8d2;cursor:pointer;font-size:.84rem; }
.admin-sidebar nav button:hover,.admin-sidebar nav button.is-active { background:rgba(37,99,235,.12);color:#fff; }
.admin-sidebar__bottom { margin-top:auto;display:flex;flex-direction:column;border-top:1px solid var(--line);padding-top:14px; }
.admin-main { min-width:0;padding:32px clamp(20px,4vw,54px) 60px; }
.admin-topbar { display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px; }
.admin-topbar h1 { margin-top:4px;font-size:2rem; }
.admin-user { text-align:right;display:flex;flex-direction:column;font-size:.75rem;color:var(--muted); }
.admin-user b { color:#fff; }
.admin-metrics { display:grid;grid-template-columns:repeat(3,1fr);gap:15px; }
.admin-metric { min-height:130px;position:relative;overflow:hidden;border-radius:17px;border:1px solid var(--line);background:var(--surface);display:flex;align-items:flex-end;padding:18px; }
.admin-metric::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,6,14,.94),rgba(3,6,14,.5)); }
.admin-metric img { position:absolute;inset:0;height:100%;object-fit:cover; }
.admin-metric div { position:relative;z-index:2;display:flex;flex-direction:column; }
.admin-metric strong { font-size:1.9rem;font-family:var(--font-display); }
.admin-metric span { color:#c4d0e6;font-size:.75rem; }
.admin-info-card,.admin-card { border:1px solid var(--line);border-radius:18px;background:var(--surface);padding:24px;margin-top:18px; }
.admin-info-card h2,.admin-card h2 { font-size:1.25rem;margin-bottom:10px; }
.admin-info-card p { color:var(--text-soft);font-size:.85rem;margin-top:8px; }
.admin-two-col { display:grid;grid-template-columns:minmax(300px,.7fr) minmax(0,1.3fr);gap:18px;align-items:start; }
.admin-two-col > .admin-card { margin-top:0; }
.admin-list { display:flex;flex-direction:column;gap:8px; }
.admin-list > div { display:flex;align-items:center;gap:11px;border-bottom:1px solid var(--line);padding:9px 0; }
.admin-list > div:last-child { border-bottom:0; }
.admin-list img { width:56px;height:48px;border-radius:8px;object-fit:cover; }
.admin-list > div > div { min-width:0;display:flex;flex-direction:column;flex:1; }
.admin-list b { font-size:.82rem; }
.admin-list span { color:var(--muted);font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.admin-list button,.admin-card__header button,.question-admin-list button { border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:8px;padding:7px 9px;font-size:.68rem;cursor:pointer; }
.danger-link { color:#ff8796 !important;border-color:rgba(239,35,60,.25)!important; }
.status-button { color:#9fc1ff!important; }
.admin-list--quiz > div { flex-wrap:wrap; }
.admin-questions { margin-top:18px; }
.admin-card__header { display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px; }
.admin-card__header h2 { margin-top:4px;margin-bottom:0; }
.question-admin-list { display:flex;flex-direction:column;gap:12px; }
.question-admin-list > div { padding:14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02); }
.question-admin-list b,.question-admin-list small { display:block; }
.question-admin-list small { color:var(--muted);margin-top:3px; }
.question-admin-list ul { margin:8px 0;padding-left:18px;color:var(--text-soft);font-size:.72rem; }
.question-admin-list li.is-correct { color:#69e99a;font-weight:700; }
.admin-stack { display:flex;flex-direction:column;gap:18px; }
.admin-stack .admin-card { margin-top:0; }
.table-wrap { overflow:auto; }
.table-wrap table { width:100%;border-collapse:collapse;min-width:650px; }
.table-wrap th,.table-wrap td { text-align:left;border-bottom:1px solid var(--line);padding:9px 10px;font-size:.72rem;vertical-align:top; }
.table-wrap th { color:#90a6ca;text-transform:capitalize;font-weight:750; }
.admin-security { max-width:650px; }

/* Responsive */
@media (max-width: 1050px) {
  .desktop-nav { display:none; }
  .menu-toggle { display:flex; }
  .site-header__actions { margin-left:auto; }
  .mobile-nav { display:flex;position:absolute;left:20px;right:20px;top:76px;padding:12px;border-radius:16px;border:1px solid var(--line);background:rgba(5,10,23,.96);backdrop-filter:blur(20px);box-shadow:var(--shadow);flex-direction:column; }
  .mobile-nav__link { padding:11px 12px;border-radius:9px;color:var(--text-soft);font-size:.86rem;font-weight:700; }
  .mobile-nav__link.is-active { background:rgba(37,99,235,.12);color:#fff; }
  .hero__content { grid-template-columns:1fr;align-items:center; }
  .hero__side-card { display:none; }
  .hero h1 { max-width:12ch; }
  .subject-ribbon { grid-template-columns:repeat(3,1fr); }
  .footer__grid { grid-template-columns:1.2fr 1fr 1fr; }
  .footer__grid > div:last-child { grid-column:1/-1; }
  .admin-metrics { grid-template-columns:repeat(2,1fr); }
  .admin-two-col { grid-template-columns:1fr; }
}

@media (max-width: 820px) {
  .shell { width:min(calc(100% - 28px), var(--shell)); }
  .brand__wide { display:none; }
  .brand__mark { display:block; }
  .site-header__inner { height:72px;gap:10px; }
  .header-cta { min-height:40px;padding:9px 13px!important;font-size:.7rem!important; }
  .hero { min-height:730px;height:auto;padding:150px 0 85px; }
  .hero__scrim { background:linear-gradient(180deg,rgba(3,6,14,.76),rgba(3,6,14,.91) 55%,rgba(3,6,14,.98)); }
  .hero h1 { font-size:clamp(3rem,12vw,5.6rem); }
  .metric-strip__grid { grid-template-columns:1fr 1fr; }
  .metric-strip__grid > div:nth-child(2) { border-right:0; }
  .metric-strip__grid > div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .card-grid--3,.card-grid--2 { grid-template-columns:1fr 1fr; }
  .subject-ribbon { grid-template-columns:1fr 1fr; }
  .founder-home__grid,.about-intro,.founder-message__grid,.split-layout,.contact-grid,.quiz-panel,.result-panel { grid-template-columns:1fr; }
  .founder-home__image { max-width:100%; }
  .founder-home__image > img,.founder-message__portrait img { max-height:680px; }
  .page-hero { min-height:470px;padding-top:145px; }
  .floating-quote { left:15px;right:15px; }
  .quiz-panel > img { min-height:280px;max-height:380px; }
  .result-score { width:210px;margin:auto; }
  .demo-modal { grid-template-columns:1fr;max-width:560px; }
  .demo-modal__visual { height:210px;min-height:0; }
  .footer__grid { grid-template-columns:1fr 1fr; }
  .footer__grid > div:last-child { grid-column:auto; }
  .admin-login { grid-template-columns:1fr; }
  .admin-login__visual { min-height:410px; }
  .admin-shell { grid-template-columns:1fr; }
  .admin-sidebar { position:relative;height:auto;flex-direction:row;align-items:center;overflow:auto;padding:12px 14px; }
  .admin-sidebar > img { width:150px;margin:0 15px 0 0; }
  .admin-sidebar nav { flex-direction:row;white-space:nowrap; }
  .admin-sidebar__bottom { display:none; }
  .admin-main { padding-top:24px; }
}

@media (max-width: 620px) {
  .section { padding:70px 0; }
  .site-header__inner { height:68px; }
  .mobile-nav { top:66px;left:14px;right:14px; }
  .header-cta { max-width:145px; }
  .hero { padding-top:125px;min-height:690px; }
  .hero__copy > p { font-size:.96rem; }
  .hero__actions { flex-direction:column;align-items:stretch;max-width:340px; }
  .hero__actions .liquid-btn { width:100%; }
  .metric-strip__grid { grid-template-columns:1fr; }
  .metric-strip__grid > div { border-right:0!important;border-bottom:1px solid var(--line); }
  .metric-strip__grid > div:last-child { border-bottom:0; }
  .card-grid--3,.card-grid--2,.subject-ribbon,.benefit-list { grid-template-columns:1fr; }
  .subject-ribbon__item { min-height:220px; }
  .section-row,.cta-simple__inner,.footer__bottom,.admin-topbar { flex-direction:column;align-items:flex-start; }
  .setup-badge { margin-top:-18px;margin-bottom:20px; }
  .page-hero { min-height:450px;padding:135px 0 65px; }
  .form-grid { grid-template-columns:1fr; }
  .demo-modal__content { padding:28px 20px 24px; }
  .question-panel { padding:24px 18px; }
  .question-panel__nav { flex-direction:column; }
  .question-panel__nav .liquid-btn { width:100%; }
  .footer__grid { grid-template-columns:1fr; }
  .footer__brand img { width:230px; }
  .admin-login__visual { min-height:350px;padding:35px 25px; }
  .admin-login__form { padding:30px 0; }
  .admin-metrics { grid-template-columns:1fr; }
  .admin-topbar { gap:8px; }
  .admin-user { text-align:left; }
}

@media (max-width: 390px) {
  .header-cta { padding-inline:11px!important;font-size:.64rem!important; }
  .menu-toggle { width:40px;height:40px; }
  .brand__mark { width:42px;height:42px; }
  .hero h1 { font-size:2.7rem; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important; }
}