/* Ather Schools — Phase 2 page-specific styles
 * Calendar, wizard, scheduler, fees calc, leadership, faculty, alumni, uni wall, etc.
 * Editorial site-wide layer appended at end of file.
 */

/* -------- Wizard -------- */
.wizard{max-width:880px;margin:0 auto;}
.wizard__steps{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap;}
.wizard__step{flex:1;min-width:120px;padding:.65rem .8rem;border-radius:10px;background:var(--mist);
  color:var(--text-soft,#677);font-size:.85rem;font-weight:600;display:flex;gap:.5rem;align-items:center;}
.wizard__step .num{width:24px;height:24px;border-radius:50%;background:#fff;display:inline-grid;place-items:center;font-size:.8rem;border:1px solid var(--rule);}
.wizard__step.is-current{background:var(--brand-navy);color:#fff;}
.wizard__step.is-current .num{background:var(--brand-gold);color:var(--brand-navy-deep);border-color:transparent;}
.wizard__step.is-done{background:#E7F2EC;color:#2E7D5B;}
.wizard__step.is-done .num{background:#2E7D5B;color:#fff;border-color:transparent;}
.wizard__progress{height:6px;background:var(--mist);border-radius:3px;overflow:hidden;margin-bottom:1.5rem;}
.wizard__bar{height:100%;background:linear-gradient(90deg,var(--brand-gold),var(--brand-navy));transition:width .3s ease;}
.wizard__nav{display:flex;justify-content:space-between;margin-top:1.5rem;gap:.8rem;flex-wrap:wrap;}
.wizard input.has-error,.wizard select.has-error,.wizard textarea.has-error{border-color:#B6263A;box-shadow:0 0 0 3px rgba(182,38,58,.15);}
.wizard__done{text-align:center;padding:3rem 1.5rem;background:var(--mist);border-radius:18px;}
.wizard__done h2{font-family:'Playfair Display',serif;font-style:italic;}
.wizard__done .ref{font-family:'Courier New',monospace;background:#fff;padding:.4rem .8rem;border-radius:6px;display:inline-block;}

.dropzone{
  border:2px dashed var(--rule);border-radius:12px;padding:1.5rem;text-align:center;background:var(--mist);
  display:grid;gap:.4rem;
}
.dropzone input[type="file"]{margin:0 auto;}

/* -------- Scheduler -------- */
.sched-days{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.5rem;margin-top:1rem;}
.sched-day{padding:.7rem;border-radius:10px;border:1px solid var(--rule);background:#fff;cursor:pointer;font-weight:600;color:var(--brand-navy);}
.sched-day:hover{border-color:var(--brand-navy);}
.sched-day.is-active{background:var(--brand-navy);color:#fff;}
.sched-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.5rem;margin-top:1rem;}
.sched-slot{padding:.6rem;border-radius:8px;border:1px solid var(--rule);background:#fff;cursor:pointer;font-weight:600;}
.sched-slot:hover{border-color:var(--brand-gold);}
.sched-slot.is-active{background:var(--brand-gold);color:var(--brand-navy-deep);border-color:transparent;}
.sched-slot.is-taken{background:var(--mist);color:#999;cursor:not-allowed;text-decoration:line-through;}
.sched-review{background:var(--mist);border-radius:12px;padding:1rem 1.25rem;margin-top:1.5rem;}

/* -------- Calendar -------- */
.cal{display:grid;grid-template-columns:2fr 1fr;gap:2rem;}
@media (max-width:1024px){ .cal{grid-template-columns:1fr;} }
.cal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;}
.cal-header h3{font-family:'Playfair Display',serif;font-style:italic;margin:0;}
.cal-nav{display:flex;gap:.4rem;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;background:var(--rule);border-radius:12px;overflow:hidden;}
.cal-head{background:var(--brand-navy);color:#fff;text-align:center;padding:.6rem .2rem;font-size:.8rem;font-weight:600;}
.cal-cell{background:#fff;min-height:84px;padding:.4rem;border:0;text-align:left;cursor:pointer;font:inherit;color:inherit;display:flex;flex-direction:column;gap:.3rem;}
.cal-cell--blank{background:var(--mist);cursor:default;}
.cal-cell.is-today{background:#FFF7E0;}
.cal-cell.has-events{background:#F7FAF7;}
.cal-cell:hover{outline:2px solid var(--brand-gold);outline-offset:-2px;}
.cal-num{font-weight:600;font-size:.9rem;}
.cal-dots{display:flex;gap:3px;align-items:center;flex-wrap:wrap;margin-top:auto;}
.cal-dot{width:8px;height:8px;border-radius:50%;display:inline-block;}
.cal-more{font-size:.7rem;color:var(--text-soft,#677);}
.cal-upcoming{display:grid;gap:1rem;}
.cal-event{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;background:var(--mist);padding:1rem;border-radius:14px;}
.cal-event__date{text-align:center;background:#fff;border-radius:10px;padding:.4rem .7rem;min-width:54px;}
.cal-event__date span{display:block;line-height:1;}
.cal-event__date span:first-child{font-size:1.4rem;font-weight:700;color:var(--brand-navy);}
.cal-event__date span:last-child{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-soft,#677);}
.cal-event__body h4{margin:0 0 .2rem;font-size:1rem;}
.cal-event__body p{margin:0;color:var(--text-soft,#677);font-size:.85rem;}
html[data-theme="dark"] .cal-cell{background:var(--surface);color:var(--text);}
html[data-theme="dark"] .cal-cell--blank{background:var(--bg);}
html[data-theme="dark"] .cal-cell.is-today{background:#3a2e15;}
html[data-theme="dark"] .cal-cell.has-events{background:#1A2542;}
html[data-theme="dark"] .cal-event{background:var(--surface);}
html[data-theme="dark"] .cal-event__date{background:var(--bg-elev);}

/* -------- Fee calculator -------- */
.fee-table{width:100%;border-collapse:collapse;margin:1rem 0;}
.fee-table th,.fee-table td{padding:.85rem 1rem;text-align:left;border-bottom:1px solid var(--rule);}
.fee-table th{background:var(--mist);font-weight:600;}
.fee-table tr:hover td{background:rgba(201,169,97,.08);}
.fee-calc{background:var(--brand-navy);color:#fff;padding:1.5rem;border-radius:16px;display:grid;gap:1rem;}
.fee-calc label{display:grid;gap:.3rem;font-size:.9rem;}
.fee-calc select,.fee-calc input{padding:.6rem .8rem;border-radius:8px;border:0;font:inherit;color:var(--brand-navy);}
.fee-calc__out{font-family:'Playfair Display',serif;font-size:2rem;color:var(--brand-gold);font-style:italic;}

/* -------- Leadership / Faculty cards -------- */
.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.5rem;}
.person{background:#fff;border:1px solid var(--rule);border-radius:16px;overflow:hidden;display:grid;}
.person__photo{aspect-ratio:1/1;background:linear-gradient(135deg,#dfe5f5,#c3ccdf);display:grid;place-items:center;color:var(--brand-navy);font-family:'Playfair Display',serif;font-size:3rem;font-style:italic;}
.person__body{padding:1.1rem 1.2rem;}
.person__body h4{margin:0 0 .15rem;}
.person__body .role{color:var(--text-soft,#677);font-size:.85rem;}
.person__body p{margin:.6rem 0 0;font-size:.9rem;color:var(--text-soft,#556);}
.faculty-filter{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0 2rem;}
.faculty-filter button{padding:.45rem .9rem;border-radius:999px;border:1px solid var(--rule);background:#fff;cursor:pointer;font:inherit;}
.faculty-filter button.is-active{background:var(--brand-navy);color:#fff;border-color:transparent;}
html[data-theme="dark"] .person{background:var(--surface);}
html[data-theme="dark"] .faculty-filter button{background:var(--surface);color:var(--text);}

/* -------- University wall -------- */
.uni-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.6rem;}
.uni-tile{background:#fff;border:1px solid var(--rule);border-radius:12px;padding:1rem .8rem;text-align:center;font-weight:600;color:var(--brand-navy);position:relative;}
.uni-tile .count{position:absolute;top:.4rem;inset-inline-end:.5rem;background:var(--brand-gold);color:var(--brand-navy-deep);border-radius:999px;font-size:.7rem;padding:.1rem .4rem;}
html[data-theme="dark"] .uni-tile{background:var(--surface);color:var(--text);}

/* -------- Houses -------- */
.houses-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;}
.house{padding:2rem 1.5rem;border-radius:18px;color:#fff;display:grid;gap:.5rem;}
.house h3{font-family:'Playfair Display',serif;font-style:italic;margin:0;}
.house .crest{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-weight:700;}

/* -------- Tag filter for clubs etc -------- */
.filter-bar{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 1.5rem;}
.filter-bar button{padding:.35rem .8rem;border:1px solid var(--rule);background:#fff;border-radius:999px;cursor:pointer;font-size:.85rem;}
.filter-bar button.is-active{background:var(--brand-navy);color:#fff;border-color:transparent;}

/* -------- Portal layout -------- */
.portal-shell{display:grid;grid-template-columns:240px 1fr;min-height:80vh;gap:0;}
@media (max-width:1024px){ .portal-shell{grid-template-columns:1fr;} }
.portal-aside{background:var(--brand-navy);color:#fff;padding:1.5rem 1rem;}
.portal-aside h4{color:rgba(255,255,255,.6);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;margin:1.5rem 0 .5rem;}
.portal-aside a{display:block;color:rgba(255,255,255,.85);text-decoration:none;padding:.5rem .7rem;border-radius:8px;font-size:.9rem;}
.portal-aside a:hover,.portal-aside a.is-active{background:rgba(255,255,255,.08);color:#fff;}
.portal-main{padding:2rem;}
.portal-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;}
.portal-card{background:#fff;border:1px solid var(--rule);border-radius:14px;padding:1.2rem;}
.portal-card h4{margin:0 0 .3rem;font-size:.9rem;color:var(--text-soft,#677);font-weight:500;}
.portal-card .big{font-family:'Playfair Display',serif;font-style:italic;font-size:2rem;color:var(--brand-navy);}
html[data-theme="dark"] .portal-card{background:var(--surface);color:var(--text);}

/* -------- Generic muted helper -------- */
.muted{color:var(--text-soft,#677);}

/* -------- Phase 4: News / Events / Lightbox -------- */
.news-toolbar{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;margin-bottom:1.5rem;}
.news-pills{display:flex;gap:.4rem;flex-wrap:wrap;}
.news-pill{padding:.4rem .8rem;border-radius:999px;background:var(--mist);color:var(--text);border:1px solid var(--rule);font-size:.8rem;font-weight:600;cursor:pointer;text-transform:capitalize;transition:all .15s ease;}
.news-pill:hover{background:var(--brand-navy);color:#fff;}
.news-pill.is-active{background:var(--brand-navy);color:#fff;border-color:var(--brand-navy);}
html[data-theme="dark"] .news-pill{background:var(--bg-elev);border-color:var(--rule);}
.news-search{position:relative;}
.news-search input{padding:.55rem .9rem;border-radius:10px;border:1px solid var(--rule);background:transparent;color:inherit;min-width:240px;font-size:.9rem;}
.news-pager{display:flex;gap:.3rem;justify-content:center;margin-top:2rem;flex-wrap:wrap;}
.news-pager__btn{padding:.45rem .8rem;border-radius:8px;border:1px solid var(--rule);background:transparent;color:inherit;cursor:pointer;font-weight:600;font-size:.85rem;}
.news-pager__btn.is-active{background:var(--brand-navy);color:#fff;border-color:var(--brand-navy);}
.news-pager__btn:disabled{opacity:.4;cursor:not-allowed;}
.news-empty{text-align:center;padding:3rem 1rem;color:var(--text-soft,#677);}
.article-hero{padding:5rem 0 4rem;}
.article-hero h1{font-size:clamp(2rem,4vw,3rem);}
.article-body{max-width:760px;margin:0 auto;font-size:1.05rem;line-height:1.75;}
.article-body h3{margin-top:2rem;font-family:'Playfair Display',serif;}
.article-body p{margin:1rem 0;}
.article-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:2rem;}

/* Events */
.events-list{display:grid;gap:1rem;margin-top:1.5rem;}
.event-card{display:grid;grid-template-columns:6px 1fr;background:var(--surface,#fff);border:1px solid var(--rule);border-radius:14px;overflow:hidden;}
html[data-theme="dark"] .event-card{background:var(--bg-elev);}
.event-card__rail{width:6px;}
.event-card__body{padding:1.1rem 1.3rem;}
.event-card__body h3{margin:0 0 .3rem;font-family:'Playfair Display',serif;}
.event-meta{margin:0 0 .8rem;color:var(--text-soft,#677);font-size:.9rem;}
.event-actions{display:flex;gap:.5rem;flex-wrap:wrap;}
.event-rsvp{display:grid;gap:.6rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--rule);}
.event-rsvp label{display:grid;gap:.25rem;font-size:.85rem;font-weight:600;}
.event-rsvp input{padding:.55rem .75rem;border-radius:8px;border:1px solid var(--rule);background:transparent;color:inherit;}
.event-rsvp__msg{margin:0;font-size:.9rem;font-weight:600;}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.92);display:grid;grid-template-columns:auto 1fr auto;align-items:center;padding:1rem;}
.lightbox[hidden]{display:none !important;}
.lightbox__close{position:absolute;top:1rem;right:1rem;background:transparent;border:0;color:#fff;font-size:2rem;cursor:pointer;line-height:1;}
.lightbox__nav{background:rgba(255,255,255,.08);border:0;color:#fff;width:48px;height:48px;border-radius:50%;font-size:1.6rem;cursor:pointer;}
.lightbox__nav:hover{background:rgba(255,255,255,.18);}
.lightbox__stage{display:flex;flex-direction:column;align-items:center;gap:.8rem;}
.lightbox__img{width:min(90vw,1100px);aspect-ratio:16/10;border-radius:12px;}
.lightbox__cap{color:#fff;font-size:.95rem;text-align:center;max-width:90vw;}
.lightbox__count{color:rgba(255,255,255,.6);font-size:.8rem;}
@media (max-width:640px){.lightbox__nav{width:40px;height:40px;font-size:1.3rem;}}

/* Gallery grid (used by galleries page) */
.gallery-section{margin-bottom:2.5rem;}
.gallery-section__head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:.8rem;gap:1rem;}
.gallery-section__head h2{font-family:'Playfair Display',serif;font-style:italic;margin:0;font-size:1.4rem;}
.gallery-section__head span{color:var(--text-soft,#677);font-size:.85rem;}
.g-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.6rem;}
.g-photo{aspect-ratio:4/3;border-radius:10px;background:#14213D;cursor:pointer;border:0;padding:0;transition:transform .15s ease;position:relative;overflow:hidden;}
.g-photo:hover{transform:scale(1.02);}
.g-photo::after{content:attr(data-caption);position:absolute;left:0;right:0;bottom:0;padding:.5rem .6rem;color:#fff;font-size:.75rem;background:linear-gradient(to top,rgba(0,0,0,.6),transparent);text-align:left;opacity:0;transition:opacity .15s ease;}
.g-photo:hover::after{opacity:1;}

/* ==========================================================
 * PHASE 5 — Differentiators
 *   Chatbot · Quiz · Compare · Outcomes · Seats · Giving
 * ========================================================== */

/* ---------- Chatbot ---------- */
#ather-chat-root {
  position: fixed; inset: auto 1.25rem 1.25rem auto; z-index: 9000; font-family: inherit;
  display: flex; flex-direction: column; align-items: center; gap: .65rem;
  width: 56px; overflow: visible;
}
[dir="rtl"] #ather-chat-root { inset: auto auto 1.25rem 1.25rem; }

.scroll-top-fab {
  width: 44px; height: 44px; border-radius: 999px; border: 0; cursor: pointer;
  margin-inline: auto;
  background: rgba(11,23,48,.92); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 28px rgba(11,23,48,.28);
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease, background .2s ease;
}
.scroll-top-fab.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.scroll-top-fab:hover { background: #14213D; transform: translateY(-2px); }
.scroll-top-fab svg { width: 20px; height: 20px; }

.chat-fab {
  width: 56px; height: 56px; flex-shrink: 0; border-radius: 999px; border: 0; cursor: pointer;
  background: #14213D; color: var(--c-gold, #C9A961);
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 14px 38px rgba(11,23,48,.35), 0 4px 10px rgba(11,23,48,.18);
  position: relative; transition: transform .18s ease, box-shadow .18s ease;
}
.chat-fab:hover { transform: translateY(-2px); box-shadow: 0 18px 44px rgba(11,23,48,.42); }
/* Per-school accent overrides for chat FAB */
body[data-school="kg"]        .chat-fab { background: #fff; color: #D88A4A; }
body[data-school="primary"]   .chat-fab { background: #fff; color: #2E7D5B; }
body[data-school="secondary"] .chat-fab { background: #fff; color: #8B1E3F; }
.chat-fab__dot {
  position: absolute; top: 10px; right: 10px; width: 9px; height: 9px; border-radius: 999px;
  background: #2E7D5B; box-shadow: 0 0 0 2px #14213D;
  animation: chatPulse 2.2s ease-in-out infinite;
}
body[data-school="kg"]        .chat-fab__dot { box-shadow: 0 0 0 2px #D88A4A; }
body[data-school="primary"]   .chat-fab__dot { box-shadow: 0 0 0 2px #2E7D5B; }
body[data-school="secondary"] .chat-fab__dot { box-shadow: 0 0 0 2px #8B1E3F; }
@keyframes chatPulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.35); opacity: .55; } }

.chat-panel {
  position: absolute; bottom: 72px; right: 0;
  width: min(380px, calc(100vw - 2rem)); height: min(560px, calc(100vh - 7rem));
  background: #fff; color: #14213D;
  border-radius: 18px; border: 1px solid rgba(20,33,61,.08);
  box-shadow: 0 30px 80px rgba(11,23,48,.35);
  display: flex; flex-direction: column; overflow: hidden;
  animation: chatIn .22s ease-out;
}
[dir="rtl"] .chat-panel { right: auto; left: 0; }
.chat-panel[hidden] { display: none !important; }
@keyframes chatIn { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

.chat-panel__head {
  display: flex; align-items: center; gap: .75rem;
  padding: .85rem 1rem; background: linear-gradient(135deg, #14213D, #0B1730); color: #fff;
}
.chat-panel__avatar {
  width: 36px; height: 36px; border-radius: 999px;
  display: grid; place-items: center;
  background: var(--c-gold, #C9A961); color: #14213D; font-weight: 700;
}
.chat-panel__title { flex: 1; line-height: 1.2; font-size: .92rem; }
.chat-panel__title strong { display: block; font-size: 1rem; }
.chat-panel__title span { display: block; opacity: .75; font-size: .75rem; }
.chat-panel__close {
  background: transparent; border: 0; color: #fff; font-size: 1.6rem; line-height: 1;
  cursor: pointer; padding: 0 .25rem; border-radius: 8px;
}
.chat-panel__close:hover { background: rgba(255,255,255,.12); }

.chat-panel__log { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .5rem; background: #F8FAFC; }
.chat-msg { display: flex; }
.chat-msg--me { justify-content: flex-end; }
.chat-msg__bubble {
  max-width: 82%; padding: .55rem .8rem; border-radius: 14px;
  font-size: .92rem; line-height: 1.45; word-wrap: break-word;
  box-shadow: 0 1px 2px rgba(11,23,48,.06);
}
.chat-msg__bubble a { color: inherit; text-decoration: underline; }
.chat-msg--bot .chat-msg__bubble { background: #fff; border: 1px solid rgba(20,33,61,.08); border-top-left-radius: 4px; }
.chat-msg--me  .chat-msg__bubble { background: #14213D; color: #fff; border-top-right-radius: 4px; }
.chat-typing .chat-msg__bubble { display: inline-flex; gap: 4px; padding: .65rem .8rem; }
.chat-typing span { width: 6px; height: 6px; border-radius: 999px; background: #94a3b8; animation: dots 1.2s infinite ease-in-out; }
.chat-typing span:nth-child(2) { animation-delay: .15s; }
.chat-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes dots { 0%,80%,100% { transform: scale(.6); opacity: .4; } 40% { transform: scale(1); opacity: 1; } }

.chat-panel__chips { display: flex; flex-wrap: wrap; gap: .35rem; padding: .5rem .75rem 0; background: #F8FAFC; }
.chat-chip {
  font-size: .78rem; padding: .35rem .6rem; border-radius: 999px;
  border: 1px solid rgba(20,33,61,.18); background: #fff; color: #14213D; cursor: pointer;
}
.chat-chip:hover { background: #14213D; color: #fff; border-color: #14213D; }

.chat-panel__form { display: flex; gap: .5rem; padding: .65rem .75rem; background: #fff; border-top: 1px solid rgba(20,33,61,.08); }
.chat-panel__form input[type="text"] {
  flex: 1; min-width: 0; padding: .55rem .75rem; border-radius: 999px;
  border: 1px solid rgba(20,33,61,.18); background: #F8FAFC; color: inherit; font: inherit;
}
.chat-panel__form input[type="text"]:focus { outline: 2px solid var(--c-gold, #C9A961); outline-offset: 2px; }
.chat-panel__foot { padding: 0 .9rem .75rem; margin: 0; font-size: .7rem; color: #64748b; background: #fff; text-align: center; }
.chat-panel__foot a { color: inherit; text-decoration: underline; }

html[data-theme="dark"] .chat-panel { background: #0F1A33; color: #E5E7EB; border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .chat-panel__log,
html[data-theme="dark"] .chat-panel__chips { background: #0B1730; }
html[data-theme="dark"] .chat-msg--bot .chat-msg__bubble { background: #14213D; border-color: rgba(255,255,255,.08); color: #E5E7EB; }
html[data-theme="dark"] .chat-chip { background: #14213D; color: #E5E7EB; border-color: rgba(255,255,255,.14); }
html[data-theme="dark"] .chat-panel__form { background: #0F1A33; border-top-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .chat-panel__form input { background: #0B1730; border-color: rgba(255,255,255,.14); color: #E5E7EB; }
html[data-theme="dark"] .chat-panel__foot { background: #0F1A33; color: #94a3b8; }

/* ---------- Quiz (Find your school) ---------- */
.quiz { background: #fff; border: 1px solid rgba(20,33,61,.08); border-radius: 18px; padding: 1.5rem; box-shadow: 0 10px 30px rgba(11,23,48,.05); }
.quiz__head { margin-bottom: 1.25rem; }
.quiz__progress { height: 6px; border-radius: 999px; background: rgba(20,33,61,.08); overflow: hidden; margin-bottom: .4rem; }
.quiz__progress span { display: block; height: 100%; background: var(--c-gold, #C9A961); transition: width .25s ease; }
.quiz__step { margin: 0; font-size: .8rem; color: #64748b; }
.quiz__q { font-family: 'Playfair Display', serif; font-size: 1.4rem; margin: 0 0 1rem; }
.quiz__opts { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.quiz__opt {
  width: 100%; text-align: left; padding: .85rem 1rem;
  border: 1.5px solid rgba(20,33,61,.12); background: #fff; color: inherit;
  border-radius: 12px; cursor: pointer; font: inherit;
  transition: border-color .15s ease, background .15s ease, transform .1s ease;
}
[dir="rtl"] .quiz__opt { text-align: right; }
.quiz__opt:hover { border-color: var(--c-gold, #C9A961); }
.quiz__opt.is-selected { border-color: #14213D; background: #14213D; color: #fff; }
.quiz__nav { display: flex; justify-content: space-between; gap: .5rem; margin-top: 1.25rem; }
.quiz__nav .btn[disabled] { opacity: .45; cursor: not-allowed; }
.quiz-result { background: #fff; border: 1px solid rgba(20,33,61,.08); border-radius: 18px; padding: 2rem; box-shadow: 0 10px 30px rgba(11,23,48,.05); }
.quiz-result h2 { font-family: 'Playfair Display', serif; margin: .25rem 0 .75rem; font-size: 2rem; }
.quiz-result__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
html[data-theme="dark"] .quiz, html[data-theme="dark"] .quiz-result { background: #14213D; border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .quiz__opt { background: #0F1A33; border-color: rgba(255,255,255,.14); color: #E5E7EB; }
html[data-theme="dark"] .quiz__opt.is-selected { background: var(--c-gold, #C9A961); color: #14213D; border-color: var(--c-gold, #C9A961); }

/* ---------- Compare table ---------- */
.compare-toggle { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.compare-toggle__btn {
  --accent: #14213D;
  padding: .4rem .8rem; border-radius: 999px;
  border: 1.5px solid rgba(20,33,61,.18); background: #fff; color: #14213D;
  font: inherit; font-size: .85rem; cursor: pointer; opacity: .55;
}
.compare-toggle__btn.is-on { opacity: 1; border-color: var(--accent); color: var(--accent); }
.compare-toggle__btn.is-on::before { content: '●'; margin-right: .4rem; color: var(--accent); }
.compare-wrap { overflow-x: auto; border: 1px solid rgba(20,33,61,.08); border-radius: 14px; }
.compare-table { width: 100%; border-collapse: collapse; min-width: 600px; background: #fff; }
.compare-table th, .compare-table td { padding: .85rem 1rem; text-align: left; border-bottom: 1px solid rgba(20,33,61,.06); font-size: .92rem; vertical-align: top; }
[dir="rtl"] .compare-table th, [dir="rtl"] .compare-table td { text-align: right; }
.compare-table thead th { --accent: #14213D; background: #F8FAFC; font-weight: 600; border-bottom: 2px solid var(--accent); }
.compare-table thead th a { color: var(--accent); text-decoration: none; }
.compare-table tbody th { background: #F8FAFC; font-weight: 500; color: #64748b; width: 22%; }
html[data-theme="dark"] .compare-table { background: #14213D; }
html[data-theme="dark"] .compare-table thead th,
html[data-theme="dark"] .compare-table tbody th { background: #0F1A33; color: #94a3b8; }
html[data-theme="dark"] .compare-toggle__btn { background: #14213D; color: #E5E7EB; border-color: rgba(255,255,255,.14); }

/* ---------- Outcomes ---------- */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1rem; }
.kpi { background: #fff; border: 1px solid rgba(20,33,61,.08); border-radius: 14px; padding: 1.25rem; text-align: center; }
.kpi__v { font-family: 'Playfair Display', serif; font-size: 2.2rem; color: #14213D; line-height: 1; }
.kpi__l { margin-top: .35rem; color: #64748b; font-size: .85rem; }
.bars { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.bar { display: grid; grid-template-columns: 1fr 2fr auto; gap: .75rem; align-items: center; font-size: .9rem; }
.bar__l { color: #14213D; }
.bar__track { height: 10px; background: rgba(20,33,61,.08); border-radius: 999px; overflow: hidden; }
.bar__fill { display: block; height: 100%; background: linear-gradient(90deg, var(--c-gold, #C9A961), #14213D); border-radius: inherit; transition: width .6s ease; }
.bar__v { font-variant-numeric: tabular-nums; color: #64748b; }
.dest-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .75rem; margin-top: 1rem; }
.dest { background: #fff; border: 1px solid rgba(20,33,61,.08); border-radius: 12px; padding: .85rem 1rem; display: flex; flex-direction: column; gap: .15rem; }
.dest strong { color: #14213D; font-size: .95rem; }
.dest__c { color: #64748b; font-size: .8rem; }
.dest__n { color: var(--c-gold, #C9A961); font-size: .82rem; font-weight: 600; margin-top: .25rem; }
html[data-theme="dark"] .kpi, html[data-theme="dark"] .dest { background: #14213D; border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .kpi__v, html[data-theme="dark"] .dest strong, html[data-theme="dark"] .bar__l { color: #E5E7EB; }
html[data-theme="dark"] .bar__track { background: rgba(255,255,255,.1); }

/* ---------- Seats (live openings) ---------- */
.seats-legend { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem; color: #64748b; font-size: .85rem; }
.seats-legend .dot { display: inline-block; width: 10px; height: 10px; border-radius: 999px; margin-right: .35rem; vertical-align: middle; }
.dot--open { background: #2E7D5B; } .dot--low { background: #C9A961; } .dot--full { background: #8B1E3F; }
.seats-group { margin-bottom: 2rem; }
.seats-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .6rem; }
.seat {
  background: #fff; border: 1px solid rgba(20,33,61,.08); border-radius: 12px;
  padding: .85rem .75rem; text-align: center; transition: transform .12s ease, box-shadow .12s ease;
  position: relative;
}
.seat:focus, .seat:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(11,23,48,.08); outline: none; }
.seat::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 3px; border-radius: 12px 12px 0 0; }
.seat--open::before { background: #2E7D5B; } .seat--low::before { background: #C9A961; } .seat--full::before { background: #8B1E3F; }
.seat__g { font-family: 'Playfair Display', serif; font-size: 1.2rem; color: #14213D; }
.seat__s { color: #64748b; font-size: .78rem; margin-top: .25rem; }
html[data-theme="dark"] .seat { background: #14213D; border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .seat__g { color: #E5E7EB; }

/* ---------- Giving ---------- */
.give-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.give-card { --accent: #C9A961; background: #fff; border: 1px solid rgba(20,33,61,.08); border-top: 4px solid var(--accent); border-radius: 14px; padding: 1.25rem; display: flex; flex-direction: column; gap: .6rem; }
.give-card h3 { margin: 0; color: var(--accent); font-family: 'Playfair Display', serif; }
.give-card__progress { height: 8px; background: rgba(20,33,61,.08); border-radius: 999px; overflow: hidden; margin: .25rem 0; }
.give-card__progress span { display: block; height: 100%; background: var(--accent); }
.give-form { display: grid; gap: 1.25rem; background: #fff; padding: 1.5rem; border-radius: 14px; border: 1px solid rgba(20,33,61,.08); }
.give-form fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: .5rem; }
.give-form legend { font-weight: 600; color: #14213D; padding: 0; }
.give-amounts__row { display: flex; flex-wrap: wrap; gap: .4rem; }
.give-amounts__row label { position: relative; cursor: pointer; }
.give-amounts__row input[type="radio"] { position: absolute; opacity: 0; inset: 0; }
.give-amounts__row span { display: inline-block; padding: .55rem 1rem; border-radius: 999px; border: 1.5px solid rgba(20,33,61,.18); font-weight: 600; color: #14213D; background: #fff; }
.give-amounts__row input:checked + span { background: #14213D; color: #fff; border-color: #14213D; }
.give-amounts__custom { display: inline-flex; align-items: center; gap: .35rem; }
.give-amounts__custom input[type="number"] { width: 90px; padding: .4rem .55rem; border: 1px solid rgba(20,33,61,.18); border-radius: 8px; font: inherit; }
.give-freq { display: inline-flex; align-items: center; gap: .5rem; font-size: .9rem; }
.checkbox { display: inline-flex; align-items: center; gap: .5rem; font-size: .9rem; margin-right: 1rem; }
.form-success { background: #ECFDF5; border: 1px solid #2E7D5B; border-radius: 12px; padding: 1.25rem; color: #064E3B; }
.form-success strong { display: block; font-size: 1.15rem; margin-bottom: .35rem; }
html[data-theme="dark"] .give-card, html[data-theme="dark"] .give-form { background: #14213D; border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .give-amounts__row span { background: #0F1A33; color: #E5E7EB; border-color: rgba(255,255,255,.14); }
html[data-theme="dark"] .give-amounts__row input:checked + span { background: var(--c-gold, #C9A961); color: #14213D; border-color: var(--c-gold, #C9A961); }
html[data-theme="dark"] .form-success { background: rgba(46,125,91,.12); color: #6EE7B7; }

/* Small screens */
@media (max-width: 640px) {
  .chat-panel { width: calc(100vw - 1.5rem); right: -.25rem; }
  [dir="rtl"] .chat-panel { left: -.25rem; right: auto; }
  .compare-table tbody th { width: 35%; }
}/* =========================================================================
   editorial.css
   Scope: SITE-WIDE (loaded via phase2.css @import)
   Goal: minimalist, strong typography, large photography, clean UI,
         futuristic but warm. Apply editorial language across all inner pages.
   Notes:
     - Home page additionally loads home-editorial.css for hero specifics.
     - Mini-site shells (kg/primary/secondary) keep their own tone via
       school-shell.css; editorial layer here is intentionally neutral.
   ========================================================================= */

:root {
  --warm:        #C97B4A;
  --warm-soft:   #E7C4A4;
  --sand:        #EFE7DC;
  --hairline:    rgba(11,23,48,.10);
  --hairline-on-dark: rgba(255,255,255,.14);
}

/* ---- TYPOGRAPHY: editorial italic em accent ---------------------------- */
h1 em, h2 em, h3 em,
.page-hero h1 em,
.section-head h2 em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  color: var(--warm);
}

/* ---- PAGE HERO (inner pages) ------------------------------------------- */
.page-hero {
  background:
    radial-gradient(60% 50% at 100% 0%, rgba(201,123,74,.30) 0%, transparent 60%),
    linear-gradient(160deg, #14213D 0%, #0B1730 100%) !important;
  padding-block: clamp(5.5rem, 11vw, 9rem) !important;
  position: relative;
  overflow: clip;
}
.page-hero::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: rgba(255,255,255,.10);
  pointer-events: none;
}
.page-hero h1 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(2.2rem, 5vw, 4.4rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: #fff;
  margin: 1rem 0 1.2rem;
  max-width: 22ch;
}
.page-hero h1 em { color: var(--warm-soft); }
.page-hero .eyebrow {
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--warm-soft);
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  font-weight: 500;
}
.page-hero .eyebrow::before {
  content: "";
  width: 28px; height: 1px;
  background: var(--warm-soft);
  display: inline-block;
}
.page-hero p {
  color: rgba(255,255,255,.78);
  font-size: clamp(1rem, 1.2vw, 1.1rem);
  line-height: 1.6;
  max-width: 56ch;
}

/* ---- COMPACT GOLD HERO (site-wide, master) -----------------------------
   Promotes the news / contact / admissions hero treatment to every
   master-site page: half-height band + gold serif title + tighter lede.
   Same .container width (1240px) — only the vertical rhythm + title
   colour change. School mini-sites (kg / primary / secondary) keep their
   own accent heroes, so this is scoped to data-school="master".         */
body[data-school="master"] .page-hero {
  padding-block: clamp(2.25rem, 4.5vw, 3.5rem) !important;
}
body[data-school="master"] .page-hero h1 {
  color: #c9ab65;
  margin-top: 0;
  font-size: clamp(1.85rem, 4vw, 3.2rem);
  line-height: 1.12;
  max-width: 28ch;
}
body[data-school="master"] .page-hero h1 em { color: var(--warm-soft); }
body[data-school="master"] .page-hero p {
  margin-top: .75rem;
  font-size: 1rem;
  max-width: 52ch;
}

.breadcrumbs {
  color: rgba(255,255,255,.55);
  font-size: .7rem;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.breadcrumbs a { color: rgba(255,255,255,.78); text-decoration: none; }
.breadcrumbs a:hover { color: var(--warm-soft); }

/* ---- SECTION HEADS ----------------------------------------------------- */
.section { padding-block: clamp(4.5rem, 9vh, 7.5rem); }
.section-head { max-width: 760px; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.section-head .eyebrow {
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--warm);
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  font-weight: 500;
}
.section-head .eyebrow::before {
  content: "";
  width: 24px; height: 1px;
  background: var(--warm);
  display: inline-block;
}
.section-head h2 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(1.9rem, 3.8vw, 3rem);
  line-height: 1.06;
  letter-spacing: -0.015em;
  margin: 1rem 0 .8rem;
  color: var(--brand-navy-deep);
}
.section-head p,
.section-head .lede {
  font-size: 1.02rem;
  color: var(--muted-strong);
  max-width: 58ch;
  line-height: 1.6;
}

/* ---- SPLIT (text + visual) -------------------------------------------- */
.split {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}
.split h2 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(1.8rem, 3.4vw, 2.8rem);
  line-height: 1.08;
  letter-spacing: -0.015em;
  color: var(--brand-navy-deep);
  margin: .8rem 0 1rem;
}
.split p { color: var(--muted-strong); line-height: 1.65; }
.split__visual {
  position: relative;
  aspect-ratio: 4/5;
  border-radius: 3px;
  overflow: hidden;
  background:
    radial-gradient(60% 40% at 30% 20%, rgba(201,123,74,.40) 0%, transparent 65%),
    linear-gradient(160deg, #243A66 0%, #14213D 55%, #0B1730 100%);
  box-shadow: 0 30px 80px -30px rgba(11,23,48,.35);
}
.split__visual .emblem,
.split__visual > img:not(.split__photo) { display: none; }
.split__visual::after {
  content: "";
  position: absolute; inset: 14px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 2px;
  pointer-events: none;
}
.split__visual .split__photo,
.split__visual > img.split__photo {
  display: block;
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 1;
}
@media (max-width: 880px) {
  .split { grid-template-columns: 1fr; }
}

/* ---- CHECKS LIST ------------------------------------------------------- */
.checks {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0 0;
  border-top: 1px solid var(--hairline);
}
.checks li {
  padding: 1rem 0;
  border-bottom: 1px solid var(--hairline);
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 1rem;
  align-items: center;
  color: var(--muted-strong);
  line-height: 1.55;
}
.checks svg {
  width: 16px; height: 16px;
  color: var(--warm);
}

/* ---- PILLARS / CARDS GRID --------------------------------------------- */
.pillars {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 0;
  border-top: 1px solid var(--hairline);
  counter-reset: pillar;
}
.pillars .card,
.pillars .card--feature {
  background: transparent;
  border: 0;
  border-right: 1px solid var(--hairline);
  border-radius: 0;
  padding: 2.2rem 1.5rem 1rem;
  position: relative;
  counter-increment: pillar;
  box-shadow: none;
}
.pillars .card:last-child { border-right: 0; }
.pillars .card::before {
  content: counter(pillar, decimal-leading-zero);
  font-family: var(--font-serif);
  font-style: italic;
  font-size: .95rem;
  color: var(--warm);
  display: block;
  margin-bottom: 1.2rem;
  letter-spacing: .05em;
}
.pillars .card .card__icon { display: none; }
.pillars .card h3 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 1.25rem;
  letter-spacing: -0.01em;
  color: var(--brand-navy-deep);
  margin: 0 0 .7rem;
}
.pillars .card p {
  color: var(--muted-strong);
  font-size: .95rem;
  line-height: 1.6;
}
@media (max-width: 880px) {
  .pillars { grid-template-columns: 1fr 1fr; }
  .pillars .card:nth-child(2n) { border-right: 0; }
}
@media (max-width: 540px) {
  .pillars { grid-template-columns: 1fr; }
  .pillars .card { border-right: 0; border-bottom: 1px solid var(--hairline); }
}

/* ---- CTA-FINAL (warm dark band) --------------------------------------- */
.cta-final {
  background:
    radial-gradient(70% 50% at 100% 0%, rgba(201,123,74,.32) 0%, transparent 60%),
    linear-gradient(135deg, #14213D 0%, #0B1730 100%) !important;
  color: #fff;
  border-radius: 4px;
  padding: clamp(3rem, 6vw, 5rem) clamp(2rem, 5vw, 4rem);
  text-align: left;
  border: 0;
}
.cta-final h2 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(1.7rem, 3vw, 2.5rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: #fff;
  margin: 0 0 1rem;
  max-width: 22ch;
}
.cta-final p {
  color: rgba(255,255,255,.78);
  font-size: 1rem;
  line-height: 1.6;
  margin: 0 0 1.5rem;
  max-width: 56ch;
}
.cta-final__actions {
  display: flex; flex-wrap: wrap; gap: 1rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,.15);
}

/* ---- STATS / OUTCOMES TILES (used on multiple pages) ------------------ */
.stat__num,
.stat-num,
.outcomes-grid .stat__num {
  font-family: var(--font-serif);
  font-weight: 500;
  letter-spacing: -0.01em;
}

/* ---- KILL CARTOONY DECORATIONS GLOBALLY ------------------------------- */
.trust-strip .marquee__item svg,
.trust-strip svg.star,
.card__icon--cartoon,
.emblem--cartoon { display: none; }

/* ---- BUTTONS: tighten editorial ---------------------------------------- */
.btn--lg { padding: .95rem 1.5rem; font-size: .9rem; letter-spacing: .04em; }
.btn--arrow svg { width: 16px; height: 16px; }

/* ---- FEATURE CARDS / GENERIC CARDS: hairline restyle ------------------ */
.feature-card,
.info-card,
.profile-card {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--hairline);
  border-radius: 0;
  box-shadow: none;
  padding: 1.5rem 0 0;
}
.feature-card h3,
.info-card h3,
.profile-card h3 {
  font-family: var(--font-serif);
  font-weight: 500;
  color: var(--brand-navy-deep);
}

/* ---- TIMELINE / HISTORY items (where used) ---------------------------- */
.timeline__item h3,
.history-item h3 {
  font-family: var(--font-serif);
  font-weight: 500;
  color: var(--brand-navy-deep);
}

/* ---- ACCORDIONS (FAQ) -------------------------------------------------- */
.accordion summary {
  font-family: var(--font-serif);
  font-weight: 500;
  letter-spacing: -0.01em;
}

/* ---- FORMS ------------------------------------------------------------- */
.field label,
label.field {
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
}

/* =========================================================================
   DARK MODE
   ========================================================================= */
html[data-theme="dark"] {
  --hairline: rgba(232,236,247,.12);
  --sand: #0F1730;
}
html[data-theme="dark"] .section-head h2,
html[data-theme="dark"] .split h2,
html[data-theme="dark"] .pillars .card h3,
html[data-theme="dark"] .feature-card h3,
html[data-theme="dark"] .info-card h3,
html[data-theme="dark"] .profile-card h3,
html[data-theme="dark"] .timeline__item h3,
html[data-theme="dark"] .history-item h3 { color: var(--text); }
html[data-theme="dark"] .section-head p,
html[data-theme="dark"] .section-head .lede,
html[data-theme="dark"] .split p,
html[data-theme="dark"] .pillars .card p,
html[data-theme="dark"] .checks li { color: var(--text-soft); }
html[data-theme="dark"] .page-hero {
  background:
    radial-gradient(60% 50% at 100% 0%, rgba(201,123,74,.22) 0%, transparent 60%),
    linear-gradient(160deg, #0F1730 0%, #0B1024 100%) !important;
}

/* ============================================================
 * Portal polish — compose form, aside foot, wizard refresh
 * Mirrors css/portal.css for pages that only load phase2.css
 * ========================================================== */
.portal-aside { display: flex; flex-direction: column; min-height: 100%; }
.portal-aside__foot {
  display: flex; flex-direction: column; gap: .35rem;
  padding-top: .75rem; margin-top: 1rem;
  border-top: 1px solid rgba(255,255,255,.10);
}
.portal-aside__user { margin: 0 0 .35rem; font-size: .8rem; color: rgba(255,255,255,.65); }
.portal-aside__link {
  display: block; padding: .5rem .7rem; border-radius: 8px;
  font-size: .85rem; text-decoration: none; color: rgba(255,255,255,.85);
  border: 1px solid rgba(255,255,255,.10); background: transparent;
  cursor: pointer; font: inherit;
}
.portal-aside__link:hover { background: rgba(255,255,255,.06); color: #fff; }
.portal-aside__link--warn { color: #f1b8a8; border-color: rgba(241,184,168,.22); }
.portal-aside__link--warn:hover { background: rgba(201,123,74,.18); color: #fff; }

/* Inline compose panel */
.compose-panel {
  margin-top: 1.5rem;
  background: #fff;
  border: 1px solid rgba(20,33,61,.10);
  border-radius: 14px;
  padding: 1.5rem;
  box-shadow: 0 1px 2px rgba(11,23,48,.04);
}
.compose-panel[hidden] { display: none !important; }
.compose-panel h3 {
  margin: 0 0 .25rem;
  font-family: 'Playfair Display', serif; font-style: italic;
  font-size: 1.25rem;
}
.compose-panel .muted { margin: 0 0 1rem; font-size: .85rem; }
.compose-panel form { display: grid; gap: .85rem; }
.compose-panel label {
  display: block;
  font-size: .75rem; text-transform: uppercase; letter-spacing: .08em;
  color: #64748b; font-weight: 600;
}
.compose-panel input,
.compose-panel select,
.compose-panel textarea {
  margin-top: .35rem;
  width: 100%; padding: .65rem .8rem;
  border: 1px solid rgba(20,33,61,.16); border-radius: 10px;
  font: inherit; background: #fff; color: #14213D;
}
.compose-panel textarea { min-height: 140px; resize: vertical; }
.compose-panel .compose-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
html[data-theme="dark"] .compose-panel {
  background: #14213D; border-color: rgba(255,255,255,.10);
}
html[data-theme="dark"] .compose-panel input,
html[data-theme="dark"] .compose-panel select,
html[data-theme="dark"] .compose-panel textarea {
  background: #0F1A33; color: #E5E7EB; border-color: rgba(255,255,255,.14);
}

/* Apply Now wizard refresh */
.wizard {
  background: #fff;
  border: 1px solid rgba(20,33,61,.08);
  border-radius: 18px;
  padding: clamp(1.25rem, 3vw, 2.25rem);
  box-shadow: 0 4px 24px rgba(11,23,48,.04);
}
.wizard__steps {
  display: flex; gap: .5rem; flex-wrap: wrap;
  margin: 0 0 1.5rem; padding: 0; list-style: none;
}
.wizard__step {
  flex: 1; min-width: 110px;
  display: flex; align-items: center; gap: .55rem;
  padding: .75rem .85rem;
  background: #F8FAFC;
  border: 1px solid rgba(20,33,61,.08);
  border-radius: 10px;
  font-size: .82rem; color: #64748b;
  transition: background .15s, color .15s, border-color .15s;
}
.wizard__step .num {
  width: 26px; height: 26px; border-radius: 999px;
  display: grid; place-items: center;
  background: rgba(20,33,61,.08); color: #64748b;
  font-family: 'Playfair Display', serif; font-style: italic;
  font-weight: 600; font-size: .9rem; line-height: 1;
}
.wizard__step.is-current { background: #14213D; color: #fff; border-color: #14213D; }
.wizard__step.is-current .num { background: #C9A961; color: #14213D; }
.wizard__step.is-done { background: #fff; color: #14213D; border-color: rgba(201,169,97,.45); }
.wizard__step.is-done .num { background: #2E7D5B; color: #fff; }

.wizard__progress {
  height: 4px; background: rgba(20,33,61,.08); border-radius: 999px;
  margin: 0 0 1.75rem; overflow: hidden;
}
.wizard__bar { height: 100%; background: linear-gradient(90deg, #C97B4A, #C9A961); border-radius: 999px; transition: width .25s ease; }
.wizard h2 { font-family: 'Playfair Display', serif; font-size: clamp(1.4rem, 2.5vw, 1.8rem); margin: 0 0 1.25rem; }
.wizard .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.wizard .form-grid .span-2 { grid-column: 1 / -1; }
@media (max-width: 640px) { .wizard .form-grid { grid-template-columns: 1fr; } .wizard .form-grid .span-2 { grid-column: 1; } }
.wizard label {
  display: flex; flex-direction: column; gap: .35rem;
  font-size: .78rem; text-transform: uppercase; letter-spacing: .06em;
  color: #64748b; font-weight: 600;
}
.wizard label.consent {
  flex-direction: row; gap: .6rem; align-items: flex-start;
  text-transform: none; letter-spacing: 0; font-weight: 400;
  font-size: .9rem; color: #14213D;
}
.wizard input, .wizard select, .wizard textarea {
  padding: .7rem .85rem; border-radius: 10px;
  border: 1px solid rgba(20,33,61,.16);
  background: #fff; color: #14213D; font: inherit;
}
.wizard input:focus, .wizard select:focus, .wizard textarea:focus {
  outline: 2px solid #C9A961; outline-offset: 2px; border-color: #C9A961;
}
.wizard input.has-error, .wizard select.has-error, .wizard textarea.has-error { border-color: #8B1E3F; background: #FBEEF1; }
.wizard .dropzone {
  border: 2px dashed rgba(20,33,61,.16); border-radius: 12px;
  padding: 1.25rem; background: #F8FAFC; cursor: pointer;
  transition: border-color .15s, background .15s;
}
.wizard .dropzone:hover { border-color: #C9A961; background: #FFF8EC; }
.wizard .dropzone strong {
  display: block; font-family: 'Playfair Display', serif; font-style: italic;
  font-size: 1rem; color: #14213D; text-transform: none; letter-spacing: 0;
}
.wizard .dropzone input[type="file"] { margin-top: .5rem; background: transparent; border: 0; padding: 0; }
.wizard__nav {
  display: flex; justify-content: space-between; gap: .75rem;
  margin-top: 1.75rem; padding-top: 1.25rem;
  border-top: 1px solid rgba(20,33,61,.08);
}
.wizard__done { text-align: center; padding: 2.5rem 1rem; }
.wizard__done h2 {
  font-family: 'Playfair Display', serif; font-style: italic;
  color: #2E7D5B; font-size: clamp(1.5rem, 3vw, 2rem);
}
.wizard__done .ref {
  display: inline-block; margin: 1rem 0; padding: .65rem 1.4rem;
  background: #F4ECDF; color: #14213D;
  border-radius: 999px;
  font-family: 'Playfair Display', serif; font-size: 1.5rem; font-style: italic; letter-spacing: .05em;
}
html[data-theme="dark"] .wizard { background: #14213D; border-color: rgba(255,255,255,.10); color: #E5E7EB; }
html[data-theme="dark"] .wizard__step { background: #0F1A33; color: #94a3b8; border-color: rgba(255,255,255,.10); }
html[data-theme="dark"] .wizard__step.is-current { background: #C9A961; color: #14213D; border-color: #C9A961; }
html[data-theme="dark"] .wizard__step.is-current .num { background: #14213D; color: #C9A961; }
html[data-theme="dark"] .wizard input,
html[data-theme="dark"] .wizard select,
html[data-theme="dark"] .wizard textarea {
  background: #0F1A33; color: #E5E7EB; border-color: rgba(255,255,255,.14);
}
html[data-theme="dark"] .wizard label.consent { color: #E5E7EB; }
html[data-theme="dark"] .wizard .dropzone { background: #0F1A33; border-color: rgba(255,255,255,.14); }
html[data-theme="dark"] .wizard__done .ref { background: rgba(201,169,97,.18); color: #F5F1E8; }