:root {
  --bg: #050507;
  --panel: #0b0b0f;
  --text: #f3f1ed;
  --muted: #a8a6ad;
  --orange: #ff5a17;
  --orange-hot: #ff7a1a;
  --blue: #2054ff;
  --violet: #7d2cff;
  --mx: 50vw;
  --my: 42vh;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-width: 320px;
  color: var(--text);
  background: var(--bg);
  font-family: Inter, system-ui, sans-serif;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.noise {
  position: fixed; inset: 0; z-index: 20; pointer-events: none; opacity: .055;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}
.cursor-light {
  position: fixed; inset: 0; z-index: 4; pointer-events: none;
  background:
    radial-gradient(520px circle at var(--mx) var(--my), rgba(255,96,28,.14), rgba(255,70,10,.035) 38%, transparent 68%),
    radial-gradient(680px circle at calc(var(--mx) + 18vw) calc(var(--my) - 14vh), rgba(42,62,210,.075), transparent 66%);
  mix-blend-mode: screen;
  filter: blur(8px);
  transition: opacity .45s ease;
}

.site-header {
  position: fixed; top: 0; left: 0; width: 100%; height: 88px; z-index: 30;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  padding: 0 clamp(22px, 4vw, 72px); border-bottom: 1px solid rgba(255,255,255,.1);
  background: linear-gradient(180deg, rgba(3,3,6,.82), rgba(3,3,6,.08));
  backdrop-filter: blur(8px);
}
.brand { font: 500 31px/1 Space Grotesk, sans-serif; letter-spacing: -.12em; width: max-content; }
.brand span { color: var(--orange); }
nav { display: flex; gap: clamp(20px, 3vw, 52px); }
nav a { color: #d4d1d1; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; transition: color .25s; }
nav a:hover { color: var(--orange-hot); }
.lang-switch { justify-self: end; display: flex; gap: 7px; align-items: center; font-size: 13px; }
.lang-switch button { border: 0; color: #77737b; background: transparent; cursor: pointer; padding: 8px 3px; }
.lang-switch button.active { color: var(--text); }
.lang-switch span { color: #4c4850; }

.hero { position: relative; min-height: 100svh; overflow: hidden; background: #040407; isolation: isolate; }
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 27% 38% at 50% 49%, rgba(255,94,22,.19), rgba(255,70,10,.045) 44%, transparent 76%),
    radial-gradient(ellipse 36% 24% at 50% 73%, rgba(255,89,18,.11), transparent 72%);
  mix-blend-mode: screen;
  animation: pedestal-glow 6.5s ease-in-out infinite alternate;
}
.hero::after {
  content: '';
  position: absolute;
  z-index: 2;
  left: 30%;
  right: 30%;
  bottom: 10%;
  height: 16%;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(ellipse, rgba(0,0,0,.72) 0%, rgba(0,0,0,.38) 38%, transparent 72%);
  filter: blur(18px);
  transform: perspective(420px) rotateX(68deg);
}
.hero-image {
  position: absolute; inset: 0; z-index: 0;
  background: url('./assets/ag-room-hero.png') center center / cover no-repeat;
  transform: scale(1.025); will-change: transform, filter;
  animation: room-breathe 9s ease-in-out infinite alternate;
}
.hero-shade {
  position: absolute; inset: 0; z-index: 3;
  background:
    linear-gradient(90deg, rgba(1,1,4,.84) 0%, rgba(3,3,7,.22) 30%, rgba(3,3,7,.08) 66%, rgba(1,1,4,.58) 100%),
    linear-gradient(0deg, #050507 0%, rgba(5,5,7,.48) 19%, transparent 42%, rgba(0,0,0,.2) 100%),
    radial-gradient(ellipse at center, transparent 42%, rgba(0,0,0,.28) 76%, rgba(0,0,0,.62) 100%);
  box-shadow: inset 0 0 150px rgba(0,0,0,.5);
}
.hero-copy {
  position: absolute; z-index: 5; left: clamp(24px, 5.2vw, 100px); top: 51%; transform: translateY(-50%);
  width: min(445px, 40vw);
}
.eyebrow, .kicker { margin: 0 0 18px; color: var(--orange-hot); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; }
.hero h1 { margin: 0; font: 500 clamp(52px, 6.6vw, 116px)/.88 Space Grotesk, sans-serif; letter-spacing: -.07em; max-width: 680px; text-wrap: balance; }
.hero-note { max-width: 360px; margin: 26px 0 0; color: #c5c2c6; font-size: clamp(15px, 1.2vw, 18px); line-height: 1.55; }
.scroll-mark { position: absolute; z-index: 5; bottom: 34px; left: clamp(24px, 5.2vw, 100px); display: flex; align-items: center; gap: 18px; color: #aaa6ad; font-size: 11px; letter-spacing: .17em; text-transform: uppercase; }
.scroll-mark i { display: block; width: 55px; height: 1px; background: var(--orange); transform-origin: left; animation: line-pulse 2s ease-in-out infinite; }

.marquee { position: relative; z-index: 6; width: 100%; overflow: hidden; border-block: 1px solid rgba(255,255,255,.12); background: #09090c; transform: rotate(-1.2deg) scale(1.02); }
.marquee-track { width: max-content; display: flex; align-items: center; gap: 34px; padding: 22px 0; animation: ticker 28s linear infinite; }
.marquee span { font: 500 clamp(22px, 2.3vw, 40px)/1 Space Grotesk, sans-serif; letter-spacing: .04em; color: #dedbe0; }
.marquee b { color: var(--orange); font-size: 16px; }

.section-shell { position: relative; z-index: 3; min-height: 92vh; padding: 130px clamp(24px, 5.2vw, 100px); overflow: hidden; border-bottom: 1px solid rgba(255,255,255,.09); }
.section-label { display: flex; gap: 14px; align-items: center; margin-bottom: 75px; color: #78757c; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; }
.section-label span { color: var(--orange); }
.section-label p { margin: 0; }
.about { display: grid; grid-template-columns: 1fr 3.6fr; background: radial-gradient(circle at 82% 24%, rgba(35,44,165,.19), transparent 28%), linear-gradient(135deg, #050507 30%, #0b0a12); }
.about .section-label { align-self: start; }
.about-content { max-width: 1050px; align-self: center; padding-bottom: 70px; }
.about h2 { margin: 0; font: 500 clamp(44px, 6vw, 100px)/.98 Space Grotesk, sans-serif; letter-spacing: -.06em; max-width: 1040px; }
.about-content > p:last-child { max-width: 680px; margin: 38px 0 0 auto; color: var(--muted); font-size: clamp(17px, 1.5vw, 23px); line-height: 1.6; }
.wall-word { position: absolute; pointer-events: none; font: 600 clamp(80px, 14vw, 260px)/1 Space Grotesk, sans-serif; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.07); }
.wall-word-one { right: -3vw; bottom: -3vw; transform: rotate(-8deg); }
.wall-word-two { left: 1vw; top: 41%; color: rgba(255,89,23,.04); -webkit-text-stroke: 1px rgba(255,89,23,.16); transform: rotate(90deg); }

.achievements { background: linear-gradient(165deg, #09090c, #050507 58%); }
.stats-grid { display: grid; grid-template-columns: repeat(12, 1fr); border-top: 1px solid rgba(255,255,255,.15); border-left: 1px solid rgba(255,255,255,.15); }
.stat-card { grid-column: span 3; min-height: 285px; padding: 34px; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); background: linear-gradient(145deg, rgba(255,255,255,.026), rgba(255,255,255,.008)); box-shadow: inset 0 1px rgba(255,255,255,.025), 0 28px 60px rgba(0,0,0,.12); transition: background .35s, transform .35s, box-shadow .35s; }
.stat-card:hover { background: linear-gradient(145deg, rgba(255,91,22,.12), rgba(255,91,22,.025)); transform: translateY(-4px); box-shadow: 0 28px 70px rgba(0,0,0,.28), 0 0 45px rgba(255,91,22,.055); }
.stat-card strong { font: 500 clamp(52px, 5vw, 88px)/1 Space Grotesk, sans-serif; letter-spacing: -.07em; }
.stat-card strong span { color: var(--orange); }
.stat-card p { margin: 0; color: var(--muted); font-size: 14px; letter-spacing: .08em; text-transform: uppercase; }
.stat-wide { grid-column: span 12; min-height: 250px; flex-direction: row; align-items: end; }
.stat-wide strong { font-size: clamp(70px, 14vw, 240px); color: transparent; -webkit-text-stroke: 1px rgba(255,112,34,.88); }

.contacts { min-height: 82vh; background: radial-gradient(circle at 50% 70%, rgba(255,88,20,.14), transparent 35%), #060608; }
.contact-panel { margin: 9vh auto 0; max-width: 1080px; text-align: center; }
.contact-panel > p:first-child { color: var(--orange); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; }
.contact-panel a { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 20px 0; font: 500 clamp(24px, 3.4vw, 54px)/1.08 Space Grotesk, sans-serif; letter-spacing: -.035em; transition: color .3s; }
.contact-panel a:hover { color: var(--orange-hot); }
.contact-panel a i { font-size: .45em; font-style: normal; color: var(--orange); }
.contact-note { color: var(--muted); font-size: 15px; }

footer { position: relative; z-index: 5; min-height: 160px; padding: 48px clamp(24px, 5.2vw, 100px); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; color: #77747b; font-size: 12px; border-top: 1px solid rgba(255,255,255,.1); }
footer p:last-child { justify-self: end; }
.footer-brand { color: var(--text); }

.reveal { opacity: 0; transform: translateY(38px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.visible { opacity: 1; transform: none; }

@keyframes ticker { to { transform: translateX(-50%); } }
@keyframes room-breathe { from { transform: scale(1.025); filter: saturate(.92) brightness(.74) contrast(1.08); } to { transform: scale(1.048); filter: saturate(1.02) brightness(.9) contrast(1.04); } }
@keyframes pedestal-glow { from { opacity: .68; transform: scale(.985); } to { opacity: 1; transform: scale(1.025); } }
@keyframes line-pulse { 0%,100% { transform: scaleX(.45); opacity: .5; } 50% { transform: scaleX(1); opacity: 1; } }

@media (max-width: 900px) {
  .site-header { height: 72px; grid-template-columns: 1fr auto; }
  nav { display: none; }
  .hero-image { background-position: 58% center; }
  .hero-shade { background: linear-gradient(0deg, rgba(2,2,5,.92), transparent 72%), linear-gradient(90deg, rgba(2,2,5,.5), transparent); }
  .hero::before { background: radial-gradient(ellipse 34% 32% at 58% 48%, rgba(255,94,22,.18), transparent 76%); }
  .hero::after { left: 28%; right: 18%; bottom: 24%; }
  .hero-copy { top: auto; bottom: 100px; transform: none; width: calc(100% - 48px); }
  .hero h1 { max-width: 500px; }
  .hero-note { margin-top: 16px; }
  .scroll-mark { display: none; }
  .section-shell { min-height: auto; padding-block: 100px; }
  .about { display: block; }
  .about-content { padding: 0; }
  .about-content > p:last-child { margin-left: 0; }
  .stat-card { grid-column: span 6; }
  .stat-wide { grid-column: span 12; }
  footer { grid-template-columns: 1fr auto; gap: 20px; }
  footer p:last-child { grid-column: 1/-1; justify-self: start; }
}

@media (max-width: 560px) {
  .cursor-light { opacity: .8; animation: mobile-light 8s ease-in-out infinite alternate; }
  .hero { min-height: 820px; }
  .hero-image { background-position: 54% 22%; background-size: auto 72%; background-color: #050507; background-repeat: no-repeat; }
  .hero-shade { background: linear-gradient(0deg, #050507 8%, rgba(5,5,7,.92) 30%, rgba(5,5,7,.02) 72%); }
  .hero::before { background: radial-gradient(ellipse 52% 27% at 54% 32%, rgba(255,94,22,.17), transparent 75%); }
  .hero::after { left: 18%; right: 10%; bottom: 43%; opacity: .62; }
  .hero-copy { bottom: 82px; }
  .hero h1 { font-size: clamp(54px, 17vw, 76px); }
  .eyebrow { max-width: 260px; line-height: 1.5; }
  .marquee-track { padding: 17px 0; gap: 24px; }
  .section-label { margin-bottom: 45px; }
  .about h2 { font-size: 43px; }
  .stat-card { grid-column: span 12; min-height: 220px; }
  .stat-wide { min-height: 200px; flex-direction: column; align-items: flex-start; }
  .stat-wide strong { font-size: 24vw; }
  .contact-panel { margin-top: 5vh; }
  .contact-panel a { font-size: clamp(24px, 7.2vw, 32px); gap: 8px; }
  footer { grid-template-columns: 1fr; }
  footer p, footer p:last-child { justify-self: start; margin: 0; }
}

@keyframes mobile-light {
  from { background-position: -30vw 15vh, 10vw 10vh; }
  to { background-position: 35vw 35vh, -15vw 45vh; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
