/* TutorDA — shared styles for the exam mock pages (pages/exams/<exam>-mocks.html), white theme.
   Generated pages: infra/exam-mocks/build-exam-pages.py. Design reference: pages/exams/jee-main-mocks.html. */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
[hidden] { display:none !important; } /* hidden must win over the flex/grid display of the progress strip and "more" row */
body { background:#0d0d1a; font-family:'Poppins',sans-serif; line-height:1.55; overflow-x:hidden; }

/* ── White-theme JEE landing (design spec). Site header and footer keep their own styles. ── */
.jee-landing {
  --page-bg: radial-gradient(900px 520px at 8% -6%, #fff1dc 0%, rgba(255,241,220,0) 70%),
             radial-gradient(700px 420px at 100% 4%, #e9f2ff 0%, rgba(233,242,255,0) 70%),
             #ffffff;
  --card:#ffffff; --card-2:#f7f4ef; --tile:#faf8f4;
  --border:#e8e2d8; --line:#d6cfc3; --chip:#f1ede6;
  --panel: linear-gradient(180deg,#fcfaf6 0%,#f6f1e8 100%);
  --ink:#14151f; --ink-2:#3c3f4e; --ink-3:#5c5f6e; --muted:#767988;
  --accent:#ff8a00; --accent-ink:#b35600; --accent-line:#f5d6a8; --accent-soft:#fff4e3;
  --solid:#0d0e1a; --solid-ink:#ffffff;
  --ok:#15803d; --ok-soft:rgba(21,128,61,.12);
  --prog:#8a4200; --prog-soft:rgba(255,138,0,.12);
  --title-grad: linear-gradient(90deg,#ff8a00,#e8590c);
  --shadow: 0 1px 2px rgba(13,14,26,.04), 0 10px 28px rgba(13,14,26,.06);
  --pad: 80px;
  background: var(--page-bg); color: var(--ink); font-family: Poppins, sans-serif;
  position: relative; isolation: isolate; overflow: hidden;
}
.jee-landing a { color:inherit; }
.jee-landing :focus-visible { outline:2px solid #ff8a00; outline-offset:2px; }
.jee-wrap { max-width:1440px; margin:0 auto; }
.jee-card { background:var(--card); border:1px solid var(--border); box-shadow:var(--shadow); }

/* Decorative background (graph paper + curves), behind the hero only */
.jee-landing__decor { position:absolute; inset:0 0 auto 0; height:1300px; z-index:-1; pointer-events:none; overflow:hidden; }
.jee-landing__grid { position:absolute; top:0; left:50%; margin-left:-720px; width:1440px; height:1300px;
  background-image: linear-gradient(rgba(13,14,26,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(13,14,26,.06) 1px, transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image: radial-gradient(ellipse 65% 55% at 72% 28%, #000 25%, transparent 78%);
          mask-image: radial-gradient(ellipse 65% 55% at 72% 28%, #000 25%, transparent 78%); }
@keyframes jee-dash { to { stroke-dashoffset:-400; } }
.jee-dash { animation: jee-dash 30s linear infinite; }
@media (prefers-reduced-motion: reduce) { .jee-dash { animation:none; } }

/* 1 · Hero */
.jee-hero { display:grid; grid-template-columns:minmax(0,1fr) 470px; gap:56px; align-items:center; padding:48px var(--pad) 40px; }
.jee-hero__text { display:flex; flex-direction:column; gap:22px; align-items:flex-start; min-width:0; }
.jee-crumb { font-size:15px; color:var(--ink-3); }
.jee-crumb a { color:var(--ink-3); text-decoration:none; }
.jee-crumb a:hover { color:var(--ink); }
.jee-crumb span[aria-current] { color:var(--ink); }
.jee-pill { font-size:13px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-ink);
  background:var(--accent-soft); border:1px solid var(--accent-line); border-radius:999px; padding:6px 14px; }
.jee-h1 { font-size:66px; line-height:1.05; font-weight:700; letter-spacing:-.01em; color:var(--ink); }
.jee-h1 span { display:block; }
.jee-h1 .grad { background:var(--title-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.jee-intro { font-size:19px; line-height:1.65; color:var(--ink-2); max-width:600px; }
.jee-ctas { display:flex; flex-wrap:wrap; gap:14px; }
.jee-btn { display:inline-flex; flex-direction:column; justify-content:center; border-radius:16px; text-decoration:none; cursor:pointer;
  font-family:inherit; font-size:18px; font-weight:600; line-height:1.3; transition:transform .15s, box-shadow .15s, border-color .15s; }
.jee-btn small { font-size:13px; font-weight:500; opacity:.85; }
.jee-landing .jee-btn--primary { background:var(--accent); color:#0d0e1a; padding:13px 28px; border:0; }
.jee-btn--primary:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(255,138,0,.28); }
.jee-landing .jee-btn--secondary { background:transparent; color:var(--ink); border:1.5px solid var(--line); padding:12px 26px; }
.jee-btn--secondary:hover { border-color:var(--ink-3); transform:translateY(-2px); }
.jee-foot { font-size:14px; color:var(--muted); }
.jee-guide { font-size:15px; font-weight:600; color:var(--accent-ink); text-decoration:none; }
.jee-guide:hover { text-decoration:underline; }

.jee-glance { border-radius:24px; padding:28px 30px; display:flex; flex-direction:column; gap:20px;
  background:color-mix(in srgb, var(--card) 72%, transparent); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.jee-label { font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.jee-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.jee-stats b { display:block; font-size:28px; font-weight:600; line-height:1.15; }
.jee-stats span { font-size:13px; color:var(--ink-3); }
.jee-table { border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--card); }
.jee-table [role="row"] { display:grid; grid-template-columns:1.4fr 1fr 1fr .7fr; }
.jee-table [role="columnheader"] { background:var(--card-2); font-size:12px; font-weight:600; color:var(--ink-3); padding:10px 16px; line-height:1.3; }
.jee-table [role="cell"] { font-size:15px; padding:11px 16px; border-top:1px solid var(--border); }
.jee-table .r { text-align:right; }
.jee-note { font-size:13px; color:var(--muted); }

/* 2 · About */
.jee-about { margin:0 var(--pad) 28px; background:var(--panel); border:1px solid var(--border); border-radius:24px; padding:32px 34px;
  display:grid; grid-template-columns:330px minmax(0,1fr); gap:36px; }
.jee-eyebrow { font-size:13px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-ink); margin-bottom:10px; }
.jee-about h2 { font-size:26px; font-weight:600; margin-bottom:12px; }
.jee-about p.body { font-size:15px; line-height:1.7; color:var(--ink-2); }
.jee-about .jee-note { margin-top:14px; }
.jee-about .jee-note a { color:var(--accent-ink); }
.jee-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-content:start; }
.jee-fact { background:var(--tile); border:1px solid var(--border); border-radius:16px; padding:18px 20px; }
.jee-fact span { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-3); margin-bottom:6px; }
.jee-fact svg { width:16px; height:16px; flex:none; stroke:var(--accent); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.jee-fact b { display:block; font-size:17px; font-weight:600; line-height:1.4; }

/* 3 · Progress strip */
.jee-progress { margin:0 var(--pad); border-radius:22px; padding:22px 28px; display:grid;
  grid-template-columns:220px repeat(3,minmax(0,1fr)) 380px; gap:24px; align-items:center; }
.jee-progress .who b { display:block; font-size:18px; font-weight:600; }
.jee-progress .who span { font-size:13px; color:var(--muted); }
.jee-progress .stat { border-left:1px solid var(--border); padding-left:22px; }
.jee-progress .stat span { display:block; font-size:13px; color:var(--ink-3); }
.jee-progress .stat b { font-size:24px; font-weight:600; }
.jee-progress .stat small { font-size:15px; color:var(--muted); font-weight:500; }
.jee-resume { grid-column:5; background:var(--accent-soft); border:1px solid var(--accent-line); border-radius:16px; padding:12px 14px 12px 18px;
  display:flex; justify-content:space-between; align-items:center; gap:14px; }
.jee-resume .lbl { font-size:13px; font-weight:600; color:var(--accent-ink); }
.jee-resume .what { font-size:14px; }
.jee-landing .jee-resume a { background:var(--accent); color:#0d0e1a; font-size:15px; font-weight:600; border-radius:999px; padding:10px 20px; text-decoration:none; white-space:nowrap; }

/* 4 · How each mock works */
.jee-how { padding:56px var(--pad) 0; }
.jee-h2 { font-size:30px; font-weight:600; line-height:1.25; }
.jee-steps { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; margin-top:26px; }
.jee-steps::before { content:''; position:absolute; top:27px; left:40px; right:40px; border-top:1.5px dashed var(--line); z-index:0; }
.jee-step { position:relative; z-index:1; }
.jee-step .num { width:54px; height:54px; border-radius:16px; background:var(--card-2); border:1px solid var(--line); display:grid; place-items:center;
  font-size:20px; font-weight:700; color:var(--accent); margin-bottom:18px; }
.jee-step h3 { font-size:19px; font-weight:600; margin-bottom:8px; }
.jee-step p { font-size:15px; line-height:1.65; color:var(--ink-3); }

/* 5 · Choose a paper */
.jee-papers { padding:60px var(--pad) 0; display:flex; flex-direction:column; gap:22px; }
.jee-papers__head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:16px; }
.jee-papers__head p { font-size:15px; color:var(--ink-3); margin-top:6px; }
.jee-seg { display:inline-flex; gap:2px; padding:4px; border-radius:999px; background:var(--card); border:1px solid var(--border); box-shadow:var(--shadow); }
.jee-seg button { font-family:inherit; font-size:15px; font-weight:600; padding:9px 20px; border-radius:999px; border:0; background:transparent; color:var(--ink-2); cursor:pointer; white-space:nowrap; }
.jee-seg button[aria-checked="true"] { background:var(--accent); color:#0d0e1a; }
.jee-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.jee-paper { border-radius:20px; padding:22px 24px; display:flex; flex-direction:column; gap:14px; transition:border-color .15s; }
.jee-paper:hover { border-color:#c9c0b1; }
.jee-paper.is-prog { border-color:var(--accent-line); }
.jee-paper .top { display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:13px; color:var(--ink-3); }
.jee-chip { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; border-radius:999px; padding:4px 10px; background:var(--chip); color:var(--ink-2); white-space:nowrap; }
.jee-chip::before { content:''; width:7px; height:7px; border-radius:50%; background:#8a8ea3; }
.jee-chip.prog { background:var(--prog-soft); color:var(--prog); } .jee-chip.prog::before { background:var(--accent); }
.jee-chip.done { background:var(--ok-soft); color:var(--ok); } .jee-chip.done::before { background:#22c55e; }
.jee-paper h3 { font-size:22px; font-weight:600; line-height:1.25; }
.jee-paper .meta { font-size:14px; color:var(--muted); margin-top:-8px; }
.jee-paper .foot { display:flex; justify-content:space-between; align-items:center; gap:10px; border-top:1px solid var(--border); padding-top:14px; font-size:14px; color:var(--ink-2); }
.jee-act { font-size:14px; font-weight:600; border-radius:999px; padding:8px 18px; text-decoration:none; white-space:nowrap; border:1.5px solid transparent; }
.jee-landing .jee-act--start { background:var(--solid); color:var(--solid-ink); }
.jee-landing .jee-act--resume { background:var(--accent); color:#0d0e1a; }
.jee-landing .jee-act--review { background:transparent; border-color:var(--line); color:var(--ink); }
.jee-more { display:flex; justify-content:center; }
.jee-outline { font-family:inherit; font-size:15px; font-weight:600; padding:10px 22px; border-radius:999px; background:transparent; border:1.5px solid var(--line); color:var(--ink); cursor:pointer; }
.jee-outline:hover { border-color:var(--ink-3); }
.jee-soon { text-align:center; font-size:14px; color:var(--muted); margin-top:-8px; }

/* 6 · FAQ */
.jee-faq { padding:60px var(--pad) 60px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.jee-faq .jee-card { border-radius:20px; padding:24px 26px; }
.jee-faq h3 { font-size:17px; font-weight:600; margin-bottom:8px; }
.jee-faq p { font-size:14px; line-height:1.7; color:var(--ink-3); }
.jee-plan { padding:0 var(--pad) 56px; text-align:center; font-size:14px; color:var(--ink-3); }
.jee-plan a { color:var(--accent-ink); }

/* Responsive */
@media (max-width:1200px) {
  .jee-hero { grid-template-columns:minmax(0,1fr) 420px; }
  .jee-progress { grid-template-columns:220px repeat(3,minmax(0,1fr)); }
  .jee-resume { grid-column:1 / -1; }
}
@media (max-width:1024px) {
  .jee-landing { --pad:40px; }
  .jee-hero { grid-template-columns:1fr; }
  .jee-about { grid-template-columns:1fr; }
  .jee-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .jee-steps { grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:32px; }
  .jee-steps::before { display:none; }
  .jee-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .jee-faq { grid-template-columns:1fr; }
  .jee-progress { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .jee-progress .who { grid-column:1 / -1; }
  .jee-progress .stat:nth-of-type(2) { border-left:0; padding-left:0; }
}
@media (max-width:640px) {
  .jee-landing { --pad:16px; }
  .jee-h1 { font-size:44px; }
  .jee-intro { font-size:17px; }
  .jee-ctas { flex-direction:column; align-self:stretch; }
  .jee-btn { width:100%; }
  .jee-glance { padding:22px 18px; }
  .jee-stats { grid-template-columns:repeat(2,1fr); }
  .jee-table [role="row"] { grid-template-columns:1.3fr 1fr 1fr .8fr; }
  .jee-table [role="columnheader"], .jee-table [role="cell"] { padding-left:10px; padding-right:10px; }
  .jee-about { padding:24px 18px; }
  .jee-facts, .jee-steps, .jee-grid { grid-template-columns:1fr; }
  .jee-progress { grid-template-columns:1fr; padding:20px 18px; }
  .jee-progress .stat { border-left:0; padding-left:0; }
  .jee-papers__head { align-items:stretch; }
  .jee-seg { max-width:100%; overflow-x:auto; scrollbar-width:none; }
  .jee-seg::-webkit-scrollbar { display:none; }
  .jee-landing__decor svg { display:none; }
}

/* ── Additions for the generated exam pages (same design language) ── */
.jee-hero.solo { grid-template-columns:minmax(0,1fr); }
/* no glance card: keep the text column clear of the background graphic (which starts ~640px into the 1440 frame) */
.jee-hero.solo .jee-hero__text { max-width:560px; }
.jee-notice { margin:24px var(--pad) 0; background:var(--accent-soft); border:1px solid var(--accent-line); border-radius:16px; padding:14px 18px;
  font-size:15px; line-height:1.6; color:var(--ink-2); }
.jee-notice b { color:var(--accent-ink); }
.jee-table--wide [role="row"] { grid-template-columns:var(--cols, 1.4fr 1fr 1fr .7fr); }
.jee-soonbox { border-radius:24px; padding:36px 32px; text-align:center; border:1.5px dashed var(--accent-line); background:var(--panel); }
.jee-soonbox h3 { font-size:22px; font-weight:600; margin-bottom:10px; }
.jee-soonbox p { font-size:15px; line-height:1.7; color:var(--ink-3); max-width:640px; margin:0 auto 22px; }
.jee-soonbox .jee-ctas { justify-content:center; }
@media (max-width:1024px) {
  .jee-hero.solo .jee-hero__text { max-width:none; }
}
@media (max-width:640px) {
  .jee-soonbox { padding:26px 18px; }
  .jee-soonbox .jee-ctas { align-items:stretch; }
  .jee-notice { margin-top:16px; }
}