@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,sans-serif;color:#27272a;background:#fff}.site-header{height:82px;background:#151517;color:#fff}.header-inner{width:min(1020px,calc(100% - 48px));height:82px;margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:15px;height:46px;color:#a8a8ad;text-decoration:none}.brand img{width:34px;height:34px;object-fit:cover;object-position:center;mix-blend-mode:screen}.brand span{font-size:16px;letter-spacing:4px;font-weight:400;white-space:nowrap}nav{display:flex;align-items:center;gap:54px}nav a{color:#a8a8ad;text-decoration:none;font-size:15px;transition:.15s}nav a:hover{color:#fff}.hero{min-height:784px;background:#fff}.hero-inner{width:min(1020px,calc(100% - 48px));min-height:784px;margin:auto;display:grid;grid-template-columns:1fr 1fr;align-items:center}.hero-copy{padding-top:10px}.hero h1{font-size:48px;line-height:1.16;font-weight:400;margin:0 0 28px;letter-spacing:-.5px}.hero h1 strong{font-weight:700}.hero h2{font-size:26px;font-weight:400;color:#a5a5ab;margin:0 0 5px}.hero ul{list-style:none;padding:0;margin:0;color:#a5a5ab;font-size:18px;line-height:1.48;max-width:540px}.hero li{position:relative;padding-left:14px}.hero li:before{content:"•";position:absolute;left:0}.pill{display:inline-flex;align-items:center;justify-content:center;min-width:248px;height:58px;padding:0 30px;border-radius:30px;background:#29292d;color:#fff;text-decoration:none;font-size:15px;margin-top:48px;transition:.15s}.pill:hover{background:#171719}.hero-art{display:flex;justify-content:center;align-items:center}.hero-art img{width:500px;height:590px;object-fit:cover;object-position:center;mix-blend-mode:multiply}.footer{height:84px;background:#151517}.page-intro,.content,.apply-content{width:min(1020px,calc(100% - 48px));margin:auto}.page-intro{padding-top:120px}.eyebrow{font-size:13px;font-weight:700;color:#999ca5;letter-spacing:.3px;margin-bottom:15px}.page-intro h1{font-size:46px;line-height:1.12;margin:0;font-weight:700;letter-spacing:-.8px}.rule-block{padding:30px 0 34px}.rule-block.light{background:#fff}.rule-block.dark{background:#151517;color:#ededee}.rule-block h2{font-size:28px;line-height:1.2;margin:0 0 7px}.rule-block p,.rule-block li{font-size:16px;line-height:1.5;margin:2px 0;color:inherit}.rule-block ul{padding-left:28px;margin-top:4px}.rule-block+.rule-block .content{border-top:1px solid currentColor;padding-top:30px;opacity:.98}.rule-block.light+.rule-block.light .content{border-color:#dedee1}.rule-block.dark+.rule-block.dark .content{border-color:#3b3b3f}.rule-block.dark{padding-bottom:38px}.to-top{position:fixed;right:24px;bottom:24px;width:29px;height:29px;border-radius:50%;background:#c9c9cd;color:#333;text-decoration:none;display:flex;align-items:center;justify-content:center;font-size:21px}.apply-page{background:#fff;min-height:calc(100vh - 82px)}.apply-page .page-intro{padding-bottom:72px}.apply-page .page-intro h1{font-size:43px}.lead{font-size:16px;color:#777;margin:3px 0}.apply-content{padding-bottom:42px}.apply-content hr{border:0;border-top:1px solid #dedee1;margin:0 0 31px}.apply-content h3{font-size:18px;margin:0 0 8px}.apply-content h4{font-size:17px;margin:27px 0 8px}.apply-content p,.apply-content li{font-size:16px;line-height:1.48;color:#6f7076;margin:3px 0}.apply-content ol{padding-left:20px;margin:3px 0 25px}.apply-buttons{display:flex;justify-content:space-around;gap:80px;padding-top:4px}.apply-buttons .pill{width:342px;margin-top:6px}.ukit-footer{height:82px;background:#000;color:#999;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}.ukit-footer span{margin-left:8px;background:#e000c8;color:#fff;border-radius:25px;padding:12px 18px;font-size:19px;font-weight:400}@media(max-width:800px){.site-header,.header-inner{height:auto;min-height:72px}.header-inner{padding:12px 0;flex-direction:column;gap:8px}.brand{height:38px}.brand img{width:29px;height:29px}nav{gap:18px;flex-wrap:wrap;justify-content:center}nav a{font-size:13px}.hero{min-height:auto}.hero-inner{min-height:auto;grid-template-columns:1fr;padding:85px 0 100px;gap:45px}.hero h1{font-size:40px}.hero-art{order:-1}.hero-art img{width:370px;height:410px}.page-intro{padding-top:75px}.page-intro h1,.apply-page .page-intro h1{font-size:36px}.rule-block{padding:26px 0 30px}.rule-block h2{font-size:24px}.rule-block p,.rule-block li,.apply-content p,.apply-content li{font-size:15px}.apply-page .page-intro{padding-bottom:45px}.apply-buttons{flex-direction:column;align-items:center;gap:10px}.apply-buttons .pill{width:min(342px,100%)}}@media(max-width:480px){.header-inner,.page-intro,.content,.apply-content,.hero-inner{width:calc(100% - 30px)}nav{gap:12px}.hero h1{font-size:32px}.hero-art img{width:300px;height:340px}.pill{min-width:210px;width:100%}}


/* Precision alignment pass against the supplied uKit reference */
.site-header,
.header-inner { height: 80px; }
.header-inner { width: min(1020px, calc(100% - 48px)); }
.brand {
  display: inline-flex; align-items: center; gap: 16px;
  height: 50px; overflow: visible; text-decoration: none; white-space: nowrap;
}
.brand img { display: block; width: 32px; height: 32px; object-fit: contain; flex: 0 0 32px; }
.brand span {
  color: #a5a5ae; font-size: 15px; font-weight: 400;
  letter-spacing: 4.2px; line-height: 1;
}
nav { gap: 54px; }
.hero { height: calc(100vh - 168px); min-height: 700px; background: #fff; }
.hero-inner {
  width: min(1020px, calc(100% - 48px)); height: 100%; min-height: 0;
  grid-template-columns: 1fr 1fr; align-items: center;
}
.hero-copy { padding-top: 0; transform: translateY(-18px); }
.hero h1 { font-size: 48px; line-height: 1.05; margin: 0 0 30px; letter-spacing: -0.5px; }
.hero h2 { font-size: 26px; line-height: 1.25; margin: 0 0 2px; }
.hero ul { font-size: 18px; line-height: 1.48; max-width: 500px; }
.hero li { padding-left: 13px; }
.hero .pill { min-width: 248px; height: 58px; margin-top: 48px; font-size: 15px; }
.hero-art { justify-content: center; align-items: center; transform: translate(0, 4px); }
.hero-art img {
  width: 450px; height: 510px; object-fit: contain; mix-blend-mode: multiply;
}
.footer { height: 88px; width: 100%; background: #151517; }
@media(max-width:800px) {
  .site-header, .header-inner { height: auto; min-height: 72px; }
  .header-inner { padding: 12px 0; }
  .brand span { font-size: 12px; letter-spacing: 3px; }
  .hero { height: auto; min-height: 0; }
  .hero-inner { height: auto; min-height: 0; padding: 55px 0 75px; }
  .hero-copy { transform: none; }
  .hero h1 { font-size: 38px; }
  .hero h2 { font-size: 24px; }
  .hero ul { font-size: 18px; }
  .hero-art { transform: none; }
  .hero-art img { width: min(450px, 100%); height: auto; }
  .footer { height: 70px; }
}
@media(max-width:480px) {
  .brand { gap: 10px; }
  .brand span { letter-spacing: 2px; }
  .hero h1 { font-size: 31px; }
}

.site-header,.header-inner{height:86px;} .footer{height:94px;}


/* Smooth entrance animations */
@keyframes aeren-rise-in {
  from { opacity: 0; transform: translateY(34px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes aeren-rise-in-art {
  from { opacity: 0; transform: translate(-30px, 34px); }
  to { opacity: 1; transform: translate(-30px, 0); }
}
.site-header { animation: aeren-rise-in .65s ease both; }
.hero-copy, .hero-art, .page-intro, .apply-content, .to-top {
  animation: aeren-rise-in .7s cubic-bezier(.22,1,.36,1) both;
}
.hero-copy { animation-delay: .08s; }
.hero-art { animation: aeren-rise-in-art .8s cubic-bezier(.22,1,.36,1) .14s both; }
.page-intro { animation-delay: .06s; }
.apply-content { animation-delay: .16s; }
.rule-block {
  animation: aeren-rise-in .7s cubic-bezier(.22,1,.36,1) both;
}
.rule-block:nth-of-type(2) { animation-delay: .05s; }
.rule-block:nth-of-type(3) { animation-delay: .10s; }
.rule-block:nth-of-type(4) { animation-delay: .15s; }
.rule-block:nth-of-type(5) { animation-delay: .20s; }
.rule-block:nth-of-type(6) { animation-delay: .25s; }
.rule-block:nth-of-type(7) { animation-delay: .30s; }
.rule-block:nth-of-type(8) { animation-delay: .35s; }
.rule-block:nth-of-type(9) { animation-delay: .40s; }
.rule-block:nth-of-type(10) { animation-delay: .45s; }
.rule-block:nth-of-type(11) { animation-delay: .50s; }
.rule-block:nth-of-type(12) { animation-delay: .55s; }
.rule-block:nth-of-type(13) { animation-delay: .60s; }
.pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:248px;
  height:58px;
  padding:0 30px;
  border-radius:30px;
  background:#29292d;
  color:#fff;
  text-decoration:none;
  font-size:15px;
  margin-top:48px;

  transition:
    transform .2s ease,
    background-color .2s ease;
}

.pill:hover{
  transform:scale(1.08);
  background:#171719;
}

.pill:active{
  transform:scale(1.03);
}

/* Match the reference composition: keep the right emblem slightly closer to the text. */
.hero-inner { grid-template-columns: 1.03fr .97fr; }
.hero-art { transform: translate(-30px, 4px); }
.hero-copy { max-width: 520px; }
@media(max-width:800px) {
  .hero-inner { grid-template-columns: 1fr; }
  .hero-art { transform: none; animation: aeren-rise-in .8s cubic-bezier(.22,1,.36,1) .14s both; }
}

/* Final visual alignment: match the original reference composition */
.site-header {
  animation: none;
}

/* Header stays still; only its text enters softly. */
.brand span,
nav a {
  opacity: 0;
  transform: translateY(-8px);
  animation: header-text-in .55s cubic-bezier(.22,1,.36,1) forwards;
}
.brand span { animation-delay: .08s; }
nav a:nth-child(1) { animation-delay: .14s; }
nav a:nth-child(2) { animation-delay: .20s; }
nav a:nth-child(3) { animation-delay: .26s; }

@keyframes header-text-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Make the upper-left logo + title read closer to the old site. */
.brand {
  transform: scale(1.07);
  transform-origin: left center;
}
.brand img { width: 34px; height: 34px; flex-basis: 34px; }
.brand span { font-size: 15.5px; letter-spacing: 4.3px; }

/* Original home-page proportions: wider text block, two-line heading,
   and the emblem a little farther to the right. */
.hero-inner {
  grid-template-columns: 1.12fr .88fr;
}
.hero-copy {
  max-width: 560px;
  transform: translate(-2px, -18px);
}
.hero h1 {
  font-size: 40px;
  line-height: 1.08;
  margin-bottom: 17px;
  letter-spacing: -.45px;
}
.hero h2 {
  font-size: 18px;
  line-height: 1.25;
  margin-bottom: 3px;
}
.hero ul {
  font-size: 14px;
  line-height: 1.45;
  max-width: 530px;
}
.hero li { padding-left: 13px; }
.hero .pill {
  min-width: 248px;
  height: 58px;
  margin-top: 27px;
}
.hero-art {
  transform: translate(15px, 4px);
}
.hero-art img {
  width: 450px;
  height: 510px;
}

/* Rules: reveal the actual text line-by-line while scrolling.
   The section itself no longer slides in as one large block. */
.rule-block {
  animation: none !important;
}
.rule-block .reveal-item {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .55s ease var(--reveal-delay, 0ms),
              transform .65s cubic-bezier(.22,1,.36,1) var(--reveal-delay, 0ms);
}
.rule-block .reveal-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 800px) {
  .brand { transform: scale(1.03); }
  .hero-inner { grid-template-columns: 1fr; }
  .hero-copy { transform: none; max-width: none; }
  .hero h1 { font-size: 38px; }
  .hero ul { font-size: 17px; }
  .hero-art { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .brand span, nav a { opacity: 1; transform: none; animation: none; }
  .rule-block .reveal-item { opacity: 1; transform: none; transition: none; }
}

/* Keep the entrance motion while preserving the final reference positions. */
@keyframes hero-copy-rise {
  from { opacity: 0; transform: translate(-2px, 16px); }
  to { opacity: 1; transform: translate(-2px, -18px); }
}
@keyframes hero-art-rise {
  from { opacity: 0; transform: translate(-5px, 38px); }
  to { opacity: 1; transform: translate(15px, 4px); }
}
.hero-copy {
  animation: hero-copy-rise .72s cubic-bezier(.22,1,.36,1) .08s both;
}
.hero-art {
  animation: hero-art-rise .82s cubic-bezier(.22,1,.36,1) .14s both;
}
@media (max-width: 800px) {
  .hero-copy {
    animation: aeren-rise-in .72s cubic-bezier(.22,1,.36,1) .08s both;
  }
  .hero-art {
    animation: aeren-rise-in .82s cubic-bezier(.22,1,.36,1) .14s both;
  }
}

/* Final pass: progressive text reveals on the home and applications pages. */
.hero-copy {
  animation: none;
  transform: translate(-2px, -18px) scale(1.5);
  transform-origin: left center;
}
.hero-copy .hero-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .58s ease var(--reveal-delay, 0ms),
              transform .68s cubic-bezier(.22,1,.36,1) var(--reveal-delay, 0ms);
}
.hero-copy .hero-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* The star stays alive after its entrance: a tiny, continuous space-like drift. */
@keyframes star-space-drift {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  25% { transform: translate3d(4px, -3px, 0) rotate(.7deg); }
  50% { transform: translate3d(-3px, 4px, 0) rotate(-.55deg); }
  75% { transform: translate3d(3px, 2px, 0) rotate(.45deg); }
}
.hero-art img {
  animation: star-space-drift 7s ease-in-out infinite;
  transform-origin: center center;
}

/* Applications page: each line/element reveals while scrolling into view. */
.apply-page .apply-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .55s ease var(--reveal-delay, 0ms),
              transform .65s cubic-bezier(.22,1,.36,1) var(--reveal-delay, 0ms);
}
.apply-page .apply-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 800px) {
  .hero-copy {
    transform: scale(1.5);
    transform-origin: center top;
    margin: 30px 0 45px;
  }
  .hero-copy .hero-reveal { transform: translateY(18px); }
  .hero-copy .hero-reveal.is-visible { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-copy,
  .hero-copy .hero-reveal,
  .apply-page .apply-reveal,
  .hero-art img {
    animation: none !important;
    transition: none !important;
  }
  .hero-copy .hero-reveal,
  .apply-page .apply-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Prevent the application container from animating as one block; its lines animate individually. */
.apply-page .page-intro,
.apply-page .apply-content { animation: none !important; }

/* User-requested final home scale adjustment */
.hero-copy {
  transform: translate(-2px, -18px) scale(1.2);
}
@media (max-width: 800px) {
  .hero-copy {
    transform: scale(1.2);
    transform-origin: center top;
    margin: 30px 0 45px;
  }
}

.hero-copy .pill:hover {
  transform: translateY(0) scale(1.08);
  background: #171719;
  box-shadow: 0 10px 24px rgba(0,0,0,.14);
}

.hero-copy .pill:active {
  transform: translateY(0) scale(1.03);
}
