:root {
  --bg: #0f1115;
  --bg-panel: rgba(255, 255, 255, 0.035);
  --bg-panel-hover: rgba(255, 255, 255, 0.055);
  --text: #f1efe9;
  --text-muted: rgba(241, 239, 233, 0.68);
  --text-soft: rgba(241, 239, 233, 0.5);
  --radius: 22px;
  --container: 1180px;
  --nav-height: 78px;
  --section-space: 72px;
  --section-space-mobile: 56px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  letter-spacing: 0.01em;
  overflow-x: hidden;
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -3;
}

body::before {
  background:
    radial-gradient(circle at 18% 18%, rgba(42, 60, 95, 0.24), transparent 32%),
    radial-gradient(circle at 82% 24%, rgba(31, 44, 70, 0.18), transparent 28%),
    radial-gradient(circle at 55% 78%, rgba(24, 36, 58, 0.22), transparent 34%),
    linear-gradient(135deg, #0f1115 0%, #10141b 34%, #121823 66%, #0e1014 100%);
  background-size: 140% 140%;
  transform: scale(1.08);
}

body::after {
  background:
    radial-gradient(circle at center, transparent 38%, rgba(8, 9, 12, 0.38) 100%),
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.04), transparent 34%);
  z-index: -2;
}

.grain {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: 0.12;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.12) 0.6px, transparent 0.8px),
    radial-gradient(circle at 80% 35%, rgba(255, 255, 255, 0.09) 0.5px, transparent 0.7px),
    radial-gradient(circle at 40% 70%, rgba(255, 255, 255, 0.1) 0.6px, transparent 0.85px),
    radial-gradient(circle at 72% 82%, rgba(255, 255, 255, 0.07) 0.5px, transparent 0.75px);
  background-size: 170px 170px, 210px 210px, 190px 190px, 230px 230px;
  mix-blend-mode: soft-light;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.container {
  width: min(calc(100% - 40px), var(--container));
  margin: 0 auto;
}

.site-nav {
  position: sticky;
  top: 0;
  z-index: 30;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  background: linear-gradient(to bottom, rgba(13, 15, 19, 0.76), rgba(13, 15, 19, 0.54));
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.nav-inner {
  min-height: var(--nav-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.brand {
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text);
}

.nav-links,
.mobile-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 26px;
}

.nav-links a,
.mobile-menu a {
  color: var(--text-muted);
  transition: color 180ms var(--ease);
}

.nav-links a:hover,
.nav-links a:focus-visible,
.mobile-menu a:hover,
.mobile-menu a:focus-visible,
.social-links a:hover,
.social-links a:focus-visible,
.brand:hover,
.brand:focus-visible {
  color: var(--text);
}

.menu-button {
  display: none;
  width: 46px;
  height: 46px;
  border: 0;
  background: transparent;
  color: var(--text);
  padding: 0;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.menu-button span {
  position: relative;
  width: 20px;
  height: 1px;
  background: currentColor;
  transition: background 200ms var(--ease);
}

.menu-button span::before,
.menu-button span::after {
  content: "";
  position: absolute;
  left: 0;
  width: 20px;
  height: 1px;
  background: currentColor;
  transition: transform 240ms var(--ease), top 240ms var(--ease), bottom 240ms var(--ease);
}

.menu-button span::before {
  top: -6px;
}

.menu-button span::after {
  bottom: -6px;
}

.menu-button[aria-expanded="true"] span {
  background: transparent;
}

.menu-button[aria-expanded="true"] span::before {
  top: 0;
  transform: rotate(45deg);
}

.menu-button[aria-expanded="true"] span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

.mobile-menu-wrap {
  display: none;
  overflow: hidden;
  max-height: 0;
  transition: max-height 260ms var(--ease);
}

.mobile-menu {
  display: grid;
  gap: 4px;
  padding: 0;
}

.mobile-menu a {
  display: block;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

main {
  position: relative;
  z-index: 1;
}

section {
  padding: 0;
}

.hero {
  position: relative;
  padding: 0;
  overflow: hidden;
}

.hero + section,
section + section {
  margin-top: var(--section-space);
}

main > section:last-of-type {
  padding-bottom: var(--section-space);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, transparent 34%, rgba(5, 6, 8, 0.62) 100%);
  z-index: 1;
  pointer-events: none;
}

.hero-bg {
  position: absolute;
  inset: -12%;
  background:
    radial-gradient(ellipse at bottom, #23324f 0%, #0a0d13 72%, #05070b 100%);
  z-index: 0;
}

.hero-sky {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
}

.hero-sky-inner {
  position: absolute;
  top: 0;
  left: 50%;
  width: max(1800px, 100%);
  height: 2000px;
  transform: translateX(-50%);
}

.hero-star-layer,
.hero-star-layer::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
}

.hero-star-layer::after {
  top: 2000px;
}

.hero-star-layer-1 {
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow: 1111px 789px #ffffff, 2px 1368px #ffffff, 548px 530px #ffffff, 537px 1184px #ffffff, 464px 930px #ffffff, 1525px 1217px #ffffff, 1378px 247px #ffffff, 821px 1736px #ffffff, 1504px 326px #ffffff, 1063px 325px #ffffff, 280px 1913px #ffffff, 222px 1170px #ffffff, 1767px 1036px #ffffff, 1106px 884px #ffffff, 1288px 1661px #ffffff, 1107px 807px #ffffff, 12px 748px #ffffff, 1148px 1164px #ffffff, 437px 306px #ffffff, 923px 676px #ffffff, 1615px 922px #ffffff, 1580px 1305px #ffffff, 795px 1324px #ffffff, 1748px 79px #ffffff, 721px 176px #ffffff, 1347px 112px #ffffff, 1445px 102px #ffffff, 325px 935px #ffffff, 12px 1505px #ffffff, 512px 1811px #ffffff, 1303px 1758px #ffffff, 325px 216px #ffffff, 918px 308px #ffffff, 1735px 1666px #ffffff, 205px 1203px #ffffff, 1049px 532px #ffffff, 1498px 1994px #ffffff, 1125px 268px #ffffff, 1419px 1425px #ffffff, 1758px 1488px #ffffff, 1058px 1347px #ffffff, 588px 1988px #ffffff, 1749px 472px #ffffff, 134px 254px #ffffff, 1149px 815px #ffffff, 238px 403px #ffffff, 865px 1628px #ffffff, 1570px 725px #ffffff, 583px 1614px #ffffff, 1541px 1783px #ffffff, 1736px 1709px #ffffff, 278px 101px #ffffff, 564px 1795px #ffffff, 1553px 807px #ffffff, 1060px 201px #ffffff, 691px 498px #ffffff, 1371px 1078px #ffffff, 1230px 339px #ffffff, 264px 1651px #ffffff, 627px 939px #ffffff, 617px 1828px #ffffff, 1163px 64px #ffffff, 945px 1223px #ffffff, 959px 112px #ffffff, 1436px 1172px #ffffff, 1371px 182px #ffffff, 1080px 1016px #ffffff, 705px 0px #ffffff, 421px 335px #ffffff, 1395px 631px #ffffff, 1421px 636px #ffffff, 276px 1276px #ffffff, 1344px 1694px #ffffff, 903px 1120px #ffffff, 361px 517px #ffffff, 236px 1634px #ffffff, 470px 769px #ffffff, 1777px 408px #ffffff, 670px 1902px #ffffff, 1465px 1265px #ffffff, 1767px 174px #ffffff, 1570px 420px #ffffff, 71px 1488px #ffffff, 1449px 46px #ffffff, 1046px 380px #ffffff, 1181px 339px #ffffff, 1378px 1750px #ffffff, 243px 1453px #ffffff, 30px 1231px #ffffff, 1630px 1454px #ffffff, 717px 664px #ffffff, 846px 223px #ffffff, 631px 1723px #ffffff, 211px 1709px #ffffff, 65px 927px #ffffff, 536px 5px #ffffff, 1250px 1703px #ffffff, 1454px 161px #ffffff, 436px 1571px #ffffff, 580px 58px #ffffff, 393px 944px #ffffff, 1304px 668px #ffffff, 1799px 568px #ffffff, 1103px 1509px #ffffff, 968px 932px #ffffff, 1130px 1797px #ffffff, 1547px 1634px #ffffff, 288px 705px #ffffff, 1544px 1100px #ffffff, 1099px 1240px #ffffff;
  animation: starSlide 46s linear infinite;
}

.hero-star-layer-1::after {
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow: 1111px 789px #ffffff, 2px 1368px #ffffff, 548px 530px #ffffff, 537px 1184px #ffffff, 464px 930px #ffffff, 1525px 1217px #ffffff, 1378px 247px #ffffff, 821px 1736px #ffffff, 1504px 326px #ffffff, 1063px 325px #ffffff, 280px 1913px #ffffff, 222px 1170px #ffffff, 1767px 1036px #ffffff, 1106px 884px #ffffff, 1288px 1661px #ffffff, 1107px 807px #ffffff, 12px 748px #ffffff, 1148px 1164px #ffffff, 437px 306px #ffffff, 923px 676px #ffffff, 1615px 922px #ffffff, 1580px 1305px #ffffff, 795px 1324px #ffffff, 1748px 79px #ffffff, 721px 176px #ffffff, 1347px 112px #ffffff, 1445px 102px #ffffff, 325px 935px #ffffff, 12px 1505px #ffffff, 512px 1811px #ffffff, 1303px 1758px #ffffff, 325px 216px #ffffff, 918px 308px #ffffff, 1735px 1666px #ffffff, 205px 1203px #ffffff, 1049px 532px #ffffff, 1498px 1994px #ffffff, 1125px 268px #ffffff, 1419px 1425px #ffffff, 1758px 1488px #ffffff, 1058px 1347px #ffffff, 588px 1988px #ffffff, 1749px 472px #ffffff, 134px 254px #ffffff, 1149px 815px #ffffff, 238px 403px #ffffff, 865px 1628px #ffffff, 1570px 725px #ffffff, 583px 1614px #ffffff, 1541px 1783px #ffffff, 1736px 1709px #ffffff, 278px 101px #ffffff, 564px 1795px #ffffff, 1553px 807px #ffffff, 1060px 201px #ffffff, 691px 498px #ffffff, 1371px 1078px #ffffff, 1230px 339px #ffffff, 264px 1651px #ffffff, 627px 939px #ffffff, 617px 1828px #ffffff, 1163px 64px #ffffff, 945px 1223px #ffffff, 959px 112px #ffffff, 1436px 1172px #ffffff, 1371px 182px #ffffff, 1080px 1016px #ffffff, 705px 0px #ffffff, 421px 335px #ffffff, 1395px 631px #ffffff, 1421px 636px #ffffff, 276px 1276px #ffffff, 1344px 1694px #ffffff, 903px 1120px #ffffff, 361px 517px #ffffff, 236px 1634px #ffffff, 470px 769px #ffffff, 1777px 408px #ffffff, 670px 1902px #ffffff, 1465px 1265px #ffffff, 1767px 174px #ffffff, 1570px 420px #ffffff, 71px 1488px #ffffff, 1449px 46px #ffffff, 1046px 380px #ffffff, 1181px 339px #ffffff, 1378px 1750px #ffffff, 243px 1453px #ffffff, 30px 1231px #ffffff, 1630px 1454px #ffffff, 717px 664px #ffffff, 846px 223px #ffffff, 631px 1723px #ffffff, 211px 1709px #ffffff, 65px 927px #ffffff, 536px 5px #ffffff, 1250px 1703px #ffffff, 1454px 161px #ffffff, 436px 1571px #ffffff, 580px 58px #ffffff, 393px 944px #ffffff, 1304px 668px #ffffff, 1799px 568px #ffffff, 1103px 1509px #ffffff, 968px 932px #ffffff, 1130px 1797px #ffffff, 1547px 1634px #ffffff, 288px 705px #ffffff, 1544px 1100px #ffffff, 1099px 1240px #ffffff;
}

.hero-star-layer-2 {
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow: 659px 1096px rgba(222, 234, 255, 0.95), 14px 1618px rgba(222, 234, 255, 0.95), 1703px 394px rgba(222, 234, 255, 0.95), 1139px 1404px rgba(222, 234, 255, 0.95), 290px 813px rgba(222, 234, 255, 0.95), 879px 731px rgba(222, 234, 255, 0.95), 1281px 707px rgba(222, 234, 255, 0.95), 888px 208px rgba(222, 234, 255, 0.95), 386px 1313px rgba(222, 234, 255, 0.95), 416px 1px rgba(222, 234, 255, 0.95), 574px 1169px rgba(222, 234, 255, 0.95), 540px 943px rgba(222, 234, 255, 0.95), 1388px 1735px rgba(222, 234, 255, 0.95), 588px 1449px rgba(222, 234, 255, 0.95), 308px 1676px rgba(222, 234, 255, 0.95), 732px 735px rgba(222, 234, 255, 0.95), 1278px 1445px rgba(222, 234, 255, 0.95), 322px 200px rgba(222, 234, 255, 0.95), 1562px 751px rgba(222, 234, 255, 0.95), 1373px 559px rgba(222, 234, 255, 0.95), 1089px 76px rgba(222, 234, 255, 0.95), 1085px 1860px rgba(222, 234, 255, 0.95), 131px 280px rgba(222, 234, 255, 0.95), 1674px 416px rgba(222, 234, 255, 0.95), 651px 1141px rgba(222, 234, 255, 0.95), 316px 1299px rgba(222, 234, 255, 0.95), 1033px 722px rgba(222, 234, 255, 0.95), 1220px 1713px rgba(222, 234, 255, 0.95), 316px 784px rgba(222, 234, 255, 0.95), 900px 1430px rgba(222, 234, 255, 0.95), 1471px 1254px rgba(222, 234, 255, 0.95), 598px 324px rgba(222, 234, 255, 0.95), 1736px 279px rgba(222, 234, 255, 0.95), 768px 1237px rgba(222, 234, 255, 0.95), 1231px 1668px rgba(222, 234, 255, 0.95), 1217px 1627px rgba(222, 234, 255, 0.95), 1027px 621px rgba(222, 234, 255, 0.95), 797px 1756px rgba(222, 234, 255, 0.95), 1029px 1272px rgba(222, 234, 255, 0.95), 1158px 1582px rgba(222, 234, 255, 0.95), 322px 928px rgba(222, 234, 255, 0.95), 1329px 452px rgba(222, 234, 255, 0.95), 1672px 738px rgba(222, 234, 255, 0.95), 767px 1736px rgba(222, 234, 255, 0.95), 1493px 1033px rgba(222, 234, 255, 0.95), 320px 1752px rgba(222, 234, 255, 0.95), 1363px 1456px rgba(222, 234, 255, 0.95), 543px 432px rgba(222, 234, 255, 0.95), 1733px 1447px rgba(222, 234, 255, 0.95), 1390px 1591px rgba(222, 234, 255, 0.95), 842px 729px rgba(222, 234, 255, 0.95), 846px 933px rgba(222, 234, 255, 0.95), 295px 301px rgba(222, 234, 255, 0.95), 997px 1361px rgba(222, 234, 255, 0.95), 854px 1162px rgba(222, 234, 255, 0.95), 599px 1521px rgba(222, 234, 255, 0.95), 1475px 918px rgba(222, 234, 255, 0.95), 1426px 873px rgba(222, 234, 255, 0.95), 732px 319px rgba(222, 234, 255, 0.95), 951px 1701px rgba(222, 234, 255, 0.95);
  animation: starSlide 78s linear infinite;
}

.hero-star-layer-2::after {
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow: 659px 1096px rgba(222, 234, 255, 0.95), 14px 1618px rgba(222, 234, 255, 0.95), 1703px 394px rgba(222, 234, 255, 0.95), 1139px 1404px rgba(222, 234, 255, 0.95), 290px 813px rgba(222, 234, 255, 0.95), 879px 731px rgba(222, 234, 255, 0.95), 1281px 707px rgba(222, 234, 255, 0.95), 888px 208px rgba(222, 234, 255, 0.95), 386px 1313px rgba(222, 234, 255, 0.95), 416px 1px rgba(222, 234, 255, 0.95), 574px 1169px rgba(222, 234, 255, 0.95), 540px 943px rgba(222, 234, 255, 0.95), 1388px 1735px rgba(222, 234, 255, 0.95), 588px 1449px rgba(222, 234, 255, 0.95), 308px 1676px rgba(222, 234, 255, 0.95), 732px 735px rgba(222, 234, 255, 0.95), 1278px 1445px rgba(222, 234, 255, 0.95), 322px 200px rgba(222, 234, 255, 0.95), 1562px 751px rgba(222, 234, 255, 0.95), 1373px 559px rgba(222, 234, 255, 0.95), 1089px 76px rgba(222, 234, 255, 0.95), 1085px 1860px rgba(222, 234, 255, 0.95), 131px 280px rgba(222, 234, 255, 0.95), 1674px 416px rgba(222, 234, 255, 0.95), 651px 1141px rgba(222, 234, 255, 0.95), 316px 1299px rgba(222, 234, 255, 0.95), 1033px 722px rgba(222, 234, 255, 0.95), 1220px 1713px rgba(222, 234, 255, 0.95), 316px 784px rgba(222, 234, 255, 0.95), 900px 1430px rgba(222, 234, 255, 0.95), 1471px 1254px rgba(222, 234, 255, 0.95), 598px 324px rgba(222, 234, 255, 0.95), 1736px 279px rgba(222, 234, 255, 0.95), 768px 1237px rgba(222, 234, 255, 0.95), 1231px 1668px rgba(222, 234, 255, 0.95), 1217px 1627px rgba(222, 234, 255, 0.95), 1027px 621px rgba(222, 234, 255, 0.95), 797px 1756px rgba(222, 234, 255, 0.95), 1029px 1272px rgba(222, 234, 255, 0.95), 1158px 1582px rgba(222, 234, 255, 0.95), 322px 928px rgba(222, 234, 255, 0.95), 1329px 452px rgba(222, 234, 255, 0.95), 1672px 738px rgba(222, 234, 255, 0.95), 767px 1736px rgba(222, 234, 255, 0.95), 1493px 1033px rgba(222, 234, 255, 0.95), 320px 1752px rgba(222, 234, 255, 0.95), 1363px 1456px rgba(222, 234, 255, 0.95), 543px 432px rgba(222, 234, 255, 0.95), 1733px 1447px rgba(222, 234, 255, 0.95), 1390px 1591px rgba(222, 234, 255, 0.95), 842px 729px rgba(222, 234, 255, 0.95), 846px 933px rgba(222, 234, 255, 0.95), 295px 301px rgba(222, 234, 255, 0.95), 997px 1361px rgba(222, 234, 255, 0.95), 854px 1162px rgba(222, 234, 255, 0.95), 599px 1521px rgba(222, 234, 255, 0.95), 1475px 918px rgba(222, 234, 255, 0.95), 1426px 873px rgba(222, 234, 255, 0.95), 732px 319px rgba(222, 234, 255, 0.95), 951px 1701px rgba(222, 234, 255, 0.95);
}

.hero-star-layer-3 {
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow: 922px 535px rgba(255, 255, 255, 0.98), 1243px 374px rgba(255, 255, 255, 0.98), 1619px 1417px rgba(255, 255, 255, 0.98), 926px 1226px rgba(255, 255, 255, 0.98), 618px 376px rgba(255, 255, 255, 0.98), 1008px 1398px rgba(255, 255, 255, 0.98), 385px 1297px rgba(255, 255, 255, 0.98), 1291px 1414px rgba(255, 255, 255, 0.98), 189px 214px rgba(255, 255, 255, 0.98), 694px 998px rgba(255, 255, 255, 0.98), 1182px 537px rgba(255, 255, 255, 0.98), 1702px 465px rgba(255, 255, 255, 0.98), 1547px 1841px rgba(255, 255, 255, 0.98), 1548px 373px rgba(255, 255, 255, 0.98), 278px 73px rgba(255, 255, 255, 0.98), 928px 1081px rgba(255, 255, 255, 0.98), 1111px 1035px rgba(255, 255, 255, 0.98), 1769px 1451px rgba(255, 255, 255, 0.98), 663px 1805px rgba(255, 255, 255, 0.98), 1302px 1225px rgba(255, 255, 255, 0.98), 1242px 839px rgba(255, 255, 255, 0.98), 1780px 16px rgba(255, 255, 255, 0.98), 1739px 554px rgba(255, 255, 255, 0.98), 390px 335px rgba(255, 255, 255, 0.98), 808px 1015px rgba(255, 255, 255, 0.98), 34px 689px rgba(255, 255, 255, 0.98);
  animation: starSlide 118s linear infinite;
}

.hero-star-layer-3::after {
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow: 922px 535px rgba(255, 255, 255, 0.98), 1243px 374px rgba(255, 255, 255, 0.98), 1619px 1417px rgba(255, 255, 255, 0.98), 926px 1226px rgba(255, 255, 255, 0.98), 618px 376px rgba(255, 255, 255, 0.98), 1008px 1398px rgba(255, 255, 255, 0.98), 385px 1297px rgba(255, 255, 255, 0.98), 1291px 1414px rgba(255, 255, 255, 0.98), 189px 214px rgba(255, 255, 255, 0.98), 694px 998px rgba(255, 255, 255, 0.98), 1182px 537px rgba(255, 255, 255, 0.98), 1702px 465px rgba(255, 255, 255, 0.98), 1547px 1841px rgba(255, 255, 255, 0.98), 1548px 373px rgba(255, 255, 255, 0.98), 278px 73px rgba(255, 255, 255, 0.98), 928px 1081px rgba(255, 255, 255, 0.98), 1111px 1035px rgba(255, 255, 255, 0.98), 1769px 1451px rgba(255, 255, 255, 0.98), 663px 1805px rgba(255, 255, 255, 0.98), 1302px 1225px rgba(255, 255, 255, 0.98), 1242px 839px rgba(255, 255, 255, 0.98), 1780px 16px rgba(255, 255, 255, 0.98), 1739px 554px rgba(255, 255, 255, 0.98), 390px 335px rgba(255, 255, 255, 0.98), 808px 1015px rgba(255, 255, 255, 0.98), 34px 689px rgba(255, 255, 255, 0.98);
}

.hero-layout {
  position: relative;
  margin: 0 auto;
  padding: clamp(24px, 3.4vw, 34px) 0;
  min-height: 0;
  max-width: 1120px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  text-align: center;
  z-index: 3;
}

.hero-layout::before {
  content: "";
  position: absolute;
  inset: -28% -14%;
  background:
    radial-gradient(circle at 24% 34%, rgba(46, 67, 104, 0.18), transparent 26%),
    radial-gradient(circle at 74% 32%, rgba(26, 38, 63, 0.16), transparent 28%),
    radial-gradient(circle at 50% 70%, rgba(35, 50, 79, 0.12), transparent 32%),
    linear-gradient(135deg, rgba(18, 25, 38, 0.14), rgba(11, 14, 19, 0.02) 42%, rgba(27, 39, 63, 0.08) 100%);
  background-size: 150% 150%;
  animation: heroDrift 18s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: -1;
  filter: blur(36px);
  opacity: 0.55;
}

.hero-logo {
  width: min(190px, 42vw);
  height: auto;
  max-height: 118px;
  aspect-ratio: 1532 / 1248;
  object-fit: contain;
  flex: 0 0 auto;
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.28));
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  max-width: none;
  margin: 0 auto;
  font-size: clamp(1.95rem, 3.3vw, 3.1rem);
  line-height: 1;
  letter-spacing: -0.04em;
  text-wrap: balance;
  font-family: var(--font-display);
  font-weight: 600;
}

.hero-copy {
  max-width: 560px;
  color: var(--text-muted);
  font-size: 0.98rem;
  line-height: 1.75;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 22px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(40, 56, 88, 0.72), rgba(29, 40, 63, 0.9));
  color: var(--text);
  font-weight: 600;
  letter-spacing: 0.01em;
  transition:
    transform 220ms var(--ease),
    box-shadow 220ms var(--ease),
    background 220ms var(--ease);
  box-shadow: 0 14px 34px rgba(7, 10, 15, 0.32);
  cursor: pointer;
}

.button:hover,
.button:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 18px 36px rgba(7, 10, 15, 0.4);
  background: linear-gradient(180deg, rgba(47, 65, 101, 0.78), rgba(30, 42, 68, 0.94));
}

.hero-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.section-header {
  max-width: 720px;
  margin-bottom: 34px;
}

.section-label {
  display: inline-block;
  margin-bottom: 16px;
  color: var(--text-soft);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

h2 {
  font-size: clamp(1.65rem, 2.7vw, 2.55rem);
  line-height: 1.08;
  letter-spacing: -0.035em;
  font-weight: 600;
  font-family: var(--font-display);
}

.section-copy {
  margin-top: 14px;
  max-width: 660px;
  color: var(--text-muted);
}

.section-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 18px;
  color: #c4d2ee;
  font-size: 0.95rem;
  font-weight: 600;
  transition: color 180ms var(--ease), transform 180ms var(--ease);
}

.section-link:hover,
.section-link:focus-visible {
  color: var(--text);
  transform: translateX(2px);
}

.section-link i {
  font-size: 0.78rem;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.card {
  position: relative;
  padding: 28px 26px;
  background: linear-gradient(180deg, var(--bg-panel), rgba(255, 255, 255, 0.02));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--radius);
  transition:
    transform 240ms var(--ease),
    box-shadow 240ms var(--ease),
    background 240ms var(--ease),
    border-color 240ms var(--ease);
}

.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.22);
  background: linear-gradient(180deg, var(--bg-panel-hover), rgba(255, 255, 255, 0.028));
  border-color: rgba(255, 255, 255, 0.09);
}

.service-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
  color: #a9bce4;
  transition: transform 240ms var(--ease), color 240ms var(--ease);
}

.service-icon i {
  font-size: 2.3rem;
  filter: drop-shadow(0 6px 14px rgba(10, 16, 28, 0.22));
}

.services-grid .card {
  text-align: center;
}

.services-grid .card:hover .service-icon {
  transform: translateY(-2px) scale(1.03);
  color: #bfd0ee;
}

h3 {
  font-size: 1.18rem;
  line-height: 1.2;
  letter-spacing: -0.01em;
  font-weight: 600;
  font-family: inherit;
}

.card p {
  margin-top: 12px;
  color: var(--text-muted);
}

.work-slider {
  position: relative;
  display: grid;
  gap: 20px;
}

.work-viewport {
  position: relative;
  overflow: hidden;
  border-radius: calc(var(--radius) + 2px);
}

.work-track {
  display: flex;
  transition: transform 360ms var(--ease);
  will-change: transform;
}

.work-slide {
  min-width: 100%;
}

.work-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  aspect-ratio: 16 / 6;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.016));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: calc(var(--radius) + 2px);
  overflow: hidden;
  box-shadow: 0 22px 40px rgba(0, 0, 0, 0.2);
}

.work-visual {
  position: relative;
  min-height: 100%;
}

.work-zoom {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  z-index: 1;
}

.work-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10, 12, 15, 0.08), rgba(10, 12, 15, 0.18));
  pointer-events: none;
}

.work-zoom::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(9, 11, 14, 0.04), rgba(9, 11, 14, 0.22));
  opacity: 0;
  transition: opacity 220ms var(--ease);
}

.work-zoom-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(241, 239, 233, 0.16);
  background: rgba(12, 15, 20, 0.52);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
  transform: translate(-50%, -50%) scale(0.94);
  opacity: 0;
  transition: opacity 220ms var(--ease), transform 220ms var(--ease), background 220ms var(--ease);
  pointer-events: none;
}

.work-zoom-icon i {
  font-size: 1rem;
}

.work-visual:hover .work-zoom::before,
.work-visual:focus-within .work-zoom::before {
  opacity: 1;
}

.work-visual:hover .work-zoom-icon,
.work-visual:focus-within .work-zoom-icon {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.work-zoom:hover .work-zoom-icon,
.work-zoom:focus-visible .work-zoom-icon {
  background: rgba(21, 29, 42, 0.72);
}

.work-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.94) contrast(1.02);
}

.work-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100%;
  padding: clamp(28px, 5vw, 48px);
  background:
    radial-gradient(circle at top left, rgba(35, 50, 79, 0.16), transparent 42%),
    linear-gradient(180deg, rgba(16, 19, 24, 0.92), rgba(13, 15, 19, 0.98));
}

.work-meta {
  display: block;
  margin-bottom: 12px;
  color: rgba(241, 239, 233, 0.56);
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.work-copy h3 {
  font-size: clamp(1.35rem, 2.35vw, 1.85rem);
  line-height: 1.12;
  letter-spacing: -0.01em;
  font-family: inherit;
}

.work-copy p {
  margin-top: 18px;
  max-width: 42ch;
  color: rgba(241, 239, 233, 0.72);
  font-size: 1rem;
  line-height: 1.8;
}

.work-controls {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 16px;
}

.work-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-self: start;
}

.work-button {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.03);
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 180ms var(--ease), transform 180ms var(--ease), border-color 180ms var(--ease);
}

.work-button:hover,
.work-button:focus-visible {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
  transform: translateY(-1px);
}

.work-button svg {
  width: 16px;
  height: 16px;
}

.work-count {
  color: var(--text-soft);
  font-size: 0.92rem;
  justify-self: center;
}

.work-corner-tag {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 4;
  padding: 10px 16px 11px 18px;
  border-top-left-radius: 16px;
  background: linear-gradient(180deg, rgba(187, 147, 74, 0.96), rgba(151, 116, 48, 0.96));
  color: #16120a;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.24);
}

.contact-panel {
  max-width: 860px;
  margin: 0 auto;
  padding: clamp(32px, 5vw, 54px);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.028), rgba(255, 255, 255, 0.016));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: calc(var(--radius) + 2px);
}

.form-page {
  padding-top: 0;
}

.form-embed-panel {
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  overflow: hidden;
}

.contact-panel p {
  max-width: 580px;
  margin: 16px auto 0;
  color: var(--text-muted);
  text-align: center;
}

.contact-intro {
  text-align: center;
  margin-bottom: 30px;
}

.contact-intro h1 {
  max-width: none;
  font-size: clamp(1.85rem, 3.2vw, 2.55rem);
  letter-spacing: -0.035em;
}

.intake-gate {
  display: grid;
  justify-items: center;
  gap: 18px;
  margin-top: 30px;
}

.human-check {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--text-soft);
  font-size: 0.95rem;
  cursor: pointer;
}

.human-check[hidden] {
  display: none;
}

.human-check input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--blue);
}

.intake-link {
  gap: 10px;
}

.intake-link[hidden] {
  display: none;
}

footer {
  padding: 24px 0 34px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: var(--text-soft);
  font-size: 0.95rem;
}

.social-links {
  display: flex;
  align-items: center;
  gap: 18px;
}

.social-links a {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.025);
  color: var(--text-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color 180ms var(--ease), background 180ms var(--ease), border-color 180ms var(--ease), transform 180ms var(--ease);
}

.social-links a:hover,
.social-links a:focus-visible {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.12);
  transform: translateY(-1px);
}

.social-links i {
  font-size: 0.92rem;
}

.lightbox {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(9, 10, 13, 0.8);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 220ms var(--ease), visibility 220ms var(--ease);
  z-index: 60;
}

.lightbox.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.lightbox-dialog {
  position: relative;
  width: min(100%, 1040px);
  aspect-ratio: 16 / 9;
  background: #0d1015;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.lightbox-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: rgba(15, 17, 21, 0.72);
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 180ms var(--ease), transform 180ms var(--ease);
  z-index: 2;
}

.lightbox-close:hover,
.lightbox-close:focus-visible {
  background: rgba(28, 34, 45, 0.92);
  transform: translateY(-1px);
}

.lightbox-close svg {
  width: 16px;
  height: 16px;
}

.lightbox-frame {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.image-lightbox-dialog {
  width: min(100%, 1200px);
  aspect-ratio: auto;
  background: rgba(12, 15, 19, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 22px;
  padding: 18px;
  overflow: hidden;
}

.image-lightbox-figure {
  margin: 0;
  display: grid;
  gap: 14px;
}

.image-lightbox-image {
  width: 100%;
  max-height: min(80vh, 900px);
  object-fit: contain;
  border-radius: 14px;
  background: #0c0f13;
}

.image-lightbox-caption {
  color: var(--text-muted);
  font-size: 0.94rem;
  text-align: center;
}

@keyframes heroDrift {
  0% {
    transform: translate3d(-2%, -1%, 0) scale(1);
    background-position: 0% 50%;
  }
  100% {
    transform: translate3d(2%, 1.5%, 0) scale(1.04);
    background-position: 100% 50%;
  }
}

@keyframes starSlide {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-2000px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-star-layer,
  .hero-star-layer::after {
    animation: none;
  }
}

@media (max-width: 1024px) {
  .services-grid {
    grid-template-columns: 1fr;
  }

  .work-panel {
    grid-template-columns: 1fr;
  }

}

@media (max-width: 760px) {
  .hero {
    padding: 0;
  }

  .hero + section,
  section + section {
    margin-top: var(--section-space-mobile);
  }

  main > section:last-of-type {
    padding-bottom: var(--section-space-mobile);
  }

  .nav-links {
    display: none;
  }

  .menu-button {
    display: flex;
  }

  .mobile-menu-wrap {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: 0;
    padding: 0 20px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-top: 0;
    background: linear-gradient(180deg, rgba(16, 20, 29, 0.95), rgba(14, 18, 27, 0.9));
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.22);
  }

  .mobile-menu-wrap.is-open {
    max-height: 220px;
  }

  h1 {
    max-width: 11ch;
    font-size: clamp(2rem, 8vw, 2.6rem);
  }

  .work-panel {
    min-height: 0;
    aspect-ratio: auto;
  }

  .work-viewport,
  .work-slide {
    min-height: 0;
  }

  .work-visual {
    height: 280px;
    min-height: 280px;
  }

  .work-zoom-icon {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    width: 50px;
    height: 50px;
  }

  .work-copy {
    justify-content: flex-start;
    padding: 24px 22px;
  }

  .work-meta {
    margin-bottom: 8px;
  }

  .work-controls {
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }

  .work-count {
    justify-self: end;
  }

  .contact-grid {
    grid-template-columns: 1fr;
  }

  .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .footer-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .lightbox {
    padding: 16px;
  }

  .lightbox-dialog {
    border-radius: 18px;
  }

  .image-lightbox-dialog {
    padding: 14px;
    border-radius: 18px;
  }
}