:root {
  color-scheme: dark;
  --bg: #07101d;
  --bg-soft: #0d1928;
  --panel: #111e2d;
  --line: rgba(198, 215, 235, .17);
  --text: #f8fafc;
  --muted: #b8c5d4;
  --red: #e11d2e;
  --red-dark: #b70f20;
  --cyan: #35c7ed;
  --shell: 1440px;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.transition-shell { width: min(var(--shell), calc(100% - 48px)); margin: 0 auto; }

.transition-header {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid var(--line);
  background: rgba(5, 13, 24, .96);
}
.header-inner { min-height: 72px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 32px; }
.transition-brand img { width: 184px; height: 54px; object-fit: contain; }
.header-inner nav { justify-self: center; display: flex; align-items: center; gap: 34px; }
.header-inner nav a { color: #cbd6e2; font-weight: 750; }
.header-inner nav a:hover, .header-inner nav a:focus-visible { color: #fff; }
.header-news-link { min-height: 42px; display: inline-flex; align-items: center; gap: 14px; padding: 0 17px; border: 1px solid rgba(255,255,255,.2); border-radius: 6px; font-weight: 850; }
.header-news-link:hover, .header-news-link:focus-visible { border-color: var(--red); background: rgba(225,29,46,.12); }

.transition-hero {
  min-height: 700px;
  position: relative;
  display: grid;
  align-items: stretch;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(3,9,17,.98) 0%, rgba(3,9,17,.91) 35%, rgba(3,9,17,.5) 62%, rgba(3,9,17,.2) 100%),
    url("newsroom-hero.png") center / cover no-repeat;
}
.transition-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 150px; background: linear-gradient(transparent, var(--bg)); pointer-events: none; }
.hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .72fr); gap: clamp(42px, 6vw, 96px); align-items: center; padding: 64px 0 92px; }
.hero-copy { max-width: 790px; }
.status-label { width: max-content; display: inline-flex; align-items: center; gap: 10px; margin-bottom: 18px; padding: 10px 14px; border-radius: 4px; background: var(--red); color: #fff; font-size: 14px; font-weight: 950; text-transform: uppercase; }
.status-label span { width: 9px; height: 9px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 5px rgba(255,255,255,.18); }
.hero-copy h1 { max-width: 820px; margin: 0; color: #fff; font-size: clamp(52px, 5.7vw, 88px); line-height: .93; letter-spacing: 0; text-wrap: balance; }
.hero-copy > p { max-width: 720px; margin: 24px 0 0; color: #d2dce8; font-size: clamp(18px, 1.7vw, 24px); line-height: 1.5; font-weight: 560; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.transition-button { min-height: 58px; min-width: 250px; display: inline-flex; align-items: center; justify-content: space-between; gap: 22px; padding: 0 22px; border: 1px solid rgba(255,255,255,.36); border-radius: 6px; color: #fff; font-size: 17px; font-weight: 900; transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.transition-button:hover, .transition-button:focus-visible { transform: translateY(-2px); }
.transition-button.primary { border-color: var(--red); background: var(--red); box-shadow: 0 18px 45px rgba(225,29,46,.22); }
.transition-button.primary:hover, .transition-button.primary:focus-visible { background: #f1263a; }
.transition-button.secondary { background: rgba(5,13,24,.72); backdrop-filter: blur(12px); }
.transition-button.secondary:hover, .transition-button.secondary:focus-visible { border-color: #fff; background: rgba(16,29,44,.92); }
.destination { width: max-content; display: inline-flex; gap: 9px; margin-top: 16px; color: var(--cyan); font-weight: 850; }

.news-showcase { position: relative; width: min(100%, 520px); justify-self: end; border: 1px solid rgba(255,255,255,.25); border-radius: 8px; overflow: hidden; background: rgba(7,16,29,.96); box-shadow: 0 36px 100px rgba(0,0,0,.48); transform: rotate(1.2deg); transition: transform .22s ease, border-color .22s ease; }
.news-showcase:hover, .news-showcase:focus-visible { transform: rotate(0) translateY(-5px); border-color: rgba(255,82,98,.8); }
.showcase-browserbar { min-height: 40px; display: flex; align-items: center; gap: 7px; padding: 0 13px; border-bottom: 1px solid var(--line); background: #162335; }
.showcase-browserbar > span { width: 8px; height: 8px; border-radius: 50%; background: #62758a; }
.showcase-browserbar > span:first-child { background: #ff5667; }
.showcase-browserbar b { margin-left: 8px; color: #9fb2c6; font-size: 11px; }
.showcase-brand { min-height: 65px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; }
.showcase-brand strong { font-size: 27px; }
.showcase-brand strong span { color: var(--red); }
.showcase-brand em { padding: 6px 9px; border-radius: 4px; background: rgba(225,29,46,.15); color: #ff6472; font-size: 11px; font-style: normal; font-weight: 950; }
.news-showcase > img { width: 100%; aspect-ratio: 16 / 7.5; object-fit: cover; }
.showcase-story { padding: 20px 20px 18px; }
.showcase-story > span { color: #55d2f3; font-size: 11px; font-weight: 950; text-transform: uppercase; }
.showcase-story h2 { margin: 8px 0 0; color: #fff; font-size: clamp(24px, 2.3vw, 34px); line-height: 1.06; }
.showcase-story p { margin: 10px 0 0; color: #afbdcc; line-height: 1.48; }
.showcase-live { min-height: 52px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 0 20px; border-top: 1px solid var(--line); background: linear-gradient(90deg, rgba(225,29,46,.15), rgba(53,199,237,.08)); font-size: 13px; }
.showcase-live i { width: 10px; height: 10px; border-radius: 50%; background: #28d17c; box-shadow: 0 0 0 6px rgba(40,209,124,.12); }
.showcase-live span { color: #58d7f6; font-weight: 900; }

.news-benefits { position: relative; z-index: 2; margin-top: -28px; padding-bottom: 36px; }
.benefits-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #101c2a; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
.benefits-grid a { min-height: 126px; display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: center; padding: 20px; border-right: 1px solid var(--line); transition: background .18s ease; }
.benefits-grid a:last-child { border-right: 0; }
.benefits-grid a:hover, .benefits-grid a:focus-visible { background: rgba(225,29,46,.09); }
.benefits-grid > a > span { color: #ff5363; font-size: 13px; font-weight: 950; }
.benefits-grid strong, .benefits-grid small { display: block; }
.benefits-grid strong { color: #fff; font-size: 17px; }
.benefits-grid small { margin-top: 6px; color: #94a6ba; line-height: 1.42; }
.news-ribbon { min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 22px; padding: 10px 24px; overflow: hidden; background: var(--red); color: #fff; font-size: 13px; font-weight: 950; white-space: nowrap; }
.news-ribbon > span { padding: 7px 10px; border-radius: 4px; background: #fff; color: #aa0d1c; }
.news-ribbon i { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.65); }
.news-ribbon strong { color: #fff; text-decoration: underline; text-underline-offset: 4px; }

.reason-section { border-block: 1px solid var(--line); background: #0a1422; padding: 74px 0; }
.reason-layout { display: grid; grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr); gap: clamp(40px, 7vw, 110px); align-items: start; }
.section-heading > span, .archive-heading > div > span, .final-cta span { color: #ff5262; font-size: 13px; font-weight: 950; text-transform: uppercase; }
.section-heading h2, .archive-heading h2 { margin: 12px 0 0; color: #fff; font-size: clamp(34px, 4vw, 58px); line-height: 1.02; letter-spacing: 0; }
.reason-copy { display: grid; gap: 18px; }
.reason-copy > p { margin: 0; color: #c6d2df; font-size: 18px; line-height: 1.68; }
.reason-copy strong { color: #fff; }
.archive-assurance { margin-top: 8px; display: grid; grid-template-columns: 38px 1fr; gap: 14px; align-items: start; padding: 18px; border: 1px solid rgba(53,199,237,.35); border-radius: 8px; background: rgba(53,199,237,.08); }
.archive-assurance > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #0e8c66; color: #fff; font-size: 20px; font-weight: 950; }
.archive-assurance p { margin: 0; color: #dbe5ef; line-height: 1.55; }

.archive-section { padding: 78px 0 88px; background: linear-gradient(180deg, #07101d, #0a1523); }
.archive-heading { display: flex; justify-content: space-between; gap: 28px; align-items: end; margin-bottom: 30px; }
.archive-heading h2 { font-size: clamp(38px, 4.5vw, 64px); }
.archive-heading p { margin: 12px 0 0; color: var(--muted); font-size: 18px; }
.archive-all { flex: 0 0 auto; display: inline-flex; gap: 14px; align-items: center; padding-bottom: 7px; border-bottom: 2px solid var(--red); font-weight: 900; }
.archive-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.archive-card { position: relative; min-width: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--panel); transition: transform .18s ease, border-color .18s ease; }
.archive-card:hover, .archive-card:focus-visible { transform: translateY(-4px); border-color: rgba(225,29,46,.7); }
.archive-card img { width: 100%; aspect-ratio: 16 / 7.3; object-fit: cover; filter: saturate(.86) contrast(1.03); }
.archive-card > div { position: relative; min-height: 190px; padding: 22px 58px 22px 22px; }
.archive-card span { color: #ff6673; font-size: 12px; font-weight: 950; text-transform: uppercase; }
.archive-card strong { display: block; margin-top: 8px; color: #fff; font-size: 26px; }
.archive-card p { margin: 10px 0 0; color: var(--muted); line-height: 1.52; }
.archive-card b { position: absolute; right: 22px; bottom: 22px; color: #fff; font-size: 24px; }

.final-cta { padding: 0 0 78px; background: #0a1523; }
.final-cta-inner { min-height: 210px; display: flex; justify-content: space-between; align-items: center; gap: 30px; padding: 36px; border-left: 5px solid var(--red); border-radius: 7px; background: linear-gradient(110deg, #172638, #101b29 68%, #261018); }
.final-cta h2 { max-width: 760px; margin: 10px 0 0; font-size: clamp(30px, 3.5vw, 48px); line-height: 1.05; }
.final-cta p { max-width: 760px; margin: 12px 0 0; color: #b8c6d6; font-size: 16px; line-height: 1.5; }

footer { border-top: 1px solid var(--line); background: #050c16; }
.footer-inner { min-height: 130px; display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.footer-inner > div strong { font-size: 28px; }
.footer-inner > div strong span { color: var(--red); }
.footer-inner p { margin: 5px 0 0; color: #8192a6; }
.footer-inner nav { display: flex; flex-wrap: wrap; gap: 24px; color: #aebdcd; font-weight: 700; }
.footer-inner nav a:hover, .footer-inner nav a:focus-visible { color: #fff; }

@media (max-width: 900px) {
  .transition-shell { width: min(100% - 32px, var(--shell)); }
  .header-inner { grid-template-columns: 1fr auto; }
  .header-inner nav { display: none; }
  .transition-hero { min-height: auto; background-position: 62% center; }
  .hero-inner { grid-template-columns: 1fr; padding-top: 70px; }
  .news-showcase { width: min(100%, 650px); justify-self: start; transform: none; }
  .benefits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .benefits-grid a:nth-child(2) { border-right: 0; }
  .benefits-grid a:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .news-ribbon { justify-content: flex-start; overflow-x: auto; }
  .reason-layout { grid-template-columns: 1fr; gap: 28px; }
  .archive-grid { grid-template-columns: 1fr; }
  .archive-card { display: grid; grid-template-columns: minmax(220px, .8fr) 1fr; }
  .archive-card img { height: 100%; aspect-ratio: auto; }
  .final-cta-inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 620px) {
  .transition-shell { width: min(100% - 24px, var(--shell)); }
  .header-inner { min-height: 64px; }
  .transition-brand img { width: 154px; height: 48px; }
  .header-news-link { min-height: 40px; padding: 0 12px; font-size: 13px; }
  .header-news-link span { display: none; }
  .transition-hero { min-height: auto; background-position: 68% center; }
  .transition-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3,9,17,.58), rgba(3,9,17,.94) 70%); }
  .hero-inner { align-items: end; padding: 74px 0 66px; gap: 34px; }
  .status-label { font-size: 12px; }
  .hero-copy h1 { font-size: clamp(44px, 14vw, 62px); }
  .hero-copy > p { font-size: 17px; }
  .hero-actions { display: grid; }
  .transition-button { width: 100%; min-width: 0; }
  .news-showcase { display: block; }
  .showcase-story h2 { font-size: 25px; }
  .showcase-live { grid-template-columns: auto 1fr; }
  .showcase-live span { display: none; }
  .news-benefits { margin-top: -18px; padding-bottom: 28px; }
  .benefits-grid { grid-template-columns: 1fr; }
  .benefits-grid a { min-height: 96px; border-right: 0; border-bottom: 1px solid var(--line); }
  .benefits-grid a:last-child { border-bottom: 0; }
  .reason-section, .archive-section { padding: 54px 0; }
  .archive-heading { display: grid; align-items: start; }
  .archive-all { width: max-content; }
  .archive-card { display: block; }
  .archive-card img { height: auto; aspect-ratio: 16 / 8.2; }
  .final-cta { padding-bottom: 54px; }
  .final-cta-inner { padding: 24px; }
  .footer-inner { padding: 30px 0; display: grid; }
  .footer-inner nav { gap: 16px 22px; }
}