/* Top bar + header + mobile menu + hero + stats */
.topbar { position: absolute; inset: 0 0 auto 0; z-index: 60; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.8); transition: opacity .3s; }.topbar .wrap { display: flex; justify-content: space-between; align-items: center; height: 40px; border-bottom: 1px solid var(--line-light); }.topbar a:hover { color: #fff; }.lang { display: inline-flex; gap: 2px; padding: 3px; border-radius: 999px; background: rgba(255,255,255,.1); }.lang button { background: none; border: 0; padding: 3px 11px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .08em; color: rgba(255,255,255,.75); }.lang button[aria-pressed="true"] { background: #fff; color: var(--ink); }body.scrolled .topbar { opacity: 0; pointer-events: none; }.header { position: fixed; inset: 40px 0 auto 0; z-index: 50; transition: background .35s, box-shadow .35s, inset .35s; }.header .wrap { display: flex; align-items: center; justify-content: space-between; height: 84px; transition: height .35s; }.logo { display: block; position: relative; width: 168px; height: 49px; }.logo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: left center; transition: opacity .3s; }.logo .logo-dark { opacity: 0; }.nav { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }.nav > li { position: relative; }.nav ul { list-style: none; margin: 0; padding: 0; }.nav-link { display: inline-flex; align-items: center; gap: 6px; padding: 12px 14px; font-size: 14px; font-weight: 600; color: #fff; border-radius: 999px; background: none; border: 0; transition: color .25s, background .25s; }.nav-link:hover { background: rgba(255,255,255,.12); }.nav-link .chev { width: 10px; height: 10px; opacity: .7; }.drop { position: absolute; left: 0; top: 100%; min-width: 250px; padding: 10px; margin-top: 8px; background: #fff; border-radius: 16px; box-shadow: var(--shadow); opacity: 0; visibility: hidden; transform: translateY(8px); transition: .25s var(--ease); }.has-drop:hover .drop, .has-drop:focus-within .drop { opacity: 1; visibility: visible; transform: none; }.drop a { display: block; padding: 11px 14px; border-radius: 10px; font-size: 14px; font-weight: 600; color: var(--charcoal); }.drop a small, .drop a .t-small { display: block; font-weight: 500; font-size: 12px; color: var(--muted); }.drop a:hover { background: var(--stone); color: var(--red); }.header .btn { padding: 12px 20px; font-size: 13px; }.burger { display: none; width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.5); background: none; position: relative; }.burger span, .burger .t-span { position: absolute; left: 13px; right: 13px; height: 2px; background: #fff; }.burger span:nth-child(1) { top: 17px; }.burger span:nth-child(2) { top: 22px; }.burger span:nth-child(3) { top: 27px; }.header.scrolled { inset: 0 0 auto 0; background: rgba(255,255,255,.94); backdrop-filter: saturate(160%) blur(16px); box-shadow: 0 1px 0 var(--line), 0 14px 40px -24px rgba(20,21,22,.4); }.header.scrolled .wrap { height: 72px; }.header.scrolled .logo-light { opacity: 0; }.header.scrolled .logo-dark { opacity: 1; }.header.scrolled .nav-link { color: var(--charcoal); }.header.scrolled .nav-link:hover { background: var(--stone); color: var(--red); }.header.scrolled .burger { border-color: var(--line); }.header.scrolled .burger span, .header.scrolled .burger .t-span { background: var(--charcoal); }.mnav { position: fixed; inset: 0; z-index: 70; background: var(--ink); color: #fff; padding: 110px var(--gut) 40px; display: flex; flex-direction: column; gap: 6px; transform: translateY(-100%); transition: transform .55s var(--ease); overflow-y: auto; }.mnav.open { transform: none; }.mnav a.m { font-size: clamp(1.7rem, 7vw, 2.4rem); font-weight: 800; letter-spacing: -.02em; padding: 10px 0; border-bottom: 1px solid var(--line-light); }.mnav-foot { margin-top: auto; padding-top: 28px; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }.mclose { position: absolute; top: 24px; right: var(--gut); width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid var(--line-light); background: none; color: #fff; font-size: 22px; }/* Hero */
.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; color: #fff; overflow: hidden; background: var(--ink); isolation: isolate; }.hero-slides { position: absolute; inset: 0; z-index: -2; }.hero-slides img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.08); transition: opacity 1.6s ease; }.hero-slides img.on { opacity: 1; animation: kenburns 14s ease-out forwards; }
@keyframes kenburns {from { transform: scale(1.08); }to { transform: scale(1) translate3d(-1%, -.5%, 0); } }.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20,21,22,.7) 0%, rgba(20,21,22,.1) 28%, rgba(20,21,22,.5) 62%, rgba(20,21,22,.92) 100%), linear-gradient(90deg, rgba(20,21,22,.66) 0%, rgba(20,21,22,0) 62%); }.hero-inner { width: 100%; padding-top: 220px; padding-bottom: 54px; }.pill { display: inline-flex; align-items: center; gap: 10px; padding: 9px 16px; border-radius: 999px; border: 1px solid var(--line-light); background: rgba(255,255,255,.08); backdrop-filter: blur(8px); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }.pill i, .pill .t-i { width: 8px; height: 8px; border-radius: 50%; background: var(--red-bright); animation: pulse 2s infinite; }
@keyframes pulse {0% { box-shadow: 0 0 0 0 rgba(232,84,91,.7); }70% { box-shadow: 0 0 0 12px rgba(232,84,91,0); }100% { box-shadow: 0 0 0 0 rgba(232,84,91,0); } }.hero h1 { color: #fff; font-size: clamp(2.4rem, 5.2vw, 4.7rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.02; margin: 26px 0 26px; max-width: 24ch; }.hero h1 .accent { display: block; color: #fff; }.hero h1 .accent::after { content: ""; display: block; width: 120px; height: 6px; margin-top: 22px; background: var(--red); border-radius: 6px; }.hero p.sub { font-size: clamp(1.05rem, 1.7vw, 1.3rem); max-width: 56ch; color: rgba(255,255,255,.88); margin-bottom: 34px; }.hero-cta { display: flex; flex-wrap: wrap; gap: 14px; }.hero-bar { margin-top: 56px; display: grid; grid-template-columns: repeat(3, 1fr) auto; border: 1px solid var(--line-light); border-radius: var(--radius-lg); background: rgba(20,21,22,.42); backdrop-filter: blur(14px); overflow: hidden; }.hero-bar > div { padding: 20px 26px; border-right: 1px solid var(--line-light); }.hero-bar small, .hero-bar .t-small { display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; color: var(--red-bright); margin-bottom: 4px; }.hero-bar strong, .hero-bar .t-strong { font-size: 15px; font-weight: 700; line-height: 1.35; display: block; }.hero-dots { display: flex; align-items: center; gap: 8px; padding: 0 28px !important; border: 0 !important; }.hero-dots button { width: 34px; height: 4px; border: 0; padding: 0; border-radius: 4px; background: rgba(255,255,255,.3); position: relative; overflow: hidden; }.hero-dots button.on::after { content: ""; position: absolute; inset: 0; background: #fff; transform-origin: left; animation: fill 7s linear forwards; }
@keyframes fill {from { transform: scaleX(0); }to { transform: scaleX(1); } }/* Stats */
.stats { background: var(--red); color: #fff; position: relative; overflow: hidden; }.stats::before { content: ""; position: absolute; right: -6%; top: -80%; width: 520px; height: 520px; border-radius: 50%; border: 70px solid rgba(255,255,255,.06); }.stats .wrap { display: grid; grid-template-columns: repeat(4, 1fr); position: relative; }.stat { padding: 46px 28px; border-left: 1px solid rgba(255,255,255,.22); }.stat:first-child { border-left: 0; padding-left: 0; }.stat b, .stat .t-b { display: block; font-size: clamp(2.8rem, 5.4vw, 4.6rem); font-weight: 800; letter-spacing: -.045em; line-height: 1; }.stat > span, .stat > .t-span { display: block; margin-top: 12px; font-size: 14px; font-weight: 600; line-height: 1.45; color: rgba(255,255,255,.92); max-width: 22ch; }/* Announcement band */
.announce { background: var(--ink); color: #fff; border-bottom: 1px solid var(--line-light); }.announce .wrap { display: flex; align-items: center; gap: 18px; padding-block: 16px; flex-wrap: wrap; }.announce .tag { font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; background: var(--red); padding: 5px 12px; border-radius: 999px; }.announce p { margin: 0; font-size: 15px; flex: 1; min-width: 240px; color: rgba(255,255,255,.82); }.announce p b, .announce p .t-b { color: #fff; }.announce .link-arrow { color: var(--red-bright); }