:root {
  color-scheme: light;
  --navy: #08376B;
  --navy-deep: #071a2f;
  --navy-mid: #0c2f52;
  --ink: #10233a;
  --muted: #44586c;
  --accent: #01B1EC;
  --accent-bright: #5AD4FF;
  --accent-deep: #0891C7;
  --ice: #e7f7fd;
  --sand: #f3f6f9;
  --line: #c9d7e4;
  --line-strong: #08376B;
  --ok: #0d6b45;
  --focus: #0b57d0;
  --bg: #f7fafc;
  --surface: #ffffff;
  --header-bg: rgba(247, 250, 252, 0.92);
  --footer-bg: linear-gradient(180deg, #0a1a2c 0%, #07131f 55%, #050d16 100%);
  --radius: 14px;
  --pill: 999px;
  --shadow: 0 18px 50px rgba(8, 55, 107, 0.14);
  --font: "Source Sans 3", "Segoe UI", sans-serif;
  --display: "Sora", "Source Sans 3", sans-serif;
  --max: 1140px;
  --header-h: 4.4rem;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --navy: #8fdfff;
  --navy-deep: #04101d;
  --navy-mid: #0c2f52;
  --ink: #e8f1f8;
  --muted: #b9c9d8;
  --accent: #5AD4FF;
  --accent-bright: #9ae6ff;
  --accent-deep: #01B1EC;
  --ice: #102538;
  --sand: #0c1a28;
  --line: #2a4258;
  --line-strong: #5AD4FF;
  --ok: #3ecf8e;
  --focus: #5AD4FF;
  --bg: #07131f;
  --surface: #0d1e2e;
  --header-bg: rgba(7, 19, 31, 0.92);
  --footer-bg: linear-gradient(180deg, #050d16 0%, #07131f 60%, #04101d 100%);
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}



*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .reveal { opacity: 1 !important; transform: none !important; }
  .nitd-mark-body { opacity: 1 !important; transform: none !important; filter: none !important; animation: none !important; }
  .hero-mark .nitd-mark { animation: none !important; }
  .watch-mesh .wm-moving { display: none !important; }
  .watch-mesh .wm-ring, .watch-mesh .wm-core, .watch-mesh .wm-risk { animation: none !important; }
}

body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background: var(--bg);
  line-height: 1.65;
  font-size: 1.0625rem;
}

img { max-width: 100%; height: auto; }
a { color: var(--accent); }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

.skip-link {
  position: absolute; left: 1rem; top: -120px; z-index: 1000;
  background: var(--navy); color: #fff; padding: .75rem 1rem;
  border-radius: 8px; text-decoration: none; font-weight: 700;
}
.skip-link:focus { top: 1rem; }

.container { width: min(100% - 2rem, var(--max)); margin-inline: auto; }

.site-header {
  position: sticky; top: 0; z-index: 60;
  background: var(--header-bg);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(201, 215, 228, 0.7);
}
html[data-theme="dark"] .site-header {
  border-bottom-color: rgba(42, 66, 88, 0.8);
}

.header-inner {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  min-height: var(--header-h);
  gap: 1rem;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  text-decoration: none;
  color: var(--navy);
  font-weight: 700;
  flex: 0 0 auto;
}
.brand-logo {
  height: 2.75rem;
  width: auto;
  max-width: min(52vw, 220px);
  display: block;
  object-fit: contain;
}
.brand-logo--dark { display: none; }
.brand-logo--light { display: block; }
html[data-theme="dark"] .brand-logo--light { display: none; }
html[data-theme="dark"] .brand-logo--dark { display: block; }


.brand--footer .brand-logo {
  display: block;
  height: 3rem;
  max-width: 240px;
}
.brand-mark {
  display: inline-flex; width: 42px; height: 48px; color: #071a2f; flex-shrink: 0;
}
.brand-mark .nitd-mark-svg { width: 100%; height: 100%; display: block; }
.brand-text { display: flex; flex-direction: column; line-height: 1.1; font-family: var(--display); }
.brand-text small { font-weight: 600; color: var(--muted); font-size: .78rem; font-family: var(--font); }


.nitd-mark-svg { width: 100%; height: 100%; display: block; }
.nitd-mark-body {
  opacity: 0;
  transform-origin: center;
  transform: scale(.88);
  transform-box: fill-box;
}
.nitd-mark.is-drawn .nitd-mark-body {
  animation: nitd-mark-in .9s cubic-bezier(.2,.7,.2,1) forwards, nitd-mark-glow 3.2s ease-in-out 1s infinite;
}

@keyframes nitd-mark-in {
  to { opacity: 1; transform: scale(1); }
}
@keyframes nitd-mark-glow {
  0%, 100% { filter: drop-shadow(0 0 0 rgba(1,177,236,0)); }
  50% { filter: drop-shadow(0 0 14px rgba(1,177,236,.55)); }
}
@keyframes nitd-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

.hero-mark {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 300px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(1,177,236,.18);
  background:
    radial-gradient(ellipse at 50% 35%, rgba(1,177,236,.32), transparent 58%),
    linear-gradient(160deg, #04101d 0%, #08376B 52%, #062a52 100%);
}
.hero-mark::before {
  content: "";
  position: absolute; inset: 0;
  background:
    url("/assets/brand/pattern-circuit-dark.png") center / cover no-repeat;
  opacity: .42;
  mix-blend-mode: screen;
  mask-image: radial-gradient(ellipse at center, #000 40%, transparent 78%);
  pointer-events: none;
}
.hero-mark::after {
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(1,177,236,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(1,177,236,.07) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 72%);
  pointer-events: none;
}
.hero-mark .nitd-mark {
  width: min(58%, 220px);
  height: auto;
  aspect-ratio: 1 / 1;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 0 28px rgba(1,177,236,.4));
  animation: nitd-float 6.5s ease-in-out infinite;
}
.hero-mark:hover .nitd-mark-body {
  animation-duration: .9s, 1.6s;
}

.nav-toggle {
  display: none;
  border: 2px solid var(--line-strong);
  background: var(--surface);
  color: var(--navy);
  border-radius: 8px;
  padding: .55rem .85rem;
  min-height: 2.75rem;
  min-width: 2.75rem;
  font: inherit;
  font-weight: 700;
}
.nav-toggle:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.site-nav {
  display: flex;
  align-items: center;
  gap: .15rem;
  flex: 0 1 auto;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.site-nav a {
  text-decoration: none; color: var(--navy); font-weight: 650;
  padding: .5rem .65rem; border-radius: 8px;
  white-space: nowrap;
}
.site-nav a:hover, .site-nav a[aria-current="page"] { background: var(--ice); }
.site-nav a.btn-primary {
  color: #fff;
  padding: .6rem 1.05rem;
}
.site-nav a.btn-primary:hover {
  background: #062a52;
  color: #fff;
}

.sc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.1rem;
}
.sc-card {
  display: block;
  text-decoration: none;
  color: inherit;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.25rem 1.2rem;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.sc-card:hover {
  transform: translateY(-3px);
  border-color: rgba(1,177,236,.45);
  box-shadow: 0 16px 36px rgba(8,55,107,.12);
  text-decoration: none;
}
.sc-card h2 {
  margin: .35rem 0 .45rem;
  font-family: var(--display);
  font-size: 1.15rem;
  color: var(--navy);
}
.sc-card p { margin: 0; color: var(--muted); font-size: .95rem; }
.sc-tag {
  display: inline-block;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--accent-deep);
  background: var(--ice);
  border-radius: 999px;
  padding: .2rem .55rem;
}
.nis2-form { text-align: left; max-width: 40rem; margin-inline: auto; }
.nis2-q {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .9rem 1rem 1rem;
  margin: 0 0 .85rem;
  background: var(--surface);
}
.nis2-q legend {
  font-weight: 750;
  color: var(--navy);
  padding: 0 .25rem;
}
.nis2-option {
  display: flex;
  gap: .55rem;
  align-items: flex-start;
  font-weight: 600;
  color: var(--ink);
  margin: .45rem 0 0;
  cursor: pointer;
}
@media (max-width: 960px) {
  .sc-grid { grid-template-columns: 1fr; }
}


.price-hero {
  margin: 1.5rem auto 1.25rem;
  text-align: center;
}
.price-hero-amount {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(2.4rem, 5vw, 3.4rem);
  font-weight: 700;
  color: var(--navy);
  line-height: 1;
}
.price-hero-amount span {
  font-size: .45em;
  font-weight: 650;
  color: var(--muted);
  margin-left: .2rem;
}
.price-hero-note {
  margin: .55rem 0 0;
  color: var(--muted);
  font-size: .95rem;
}
.price-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.price-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1rem;
  min-width: 32rem;
}
.price-table th,
.price-table td {
  padding: .85rem 1.1rem;
  text-align: left;
  border-bottom: 1px solid var(--line);
}
.price-table th {
  background: var(--ice);
  color: var(--navy);
  font-family: var(--display);
  font-weight: 700;
  font-size: .92rem;
}
.price-table tbody tr:last-child td { border-bottom: 0; }
.price-table td:not(:first-child) {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: var(--ink);
}
.plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
  align-items: stretch;
}
.plan-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1.4rem 1.25rem 1.5rem;
  display: flex;
  flex-direction: column;
}
.plan-card--featured {
  border-color: rgba(1,177,236,.55);
  box-shadow: 0 0 0 1px rgba(1,177,236,.2), var(--shadow);
}
.plan-tier {
  margin: 0 0 .35rem;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--accent-deep);
}
.plan-card h3 {
  margin: 0 0 .5rem;
  font-family: var(--display);
  font-size: 1.25rem;
  color: var(--navy);
}
.plan-price {
  margin: 0 0 1rem;
  font-family: var(--display);
  font-size: 1.85rem;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.1;
}
.plan-price span {
  font-size: .55em;
  font-weight: 650;
  color: var(--muted);
}
.plan-card ul {
  margin: 0 0 1.1rem;
  padding: 0 0 0 1.1rem;
  color: var(--muted);
  flex: 1;
}
.plan-card li { margin: .35rem 0; }
.plan-fit {
  margin: 0;
  font-size: .92rem;
  color: var(--ink);
  padding-top: .85rem;
  border-top: 1px solid var(--line);
}
html[data-theme="dark"] .price-table th {
  background: var(--ice);
  color: var(--accent-bright);
}
html[data-theme="dark"] .plan-card h3 {
  color: var(--accent-bright);
}
@media (max-width: 960px) {
  .plan-grid { grid-template-columns: 1fr; }
}

.plan-cta {
  width: 100%;
  margin-top: 1rem;
}
.plan-grid--featured-solo {
  grid-template-columns: 1.15fr .85fr;
  max-width: 52rem;
  margin-inline: auto;
}
.price-jump {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  justify-content: center;
  margin-top: 1.5rem;
}
.price-jump a {
  display: inline-flex;
  align-items: center;
  min-height: 2.4rem;
  padding: .35rem .95rem;
  border-radius: var(--pill);
  border: 1px solid var(--line-strong);
  background: var(--surface);
  color: var(--ink);
  text-decoration: none;
  font-weight: 700;
  font-size: .92rem;
}
.price-jump a:hover {
  border-color: var(--accent);
  color: var(--navy);
}
.price-note {
  text-align: center;
  margin-top: 1.25rem;
}
.tld-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.tld-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.15rem 1rem;
  text-align: center;
}
.tld-card h3 {
  margin: 0 0 .45rem;
  font-family: var(--display);
  font-size: 1.45rem;
  color: var(--navy);
}
.tld-price {
  margin: 0;
  font-family: var(--display);
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--ink);
}
.tld-price span {
  font-size: .55em;
  font-weight: 650;
  color: var(--muted);
}
.tld-renew {
  margin: .4rem 0 0;
  color: var(--muted);
  font-size: .9rem;
}
.trust-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  text-align: center;
}
.trust-strip strong {
  display: block;
  font-family: var(--display);
  font-size: 1.05rem;
  color: var(--navy);
  margin-bottom: .25rem;
}
.trust-strip span {
  color: var(--muted);
  font-size: .92rem;
}
html[data-theme="dark"] .tld-card h3,
html[data-theme="dark"] .trust-strip strong {
  color: var(--accent-bright);
}
html[data-theme="dark"] .price-jump a {
  background: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}
@media (max-width: 960px) {
  .plan-grid--featured-solo,
  .tld-grid,
  .trust-strip {
    grid-template-columns: 1fr;
  }
}

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  min-height: 2.9rem; padding: .7rem 1.3rem; border-radius: var(--pill);
  font: inherit; font-weight: 750; text-decoration: none; border: 2px solid transparent; cursor: pointer;
}
.btn-primary {
  background: #08376B;
  color: #fff;
  border-color: #08376B;
}
.btn-primary:hover { background: #062a52; color: #fff; }
html[data-theme="dark"] .btn-primary {
  background: #0e5a96;
  border-color: #0e5a96;
}
html[data-theme="dark"] .btn-primary:hover {
  background: #1470b8;
}

.btn-secondary {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--line-strong);
}
.btn-secondary:hover { background: var(--ice); }
.btn-light { background: #fff; color: #08376B; border-color: #fff; }
.btn-outline-dark {
  background: transparent;
  color: var(--ink);
  border-color: var(--line-strong);
}
.btn-outline-dark:hover { background: var(--ice); }
.hero .btn-secondary {
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,.55);
}
.hero .btn-secondary:hover { background: rgba(255,255,255,.1); }
.btn-group { display: flex; flex-wrap: wrap; gap: .75rem; }


.hero {
  position: relative; overflow: hidden; color: #fff;
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(58,160,217,.35), transparent 55%),
    radial-gradient(900px 450px at 10% 110%, rgba(31,126,181,.28), transparent 50%),
    linear-gradient(145deg, #04101d 0%, #0c2f52 48%, #123a63 100%);
  padding: 5.5rem 0 4.5rem;
}
.hero::before {
  content: ""; position: absolute; inset: 0; opacity: .22; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
}
.hero-grid {
  position: relative; display: grid; grid-template-columns: 1.25fr .85fr;
  gap: 2rem; align-items: center;
}
.hero h1 {
  margin: 0 0 1rem; font-family: var(--display); font-weight: 700;
  font-size: clamp(2.15rem, 4.4vw, 3.35rem); line-height: 1.12; max-width: 14ch;
}
.hero .lead { color: rgba(255,255,255,.86); max-width: 38rem; margin: 0 0 1.6rem; font-size: 1.15rem; }
.eyebrow {
  display: inline-flex; align-items: center; gap: .5rem; margin-bottom: 1rem;
  padding: .35rem .8rem; border-radius: var(--pill);
  background: var(--ice);
  border: 1px solid var(--line);
  color: var(--ink);
  font-weight: 700; font-size: .9rem; letter-spacing: .02em;
}
.hero .eyebrow {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
  color: #d7ecf8;
}
.badge {
  display: inline-flex;
  background: #08376B;
  color: #fff;
  border-radius: var(--pill);
  padding: .35rem .85rem;
  font-size: .875rem;
  font-weight: 700;
}
html[data-theme="dark"] .badge {
  background: #0e5a96;
  color: #fff;
}

.hero-panel {
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16);
  border-radius: 20px; padding: 1.4rem; backdrop-filter: blur(8px);
}
.hero-panel h2 { margin: 0 0 .9rem; font-size: 1rem; font-family: var(--display); color: #fff; }
.stat-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .85rem; }
.stat-list li {
  display: grid; grid-template-columns: auto 1fr; gap: .75rem; align-items: start;
  color: rgba(255,255,255,.9);
}
.stat-list strong { display: block; color: #fff; font-family: var(--display); }
.dot {
  width: .7rem; height: .7rem; margin-top: .45rem; border-radius: 50%;
  background: var(--accent-bright); box-shadow: 0 0 0 4px rgba(58,160,217,.2);
}

.section { padding: 4.2rem 0; }
.section-dark {
  
  background:
    radial-gradient(900px 320px at 50% -10%, rgba(1,177,236,.22), transparent 55%),
    linear-gradient(165deg, #062a52 0%, #08376B 48%, #071a2f 100%);
  color: #fff;
}
.section-dark h2, .section-dark h3 { color: #fff; }
.section-dark p, .section-dark li { color: rgba(255,255,255,.82); }
.section-soft { background: var(--sand); }
.section-head { max-width: 44rem; margin: 0 auto 2.5rem; text-align: center; }
.section-head h2 {
  margin: 0 0 .75rem; font-family: var(--display); color: var(--navy);
  font-size: clamp(1.65rem, 3vw, 2.25rem); line-height: 1.2;
}
.section-head p { margin: 0; color: var(--muted); font-size: 1.08rem; }
.section-dark .section-head h2 { color: #fff; }
.section-dark .section-head p { color: rgba(255,255,255,.78); }

.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; }

.card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.35rem; transition: transform .25s ease, box-shadow .25s ease;
}
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.card h3 {
  margin: .85rem 0 .45rem; color: var(--navy); font-family: var(--display);
  font-size: 1.12rem;
}
.card p { margin: 0; color: var(--muted); }
.card a.more {
  display: inline-block; margin-top: .9rem; font-weight: 700; text-decoration: none; color: var(--accent);
}
.card .btn { margin-top: 1rem; }
.icon-circle {
  width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center;
  background: var(--ice); color: var(--accent);
}
.icon-circle svg {
  width: 1.35rem; height: 1.35rem; fill: none; stroke: currentColor;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}

.partners {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem 1rem;
  margin-top: 1.25rem;
}
.partner-chip {
  border: 1px solid var(--line); background: var(--surface); color: var(--navy);
  border-radius: var(--pill); padding: .55rem 1rem; font-weight: 750;
  font-family: var(--display); font-size: .92rem;
}

.process-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; counter-reset: step; }
.process-steps article {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.25rem;
}
.section-dark .process-steps article {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
}
.process-steps article::before {
  counter-increment: step; content: counter(step);
  display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%;
  background: var(--accent-bright); color: #04101d; font-weight: 800; margin-bottom: .8rem;
}
.process-steps h3 { margin: 0 0 .4rem; font-size: 1.05rem; font-family: var(--display); color: var(--navy); }
.process-steps p { margin: 0; font-size: .98rem; color: var(--muted); }
.section-dark .process-steps h3,
.section-dark .process-steps p { color: #fff; }
.section-dark .process-steps p { color: rgba(255,255,255,.84); }

.split { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1.5rem; align-items: stretch; }
.check-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .85rem; }
.check-list li {
  display: flex; gap: .65rem; align-items: flex-start; color: var(--ink);
}
.check-list li::before {
  content: ""; flex: 0 0 1.35rem; width: 1.35rem; height: 1.35rem; margin-top: .15rem; border-radius: 50%;
  background: var(--ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center / .85rem no-repeat;
}
.highlight-panel {
  background: linear-gradient(160deg, #0c2f52, #123a63); color: #fff;
  border-radius: 18px; padding: 1.6rem; border: 1px solid rgba(255,255,255,.12);
}
.highlight-panel h3 { margin: .6rem 0 .5rem; color: #fff; font-family: var(--display); }
.highlight-panel p { margin: 0; color: rgba(255,255,255,.85); }

.cta-band {
  border-radius: 22px; padding: 2.6rem 1.6rem; text-align: center;
  background:
    radial-gradient(700px 240px at 50% 0%, rgba(58,160,217,.25), transparent 60%),
    linear-gradient(135deg, #071a2f, #0c2f52);
  color: #fff; box-shadow: var(--shadow);
}
.cta-band h2 { margin: 0 0 .7rem; font-family: var(--display); font-size: clamp(1.5rem, 3vw, 2rem); }
.cta-band p { margin: 0 auto 1.4rem; max-width: 38rem; color: rgba(255,255,255,.84); }
.cta-band .btn-group { justify-content: center; }
.sc-tool-stack {
  width: min(100%, 28rem);
  margin: 1.1rem auto 0;
  display: grid;
  gap: .85rem;
  text-align: center;
}
.sc-tool-form.score-form,
.sc-tool-stack .score-form {
  width: 100%;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: .85rem;
}
.sc-tool-form .btn[type="submit"],
.sc-tool-stack .btn[type="submit"] {
  width: 100%;
}
.sc-tool-form .btn[type="submit"]:disabled,
.sc-tool-stack .btn[type="submit"]:disabled,
.sc-tool-form .btn[type="submit"].is-guard-blocked,
.sc-tool-stack .btn[type="submit"].is-guard-blocked {
  opacity: 0.42;
  cursor: not-allowed;
  filter: grayscale(0.35);
  box-shadow: none;
}
.sc-guard {
  width: 100%;
  margin: 0;
  grid-column: 1 / -1;
  display: grid;
  gap: .7rem;
  text-align: left;
}
.sc-guard-ack {
  display: flex;
  gap: .65rem;
  align-items: flex-start;
  margin: 0;
  padding: 0 .15rem;
  color: var(--muted);
  font-weight: 500;
  font-size: .92rem;
  line-height: 1.45;
  cursor: pointer;
}
.sc-guard-ack span { color: var(--muted); }
.sc-guard-ack input {
  margin-top: .2rem;
  width: 1.05rem;
  height: 1.05rem;
  flex: 0 0 auto;
  accent-color: #08376B;
}
.sc-guard-msg {
  margin: 0;
  min-height: 1.35em;
  font-size: .92rem;
  font-weight: 600;
  color: var(--muted);
  text-align: center;
}
.sc-guard[data-ready="false"] .sc-guard-msg {
  color: var(--ink);
}
.sc-guard-msg:empty { display: none; }
html[data-theme="dark"] .sc-guard-ack,
html[data-theme="dark"] .sc-guard-ack span,
html[data-theme="dark"] .sc-guard-msg {
  color: rgba(255, 255, 255, 0.72);
}

.team-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.2rem;
}
.team-card {
  flex: 1 1 calc((100% - 2.4rem) / 3);
  max-width: calc((100% - 2.4rem) / 3);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.25rem;
}
.avatar {
  width: 4.4rem; height: 4.4rem; border-radius: 50%; display: grid; place-items: center;
  background: linear-gradient(145deg, #0c2f52, #1f7eb5); color: #fff;
  font-weight: 800; font-family: var(--display); margin-bottom: .85rem;
}
.team-card h3 { margin: 0; color: var(--navy); font-family: var(--display); font-size: 1.08rem; }
.role { color: var(--accent); font-weight: 700; margin: .2rem 0 .65rem; }
.team-card p { margin: 0; color: var(--muted); font-size: .95rem; line-height: 1.55; }

.page-hero {
  position: relative;
  padding: 3.8rem 0 2.5rem;
  overflow: hidden;
  background:
    radial-gradient(720px 280px at 50% -10%, rgba(1, 177, 236, 0.14), transparent 70%),
    linear-gradient(180deg, var(--sand), var(--bg));
  border-bottom: 1px solid var(--line);
}
.page-hero.centered { text-align: center; }
.page-hero h1 {
  margin: .75rem 0 1rem; color: var(--navy); font-family: var(--display);
  font-size: clamp(2rem, 4vw, 3rem); line-height: 1.15;
}
.page-hero .lead { color: var(--muted); max-width: 44rem; }
.page-hero.centered .lead { margin-inline: auto; }
.page-hero.centered .badge { display: inline-flex; }
.page-hero.centered .btn-group { justify-content: center; }
.page-hero.centered .trust-row { justify-content: center; }
.page-hero.centered .sc-back { margin: 0 0 .5rem; }
.page-hero.centered .sc-status { text-align: center; min-height: 1.4em; }
html[data-theme="dark"] .page-hero {
  background:
    radial-gradient(720px 280px at 50% -10%, rgba(1, 177, 236, 0.18), transparent 70%),
    linear-gradient(180deg, #0a1a2c, var(--bg));
  border-bottom-color: var(--line);
}
.trust-row {
  display: flex; flex-wrap: wrap; gap: 1rem 1.4rem; margin-top: 1.4rem;
  color: var(--muted); font-weight: 650;
}
.trust-row span { display: inline-flex; align-items: center; gap: .4rem; }
.trust-row span::before { content: "✓"; color: var(--ok); font-weight: 800; }

.prose { max-width: 48rem; }
.prose h1, .prose h2, .prose h3 { color: var(--navy); font-family: var(--display); }
.prose p, .prose li { color: var(--muted); }
.prose--wide { max-width: 52rem; margin-inline: auto; }
.insight-prose h2 { margin-top: 2rem; font-size: 1.35rem; }
.insight-prose h2:first-child { margin-top: 0; }
.insight-prose ol, .insight-prose ul { margin: 0 0 1.1rem; padding-left: 1.2rem; }
.insight-prose li { margin: .35rem 0; }
.insight-prose a { color: var(--accent-deep); font-weight: 650; }
.insight-prose .hint { margin-top: 1.5rem; font-size: .95rem; }
.insight-related { max-width: 52rem; margin-inline: auto; }
.insight-related h2 {
  margin: 0 0 .75rem;
  font-family: var(--display);
  color: var(--navy);
  font-size: 1.35rem;
}
.insight-card h2 { font-size: 1.08rem; line-height: 1.35; }

.legal-stack { display: grid; gap: .65rem; }
.legal-item {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
}
.legal-item summary {
  cursor: pointer;
  padding: 1.05rem 1.2rem;
  font-weight: 700;
  font-family: var(--display);
  color: var(--navy);
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.legal-item summary::-webkit-details-marker { display: none; }
.legal-item summary::after {
  content: "";
  width: .55rem; height: .55rem;
  border-right: 2px solid var(--accent);
  border-bottom: 2px solid var(--accent);
  transform: rotate(45deg);
  flex-shrink: 0;
  margin-top: -.2rem;
  transition: transform .2s ease;
}
.legal-item[open] summary::after { transform: rotate(225deg); margin-top: .2rem; }
.legal-item summary:hover { color: var(--accent-deep); }
.legal-item summary:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
}
.legal-item .legal-body {
  padding: 0 1.2rem 1.2rem;
  border-top: 1px solid var(--line);
}
.legal-item .legal-body > *:first-child { margin-top: 1rem; }
.legal-item .legal-body h3 {
  margin: 1.15rem 0 .4rem;
  font-size: 1.02rem;
  color: var(--navy);
  font-family: var(--display);
}
.legal-item .legal-body p,
.legal-item .legal-body li { color: var(--muted); }
.legal-item .legal-body ul { margin: 0 0 1rem; padding-left: 1.15rem; }
.legal-item .legal-body a { color: var(--accent-deep); }

.legal-note {
  background: var(--ice);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .9rem 1rem;
  color: var(--ink);
  margin: 1rem 0 0;
}
.legal-note p { margin: 0; color: var(--ink); }
.legal-note p + p { margin-top: .55rem; }

.legal-standalone {
  display: grid;
  gap: 1.25rem;
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--line);
}
.legal-standalone-intro {
  margin: 0;
  color: var(--muted);
  font-size: .98rem;
}
.legal-standalone-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1.35rem 1.4rem 1.45rem;
}
.legal-standalone-card h2 {
  margin: .45rem 0 .85rem;
  font-family: var(--display);
  color: var(--navy);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
}
.legal-standalone-card h3 {
  margin: 1.15rem 0 .45rem;
  font-size: 1.02rem;
  font-family: var(--display);
  color: var(--navy);
}
.legal-standalone-card p,
.legal-standalone-card li { color: var(--muted); margin: 0 0 .85rem; }
.legal-standalone-card p:last-child { margin-bottom: 0; }
.legal-standalone-card ul { margin: 0 0 1rem; padding-left: 1.15rem; }
.legal-standalone-card a { color: var(--accent-deep); }

.legal-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.4rem 1.35rem;
}
.legal-panel h2, .legal-panel h3 {
  margin: 0 0 .55rem;
  font-family: var(--display);
  color: var(--navy);
  font-size: 1.15rem;
}
.legal-panel p, .legal-panel li { color: var(--muted); }
.legal-panel ul { margin: .4rem 0 0; padding-left: 1.15rem; }

.legal-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
}

.page-hero.centered .dmarc-builder { text-align: left; }
.dmarc-builder {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  align-items: start;
  max-width: 64rem;
  margin: 1.45rem auto 0;
}
.dmarc-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1.25rem 1.3rem;
}
.dmarc-panel h2 {
  margin: 0 0 .85rem;
  font-family: var(--display);
  color: var(--navy);
  font-size: 1.12rem;
}
.dmarc-check-lead {
  margin: 0 0 1rem;
  color: var(--ink);
  font-size: 1rem;
}
.dmarc-panel-check .sc-current { margin-top: 1rem; }
.dmarc-field {
  display: grid;
  gap: .35rem;
  margin: 0 0 .9rem;
}
.dmarc-field label {
  font-weight: 700;
  color: var(--navy);
}
.dmarc-field input[type="text"],
.dmarc-field input[type="email"],
.dmarc-field select {
  font: inherit;
  padding: .75rem .9rem;
  border: 2px solid var(--line);
  border-radius: 12px;
  background: var(--bg);
  color: var(--ink);
  min-width: 0;
}
.dmarc-field input[type="range"] {
  width: 100%;
  accent-color: var(--accent);
}
.dmarc-field .hint {
  font-weight: 500;
  color: var(--muted);
  font-size: .9rem;
}
.dmarc-seg { border: 0; margin: 0 0 1rem; padding: 0; }
.dmarc-seg legend {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: .5rem;
}
.dmarc-seg-opts {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: .5rem;
}
.dmarc-seg-opts label {
  display: grid;
  gap: .15rem;
  margin: 0;
  padding: .7rem .55rem;
  text-align: center;
  border: 2px solid var(--line);
  border-radius: 12px;
  background: var(--bg);
  color: var(--ink);
  cursor: pointer;
  font-weight: 700;
}
.dmarc-seg-opts label small {
  font-weight: 600;
  color: var(--muted);
  font-size: .78rem;
}
.dmarc-seg-opts input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.dmarc-seg-opts label:has(input:checked) {
  border-color: var(--accent-deep);
  background: var(--ice);
  color: var(--navy);
}
.dmarc-seg-opts label:focus-within {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}
.dmarc-adv {
  margin: .15rem 0 .25rem;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.dmarc-adv summary {
  cursor: pointer;
  padding: .75rem .9rem;
  font-weight: 700;
  color: var(--navy);
}
.dmarc-adv .dmarc-adv-body { padding: 0 .9rem .9rem; }
.dmarc-k {
  margin: 0 0 .3rem;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted);
}
.dmarc-mono {
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: .95rem;
  background: var(--ice);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .8rem .95rem;
  word-break: break-all;
}
.dmarc-out { display: grid; gap: .85rem; }
.dmarc-copy-row {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
}
.dmarc-copy-row [data-dmarc-copy-status] {
  margin: 0;
  min-height: 1.3em;
}
.dmarc-warn {
  display: none;
  padding: .75rem .9rem;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--sand);
  color: var(--ink);
  font-size: .95rem;
}
.dmarc-warn.is-on { display: block; }
.dmarc-explain { display: grid; gap: .55rem; margin: 0; }
.dmarc-explain > div {
  padding: .65rem .8rem;
  border-left: 3px solid var(--accent);
  background: var(--ice);
  border-radius: 0 10px 10px 0;
}
.dmarc-explain dt {
  font-family: ui-monospace, Consolas, monospace;
  font-weight: 700;
  color: var(--navy);
}
.dmarc-explain dd {
  margin: .2rem 0 0;
  color: var(--muted);
  font-size: .95rem;
}
html[data-theme="dark"] .dmarc-field label,
html[data-theme="dark"] .dmarc-seg legend,
html[data-theme="dark"] .dmarc-adv summary,
html[data-theme="dark"] .dmarc-panel h2,
html[data-theme="dark"] .dmarc-explain dt {
  color: var(--accent-bright);
}
html[data-theme="dark"] .dmarc-field input[type="text"],
html[data-theme="dark"] .dmarc-field input[type="email"],
html[data-theme="dark"] .dmarc-field select {
  background: var(--navy-deep);
  color: var(--ink);
  border-color: var(--line);
}

.spf-mech-list { display: grid; gap: .55rem; margin: 0 0 .85rem; }
.spf-mech-row {
  display: grid;
  grid-template-columns: 7.5rem 1fr auto;
  gap: .45rem;
  align-items: center;
}
.spf-mech-row select,
.spf-mech-row input {
  font: inherit;
  padding: .65rem .75rem;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: var(--bg);
  color: var(--ink);
  min-width: 0;
}
.spf-mech-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: 0 0 .85rem;
}
.spf-mech-actions .btn { padding: .45rem .75rem; font-size: .92rem; }
.spf-lookup {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .35rem .65rem;
  border-radius: var(--pill);
  font-size: .88rem;
  font-weight: 700;
  border: 1px solid var(--line);
  background: var(--ice);
  color: var(--ink);
}
.spf-lookup.is-warn {
  background: rgba(240, 179, 90, 0.22);
  border-color: rgba(240, 179, 90, 0.45);
  color: var(--ink);
}
.sc-fetch-note {
  margin: .25rem 0 0;
  font-size: .92rem;
  color: var(--muted);
}
.sc-fetch-note code { color: var(--ink); }
.sc-current {
  display: grid;
  gap: .9rem;
  padding-top: .3rem;
}
.sc-current-card {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: .9rem 1rem;
}
.sc-current-head {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: center;
  margin-bottom: .45rem;
}
.sc-current-head h3 {
  margin: 0;
  color: var(--navy);
  font-family: var(--display);
  font-size: 1rem;
}
.sc-current-card p {
  margin: .35rem 0 0;
  color: var(--muted);
}
.sc-current-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  align-items: center;
}
html[data-theme="dark"] .sc-current-head h3,
html[data-theme="dark"] .sc-fetch-note code {
  color: var(--accent-bright);
}
html[data-theme="dark"] .spf-mech-row select,
html[data-theme="dark"] .spf-mech-row input {
  background: var(--navy-deep);
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="dark"] .spf-lookup.is-warn {
  background: rgba(240, 179, 90, 0.16);
  color: var(--ink);
}

.table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  margin: 1rem 0;
}
.sla-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 36rem;
}
.sla-table th, .sla-table td {
  padding: .75rem .9rem;
  text-align: left;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: .95rem;
  vertical-align: top;
}
.sla-table th {
  font-family: var(--display);
  color: var(--navy);
  font-weight: 700;
  background: var(--ice);
}
.sla-table tr:last-child td { border-bottom: 0; }
.sla-table td .hint { display: block; color: var(--muted); font-size: .86rem; margin-top: .2rem; }

.prio {
  display: inline-block;
  font-weight: 800;
  font-size: .78rem;
  letter-spacing: .04em;
  border-radius: 999px;
  padding: .18rem .5rem;
}
.prio-1 { background: rgba(185, 28, 28, .12); color: #9b1c1c; }
.prio-2 { background: rgba(180, 83, 9, .14); color: #9a3412; }
.prio-3 { background: rgba(8, 55, 107, .1); color: var(--navy); }
.prio-4 { background: rgba(13, 107, 69, .12); color: var(--ok); }
html[data-theme="dark"] .prio-1 { background: rgba(248, 113, 113, .16); color: #fecaca; }
html[data-theme="dark"] .prio-2 { background: rgba(251, 191, 36, .16); color: #fde68a; }
html[data-theme="dark"] .sla-table th { background: var(--sand); }

.about-split-copy p { margin: 0 0 .9rem; }
.about-split-copy p:last-child { margin-bottom: 0; }
.about-split-copy .btn-group { margin-top: 1.15rem; }

.watch-figure { margin: 0; }
.watch-mesh-panel {
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(1,177,236,.18);
  background:
    radial-gradient(ellipse at 48% 42%, rgba(1,177,236,.22), transparent 55%),
    linear-gradient(160deg, #04101d 0%, #08376B 55%, #062a52 100%);
}
.watch-mesh { display: block; width: 100%; height: auto; }

@keyframes wm-glow {
  0%, 100% { filter: drop-shadow(0 0 4px rgba(90,212,255,.35)); }
  50% { filter: drop-shadow(0 0 12px rgba(90,212,255,.85)); }
}
@keyframes wm-ring {
  0% { opacity: .55; transform: scale(.92); }
  70% { opacity: 0; transform: scale(1.35); }
  100% { opacity: 0; transform: scale(.92); }
}
@keyframes wm-risk {
  0%, 100% { fill: #e8a317; }
  50% { fill: #ffd27a; }
}
.watch-mesh .wm-core { animation: wm-glow 3.2s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.watch-mesh .wm-ring {
  transform-box: fill-box;
  transform-origin: center;
  animation: wm-ring 3.6s ease-out infinite;
}
.watch-mesh .wm-ring-2 { animation-delay: 1.2s; }
.watch-mesh .wm-risk { animation: wm-risk 1.8s ease-in-out infinite; }

.card-icon {
  width: 2.6rem; height: 2.6rem; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--ice); color: var(--accent-deep);
  border: 1px solid var(--line);
}
.card-icon svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.card .card-icon { margin-bottom: .15rem; }
.card h3 { margin-top: .7rem; }

.form { display: grid; gap: 1rem; max-width: 36rem; }
.form label { display: grid; gap: .35rem; font-weight: 700; color: var(--navy); }
.form input, .form textarea, .form select {
  font: inherit; padding: .75rem .9rem; border: 2px solid var(--line);
  border-radius: 10px; color: var(--ink); background: var(--surface);
}
.form .hint { font-weight: 500; color: var(--muted); font-size: .92rem; }
.form .error { color: #9b1c1c; font-weight: 650; font-size: .92rem; }

.site-footer {
  background: var(--footer-bg);
  color: rgba(255,255,255,.78);
  padding: 3.25rem 0 0;
  margin-top: 0;
  border-top: 1px solid rgba(1,177,236,.12);
}
.site-footer .brand { color: #fff; }
.site-footer .brand-text small { color: rgba(255,255,255,.65); }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 2rem; }
.site-footer h2 { margin: 0 0 .85rem; font-size: 1rem; color: #fff; font-family: var(--display); }
.site-footer a { color: rgba(255,255,255,.78); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.site-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.contact-lines { display: grid; gap: .45rem; margin-top: 1rem; }
.footer-bottom {
  margin-top: 2.25rem;
  padding: 1.1rem 0 1.35rem;
  border-top: 1px solid rgba(255,255,255,.1);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: .85rem 1.5rem;
  font-size: .9rem;
  letter-spacing: .01em;
  color: rgba(255,255,255,.62);
}
.footer-bottom p { margin: 0; }
.footer-bottom a {
  color: rgba(255,255,255,.72);
  text-decoration: none;
  border-bottom: 1px solid rgba(1,177,236,.25);
  padding-bottom: 1px;
  transition: color .2s ease, border-color .2s ease;
}
.footer-bottom a:hover {
  color: #5AD4FF;
  border-bottom-color: rgba(90,212,255,.7);
  text-decoration: none;
}
.footer-bottom-links {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .35rem .85rem;
  align-items: center;
}
.footer-bottom-actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem .75rem;
  margin-left: auto;
}

.cookie-banner {
  position: fixed; inset-inline: 1rem; bottom: 1rem; z-index: 100;
  background: var(--surface); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: var(--shadow); padding: 1.15rem 1.25rem; max-width: 40rem; display: none;
}
.cookie-banner[data-open="true"] { display: block; }
.cookie-banner h2 { margin: 0 0 .5rem; font-size: 1.1rem; color: var(--navy); font-family: var(--display); }
.cookie-banner p { margin: 0 0 1rem; color: var(--muted); font-size: .98rem; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: .6rem; }

.reveal {
  opacity: 0; transform: translateY(16px);
  transition: opacity .6s ease, transform .6s ease;
}
.reveal.is-visible { opacity: 1; transform: none; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.score-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .75rem;
  max-width: 40rem;
  margin: 1.5rem auto 1rem;
}
.score-form input {
  font: inherit;
  padding: .85rem 1rem;
  border: 2px solid var(--line);
  border-radius: 12px;
  min-width: 0;
  background: var(--surface);
  color: var(--ink);
}
.score-loading {
  padding: 1.25rem;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  text-align: center;
}
.score-summary {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.25rem;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1.25rem 1.4rem;
  margin-bottom: 1.25rem;
  box-shadow: 0 10px 28px rgba(8,55,107,.06);
}
.score-grade-title {
  margin: 0 0 .35rem;
  color: var(--navy);
  font-family: var(--display);
  font-size: 1.45rem;
}
.score-meta {
  margin: 0;
  color: var(--muted);
  font-size: .95rem;
  line-height: 1.45;
}
.score-ring {
  width: 6.5rem;
  height: 6.5rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  align-content: center;
  background: radial-gradient(circle at 30% 30%, var(--ice), var(--sand));
  border: 4px solid var(--accent);
  font-family: var(--display);
}
.score-ring[data-grade="Sterk"] { border-color: var(--ok); }
.score-ring[data-grade="God"] { border-color: var(--accent); }
.score-ring[data-grade="Svak"] { border-color: #c47a12; }
.score-ring[data-grade="Kritisk"] { border-color: #9b1c1c; }
.score-ring strong { font-size: 1.8rem; line-height: 1; color: var(--navy); }
.score-ring span { font-size: .85rem; color: var(--muted); }
.score-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .85rem;
}
.score-list li {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1rem 1.15rem 1.05rem;
  box-shadow: 0 6px 18px rgba(8,55,107,.04);
}
.score-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .65rem;
  margin-bottom: .45rem;
}
.score-card-title {
  color: var(--navy);
  font-size: 1.02rem;
  letter-spacing: .01em;
}
.score-card-detail {
  margin: 0;
  color: var(--muted);
  font-size: .95rem;
  line-height: 1.55;
}
.score-list p { margin: .35rem 0 0; color: var(--muted); }
.score-badge {
  display: inline-flex;
  padding: .18rem .55rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.score-ok { background: #e6f6ee; color: #0d6b45; }
.score-warn { background: #fff4e5; color: #9a5b00; }
.score-bad { background: #fdecec; color: #9b1c1c; }
.score-tips-panel {
  margin-top: 1.35rem;
  background: var(--ice);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1.1rem 1.2rem 1.15rem;
}
.score-tips-title {
  margin: 0 0 .75rem;
  color: var(--navy);
  font-family: var(--display);
  font-size: 1.1rem;
}
.score-tips-list {
  margin: 0;
  padding-left: 1.15rem;
  color: var(--ink);
  display: grid;
  gap: .45rem;
}
.score-tips-list li { color: var(--ink); }
.score-sources {
  margin-top: 1.35rem;
  padding: 1rem 1.15rem;
  border-radius: 12px;
  border: 1px dashed var(--line);
  background: var(--sand);
}
.score-sources h3 {
  margin: 0 0 .55rem;
  font-size: .95rem;
  color: var(--navy);
  font-family: var(--display);
}
.score-sources ul {
  margin: 0 0 .65rem;
  padding-left: 1.1rem;
  color: var(--muted);
  font-size: .9rem;
  display: grid;
  gap: .35rem;
}
.score-sources a { color: var(--accent-deep); font-weight: 650; }
.score-sources p {
  margin: 0;
  font-size: .85rem;
  color: var(--muted);
}
.score-cta { margin-top: 1.5rem; }
.score-summary h3 {
  margin: 0 0 .35rem;
  color: var(--navy);
  font-family: var(--display);
  font-size: 1.45rem;
}
.score-summary > div > p {
  margin: 0;
  color: var(--muted);
}


.theme-cycle-btn {
  font: inherit;
  font-weight: 700;
  font-size: .9rem;
  color: rgba(255,255,255,.85);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding: .45rem .95rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 2.3rem;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.theme-cycle-btn:hover {
  background: rgba(1,177,236,.18);
  border-color: rgba(90,212,255,.45);
  color: #fff;
}
.theme-cycle-btn:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.btn-cookie-settings {
  min-height: 2.2rem;
  padding: .35rem .9rem;
  font-size: .9rem;
  background: transparent;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.35);
}
.btn-cookie-settings:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}


html[data-theme="dark"] .cookie-banner,
html[data-theme="dark"] .score-summary,
html[data-theme="dark"] .score-list li,
html[data-theme="dark"] .score-tips-panel,
html[data-theme="dark"] .score-sources,
html[data-theme="dark"] .card,
html[data-theme="dark"] .team-card,
html[data-theme="dark"] .sc-card,
html[data-theme="dark"] .nis2-q,
html[data-theme="dark"] .partner-chip {
  background: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="dark"] .score-tips-panel {
  background: #143047;
  border-color: rgba(90, 212, 255, 0.28);
}
html[data-theme="dark"] .score-sources {
  background: rgba(255, 255, 255, 0.04);
  border-style: dashed;
}
html[data-theme="dark"] .score-tips-title,
html[data-theme="dark"] .score-summary h3,
html[data-theme="dark"] .score-grade-title,
html[data-theme="dark"] .score-card-title,
html[data-theme="dark"] .score-sources h3,
html[data-theme="dark"] .score-ring strong {
  color: var(--accent-bright);
}
html[data-theme="dark"] .score-tips-list,
html[data-theme="dark"] .score-tips-list li,
html[data-theme="dark"] .score-card-detail,
html[data-theme="dark"] .score-summary > div > p,
html[data-theme="dark"] .score-meta,
html[data-theme="dark"] .score-sources p,
html[data-theme="dark"] .score-sources ul,
html[data-theme="dark"] .score-ring span,
html[data-theme="dark"] .score-list p {
  color: var(--muted);
}
html[data-theme="dark"] .score-sources a {
  color: var(--accent-bright);
}
html[data-theme="dark"] .score-ring {
  background: radial-gradient(circle at 30% 30%, #1a3a52, #0a1c2c);
}
html[data-theme="dark"] .score-ok {
  background: rgba(62, 207, 142, 0.2);
  color: #6ee7b0;
}
html[data-theme="dark"] .score-warn {
  background: rgba(240, 179, 90, 0.2);
  color: #f0b35a;
}
html[data-theme="dark"] .score-bad {
  background: rgba(255, 143, 143, 0.18);
  color: #ff9b9b;
}
html[data-theme="dark"] .sc-card h2,
html[data-theme="dark"] .card h3,
html[data-theme="dark"] .nis2-q legend,
html[data-theme="dark"] .form label,
html[data-theme="dark"] .section-head h2 {
  color: var(--accent-bright);
}
html[data-theme="dark"] .section-dark,
html[data-theme="dark"] .section-dark .section-head h2,
html[data-theme="dark"] .section-dark .section-head p,
html[data-theme="dark"] .section-dark h2,
html[data-theme="dark"] .section-dark h3,
html[data-theme="dark"] .section-dark p,
html[data-theme="dark"] .cta-band,
html[data-theme="dark"] .cta-band h2,
html[data-theme="dark"] .cta-band p {
  color: #fff;
}
html[data-theme="dark"] .section-dark .section-head p,
html[data-theme="dark"] .section-dark p,
html[data-theme="dark"] .cta-band p {
  color: rgba(255,255,255,.84);
}
html[data-theme="dark"] .sc-card p,
html[data-theme="dark"] .card p,
html[data-theme="dark"] .nis2-option,
html[data-theme="dark"] .partner-chip {
  color: var(--muted);
}
html[data-theme="dark"] .nis2-option {
  color: var(--ink);
}
html[data-theme="dark"] .sc-tag {
  color: #04101d;
  background: linear-gradient(90deg, #5AD4FF, #01B1EC);
}
html[data-theme="dark"] .form input,
html[data-theme="dark"] .form textarea,
html[data-theme="dark"] .form select,
html[data-theme="dark"] .score-form input {
  background: var(--navy-deep);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .page-hero .hint,
html[data-theme="dark"] .page-hero .hint a,
html[data-theme="dark"] .page-hero a {
  color: var(--accent);
}
html[data-theme="dark"] .btn-outline-dark {
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .btn-outline-dark:hover {
  background: var(--ice);
  color: var(--ink);
}
html[data-theme="dark"] .cookie-banner {
  color: var(--ink);
}
html[data-theme="dark"] .cookie-banner h2 {
  color: var(--accent-bright);
}



.hero-visual {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  min-height: 280px;
}
.hero-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 280px;
}
.partner-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  justify-content: center;
  align-items: stretch;
}
.partner-badge {
  position: relative;
  width: min(100%, 200px);
  padding: 1.1rem 1rem 1rem;
  border-radius: 18px;
  background:
    linear-gradient(165deg, #0a1f36 0%, #08376B 48%, #061628 100%);
  border: 1px solid rgba(1,177,236,.35);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 18px 40px rgba(8,55,107,.28);
  text-align: center;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.partner-badge::before {
  content: "";
  position: absolute; inset: -40% -20% auto;
  height: 70%;
  background: radial-gradient(circle, rgba(1,177,236,.35), transparent 65%);
  pointer-events: none;
}
.partner-badge:hover {
  transform: translateY(-4px);
  border-color: rgba(90,212,255,.7);
  box-shadow:
    0 0 0 1px rgba(90,212,255,.12) inset,
    0 22px 48px rgba(1,177,236,.22);
}
.partner-badge img {
  position: relative;
  z-index: 1;
  width: 118px;
  height: auto;
  border-radius: 12px;
  display: block;
  margin: 0 auto .65rem;
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.35));
}
.partner-badge figcaption {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #d7ecf8;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .02em;
}
.partner-badge .badge-tag {
  display: inline-block;
  margin-top: .45rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #04101d;
  background: linear-gradient(90deg, #5AD4FF, #01B1EC);
}

/* Sophos service page */
.sophos-hero { padding-bottom: 2.5rem; }
.sophos-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 2rem;
  align-items: center;
}
.sophos-hero-copy .lead { max-width: 36rem; }
.sophos-hero-visual,
.sophos-side-visual {
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  background: var(--surface);
}
.sophos-hero-visual img,
.sophos-side-visual img {
  display: block;
  width: 100%;
  height: auto;
}
.sophos-logo-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 1.1rem 1.75rem;
  justify-content: center;
  align-items: center;
  padding: 1.15rem 1.25rem;
  border-radius: 16px;
  background: var(--surface);
  border: 1px solid var(--line);
}
.sophos-logo-strip > span {
  display: inline-flex;
  align-items: center;
}
.sophos-logo-strip img {
  height: 28px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}
.logo-theme--dark { display: none; }
html[data-theme="dark"] .logo-theme--light { display: none; }
html[data-theme="dark"] .logo-theme--dark { display: block; }
html[data-theme="light"] .logo-theme--light { display: block; }
html[data-theme="light"] .logo-theme--dark { display: none; }
.sophos-product-grid {
  display: grid;
  gap: 1.35rem;
}
.sophos-product-card {
  display: grid;
  grid-template-columns: minmax(220px, 38%) 1fr;
  gap: 0;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.sophos-product-media {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
  background: #08376B;
}
.sophos-product-body {
  padding: 1.25rem 1.35rem 1.35rem;
}
.sophos-product-body h3 {
  margin: 0 0 .55rem;
  font-family: var(--display);
  color: var(--navy);
  font-size: 1.18rem;
}
.sophos-product-body p {
  margin: 0 0 .85rem;
  color: var(--muted);
}
.sophos-product-body .check-list { margin: 0; }
.sophos-aside {
  display: grid;
  gap: .85rem;
  align-content: start;
}
.sophos-aside img {
  max-width: 220px;
  height: auto;
}
html[data-theme="dark"] .sophos-logo-strip {
  background: rgba(255, 255, 255, 0.04);
  border-color: var(--line);
}
.insight-figure {
  margin: 1.4rem 0 1.6rem;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--surface);
}
.insight-figure img {
  display: block;
  width: 100%;
  height: auto;
}
.insight-figure figcaption {
  padding: .7rem 1rem .9rem;
  font-size: .9rem;
  color: var(--muted);
}
.partner-badge--link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: inherit;
  min-height: 100%;
  box-sizing: border-box;
}
.partner-badge--link:hover {
  text-decoration: none;
}
.partner-badge--link:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.partner-badge--sophos {
  gap: .85rem;
  padding-top: 1.35rem;
  padding-bottom: 1.15rem;
}
.partner-badge-logo {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 118px;
  height: 118px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.partner-badge-logo img {
  width: auto;
  height: 22px;
  max-width: 96px;
  margin: 0;
  border-radius: 0;
  filter: none;
}
.partner-badge-caption {
  position: relative;
  z-index: 1;
  display: grid;
  gap: .35rem;
  justify-items: center;
  font-weight: 700;
  color: #fff;
  font-size: .92rem;
  line-height: 1.25;
}
.partner-follow {
  max-width: 40rem;
  margin: 1.15rem auto 0;
  text-align: center;
  color: var(--muted);
  font-size: .98rem;
  line-height: 1.5;
}
.partner-follow a {
  color: var(--accent-deep);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}
.partner-follow a:hover {
  color: var(--navy);
}
html[data-theme="light"] .partner-badge-logo {
  background: rgba(8, 55, 107, 0.06);
  border-color: rgba(8, 55, 107, 0.12);
}
html[data-theme="dark"] .partner-follow a {
  color: #7dd3fc;
}
html[data-theme="dark"] .partner-follow a:hover {
  color: #bae6fd;
}
@media (max-width: 900px) {
  .sophos-hero-grid,
  .sophos-product-card { grid-template-columns: 1fr; }
  .sophos-product-media {
    min-height: 180px;
    max-height: 240px;
  }
}

.about-hero {
  position: relative;
  min-height: min(88vh, 52rem);
  display: grid;
  align-items: center;
  justify-items: center;
  color: #fff;
  overflow: hidden;
}
.about-hero-media {
  position: absolute;
  inset: 0;
}
.about-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.about-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(4,16,29,.42) 0%, rgba(4,16,29,.72) 48%, rgba(4,16,29,.9) 100%),
    radial-gradient(900px 420px at 50% 40%, rgba(1,177,236,.22), transparent 62%);
}
.about-hero-content {
  position: relative;
  z-index: 1;
  width: min(100% - 2.5rem, 40rem);
  margin-inline: auto;
  padding: 5.5rem 0 4.5rem;
  text-align: center;
}
.about-hero-content .btn-group {
  justify-content: center;
}
.about-hero-eyebrow {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  color: #d7ecf8;
}
.about-hero h1 {
  margin: .85rem 0 1rem;
  font-family: var(--display);
  font-size: clamp(3.2rem, 9vw, 5.6rem);
  line-height: .95;
  letter-spacing: -.02em;
  color: #fff;
}
.about-hero h1.about-hero-title--wide {
  font-size: clamp(2.35rem, 7vw, 4.4rem);
  line-height: 1.02;
  max-width: 14ch;
  margin-inline: auto;
}
.section-more {
  margin: 1.5rem 0 0;
  text-align: center;
  color: var(--muted);
}
.process-steps .more {
  display: inline-block;
  margin-top: .75rem;
}
.about-hero-lead {
  color: rgba(255,255,255,.88);
  font-size: clamp(1.15rem, 2.2vw, 1.4rem);
  max-width: 28rem;
  margin: 0 auto 1.6rem;
}
.about-signal {
  padding: 1.75rem 0;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.about-signal-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  text-align: center;
}
.about-signal-value {
  margin: 0;
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(1.05rem, 2vw, 1.45rem);
  color: var(--navy);
  overflow-wrap: anywhere;
}
.about-signal-label {
  margin: .35rem 0 0;
  color: var(--muted);
  font-size: .92rem;
}
.about-split {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 2.5rem;
  align-items: center;
}
.about-split--reverse {
  direction: rtl;
}
.about-split--reverse > * {
  direction: ltr;
}
.about-split-copy h2 {
  margin: 0 0 1rem;
  font-family: var(--display);
  color: var(--navy);
  font-size: clamp(1.7rem, 3vw, 2.3rem);
}
.about-split-copy .lead {
  color: var(--ink);
  font-size: 1.15rem;
}
.about-split-copy p {
  color: var(--muted);
}
.about-split-media {
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  min-height: 18rem;
}
.about-split-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 18rem;
}
.about-split-media--mark {
  display: grid;
  place-items: center;
  min-height: 22rem;
  border: 1px solid rgba(1,177,236,.18);
  background:
    radial-gradient(ellipse at 50% 35%, rgba(1,177,236,.32), transparent 58%),
    linear-gradient(160deg, #04101d 0%, #08376B 52%, #062a52 100%);
}
.about-split-media--mark .nitd-mark {
  width: min(58%, 220px);
  aspect-ratio: 1 / 1;
}

.location-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.35rem;
}
.location-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.location-card figure {
  margin: 0;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--navy-deep);
}
.location-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.location-card--forde {
  grid-column: 1 / -1;
  justify-self: center;
  width: min(100%, 32rem);
}
.location-card-body {
  padding: 1.15rem 1.25rem 1.3rem;
}
.location-card h3 {
  margin: 0 0 .45rem;
  font-family: var(--display);
  color: var(--navy);
  font-size: 1.15rem;
}
.location-card p {
  margin: 0;
  color: var(--muted);
}
.location-card .location-note {
  margin-top: .55rem;
  font-size: .92rem;
}

.sc-ack {
  display: none;
  margin: 0 auto 1.5rem;
  max-width: 40rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  text-align: left;
}
.sc-ack[data-open="true"] { display: block; }
.sc-ack p { margin: 0 0 .85rem; color: var(--muted); font-size: .98rem; }
.sc-ack-row {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1rem;
  align-items: center;
}
.sc-ack label {
  display: inline-flex;
  gap: .55rem;
  align-items: flex-start;
  font-weight: 650;
  color: var(--ink);
  cursor: pointer;
}
.sc-ack input { margin-top: .25rem; width: 1.1rem; height: 1.1rem; accent-color: #08376B; }
html[data-theme="dark"] .about-signal { background: var(--surface); }
html[data-theme="dark"] .sc-ack { background: var(--surface); border-color: var(--line); }

/* Under angrep? – akuttside og navigasjon */
.nav-incident {
  color: #8f3a12;
  font-weight: 750;
  border: 1px solid rgba(180, 84, 30, .35);
  background: rgba(255, 196, 140, .14);
}
.nav-incident:hover,
.nav-incident[aria-current="page"] {
  background: rgba(255, 196, 140, .28);
  color: #6f2c0c;
}
html[data-theme="dark"] .nav-incident {
  color: #ffc48c;
  border-color: rgba(255, 196, 140, .28);
  background: rgba(180, 84, 30, .18);
}
html[data-theme="dark"] .nav-incident:hover,
html[data-theme="dark"] .nav-incident[aria-current="page"] {
  background: rgba(180, 84, 30, .32);
  color: #ffe2c4;
}

.btn-incident {
  background: linear-gradient(135deg, #b4541e, #8f3a12);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 8px 24px rgba(143, 58, 18, .28);
}
.btn-incident:hover {
  background: linear-gradient(135deg, #c86224, #9b4116);
  color: #fff;
}
.hero .btn-incident {
  background: linear-gradient(135deg, #ffc48c, #e89a52);
  color: #4a2108;
  border-color: rgba(255, 255, 255, .22);
}
.hero .btn-incident:hover { background: linear-gradient(135deg, #ffd4aa, #f0a862); color: #3a1a06; }

.incident-hero {
  position: relative;
  min-height: min(88vh, 52rem);
  display: grid;
  align-items: center;
  justify-items: center;
  color: #fff;
  overflow: hidden;
}
.incident-hero-media {
  position: absolute;
  inset: 0;
}
.incident-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.incident-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 320px at 50% -10%, rgba(255, 196, 140, .2), transparent 62%),
    linear-gradient(165deg, rgba(26, 15, 10, .84) 0%, rgba(42, 24, 16, .78) 38%, rgba(12, 47, 82, .9) 100%);
}
.incident-hero-content {
  position: relative;
  z-index: 1;
  width: min(100% - 2rem, var(--max));
  margin-inline: auto;
  padding: 5.5rem 0 4.5rem;
  text-align: center;
}
.incident-eyebrow {
  margin: 0 0 .75rem;
  font-size: .82rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(255, 210, 170, .88);
}
.incident-hero h1 {
  margin: 0 0 .85rem;
  font-family: var(--display);
  font-size: clamp(2.8rem, 7vw, 4.5rem);
  line-height: 1.02;
  letter-spacing: -.02em;
}
.incident-lead {
  margin: 0 auto 1.6rem;
  font-size: clamp(1.05rem, 2.2vw, 1.22rem);
  color: rgba(255, 255, 255, .86);
  max-width: 44rem;
}
.incident-call-card {
  margin: 0 auto 1.2rem;
  padding: 1.35rem 1.25rem 1.15rem;
  border-radius: 18px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 210, 170, .28);
  box-shadow: 0 18px 40px rgba(0, 0, 0, .22);
  max-width: 28rem;
}
.incident-call-label {
  margin: 0 0 .35rem;
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(255, 210, 170, .9);
}
.incident-phone {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(2rem, 5vw, 2.65rem);
  line-height: 1.05;
}
.incident-phone a {
  color: #fff;
  text-decoration: none;
}
.incident-phone a:hover { color: #ffd4aa; }
.incident-dtmf {
  margin: .45rem 0 0;
  font-size: 1.05rem;
  color: rgba(255, 255, 255, .9);
}
.incident-call-hint {
  margin: .75rem 0 0;
  font-size: .92rem;
  color: rgba(255, 255, 255, .72);
}
.incident-reassure {
  margin: 0;
  font-weight: 650;
  color: rgba(255, 228, 200, .92);
}
.incident-panel--warm {
  background: linear-gradient(160deg, var(--surface), var(--ice));
  border-color: rgba(180, 84, 30, .18);
}
.incident-quote {
  margin: 0 0 .65rem;
  padding-left: .85rem;
  border-left: 3px solid rgba(180, 84, 30, .45);
  font-style: italic;
  color: var(--ink);
}
.incident-flow-list {
  margin: .5rem 0 0;
  padding-left: 1.2rem;
}
.incident-flow-list li { margin-bottom: .55rem; color: var(--muted); }
.incident-flow-list strong { color: var(--ink); }
.incident-card h3 { margin-top: 0; font-family: var(--display); color: var(--navy); }
.incident-final-cta {
  border-radius: 22px;
  padding: 2.4rem 1.5rem;
  text-align: center;
  background:
    radial-gradient(700px 240px at 50% 0%, rgba(255, 196, 140, .18), transparent 60%),
    linear-gradient(135deg, #2a1810, #0c2f52);
  color: #fff;
  box-shadow: var(--shadow);
}
.incident-final-cta h2 {
  margin: 0 0 .5rem;
  font-family: var(--display);
  font-size: clamp(1.5rem, 3vw, 2rem);
}
.incident-final-cta p {
  margin: 0 0 1.2rem;
  color: rgba(255, 255, 255, .84);
  font-size: 1.15rem;
}
.incident-final-cta .btn-group { justify-content: center; }
.incident-spotlight {
  border-radius: 18px;
  padding: 1.5rem 1.35rem;
  background:
    radial-gradient(520px 180px at 0% 0%, rgba(255, 196, 140, .16), transparent 70%),
    linear-gradient(135deg, var(--surface), var(--ice));
  border: 1px solid rgba(180, 84, 30, .22);
}
.incident-spotlight h2 {
  margin: .45rem 0 .55rem;
  font-family: var(--display);
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  color: var(--navy);
}
.incident-spotlight p { margin: 0 0 1rem; color: var(--muted); max-width: 42rem; }
html[data-theme="dark"] .incident-panel--warm {
  background: linear-gradient(160deg, var(--surface), rgba(255, 196, 140, .06));
}
html[data-theme="dark"] .incident-spotlight {
  background: linear-gradient(135deg, var(--surface), rgba(180, 84, 30, .08));
  border-color: rgba(255, 196, 140, .18);
}
html[data-theme="dark"] .incident-spotlight h2 { color: var(--ink); }

@media (max-width: 960px) {
  .score-form, .score-summary { grid-template-columns: 1fr; }
  .hero-grid, .grid-2, .grid-3, .grid-4, .split, .footer-grid, .process-steps,
  .about-split, .about-signal-grid, .location-grid, .legal-split, .dmarc-builder {
    grid-template-columns: 1fr;
  }
  .dmarc-seg-opts { grid-template-columns: 1fr; }
  .spf-mech-row { grid-template-columns: 1fr; }
  .team-card {
    flex: 1 1 100%;
    max-width: 100%;
  }
  .nav-toggle { display: inline-flex; }
  .site-nav {
    display: none; position: absolute; left: 1rem; right: 1rem;
    top: calc(var(--header-h) + .35rem); background: var(--surface); border: 1px solid var(--line);
    border-radius: 12px; box-shadow: var(--shadow); padding: .75rem;
    flex-direction: column; align-items: stretch;
  }
  .site-nav.open { display: flex; }
  .site-nav a { width: 100%; text-align: left; }
  .hero h1 { max-width: none; }
  .btn-secondary { color: var(--ink); border-color: var(--line-strong); }
  .hero .btn-secondary { color: #fff; border-color: rgba(255,255,255,.55); }
  .about-hero { min-height: 70vh; }
  .incident-hero { min-height: 70vh; }
  .about-split--reverse { direction: ltr; }
  .about-hero-content .btn-secondary { color: #fff; border-color: rgba(255,255,255,.55); }
}