/*
 * FOUNDER COCKPIT Website · FOUNDER COCKPIT
 * Copyright (c) 2026 FOUNDER COCKPIT (Waldemar Weidner) and Nexus Studio: Digital Innovation (Danylo Molianko). All rights reserved.
 * ORIGINAL PRODUCT · FOUNDER COCKPIT Website — an original work of FOUNDER COCKPIT.
 * Developed by Nexus Studio: Digital Innovation.
 * Proprietary and confidential. Copying, distribution or use without written permission is prohibited.
 * SPDX-License-Identifier: LicenseRef-FounderCockpit-Proprietary
 * fc-provenance: VV5E77OLZEPQG6O7
 */
/* ============================================================
   FOUNDER COCKPIT — Zertifizierte Plattform (.fc-cert*)
   Band unter der Plattform-Sektion + Lightbox mit beiden Seiten.

   Lichtmodell: ein Schlüssellicht oben links. Das Zertifikat liegt
   als Papier auf dem hellen Grund, sein Schatten fällt nach rechts
   unten und ist tiefblau getönt, nie grau. Die Anlage liegt darunter,
   leicht verdreht, und schaut nur am Rand hervor. Gold erscheint nur
   als Haarlinie, nie als Fläche — ausser am einen Prüf-Knopf.
   Palette: Tiefblau #0C1233 · Gold #E9CBA1 · Grau #F0F2FD · Weiß.
   ============================================================ */

.fc-cert {
  --cert-ease: cubic-bezier(.22, 1, .36, 1);
  --cert-ease-in: cubic-bezier(.55, 0, .45, 1);
  --cert-navy: #0C1233;
  --cert-gold: #E9CBA1;
  --cert-gold-ink: var(--gold-dark, #AF997A);
  --cert-grau: #F0F2FD;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 8vw, 120px) 0;
  background:
    radial-gradient(70% 90% at 82% 40%, rgba(233, 203, 161, .16) 0%, transparent 62%),
    linear-gradient(180deg, var(--cert-grau) 0%, #FFFFFF 100%);
  color: var(--text-body, #1A1F3D);
}
.fc-cert::before {
  /* Haarlinie als Übergang von der tiefblauen Plattform-Sektion */
  content: "";
  position: absolute;
  top: 0; left: 50%;
  width: min(560px, 60%);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(233, 203, 161, .7), transparent);
}

.fc-cert__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  gap: clamp(40px, 6vw, 112px);
  align-items: center;
}

/* ---------- Text ---------- */
.fc-cert__kicker {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-sans);
  font-size: clamp(.68rem, .64rem + .15vw, .74rem);
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--cert-gold-ink);
  margin-bottom: clamp(16px, 1.6vw, 22px);
}
.fc-cert__kicker::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--cert-gold);
}
.fc-cert__h2 {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 1.4rem + 2.2vw, 3.1rem);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.01em;
  color: var(--cert-navy);
  margin: 0 0 clamp(18px, 1.8vw, 26px);
}
.fc-cert__h2 em { color: var(--cert-gold-ink); }
.fc-cert__lead {
  font-size: clamp(1rem, .95rem + .2vw, 1.12rem);
  line-height: 1.65;
  color: var(--text-body, #1A1F3D);
  max-width: 34em;
  margin: 0 0 clamp(26px, 2.6vw, 36px);
}

.fc-cert__points {
  list-style: none;
  margin: 0 0 clamp(28px, 2.8vw, 40px);
  padding: 0;
  max-width: 36em;
  border-top: 1px solid rgba(12, 18, 51, .09);
}
.fc-cert__point {
  display: grid;
  grid-template-columns: 2.4em minmax(0, 1fr);
  gap: 4px 14px;
  padding: clamp(16px, 1.6vw, 20px) 0;
  border-bottom: 1px solid rgba(12, 18, 51, .09);
}
.fc-cert__num {
  font-family: var(--font-serif);
  font-size: clamp(.95rem, .9rem + .2vw, 1.05rem);
  font-style: italic;
  color: var(--cert-gold-ink);
  line-height: 1.5;
}
.fc-cert__point-t {
  font-weight: 600;
  font-size: clamp(.98rem, .94rem + .15vw, 1.05rem);
  color: var(--cert-navy);
  line-height: 1.45;
}
.fc-cert__point-d {
  grid-column: 2;
  font-size: clamp(.9rem, .87rem + .12vw, .96rem);
  line-height: 1.6;
  color: var(--text-muted, #5A6280);
}

.fc-cert__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 26px;
}
.fc-cert__open {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 22px;
  border-radius: 999px;
  border: 1px solid rgba(12, 18, 51, .16);
  background: #FFFFFF;
  color: var(--cert-navy);
  font-weight: 600;
  font-size: clamp(.88rem, .85rem + .1vw, .94rem);
  box-shadow: 0 1px 2px rgba(12, 18, 51, .05), 0 6px 18px -8px rgba(12, 18, 51, .18);
  transition: border-color .3s var(--cert-ease), box-shadow .3s var(--cert-ease), transform .3s var(--cert-ease);
}
.fc-cert__open svg { width: 16px; height: 16px; color: var(--cert-gold-ink); }
.fc-cert__open:hover {
  border-color: rgba(233, 203, 161, .95);
  box-shadow: 0 1px 2px rgba(12, 18, 51, .05), 0 12px 28px -10px rgba(12, 18, 51, .24);
  transform: translateY(-1px);
}
.fc-cert__verify {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: clamp(.86rem, .83rem + .1vw, .92rem);
  font-weight: 500;
  color: var(--cert-navy);
  border-bottom: 1px solid rgba(233, 203, 161, .9);
  padding-bottom: 2px;
  transition: color .25s var(--cert-ease), border-color .25s var(--cert-ease);
}
.fc-cert__verify svg { width: 11px; height: 11px; }
.fc-cert__verify:hover { color: var(--cert-gold-ink); border-color: var(--cert-gold-ink); }

.fc-cert__meta {
  margin: clamp(22px, 2.2vw, 30px) 0 0;
  font-size: clamp(.72rem, .7rem + .08vw, .78rem);
  letter-spacing: .06em;
  color: var(--text-muted, #5A6280);
  font-variant-numeric: tabular-nums;
}
.fc-cert__meta b { font-weight: 600; color: var(--cert-navy); letter-spacing: .1em; }

/* ---------- Das Papier ---------- */
.fc-cert__stage {
  position: relative;
  display: block;
  width: 100%;
  max-width: 640px;
  margin-inline: auto;
  padding: 0;
  border: 0;
  background: none;
  cursor: zoom-in;
  perspective: 1600px;
  -webkit-tap-highlight-color: transparent;
}
.fc-cert__stage:focus-visible { outline: none; }
.fc-cert__stage:focus-visible .fc-cert__sheet--front {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 4px var(--cert-navy), 0 30px 60px -24px rgba(12, 18, 51, .38);
}
.fc-cert__stack {
  position: relative;
  display: block;
  aspect-ratio: 3540 / 2502;
  transform: rotateX(6deg) rotateZ(-1.6deg);
  transform-style: preserve-3d;
  transition: transform .9s var(--cert-ease);
}
.fc-cert__sheet {
  position: absolute;
  inset: 0;
  display: block;
  background: #FFFFFF;
  border-radius: 3px;
  overflow: hidden;
}
.fc-cert__sheet img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fc-cert__sheet::after {
  /* Gold-Haarlinie + ein Hauch Papierlicht von oben links */
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(233, 203, 161, .75);
  background: linear-gradient(135deg, rgba(255, 255, 255, .22) 0%, transparent 38%, transparent 70%, rgba(12, 18, 51, .035) 100%);
  pointer-events: none;
}
.fc-cert__sheet--back {
  transform: translate3d(4.5%, 5.5%, -40px) rotateZ(3.4deg);
  box-shadow: 0 2px 4px rgba(12, 18, 51, .05), 0 22px 44px -22px rgba(12, 18, 51, .28);
  transition: transform .9s var(--cert-ease);
}
.fc-cert__sheet--back img { opacity: .9; }
.fc-cert__sheet--front {
  transform: translateZ(0);
  box-shadow:
    0 1px 1px rgba(12, 18, 51, .06),
    0 6px 14px -6px rgba(12, 18, 51, .16),
    0 30px 60px -24px rgba(12, 18, 51, .34),
    0 60px 90px -50px rgba(12, 18, 51, .30);
  transition: box-shadow .9s var(--cert-ease);
}
.fc-cert__stage:hover .fc-cert__stack,
.fc-cert__stage:focus-visible .fc-cert__stack {
  transform: rotateX(3deg) rotateZ(-.8deg) translateY(-6px);
}
.fc-cert__stage:hover .fc-cert__sheet--back {
  transform: translate3d(6.5%, 7%, -40px) rotateZ(4.6deg);
}
.fc-cert__hint {
  position: absolute;
  left: 50%;
  bottom: calc(-1 * clamp(44px, 4.4vw, 58px));
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  font-size: clamp(.7rem, .68rem + .08vw, .76rem);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-muted, #5A6280);
  transition: color .3s var(--cert-ease);
}
.fc-cert__hint::before {
  content: "";
  width: 18px; height: 1px;
  background: var(--cert-gold);
}
.fc-cert__stage:hover .fc-cert__hint { color: var(--cert-navy); }
.fc-cert__figure { position: relative; padding-bottom: clamp(44px, 4.4vw, 58px); }

/* ---------- Lightbox ---------- */
.fc-cert-lb {
  --cert-ease: cubic-bezier(.22, 1, .36, 1);
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  padding: max(16px, env(safe-area-inset-top)) clamp(16px, 3vw, 40px) max(16px, env(safe-area-inset-bottom));
  background: rgba(240, 242, 253, .94);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  backdrop-filter: blur(14px) saturate(1.1);
  color: #0C1233;
  opacity: 0;
  transition: opacity .35s var(--cert-ease);
}
.fc-cert-lb[hidden] { display: none; }
.fc-cert-lb.is-open { opacity: 1; }

/* ref:GRGB-WVRR-HA3Y-PQSS */
.fc-cert-lb__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  padding-bottom: clamp(10px, 1.4vw, 18px);
}
.fc-cert-lb__title {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.fc-cert-lb__title span {
  font-size: clamp(.64rem, .62rem + .08vw, .7rem);
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-dark, #AF997A);
  font-weight: 700;
}
.fc-cert-lb__title b {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1rem, .92rem + .4vw, 1.3rem);
  color: #0C1233;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fc-cert-lb__tabs {
  display: inline-flex;
  padding: 4px;
  border-radius: 999px;
  background: #FFFFFF;
  border: 1px solid rgba(12, 18, 51, .1);
  box-shadow: 0 4px 14px -8px rgba(12, 18, 51, .2);
}
.fc-cert-lb__tab {
  padding: 8px 16px;
  border-radius: 999px;
  font-size: clamp(.78rem, .76rem + .08vw, .84rem);
  font-weight: 600;
  color: var(--text-muted, #5A6280);
  transition: background-color .25s var(--cert-ease), color .25s var(--cert-ease);
}
.fc-cert-lb__tab[aria-selected="true"] { background: #0C1233; color: #FFFFFF; }
.fc-cert-lb__tab:not([aria-selected="true"]):hover { color: #0C1233; }
.fc-cert-lb__close {
  flex: none;
  width: 44px; height: 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #FFFFFF;
  border: 1px solid rgba(12, 18, 51, .12);
  color: #0C1233;
  transition: border-color .25s var(--cert-ease), transform .25s var(--cert-ease);
}
.fc-cert-lb__close svg { width: 16px; height: 16px; }
.fc-cert-lb__close:hover { border-color: #E9CBA1; transform: rotate(90deg); }

.fc-cert-lb__stage {
  position: relative;
  min-height: 0;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  --lb-side: clamp(0px, 4.6vw, 64px);
}
.fc-cert-lb__page {
  /* Ersetztes Element, absolut mit inset 0 + margin auto: passt sich
     in beide Richtungen ein und bleibt zentriert. */
  position: absolute;
  inset: 0 var(--lb-side, 64px);
  margin: auto;
  max-width: calc(100% - 2 * var(--lb-side, 64px));
  max-height: 100%;
  width: auto;
  height: auto;
  border-radius: 3px;
  background: #FFFFFF;
  box-shadow:
    0 0 0 1px rgba(233, 203, 161, .8),
    0 2px 4px rgba(12, 18, 51, .06),
    0 40px 80px -36px rgba(12, 18, 51, .42);
  opacity: 0;
  transform: translateY(14px) scale(.985);
  transition: opacity .45s var(--cert-ease), transform .6s var(--cert-ease);
  pointer-events: none;
}
.fc-cert-lb__page.is-current { opacity: 1; transform: none; pointer-events: auto; }
.fc-cert-lb__nav {
  position: absolute;
  top: 50%;
  width: 46px; height: 46px;
  margin-top: -23px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(12, 18, 51, .12);
  color: #0C1233;
  box-shadow: 0 8px 20px -10px rgba(12, 18, 51, .3);
  transition: border-color .25s var(--cert-ease), opacity .25s var(--cert-ease);
}
.fc-cert-lb__nav svg { width: 18px; height: 18px; }
.fc-cert-lb__nav:hover { border-color: #E9CBA1; }
.fc-cert-lb__nav:disabled { opacity: 0; pointer-events: none; }
.fc-cert-lb__nav--prev { left: 0; }
.fc-cert-lb__nav--next { right: 0; }

.fc-cert-lb__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px 24px;
  padding-top: clamp(14px, 1.8vw, 22px);
}
.fc-cert-lb__verify {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 26px;
  border-radius: 999px;
  background: #E9CBA1;
  color: #0C1233;
  font-weight: 700;
  font-size: clamp(.88rem, .85rem + .1vw, .95rem);
  letter-spacing: .01em;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 10px 24px -12px rgba(12, 18, 51, .4);
  transition: transform .3s var(--cert-ease), box-shadow .3s var(--cert-ease);
}
.fc-cert-lb__verify svg { width: 12px; height: 12px; }
.fc-cert-lb__verify:hover {
  transform: translateY(-1px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 16px 30px -12px rgba(12, 18, 51, .45);
}
.fc-cert-lb__code {
  font-size: clamp(.72rem, .7rem + .08vw, .78rem);
  letter-spacing: .08em;
  color: var(--text-muted, #5A6280);
  font-variant-numeric: tabular-nums;
}
.fc-cert-lb__code b { color: #0C1233; font-weight: 600; letter-spacing: .12em; }

html.fc-cert-locked, html.fc-cert-locked body { overflow: hidden; }

/* ---------- Schmal ---------- */
@media (max-width: 960px) {
  .fc-cert__inner { grid-template-columns: minmax(0, 1fr); }
  .fc-cert__figure { order: -1; max-width: 560px; width: 100%; margin: 0 auto 8px; padding-inline: 4%; }
}
@media (max-width: 560px) {
  .fc-cert-lb__bar { flex-wrap: wrap; }
  .fc-cert-lb__title { flex: 1 1 calc(100% - 60px); }
  .fc-cert-lb__tabs { order: 3; width: 100%; justify-content: center; }
  .fc-cert-lb__tab { flex: 1; text-align: center; }
  .fc-cert-lb__nav { display: none; }
  .fc-cert-lb__stage { --lb-side: 0px; }
  .fc-cert-lb__verify { width: 100%; justify-content: center; }
}

/* ---------- Ruhe ---------- */
@media (prefers-reduced-motion: reduce) {
  .fc-cert__stack,
  .fc-cert__sheet--back,
  .fc-cert__sheet--front,
  .fc-cert__open,
  .fc-cert-lb,
  .fc-cert-lb__page,
  .fc-cert-lb__close,
  .fc-cert-lb__verify { transition: none; }
  .fc-cert__stage:hover .fc-cert__stack,
  .fc-cert__stage:focus-visible .fc-cert__stack { transform: rotateX(6deg) rotateZ(-1.6deg); }
  .fc-cert__stage:hover .fc-cert__sheet--back { transform: translate3d(4.5%, 5.5%, -40px) rotateZ(3.4deg); }
  .fc-cert__open:hover, .fc-cert-lb__verify:hover { transform: none; }
  .fc-cert-lb__close:hover { transform: none; }
  .fc-cert-lb__page { transform: none; }
}

/* ref:2R2W-ERC4-ZUIA-M2ST */
