/* ==========================================================
   Landing page, after the story: the imprint and the company
   sections, in the platforms page's language (platforms.css).
   ========================================================== */

body.home { background: #050506; }

/* hero buttons: the same white and ghost pair as the rest of the site */
.copy .px-actions { margin-top: 0; }
body.ready .copy .px-actions { transition-delay: 0.3s; }

/* the seal pressed into the plain: the picture behind every other page */
.hx-bridge { position: relative; min-height: 112vh; display: flex; justify-content: center; overflow: hidden; background: #050506; }
.hx-bridge-bg { position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(180deg, #0a0a0a 0%, rgba(10, 10, 10, 0.55) 22%, rgba(5, 5, 6, 0.35) 52%, rgba(5, 5, 6, 0.7) 82%, #050506 100%),
    url("brand/imprint-web.jpg") center 58% / cover no-repeat;
  opacity: 0; transform: scale(1.08); transition: opacity 1.6s ease, transform 2.4s var(--ease); }
.hx-bridge.in .hx-bridge-bg { opacity: 1; transform: none; }
.hx-bridge-bg::after { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 80% at 50% 45%, transparent 45%, rgba(5, 5, 6, 0.7) 100%); }
.hx-bridge-in { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; max-width: 760px; padding: clamp(110px, 18vh, 180px) var(--g) 0; text-align: center; }
.hx-bridge h2 { font-size: clamp(34px, 4vw, 60px); font-weight: 600; letter-spacing: -0.05em; line-height: 1.04; color: #fff; }
.hx-bridge-in > p:not(.px-eyebrow) { margin: 20px 0 0; max-width: 34em; font-size: clamp(15px, 1.1vw, 17px); line-height: 1.6; color: #c9ccd3; }
.hx-bridge .px-eyebrow { color: #c9d6ff; }
.hx-bridge .px-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 30px; }
.hx-bridge-in > * { opacity: 0; transform: translateY(14px); transition: opacity 1s ease, transform 1.2s var(--ease); }
.hx-bridge.in .hx-bridge-in > * { opacity: 1; transform: none; }
.hx-bridge.in .hx-bridge-in > :nth-child(2) { transition-delay: 0.12s; }
.hx-bridge.in .hx-bridge-in > :nth-child(3) { transition-delay: 0.24s; }
.hx-bridge.in .hx-bridge-in > :nth-child(4) { transition-delay: 0.36s; }

/* the company: a centred column, quiet tiles */
.hx { margin-top: clamp(-120px, -10vh, -60px); padding-bottom: clamp(96px, 14vh, 150px); }
.hx .px-tile .pf-badge { margin-bottom: 18px; }
.hx-cta { margin-top: clamp(88px, 13vh, 132px); }
body.home .ft { background: #050506; }
body.home .ft-in { max-width: calc(var(--wrap) + 2 * var(--g)); margin: 0 auto; }
body.home .ft-cta, body.home .ft-base { border: 0; }

@media (prefers-reduced-motion: reduce) {
  .hx-bridge-bg, .hx-bridge-in > * { opacity: 1; transform: none; transition: none; }
}

/* once the story has scrolled away, the nav gets the same quiet bar as the other pages */
body.home .nav { transition: background 0.35s ease; }
body.home .nav.solid { background: rgba(5, 5, 6, 0.78); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }