/* ux.css — Unscripta premium design layer (2026-09-21).
 *
 * EVERY rule is scoped under [data-brand="unscripta"], which js/brand.js sets before first
 * paint and only on the Unscripta host. IK pages never load this file, and even if one did,
 * nothing here would match — so this layer cannot regress the live IK site.
 *
 * Loaded by: hand-written pages in src-unscripta/ (explicit <link>), and every page mirrored
 * from public/ (tools/build-unscripta.cjs injects the <link> just before </head>, so it lands
 * AFTER ik-marketing.css and wins the cascade at equal specificity).
 *
 * Constraints this layer respects: the unscripta target's CSP allows self-hosted fonts only
 * (font-src 'self' data:) — so Playfair Display (English display + numerals), Hind Siliguri
 * (Bengali) and Lato, all already in /fonts. A font stack of Playfair → Hind renders Latin in
 * the serif and falls back per-glyph to Hind for Bengali, which is how mixed bn/en headings
 * stay coherent.
 */

[data-brand="unscripta"] {
  --ux-ink: #0E0D12;
  --ux-ink-2: #17151E;
  --ux-ink-3: #24212D;
  --ux-paper: #F6F2EA;
  --ux-bone: #FBF8F2;
  --ux-line: #E4DDD0;
  --ux-line-dark: rgba(255, 255, 255, 0.12);
  --ux-text: #1B1A1F;
  --ux-muted: #6E685F;
  --ux-muted-dark: #A7A2B3;
  --ux-accent: #4B3FD6;
  --ux-accent-hi: #5E52E8;
  --ux-accent-soft: #EDEBFB;
  --ux-accent-dark: #B3ABFF;

  --ux-serif: 'Playfair Display', 'Hind Siliguri', Georgia, serif;
  --ux-bn: 'Hind Siliguri', 'Noto Sans Bengali', 'Lato', sans-serif;
  --ux-sans: 'Lato', 'Hind Siliguri', 'Segoe UI', sans-serif;

  /* Deepen the brand accent on mirrored pages too (they recolour through --maroon*). */
  --maroon: #4B3FD6;
  --maroon-hi: #5E52E8;
  --maroon-deep: #2F2699;
  --maroon-soft: #EDEBFB;
}

[data-brand="unscripta"] body {
  margin: 0; /* nothing in the loaded chain resets it, so the UA's 8px gutter framed every full-bleed section */
  background: var(--ux-bone);
  color: var(--ux-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ── topbar ─────────────────────────────────────────────────────────────────────────── */

/* IK chrome leaks, found by computed-style probe (all hard-coded maroon, not var-driven):
 * the wrapper's 2.67px #5C1220 border-top + shadow, the wordmark's ::before bar, and the
 * active-link ::after underline. */
[data-brand="unscripta"] #ik-site-topbar {
  position: sticky;
  top: 0;
  z-index: 200;
  background: transparent;
  border-top: 0;
  box-shadow: none;
}
[data-brand="unscripta"] #ik-site-topbar .ik-wordmark { padding-left: 0; }
[data-brand="unscripta"] #ik-site-topbar .ik-wordmark::before { content: none; display: none; }
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a.active::after,
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a::after { background: var(--ux-ink); background-image: none; }
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a[href="/start"]::after { display: none; }
[data-brand="unscripta"] #ik-site-topbar .topbar {
  position: relative;
  top: auto;
  height: 76px;
  max-width: none;
  padding: 0 clamp(20px, 5vw, 72px);
  background: rgba(251, 248, 242, 0.92);
  backdrop-filter: saturate(140%) blur(14px);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid var(--ux-line);
}

/* Site-wide free-class promo strip (above nav) */
[data-brand="unscripta"] #ik-site-topbar .ux-promo {
  position: relative;
  background:
    linear-gradient(180deg, rgba(255, 248, 235, 0.07) 0%, transparent 42%),
    linear-gradient(105deg, #0c0b10 0%, #16141c 48%, #0e0d12 100%);
  color: #f7f2ea;
  border-bottom: 1px solid rgba(255, 248, 235, 0.1);
  overflow: hidden;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(232, 201, 150, 0.55), transparent);
  pointer-events: none;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 28px;
  min-height: 52px;
  padding: 10px clamp(20px, 5vw, 72px);
  max-width: none;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 14px;
  min-width: 0;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-kicker {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border: 1px solid rgba(232, 201, 150, 0.35);
  border-radius: 999px;
  font-family: var(--ux-bn);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #e8c996;
  background: rgba(232, 201, 150, 0.08);
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-date {
  font-family: var(--ux-serif);
  font-weight: 700;
  font-size: clamp(20px, 2.1vw, 26px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: #fffaf3;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-sep {
  display: inline-block;
  width: 1px;
  height: 1.1em;
  background: rgba(255, 248, 235, 0.22);
  align-self: center;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-meta {
  font-family: var(--ux-bn);
  font-size: 13.5px;
  line-height: 1.4;
  color: rgba(247, 242, 234, 0.68);
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-cta {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  border-radius: 999px;
  background: #f7f2ea;
  color: #0e0d12;
  font-family: var(--ux-bn);
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 0.01em;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  transition: transform .18s ease, background .18s ease, color .18s ease;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-cta:hover {
  background: #e8c996;
  color: #0e0d12;
  transform: translateY(-1px);
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-arrow {
  font-size: 15px;
  line-height: 1;
  transition: transform .18s ease;
}
[data-brand="unscripta"] #ik-site-topbar .ux-promo-cta:hover .ux-promo-arrow {
  transform: translateX(3px);
}
@media (max-width: 820px) {
  [data-brand="unscripta"] #ik-site-topbar .ux-promo-in {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding-top: 12px;
    padding-bottom: 14px;
  }
  [data-brand="unscripta"] #ik-site-topbar .ux-promo-sep { display: none; }
  [data-brand="unscripta"] #ik-site-topbar .ux-promo-cta { justify-content: center; width: 100%; }
}
[data-brand="unscripta"] #ik-site-topbar .ik-wordmark .ik-wm-name {
  font-family: var(--ux-serif);
  font-weight: 700;
  font-size: 23px;
  letter-spacing: -0.01em;
  color: var(--ux-ink);
  text-transform: none;
}
[data-brand="unscripta"] #ik-site-topbar .tb-nav { gap: 30px; }
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a {
  font-family: var(--ux-bn);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--ux-muted);
  transition: color .18s ease;
}
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a:hover,
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a.active { color: var(--ux-ink); }
/* "Get started" is the one action in the bar — render it as the ink pill. */
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a[href="/start"] {
  color: var(--ux-bone);
  background: var(--ux-ink);
  padding: 10px 20px;
  border-radius: 999px;
  font-weight: 600;
}
[data-brand="unscripta"] #ik-site-topbar .tb-nav > a[href="/start"]:hover { background: var(--ux-accent); color: #fff; }
[data-brand="unscripta"] #ik-site-topbar .btn-lang {
  font-family: var(--ux-bn);
  font-size: 13px;
  color: var(--ux-muted);
  background: transparent;
  border: 1px solid var(--ux-line);
  border-radius: 999px;
  padding: 7px 14px;
}
[data-brand="unscripta"] #ik-site-topbar .mobile-menu { background: var(--ux-bone); }
[data-brand="unscripta"] #ik-site-topbar .mobile-menu a {
  font-family: var(--ux-bn);
  font-size: 18px;
  color: var(--ux-ink);
  border-bottom: 1px solid var(--ux-line);
}

/* ── shared primitives ──────────────────────────────────────────────────────────────── */

[data-brand="unscripta"] .ux-wrap { max-width: 1180px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 72px); }
[data-brand="unscripta"] .ux-sec { padding: clamp(72px, 10vw, 128px) 0; }
[data-brand="unscripta"] .ux-sec--paper { background: var(--ux-paper); }
[data-brand="unscripta"] .ux-sec--ink { background: var(--ux-ink); color: #fff; }

[data-brand="unscripta"] .ux-eyebrow {
  font-family: var(--ux-sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ux-accent);
  margin: 0 0 22px;
}
[data-brand="unscripta"] .ux-sec--ink .ux-eyebrow { color: var(--ux-accent-dark); }
/* Letter-spacing breaks Bengali conjuncts (যা পাবেন renders as separated glyphs), and Bengali has
 * no capitals. Wide-tracked caps are for English only; ik-i18n.js sets <html lang> on toggle. */
html[lang="bn"][data-brand="unscripta"] .ux-eyebrow {
  font-family: var(--ux-bn);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

[data-brand="unscripta"] .ux-display {
  font-family: var(--ux-serif);
  font-weight: 700;
  font-size: clamp(40px, 5.6vw, 76px);
  line-height: 1.1;
  letter-spacing: -0.015em;
  margin: 0;
}
[data-brand="unscripta"] .ux-h2 {
  font-family: var(--ux-serif);
  font-weight: 700;
  font-size: clamp(30px, 3.6vw, 48px);
  line-height: 1.16;
  letter-spacing: -0.01em;
  margin: 0;
  color: inherit;
}
[data-brand="unscripta"] .ux-lead {
  font-family: var(--ux-bn);
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.75;
  color: var(--ux-muted);
  max-width: 58ch;
  margin: 26px 0 0;
}
[data-brand="unscripta"] .ux-sec--ink .ux-lead { color: var(--ux-muted-dark); }
[data-brand="unscripta"] .ux-accent-text { color: var(--ux-accent); }
[data-brand="unscripta"] .ux-sec--ink .ux-accent-text { color: var(--ux-accent-dark); }

[data-brand="unscripta"] .ux-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 40px; }
[data-brand="unscripta"] .ux-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--ux-bn);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  padding: 17px 28px;
  border-radius: 999px;
  text-decoration: none;
  background: var(--ux-ink);
  color: var(--ux-bone);
  transition: background .18s ease, transform .18s ease;
}
[data-brand="unscripta"] .ux-btn:hover { background: var(--ux-accent); color: #fff; transform: translateY(-1px); }
[data-brand="unscripta"] .ux-btn--light { background: var(--ux-bone); color: var(--ux-ink); }
[data-brand="unscripta"] .ux-btn--light:hover { background: #fff; color: var(--ux-ink); }
[data-brand="unscripta"] .ux-btn .ux-arrow { transition: transform .18s ease; }
[data-brand="unscripta"] .ux-btn:hover .ux-arrow { transform: translateX(3px); }
[data-brand="unscripta"] .ux-link {
  font-family: var(--ux-bn);
  font-size: 16px;
  font-weight: 600;
  color: var(--ux-ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 6px;
  text-decoration-color: var(--ux-line);
  transition: text-decoration-color .18s ease;
}
[data-brand="unscripta"] .ux-link:hover { text-decoration-color: var(--ux-ink); }
[data-brand="unscripta"] .ux-sec--ink .ux-link { color: #fff; text-decoration-color: rgba(255,255,255,.3); }
[data-brand="unscripta"] .ux-sec--ink .ux-link:hover { text-decoration-color: #fff; }

/* ── hero ───────────────────────────────────────────────────────────────────────────── */

[data-brand="unscripta"] .ux-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(1100px 520px at 88% -10%, rgba(94, 82, 232, 0.28), transparent 60%),
    radial-gradient(700px 420px at -5% 110%, rgba(94, 82, 232, 0.12), transparent 60%),
    var(--ux-ink);
  color: #fff;
  padding: clamp(84px, 11vw, 148px) 0 clamp(84px, 10vw, 132px);
}
[data-brand="unscripta"] .ux-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: clamp(48px, 6vw, 96px);
  align-items: center;
}
[data-brand="unscripta"] .ux-hero .ux-display { color: #fff; }
/* The hero is dark but is not a .ux-sec--ink section, so it needs its own on-dark colours —
 * deep indigo (#4B3FD6) on #0E0D12 fails contrast. */
[data-brand="unscripta"] .ux-hero .ux-accent-text,
[data-brand="unscripta"] .ux-hero .ux-eyebrow { color: var(--ux-accent-dark); }
[data-brand="unscripta"] .ux-hero .ux-lead { color: var(--ux-muted-dark); }

/* The founder's score, set as a quiet stat panel — deliberately NOT styled like an
 * official Test Report Form. */
[data-brand="unscripta"] .ux-score {
  border: 1px solid var(--ux-line-dark);
  border-radius: 22px;
  padding: 34px 34px 30px;
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
  backdrop-filter: blur(6px);
}
[data-brand="unscripta"] .ux-score-label {
  font-family: var(--ux-bn);
  font-size: 14px;
  color: var(--ux-muted-dark);
  margin: 0;
}
[data-brand="unscripta"] .ux-score-big {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin: 14px 0 26px;
  padding-bottom: 26px;
  border-bottom: 1px solid var(--ux-line-dark);
}
[data-brand="unscripta"] .ux-score-big strong {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 84px;
  line-height: .9;
  font-weight: 700;
  letter-spacing: -0.02em;
}
[data-brand="unscripta"] .ux-score-big span {
  font-family: var(--ux-sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ux-accent-dark);
}
[data-brand="unscripta"] .ux-score-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
[data-brand="unscripta"] .ux-score-rows li {
  display: grid;
  grid-template-columns: 96px 1fr 38px;
  align-items: center;
  gap: 14px;
  font-family: var(--ux-sans);
  font-size: 14px;
  color: #D9D5E3;
}
[data-brand="unscripta"] .ux-score-rows i {
  display: block;
  height: 3px;
  border-radius: 3px;
  background: rgba(255,255,255,0.1);
  overflow: hidden;
  font-style: normal;
}
[data-brand="unscripta"] .ux-score-rows i b { display: block; height: 100%; background: var(--ux-accent-dark); border-radius: 3px; }
[data-brand="unscripta"] .ux-score-rows em {
  font-style: normal;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  text-align: right;
}
[data-brand="unscripta"] .ux-score-who {
  margin: 26px 0 0;
  font-family: var(--ux-bn);
  font-size: 14px;
  color: var(--ux-muted-dark);
}
[data-brand="unscripta"] .ux-score-who strong { color: #fff; font-weight: 600; }

/* ── proof strip ────────────────────────────────────────────────────────────────────── */

[data-brand="unscripta"] .ux-proof { background: var(--ux-paper); border-bottom: 1px solid var(--ux-line); padding: 56px 0 50px; }
[data-brand="unscripta"] .ux-proof-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-brand="unscripta"] .ux-stat { padding: 4px 28px; border-left: 1px solid var(--ux-line); }
[data-brand="unscripta"] .ux-stat:first-child { border-left: 0; padding-left: 0; }
[data-brand="unscripta"] .ux-stat strong {
  display: block;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(40px, 4.2vw, 56px);
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ux-ink);
}
[data-brand="unscripta"] .ux-stat span {
  display: block;
  margin-top: 12px;
  font-family: var(--ux-bn);
  font-size: 15px;
  line-height: 1.45;
  color: var(--ux-muted);
}
[data-brand="unscripta"] .ux-proof-note {
  margin: 34px 0 0;
  font-family: var(--ux-bn);
  font-size: 13px;
  color: var(--ux-muted);
}

/* ── offers (editorial rows, not boxed cards) ───────────────────────────────────────── */

[data-brand="unscripta"] .ux-offers-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 64px; align-items: end; }
[data-brand="unscripta"] .ux-offers-head .ux-lead { margin: 0; }
[data-brand="unscripta"] .ux-offer {
  display: grid;
  grid-template-columns: 88px minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 24px 48px;
  padding: 48px 0;
  border-top: 1px solid var(--ux-line);
}
[data-brand="unscripta"] .ux-offers-list { margin-top: 64px; border-bottom: 1px solid var(--ux-line); }
[data-brand="unscripta"] .ux-offer-num {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--ux-accent);
  padding-top: 6px;
}
[data-brand="unscripta"] .ux-offer h3 {
  font-family: var(--ux-serif);
  font-size: clamp(24px, 2.4vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
  color: var(--ux-ink);
}
[data-brand="unscripta"] .ux-offer-body p {
  font-family: var(--ux-bn);
  font-size: 17px;
  line-height: 1.75;
  color: var(--ux-text);
  margin: 0;
}
[data-brand="unscripta"] .ux-offer-price {
  margin: 20px 0 0 !important;
  font-family: var(--ux-bn);
  font-size: 16px !important;
  font-weight: 600;
  color: var(--ux-ink) !important;
}
[data-brand="unscripta"] .ux-offer-bullets {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
[data-brand="unscripta"] .ux-offer-bullets li {
  position: relative;
  padding-left: 22px;
  font-family: var(--ux-bn);
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--ux-text);
}
[data-brand="unscripta"] .ux-offer-bullets li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ux-accent);
}
[data-brand="unscripta"] .ux-fine {
  margin: 10px 0 0 !important;
  font-family: var(--ux-bn);
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  color: var(--ux-muted) !important;
}
[data-brand="unscripta"] .ux-offer-cta { display: flex; flex-wrap: wrap; gap: 12px 26px; align-items: center; margin-top: 26px; }

/* ── founder ───────────────────────────────────────────────────────────────────────── */

[data-brand="unscripta"] .ux-founder-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(40px, 6vw, 96px);
  align-items: center;
}
[data-brand="unscripta"] .ux-portrait {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  background: var(--ux-ink-2);
}
[data-brand="unscripta"] .ux-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 56% 30%;
  display: block;
  filter: saturate(.9) contrast(1.03);
  transform: scale(1.35);
  transform-origin: 56% 42%;
}
/* Subdue the event backdrop (it carries third-party logos) and let the portrait lead. */
[data-brand="unscripta"] .ux-portrait::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(14,13,18,0.10) 0%, rgba(14,13,18,0) 35%, rgba(14,13,18,0.55) 100%),
    radial-gradient(120% 90% at 55% 40%, transparent 45%, rgba(14,13,18,0.55) 100%);
}
[data-brand="unscripta"] .ux-portrait figcaption {
  position: absolute;
  left: 24px;
  bottom: 20px;
  z-index: 1;
  font-family: var(--ux-bn);
  font-size: 14px;
  color: #fff;
}
[data-brand="unscripta"] .ux-creds { list-style: none; margin: 34px 0 0; padding: 0; border-top: 1px solid var(--ux-line); }
[data-brand="unscripta"] .ux-creds li {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding: 16px 0;
  border-bottom: 1px solid var(--ux-line);
  font-family: var(--ux-bn);
  font-size: 16px;
  color: var(--ux-muted);
}
[data-brand="unscripta"] .ux-creds li strong { color: var(--ux-ink); font-weight: 600; text-align: right; }

/* ── offline centre: IELTS Kishoreganj (sister concern) ────────────────────────────── */

[data-brand="unscripta"] .ux-centre-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 32px 80px;
  align-items: end;
}
[data-brand="unscripta"] .ux-centre-head .ux-lead { margin: 0; }
[data-brand="unscripta"] .ux-gallery {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: 170px;
  gap: 14px;
  margin: 56px 0 0;
}
[data-brand="unscripta"] .ux-shot {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 16px;
  background: var(--ux-ink-2);
}
[data-brand="unscripta"] .ux-shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s cubic-bezier(.2,.7,.2,1);
}
[data-brand="unscripta"] .ux-shot:hover img { transform: scale(1.03); }
[data-brand="unscripta"] .ux-shot::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(14,13,18,0) 55%, rgba(14,13,18,0.72) 100%);
  pointer-events: none;
}
[data-brand="unscripta"] .ux-shot figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 14px;
  z-index: 1;
  font-family: var(--ux-bn);
  font-size: 14px;
  line-height: 1.4;
  color: #fff;
}
[data-brand="unscripta"] .ux-shot--lead { grid-column: 1 / 7;  grid-row: span 3; }
[data-brand="unscripta"] .ux-shot--wide { grid-column: 7 / 13; grid-row: span 1; }
[data-brand="unscripta"] .ux-shot--a    { grid-column: 7 / 10; grid-row: span 2; }
[data-brand="unscripta"] .ux-shot--b    { grid-column: 10 / 13; grid-row: span 2; }

/* ── the founder's test report, shown on the page (redacted) ───────────────────────── */

[data-brand="unscripta"] .ux-report {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px 80px;
  align-items: center;
  margin-top: clamp(72px, 9vw, 120px);
  padding-top: clamp(56px, 7vw, 96px);
  border-top: 1px solid var(--ux-line);
  scroll-margin-top: 96px; /* clears the 76px sticky topbar when the score panel links here */
}
[data-brand="unscripta"] .ux-report-h {
  font-family: var(--ux-serif);
  font-size: clamp(26px, 2.8vw, 38px);
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
  color: var(--ux-ink);
}
[data-brand="unscripta"] .ux-report-doc {
  margin: 0;
  justify-self: center;
  width: min(100%, 460px);
  padding: 14px;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04), 0 30px 60px -20px rgba(14,13,18,.35), 0 10px 20px -10px rgba(14,13,18,.2);
}
[data-brand="unscripta"] .ux-report-doc img { display: block; width: 100%; height: auto; }

/* ── book ──────────────────────────────────────────────────────────────────────────── */

[data-brand="unscripta"] .ux-book {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(40px, 7vw, 110px);
  align-items: center;
}
[data-brand="unscripta"] .ux-book-cover {
  margin: 0 auto;
  width: min(100%, 340px);
  border-radius: 6px;
  overflow: hidden;
  transform: rotate(-2.5deg);
  box-shadow: 0 1px 0 rgba(0,0,0,.04), 0 30px 60px -18px rgba(14,13,18,.45), 0 12px 24px -12px rgba(14,13,18,.3);
}
[data-brand="unscripta"] .ux-book-cover img { display: block; width: 100%; height: auto; }
[data-brand="unscripta"] .ux-book-title {
  font-family: var(--ux-bn);
  font-weight: 700;
  font-size: clamp(30px, 3.4vw, 46px);
  line-height: 1.2;
  color: var(--ux-ink);
  margin: 0;
}
[data-brand="unscripta"] .ux-book-sub {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 18px;
  color: var(--ux-muted);
  margin: 10px 0 0;
}
[data-brand="unscripta"] .ux-book-by {
  margin: 16px 0 0;
  font-family: var(--ux-bn);
  font-size: 15px;
  font-weight: 600;
  color: var(--ux-ink);
}
[data-brand="unscripta"] .ux-book-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 34px 0 0;
  border-top: 1px solid var(--ux-line);
}
[data-brand="unscripta"] .ux-book-stats div { padding: 20px 18px 0 0; }
[data-brand="unscripta"] .ux-book-stats div + div { padding-left: 18px; border-left: 1px solid var(--ux-line); }
[data-brand="unscripta"] .ux-book-stats strong {
  display: block;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(28px, 2.8vw, 38px);
  font-weight: 700;
  line-height: 1;
  color: var(--ux-ink);
}
[data-brand="unscripta"] .ux-book-stats span { display: block; margin-top: 8px; font-family: var(--ux-bn); font-size: 14px; color: var(--ux-muted); }

/* ── scholarship ledger (the founder's own offers) ─────────────────────────────────── */

[data-brand="unscripta"] .ux-ledger-wrap {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 48px 80px;
  align-items: start;
  margin-bottom: 96px;
}
[data-brand="unscripta"] .ux-ledger-total strong {
  display: block;
  font-family: 'Playfair Display', 'Hind Siliguri', Georgia, serif;
  font-size: clamp(56px, 7vw, 96px);
  line-height: .95;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #fff;
  margin-top: 30px;
}
[data-brand="unscripta"] .ux-ledger-total span {
  display: block;
  margin-top: 14px;
  font-family: var(--ux-bn);
  font-size: 17px;
  color: var(--ux-muted-dark);
}
[data-brand="unscripta"] .ux-ledger { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ux-line-dark); }
[data-brand="unscripta"] .ux-ledger li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 24px;
  align-items: baseline;
  padding: 20px 0;
  border-bottom: 1px solid var(--ux-line-dark);
}
[data-brand="unscripta"] .ux-ledger b {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
}
[data-brand="unscripta"] .ux-ledger em {
  font-style: normal;
  font-family: var(--ux-bn);
  font-size: 18px;
  font-weight: 600;
  color: var(--ux-accent-dark);
  text-align: right;
  white-space: nowrap;
}
[data-brand="unscripta"] .ux-ledger small {
  grid-column: 1 / -1;
  font-family: var(--ux-bn);
  font-size: 14px;
  color: var(--ux-muted-dark);
}
[data-brand="unscripta"] .ux-ledger .ux-chosen {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(179, 171, 255, .16);
  color: var(--ux-accent-dark);
  font-size: 12px;
  font-weight: 600;
  vertical-align: 2px;
}
[data-brand="unscripta"] .ux-guides-h {
  font-family: var(--ux-serif);
  font-size: clamp(24px, 2.4vw, 32px);
  font-weight: 700;
  color: #fff;
  margin: 0;
}

[data-brand="unscripta"] .ux-score-proof { margin: 12px 0 0; display: flex; gap: 16px; flex-wrap: wrap; }
[data-brand="unscripta"] .ux-score-proof a {
  font-family: var(--ux-bn);
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  text-decoration: underline;
  text-decoration-color: rgba(255,255,255,.3);
  text-underline-offset: 5px;
}
[data-brand="unscripta"] .ux-score-proof a:hover { text-decoration-color: #fff; }
[data-brand="unscripta"] .ux-score-proof a + a { color: var(--ux-muted-dark); font-weight: 500; }
[data-brand="unscripta"] .ux-cert-ids { margin-top: 18px !important; overflow-wrap: anywhere; }
[data-brand="unscripta"] .ux-score-meta {
  margin: 22px 0 0;
  font-family: var(--ux-sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ux-muted-dark);
}

/* ── study abroad ──────────────────────────────────────────────────────────────────── */

[data-brand="unscripta"] .ux-abroad-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px 80px;
  align-items: end;
}
[data-brand="unscripta"] .ux-countries { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 56px; }
[data-brand="unscripta"] .ux-country {
  font-family: var(--ux-bn);
  font-size: 16px;
  color: #fff;
  text-decoration: none;
  padding: 12px 20px;
  border: 1px solid var(--ux-line-dark);
  border-radius: 999px;
  transition: background .18s ease, border-color .18s ease;
}
[data-brand="unscripta"] .ux-country:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.35); }
[data-brand="unscripta"] .ux-country--all { background: #fff; color: var(--ux-ink); border-color: #fff; font-weight: 600; }
[data-brand="unscripta"] .ux-country--all:hover { background: var(--ux-accent-dark); border-color: var(--ux-accent-dark); color: var(--ux-ink); }
[data-brand="unscripta"] .ux-sec--ink .ux-fine { color: var(--ux-muted-dark) !important; margin-top: 28px !important; }

/* ── closing call ──────────────────────────────────────────────────────────────────── */

[data-brand="unscripta"] .ux-close { text-align: center; }
[data-brand="unscripta"] .ux-close .ux-lead { margin-left: auto; margin-right: auto; }
[data-brand="unscripta"] .ux-close .ux-actions { justify-content: center; }

/* ── footer (element is built by site-topbar.js; this restyles it) ─────────────────── */

[data-brand="unscripta"] #ux-site-footer { background: var(--ux-ink); color: var(--ux-muted-dark); border-top: 1px solid var(--ux-line-dark); }
[data-brand="unscripta"] #ux-site-footer .ux-foot-in { max-width: 1180px; padding: 44px clamp(20px, 5vw, 72px); gap: 18px 40px; }
[data-brand="unscripta"] #ux-site-footer strong {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #fff;
}
[data-brand="unscripta"] #ux-site-footer nav { gap: 26px; }
[data-brand="unscripta"] #ux-site-footer a { font-family: var(--ux-bn); font-size: 15px; color: #D9D5E3; }
[data-brand="unscripta"] #ux-site-footer a:hover { color: #fff; }
[data-brand="unscripta"] #ux-site-footer span { font-family: var(--ux-bn); font-size: 13px; color: var(--ux-muted-dark); width: 100%; }

/* ── responsive ────────────────────────────────────────────────────────────────────── */

@media (max-width: 980px) {
  [data-brand="unscripta"] .ux-hero-grid,
  [data-brand="unscripta"] .ux-founder-grid,
  [data-brand="unscripta"] .ux-abroad-grid,
  [data-brand="unscripta"] .ux-offers-head { grid-template-columns: 1fr; }
  [data-brand="unscripta"] .ux-score { max-width: 520px; }
  [data-brand="unscripta"] .ux-offer { grid-template-columns: 56px minmax(0, 1fr); }
  [data-brand="unscripta"] .ux-offer-body { grid-column: 2; }
  [data-brand="unscripta"] .ux-portrait { max-width: 460px; }
  [data-brand="unscripta"] .ux-centre-head { grid-template-columns: 1fr; }
  [data-brand="unscripta"] .ux-report { grid-template-columns: 1fr; }
  [data-brand="unscripta"] .ux-book,
  [data-brand="unscripta"] .ux-ledger-wrap { grid-template-columns: 1fr; }
  [data-brand="unscripta"] .ux-book-cover { width: min(70%, 280px); }
}
@media (max-width: 720px) {
  [data-brand="unscripta"] .ux-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 150px; gap: 10px; }
  [data-brand="unscripta"] .ux-shot--lead { grid-column: 1 / 3; grid-row: span 2; }
  [data-brand="unscripta"] .ux-shot--wide { grid-column: 1 / 3; grid-row: span 1; }
  [data-brand="unscripta"] .ux-shot--a    { grid-column: 1 / 2; grid-row: span 2; }
  [data-brand="unscripta"] .ux-shot--b    { grid-column: 2 / 3; grid-row: span 2; }
  [data-brand="unscripta"] .ux-shot figcaption { font-size: 12.5px; left: 12px; right: 12px; bottom: 10px; }
}
@media (max-width: 720px) {
  [data-brand="unscripta"] .ux-proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 34px; }
  [data-brand="unscripta"] .ux-stat:nth-child(3) { border-left: 0; padding-left: 0; }
  [data-brand="unscripta"] .ux-stat { padding: 0 0 0 20px; }
  [data-brand="unscripta"] .ux-offer { grid-template-columns: 1fr; gap: 14px; padding: 38px 0; }
  [data-brand="unscripta"] .ux-offer-body { grid-column: auto; }
  [data-brand="unscripta"] .ux-score { padding: 26px 22px 24px; }
  [data-brand="unscripta"] .ux-score-big strong { font-size: 68px; }
  [data-brand="unscripta"] .ux-score-rows li { grid-template-columns: 84px 1fr 34px; }
  [data-brand="unscripta"] .ux-btn { padding: 16px 24px; }
}