:root {
  --bg: #050505;
  --bg-soft: #0b0b0b;
  --text: #f5f0e6;
  --muted: rgba(245,240,230,.66);
  --line: rgba(255,211,118,.20);
  --gold: #ffd376;
  --gold-strong: #f0b938;
  --white: #ffffff;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 12% 8%, rgba(255,211,118,.16), transparent 28rem),
    radial-gradient(circle at 90% 18%, rgba(255,255,255,.08), transparent 22rem),
    linear-gradient(145deg, #030303, #0a0a0a 42%, #000 100%);
  color: var(--text);
  overflow-x: hidden;
}

.grain {
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='.28'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.orb {
  position: fixed;
  width: 28rem;
  height: 28rem;
  border-radius: 999px;
  filter: blur(80px);
  opacity: .16;
  pointer-events: none;
}
.orb-one { left: -12rem; top: 16rem; background: var(--gold); }
.orb-two { right: -14rem; bottom: -10rem; background: var(--white); }

.site-shell {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: 26px 0 30px;
  position: relative;
}

.hero {
  min-height: calc(100vh - 56px);
  border: 1px solid var(--line);
  border-radius: 34px;
  padding: clamp(22px, 4vw, 54px);
  background:
    linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    rgba(5,5,5,.78);
  box-shadow: 0 40px 120px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.12);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 12%, rgba(255,211,118,.10) 12% 12.2%, transparent 12.2% 100%),
    linear-gradient(0deg, transparent 0 64%, rgba(255,211,118,.10) 64% 64.3%, transparent 64.3% 100%);
  pointer-events: none;
}

.brand-panel {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  z-index: 2;
}
.logo {
  width: min(500px, 62vw);
  background: rgba(255,255,255,.94);
  border-radius: 18px;
  padding: 12px 18px;
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
}
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(255,211,118,.34);
  color: var(--gold);
  border-radius: 999px;
  padding: 12px 16px;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .15em;
  white-space: nowrap;
  background: rgba(255,211,118,.06);
}
.status-pill > span:first-child {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 18px var(--gold);
}

.hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: clamp(28px, 5vw, 70px);
  align-items: end;
  margin-top: 80px;
}
.eyebrow, .small-title, .card-kicker {
  margin: 0 0 14px;
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-weight: 900;
  font-size: 12px;
}
h1 {
  margin: 0;
  max-width: 820px;
  font-size: clamp(54px, 9vw, 118px);
  line-height: .88;
  letter-spacing: -.075em;
  text-wrap: balance;
}
.lead {
  max-width: 700px;
  margin: 34px 0 0;
  color: var(--muted);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.45;
}
.access-card {
  border: 1px solid rgba(255,211,118,.24);
  border-radius: 28px;
  padding: 30px;
  background: linear-gradient(180deg, rgba(255,211,118,.10), rgba(255,255,255,.035));
  backdrop-filter: blur(18px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}
.access-ring {
  width: 108px;
  height: 108px;
  border-radius: 50%;
  border: 1px solid rgba(255,211,118,.56);
  display: grid;
  place-items: center;
  margin-bottom: 34px;
  position: relative;
}
.access-ring::after {
  content: "";
  position: absolute;
  inset: 10px;
  border-radius: 50%;
  border: 1px dashed rgba(255,211,118,.42);
}
.access-ring span {
  color: var(--gold);
  font-size: 48px;
  font-weight: 900;
}
.access-card h2 {
  margin: 0 0 16px;
  font-size: clamp(25px, 3vw, 40px);
  line-height: 1.02;
  letter-spacing: -.045em;
}
.access-card p:last-child {
  color: var(--muted);
  line-height: 1.65;
  margin-bottom: 0;
}

.manifesto {
  margin: 24px 0;
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 24px;
}
.vertical-label {
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: 28px;
  color: var(--gold);
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-align: center;
  letter-spacing: .18em;
  font-size: 12px;
  font-weight: 900;
  background: rgba(255,255,255,.035);
}
.manifesto-text {
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: clamp(32px, 6vw, 74px);
  background: rgba(255,255,255,.035);
}
.manifesto-text p {
  margin: 0;
  font-size: clamp(26px, 4.3vw, 58px);
  line-height: 1.05;
  letter-spacing: -.058em;
  text-wrap: balance;
}
.manifesto-text p + p { margin-top: 34px; color: rgba(245,240,230,.55); }

.principles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.principles article {
  min-height: 250px;
  border: 1px solid var(--line);
  border-radius: 26px;
  padding: 26px;
  background: rgba(255,255,255,.035);
  transition: transform .3s ease, border-color .3s ease, background .3s ease;
}
.principles article:hover {
  transform: translateY(-6px);
  border-color: rgba(255,211,118,.55);
  background: rgba(255,211,118,.055);
}
.principles article > span {
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .16em;
}
.principles h3 {
  margin: 48px 0 14px;
  font-size: 23px;
  letter-spacing: -.04em;
}
.principles p { margin: 0; color: var(--muted); line-height: 1.6; }

.statement {
  margin: 24px 0;
  border-radius: 34px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,211,118,.65), rgba(255,255,255,.10), rgba(255,211,118,.20));
}
.statement-inner {
  border-radius: 33px;
  padding: clamp(38px, 7vw, 90px);
  background:
    radial-gradient(circle at 80% 20%, rgba(255,211,118,.18), transparent 20rem),
    #080808;
}
.statement h2 {
  margin: 0;
  max-width: 920px;
  font-size: clamp(40px, 6vw, 86px);
  line-height: .96;
  letter-spacing: -.07em;
  text-wrap: balance;
}
.statement p:last-child {
  max-width: 680px;
  margin: 28px 0 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.7;
}

footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  color: rgba(245,240,230,.46);
  font-size: 13px;
  padding: 8px 6px 0;
}

@media (max-width: 900px) {
  .brand-panel, footer { align-items: flex-start; flex-direction: column; }
  .hero-grid, .manifesto { grid-template-columns: 1fr; }
  .vertical-label { writing-mode: initial; transform: none; }
  .principles { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .site-shell { width: min(100% - 22px, 1180px); padding-top: 11px; }
  .hero { border-radius: 24px; min-height: auto; }
  .logo { width: 100%; padding: 10px; }
  .status-pill { white-space: normal; }
  .hero-grid { margin-top: 54px; }
  h1 { font-size: clamp(48px, 17vw, 78px); }
  .principles { grid-template-columns: 1fr; }
  .principles article { min-height: auto; }
}

.security-brief {
  margin: 24px 0;
  border: 1px solid var(--line);
  border-radius: 34px;
  padding: clamp(28px, 5vw, 64px);
  background:
    linear-gradient(135deg, rgba(255,211,118,.075), rgba(255,255,255,.028)),
    rgba(255,255,255,.026);
  position: relative;
  overflow: hidden;
}
.security-brief::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(255,211,118,.09) 8% 8.12%, transparent 8.12% 100%),
    radial-gradient(circle at 92% 10%, rgba(255,211,118,.16), transparent 24rem);
  pointer-events: none;
}
.security-head {
  position: relative;
  z-index: 1;
  max-width: 930px;
}
.security-head h2 {
  margin: 0;
  font-size: clamp(38px, 5.7vw, 78px);
  line-height: .96;
  letter-spacing: -.07em;
  text-wrap: balance;
}
.security-head p:last-child {
  max-width: 720px;
  margin: 26px 0 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.7;
}
.security-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 48px;
}
.security-item {
  min-height: 270px;
  border: 1px solid rgba(255,211,118,.19);
  border-radius: 24px;
  padding: 24px;
  background: rgba(0,0,0,.25);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.security-item > span {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,211,118,.32);
  border-radius: 50%;
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
}
.security-item h3 {
  margin: 34px 0 14px;
  font-size: 24px;
  line-height: 1.05;
  letter-spacing: -.045em;
}
.security-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}
@media (max-width: 900px) {
  .security-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .security-brief { border-radius: 24px; }
  .security-grid { grid-template-columns: 1fr; }
  .security-item { min-height: auto; }
}

.existence {
  margin: 24px 0;
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 16px;
}
.existence-panel,
.existence-copy,
.members-only,
.trust-layers,
.not-ordinary {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.035);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
}
.existence-panel {
  border-radius: 32px;
  padding: clamp(30px, 5vw, 66px);
  background:
    radial-gradient(circle at 15% 16%, rgba(255,211,118,.16), transparent 18rem),
    rgba(255,255,255,.035);
}
.existence-panel h2,
.members-copy h2,
.trust-head h2,
.not-copy h2 {
  margin: 0;
  font-size: clamp(36px, 5vw, 72px);
  line-height: .96;
  letter-spacing: -.068em;
  text-wrap: balance;
}
.existence-copy {
  border-radius: 32px;
  padding: clamp(32px, 5vw, 66px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.existence-copy p {
  margin: 0;
  color: var(--muted);
  font-size: clamp(18px, 2vw, 23px);
  line-height: 1.55;
}
.existence-copy p + p { margin-top: 24px; color: rgba(245,240,230,.48); }

.members-only {
  margin: 24px 0;
  border-radius: 34px;
  padding: clamp(30px, 5vw, 70px);
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: clamp(26px, 5vw, 70px);
  align-items: center;
  background:
    linear-gradient(135deg, rgba(255,211,118,.09), rgba(255,255,255,.025)),
    rgba(255,255,255,.03);
}
.members-badge {
  aspect-ratio: 1;
  border: 1px solid rgba(255,211,118,.42);
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-align: center;
  position: relative;
  background: rgba(0,0,0,.22);
}
.members-badge::before,
.members-badge::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px dashed rgba(255,211,118,.28);
}
.members-badge::before { inset: 18px; }
.members-badge::after { inset: 38px; }
.members-badge > span,
.members-badge > strong { position: relative; z-index: 1; display: block; }
.members-badge > span {
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 11px;
  font-weight: 900;
}
.members-badge > strong {
  margin-top: 8px;
  font-size: clamp(42px, 5vw, 68px);
  letter-spacing: -.07em;
}
.members-copy p:last-child {
  max-width: 760px;
  margin: 26px 0 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.7;
}

.trust-layers {
  margin: 24px 0;
  border-radius: 34px;
  padding: clamp(30px, 5vw, 66px);
  position: relative;
  overflow: hidden;
}
.trust-layers::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0 49.9%, rgba(255,211,118,.08) 49.9% 50.1%, transparent 50.1% 100%);
  pointer-events: none;
}
.trust-head { position: relative; z-index: 1; max-width: 900px; }
.layer-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 44px;
}
.layer-grid article {
  min-height: 300px;
  border: 1px solid rgba(255,211,118,.20);
  border-radius: 26px;
  padding: 26px;
  background: linear-gradient(180deg, rgba(255,211,118,.055), rgba(0,0,0,.20));
}
.layer-grid article > span {
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: 11px;
  font-weight: 900;
}
.layer-grid h3 {
  margin: 70px 0 14px;
  font-size: 25px;
  line-height: 1.05;
  letter-spacing: -.045em;
}
.layer-grid p { margin: 0; color: var(--muted); line-height: 1.65; }

.not-ordinary {
  margin: 24px 0;
  border-radius: 34px;
  padding: clamp(30px, 5vw, 66px);
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: clamp(26px, 5vw, 64px);
  align-items: center;
  background:
    radial-gradient(circle at 88% 12%, rgba(255,211,118,.14), transparent 20rem),
    rgba(255,255,255,.032);
}
.not-copy p:last-child {
  max-width: 730px;
  margin: 26px 0 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.7;
}
.comparison {
  border: 1px solid rgba(255,211,118,.20);
  border-radius: 28px;
  overflow: hidden;
  background: rgba(0,0,0,.24);
}
.comparison div {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 18px;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255,211,118,.12);
}
.comparison div:last-child { border-bottom: 0; }
.comparison div > span {
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .14em;
}
.comparison strong {
  font-size: 18px;
  letter-spacing: -.025em;
}

@media (max-width: 900px) {
  .existence, .members-only, .not-ordinary { grid-template-columns: 1fr; }
  .members-badge { width: min(280px, 100%); }
  .layer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .existence-panel, .existence-copy, .members-only, .trust-layers, .not-ordinary { border-radius: 24px; }
  .layer-grid { grid-template-columns: 1fr; }
  .layer-grid article { min-height: auto; }
  .layer-grid h3 { margin-top: 42px; }
  .comparison div { grid-template-columns: 1fr; gap: 6px; }
}

.language-switch {
  position: sticky;
  top: 18px;
  z-index: 20;
  width: fit-content;
  margin: 0 0 14px auto;
  display: flex;
  gap: 6px;
  padding: 6px;
  border: 1px solid rgba(255,211,118,.22);
  border-radius: 999px;
  background: rgba(5,5,5,.72);
  backdrop-filter: blur(18px);
  box-shadow: 0 18px 50px rgba(0,0,0,.28);
}
.lang-btn {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 10px 14px;
  background: transparent;
  color: rgba(245,240,230,.62);
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .14em;
  cursor: pointer;
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
.lang-btn:hover { color: var(--text); transform: translateY(-1px); }
.lang-btn.active {
  color: #050505;
  background: var(--gold);
}

@media (max-width: 620px) {
  .language-switch { top: 10px; margin-right: 2px; }
  .lang-btn { padding: 9px 12px; }
}

/* Refinement: bilingual layout + more restrained headings */
[data-i18n] { display: inline; }

h1 {
  font-size: clamp(42px, 6.6vw, 84px);
  line-height: .96;
  letter-spacing: -.055em;
}
.lead { font-size: clamp(16px, 1.65vw, 21px); }

.access-card h2,
.statement h2,
.security-head h2,
.existence-panel h2,
.members-copy h2,
.trust-head h2,
.not-copy h2 {
  font-size: clamp(30px, 4.2vw, 56px);
  line-height: 1.02;
  letter-spacing: -.052em;
}

.manifesto-text p {
  font-size: clamp(23px, 3.1vw, 42px);
  line-height: 1.12;
  letter-spacing: -.045em;
}

.principles h3,
.security-item h3,
.layer-grid h3 {
  font-size: clamp(20px, 1.9vw, 23px);
  line-height: 1.15;
  letter-spacing: -.035em;
}

.security-item h3 { margin-top: 26px; }
.layer-grid h3 { margin-top: 48px; }
.principles h3 { margin-top: 36px; }

.principles article,
.security-item,
.layer-grid article {
  overflow-wrap: anywhere;
  hyphens: auto;
}

.security-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.layer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.principles { grid-template-columns: repeat(2, minmax(0, 1fr)); }

html[lang="de"] h1 {
  font-size: clamp(38px, 5.7vw, 74px);
  line-height: 1;
}
html[lang="de"] .access-card h2,
html[lang="de"] .statement h2,
html[lang="de"] .security-head h2,
html[lang="de"] .existence-panel h2,
html[lang="de"] .members-copy h2,
html[lang="de"] .trust-head h2,
html[lang="de"] .not-copy h2 {
  font-size: clamp(28px, 3.75vw, 50px);
  line-height: 1.06;
  letter-spacing: -.045em;
}
html[lang="de"] .manifesto-text p {
  font-size: clamp(22px, 2.75vw, 36px);
  line-height: 1.18;
}
html[lang="de"] .eyebrow,
html[lang="de"] .small-title,
html[lang="de"] .card-kicker,
html[lang="de"] .status-pill {
  letter-spacing: .11em;
}

@media (max-width: 900px) {
  .principles, .security-grid, .layer-grid { grid-template-columns: 1fr; }
  .security-item, .layer-grid article, .principles article { min-height: auto; }
}

@media (max-width: 620px) {
  h1, html[lang="de"] h1 { font-size: clamp(38px, 13vw, 58px); letter-spacing: -.045em; }
  .access-card h2,
  .statement h2,
  .security-head h2,
  .existence-panel h2,
  .members-copy h2,
  .trust-head h2,
  .not-copy h2,
  html[lang="de"] .access-card h2,
  html[lang="de"] .statement h2,
  html[lang="de"] .security-head h2,
  html[lang="de"] .existence-panel h2,
  html[lang="de"] .members-copy h2,
  html[lang="de"] .trust-head h2,
  html[lang="de"] .not-copy h2 {
    font-size: clamp(27px, 8.4vw, 38px);
    line-height: 1.08;
  }
  .manifesto-text p, html[lang="de"] .manifesto-text p { font-size: clamp(21px, 6.5vw, 30px); }
}
