:root {
  --ink: #020814;
  --panel: #071624;
  --panel-2: #091a2d;
  --blue: #35b9ff;
  --blue-soft: #78c8ff;
  --green: #79e34d;
  --white: #f3f7fc;
  --muted: #9eb3c8;
  --line: rgba(120, 200, 255, .16);
  --max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--white);
  background: var(--ink);
  font-family: "Segoe UI", Arial, sans-serif;
  line-height: 1.6;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
.skip-link { position: fixed; left: 1rem; top: -4rem; z-index: 100; padding: .7rem 1rem; background: var(--white); color: var(--ink); }
.skip-link:focus { top: 1rem; }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 20;
  height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 max(28px, calc((100vw - var(--max)) / 2));
  background: linear-gradient(180deg, rgba(2,8,20,.94), rgba(2,8,20,.66), transparent);
  backdrop-filter: blur(10px);
}
.brand { display: inline-flex; align-items: center; gap: .6rem; font: 600 1.05rem/1 Bahnschrift, "Arial Narrow", Arial, sans-serif; letter-spacing: .21em; }
.brand-star { color: var(--blue); filter: drop-shadow(0 0 9px var(--blue)); }
nav { display: flex; align-items: center; gap: 1.25rem; font-size: .81rem; text-transform: uppercase; letter-spacing: .09em; color: var(--blue-soft); }
nav a { transition: color .2s ease; }
nav a:hover, nav a:focus-visible { color: var(--white); }
.menu-toggle { display: none; color: var(--white); background: transparent; border: 1px solid var(--line); padding: .5rem .7rem; }
.language-switcher { display: inline-flex; align-items: center; gap: .45rem; color: var(--blue-soft); font-size: .68rem; letter-spacing: .08em; }
.language-switcher select { min-height: 38px; padding: .35rem .45rem; color: var(--white); background: rgba(7,22,36,.9); border: 1px solid rgba(53,185,255,.38); border-radius: 0; cursor: pointer; }
.language-switcher select:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

.hero {
  min-height: 100vh;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(370px, .95fr);
  gap: 4rem;
  align-items: center;
  padding: 120px max(28px, calc((100vw - var(--max)) / 2)) 80px;
  background:
    radial-gradient(circle at 76% 28%, rgba(39,139,255,.14), transparent 30%),
    radial-gradient(circle at 24% 84%, rgba(53,185,255,.07), transparent 28%),
    linear-gradient(135deg, #020814 0%, #030b16 47%, #071624 100%);
  isolation: isolate;
}
.hero::after { content: ""; position: absolute; inset: auto 0 0; height: 1px; background: linear-gradient(90deg, transparent, var(--blue), transparent); opacity: .4; }
.starfield {
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .82;
  filter: saturate(1.18) contrast(1.08);
  background-image:
    linear-gradient(90deg, rgba(2,8,20,.88), rgba(2,8,20,.05)),
    radial-gradient(circle at 7% 19%, rgba(255,255,255,.82) 0 1px, transparent 1.7px),
    radial-gradient(circle at 16% 42%, rgba(120,200,255,.72) 0 1.2px, transparent 2px),
    radial-gradient(circle at 27% 11%, rgba(255,255,255,.58) 0 .8px, transparent 1.6px),
    radial-gradient(circle at 34% 68%, rgba(255,255,255,.76) 0 1px, transparent 1.8px),
    radial-gradient(circle at 43% 29%, rgba(120,200,255,.64) 0 .8px, transparent 1.5px),
    radial-gradient(circle at 55% 13%, rgba(255,255,255,.86) 0 1.3px, transparent 2px),
    radial-gradient(circle at 61% 61%, rgba(255,255,255,.48) 0 .7px, transparent 1.5px),
    radial-gradient(circle at 69% 35%, rgba(120,200,255,.76) 0 1px, transparent 1.9px),
    radial-gradient(circle at 77% 74%, rgba(255,255,255,.66) 0 .9px, transparent 1.7px),
    radial-gradient(circle at 85% 18%, rgba(255,255,255,.92) 0 1.2px, transparent 2.1px),
    radial-gradient(circle at 92% 52%, rgba(120,200,255,.54) 0 .8px, transparent 1.6px),
    radial-gradient(circle at 96% 83%, rgba(255,255,255,.7) 0 1px, transparent 1.8px),
    url('assets/polaris-star.jpg');
  background-size: cover;
  background-position: center, center, center, center, center, center, center, center, center, center, center, center, center, center 38%;
  mask-image: linear-gradient(to bottom, black, transparent 92%);
}
.starfield::before,
.starfield::after { content: ""; position: absolute; left: 0; top: 0; border-radius: 50%; pointer-events: none; }
.starfield::before {
  width: 1px;
  height: 1px;
  background: rgba(255,255,255,.78);
  box-shadow:
    3vw 8vh rgba(255,255,255,.72), 7vw 31vh rgba(120,200,255,.66), 10vw 63vh rgba(255,255,255,.54),
    13vw 17vh rgba(255,255,255,.83), 17vw 48vh rgba(120,200,255,.72), 20vw 77vh rgba(255,255,255,.64),
    23vw 28vh rgba(255,255,255,.48), 26vw 58vh rgba(120,200,255,.78), 29vw 12vh rgba(255,255,255,.66),
    32vw 84vh rgba(255,255,255,.58), 35vw 39vh rgba(120,200,255,.62), 38vw 69vh rgba(255,255,255,.8),
    41vw 21vh rgba(255,255,255,.56), 44vw 52vh rgba(120,200,255,.74), 47vw 91vh rgba(255,255,255,.58),
    50vw 34vh rgba(255,255,255,.86), 53vw 73vh rgba(120,200,255,.58), 56vw 15vh rgba(255,255,255,.64),
    59vw 46vh rgba(255,255,255,.76), 62vw 87vh rgba(120,200,255,.7), 65vw 26vh rgba(255,255,255,.5),
    68vw 66vh rgba(255,255,255,.88), 71vw 7vh rgba(120,200,255,.62), 74vw 43vh rgba(255,255,255,.6),
    77vw 79vh rgba(255,255,255,.7), 80vw 23vh rgba(120,200,255,.82), 83vw 57vh rgba(255,255,255,.48),
    86vw 93vh rgba(255,255,255,.72), 89vw 37vh rgba(120,200,255,.68), 92vw 71vh rgba(255,255,255,.8),
    95vw 14vh rgba(255,255,255,.56), 98vw 51vh rgba(120,200,255,.74), 5vw 88vh rgba(255,255,255,.68),
    11vw 72vh rgba(255,255,255,.5), 18vw 6vh rgba(120,200,255,.65), 25vw 94vh rgba(255,255,255,.75),
    31vw 47vh rgba(255,255,255,.64), 37vw 25vh rgba(120,200,255,.56), 42vw 79vh rgba(255,255,255,.84),
    49vw 8vh rgba(255,255,255,.52), 54vw 59vh rgba(120,200,255,.78), 60vw 19vh rgba(255,255,255,.72),
    67vw 89vh rgba(255,255,255,.6), 73vw 32vh rgba(120,200,255,.7), 79vw 68vh rgba(255,255,255,.82),
    84vw 11vh rgba(255,255,255,.5), 90vw 83vh rgba(120,200,255,.76), 96vw 29vh rgba(255,255,255,.68),
    8vw 54vh rgba(255,255,255,.84), 15vw 81vh rgba(120,200,255,.6), 22vw 42vh rgba(255,255,255,.7),
    28vw 74vh rgba(255,255,255,.56), 34vw 5vh rgba(120,200,255,.8), 40vw 57vh rgba(255,255,255,.66),
    46vw 30vh rgba(255,255,255,.78), 52vw 96vh rgba(120,200,255,.52), 58vw 64vh rgba(255,255,255,.72),
    64vw 10vh rgba(255,255,255,.6), 70vw 54vh rgba(120,200,255,.84), 76vw 3vh rgba(255,255,255,.7),
    82vw 47vh rgba(255,255,255,.56), 88vw 65vh rgba(120,200,255,.72), 94vw 90vh rgba(255,255,255,.78);
}
.starfield::after {
  width: 2px;
  height: 2px;
  background: rgba(255,255,255,.94);
  box-shadow:
    6vw 24vh 3px rgba(120,200,255,.78), 14vw 58vh 2px rgba(255,255,255,.82),
    21vw 10vh 3px rgba(255,255,255,.88), 27vw 70vh 3px rgba(120,200,255,.8),
    33vw 33vh 2px rgba(255,255,255,.86), 39vw 87vh 3px rgba(255,255,255,.74),
    45vw 16vh 3px rgba(120,200,255,.9), 51vw 62vh 2px rgba(255,255,255,.8),
    57vw 41vh 3px rgba(255,255,255,.9), 63vw 78vh 2px rgba(120,200,255,.82),
    69vw 18vh 3px rgba(255,255,255,.76), 75vw 61vh 3px rgba(255,255,255,.88),
    81vw 36vh 2px rgba(120,200,255,.92), 87vw 75vh 3px rgba(255,255,255,.78),
    93vw 20vh 2px rgba(255,255,255,.9), 97vw 60vh 3px rgba(120,200,255,.8),
    11vw 92vh 2px rgba(255,255,255,.84), 30vw 52vh 3px rgba(120,200,255,.76),
    48vw 82vh 2px rgba(255,255,255,.9), 72vw 94vh 3px rgba(255,255,255,.78),
    90vw 49vh 2px rgba(120,200,255,.86);
  filter: drop-shadow(0 0 3px rgba(53,185,255,.72));
}
.hero-orbit { position: absolute; z-index: -1; width: 760px; height: 760px; right: -190px; top: 2%; border: 1px solid rgba(53,185,255,.15); border-radius: 50%; transform: rotate(-22deg) scaleY(.33); }
.orbit-two { width: 1030px; height: 1030px; right: -300px; top: -5%; border-color: rgba(121,227,77,.08); }
.eyebrow, .section-kicker { color: var(--blue-soft); font-size: .8rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.eyebrow span { display: inline-block; width: 38px; height: 1px; margin: 0 .7rem .25rem 0; background: var(--blue); box-shadow: 0 0 8px var(--blue); }
h1, h2 { margin: 1.2rem 0; font-family: Bahnschrift, "Arial Narrow", Arial, sans-serif; font-weight: 500; letter-spacing: -.035em; line-height: 1.08; }
h1 { font-size: clamp(3.2rem, 6.7vw, 6.8rem); }
h1 em, h2 span { color: var(--blue); font-style: normal; text-shadow: 0 0 28px rgba(53,185,255,.28); }
.hero-copy { max-width: 650px; color: var(--muted); font-size: 1.1rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin: 2.2rem 0 2.8rem; }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 48px; padding: .78rem 1.2rem; border: 1px solid transparent; text-transform: uppercase; letter-spacing: .1em; font-size: .8rem; font-weight: 700; cursor: pointer; }
.button-primary { background: linear-gradient(110deg, #0b8ed0, var(--blue)); color: #00101d; box-shadow: 0 0 28px rgba(53,185,255,.24); }
.button-primary:hover, .button-primary:focus-visible { filter: brightness(1.13); }
.button-ghost { border-color: var(--line); color: var(--white); background: rgba(7,22,36,.48); }
.hero-proof { display: flex; gap: 1.7rem; color: var(--muted); font-size: .82rem; letter-spacing: .09em; text-transform: uppercase; }
.hero-proof b { color: var(--blue); margin-right: .4rem; }
.project-phase { width: fit-content; margin: -1.25rem 0 2.2rem; padding: .72rem .85rem; display: flex; flex-wrap: wrap; gap: .4rem 1rem; border: 1px solid rgba(53,185,255,.24); background: rgba(2,8,20,.58); font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }
.project-phase strong { color: var(--blue-soft); }
.project-phase span { color: var(--muted); }

.hero-visual { position: relative; min-height: 520px; display: flex; align-items: center; justify-content: center; }
.north-star { position: absolute; top: clamp(120px, 22%, 165px); right: 15%; width: 4px; height: 4px; background: rgba(255,255,255,.9); border-radius: 50%; opacity: .58; box-shadow: 0 0 4px 1px white, 0 0 12px 4px var(--blue), 0 0 34px 11px rgba(53,185,255,.24); }
.north-star::before, .north-star::after { content: ""; position: absolute; left: 50%; top: 50%; background: linear-gradient(90deg, transparent, white, transparent); transform: translate(-50%,-50%); }
.north-star::before { width: 74px; height: 1px; }
.north-star::after { width: 1px; height: 74px; background: linear-gradient(transparent, white, transparent); }
.dashboard-card { width: min(100%, 520px); padding: 2rem; background: linear-gradient(145deg, rgba(9,26,45,.94), rgba(3,11,22,.82)); border: 1px solid rgba(53,185,255,.24); box-shadow: 0 28px 90px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.05); transform: perspective(1100px) rotateY(-5deg) rotateX(3deg); }
.card-topline { display: flex; justify-content: space-between; color: var(--muted); font-size: .75rem; letter-spacing: .14em; }
.card-topline i { color: var(--green); font-style: normal; }
.balance { margin-top: 1.35rem; font: 500 clamp(2rem, 4vw, 3.2rem)/1 Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.trend { margin-top: .75rem; color: var(--muted); font-size: .86rem; }
.trend span { color: var(--green); margin-right: .35rem; }
.chart { margin: 1.7rem -1rem .8rem; }
.chart svg { width: 100%; overflow: visible; }
.chart-grid { fill: none; stroke: rgba(158,179,200,.12); }
.area { fill: url(#area); }
.line { fill: none; stroke: var(--blue); stroke-width: 2.5; filter: drop-shadow(0 0 6px var(--blue)); }
.mini-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; border-top: 1px solid var(--line); padding-top: 1.2rem; }
.mini-metrics div { display: flex; flex-direction: column; gap: .2rem; }
.mini-metrics span { color: var(--muted); font-size: .8rem; }
.mini-metrics strong { font-family: Bahnschrift, "Arial Narrow", Arial, sans-serif; font-size: 1rem; }
.green { color: var(--green); }
.scroll-cue { position: absolute; bottom: 24px; left: 50%; width: 24px; height: 40px; border: 1px solid rgba(158,179,200,.38); border-radius: 20px; }
.scroll-cue span { position: absolute; width: 3px; height: 7px; border-radius: 2px; background: var(--blue); left: 10px; top: 8px; animation: scroll 1.8s infinite; }
@keyframes scroll { 0% { transform: translateY(0); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(15px); opacity: 0; } }

.section { padding: 120px max(28px, calc((100vw - var(--max)) / 2)); }
.intro { background: linear-gradient(180deg, #030b16, #020814); }
.intro-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 5rem; align-items: end; }
h2 { font-size: clamp(2.4rem, 4.7vw, 4.6rem); }
.intro-grid p, .import-copy > p { color: var(--muted); font-size: 1.05rem; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 4.5rem; background: var(--line); border: 1px solid var(--line); }
.feature-card { position: relative; min-height: 330px; padding: 2rem; background: var(--ink); overflow: hidden; }
.feature-card.featured { background: linear-gradient(145deg, var(--panel-2), #04101f); }
.feature-number { position: absolute; right: 1.5rem; top: 1.4rem; color: rgba(120,200,255,.3); font: 500 .8rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.feature-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(53,185,255,.3); color: var(--blue); font-size: 1.5rem; }
.feature-card h3 { margin-top: 4.2rem; font: 500 1.3rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.feature-card p { color: var(--muted); font-size: 1rem; line-height: 1.7; }
.feature-glow { position: absolute; width: 150px; height: 150px; border-radius: 50%; right: -70px; bottom: -70px; background: rgba(53,185,255,.15); filter: blur(35px); }
.project-goals { margin-top: 2rem; padding: 1.4rem 1.5rem; display: grid; grid-template-columns: 1.1fr repeat(3, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.project-goals > div { min-height: 118px; padding: 1.2rem; background: #020814; }
.project-goals-title { display: flex; flex-direction: column; justify-content: center; }
.project-goals-title span { color: var(--blue); font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.project-goals-title strong { margin-top: .5rem; font: 500 1.18rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.project-goals b { color: var(--blue); font: 500 .8rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.project-goals p { margin: .55rem 0 0; color: var(--muted); font-size: .92rem; line-height: 1.7; }

.audience-section { scroll-margin-top: 72px; background: radial-gradient(circle at 82% 24%, rgba(53,185,255,.12), transparent 28%), #030b16; border-top: 1px solid rgba(53,185,255,.12); }
.audience-head { display: grid; grid-template-columns: 1.15fr .85fr; gap: 5rem; align-items: end; }
.audience-head h2 { margin-bottom: 0; }
.audience-head > p { margin: 0; color: var(--muted); font-size: 1.05rem; line-height: 1.75; }
.audience-layout { margin-top: 4rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; padding: 1px; background: var(--line); }
.audience-profile, .benefit-panel { min-height: 590px; padding: 2.5rem; background: #020814; }
.audience-label { margin: 0; color: var(--blue-soft); font-size: .8rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.audience-list { margin: 2rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.audience-list li { padding: 1.35rem 0; display: grid; grid-template-columns: 42px 1fr; gap: 1rem; border-bottom: 1px solid var(--line); }
.audience-list b, .benefit-list b { color: var(--blue); font: 500 .84rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.audience-list div, .benefit-list p { margin: 0; display: flex; flex-direction: column; gap: .45rem; }
.audience-list strong, .benefit-list strong { font-size: 1rem; }
.audience-list span, .benefit-list span { color: var(--muted); font-size: .92rem; line-height: 1.65; }
.benefit-panel { position: relative; overflow: hidden; background: linear-gradient(145deg, var(--panel-2), #04101f); }
.benefit-panel::after { content: ""; position: absolute; width: 280px; height: 280px; right: -120px; bottom: -120px; border-radius: 50%; background: rgba(53,185,255,.14); filter: blur(50px); }
.benefit-star { position: absolute; right: 2.5rem; top: 2.2rem; color: white; font-size: 1rem; text-shadow: 0 0 7px white, 0 0 20px var(--blue), 0 0 44px var(--blue); }
.benefit-panel h3 { margin: 2.2rem 0 2.4rem; font: 500 clamp(2.2rem, 4vw, 4rem)/1.08 Bahnschrift, "Arial Narrow", Arial, sans-serif; letter-spacing: -.035em; }
.benefit-panel h3 span { color: var(--blue); }
.benefit-list { position: relative; z-index: 1; border-top: 1px solid var(--line); }
.benefit-list > div { padding: 1.15rem 0; display: grid; grid-template-columns: 42px 1fr; gap: 1rem; border-bottom: 1px solid var(--line); }
.benefit-note { position: relative; z-index: 1; margin: 1.5rem 0 0; padding-left: 1rem; color: var(--blue-soft); border-left: 2px solid var(--blue); font-size: .84rem; line-height: 1.7; }

.ten-second { scroll-margin-top: 72px; background: radial-gradient(circle at 18% 48%, rgba(53,185,255,.13), transparent 31%), linear-gradient(180deg, #020814, #061321); border-top: 1px solid rgba(53,185,255,.12); border-bottom: 1px solid rgba(53,185,255,.12); }
.ten-second-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 6rem; align-items: center; }
.ten-second-visual { position: relative; min-height: 500px; padding: 3rem; display: flex; flex-direction: column; justify-content: center; overflow: hidden; border: 1px solid rgba(53,185,255,.28); background: radial-gradient(circle at 50% 34%, rgba(53,185,255,.18), transparent 38%), rgba(2,8,20,.72); box-shadow: 0 30px 90px rgba(0,0,0,.38); }
.ten-second-visual::before, .ten-second-visual::after { content: ""; position: absolute; width: 420px; height: 420px; left: 50%; top: 34%; border: 1px solid rgba(53,185,255,.14); border-radius: 50%; transform: translate(-50%,-50%) scaleY(.32) rotate(-18deg); }
.ten-second-visual::after { width: 560px; height: 560px; border-color: rgba(121,227,77,.07); transform: translate(-50%,-50%) scaleY(.32) rotate(15deg); }
.ten-second-star { position: absolute; right: 20%; top: 16%; color: white; font-size: 1.2rem; text-shadow: 0 0 8px white, 0 0 25px var(--blue), 0 0 55px var(--blue); }
.ten-second-number { position: relative; z-index: 1; color: var(--white); font: 700 clamp(7rem, 14vw, 12rem)/.78 Bahnschrift, "Arial Narrow", Arial, sans-serif; letter-spacing: -.08em; text-shadow: 0 0 38px rgba(53,185,255,.22); }
.ten-second-unit { position: relative; z-index: 1; margin-top: 1.2rem; color: var(--blue); font: 600 1rem Bahnschrift, "Arial Narrow", Arial, sans-serif; letter-spacing: .28em; text-transform: uppercase; }
.ten-second-visual p { position: relative; z-index: 1; margin: 2.5rem 0 0; color: var(--muted); font-size: .92rem; letter-spacing: .045em; line-height: 1.85; text-transform: uppercase; }
.ten-second-copy h2 { margin-bottom: 1.5rem; }
.ten-second-lead { max-width: 720px; color: var(--muted); font-size: 1.05rem; }
.decision-steps { margin: 2.2rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.decision-steps li { padding: 1.15rem 0; display: grid; grid-template-columns: 44px 1fr; gap: 1rem; border-bottom: 1px solid var(--line); }
.decision-steps b { color: var(--blue); font: 500 .84rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.decision-steps div { display: grid; grid-template-columns: 150px 1fr; gap: 1.5rem; }
.decision-steps strong { font-size: 1rem; }
.decision-steps span { color: var(--muted); font-size: .92rem; line-height: 1.6; }
.ten-second-note { margin: 1.7rem 0 0; padding-left: 1rem; color: var(--blue-soft); border-left: 2px solid var(--blue); font-size: .88rem; line-height: 1.7; }

.dashboard-section { scroll-margin-top: 72px; background: radial-gradient(circle at 85% 12%, rgba(53,185,255,.12), transparent 28%), #020814; border-top: 1px solid rgba(53,185,255,.12); }
.dashboard-section-head { display: grid; grid-template-columns: 1.08fr .92fr; gap: 5rem; align-items: end; margin-bottom: 3.5rem; }
.dashboard-section-head h2 { margin-bottom: 0; }
.dashboard-section-copy { color: var(--muted); font-size: 1.02rem; }
.dashboard-section-copy p:first-child { margin-top: 0; }
.preview-disclaimer { margin: 1.35rem 0 0; padding-left: 1rem; border-left: 2px solid var(--blue); font-size: .9rem; line-height: 1.7; }
.preview-disclaimer strong { color: var(--blue-soft); text-transform: uppercase; letter-spacing: .08em; }
.dashboard-gallery { display: grid; gap: 1.35rem; }
.dashboard-preview { position: relative; width: 100%; padding: 0; display: block; overflow: hidden; color: var(--white); text-align: left; background: #01050d; border: 1px solid rgba(53,185,255,.32); box-shadow: 0 34px 100px rgba(0,0,0,.55), 0 0 55px rgba(53,185,255,.08); cursor: zoom-in; }
.dashboard-preview::after { content: ""; position: absolute; inset: 38px 0 0; background: linear-gradient(180deg, transparent 68%, rgba(0,5,14,.58)); pointer-events: none; opacity: .55; transition: opacity .25s ease; }
.dashboard-preview img { width: 100%; max-width: 100%; height: auto; display: block; object-fit: contain; object-position: center; transition: filter .35s ease; }
.dashboard-preview:hover img, .dashboard-preview:focus-visible img { filter: brightness(1.07); }
.dashboard-preview:hover::after, .dashboard-preview:focus-visible::after { opacity: .2; }
.dashboard-preview--detail { box-shadow: 0 24px 70px rgba(0,0,0,.48), 0 0 40px rgba(53,185,255,.06); }
.preview-toolbar { height: 38px; padding: 0 1rem; display: flex; align-items: center; gap: .45rem; color: var(--muted); background: linear-gradient(180deg, #0a192a, #06111f); border-bottom: 1px solid rgba(53,185,255,.2); }
.preview-toolbar i { width: 7px; height: 7px; display: block; border-radius: 50%; background: rgba(158,179,200,.35); }
.preview-toolbar i:first-child { background: rgba(53,185,255,.75); box-shadow: 0 0 8px rgba(53,185,255,.65); }
.preview-toolbar b { margin-left: auto; font-size: .7rem; letter-spacing: .15em; font-weight: 600; }
.preview-action, .preview-badge { position: absolute; z-index: 2; padding: .48rem .7rem; border: 1px solid rgba(53,185,255,.32); background: rgba(2,8,20,.84); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; }
.preview-action { right: 1rem; bottom: 1rem; color: var(--blue-soft); }
.preview-badge { left: 1rem; bottom: 1rem; color: var(--green); }

.import-section { display: grid; grid-template-columns: 1fr 1fr; gap: 7rem; align-items: center; background: #030b16; }
.import-visual { min-height: 520px; position: relative; border: 1px solid var(--line); background: radial-gradient(circle at 50% 48%, rgba(53,185,255,.12), transparent 38%), linear-gradient(145deg, rgba(7,22,36,.72), rgba(2,8,20,.9)); overflow: hidden; }
.constellation { position: absolute; inset: 0; }
.node { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 12px var(--blue); }
.n1 { left: 18%; top: 22%; }.n2 { left: 81%; top: 17%; }.n3 { left: 14%; bottom: 19%; }.n4 { right: 13%; bottom: 23%; }
.beam { position: absolute; height: 1px; transform-origin: left; background: linear-gradient(90deg, transparent, rgba(53,185,255,.7), transparent); }
.b1 { width: 68%; left: 17%; top: 23%; transform: rotate(24deg); }.b2 { width: 70%; left: 13%; bottom: 20%; transform: rotate(-28deg); }.b3 { width: 57%; left: 22%; top: 51%; }
.source-card, .core-card { position: absolute; display: flex; flex-direction: column; border: 1px solid rgba(53,185,255,.22); background: rgba(3,11,22,.88); box-shadow: 0 14px 50px rgba(0,0,0,.42); }
.source-card { width: 180px; padding: 1rem; }
.source-one { top: 15%; left: 8%; }.source-two { bottom: 14%; right: 6%; }
.source-card small, .core-card small { color: var(--muted); font-size: .66rem; letter-spacing: .14em; }
.source-card strong { margin: .25rem 0 .7rem; font-size: .92rem; }
.source-card span { color: var(--green); font-size: .72rem; text-transform: uppercase; }
.core-card { width: 190px; height: 190px; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(45deg); align-items: center; justify-content: center; }
.core-card > * { transform: rotate(-45deg); }
.core-card span { color: var(--blue); font-size: 2rem; filter: drop-shadow(0 0 10px var(--blue)); }
.core-card strong { font: 600 1rem Bahnschrift, "Arial Narrow", Arial, sans-serif; letter-spacing: .16em; }
.steps { list-style: none; padding: 0; margin: 2.5rem 0 0; }
.steps li { display: flex; gap: 1rem; padding: 1.15rem 0; border-bottom: 1px solid var(--line); }
.steps li > span { color: var(--blue); font: 500 .86rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.steps div { display: flex; flex-direction: column; }
.steps strong { font-size: 1rem; }
.steps small { color: var(--muted); font-size: .88rem; line-height: 1.6; }
.privacy-callout { position: relative; margin-top: 2rem; padding: 1.5rem; overflow: hidden; border: 1px solid rgba(53,185,255,.3); background: linear-gradient(145deg, rgba(9,26,45,.88), rgba(3,11,22,.92)); }
.privacy-callout::after { content: ""; position: absolute; width: 160px; height: 160px; right: -75px; bottom: -75px; border-radius: 50%; background: rgba(53,185,255,.13); filter: blur(32px); }
.privacy-callout-head { position: relative; z-index: 1; display: flex; align-items: center; gap: .65rem; color: var(--blue); font-size: .76rem; letter-spacing: .16em; text-transform: uppercase; }
.privacy-callout-head span { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(53,185,255,.36); font-size: 1rem; }
.privacy-callout h3 { position: relative; z-index: 1; margin: 1.2rem 0 .8rem; font: 500 1.45rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.privacy-callout p { position: relative; z-index: 1; margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.7; }
.privacy-callout .third-party-note { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.third-party-note strong { color: var(--white); }
.privacy-callout .privacy-summary { margin-top: 1rem; color: var(--blue-soft); font-weight: 700; }

.principle { position: relative; text-align: center; background: radial-gradient(circle at 50% 0, rgba(53,185,255,.12), transparent 55%); }
.principle-line { width: 1px; height: 82px; margin: -120px auto 3rem; background: linear-gradient(var(--blue), transparent); }
.quote-mark { margin: 0; color: var(--blue); font: 5rem/1 Georgia, serif; opacity: .55; }
blockquote { margin: 0 auto; max-width: 960px; font: 500 clamp(1.7rem, 3.5vw, 3.3rem)/1.35 Bahnschrift, "Arial Narrow", Arial, sans-serif; }
blockquote span { color: var(--blue-soft); }
.motto { margin-top: 2.4rem; color: var(--muted); font-size: .76rem; letter-spacing: .26em; }

.contact { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center; background: linear-gradient(135deg, #071624, #020814); border-top: 1px solid var(--line); }
.contact-panel { padding: 2rem; border: 1px solid var(--line); background: rgba(3,11,22,.62); }
.contact-panel > p, .form-note { color: var(--muted); }
.status-chip { width: fit-content; margin-bottom: 1.25rem; padding: .42rem .65rem; color: var(--green); border: 1px solid rgba(91,255,65,.25); background: rgba(91,255,65,.05); font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.status-chip span { width: 7px; height: 7px; margin-right: .45rem; display: inline-block; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgba(91,255,65,.75); }
.status-list { margin: 1.5rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.status-list li { padding: .9rem 0; display: flex; justify-content: space-between; gap: 1.5rem; border-bottom: 1px solid var(--line); }
.status-list span { color: var(--muted); font-size: .84rem; }
.status-list strong { color: var(--white); font-size: .86rem; text-align: right; }
.status-note { margin: 1.25rem 0 0; font-size: .78rem; letter-spacing: .05em; text-transform: uppercase; }
.project-contact { margin: 1.35rem 0 0; padding-top: 1.15rem; border-top: 1px solid var(--line); font-size: .92rem; line-height: 1.7; }
.project-contact > p { margin: 0 0 .85rem; }
.project-contact-links { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.project-contact-links a { min-width: 0; padding: .75rem; display: flex; flex-direction: column; gap: .12rem; border: 1px solid var(--line); background: rgba(2,8,20,.45); }
.project-contact-links a span { color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.project-contact a, .footer-contact { color: var(--blue-soft); text-decoration: none; overflow-wrap: anywhere; }
.project-contact a:hover, .project-contact a:focus-visible, .footer-contact:hover, .footer-contact:focus-visible { color: var(--white); text-decoration: underline; text-underline-offset: .22em; }
label { display: block; margin: 1.6rem 0 .5rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .11em; color: var(--blue-soft); }
.field-row { display: flex; gap: .7rem; }
input { width: 100%; min-height: 48px; padding: 0 1rem; color: var(--white); background: #020814; border: 1px solid rgba(158,179,200,.26); outline: none; }
input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(53,185,255,.12); }
.form-note { margin-bottom: 0; font-size: .84rem; }

footer { min-height: 150px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2rem max(28px, calc((100vw - var(--max)) / 2)); color: var(--muted); border-top: 1px solid var(--line); font-size: .88rem; }
footer .brand { color: var(--white); }
footer p:last-child { text-align: right; line-height: 1.7; }
.footer-links { display: inline-flex; gap: .9rem; }

.subpage { min-height: 100vh; background: radial-gradient(circle at 82% 10%, rgba(53,185,255,.13), transparent 28%), linear-gradient(145deg, #020814, #071624 56%, #020814); }
.subpage-hero { position: relative; min-height: 520px; display: flex; align-items: end; padding: 150px max(28px, calc((100vw - var(--max)) / 2)) 90px; overflow: hidden; border-bottom: 1px solid var(--line); }
.subpage-hero::before { content: ""; position: absolute; width: 520px; height: 520px; right: -90px; top: 90px; border: 1px solid rgba(53,185,255,.18); border-radius: 50%; transform: scaleY(.34) rotate(-22deg); }
.subpage-hero::after { content: "✦"; position: absolute; right: 17%; top: 150px; color: white; font-size: 1.7rem; text-shadow: 0 0 8px white, 0 0 22px var(--blue), 0 0 55px var(--blue); }
.subpage-hero-content { position: relative; z-index: 1; max-width: 850px; }
.subpage-hero h1 { margin-bottom: 1.5rem; }
.subpage-hero p { max-width: 720px; color: var(--muted); font-size: 1.08rem; }
.project-section { background: linear-gradient(180deg, #030b16, #020814); }
.project-section-head { display: grid; grid-template-columns: 1fr .7fr; gap: 4rem; align-items: end; margin-bottom: 3.5rem; }
.project-section-head h2 { margin-bottom: 0; }
.project-section-head p { color: var(--muted); }
.project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.project-card { position: relative; min-height: 390px; padding: 2rem; display: flex; flex-direction: column; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(9,26,45,.94), rgba(3,11,22,.92)); overflow: hidden; }
.project-card::after { content: ""; position: absolute; width: 190px; height: 190px; right: -95px; bottom: -95px; border-radius: 50%; background: rgba(53,185,255,.12); filter: blur(28px); }
.project-media { position: relative; margin: -2rem -2rem 1.8rem; padding: 0; aspect-ratio: 3 / 2; display: block; overflow: hidden; color: var(--white); background: #01050d; border: 0; border-bottom: 1px solid rgba(53,185,255,.22); cursor: zoom-in; }
.project-media img { width: 100%; height: 100%; display: block; object-fit: contain; transition: transform .35s ease, filter .35s ease; }
.project-media span { position: absolute; right: 1rem; bottom: 1rem; padding: .42rem .62rem; background: rgba(2,8,20,.82); border: 1px solid var(--line); color: var(--blue-soft); font-size: .76rem; letter-spacing: .09em; text-transform: uppercase; opacity: 0; transform: translateY(5px); transition: opacity .2s ease, transform .2s ease; }
.project-media:hover img, .project-media:focus-visible img { transform: scale(1.018); filter: brightness(1.08); }
.project-media:hover span, .project-media:focus-visible span { opacity: 1; transform: translateY(0); }
.project-meta { display: flex; justify-content: space-between; gap: 1rem; color: var(--blue-soft); font-size: .82rem; letter-spacing: .13em; text-transform: uppercase; }
.project-status { color: var(--green); }
.project-card h3 { margin: 3.6rem 0 1rem; font: 600 clamp(1.7rem, 3vw, 2.6rem)/1.1 Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.project-card > p { max-width: 560px; color: var(--muted); }
.project-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin: auto 0 1.6rem; padding-top: 2rem; }
.project-tags span { padding: .35rem .6rem; border: 1px solid var(--line); color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .07em; }
.project-actions { display: flex; align-items: center; gap: .75rem; position: relative; z-index: 1; }
.button-disabled { cursor: not-allowed; color: #71849a; border-color: rgba(158,179,200,.14); background: rgba(7,22,36,.35); }
.project-empty { border-style: dashed; justify-content: center; }
.project-empty h3 { margin-top: 1rem; }
.project-note { color: var(--muted); font-size: .9rem; }
.project-cta { display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: center; margin-top: 5rem; padding: 2.2rem; border: 1px solid rgba(53,185,255,.28); background: linear-gradient(110deg, rgba(7,22,36,.9), rgba(9,26,45,.54)); }
.project-cta h3 { margin: 0 0 .5rem; font: 600 1.4rem Bahnschrift, "Arial Narrow", Arial, sans-serif; }
.project-cta p { margin: 0; color: var(--muted); }
.image-dialog { width: calc(100vw - 24px); height: calc(100vh - 24px); max-width: none; max-height: none; padding: 0; overflow: hidden; color: var(--white); background: #020814; border: 1px solid rgba(53,185,255,.4); box-shadow: 0 30px 120px rgba(0,0,0,.82); }
.image-dialog[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.image-dialog::backdrop { background: rgba(0,4,12,.88); backdrop-filter: blur(7px); }
.image-dialog-toolbar { min-height: 56px; padding: .55rem .65rem .55rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--muted); background: linear-gradient(180deg, #0a192a, #06111f); border-bottom: 1px solid rgba(53,185,255,.22); font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; }
.image-dialog-toolbar > div { display: flex; align-items: center; gap: .55rem; }
.image-dialog-stage { min-width: 0; min-height: 0; display: grid; place-items: center; overflow: auto; background: #000; overscroll-behavior: contain; }
.image-dialog-stage.is-zoomed { place-items: start; }
.image-dialog img { width: auto; max-width: 100%; height: auto; max-height: 100%; display: block; object-fit: contain; background: #000; cursor: zoom-in; }
.image-dialog img.is-zoomed { width: 160%; max-width: none; max-height: none; cursor: zoom-out; }
.image-dialog p { margin: 0; padding: .9rem 3.7rem .9rem 1rem; color: var(--muted); font-size: .86rem; }
.image-dialog-zoom { min-height: 38px; padding: .5rem .75rem; color: var(--blue-soft); background: rgba(2,8,20,.7); border: 1px solid rgba(53,185,255,.35); font: 700 .72rem Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.image-dialog-zoom:hover, .image-dialog-zoom:focus-visible { color: var(--white); border-color: var(--blue); }
.image-dialog-close { width: 40px; height: 40px; display: grid; place-items: center; color: var(--white); background: rgba(2,8,20,.84); border: 1px solid rgba(255,255,255,.28); font-size: 1.7rem; line-height: 1; cursor: pointer; }
.image-dialog-close:hover, .image-dialog-close:focus-visible { border-color: var(--blue); color: var(--blue); }

@media (max-width: 900px) {
  .menu-toggle { display: block; }
  nav { position: absolute; left: 20px; right: 20px; top: 68px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 1rem; background: rgba(3,11,22,.98); border: 1px solid var(--line); }
  nav.open { display: flex; }
  nav a { padding: .9rem; }
  .language-switcher { justify-content: space-between; padding: .75rem .9rem .2rem; }
  .language-switcher select { min-width: 76px; }
  .hero { grid-template-columns: 1fr; gap: 1rem; padding-top: 130px; }
  .hero-visual { min-height: 440px; }
  .intro-grid, .audience-head, .audience-layout, .ten-second-layout, .dashboard-section-head, .import-section, .contact { grid-template-columns: 1fr; gap: 2.5rem; }
  .project-section-head, .project-cta { grid-template-columns: 1fr; gap: 1.5rem; }
  .feature-grid { grid-template-columns: 1fr; }
  .project-goals { grid-template-columns: 1fr 1fr; }
  .project-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 240px; }
  .ten-second-visual { min-height: 390px; }
}

@media (max-width: 560px) {
  .site-header { height: 66px; }
  .hero { padding-left: 20px; padding-right: 20px; }
  .section { padding: 88px 20px; }
  h1 { font-size: clamp(2.7rem, 15vw, 4.4rem); }
  .hero-proof { flex-direction: column; gap: .55rem; }
  .dashboard-card { padding: 1.25rem; transform: none; }
  .hero-visual { min-height: 360px; }
  .north-star { top: 105px; right: 19%; }
  .subpage-hero { min-height: 460px; padding: 125px 20px 70px; }
  .subpage-hero::after { top: 112px; right: 20%; }
  .mini-metrics { grid-template-columns: 1fr; }
  .import-visual { min-height: 430px; }
  .source-card { width: 145px; }
  .core-card { width: 145px; height: 145px; }
  .decision-steps div { grid-template-columns: 1fr; gap: .35rem; }
  .project-goals { grid-template-columns: 1fr; }
  .project-goals > div { min-height: 0; }
  .project-contact-links { grid-template-columns: 1fr; }
  .audience-layout { gap: 1px; }
  .audience-profile, .benefit-panel { min-height: 0; padding: 1.6rem; }
  .benefit-star { right: 1.6rem; top: 1.45rem; }
  .image-dialog { width: calc(100vw - 10px); height: calc(100vh - 10px); }
  .image-dialog-toolbar { align-items: flex-start; }
  .image-dialog-toolbar > span { display: none; }
  .image-dialog-toolbar > div { width: 100%; justify-content: space-between; }
  .field-row { flex-direction: column; }
  footer { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}