/* ============================================================
   Shared page styles for content pages
   (About, Registrars, Become, Policies, Contact)
   ============================================================ */

/* Page hero — dark blue banner */
.page-hero {
  position: relative;
  background: linear-gradient(180deg, #062047 0%, #061b3d 100%);
  color: white;
  padding: 100px 0 88px;
  overflow: hidden;
}
.page-hero__bg { position: absolute; inset: 0; pointer-events: none; }
.page-hero__grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse 80% 80% at 70% 40%, black 0%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 80% 80% at 70% 40%, black 0%, transparent 75%);
  opacity: 0.55;
}
.page-hero__glow {
  position: absolute; right: -10%; top: -20%;
  width: 60%; aspect-ratio: 1/1;
  background: radial-gradient(circle, rgba(127,195,236,0.22), transparent 60%);
  filter: blur(40px);
}
.page-hero__inner { position: relative; z-index: 1; }
.page-hero__crumbs {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  font-family: var(--font-mono); font-size: 12px;
  color: rgba(255,255,255,0.55); letter-spacing: 0.04em;
  margin-bottom: 32px;
}
.page-hero__crumbs a { color: rgba(255,255,255,0.75); }
.page-hero__crumbs a:hover { color: white; }
.page-hero__crumbs span { color: rgba(255,255,255,0.85); }
.page-hero__crumb-sep { color: rgba(255,255,255,0.35); }
.page-hero__eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent-soft-text);
  padding: 6px 12px; border-radius: 999px;
  background: rgba(127,195,236,0.10);
  border: 1px solid rgba(127,195,236,0.22);
  margin-bottom: 20px;
  font-weight: 600;
}
.page-hero__title {
  font-family: var(--font-display);
  font-size: clamp(40px, 5.4vw, 72px);
  line-height: 1.05; letter-spacing: -0.025em;
  font-weight: 600; max-width: 18ch;
  margin: 0 0 18px;
}
.page-hero__sub {
  font-size: 18px; line-height: 1.55;
  color: rgba(255,255,255,0.78);
  max-width: 64ch;
}

/* Generic page sections */
.page-section { padding: 88px 0; }
.page-section--soft { background: var(--bg-tint); }
.page-section__head { margin-bottom: 48px; max-width: 720px; }
.page-section__head h2 { margin-top: 14px; }

/* Bottom CTA band on every page */
.page-cta {
  background: linear-gradient(180deg, #0b2a55 0%, #061b3d 100%);
  color: white; padding: 72px 0;
}
.page-cta__inner {
  display: grid; grid-template-columns: 1fr auto;
  gap: 32px; align-items: center;
}
.page-cta__title {
  font-family: var(--font-display);
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 600; letter-spacing: -0.02em;
  line-height: 1.15; margin-top: 14px;
  max-width: 24ch;
}
.page-cta__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.eyebrow--on-dark { color: var(--accent-soft-text); }
.btn--on-dark {
  background: rgba(255,255,255,0.05);
  color: white;
  border-color: rgba(255,255,255,0.18);
}
.btn--on-dark:hover {
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.32);
}

/* ===== About: long-form doc ===== */
.doc { display: grid; grid-template-columns: 1fr 2fr; gap: 64px; }
.doc__lead .eyebrow { display: inline-block; }
.doc__lead h2 { margin-top: 16px; max-width: 12ch; }
.doc__body { display: flex; flex-direction: column; gap: 18px;
  font-size: 16.5px; line-height: 1.7; color: var(--ink-2); }
.doc__body strong { color: var(--ink); font-weight: 600; }
.doc__milestones {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 16px; margin-top: 56px;
}
.doc__ms {
  background: white; border: 1px solid var(--line);
  border-radius: 14px; padding: 22px 22px 24px;
  border-left: 3px solid var(--accent);
}
.doc__ms-year {
  font-family: var(--font-mono); font-size: 13px;
  color: var(--accent); font-weight: 600; letter-spacing: 0.04em;
}
.doc__ms-text { margin-top: 8px; color: var(--ink-2); font-size: 15px; line-height: 1.5; }

/* About: Mission / Vision */
.mv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.mv-card {
  background: white; border: 1px solid var(--line);
  border-radius: 18px; padding: 32px;
  box-shadow: var(--shadow-sm);
  position: relative; overflow: hidden;
}
.mv-card--mission { background: linear-gradient(180deg, var(--accent-soft) 0%, white 60%); }
.mv-card--vision  { background: linear-gradient(180deg, #f0f7ff 0%, white 60%); }
.mv-card__icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: white; border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  color: var(--accent); margin-bottom: 18px;
  box-shadow: var(--shadow-sm);
}
.mv-card__label {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent); font-weight: 600;
}
.mv-card__title {
  font-family: var(--font-display);
  font-size: 24px; font-weight: 600; letter-spacing: -0.015em;
  line-height: 1.25; margin: 12px 0 14px; color: var(--ink);
}
.mv-card__body { color: var(--ink-2); line-height: 1.6; font-size: 15.5px; }

/* About: Functions list */
.fn-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.fn {
  display: grid; grid-template-columns: 56px 1fr; gap: 18px;
  align-items: start;
  padding: 22px 24px;
  background: white; border: 1px solid var(--line);
  border-radius: 14px;
  transition: border-color .15s, transform .15s;
}
.fn:hover { border-color: var(--accent); transform: translateY(-1px); }
.fn__num {
  font-family: var(--font-mono); font-size: 12px;
  color: var(--accent); font-weight: 600; letter-spacing: 0.06em;
  background: var(--accent-soft);
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px;
}
.fn__t { font-size: 16px; font-weight: 600; margin: 4px 0 4px; color: var(--ink); }
.fn__d { font-size: 14px; color: var(--ink-2); line-height: 1.55; }

/* ===== Registrars (local) — list ===== */
.reg-toolbar {
  display: grid; grid-template-columns: 1fr auto auto;
  gap: 16px; align-items: center; margin-bottom: 24px;
}
.reg-search {
  position: relative;
  background: white; border: 1px solid var(--line);
  border-radius: 12px;
  display: flex; align-items: center;
  padding: 0 16px; height: 52px;
  box-shadow: var(--shadow-sm);
  transition: border-color .15s, box-shadow .15s;
}
.reg-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.reg-search svg { color: var(--ink-3); flex: 0 0 auto; }
.reg-search input {
  flex: 1; border: 0; outline: 0; background: transparent;
  font: 500 15px var(--font-sans); color: var(--ink);
  margin-left: 12px;
}
.reg-search input::placeholder { color: var(--ink-3); }
.reg-search__clear {
  border: 0; background: var(--bg-tint);
  width: 28px; height: 28px; border-radius: 50%;
  font-size: 18px; color: var(--ink-2); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.reg-toolbar__count {
  font-family: var(--font-mono); font-size: 12.5px;
  color: var(--ink-3); letter-spacing: 0.04em;
}
.reg-toolbar__count strong { color: var(--ink); font-weight: 600; }
.reg-toolbar__chips { display: flex; gap: 8px; flex-wrap: wrap; }
.reg-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 11px;
  color: var(--ink-2); padding: 5px 10px;
  background: white; border: 1px solid var(--line); border-radius: 999px;
  letter-spacing: 0.04em;
}
.reg-chip__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--ok, #2bbf6e);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ok, #2bbf6e) 18%, transparent);
}

.reg-list {
  background: white; border: 1px solid var(--line);
  border-radius: 16px; overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.reg-row {
  display: grid;
  grid-template-columns: 56px 2fr 2fr 1.4fr;
  gap: 24px; align-items: center;
  padding: 20px 24px;
  border-top: 1px solid var(--line);
  transition: background .12s;
}
.reg-row:first-child { border-top: 0; }
.reg-row:hover { background: var(--bg-tint); }
.reg-row__rank {
  font-family: var(--font-mono); font-size: 12px;
  color: var(--ink-3); letter-spacing: 0.06em;
}
.reg-row__brand { display: flex; align-items: center; gap: 14px; min-width: 0; }
.reg-row__monogram {
  width: 44px; height: 44px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--accent), var(--accent-deep));
  color: white; font-weight: 700; font-size: 14px;
  letter-spacing: 0.02em;
  font-family: var(--font-display);
  flex: 0 0 auto;
}
.reg-row__name { font-weight: 600; color: var(--ink); font-size: 15.5px; letter-spacing: -0.005em; }
.reg-row__site { font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }
.reg-row__site:hover { color: var(--accent); }
.reg-row__meta { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.reg-row__addr, .reg-row__phone {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--ink-2); font-size: 13.5px;
}
.reg-row__addr svg, .reg-row__phone svg { color: var(--ink-3); flex: 0 0 auto; }
.reg-row__cta { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; }
.reg-row__email {
  font-family: var(--font-mono); font-size: 12px;
  color: var(--ink-2);
}
.reg-row__email:hover { color: var(--accent); }
.reg-empty {
  background: white; padding: 48px;
  border: 1px dashed var(--line); border-radius: 16px;
  text-align: center; color: var(--ink-3);
}
.reg-note {
  margin-top: 28px;
  background: var(--accent-soft);
  border: 1px solid color-mix(in oklab, var(--accent) 18%, transparent);
  border-radius: 12px;
  padding: 18px 22px;
  color: var(--ink-2); font-size: 14.5px; line-height: 1.55;
}
.reg-note strong { color: var(--accent); font-weight: 600; }
.reg-note a { color: var(--accent); font-weight: 600; }

/* ===== International registrars — card grid ===== */
.ireg-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.ireg-card {
  background: white; border: 1px solid var(--line);
  border-radius: 14px; padding: 20px;
  display: flex; flex-direction: column; gap: 6px;
  transition: border-color .15s, transform .15s, box-shadow .15s;
  text-decoration: none;
  position: relative; min-height: 180px;
}
.ireg-card:hover {
  border-color: var(--accent); transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.ireg-card__top {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 12px;
}
.ireg-card__monogram {
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--accent-soft); color: var(--accent);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 13px;
  font-family: var(--font-display);
}
.ireg-card__rank {
  font-family: var(--font-mono); font-size: 11px;
  color: var(--ink-3); letter-spacing: 0.06em;
}
.ireg-card__name {
  font-weight: 600; font-size: 15px; color: var(--ink);
  letter-spacing: -0.005em; line-height: 1.3;
}
.ireg-card__site {
  font-family: var(--font-mono); font-size: 12px;
  color: var(--accent); margin-top: 2px;
}
.ireg-card__email {
  font-family: var(--font-mono); font-size: 11.5px;
  color: var(--ink-3); word-break: break-all;
}
.ireg-card__visit {
  margin-top: auto; padding-top: 12px;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 11.5px;
  color: var(--ink-2); letter-spacing: 0.06em;
  text-transform: uppercase; font-weight: 600;
  transition: color .15s, gap .15s;
}
.ireg-card:hover .ireg-card__visit { color: var(--accent); gap: 9px; }

/* ===== Become a Registrar ===== */
.step-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.step {
  background: white; border: 1px solid var(--line);
  border-radius: 16px; padding: 32px; position: relative;
  transition: border-color .2s, transform .2s;
}
.step:hover { border-color: var(--accent); transform: translateY(-2px); }
.step__num {
  font-family: var(--font-mono); font-size: 13px;
  color: white; background: var(--accent);
  width: 40px; height: 40px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; margin-bottom: 22px;
}
.step__t { font-size: 19px; font-weight: 600; margin-bottom: 10px; letter-spacing: -0.01em; }
.step__d { color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }

.req-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.req-list {
  list-style: none; padding: 0; margin: 0;
  background: white; border: 1px solid var(--line);
  border-radius: 16px; overflow: hidden;
}
.req-list__item {
  display: grid; grid-template-columns: 60px 1fr; gap: 16px;
  align-items: center; padding: 22px 24px;
  border-top: 1px solid var(--line);
  color: var(--ink); font-size: 15.5px;
}
.req-list__item:first-child { border-top: 0; }
.req-list__num {
  font-family: var(--font-mono); font-size: 12px;
  color: var(--accent); font-weight: 600;
  width: 36px; height: 36px; border-radius: 10px;
  background: var(--accent-soft);
  display: flex; align-items: center; justify-content: center;
}

.dl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dl {
  background: white; border: 1px solid var(--line);
  border-radius: 14px; padding: 24px;
  display: grid; grid-template-columns: 48px 1fr auto auto;
  align-items: center; gap: 18px;
  transition: border-color .15s, transform .15s;
  text-decoration: none;
}
.dl:hover { border-color: var(--accent); transform: translateY(-1px); }
.dl__icon {
  width: 44px; height: 44px; border-radius: 10px;
  background: var(--accent-soft); color: var(--accent);
  display: flex; align-items: center; justify-content: center;
}
.dl__title { font-weight: 600; font-size: 15.5px; color: var(--ink); letter-spacing: -0.005em; }
.dl__desc { font-size: 13px; color: var(--ink-3); margin-top: 3px; line-height: 1.45; }
.dl__kind {
  font-family: var(--font-mono); font-size: 10.5px;
  color: var(--ink-2); padding: 4px 8px;
  background: var(--bg-tint); border-radius: 6px;
  letter-spacing: 0.06em;
}
.dl__cta {
  font-family: var(--font-mono); font-size: 11.5px;
  color: var(--accent); font-weight: 600; letter-spacing: 0.06em;
}

/* ===== Policies ===== */
.policy-lead { display: grid; grid-template-columns: 2fr 1fr; gap: 32px; align-items: stretch; }
.policy-lead__card {
  background: linear-gradient(160deg, var(--accent-soft) 0%, white 70%);
  border: 1px solid var(--line);
  border-radius: 18px; padding: 36px;
}
.policy-lead__pill {
  display: inline-block;
  background: var(--accent); color: white;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase;
  padding: 5px 11px; border-radius: 999px;
  font-weight: 600; margin-bottom: 14px;
}
.policy-lead__title {
  font-family: var(--font-display);
  font-size: 36px; font-weight: 600; letter-spacing: -0.02em;
  margin: 0 0 12px; color: var(--ink);
}
.policy-lead__desc { color: var(--ink-2); line-height: 1.6; max-width: 56ch; }
.policy-lead__file {
  margin-top: 28px;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
  padding: 18px 22px;
  background: white; border: 1px solid var(--line); border-radius: 12px;
}
.policy-lead__doc {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--font-mono); font-size: 13px;
  color: var(--ink); word-break: break-all;
}
.policy-lead__doc svg { color: var(--accent); flex: 0 0 auto; }
.policy-lead__aside {
  background: var(--ink); color: white;
  border-radius: 18px; padding: 32px;
}
.policy-lead__aside .eyebrow { color: var(--accent-soft-text); }
.policy-lead__aside h3 { color: white; }
.policy-lead__aside p { color: rgba(255,255,255,0.75); }

.grace-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.grace {
  background: white; border: 1px solid var(--line);
  border-radius: 14px; padding: 24px;
  border-left: 3px solid var(--accent);
}
.grace__days {
  font-family: var(--font-display);
  font-size: 44px; font-weight: 600; color: var(--ink);
  letter-spacing: -0.02em; line-height: 1;
}
.grace__days span {
  font-family: var(--font-mono); font-size: 13px;
  color: var(--ink-3); margin-left: 6px;
  letter-spacing: 0.06em; text-transform: uppercase;
  font-weight: 500;
}
.grace__t { color: var(--ink-2); margin-top: 10px; font-size: 14.5px; }

.policy-list {
  background: white; border: 1px solid var(--line);
  border-radius: 16px; overflow: hidden;
}
.policy-row {
  display: grid; grid-template-columns: 60px 1fr auto;
  gap: 18px; align-items: center;
  padding: 22px 24px;
  border-top: 1px solid var(--line);
  text-decoration: none;
  transition: background .12s;
}
.policy-row:first-child { border-top: 0; }
.policy-row:hover { background: var(--bg-tint); }
.policy-row__num {
  font-family: var(--font-mono); font-size: 12px;
  color: var(--accent); font-weight: 600;
  width: 36px; height: 36px; border-radius: 10px;
  background: var(--accent-soft);
  display: flex; align-items: center; justify-content: center;
}
.policy-row__t { display: block; font-weight: 600; color: var(--ink); font-size: 15.5px; letter-spacing: -0.005em; }
.policy-row__d { display: block; font-size: 13px; color: var(--ink-3); margin-top: 2px; line-height: 1.45; }
.policy-row__cta {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 11.5px;
  color: var(--accent); font-weight: 600; letter-spacing: 0.06em;
}

/* ===== Contact ===== */
.contact-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 32px; }
.contact-info { display: flex; flex-direction: column; gap: 12px; }
.contact-info__card {
  background: white; border: 1px solid var(--line);
  border-radius: 14px; padding: 22px;
  display: flex; flex-direction: column; gap: 6px;
}
.contact-info__label {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ink-3); font-weight: 600;
  margin-bottom: 4px;
}
.contact-info__label svg { color: var(--accent); }
.contact-info__value {
  font-size: 18px; color: var(--ink); font-weight: 600;
  text-decoration: none; letter-spacing: -0.005em;
}
.contact-info__value:hover { color: var(--accent); }
.contact-info__value--addr { font-weight: 500; line-height: 1.45; }
.contact-info__hint { font-size: 13px; color: var(--ink-3); }
.contact-info__link { color: var(--accent); }
.contact-info__office {
  background: linear-gradient(180deg, #062047 0%, #061b3d 100%);
  color: white; border-radius: 14px;
  padding: 28px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; min-height: 140px;
  position: relative; overflow: hidden;
}
.contact-info__office-label {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent-soft-text); font-weight: 600;
  z-index: 1; position: relative;
}
.contact-info__office-pin {
  color: rgba(127,195,236,0.4);
  position: absolute; right: -10px; top: 50%; transform: translateY(-50%);
}

.contact-form {
  background: white; border: 1px solid var(--line);
  border-radius: 18px; padding: 36px;
  box-shadow: var(--shadow-sm);
}
.contact-form__head { margin-bottom: 28px; }
.contact-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.contact-form__field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.contact-form__field span {
  font-family: var(--font-sans); font-size: 13px;
  color: var(--ink); font-weight: 500;
}
.contact-form__field input,
.contact-form__field textarea {
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--bg-tint);
  padding: 13px 16px;
  font: 500 15px var(--font-sans); color: var(--ink);
  outline: 0;
  transition: border-color .15s, background .15s, box-shadow .15s;
  resize: vertical;
}
.contact-form__field input:focus,
.contact-form__field textarea:focus {
  border-color: var(--accent); background: white;
  box-shadow: 0 0 0 4px var(--accent-soft);
}
.contact-form__field input::placeholder,
.contact-form__field textarea::placeholder { color: var(--ink-3); }
.contact-form__foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 22px; gap: 16px; flex-wrap: wrap;
}
.contact-form__hint { font-size: 12.5px; color: var(--ink-3); }
.contact-form__ok {
  text-align: center; padding: 32px 16px;
}
.contact-form__ok-icon {
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--accent-soft); color: var(--accent);
  display: inline-flex; align-items: center; justify-content: center;
}

/* ===== 404 ===== */
.nf {
  position: relative;
  background: linear-gradient(180deg, #062047 0%, #061b3d 100%);
  color: white;
  padding: 96px 0 104px;
  overflow: hidden;
  min-height: 72vh;
  display: flex; align-items: center;
}
.nf__bg { position: absolute; inset: 0; pointer-events: none; }
.nf__grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse 70% 70% at 50% 35%, black 0%, transparent 72%);
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 35%, black 0%, transparent 72%);
  opacity: 0.5;
}
.nf__glow {
  position: absolute; left: 50%; top: 8%;
  width: 50%; aspect-ratio: 1/1; transform: translateX(-50%);
  background: radial-gradient(circle, rgba(127,195,236,0.22), transparent 60%);
  filter: blur(50px);
}
.nf__inner { position: relative; z-index: 1; text-align: center; max-width: 760px; margin: 0 auto; }
.nf__code {
  font-family: var(--font-display);
  font-size: clamp(96px, 18vw, 200px);
  font-weight: 700; line-height: 0.9;
  letter-spacing: -0.04em;
  display: inline-flex; align-items: center; gap: 0.02em;
  color: white;
  margin-bottom: 8px;
}
.nf__o {
  position: relative;
  width: 0.78em; height: 0.78em;
  display: inline-flex; align-items: center; justify-content: center;
}
.nf__o-ring {
  position: absolute; inset: 0;
  border-radius: 50%;
  border: 0.1em solid var(--accent-soft-text);
  box-shadow: 0 0 40px rgba(127,195,236,0.5);
}
.nf__o-star {
  width: 0.4em; height: 0.4em;
  color: var(--accent-soft-text);
  display: inline-flex;
  animation: nf-star 6s ease-in-out infinite;
}
@keyframes nf-star {
  0%, 100% { transform: rotate(0) scale(1); }
  50%      { transform: rotate(20deg) scale(0.9); }
}
.nf__eyebrow {
  display: inline-block;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--accent-soft-text); font-weight: 600;
  padding: 6px 12px; border-radius: 999px;
  background: rgba(127,195,236,0.10);
  border: 1px solid rgba(127,195,236,0.22);
  margin-bottom: 20px;
}
.nf__title {
  font-family: var(--font-display);
  font-size: clamp(30px, 4.5vw, 48px);
  font-weight: 600; letter-spacing: -0.025em;
  line-height: 1.1; margin: 0 0 16px;
}
.nf__sub {
  font-size: 17px; line-height: 1.6;
  color: rgba(255,255,255,0.75);
  max-width: 52ch; margin: 0 auto 36px;
}
.nf__search {
  display: flex; align-items: center; gap: 8px;
  background: white; border-radius: 14px;
  padding: 8px; max-width: 520px; margin: 0 auto 40px;
  box-shadow: 0 18px 48px rgba(0,0,0,0.3);
}
.nf__search-icon { display: flex; color: var(--ink-3); padding-left: 10px; }
.nf__search input {
  flex: 1; border: 0; outline: 0; background: transparent;
  font: 500 16px var(--font-mono); color: var(--ink);
  padding: 10px 4px;
}
.nf__search input::placeholder { color: var(--ink-3); }
.nf__search-tld { font-family: var(--font-mono); font-weight: 600; color: var(--accent); font-size: 16px; }
.nf__links { margin-bottom: 36px; }
.nf__links-label {
  display: block;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(255,255,255,0.5); margin-bottom: 16px;
}
.nf__links-grid {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
}
.nf__chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border-radius: 999px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.16);
  color: rgba(255,255,255,0.85);
  font-size: 13.5px; font-weight: 500;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.nf__chip svg { color: rgba(255,255,255,0.45); transition: color .15s, transform .15s; }
.nf__chip:hover {
  background: rgba(127,195,236,0.14);
  border-color: rgba(127,195,236,0.5);
  color: white; transform: translateY(-1px);
}
.nf__chip:hover svg { color: var(--accent-soft-text); transform: translateX(2px); }
.nf__home { margin-top: 4px; }
@media (max-width: 520px) {
  .nf__search { flex-direction: column; align-items: stretch; }
  .nf__search input { text-align: center; }
  .nf__search-tld { text-align: center; }
  .nf__search .btn { width: 100%; justify-content: center; }
}

/* ===== Blog listing ===== */
.blog-layout { display: grid; grid-template-columns: 1fr 300px; gap: 48px; align-items: start; }
.blog-main { display: flex; flex-direction: column; gap: 32px; }
.blog-filter { display: flex; flex-direction: column; gap: 12px; }
.blog-search {
  display: flex; align-items: center; gap: 10px;
  background: white; border: 1px solid var(--line); border-radius: 12px;
  padding: 0 16px; height: 48px;
  box-shadow: var(--shadow-sm);
  transition: border-color .15s, box-shadow .15s;
}
.blog-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.blog-search svg { color: var(--ink-3); flex: 0 0 auto; }
.blog-search input { flex: 1; border: 0; outline: 0; background: transparent; font: 500 14.5px var(--font-sans); color: var(--ink); margin-left: 8px; }
.blog-search input::placeholder { color: var(--ink-3); }
.blog-cats { display: flex; gap: 6px; flex-wrap: wrap; }
.blog-cat {
  padding: 7px 14px; border-radius: 999px;
  border: 1px solid var(--line); background: white;
  font-size: 13px; color: var(--ink-2); cursor: pointer;
  transition: all .15s;
}
.blog-cat:hover { border-color: var(--accent); color: var(--accent); }
.blog-cat.is-active { background: var(--accent); color: white; border-color: var(--accent); }

.blog-featured { position: relative; }
.blog-featured__label {
  position: absolute; top: -12px; left: 0; z-index: 1;
  background: var(--accent); color: white;
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 6px; font-weight: 600;
}

.blog-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.blog-empty { text-align: center; padding: 48px; color: var(--ink-3); border: 1px dashed var(--line); border-radius: 16px; }

.bpost {
  background: white; border: 1px solid var(--line);
  border-radius: 14px; overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform .2s, box-shadow .2s, border-color .2s;
}
.bpost:hover { transform: translateY(-2px); border-color: color-mix(in oklab, var(--accent) 30%, var(--line)); box-shadow: var(--shadow-md); }
.bpost--featured { grid-column: 1 / -1; flex-direction: row; border-radius: 18px; }
.bpost--featured .bpost__media { flex: 0 0 42%; aspect-ratio: auto; min-height: 280px; }
.bpost--featured .bpost__body { padding: 36px; flex: 1; display: flex; flex-direction: column; }
.bpost--featured .bpost__title { font-size: 26px; }
.bpost__media { position: relative; aspect-ratio: 16/10; overflow: hidden; }
.bpost__img { width: 100%; height: 100%; object-fit: cover; }
.bpost__placeholder { width: 100%; height: 100%; display: flex; align-items: flex-end; padding: 16px; }
.bpost__cat {
  position: absolute; top: 14px; left: 14px;
  background: white; font-family: var(--font-mono); font-size: 11px;
  padding: 4px 10px; border-radius: 999px; color: var(--ink-2);
  border: 1px solid var(--line);
}
.bpost__body { padding: 20px 22px 24px; flex: 1; display: flex; flex-direction: column; }
.bpost__meta { font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); margin-bottom: 8px; letter-spacing: 0.04em; }
.bpost__title { font-family: var(--font-display); font-size: 18px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.3; color: var(--ink); margin-bottom: 10px; }
.bpost__excerpt { font-size: 14px; color: var(--ink-3); line-height: 1.55; }
.bpost__more { margin-top: auto; padding-top: 16px; display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--accent); font-weight: 500; text-decoration: none; }
.bpost__more:hover { gap: 9px; }

/* Blog sidebar */
.blog-sidebar { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 120px; }
.blog-sidebar__card { background: white; border: 1px solid var(--line); border-radius: 14px; padding: 22px; display: flex; flex-direction: column; }
.blog-sidebar__card--dark { background: linear-gradient(160deg,#062047 0%,#061b3d 100%); border-color: transparent; }
.blog-sidebar__title { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; margin-bottom: 14px; }
.blog-sidebar__eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent-soft-text); font-weight: 600; margin-bottom: 8px; }
.blog-sidebar__h { font-family: var(--font-display); font-size: 18px; font-weight: 600; letter-spacing: -0.01em; color: white; margin-bottom: 8px; }
.blog-sidebar__p { font-size: 13.5px; color: rgba(255,255,255,0.7); line-height: 1.5; }
.blog-sidebar__cats { display: flex; flex-direction: column; gap: 2px; }
.blog-sidebar__cat { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 9px 10px; border-radius: 8px; border: 0; background: none; font-size: 14px; color: var(--ink-2); cursor: pointer; text-align: left; transition: background .12s; }
.blog-sidebar__cat:hover { background: var(--bg-tint); }
.blog-sidebar__cat.is-active { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.blog-sidebar__count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); background: var(--bg-tint); padding: 2px 7px; border-radius: 999px; }
.blog-sidebar__links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.blog-sidebar__links a { color: var(--ink-2); font-size: 14px; transition: color .15s; }
.blog-sidebar__links a:hover { color: var(--accent); }
.blog-sidebar__admin { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-3); padding: 12px 16px; background: white; border: 1px dashed var(--line); border-radius: 12px; text-decoration: none; transition: color .15s, border-color .15s; }
.blog-sidebar__admin:hover { color: var(--accent); border-color: var(--accent); }

/* Blog post single */
.blog-post-layout { display: grid; grid-template-columns: 1fr 300px; gap: 48px; align-items: start; }
.blog-post__hero-img { width: 100%; border-radius: 16px; margin-bottom: 32px; object-fit: cover; max-height: 420px; }
.blog-post__body { display: flex; flex-direction: column; gap: 18px; font-size: 17px; line-height: 1.7; color: var(--ink-2); }
.blog-post__body p { margin: 0; }
.blog-post__foot { display: flex; gap: 12px; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--line); }
.blog-related { display: flex; flex-direction: column; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--line-2); text-decoration: none; }
.blog-related:last-child { border-bottom: 0; }
.blog-related__cat { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); font-weight: 600; }
.blog-related__title { font-size: 14px; font-weight: 500; color: var(--ink); line-height: 1.4; }
.blog-related__title:hover { color: var(--accent); }

/* ===== Blog Admin ===== */
.admin { min-height: 100vh; background: var(--bg-tint); display: flex; flex-direction: column; }
.admin-nav { background: linear-gradient(90deg,#062047,#0989CE); padding: 0 28px; height: 68px; display: flex; align-items: center; gap: 24px; position: sticky; top: 0; z-index: 50; }
.admin-nav__title { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.65); font-weight: 600; }
.admin-nav__links { margin-left: auto; }
.admin-nav__link { color: rgba(255,255,255,0.75); font-size: 14px; font-weight: 500; text-decoration: none; }
.admin-nav__link:hover { color: white; }
.admin-body { flex: 1; display: grid; grid-template-columns: 420px 1fr; min-height: calc(100vh - 68px); }
.admin-list-pane { background: white; border-right: 1px solid var(--line); display: flex; flex-direction: column; overflow-y: auto; }
.admin-list-head { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.admin-list-head__title { font-family: var(--font-display); font-size: 22px; font-weight: 700; letter-spacing: -0.02em; display: flex; align-items: center; gap: 10px; }
.admin-badge { font-family: var(--font-mono); font-size: 12px; background: var(--accent-soft); color: var(--accent); padding: 3px 8px; border-radius: 999px; font-weight: 600; }
.admin-toast { background: var(--ok); color: white; font-size: 13px; text-align: center; padding: 10px; font-weight: 600; }
.admin-list { flex: 1; overflow-y: auto; }
.admin-empty { padding: 40px 24px; color: var(--ink-3); font-size: 14px; }
.admin-row { display: grid; grid-template-columns: 64px 1fr auto; gap: 14px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--line-2); transition: background .12s; }
.admin-row:hover { background: var(--bg-tint); }
.admin-row.is-editing { background: var(--accent-soft); border-left: 3px solid var(--accent); }
.admin-row__thumb { width: 64px; height: 44px; border-radius: 8px; overflow: hidden; background: var(--bg-tint); flex: 0 0 auto; }
.admin-row__thumb img { width: 100%; height: 100%; object-fit: cover; }
.admin-row__placeholder { width: 100%; height: 100%; background: linear-gradient(135deg,#0b3d91,#0989CE); }
.admin-row__title { font-weight: 600; font-size: 14.5px; color: var(--ink); margin-bottom: 4px; }
.admin-row__meta { display: flex; gap: 8px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); letter-spacing: 0.04em; align-items: center; }
.admin-row__cat { background: var(--accent-soft); color: var(--accent); padding: 2px 8px; border-radius: 6px; font-weight: 600; }
.admin-row__feat { background: #fef3c7; color: #92400e; padding: 2px 8px; border-radius: 6px; }
.admin-row__actions { display: flex; flex-direction: column; gap: 4px; }
.admin-row__btn { font: 500 12px var(--font-sans); color: var(--accent); background: none; border: 1px solid var(--accent-soft); padding: 5px 10px; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.admin-row__btn:hover { background: var(--accent-soft); }
.admin-row__btn--del { color: var(--err); border-color: color-mix(in oklab, var(--err) 20%, transparent); }
.admin-row__btn--del:hover { background: color-mix(in oklab, var(--err) 10%, transparent); }

.admin-editor { padding: 28px; overflow-y: auto; display: flex; flex-direction: column; gap: 18px; }
.admin-editor__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.admin-editor__head h3 { font-family: var(--font-display); font-size: 20px; font-weight: 600; letter-spacing: -0.01em; margin: 0; }
.admin-editor__close { font-size: 18px; color: var(--ink-3); background: var(--bg-tint); border: 0; border-radius: 50%; width: 32px; height: 32px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.admin-editor__close:hover { color: var(--ink); }
.admin-editor__foot { display: flex; justify-content: flex-end; gap: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
.admin-field { display: flex; flex-direction: column; gap: 6px; }
.admin-field label { font-size: 13px; font-weight: 600; color: var(--ink); }
.admin-field input, .admin-field select, .admin-field textarea { border: 1px solid var(--line); border-radius: 10px; background: var(--bg-tint); padding: 11px 14px; font: 500 14.5px var(--font-sans); color: var(--ink); outline: 0; transition: border-color .15s, box-shadow .15s; }
.admin-field input:focus, .admin-field select:focus, .admin-field textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: white; }
.admin-field textarea { resize: vertical; }
.admin-field--check { flex-direction: row; align-items: center; }
.admin-check { display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 14.5px; font-weight: 500; }
.admin-check input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--accent); cursor: pointer; }
.admin-row-fields { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.admin-img-picker { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.admin-img-preview { width: 80px; height: 56px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.admin-img-btn { cursor: pointer; font: 500 13px var(--font-sans); color: var(--accent); padding: 8px 14px; border: 1px solid var(--accent-soft); border-radius: 8px; background: var(--accent-soft); }
.admin-img-remove { font: 500 12px var(--font-sans); color: var(--err); background: none; border: 1px solid color-mix(in oklab,var(--err) 20%,transparent); border-radius: 6px; padding: 6px 10px; cursor: pointer; }

@media (max-width: 900px) {
  .blog-layout, .blog-post-layout { grid-template-columns: 1fr; }
  .blog-sidebar { position: static; }
  .blog-grid { grid-template-columns: 1fr; }
  .bpost--featured { flex-direction: column; }
  .bpost--featured .bpost__media { min-height: 220px; }
  .admin-body { grid-template-columns: 1fr; }
  .admin-editor { border-top: 1px solid var(--line); }
  .admin-row-fields { grid-template-columns: 1fr; }
}

/* ===== FAQ ===== */
.faq-layout {
  display: grid; grid-template-columns: 280px 1fr;
  gap: 48px; align-items: start;
}
.faq-aside { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 120px; }
.faq-aside__card {
  background: white; border: 1px solid var(--line);
  border-radius: 16px; padding: 24px;
  display: flex; flex-direction: column;
}
.faq-aside__card .btn { display: flex; }
.faq-aside__card--dark {
  background: linear-gradient(160deg, #062047 0%, #061b3d 100%);
  color: white; border-color: transparent;
}
.faq-aside__label {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--accent-soft-text); font-weight: 600; margin-bottom: 14px;
}
.faq-aside__links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.faq-aside__links a { color: rgba(255,255,255,0.75); font-size: 14px; transition: color .15s; }
.faq-aside__links a:hover { color: white; }

.faq-list { display: flex; flex-direction: column; gap: 0; }
.faq-item {
  border-bottom: 1px solid var(--line);
}
.faq-item:first-child { border-top: 1px solid var(--line); }
.faq-item__q {
  width: 100%; background: none; border: none; cursor: pointer;
  display: grid; grid-template-columns: 48px 1fr 32px;
  align-items: center; gap: 12px;
  padding: 20px 8px 20px 0;
  text-align: left;
  font-family: var(--font-sans);
  transition: background .12s;
}
.faq-item__q:hover { background: var(--bg-tint); }
.faq-item__num {
  font-family: var(--font-mono); font-size: 12px;
  color: var(--accent); font-weight: 600;
  width: 36px; height: 36px;
  border-radius: 10px; background: var(--accent-soft);
  display: flex; align-items: center; justify-content: center;
}
.faq-item.is-open .faq-item__num { background: var(--accent); color: white; }
.faq-item__text { font-size: 17px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.faq-item__icon { color: var(--ink-3); display: flex; transition: transform .25s; }
.faq-item.is-open .faq-item__icon { transform: rotate(180deg); color: var(--accent); }
.faq-item__a {
  padding: 0 8px 24px calc(48px + 12px);
  color: var(--ink-2); font-size: 15.5px; line-height: 1.65;
}
.faq-item__a p { margin: 0; }
.faq-item__link {
  display: inline-block; margin-top: 14px;
  color: var(--accent); font-weight: 500; font-size: 14px;
}
.faq-item__link:hover { text-decoration: underline; }

@media (max-width: 860px) {
  .faq-layout { grid-template-columns: 1fr; }
  .faq-aside { position: static; }
  .faq-aside__card--dark { order: 2; }
}

/* ===== Admin password gate ===== */
.gate {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(160deg, #062047 0%, #061b3d 100%);
  padding: 24px;
}
.gate__card {
  background: white; border-radius: 20px;
  padding: 40px 36px; width: 100%; max-width: 400px;
  box-shadow: 0 32px 80px rgba(0,0,0,0.35);
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  text-align: center;
}
.gate__logo { height: 56px; width: auto; margin-bottom: 8px; }
.gate__title { font-family: var(--font-display); font-size: 24px; font-weight: 700; letter-spacing: -0.02em; margin: 0; }
.gate__sub { color: var(--ink-2); font-size: 14.5px; margin: 6px 0 20px; }
.gate__form { width: 100%; display: flex; flex-direction: column; gap: 12px; }
.gate__input {
  width: 100%; border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 16px; font: 500 16px var(--font-sans); color: var(--ink);
  outline: 0; text-align: center; letter-spacing: 0.1em;
  background: var(--bg-tint);
  transition: border-color .15s, box-shadow .15s;
}
.gate__input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: white; }
.gate__input.is-error { border-color: var(--err); animation: gate-shake .3s ease; }
@keyframes gate-shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-6px)} 75%{transform:translateX(6px)} }
.gate__error { font-size: 13px; color: var(--err); }
.gate__back { margin-top: 20px; font-size: 13px; color: var(--ink-3); }
@media (max-width: 1080px) {
  .doc { grid-template-columns: 1fr; gap: 32px; }
  .doc__milestones { grid-template-columns: 1fr; }
  .ireg-grid { grid-template-columns: repeat(3, 1fr); }
  .req-grid { grid-template-columns: 1fr; gap: 32px; }
  .policy-lead { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .page-hero { padding: 72px 0 64px; }
  .page-section { padding: 64px 0; }
  .page-cta__inner { grid-template-columns: 1fr; }
  .mv-grid, .fn-grid, .step-grid, .grace-grid, .dl-grid {
    grid-template-columns: 1fr;
  }
  .ireg-grid { grid-template-columns: repeat(2, 1fr); }
  .reg-toolbar { grid-template-columns: 1fr; }
  .reg-row {
    grid-template-columns: 1fr; gap: 10px; padding: 18px;
  }
  .reg-row__cta { align-items: flex-start; }
  .contact-form__row { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .ireg-grid { grid-template-columns: 1fr; }
}