@font-face { font-family: Nordi; src: local("Segoe UI"); font-display: swap; }
:root { color-scheme: dark; --bg:#0c1320; --surface:#151f30; --line:#2b3b4e; --text:#edf2f8; --muted:#a0b0c1; --accent:#82dded; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.55 Nordi,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
a:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.wrap { width:min(1160px,calc(100% - 48px)); margin-inline:auto; }
.site-header { min-height:96px; display:flex; align-items:center; gap:42px; border-bottom:1px solid var(--line); }
.brand,.footer-brand { display:inline-flex; align-items:center; gap:10px; font-size:22px; font-weight:750; letter-spacing:-.04em; white-space:nowrap; }
.brand img,.footer-brand img { border-radius:10px; }
.brand-light { font-weight:450; }
.site-header nav { display:flex; gap:30px; margin-left:auto; color:var(--muted); font-size:14px; }
.site-header nav a:hover,.footer-links a:hover { color:var(--accent); }
.header-action { border:1px solid #426172; border-radius:10px; padding:11px 16px; font-weight:650; white-space:nowrap; }
.header-action:hover { background:#1c3543; }
.hero { min-height:680px; display:grid; grid-template-columns:1.08fr .92fr; align-items:center; gap:38px; padding-block:70px 88px; }
.eyebrow { margin:0 0 18px; color:var(--accent); font-size:12px; font-weight:750; letter-spacing:.17em; text-transform:uppercase; }
.status-dot { display:inline-block; width:7px; height:7px; margin:0 6px 1px 0; border-radius:50%; background:var(--accent); box-shadow:0 0 12px var(--accent); }
h1,h2,h3,p { overflow-wrap:break-word; }
h1 { margin:0; font-size:clamp(44px,5.4vw,75px); line-height:1.08; letter-spacing:-.065em; font-weight:750; }
h1 em { color:var(--accent); font-style:normal; }
.hero-lead { max-width:570px; margin:28px 0 0; color:#c2cddd; font-size:18px; line-height:1.65; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:26px; margin-top:34px; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:18px; border-radius:12px; padding:15px 22px; font-weight:750; text-align:center; }
.primary { background:var(--accent); color:#092d38; }
.primary:hover { background:#a2edf5; }
.text-link { color:var(--accent); font-weight:650; }
.hero-note { margin:19px 0 0; color:var(--muted); font-size:13px; }
.hero-art { position:relative; min-height:470px; overflow:hidden; border:1px solid #244359; border-radius:24px; background:radial-gradient(circle at 58% 45%,#1b5b74 0,#163449 36%,#101f31 73%); }
.orbit { position:absolute; border:1px solid rgba(130,221,237,.19); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); }
.orbit-one { width:320px; height:320px; }.orbit-two { width:510px; height:510px; }
.signal-line { position:absolute; height:1px; width:130%; background:linear-gradient(90deg,transparent,#82dded,transparent); transform:rotate(-30deg); opacity:.48; }
.signal-one { left:-50px; top:42%; }.signal-two { left:-50px; top:67%; opacity:.22; }
.nordi-card { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%) rotate(-7deg); width:245px; height:296px; border:1px solid rgba(179,240,249,.5); border-radius:25px; padding:30px; background:linear-gradient(150deg,#17394d,#101b2c 78%); box-shadow:0 25px 65px #07101d99; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; }
.nordi-card img { width:82px; height:82px; border-radius:20px; margin-bottom:auto; }.nordi-card span { font-size:34px; font-weight:800; letter-spacing:.1em; }.nordi-card small { color:var(--muted); letter-spacing:.04em; }
.art-label { position:absolute; color:#c8edf4; font-size:10px; font-weight:750; letter-spacing:.15em; }.label-top { top:26px; left:26px; }.label-bottom { right:26px; bottom:26px; }
.steps { background:#101c2b; border-block:1px solid var(--line); padding:86px 0 96px; }
.section-heading h2,.support-inner h2 { margin:0; font-size:clamp(32px,3.7vw,48px); line-height:1.15; letter-spacing:-.04em; }
.section-heading > p:last-child { color:var(--muted); max-width:560px; }
.step-list { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; list-style:none; padding:0; margin:52px 0 0; }
.step-list li { border-top:1px solid #426072; padding-top:20px; }.step-number { color:var(--accent); font-size:13px; letter-spacing:.12em; font-weight:800; }
.step-list h3 { margin:24px 0 8px; font-size:21px; }.step-list p { margin:0; color:var(--muted); line-height:1.7; }
.plans { padding-block:94px 105px; }.plan-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:42px; }
.plan { display:flex; flex-direction:column; padding:32px; border:1px solid #344659; border-radius:16px; background:#111d2c; }.plan.plus { background:#15293a; border-color:#3b7283; }
.plan-top { display:flex; justify-content:space-between; gap:15px; color:var(--accent); font-size:12px; font-weight:750; text-transform:uppercase; letter-spacing:.13em; }.plan-state { color:var(--muted); }
.plan h3 { margin:43px 0 8px; font-size:29px; letter-spacing:-.04em; }.plan p { color:var(--muted); margin:0; }.plan ul { list-style:none; padding:24px 0 26px; margin:auto 0 0; }.plan li { padding:10px 0; border-bottom:1px solid var(--line); }.plan li::before { content:"✓"; color:var(--accent); margin-right:12px; }.plan a { color:var(--accent); font-weight:750; }.plan-disclaimer { margin:20px 0 0; color:var(--muted); font-size:13px; }
.support-band { border-block:1px solid var(--line); background:#193446; }.support-inner { display:flex; justify-content:space-between; align-items:center; gap:32px; padding-block:63px; }.support-inner p:not(.eyebrow) { color:#d0dce5; margin-bottom:0; }.secondary { border:1px solid #9ce7f0; color:#e9f9fc; white-space:nowrap; }.secondary:hover { background:#255469; }
.site-footer { display:flex; align-items:center; gap:26px; min-height:128px; }.site-footer p { color:var(--muted); margin-left:auto; }.footer-links { display:flex; gap:25px; color:var(--muted); font-size:14px; }
@media (max-width:850px) { .site-header { gap:20px; }.site-header nav { display:none; }.header-action { margin-left:auto; }.hero { grid-template-columns:1fr; padding-top:60px; }.hero-art { min-height:390px; }.step-list { grid-template-columns:1fr; gap:25px; }.step-list h3 { margin-top:14px; }.support-inner { align-items:flex-start; flex-direction:column; } }
@media (max-width:560px) { .wrap { width:min(100% - 32px,1160px); }.site-header { min-height:76px; }.brand { font-size:19px; }.brand img { width:35px; height:35px; }.header-action { font-size:12px; padding:9px 10px; }.hero { gap:38px; padding-block:55px 66px; }.hero-lead { font-size:16px; }.hero-art { min-height:320px; }.nordi-card { width:190px; height:230px; padding:23px; }.nordi-card img { width:60px; height:60px; }.nordi-card span { font-size:27px; }.hero-actions { align-items:flex-start; flex-direction:column; }.steps,.plans { padding-block:66px; }.plan-grid { grid-template-columns:1fr; }.plan { padding:25px; }.plan h3 { margin-top:30px; }.site-footer { min-height:160px; flex-wrap:wrap; gap:10px; padding-block:24px; }.site-footer p { margin:0 0 0 auto; }.footer-links { flex-basis:100%; } }

/* Shared theme controls and restrained motion. */
:root {
  --section-bg: #101c2b;
  --plan-bg: #111d2c;
  --plan-plus-bg: #15293a;
  --plan-border: #344659;
  --support-bg: #193446;
  --hero-lead: #c2cddd;
  --button-hover: #1c3543;
  --card-text: #edf2f8;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f7f9fc;
  --surface: #ffffff;
  --line: #d8e2ea;
  --text: #102034;
  --muted: #607488;
  --accent: #147f9f;
  --section-bg: #eef3f7;
  --plan-bg: #ffffff;
  --plan-plus-bg: #eaf5f8;
  --plan-border: #c9d9e2;
  --support-bg: #dceef3;
  --hero-lead: #526a7c;
  --button-hover: #e4f3f7;
  --card-text: #edf2f8;
}

body,
.steps,
.plan,
.support-band,
.header-action,
.theme-toggle,
.cookie-note {
  transition: background-color 320ms ease, color 320ms ease, border-color 320ms ease;
}

button:focus-visible,
a:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 4px;
}

.header-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.theme-toggle {
  width: 46px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 22px;
  cursor: pointer;
}

.theme-toggle:hover,
.header-action:hover {
  background: var(--button-hover);
}

.theme-sun,
.theme-moon {
  grid-area: 1 / 1;
  transition: transform 320ms ease, opacity 320ms ease;
}

.theme-sun {
  opacity: 0;
  transform: rotate(-60deg) scale(.65);
}

:root[data-theme="light"] .theme-sun {
  opacity: 1;
  transform: rotate(0) scale(1);
}

:root[data-theme="light"] .theme-moon {
  opacity: 0;
  transform: rotate(60deg) scale(.65);
}

.hero-lead { color: var(--hero-lead); }
.steps { background: var(--section-bg); }
.plan { background: var(--plan-bg); border-color: var(--plan-border); }
.plan.plus { background: var(--plan-plus-bg); border-color: var(--plan-border); }
.support-band { background: var(--support-bg); }
.support-inner p:not(.eyebrow) { color: var(--muted); }
.secondary { border-color: var(--accent); color: var(--text); }
.secondary:hover { background: var(--button-hover); }
.step-list li { border-color: var(--line); }
.plan li::before { content: none; }
.plan li { padding-left: 0; }
.hero-art { color: var(--card-text); }
.nordi-card { animation: card-drift 8s ease-in-out infinite; }
.signal-one { animation: signal-drift 7s ease-in-out infinite alternate; }

.cookie-note {
  position: fixed;
  z-index: 20;
  right: 24px;
  bottom: 24px;
  left: 24px;
  width: min(920px, calc(100% - 48px));
  margin-inline: auto;
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 16px 18px 16px 24px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  box-shadow: 0 16px 44px #06142230;
}

.cookie-note[hidden] { display: none; }
.cookie-note p { flex: 1; margin: 0; color: var(--muted); font-size: 14px; }
.cookie-note button {
  flex: none;
  border: 0;
  border-radius: 10px;
  padding: 11px 20px;
  background: var(--accent);
  color: var(--bg);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

@keyframes card-drift {
  0%, 100% { transform: translate(-50%, -50%) rotate(-7deg); }
  50% { transform: translate(-50%, -53%) rotate(-5deg); }
}

@keyframes signal-drift {
  from { translate: -10% 0; opacity: .2; }
  to { translate: 10% 0; opacity: .62; }
}

@media (max-width: 560px) {
  .header-controls { margin-left: auto; gap: 8px; }
  .theme-toggle { width: 40px; height: 38px; font-size: 20px; }
  .cookie-note { flex-direction: column; align-items: stretch; gap: 12px; bottom: 12px; }
}

@media (max-width: 380px) {
  .brand-light { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .nordi-card,
  .signal-one { animation: none; }
  body,
  .steps,
  .plan,
  .support-band,
  .header-action,
  .theme-toggle,
  .cookie-note { transition: none; }
}