:root{
  --bg:#030712;
  --panel:#081426;
  --panel2:#0d2037;
  --text:#f8fbff;
  --muted:#a9bbd2;
  --blue:#22c7f3;
  --blue2:#4776ff;
  --pink:#ef477a;
  --gold:#ffbd59;
  --green:#4be19b;
  --line:rgba(130,205,255,.24);
  --strong-line:rgba(103,220,255,.48);
  --shadow:0 30px 90px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color:var(--text);
  background:
    linear-gradient(90deg,rgba(103,220,255,.06) 1px,transparent 1px),
    linear-gradient(rgba(103,220,255,.05) 1px,transparent 1px),
    linear-gradient(135deg,#02050d 0%,#061322 42%,#111122 70%,#070812 100%);
  background-size:52px 52px,52px 52px,auto;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 8% 10%,rgba(34,199,243,.22),transparent 28%),
    radial-gradient(circle at 85% 12%,rgba(239,71,122,.12),transparent 30%),
    linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.32));
}
a{color:inherit;text-decoration:none}
.page{min-height:100vh;overflow:hidden;position:relative}
.nav{
  width:min(1240px,calc(100% - 36px));
  margin:0 auto;
  padding:22px 0 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  position:relative;
  z-index:2;
}
.brand img{width:210px;height:auto;display:block}
.nav-actions{display:flex;align-items:center;gap:18px;color:var(--muted);font-weight:850}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  padding:14px 20px;
  font-weight:950;
  border:1px solid var(--line);
  transition:.2s transform,.2s filter,.2s border-color;
}
.btn:hover{transform:translateY(-2px);filter:brightness(1.08);border-color:var(--strong-line)}
.primary{
  background:linear-gradient(135deg,#22c7f3,#4776ff 48%,#ef477a);
  box-shadow:0 18px 44px rgba(55,143,255,.25);
  border:0;
  color:white;
}
.ghost,.nav-login{
  background:linear-gradient(135deg,rgba(38,185,255,.16),rgba(239,70,123,.10));
  border-color:rgba(120,200,255,.38);
  color:#f7fbff;
  box-shadow:0 12px 34px rgba(38,185,255,.12);
}
.hero{
  width:min(1240px,calc(100% - 36px));
  margin:36px auto 42px;
  min-height:560px;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:34px;
  align-items:center;
  position:relative;
}
.hero-copy,.hero-panel{min-width:0}
.eyebrow{
  margin:0 0 14px;
  color:#6bd7ff;
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:.78rem;
  font-weight:950;
}
.hero h1{
  margin:0 0 24px;
  font-size:clamp(2.8rem,5.2vw,5.15rem);
  line-height:.94;
  letter-spacing:-.055em;
  max-width:860px;
}
.lead{
  margin:0 0 28px;
  color:#d7e3f5;
  line-height:1.66;
  font-size:clamp(1.05rem,1.65vw,1.23rem);
  max-width:760px;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.hero-panel{
  border:1px solid var(--strong-line);
  border-radius:34px;
  padding:34px;
  background:
    radial-gradient(circle at 80% 0,rgba(255,189,89,.18),transparent 34%),
    linear-gradient(145deg,rgba(13,32,55,.84),rgba(16,17,38,.84));
  box-shadow:var(--shadow),0 0 70px rgba(34,199,243,.12);
}
.law-badge{
  display:inline-flex;
  border-radius:999px;
  padding:10px 14px;
  color:#061322;
  background:linear-gradient(135deg,#7bd5ff,#ffbd59);
  font-weight:950;
  margin-bottom:18px;
}
.hero-panel h2{
  margin:0 0 12px;
  font-size:clamp(2rem,3.5vw,3.15rem);
  line-height:1;
}
.hero-panel p{color:#c6d4e8;line-height:1.65;margin:0 0 24px}
.panel-metrics{display:grid;gap:12px}
.panel-metrics article{
  border:1px solid rgba(130,205,255,.18);
  border-radius:20px;
  padding:16px;
  background:rgba(255,255,255,.045);
}
.panel-metrics strong{display:block;font-size:1.08rem}
.panel-metrics span{display:block;color:#b9cae0;margin-top:4px}
.summary-strip{
  width:min(1180px,calc(100% - 36px));
  margin:0 auto 34px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.summary-strip article,.policy-card,.toc,.contact-section{
  border:1px solid var(--line);
  border-radius:28px;
  background:linear-gradient(145deg,rgba(15,35,60,.78),rgba(25,16,38,.72));
  box-shadow:0 20px 60px rgba(0,0,0,.22);
}
.summary-strip article{padding:24px}
.summary-strip strong{display:block;font-size:1.2rem;margin-bottom:8px}
.summary-strip span{display:block;color:#c6d4e8;line-height:1.55}
.policy-layout{
  width:min(1180px,calc(100% - 36px));
  margin:0 auto 90px;
  display:grid;
  grid-template-columns:290px 1fr;
  gap:22px;
  align-items:start;
}
.toc{
  position:sticky;
  top:18px;
  padding:20px;
  display:grid;
  gap:10px;
}
.toc strong{
  color:#6bd7ff;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.78rem;
  margin-bottom:6px;
}
.toc a{
  color:#c6d4e8;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid transparent;
  transition:.2s background,.2s border-color,.2s color;
}
.toc a:hover{background:rgba(255,255,255,.055);border-color:rgba(130,205,255,.2);color:#fff}
.policy-content{display:grid;gap:18px}
.policy-card{
  padding:30px;
  scroll-margin-top:20px;
  position:relative;
  overflow:hidden;
}
.policy-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(82,178,255,.07),transparent 38%,rgba(255,187,84,.045));
}
.policy-card>*{position:relative}
.policy-card h2{
  margin:0 0 14px;
  font-size:clamp(1.55rem,2.6vw,2.35rem);
  line-height:1.06;
}
.policy-card h3{margin:0 0 8px;font-size:1.05rem}
.policy-card p,.policy-card li{
  color:#d0dced;
  line-height:1.7;
  font-size:1rem;
}
.policy-card p{margin:0 0 14px}
.policy-card p:last-child{margin-bottom:0}
.policy-card a{color:#72d8ff;font-weight:850}
.legal-note{
  border-left:4px solid var(--gold);
  padding:14px 16px;
  border-radius:0 16px 16px 0;
  background:rgba(255,189,89,.1);
}
.data-grid,.principles,.security-list,.rights-flow{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin:18px 0;
}
.data-grid section,.principles article,.security-list article,.rights-flow article{
  border:1px solid rgba(130,205,255,.16);
  border-radius:20px;
  padding:18px;
  background:rgba(255,255,255,.04);
}
.data-grid p,.principles span,.security-list span,.rights-flow p{margin:0;color:#bfd0e5;line-height:1.58}
.principles strong,.security-list strong,.rights-flow strong{display:block;margin-bottom:7px}
.check-list{padding-left:0;list-style:none;display:grid;gap:10px;margin:18px 0 0}
.check-list li{
  position:relative;
  padding-left:32px;
  margin:0;
}
.check-list li:before{
  content:"";
  position:absolute;
  left:0;
  top:.42em;
  width:18px;
  height:18px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--green),var(--blue));
  box-shadow:0 0 20px rgba(75,225,155,.24);
}
.retention-table{
  display:grid;
  gap:10px;
  margin:18px 0;
}
.retention-table div{
  display:grid;
  grid-template-columns:210px 1fr;
  gap:14px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(130,205,255,.16);
  background:rgba(255,255,255,.04);
}
.retention-table span{color:#c8d7ea;line-height:1.55}
.rights-flow span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:14px;
  color:#071322;
  background:linear-gradient(135deg,#7bd5ff,#ffbd59);
  font-weight:950;
  margin-bottom:10px;
}
.contact-section{
  width:min(980px,calc(100% - 36px));
  margin:0 auto 60px;
  padding:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.contact-section h2{
  margin:0 0 10px;
  font-size:clamp(2rem,4vw,3.2rem);
  line-height:1;
}
.contact-section p{margin:0;color:#c6d4e8;line-height:1.65;max-width:620px}
footer{
  width:min(1180px,calc(100% - 36px));
  margin:0 auto;
  padding:30px 0 46px;
  color:#9cb0c8;
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}
footer a{color:#cfe8ff;font-weight:850}
@media(max-width:1040px){
  .hero,.policy-layout{grid-template-columns:1fr}
  .toc{position:relative;top:auto}
  .summary-strip{grid-template-columns:1fr}
}
@media(max-width:760px){
  body{overflow-x:hidden}
  .nav{width:calc(100% - 28px);align-items:flex-start;flex-direction:column}
  .brand img{width:170px}
  .nav-actions{width:100%;gap:10px;overflow:auto;padding-bottom:4px}
  .nav-actions a{white-space:nowrap}
  .hero,.summary-strip,.policy-layout,.contact-section,footer{width:calc(100% - 28px)}
  .hero{margin-top:18px;min-height:auto}
  .hero h1{font-size:clamp(2.2rem,11vw,3rem);letter-spacing:-.035em}
  .hero-panel,.policy-card,.contact-section{padding:24px}
  .data-grid,.principles,.security-list,.rights-flow{grid-template-columns:1fr}
  .retention-table div{grid-template-columns:1fr}
  .contact-section{align-items:flex-start;flex-direction:column}
}
