
:root{
  --bg:#08111f;
  --bg-soft:#0f1a2d;
  --card:#101b31;
  --card-2:#0c1729;
  --text:#edf3ff;
  --muted:#9db2d7;
  --accent:#2bd4d9;
  --accent-2:#5aa7ff;
  --border:rgba(151, 173, 211, 0.18);
  --shadow:0 20px 60px rgba(0,0,0,.35);
  --radius:24px;
  --radius-sm:16px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(43,212,217,.13), transparent 28%),
    radial-gradient(circle at top right, rgba(90,167,255,.12), transparent 26%),
    linear-gradient(180deg,#07101c 0%,#0a1322 100%);
  min-height:100vh;
}
a{color:inherit}
img{max-width:100%;display:block}
.container{width:min(calc(100% - 32px), var(--max)); margin:0 auto}
.site-header{
  position:sticky; top:0; z-index:30;
  backdrop-filter: blur(16px);
  background:rgba(7,16,28,.72);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.site-header .inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:14px 0;
}
.brand{
  display:flex; align-items:center; gap:14px; text-decoration:none;
}
.brand-badge{
  width:42px; height:42px; border-radius:14px;
  background:linear-gradient(145deg,var(--accent),var(--accent-2));
  box-shadow:0 8px 24px rgba(43,212,217,.25);
}
.brand-text strong{display:block; font-size:1rem; letter-spacing:.01em}
.brand-text span{display:block; font-size:.85rem; color:var(--muted)}
.topbar{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap; justify-content:flex-end;
}
.nav{
  display:flex; gap:10px; flex-wrap:wrap;
}
.nav a{
  text-decoration:none;
  color:var(--muted);
  padding:10px 14px;
  border-radius:999px;
  transition:.18s ease;
}
.nav a:hover, .nav a.active{
  color:var(--text);
  background:rgba(255,255,255,.06);
}
.lang-switcher{
  display:flex; align-items:center; gap:10px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:999px;
  background:rgba(255,255,255,.04);
}
.lang-switcher label{font-size:.9rem;color:var(--muted)}
.lang-switcher select{
  border:none; outline:none;
  color:var(--text); background:transparent; font:inherit;
}
main{padding:42px 0 72px}
.hero{
  display:grid;
  grid-template-columns: minmax(0,1.15fr) minmax(340px,.85fr);
  gap:32px;
  align-items:stretch;
  margin-bottom:32px;
}
.card{
  background:linear-gradient(180deg, rgba(16,27,49,.92), rgba(11,20,37,.96));
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.hero-copy{padding:36px}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px;
  background:rgba(255,255,255,.05);
  color:var(--muted); font-size:.88rem;
}
.hero h1{
  margin:18px 0 10px;
  font-size:clamp(2.4rem, 6vw, 4.6rem);
  line-height:1;
}
.hero .subtitle{
  margin:0 0 20px;
  font-size:clamp(1.05rem,2vw,1.4rem);
  color:#dbe7ff;
}
.hero .body{
  margin:0; color:var(--muted); font-size:1.05rem; max-width:60ch;
}
.button-row{
  display:flex; gap:14px; flex-wrap:wrap; margin-top:28px;
}
.button{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:48px; padding:0 18px; border-radius:999px;
  border:1px solid var(--border); text-decoration:none; font-weight:600;
  transition:.18s ease; cursor:pointer;
}
.button.primary{
  background:linear-gradient(135deg, var(--accent), #45b5ff);
  color:#04101c;
  border-color:transparent;
}
.button.secondary{
  background:rgba(255,255,255,.04); color:var(--text);
}
.button:hover{transform:translateY(-1px)}
.hero-visual{
  padding:18px;
  display:flex; align-items:center; justify-content:center;
}
.hero-visual img{
  width:100%; height:auto; object-fit:contain;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.07);
}
.grid{
  display:grid; gap:24px;
}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr));}
.section-card{padding:28px}
.section-title{
  margin:0 0 12px;
  font-size:1.45rem;
}
.section-text{
  margin:0; color:var(--muted); line-height:1.7;
}
.list{
  margin:18px 0 0; padding-left:20px;
  color:#dce8ff;
}
.list li{margin:0 0 12px; line-height:1.6}
.info-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:18px;
}
.info-item{
  padding:16px 18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
}
.info-item .label{
  display:block; font-size:.82rem; color:var(--muted); margin-bottom:6px;
}
.info-item .value{
  word-break:break-word;
  font-weight:600;
}
.badge-row{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:18px;
}
.badge{
  padding:10px 12px; border-radius:999px;
  font-size:.92rem;
  background:rgba(255,255,255,.05);
  color:#dce8ff;
  border:1px solid rgba(255,255,255,.08);
}
.image-grid{
  display:grid;
  grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr);
  gap:18px;
  margin-top:18px;
}
.image-card{
  overflow:hidden; border-radius:22px; border:1px solid var(--border);
  background:rgba(255,255,255,.03);
}
.image-card img{width:100%; height:auto; object-fit:contain}
.image-caption{
  padding:12px 16px; color:var(--muted); font-size:.92rem;
  border-top:1px solid rgba(255,255,255,.08);
}
.legal-layout{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.35fr); gap:24px;
}
.policy-card{padding:30px}
.policy-card h1{margin:0 0 10px; font-size:clamp(2rem,4vw,3rem)}
.policy-meta{
  color:var(--muted); line-height:1.8; margin-bottom:18px;
}
.policy-note{
  margin:20px 0 26px; padding:16px 18px;
  border-left:4px solid var(--accent);
  background:rgba(43,212,217,.08);
  border-radius:16px;
  color:#dce8ff;
}
.policy-section{
  padding-top:24px; margin-top:24px;
  border-top:1px solid rgba(255,255,255,.08);
}
.policy-section h2{margin:0 0 12px; font-size:1.22rem}
.policy-section p{margin:0 0 14px; color:#dbe7ff; line-height:1.75}
.side-panel{
  padding:24px; height:max-content; position:sticky; top:92px;
}
.side-panel h3{margin:0 0 12px}
.side-panel .stack{display:grid; gap:14px}
.side-panel .mini{
  padding:15px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}
.side-panel .mini strong{display:block; font-size:.82rem; color:var(--muted); margin-bottom:6px}
.side-panel .mini span, .side-panel .mini a{font-weight:600; word-break:break-word}
.site-footer{
  border-top:1px solid rgba(255,255,255,.08);
  padding:26px 0 40px;
}
.site-footer p{
  margin:0; color:var(--muted); line-height:1.7;
}
.small-links{
  display:flex; gap:12px; flex-wrap:wrap; margin-top:16px;
}
.small-links a{
  color:#dce8ff; text-decoration:none; padding:8px 12px;
  border:1px solid rgba(255,255,255,.08); border-radius:999px;
  background:rgba(255,255,255,.03);
}
@media (max-width: 980px){
  .hero, .legal-layout, .grid.two, .grid.three, .image-grid{
    grid-template-columns:1fr;
  }
  .side-panel{position:static}
}
@media (max-width: 720px){
  .site-header .inner{align-items:flex-start; flex-direction:column}
  .topbar{width:100%; justify-content:space-between}
  .nav{width:100%}
  .hero-copy, .section-card, .policy-card, .side-panel{padding:22px}
  .info-list{grid-template-columns:1fr}
  main{padding-top:28px}
}


.rich-text p{
  margin:0 0 14px;
  color:#dbe7ff;
  line-height:1.75;
}
.image-grid-single{
  grid-template-columns:1fr;
}
.home-card-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}
.home-card-grid .section-card{
  height:100%;
}
.home-card-grid .section-title{
  margin-bottom:14px;
}
.home-card-grid .list{
  margin-top:8px;
}
@media (max-width: 980px){
  .home-card-grid{
    grid-template-columns:1fr;
  }
}
