@font-face {
  font-family: "Paperlogy";
  src: url("assets/fonts/Paperlogy-5Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Paperlogy";
  src: url("assets/fonts/Paperlogy-7Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Paperlogy";
  src: url("assets/fonts/Paperlogy-9Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg:#050713; --panel:rgba(255,255,255,.075); --panel-strong:rgba(255,255,255,.12);
  --text:#f8fbff; --muted:#b8c2d7; --line:rgba(255,255,255,.14);
  --accent:#8ed9ff; --accent-2:#ffd76a; --radius:28px; --max:1120px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:"Paperlogy",ui-sans-serif,-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",sans-serif;color:var(--text);background:radial-gradient(circle at 20% 0%,#14234d 0%,transparent 36%),radial-gradient(circle at 80% 10%,#2b1650 0%,transparent 34%),var(--bg);line-height:1.6}
a{color:inherit;text-decoration:none}
.space-bg{position:fixed;inset:0;z-index:-1;background-image:radial-gradient(circle,rgba(255,255,255,.9) 0 1px,transparent 1.5px),radial-gradient(circle,rgba(142,217,255,.8) 0 1px,transparent 1.5px),radial-gradient(circle,rgba(255,215,106,.8) 0 1px,transparent 1.5px);background-size:160px 160px,230px 230px,310px 310px;background-position:0 0,42px 80px,120px 20px;opacity:.28;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.site-header{width:min(var(--max),calc(100% - 40px));margin:0 auto;padding:22px 0;display:flex;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:12px;font-weight:700;letter-spacing:-.02em}.brand-mark{width:38px;height:38px;border-radius:12px}
.nav{display:flex;gap:24px;color:var(--muted);font-size:14px}.nav a:hover{color:var(--text)}
.hero{width:min(var(--max),calc(100% - 40px));min-height:760px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:48px;padding:64px 0 96px}
.eyebrow{margin:0 0 14px;color:var(--accent);font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
h1,h2,h3,p{margin-top:0} h1{margin-bottom:24px;font-size:clamp(64px,10vw,132px);line-height:.88;letter-spacing:-.08em}
h2{margin-bottom:20px;font-size:clamp(34px,5vw,64px);line-height:1.03;letter-spacing:-.055em}
h3{margin-bottom:12px;font-size:28px;line-height:1.1;letter-spacing:-.04em}
.lead{max-width:640px;color:#d7deee;font-size:21px;word-break:keep-all}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;font-weight:700;border:1px solid var(--line);transition:transform .2s ease,background .2s ease}.button:hover{transform:translateY(-2px)}.primary{background:var(--text);color:#07101d}.secondary{background:rgba(255,255,255,.06)}
.hero-art{position:relative;aspect-ratio:1;display:grid;place-items:center}.hero-logo{width:min(72%,420px);filter:drop-shadow(0 34px 80px rgba(65,158,255,.24));animation:float 6s ease-in-out infinite}
.orbit{position:absolute;border:1px solid rgba(255,255,255,.26);border-radius:50%;transform:rotate(-14deg)}.orbit-one{inset:7%}.orbit-two{inset:17%;opacity:.55}
.planet{position:absolute;border-radius:50%;box-shadow:0 0 40px rgba(255,255,255,.18)}.planet-a{width:34px;height:34px;top:18%;left:12%;background:linear-gradient(135deg,#ffd76a,#8f78d8)}.planet-b{width:46px;height:46px;right:10%;bottom:22%;background:linear-gradient(135deg,#91e3bd,#4b7ce8)}
.section{width:min(var(--max),calc(100% - 40px));margin:0 auto 36px;padding:86px 0}.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:58px;border-top:1px solid var(--line)}.section-text{color:var(--muted);font-size:20px;word-break:keep-all}
.principles{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-top:16px}
.principle,.app-card,.research,.contact{background:linear-gradient(180deg,var(--panel-strong),rgba(255,255,255,.045));border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 20px 80px rgba(0,0,0,.22);backdrop-filter:blur(18px)}
.principle{padding:28px}.principle span{display:block;margin-bottom:10px;font-size:24px;font-weight:900;letter-spacing:-.04em}.principle p{color:var(--muted);margin-bottom:0}
.section-heading{max-width:720px;margin-bottom:32px}.app-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.app-card{min-height:300px;padding:28px;display:flex;flex-direction:column}.app-card.featured{grid-column:span 2;background:linear-gradient(135deg,rgba(142,217,255,.18),rgba(255,215,106,.11))}
.app-meta{width:fit-content;margin-bottom:26px;padding:6px 10px;border-radius:999px;color:var(--accent-2);background:rgba(255,215,106,.11);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.app-card p{color:var(--muted);word-break:keep-all}.app-card a{margin-top:auto;color:var(--accent);font-weight:700}
.research,.contact{padding:48px}.research p,.contact p{max-width:820px;color:var(--muted);font-size:19px;word-break:keep-all}.muted{color:#8f9ab4!important}.big-email{display:inline-block;margin-top:16px;color:var(--accent);font-size:clamp(24px,4vw,46px);font-weight:900;letter-spacing:-.04em}
.footer{width:min(var(--max),calc(100% - 40px));margin:0 auto;padding:42px 0 64px;display:flex;justify-content:space-between;gap:24px;color:#8f9ab4;border-top:1px solid var(--line)}.footer div{display:flex;gap:18px}.footer a:hover{color:var(--text)}
@keyframes float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1deg)}}
@media (max-width:900px){.site-header{align-items:flex-start;gap:18px}.nav{gap:14px;flex-wrap:wrap;justify-content:flex-end}.hero,.split{grid-template-columns:1fr}.hero{min-height:auto;padding-top:44px}.hero-art{order:-1;max-width:420px;margin:0 auto}.principles,.app-grid{grid-template-columns:1fr 1fr}.app-card.featured{grid-column:span 2}}
@media (max-width:620px){.site-header{width:min(100% - 28px,var(--max))}.nav{font-size:13px}.hero,.section,.footer{width:min(100% - 28px,var(--max))}.principles,.app-grid{grid-template-columns:1fr}.app-card.featured{grid-column:auto}.research,.contact{padding:28px}.footer{flex-direction:column}}


/* Language toggle */
.lang-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .055);
}

.lang-button {
  border: 0;
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.lang-button.active {
  color: #07101d;
  background: var(--text);
}

/* Media / YouTube */
.media-panel {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 18px;
  align-items: stretch;
}

.media-panel > div,
.youtube-card {
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--panel-strong), rgba(255, 255, 255, .045));
  box-shadow: 0 20px 80px rgba(0,0,0,.22);
  backdrop-filter: blur(18px);
}

.youtube-card {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 220px;
}

.youtube-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 96px;
  filter: drop-shadow(0 18px 38px rgba(255, 0, 51, .22));
  transition: transform .2s ease;
}

.youtube-icon svg {
  display: block;
  width: 100%;
  height: auto;
}

.youtube-card:hover .youtube-icon {
  transform: translateY(-2px) scale(1.03);
}

.youtube-title {
  display: block;
  margin-bottom: 10px;
  font-size: 32px;
  font-weight: 900;
  letter-spacing: -.04em;
}

.youtube-desc {
  display: block;
  color: var(--muted);
}

.compact-actions {
  margin-top: 24px;
}

@media (max-width: 900px) {
  .media-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .youtube-card {
    align-items: flex-start;
    flex-direction: column;
  }
}
