/* ============================================================
   ALTAY — Motion & Polish Layer
   Shared across index / services / projects / history
   Corporate-modern, architectural, "engineered" motion.
   ============================================================ */

:root {
  --tech-blue: #06C0FF;
  --corp-blue: #1c5bb9;
  --deep-navy: #04182E;
  --navy-container: #081c32;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ---------- Global feel ---------- */
html { scroll-behavior: smooth; }
* { -webkit-tap-highlight-color: transparent; }

::selection { background: var(--corp-blue); color: #fff; }

@media (min-width: 768px) {
  ::-webkit-scrollbar { width: 11px; height: 11px; }
  ::-webkit-scrollbar-track { background: #eef1f5; }
  ::-webkit-scrollbar-thumb {
    background: #b7c2d0; border: 3px solid #eef1f5; border-radius: 0;
  }
  ::-webkit-scrollbar-thumb:hover { background: var(--corp-blue); }
}

/* ---------- Scroll progress bar ---------- */
.altay-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0%;
  z-index: 100; pointer-events: none;
  background: linear-gradient(90deg, var(--corp-blue), var(--tech-blue));
  box-shadow: 0 0 12px rgba(6, 192, 255, 0.6);
  transition: width 0.12s linear;
}

/* ---------- Logo ---------- */
.altay-logo {
  height: 40px; width: auto; display: block;
  transition: transform 0.45s var(--ease-out), filter 0.45s ease;
}
.altay-logo:hover { transform: scale(1.04); }
.altay-logo--footer {
  height: 44px; filter: brightness(0) invert(1); opacity: 0.95;
}
.altay-logo--footer:hover { opacity: 1; }

/* ---------- Scroll reveal ---------- */
[data-reveal] {
  opacity: 0; transform: translateY(30px);
  transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out),
              filter 0.85s var(--ease-out);
  will-change: opacity, transform;
}
[data-reveal="left"]  { transform: translateX(-44px); }
[data-reveal="right"] { transform: translateX(44px); }
[data-reveal="scale"] { transform: scale(0.93); }
[data-reveal="blur"]  { filter: blur(14px); transform: translateY(18px); }
[data-reveal].is-visible {
  opacity: 1; transform: none; filter: none;
}

/* ---------- Animated brand underline for nav links ---------- */
.altay-nav-link {
  position: relative;
}
.altay-nav-link::after {
  content: ""; position: absolute; left: 0; bottom: -4px;
  height: 2px; width: 100%;
  background: linear-gradient(90deg, var(--corp-blue), var(--tech-blue));
  transform: scaleX(0); transform-origin: right;
  transition: transform 0.4s var(--ease-out);
}
.altay-nav-link:hover::after,
.altay-nav-link[data-active]::after { transform: scaleX(1); transform-origin: left; }

/* ---------- Button sheen ---------- */
.altay-sheen { position: relative; overflow: hidden; }
.altay-sheen::before {
  content: ""; position: absolute; top: 0; left: -120%;
  width: 60%; height: 100%; transform: skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
  transition: left 0.7s var(--ease-out);
}
.altay-sheen:hover::before { left: 140%; }

/* ---------- Gradient / kinetic text ---------- */
.altay-gradient-text {
  background: linear-gradient(90deg, var(--tech-blue), #7fd8ff, var(--tech-blue));
  background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: altay-shine 6s linear infinite;
}
@keyframes altay-shine { to { background-position: 200% center; } }

/* ---------- Soft float (icons / badges) ---------- */
.altay-float { animation: altay-float 6s ease-in-out infinite; }
@keyframes altay-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

/* ---------- Pulse ring (map / live dots) ---------- */
.altay-ping { position: relative; }
.altay-ping::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit;
  border: 1px solid var(--tech-blue);
  animation: altay-ping 2.4s var(--ease-out) infinite;
}
@keyframes altay-ping {
  0% { transform: scale(1); opacity: 0.8; }
  100% { transform: scale(2.4); opacity: 0; }
}

/* ---------- Blinking status dot ---------- */
.altay-blink { animation: altay-blink 1.6s steps(1) infinite; }
@keyframes altay-blink { 0%,60% { opacity: 1; } 61%,100% { opacity: 0.25; } }

/* ---------- Tilt / hover lift ---------- */
[data-tilt] { transform-style: preserve-3d; transition: transform 0.3s var(--ease-out); }
.altay-lift { transition: transform 0.5s var(--ease-out), box-shadow 0.5s var(--ease-out); }
.altay-lift:hover { transform: translateY(-6px); }

/* ---------- Nav shell ---------- */
[data-nav] {
  transition: padding 0.4s var(--ease-out), background 0.4s ease,
              box-shadow 0.4s ease, backdrop-filter 0.4s ease;
}
[data-nav].altay-nav-scrolled {
  background: rgba(247, 250, 254, 0.82);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  box-shadow: 0 8px 30px -12px rgba(8, 28, 50, 0.22);
}

/* ---------- Mobile menu ---------- */
.altay-burger {
  display: inline-flex; flex-direction: column; gap: 5px;
  width: 30px; cursor: pointer; background: none; border: none; padding: 4px 0;
}
@media (min-width: 768px) { .altay-burger { display: none; } }
.altay-burger span {
  display: block; height: 2px; width: 100%; background: var(--deep-navy);
  transition: transform 0.35s var(--ease-out), opacity 0.25s ease;
}
.altay-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.altay-burger.is-open span:nth-child(2) { opacity: 0; }
.altay-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.altay-mobile-menu {
  position: fixed; inset: 0; z-index: 90;
  background: rgba(8, 28, 50, 0.97);
  backdrop-filter: blur(6px);
  display: flex; flex-direction: column; justify-content: center;
  gap: 8px; padding: 0 32px;
  opacity: 0; visibility: hidden; transform: translateY(-12px);
  transition: opacity 0.4s ease, transform 0.4s var(--ease-out), visibility 0.4s;
}
.altay-mobile-menu.is-open { opacity: 1; visibility: visible; transform: none; }
.altay-mobile-menu a {
  color: #fff; font-family: "Inter", sans-serif; font-size: 30px; font-weight: 700;
  letter-spacing: -0.02em; padding: 12px 0;
  border-bottom: 1px solid rgba(115, 133, 160, 0.25);
  opacity: 0; transform: translateX(-18px);
  transition: opacity 0.5s var(--ease-out), transform 0.5s var(--ease-out), color 0.2s;
}
.altay-mobile-menu.is-open a { opacity: 1; transform: none; }
.altay-mobile-menu a:hover { color: var(--tech-blue); }
.altay-mobile-menu a[data-active] { color: var(--tech-blue); }

/* ---------- Slow blueprint drift for grid backgrounds ---------- */
.altay-grid-drift { animation: altay-drift 40s linear infinite; }
@keyframes altay-drift { to { background-position: 400px 400px; } }

/* ---------- Marquee (seamless logo strip) ---------- */
.altay-marquee {
  overflow: hidden; position: relative;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.altay-marquee__track {
  display: flex; width: max-content; align-items: center;
  animation: altay-marquee 38s linear infinite;
}
.altay-marquee:hover .altay-marquee__track { animation-play-state: paused; }
@keyframes altay-marquee { to { transform: translateX(-50%); } }
.altay-marquee__track--rev { animation-name: altay-marquee-rev; }
@keyframes altay-marquee-rev { from { transform: translateX(-50%); } to { transform: translateX(0); } }

/* bold partner section (dark, dramatic) */
.altay-partners-dark { position: relative; overflow: hidden; background: #04182E; }
.altay-partners-dark .altay-aura {
  position: absolute; border-radius: 50%; filter: blur(90px); pointer-events: none;
  mix-blend-mode: screen; opacity: 0.45;
}
.altay-partners-dark .altay-aura--1 { width: 520px; height: 520px; left: -6%; top: -30%;
  background: radial-gradient(circle, rgba(6,192,255,0.5), transparent 62%); }
.altay-partners-dark .altay-aura--2 { width: 480px; height: 480px; right: -4%; bottom: -35%;
  background: radial-gradient(circle, rgba(28,91,185,0.55), transparent 62%); }

.altay-pcard {
  flex: 0 0 auto; width: 244px; height: 136px; margin: 0 11px;
  display: flex; align-items: center; justify-content: center; padding: 26px;
  background: #fff; border-radius: 12px;
  box-shadow: 0 14px 34px -16px rgba(0,0,0,0.6);
  transition: transform 0.45s var(--ease-out), box-shadow 0.45s ease;
}
.altay-pcard img {
  max-width: 100%; max-height: 100%; object-fit: contain;
  transition: transform 0.45s var(--ease-out);
}
.altay-pcard:hover {
  transform: translateY(-7px) scale(1.035);
  box-shadow: 0 24px 50px -12px rgba(6,192,255,0.7);
}
.altay-pcard:hover img { transform: scale(1.07); }

/* partner logo tiles */
.altay-partner {
  flex: 0 0 auto; width: 210px; height: 118px; margin: 0 12px;
  display: flex; align-items: center; justify-content: center; padding: 22px;
  background: #fff; border: 1px solid #e5e8ec; border-radius: 6px;
  transition: border-color 0.4s ease, box-shadow 0.4s ease, transform 0.4s var(--ease-out);
}
.altay-partner:hover { border-color: #06C0FF; box-shadow: 0 16px 34px -18px rgba(6,192,255,0.6); transform: translateY(-4px); }
.altay-partner img {
  max-width: 100%; max-height: 100%; object-fit: contain;
  filter: grayscale(1); opacity: 0.65;
  transition: filter 0.45s ease, opacity 0.45s ease, transform 0.45s var(--ease-out);
}
.altay-partner:hover img { filter: grayscale(0); opacity: 1; transform: scale(1.05); }

/* ---------- Certificate showcase ---------- */
.altay-cert {
  position: relative; overflow: hidden; background: #fff; cursor: pointer;
  border: 1px solid #e5e8ec;
  transition: transform 0.5s var(--ease-out), box-shadow 0.5s ease, border-color 0.5s ease;
}
.altay-cert:hover { transform: translateY(-6px); box-shadow: 0 26px 55px -22px rgba(6,192,255,0.5); border-color: #06C0FF; }
.altay-cert__img { overflow: hidden; background: #eef1f5; }
.altay-cert__img img { width: 100%; display: block; transition: transform 0.9s var(--ease-out); }
.altay-cert:hover .altay-cert__img img { transform: scale(1.05); }
.altay-cert__overlay {
  position: absolute; inset: 0; z-index: 5; pointer-events: none;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(0deg, rgba(4,24,46,0.35), rgba(4,24,46,0) 45%);
  opacity: 0; transition: opacity 0.4s ease;
}
.altay-cert:hover .altay-cert__overlay { opacity: 1; }
.altay-cert__overlay .material-symbols-outlined {
  color: #fff; font-size: 40px; background: rgba(6,192,255,0.9);
  border-radius: 50%; padding: 10px; transform: scale(0.6);
  transition: transform 0.4s var(--ease-spring);
}
.altay-cert:hover .altay-cert__overlay .material-symbols-outlined { transform: scale(1); }
.altay-cert__badge {
  position: absolute; top: 12px; left: 12px; z-index: 6;
  display: inline-flex; align-items: center; gap: 4px;
  background: #06C0FF; color: #04182E; padding: 4px 9px;
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500;
}

/* ---------- Interactive map (Leaflet, dark) ---------- */
.altay-mk {
  display: block; width: 13px; height: 13px; border-radius: 50%;
  background: #06C0FF; position: relative;
  box-shadow: 0 0 0 2px rgba(6,192,255,0.3), 0 0 12px 2px rgba(6,192,255,0.8);
}
.altay-mk::after {
  content: ""; position: absolute; inset: -5px; border-radius: 50%;
  border: 1px solid rgba(6,192,255,0.6);
  animation: altay-ping 2.4s var(--ease-out) infinite;
}
.altay-mk--hq {
  width: 20px; height: 20px; background: #fff;
  box-shadow: 0 0 0 3px rgba(6,192,255,0.5), 0 0 18px 4px rgba(6,192,255,0.9);
}
.altay-mapbtn {
  background: rgba(8,28,50,0.85); color: #7fd8ff;
  border: 1px solid rgba(6,192,255,0.35); padding: 5px 12px;
  font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: 0.08em;
  cursor: pointer; transition: background 0.25s ease, color 0.25s ease;
  backdrop-filter: blur(4px);
}
.altay-mapbtn:hover { background: #06C0FF; color: #04182E; }
.leaflet-container { background: #04182E; font-family: "Inter", sans-serif; }
.leaflet-popup-content-wrapper {
  background: #081c32; color: #fff; border-radius: 4px;
  border: 1px solid rgba(6,192,255,0.4); box-shadow: 0 10px 34px rgba(0,0,0,0.55);
}
.leaflet-popup-content { margin: 10px 14px; font-size: 13px; }
.leaflet-popup-content b { color: #fff; font-weight: 700; }
.altay-pp { font-family: "JetBrains Mono", monospace; font-size: 11px; color: #7fd8ff; }
.leaflet-popup-tip { background: #081c32; border: 1px solid rgba(6,192,255,0.4); }
.leaflet-container a.leaflet-popup-close-button { color: #7fd8ff; }
.leaflet-bar a, .leaflet-bar a:hover {
  background: #081c32; color: #7fd8ff; border-bottom-color: rgba(6,192,255,0.25);
}
.leaflet-bar a:hover { background: #06C0FF; color: #04182E; }
.leaflet-control-attribution {
  background: rgba(4,24,46,0.7) !important; color: #6f819a !important; font-size: 9px;
}
.leaflet-control-attribution a { color: #7fd8ff !important; }

/* ---------- Lightbox ---------- */
.altay-lightbox {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(4,24,46,0.94); backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center; padding: 5vh 5vw;
  opacity: 0; visibility: hidden; transition: opacity 0.35s ease, visibility 0.35s ease;
}
.altay-lightbox.is-open { opacity: 1; visibility: visible; }
.altay-lightbox img {
  max-width: 100%; max-height: 90vh; box-shadow: 0 30px 90px rgba(0,0,0,0.6);
  transform: scale(0.94); transition: transform 0.4s var(--ease-out);
}
.altay-lightbox.is-open img { transform: scale(1); }
.altay-lightbox__close {
  position: absolute; top: 22px; right: 28px; color: #fff; cursor: pointer;
  width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,0.3); transition: background 0.3s ease, transform 0.3s ease;
}
.altay-lightbox__close:hover { background: rgba(6,192,255,0.2); transform: rotate(90deg); }

/* ---------- Image "scan-in" for reveal images ---------- */
[data-reveal-img] { clip-path: inset(0 100% 0 0); transition: clip-path 1s var(--ease-out); }
[data-reveal-img].is-visible { clip-path: inset(0 0 0 0); }

/* ---------- Focus visibility ---------- */
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 2px solid var(--tech-blue); outline-offset: 2px;
}

/* ============================================================
   HERO — "Living Blueprint" cinematic entrance
   ============================================================ */
.hero {
  position: relative;
  /* fill exactly one screen alongside the sticky header (topbar + navbar) */
  min-height: calc(100svh - 115px);
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #04182E;
}
@media (max-width: 767px) { .hero { min-height: calc(100svh - 73px); } }

/* headline scales with viewport width AND height so the hero never overflows */
.hero-title { font-size: clamp(38px, 5.6vw, 74px); line-height: 1.02; }
@media (max-height: 820px) { .hero-title { font-size: clamp(34px, 4.6vw, 60px); } }
@media (max-height: 680px) {
  .hero-title { font-size: clamp(30px, 4vw, 48px); }
  .hero-scrollcue { display: none; }
}
.hero__bg {
  position: absolute; inset: 0; z-index: 0;
  background-size: cover; background-position: center;
  transform: scale(1.12);
  opacity: 0; animation: hero-bg-in 2.4s var(--ease-out) forwards;
}
@keyframes hero-bg-in { to { opacity: 0.42; } }

/* layered navy gradients for crisp text contrast */
.hero__scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, #04182E 0%, rgba(4,24,46,0.94) 30%, rgba(4,24,46,0.6) 72%, rgba(4,24,46,0.42) 100%),
    linear-gradient(0deg, #04182E 3%, rgba(4,24,46,0) 42%),
    rgba(4,24,46,0.32);
}

/* living wall — all projects parading behind the hero */
.hero__wall { position: absolute; inset: 0; z-index: 0; display: flex; gap: 6px; overflow: hidden; }
.hero__wall-col { flex: 1; overflow: hidden; }
.hero__wall-track { display: block; will-change: transform; animation: hero-wall-up 46s linear infinite; }
.hero__wall-col--down .hero__wall-track { animation-name: hero-wall-down; }
.hero__wall-img {
  width: 100%; height: 34vh; object-fit: cover; display: block;
  margin-bottom: 6px; filter: saturate(1.05) contrast(1.02);
}
@keyframes hero-wall-up { from { transform: translateY(0); } to { transform: translateY(-50%); } }
@keyframes hero-wall-down { from { transform: translateY(-50%); } to { transform: translateY(0); } }

/* drifting aurora glows */
.hero__aurora {
  position: absolute; z-index: 1; border-radius: 50%;
  filter: blur(70px); opacity: 0.5; pointer-events: none;
  mix-blend-mode: screen;
}
.hero__aurora--a { width: 620px; height: 620px; left: -8%; top: 8%;
  background: radial-gradient(circle, rgba(6,192,255,0.55), transparent 62%);
  animation: aurora-a 16s ease-in-out infinite; }
.hero__aurora--b { width: 520px; height: 520px; right: 4%; bottom: -10%;
  background: radial-gradient(circle, rgba(28,91,185,0.6), transparent 62%);
  animation: aurora-b 20s ease-in-out infinite; }
@keyframes aurora-a { 0%,100%{transform:translate(0,0)} 50%{transform:translate(60px,40px)} }
@keyframes aurora-b { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-50px,-30px)} }

/* scanning sweep line */
.hero__scan {
  position: absolute; left: 0; right: 0; height: 2px; z-index: 2; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(6,192,255,0.85), transparent);
  box-shadow: 0 0 24px 2px rgba(6,192,255,0.45);
  animation: hero-scan 7s linear infinite; opacity: 0.7;
}
@keyframes hero-scan { 0%{top:-2%} 100%{top:102%} }

/* animated blueprint truss (draws itself) */
.hero__truss {
  position: absolute; z-index: 2; right: 0; bottom: 8%;
  width: min(58vw, 860px); height: auto; pointer-events: none;
  opacity: 0; animation: hero-fade 1.2s ease forwards 0.5s;
}
@keyframes hero-fade { to { opacity: 1; } }
.hero__truss .beam {
  fill: none; stroke: rgba(6,192,255,0.55); stroke-width: 1.5;
  stroke-dasharray: 1400; stroke-dashoffset: 1400;
  animation: truss-draw 2.6s var(--ease-out) forwards 0.6s;
}
.hero__truss .beam--2 { stroke: rgba(115,133,160,0.5); animation-delay: 1s; }
@keyframes truss-draw { to { stroke-dashoffset: 0; } }
.hero__truss .node {
  fill: #06C0FF; opacity: 0;
  animation: node-pop 0.5s var(--ease-spring) forwards; transform-box: fill-box;
  transform-origin: center;
}
.hero__truss .node { filter: drop-shadow(0 0 6px rgba(6,192,255,0.9)); }
@keyframes node-pop { 0%{opacity:0;transform:scale(0)} 100%{opacity:1;transform:scale(1)} }

/* kinetic headline */
.hero-line { display: block; overflow: hidden; padding-bottom: 0.08em; }
.hero-word {
  display: inline-block; transform: translateY(118%); opacity: 0;
  animation: hero-word-up 1s var(--ease-out) forwards;
}
@keyframes hero-word-up { to { transform: translateY(0); opacity: 1; } }
.hero-grad {
  background: linear-gradient(100deg, #06C0FF 10%, #8fe3ff 45%, #06C0FF 90%);
  background-size: 220% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: hero-word-up 1s var(--ease-out) forwards, altay-shine 5s linear infinite 1.1s;
  filter: drop-shadow(0 0 26px rgba(6,192,255,0.35));
}

/* generic hero fade-up for eyebrow / text / ctas / trust */
.hero-rise { opacity: 0; transform: translateY(26px); animation: hero-rise 0.9s var(--ease-out) forwards; }
@keyframes hero-rise { to { opacity: 1; transform: none; } }

/* CTA glow */
.hero-cta-primary {
  position: relative; box-shadow: 0 0 0 0 rgba(6,192,255,0.6);
  animation: cta-glow 3s ease-in-out infinite;
}
@keyframes cta-glow {
  0%,100% { box-shadow: 0 0 22px -6px rgba(6,192,255,0.5); }
  50% { box-shadow: 0 0 34px 2px rgba(6,192,255,0.75); }
}

/* trust strip counters */
.hero-trust { border-top: 1px solid rgba(115,133,160,0.28); }

/* scroll cue */
.hero-scrollcue { animation: hero-fade 1s ease forwards 1.6s; opacity: 0; }
.hero-scrollcue .dot { animation: scrollcue 1.8s var(--ease-out) infinite; }
@keyframes scrollcue { 0%{transform:translateY(0);opacity:0} 30%{opacity:1} 100%{transform:translateY(14px);opacity:0} }

@media (prefers-reduced-motion: reduce) {
  .hero__bg { opacity: 0.42 !important; animation: none !important; }
  .hero__scan, .hero__aurora { animation: none !important; }
  .hero-word, .hero-grad, .hero-rise, .hero__truss, .hero__truss .beam, .hero__truss .node {
    animation: none !important; opacity: 1 !important; transform: none !important; stroke-dashoffset: 0 !important;
  }
}

/* ============================================================
   PREMIUM HEADER — utility strip + technical main bar
   ============================================================ */
/* z-index must stay ABOVE .altay-mobile-menu (90) so the burger's X is
   visible and tappable while the menu is open, and BELOW .altay-progress
   (100) and .altay-lightbox (200). */
.altay-header { position: sticky; top: 0; z-index: 95; }

.altay-topbar {
  background: #04182E; color: #b9c6d8;
  font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: 0.03em;
  max-height: 42px; overflow: hidden;
  transition: max-height 0.5s var(--ease-out), opacity 0.35s ease;
  border-bottom: 1px solid rgba(6,192,255,0.14);
}
.altay-topbar__inner { height: 42px; }
.altay-topbar a { color: inherit; }
@media (max-width: 767px) { .altay-topbar { display: none; } }

.altay-navbar {
  background: rgba(247, 250, 254, 0.92);
  border-bottom: 1px solid #d4dae2;
  transition: background 0.4s ease, box-shadow 0.4s ease, backdrop-filter 0.4s ease;
}
[data-nav].altay-nav-scrolled .altay-topbar { max-height: 0; opacity: 0; }
[data-nav].altay-nav-scrolled .altay-navbar {
  background: rgba(247, 250, 254, 0.82);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  box-shadow: 0 10px 30px -12px rgba(8, 28, 50, 0.22);
}

/* numbered nav links */
.altay-nav-link {
  position: relative; display: inline-flex; align-items: baseline; gap: 0.4rem;
  color: #44474d; font-size: 16px; font-weight: 500; line-height: 1;
  transition: color 0.25s ease;
}
.altay-nav-link:hover, .altay-nav-link[data-active] { color: #1c5bb9; }
.altay-idx {
  font-family: "JetBrains Mono", monospace; font-size: 10px; font-weight: 500;
  color: #06C0FF; opacity: 0.65; transform: translateY(-3px);
  transition: opacity 0.25s ease, transform 0.35s var(--ease-out);
}
.altay-nav-link:hover .altay-idx { opacity: 1; transform: translateY(-5px); }
.altay-nav-link[data-active] .altay-idx { opacity: 1; }

/* header CTA */
.altay-cta {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: #081c32; color: #fff; padding: 0.62rem 1.35rem;
  font-family: "JetBrains Mono", monospace; font-size: 12px;
  letter-spacing: 0.12em; text-transform: uppercase;
  position: relative; overflow: hidden;
  transition: background 0.35s ease, box-shadow 0.35s ease, color 0.35s ease;
}
.altay-cta::before {
  content: ""; position: absolute; top: 0; left: -120%; width: 55%; height: 100%;
  transform: skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.28), transparent);
  transition: left 0.6s var(--ease-out);
}
.altay-cta:hover::before { left: 150%; }
.altay-cta .material-symbols-outlined { transition: transform 0.3s var(--ease-out); }
.altay-cta:hover { background: #06C0FF; color: #04182E; box-shadow: 0 0 26px -4px rgba(6,192,255,0.65); }
.altay-cta:hover .material-symbols-outlined { transform: translate(3px, -3px); }
@media (max-width: 640px) { .altay-cta { display: none; } }

/* flag language picker (in the main menu) */
.altay-langpick { position: relative; }
.altay-langpick__btn {
  display: inline-flex; align-items: center; gap: 7px;
  background: none; border: 1px solid rgba(8,28,50,0.18); padding: 6px 10px;
  cursor: pointer; font-family: "JetBrains Mono", monospace; font-size: 12px;
  letter-spacing: 0.06em; color: #04182E;
  transition: border-color 0.25s ease, background 0.25s ease;
}
.altay-langpick__btn:hover { border-color: #06C0FF; background: rgba(6,192,255,0.05); }
.altay-langpick__btn .fi { width: 21px; height: 15px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,0.08); }
.altay-langpick__btn .material-symbols-outlined { transition: transform 0.3s var(--ease-out); }
.altay-langpick.is-open .altay-langpick__btn .material-symbols-outlined { transform: rotate(180deg); }
.altay-langpick__menu {
  position: absolute; top: calc(100% + 10px); right: 0; min-width: 190px;
  background: #fff; border: 1px solid #d4dae2; padding: 6px;
  box-shadow: 0 18px 44px -14px rgba(8,28,50,0.35);
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity 0.25s ease, transform 0.28s var(--ease-out), visibility 0.25s;
  z-index: 70;
}
.altay-langpick.is-open .altay-langpick__menu { opacity: 1; visibility: visible; transform: none; }
.altay-langpick__menu button {
  display: flex; align-items: center; gap: 11px; width: 100%; text-align: left;
  background: none; border: none; padding: 9px 10px; cursor: pointer;
  font-family: "Inter", sans-serif; font-size: 14px; color: #181c1f;
  transition: background 0.2s ease, color 0.2s ease;
}
.altay-langpick__menu button:hover { background: #f1f4f8; color: #1c5bb9; }
.altay-langpick__menu button[data-active] { color: #1c5bb9; font-weight: 600; }
.altay-langpick__menu button[data-active]::after {
  content: "check"; font-family: "Material Symbols Outlined"; margin-left: auto; font-size: 18px; color: #06C0FF;
}
.altay-langpick__menu .fi { width: 23px; height: 16px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,0.08); }

/* language switch (legacy, unused) */
.altay-lang { display: inline-flex; align-items: center; gap: 0.3rem; }
.altay-lang button {
  background: none; border: none; color: #7f92a8; font: inherit; cursor: pointer;
  padding: 0 2px; transition: color 0.2s ease;
}
.altay-lang button:hover { color: #fff; }
.altay-lang button[data-active] { color: #06C0FF; font-weight: 600; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1 !important; transform: none !important; filter: none !important; }
  [data-reveal-img] { clip-path: none !important; }
}