/* ==========================================================================
   KG Savunma /new — ANA SAYFA (home.css)
   Kurgu: sinematik giriş (hx) → kimlik/sayılar → kategoriler → amiral ürün (yapışkan sekans) → Kara·Deniz·Hava
          → ürün rayı → tehdit enerjisi → üretim akışı → doktrin.
   Kurallar: yalnız transform/opacity animasyonu · mantıksal özellikler (RTL) · fotoğraf ve KG işareti aynalanmaz
             · azaltılmış harekette statik · JS'siz eksiksiz (yalnız 1. sahne).
   Kapsam: .hx (giriş) ve .hs-* (bölümler) kök sınıfları.
   ========================================================================== */

/* ═════════════ 1 · SİNEMATİK GİRİŞ ═════════════ */
.hx {
  --hxbar: 80px;
  --hxdur: 7000ms;
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end;
  min-height: 680px; min-height: max(680px, 100svh);
  color: #ECEAE4; background: var(--k0);
  touch-action: pan-y;   /* yatay kaydırma hareketi sahne değiştirir (home.js); dikey sayfa kaydırması serbest */
}
.hx.grain::after { z-index: 2; }
.hx__stage { position: absolute; inset: 0; z-index: 0; }
.hx__slide { position: absolute; inset: 0; overflow: hidden; opacity: 0; transition: opacity 1400ms var(--ease); }
.hx__pic { position: absolute; inset: 0; display: block; }
.hx__slide.is-active { opacity: 1; z-index: 2; }
.hx__slide.is-prev { opacity: 1; z-index: 1; transition: none; }
.hx__img {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
  object-fit: cover; object-position: var(--pos, 50% 50%);
  transform-origin: var(--o, 50% 50%); transform: translate3d(var(--x1, 0%), var(--y1, 0%), 0) scale(var(--s1, 1.04));
  filter: saturate(.86) contrast(1.07) brightness(.9);
  backface-visibility: hidden;
}
@media (prefers-reduced-motion: no-preference) {
  .hx__slide.is-active .hx__img, .hx__slide.is-prev .hx__img { animation: hx-kb 11s cubic-bezier(.33, .1, .3, 1) both; }
}
@keyframes hx-kb {
  from { transform: translate3d(var(--x0, 0%), var(--y0, 0%), 0) scale(var(--s0, 1.16)); }
  to   { transform: translate3d(var(--x1, 0%), var(--y1, 0%), 0) scale(var(--s1, 1.04)); }
}
/* sahne başına görsel yönetimi: özne sağ üstte, başlık sol altta kalır (bayrak asla metnin altında değil) */
.hx__slide[data-scene="sunset"] { --pos: 0% 50%;  --o: 0% 88%;   --s0: 1.27; --s1: 1.16; }
.hx__slide[data-scene="patrol"] { --pos: 0% 22%;  --o: 6% 0%;    --s0: 1.24; --s1: 1.34; }
.hx__slide[data-scene="ridge"]  { --pos: 0% 46%;  --o: 56% 26%;  --s0: 1.02; --s1: 1.12; }
.hx__slide[data-scene="snow"]   { --pos: 70% 40%; --o: 82% 38%;  --s0: 1.2;  --s1: 1.07; }

/* RTL: başlık sağ altta, giriş metni sol altta → özneler ortada */
@media (min-width: 761px) {
  [dir="rtl"] .hx__slide[data-scene="sunset"] { --pos: 58% 50%; --o: 46% 88%; }
  [dir="rtl"] .hx__slide[data-scene="patrol"] { --pos: 52% 22%; --o: 48% 0%; }
}
/* perde: üst (üst bant), alt (başlık), başlangıç kenarı, köşe vinyeti */
.hx__scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(6,7,8,.74) 0%, rgba(6,7,8,0) 22%),
    linear-gradient(0deg, rgba(6,7,8,.97) 0%, rgba(6,7,8,.86) 12%, rgba(6,7,8,.5) 32%, rgba(6,7,8,.12) 52%, rgba(6,7,8,0) 64%),
    linear-gradient(90deg, rgba(6,7,8,.66) 0%, rgba(6,7,8,.26) 36%, rgba(6,7,8,0) 60%),
    radial-gradient(130% 100% at 60% 40%, rgba(6,7,8,0) 58%, rgba(6,7,8,.5) 100%);
}
[dir="rtl"] .hx__scrim {
  background:
    linear-gradient(180deg, rgba(6,7,8,.74) 0%, rgba(6,7,8,0) 22%),
    linear-gradient(0deg, rgba(6,7,8,.97) 0%, rgba(6,7,8,.86) 12%, rgba(6,7,8,.5) 32%, rgba(6,7,8,.12) 52%, rgba(6,7,8,0) 64%),
    linear-gradient(270deg, rgba(6,7,8,.66) 0%, rgba(6,7,8,.26) 36%, rgba(6,7,8,0) 60%),
    radial-gradient(130% 100% at 40% 40%, rgba(6,7,8,0) 58%, rgba(6,7,8,.5) 100%);
}
/* bitiş tarafındaki giriş metni + eylemler için koyu havuz (ör. 3. sahnede bulut, 1366–1440'ta metnin arkasına düşer) */
.hx__scrim::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(46% 50% at 82% 66%, rgba(6,7,8,.76) 0%, rgba(6,7,8,.5) 44%, rgba(6,7,8,0) 76%);
}
[dir="rtl"] .hx__scrim::after { background: radial-gradient(46% 50% at 18% 66%, rgba(6,7,8,.76) 0%, rgba(6,7,8,.5) 44%, rgba(6,7,8,0) 76%); }
@media (max-width: 1100px) { .hx__scrim::after { display: none; } }
/* HUD çerçeve köşeleri (tek öğe, 8 degrade) */
.hx__frame {
  --l: 22px; --t: 1.5px; --c: rgba(245, 200, 66, .72);
  position: absolute; z-index: 3; pointer-events: none;
  inset: calc(var(--mast) + 18px) calc(var(--m) * .5) calc(var(--hxbar) + 18px);
  background:
    linear-gradient(var(--c), var(--c)) 0 0 / var(--l) var(--t),
    linear-gradient(var(--c), var(--c)) 0 0 / var(--t) var(--l),
    linear-gradient(var(--c), var(--c)) 100% 0 / var(--l) var(--t),
    linear-gradient(var(--c), var(--c)) 100% 0 / var(--t) var(--l),
    linear-gradient(var(--c), var(--c)) 0 100% / var(--l) var(--t),
    linear-gradient(var(--c), var(--c)) 0 100% / var(--t) var(--l),
    linear-gradient(var(--c), var(--c)) 100% 100% / var(--l) var(--t),
    linear-gradient(var(--c), var(--c)) 100% 100% / var(--t) var(--l);
  background-repeat: no-repeat;
}

/* metin bloğu: başlık sol altta, giriş + eylemler sağda (film afişi düzeni) */
.hx__in {
  position: relative; z-index: 4; width: 100%;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 410px); align-items: end;
  gap: 28px clamp(36px, 5vw, 96px);
  padding-block: calc(var(--mast) + 80px) calc(var(--hxbar) + clamp(34px, 5.6vh, 68px));
}
.hx__eye { margin-bottom: clamp(18px, 2.6vh, 30px); }
.hx__t {
  max-width: 12.6ch; margin: 0;
  font-size: clamp(46px, 7.5vw, 134px); line-height: .86;
  text-shadow: 0 2px 30px rgba(0,0,0,.25);
}
/* .hx__tl satır içi kalır (blok değil): sahne değişince gelen metin, ilk karede kaydedilmiş <h1> içinde kalır → geç LCP adayı olmaz */
.hx__tl { display: inline; }
/* sahne geçişindeki kelime maskeleri */
.hx__t .w { display: inline-block; vertical-align: top; overflow: hidden; padding: .17em .05em .1em; margin: -.17em -.05em -.1em; }
.hx__t .wi { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .hx__t .wi { transition: transform 1000ms var(--ease-out), opacity 700ms var(--ease-out); transition-delay: calc(var(--wi) * 70ms + 40ms); }
  .hx__t.is-pre .wi { transform: translate3d(0, 112%, 0); opacity: 0; transition: none; }
  /* çıkış: <h1>'in kendisi söner (satır içi .hx__tl'ye opaklık verilmez → ayrı katman/yeni LCP adayı olmaz) */
  .hx__t.is-out { opacity: 0; transform: translate3d(0, -.1em, 0); transition: opacity 260ms var(--ease), transform 280ms var(--ease); }
  /* ilk kare: metin baştan görünür (opaklık 1), giriş yalnız transform ile → LCP ilk boyamada */
  .hx__eye, .hx__titles, .hx__side, .hx__bar-in { animation: hx-up 1100ms var(--ease-out) both; }
  .hx__titles { animation-duration: 1300ms; animation-delay: 30ms; }
  .hx__side { animation-delay: 140ms; }
  .hx__bar-in { animation-delay: 240ms; }
  .hx__frame { animation: hx-frame 1600ms var(--ease-out) 300ms both; }
}
@keyframes hx-up { from { transform: translate3d(0, 28px, 0); } to { transform: none; } }
@keyframes hx-frame { from { opacity: 0; transform: scale(1.025); } to { opacity: 1; transform: none; } }

.hx__side { padding-bottom: .35em; }
.hx__lead { font-size: clamp(16px, 1.16vw, 18.5px); line-height: 1.6; color: rgba(236,234,228,.9); max-width: 30em; text-shadow: 0 1px 14px rgba(6,7,8,.75), 0 0 3px rgba(6,7,8,.55); }
.hx__eye { text-shadow: 0 1px 10px rgba(6,7,8,.8); }
.hx__act { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* alt HUD şeridi: sahneler (ilerleme) · sayaç + denetimler · koordinat/standart · kaydır */
.hx__bar {
  position: absolute; z-index: 5; inset-inline: 0; bottom: 0; min-height: var(--hxbar);
  border-top: 1px solid rgba(236,234,228,.14);
  background: linear-gradient(0deg, rgba(6,7,8,.82) 0%, rgba(6,7,8,.5) 100%);
}
.hx__bar-in { display: flex; align-items: stretch; gap: clamp(16px, 2.2vw, 40px); min-height: var(--hxbar); }
.hx__scenes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); flex: 1 1 auto; max-width: 820px; min-width: 0; }
.hx__seg {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; row-gap: 3px;
  padding: 14px 14px 12px 0; text-align: start; color: rgba(236,234,228,.5); transition: color var(--t1) var(--ease);
}
.hx__seg:hover, .hx__seg.is-active { color: #ECEAE4; }
.hx__seg:focus-visible { outline-offset: -2px; }
.hx__track { position: absolute; inset-inline: 0 14px; top: -1px; height: 2px; background: rgba(236,234,228,.18); overflow: hidden; }
.hx__fill { position: absolute; inset: 0; background: var(--au); transform: scaleX(0); transform-origin: left center; }
[dir="rtl"] .hx__fill { transform-origin: right center; }
.hx__seg.is-done .hx__fill { transform: scaleX(1); opacity: .38; }
.hx__seg.is-active .hx__fill { animation: hx-fill var(--hxdur) linear forwards; }
.hx.is-paused .hx__seg.is-active .hx__fill { animation-play-state: paused; }
@keyframes hx-fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.hx__seg-n { font-family: var(--f-m); font-size: 12px; font-weight: 500; letter-spacing: .1em; color: var(--au); line-height: 1.5; }
.hx__seg-name { font-family: var(--f-m); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.hx__ctl { display: flex; align-items: center; gap: 8px; flex: none; }
.hx__count { display: flex; align-items: baseline; gap: 8px; flex: none; white-space: nowrap; margin-inline-end: 12px; font-family: var(--f-m); letter-spacing: .08em; color: rgba(236,234,228,.5); font-variant-numeric: tabular-nums; }
.hx__cur { font-size: 22px; font-weight: 500; color: var(--au); }
.hx__tot { font-size: 13px; }
.hx__btn { --c: 9px; position: relative; isolation: isolate; display: inline-grid; place-items: center; inline-size: 44px; block-size: 44px; color: #ECEAE4; }
.hx__btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(236,234,228,.3); clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); transition: background-color var(--t1) var(--ease); }
.hx__btn::after { content: ""; position: absolute; inset: 1px; z-index: -1; background: rgba(8,9,11,.72); clip-path: polygon(0 0, calc(100% - var(--c) + .41px) 0, 100% calc(var(--c) - .41px), 100% 100%, 0 100%); }
[dir="rtl"] .hx__btn::before { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
[dir="rtl"] .hx__btn::after { clip-path: polygon(calc(var(--c) - .41px) 0, 100% 0, 100% 100%, 0 100%, 0 calc(var(--c) - .41px)); }
.hx__btn:hover::before { background: var(--au); }
.hx__btn .ico { inline-size: 18px; block-size: 18px; }
.hx__ico-prev { transform: scaleX(-1); }
[dir="rtl"] .hx__ico-prev { transform: none; }
.hx__i-play { display: none; }
.hx.is-held .hx__i-play { display: block; }
.hx.is-held .hx__i-pause { display: none; }
.hx__meta { display: grid; align-content: center; gap: 4px; padding-inline-start: clamp(16px, 2vw, 32px); border-inline-start: 1px solid rgba(236,234,228,.12); }
.hx__meta .hud-coord { display: flex; align-items: center; gap: 9px; margin: 0; color: rgba(236,234,228,.62); white-space: nowrap; }
.hx__dot { inline-size: 6px; block-size: 6px; background: var(--au); flex: none; }
@media (prefers-reduced-motion: no-preference) { .hx__dot { animation: hx-blink 2.4s steps(1, end) infinite; } }
@keyframes hx-blink { 50% { opacity: .25; } }
.hx__scroll { display: flex; align-items: center; gap: 12px; margin-inline-start: auto; font-family: var(--f-m); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: rgba(236,234,228,.62); transition: color var(--t1); }
.hx__scroll:hover { color: #fff; }
.hx__scroll-line { position: relative; inline-size: 1px; block-size: 36px; background: rgba(236,234,228,.22); overflow: hidden; }
.hx__scroll-line::after { content: ""; position: absolute; inset-inline: 0; top: 0; height: 40%; background: var(--au); }
@media (prefers-reduced-motion: no-preference) { .hx__scroll-line::after { animation: hx-scroll 2.4s var(--ease) infinite; } }
@keyframes hx-scroll { 0% { transform: translateY(-110%); } 65%, 100% { transform: translateY(260%); } }
/* JS yoksa sahne seçici ve denetimler gizli (yalnız 1. sahne gösterilir) */
html:not(.js) .hx__scenes, html:not(.js) .hx__ctl { display: none; }
@media (prefers-reduced-motion: reduce) {
  .hx__seg.is-active .hx__fill { animation: none; transform: scaleX(1); }
  .hx__btn--toggle { display: none; }
}

/* giriş — ara genişlikler */
@media (max-width: 1340px) {
  .hx__meta { display: none; }
}
@media (max-width: 1100px) {
  .hx__in { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .hx__side { max-width: 36em; padding-bottom: 0; }
  .hx__t { font-size: clamp(46px, 9vw, 104px); }
  /* sahne adı görsel olarak gizli ama düğmenin erişilebilir adında kalır */
  .hx__seg-name { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .hx__scenes { max-width: 300px; }
}
/* giriş — telefon */
@media (max-width: 760px) {
  .hx { --hxbar: 64px; min-height: 640px; min-height: max(640px, 100svh); }
  .hx__frame { display: none; }
  .hx__in { padding-block: calc(var(--mast) + 56px) calc(var(--hxbar) + 26px); gap: 18px; }
  .hx__eye { margin-bottom: 14px; font-size: 11px; letter-spacing: .06em; gap: 10px; }
  .hx__eye::before { inline-size: 18px; }
  .hx__t { font-size: clamp(38px, 11.2vw, 58px); max-width: 11ch; line-height: .88; }
  .hx__lead { font-size: 15.5px; line-height: 1.55; }
  .hx__act { margin-top: 20px; gap: 10px; }
  .hx__act .btn { flex: 1 1 auto; min-height: 50px; padding-inline: 18px; font-size: 12.5px; }
  /* dokunma hedefleri ≥44 px; ilerleme çizgisi görünür kalınlıkta */
  .hx__bar-in { gap: 12px; }
  .hx__scenes { max-width: none; flex: 0 1 auto; grid-template-columns: repeat(4, 44px); }
  .hx__seg { padding: 0; justify-items: center; grid-template-columns: 1fr; }
  .hx__track { inset-inline: 4px; top: -1px; height: 3px; }
  .hx__count { display: none; }
  .hx__ctl { margin-inline-start: auto; gap: 4px; }
  .hx__btn { inline-size: 44px; block-size: 44px; }
  .hx__scroll { display: none; }
  /* telefonda Ken Burns ölçeği sınırlı (kaynak zaten büyütülerek gösteriliyor) */
  .hx__slide[data-scene="sunset"] { --pos: 37% 50%; --o: 40% 92%;  --s0: 1.06; --s1: 1; }
  .hx__slide[data-scene="patrol"] { --pos: 40% 0%;  --o: 42% 0%;   --s0: 1; --s1: 1.06; }
  .hx__slide[data-scene="ridge"]  { --pos: 50% 50%; --o: 52% 24%;  --s0: 1;  --s1: 1.06; }
  .hx__slide[data-scene="snow"]   { --pos: 62% 40%; --o: 70% 30%;  --s0: 1.06; --s1: 1; }
}
/* telefon: metin bloğu sahnenin alt ~%65'ini kaplar → perde daha yukarıdan başlar (üst etiket bulut/gökyüzü üzerinde kalmasın) */
@media (max-width: 760px) {
  .hx__scrim, [dir="rtl"] .hx__scrim {
    background:
      linear-gradient(180deg, rgba(6,7,8,.72) 0%, rgba(6,7,8,0) 18%),
      linear-gradient(0deg, rgba(6,7,8,.96) 0%, rgba(6,7,8,.88) 22%, rgba(6,7,8,.7) 44%, rgba(6,7,8,.46) 60%, rgba(6,7,8,.16) 74%, rgba(6,7,8,0) 86%);
  }
}
/* dikey telefon: devriye sahnesi dikey çekim kaynağından gelir (<picture>) → kendi kadrajı */
@media (max-width: 760px) and (orientation: portrait) {
  .hx__slide[data-scene="patrol"] { --pos: 44% 30%; --o: 44% 40%; --s0: 1.06; --s1: 1; }
}
@media (max-width: 380px) {
  .hx__scenes { grid-template-columns: repeat(4, 40px); }
  .hx__bar-in { gap: 8px; }
}
/* kısa telefon (≤720 px boy): metin bloğu kısalır → 3. sahnede üst etiket ve başlık bayrağın altında kalır (bayrağın üzerine metin yok) */
@media (max-width: 760px) and (max-height: 720px) and (orientation: portrait) {
  .hx__in { gap: 14px; padding-block-end: calc(var(--hxbar) + 18px); }
  .hx__eye { margin-bottom: 10px; }
  .hx__t { max-width: 16ch; font-size: clamp(32px, 10vw, 42px); }
  .hx__lead { font-size: 14.5px; line-height: 1.5; }
  .hx__act { margin-top: 14px; }
  .hx__act .btn { min-height: 46px; }
}
/* yatay telefon: başlık + giriş metni + denetimler ilk ekranda (640 px alt sınır yok) */
@media (orientation: landscape) and (max-height: 500px) {
  .hx { min-height: 100svh; }
  .hx__in { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: end; gap: 10px 28px; padding-block: calc(var(--mast) + 12px) calc(var(--hxbar) + 14px); }
  .hx__t { font-size: clamp(30px, 9vh, 44px); max-width: 13ch; }
  .hx__eye { margin-bottom: 8px; }
  .hx__lead { font-size: 14px; line-height: 1.5; }
  .hx__act { margin-top: 12px; }
  .hx__act .btn { min-height: 44px; }
  .hx__frame { display: none; }
}

/* ═════════════ 2 · KİMLİK + SAYILAR ═════════════ */
.hs-intro { position: relative; overflow: hidden; padding-block: clamp(100px, 11vw, 196px) clamp(88px, 9vw, 150px); background: var(--k1); }
.hs-intro__mark { position: absolute; inset-inline-end: -4vw; top: clamp(24px, 4vw, 72px); inline-size: min(46vw, 680px); height: auto; color: transparent; pointer-events: none; -webkit-mask-image: linear-gradient(180deg, #000 20%, transparent 78%); mask-image: linear-gradient(180deg, #000 20%, transparent 78%); }
.hs-intro__mark path { fill: none; stroke: rgba(245, 200, 66, .1); stroke-width: 1px; vector-effect: non-scaling-stroke; }
.hs-intro .wrap { position: relative; }
.hs-intro__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 36px clamp(40px, 6vw, 120px); align-items: end; }
.hs-intro__head .t-eye { margin-bottom: 24px; }
.hs-intro__head .t-h2 { max-width: 11ch; }
.hs-intro__text { font-size: clamp(21px, 1.95vw, 33px); line-height: 1.32; letter-spacing: -.012em; color: var(--fg2); max-width: 23em; text-wrap: pretty; }
.hs-intro__text strong { color: #fff; font-weight: 600; }

.hs-stats { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 40px clamp(24px, 3vw, 56px); margin-top: clamp(72px, 9vw, 140px); }
.hs-stats__k { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; font-family: var(--f-m); font-size: 11.5px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--fg3); }
.hs-stats__k::after { content: ""; flex: 1; block-size: 1px; background: var(--line2); }
.hs-stats__grp--kg .hs-stats__k { color: var(--au); }
.hs-stats__grp--kg .hs-stats__k::after { background: rgba(245, 200, 66, .4); }
.hs-stats__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(16px, 2vw, 32px); margin: 0; }
.hs-stats__grp--kg .hs-stats__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hs-stat { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 14px; padding-top: 24px; border-top: 1px solid var(--line); }
.hs-stat dd { margin: 0; }
.hs-stat .stat__n { font-size: clamp(54px, 6.3vw, 116px); white-space: nowrap; }
.hs-stat .stat__l { margin: 0; max-width: 15em; line-height: 1.5; }
.hs-stat--gold .stat__n { display: flex; align-items: center; color: var(--au); text-shadow: 0 0 46px rgba(245, 200, 66, .16); }

/* ═════════════ 3 · KATEGORİLER ═════════════ */
.hs-cats { background: var(--k1); padding-top: clamp(24px, 3vw, 48px); }
.hs-cats__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.2vw, 20px); align-items: start; }
.hs-ctile {
  --c: 22px; position: relative; isolation: isolate;
  display: flex; flex-direction: column; justify-content: space-between;
  /* yükseklik = oran; sabit min-height YOK (oranla birlikte en-alt genişliğe dönüşüp karoları üst üste bindiriyordu).
     overflow görünür → içerik uzunsa karo kendiliğinden uzar; görsel kırpması clip-path + .hs-ctile__media ile */
  aspect-ratio: 3 / 4.7; background: var(--k0); color: #ECEAE4;
  clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%);
}
[dir="rtl"] .hs-ctile { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
.hs-ctile:nth-child(even) { margin-top: clamp(28px, 4.4vw, 84px); }
.hs-ctile__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.hs-ctile__img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.78) contrast(1.08) brightness(.78); transform: scale(1.02); transition: transform 1400ms var(--ease-out), filter 700ms var(--ease); }
.hs-ctile--personal .hs-ctile__img { object-position: 50% 24%; }
.hs-ctile--facility .hs-ctile__img { object-position: 36% 40%; }
.hs-ctile--special .hs-ctile__img { object-position: 54% 46%; }
.hs-ctile:hover .hs-ctile__img { transform: scale(1.09); filter: saturate(.92) contrast(1.06) brightness(.88); }
/* platform karosu: CAD modeli teknik bir "görüntüleyici" içinde — ızgara + altın parıltı; görselin siyah zemini karoya karışır */
.hs-ctile--platform .hs-ctile__media {
  background: radial-gradient(72% 40% at 50% 40%, rgba(245,200,66,.09) 0%, rgba(245,200,66,0) 72%), linear-gradient(180deg, #0A0C0F 0%, #050608 100%);
}
.hs-ctile--platform .hs-ctile__media::before {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(236,234,228,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(236,234,228,.06) 1px, transparent 1px);
  background-size: 22px 22px; background-position: center;
  -webkit-mask-image: radial-gradient(64% 46% at 50% 42%, #000 20%, transparent 100%); mask-image: radial-gradient(64% 46% at 50% 42%, #000 20%, transparent 100%);
}
.hs-ctile__img--cad { position: relative; object-fit: contain; object-position: 50% 40%; padding-inline: 6%; mix-blend-mode: lighten; filter: contrast(1.06) brightness(.94); }
.hs-ctile:hover .hs-ctile__img--cad { transform: scale(1.06); filter: contrast(1.06) brightness(1.04); }
/* üst etiketler (sıra no, ürün sayısı) parlak karede de okunur: üst bant daha koyu */
.hs-ctile__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(6,7,8,.86) 0%, rgba(6,7,8,.42) 16%, rgba(6,7,8,0) 30%, rgba(6,7,8,.12) 48%, rgba(6,7,8,.92) 82%, rgba(6,7,8,.97) 100%); }
.hs-ctile::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; block-size: 3px; background: var(--au); transform: scaleX(0); transform-origin: left center; transition: transform 800ms var(--ease-out); }
[dir="rtl"] .hs-ctile::after { transform-origin: right center; }
.hs-ctile:hover::after, .hs-ctile:focus-within::after { transform: scaleX(1); }
.hs-ctile:has(.hs-ctile__link:focus-visible)::before { content: ""; position: absolute; inset: 0; z-index: 3; border: 2px solid var(--au); pointer-events: none; }
.hs-ctile__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 22px; }
.hs-ctile__top .idx { font-size: 13px; }
.hs-ctile__n { font-family: var(--f-m); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(236,234,228,.82); padding-inline-end: 10px; }
.hs-ctile__body { display: grid; gap: 12px; padding: 22px 22px 26px; }
.hs-ctile__name { font-family: var(--f-d); font-stretch: 75%; font-weight: 820; font-size: clamp(30px, 2.55vw, 44px); line-height: .92; letter-spacing: .005em; text-transform: uppercase; text-wrap: balance; }
.hs-ctile__link::before { content: ""; position: absolute; inset: 0; z-index: 2; }
.hs-ctile__link:focus-visible { outline: none; }
.hs-ctile__lead { font-size: 14.5px; line-height: 1.5; color: rgba(236,234,228,.8); }
.hs-ctile__go { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; font-stretch: 112%; letter-spacing: .12em; text-transform: uppercase; color: var(--au); }
.hs-ctile__go .arr { transition: transform var(--t2) var(--ease-out); }
.hs-ctile:hover .hs-ctile__go .arr { transform: translateX(5px); }
[dir="rtl"] .hs-ctile:hover .hs-ctile__go .arr { transform: scaleX(-1) translateX(5px); }
@media (hover: hover) and (min-width: 1101px) {
  .hs-ctile__lead { opacity: 0; transform: translate3d(0, 12px, 0); transition: opacity 500ms var(--ease), transform 700ms var(--ease-out); }
  .hs-ctile:is(:hover, :focus-within) .hs-ctile__lead { opacity: 1; transform: none; }
}
@media (max-width: 1100px) {
  .hs-cats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hs-ctile { aspect-ratio: 4 / 4.6; }
  .hs-ctile:nth-child(even) { margin-top: 40px; }
}
@media (max-width: 640px) {
  .hs-cats__grid { grid-template-columns: 1fr; }
  /* min-height YOK: oranla birlikte 300 px alt sınır karoyu en az 349 px genişliğe zorluyor, 360 px ekranda yatay taşma yapıyordu */
  .hs-ctile { aspect-ratio: 5 / 4.3; }
  .hs-ctile:nth-child(even) { margin-top: 0; }
  /* yatay karoda CAD modeli üst bölgede kalır, başlık ve metnin arkasına girmez */
  .hs-ctile__img--cad { padding: 9% 16% 40%; object-position: 50% 50%; }
  .hs-ctile__name { font-size: 34px; }
}

/* ═════════════ Pahlı bölüm kenarları (KG 45° imzası, ölçülü) ═════════════ */
.hs-flag { --sec-cut: clamp(48px, 7vw, 120px); clip-path: polygon(0 0, calc(100% - var(--sec-cut)) 0, 100% var(--sec-cut), 100% 100%, 0 100%); }
[dir="rtl"] .hs-flag { clip-path: polygon(var(--sec-cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--sec-cut)); }
.hs-nij { --sec-cut: clamp(36px, 4.4vw, 72px); clip-path: polygon(0 var(--sec-cut), var(--sec-cut) 0, 100% 0, 100% 100%, 0 100%); }
[dir="rtl"] .hs-nij { clip-path: polygon(0 0, calc(100% - var(--sec-cut)) 0, 100% var(--sec-cut), 100% 100%, 0 100%); }

/* ═════════════ 4 · AMİRAL ÜRÜN (yapışkan sekans) ═════════════
   Masaüstü (≥1024 × ≥760, hareket serbest): 220vh iz, sahne yapışkan; kaydırma → durum 0 (kapalı) → 0,5 (kesit) → 1 (patlatılmış).
   Afiş kipi: üç durum afişi üst üste, opaklıkla geçiş; çağrılar çapalar arasında transform ile kayar. Canlı 3D varsa afişler söner.
   Diğer durumlar: statik kompozisyon (patlatılmış) + durum seçici. Telefonda çağrılar görselin altında liste olur. */
.hs-flag { position: relative; color: #ECEAE4; background: var(--k0); --s: 1; }
.hs-flag__track { position: relative; }
.hs-flag__stage { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; gap: 26px; min-height: 100vh; padding-block: clamp(96px, 10vw, 156px) 48px; }
.hs-flag.is-seq .hs-flag__track { height: 220vh; }
.hs-flag.is-seq .hs-flag__stage { position: sticky; top: 0; height: 100vh; min-height: 0; padding-block: calc(var(--mast) + 16px) 24px; }
.hs-flag__bg {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(34% 46% at 71% 48%, rgba(245, 200, 66, .1) 0%, rgba(245, 200, 66, 0) 64%),
    radial-gradient(52% 66% at 71% 50%, #1C2027 0%, rgba(13, 15, 19, .6) 46%, rgba(6, 7, 8, 0) 74%),
    linear-gradient(180deg, #060708 0%, #0A0B0E 60%, #060708 100%);
}
[dir="rtl"] .hs-flag__bg {
  background:
    radial-gradient(34% 46% at 29% 48%, rgba(245, 200, 66, .1) 0%, rgba(245, 200, 66, 0) 64%),
    radial-gradient(52% 66% at 29% 50%, #1C2027 0%, rgba(13, 15, 19, .6) 46%, rgba(6, 7, 8, 0) 74%),
    linear-gradient(180deg, #060708 0%, #0A0B0E 60%, #060708 100%);
}
.hs-flag__bg::after {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(236,234,228,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(236,234,228,.05) 1px, transparent 1px);
  background-size: 56px 56px; background-position: center;
  -webkit-mask-image: radial-gradient(42% 56% at 71% 52%, #000 0%, transparent 78%); mask-image: radial-gradient(42% 56% at 71% 52%, #000 0%, transparent 78%);
}
[dir="rtl"] .hs-flag__bg::after { -webkit-mask-image: radial-gradient(42% 56% at 29% 52%, #000 0%, transparent 78%); mask-image: radial-gradient(42% 56% at 29% 52%, #000 0%, transparent 78%); }
.hs-flag__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 4.9fr) minmax(0, 7.1fr); gap: 22px clamp(28px, 4vw, 72px); align-items: center; width: 100%; }
.hs-flag__copy > * + * { margin-top: 20px; }
.hs-flag__title { max-width: 12.5ch; }
.hs-flag__tags { display: flex; flex-wrap: wrap; gap: 8px; --tagbg: var(--k0); }
.hs-flag__lead { color: rgba(236,234,228,.76); max-width: 30em; }
.hs-flag__spec { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 0 clamp(18px, 2vw, 34px); padding-top: 18px; border-top: 1px solid var(--line); margin-top: 26px !important; }
.hs-flag__spec dt { font-family: var(--f-m); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--fg3); white-space: nowrap; }
.hs-flag__spec dd { margin: 6px 0 0; font-weight: 620; font-size: 15.5px; color: #fff; white-space: nowrap; }
.hs-flag__act { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 10px; }

/* görsel kutusu: afişin en/boy oranında (canlı 3D ile piksel hizası için şart) */
.hs-flag__vis { position: relative; margin: 0; }
.hs-flag__box { position: relative; aspect-ratio: var(--ar, 4 / 3); inline-size: min(100%, calc(100vh - var(--mast) - 196px)); min-inline-size: min(100%, 400px); margin-inline: auto; }
.hs-flag__box.is-fallback { inline-size: min(100%, 780px); }
.hs-flag__plate { position: absolute; inset: 0; }
.hs-flag__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; transition: opacity 650ms var(--ease); }
.hs-flag__poster.is-on { opacity: 1; }
.hs-flag__poster[data-st="cut"] { z-index: 1; }
.hs-flag__poster[data-st="exploded"] { z-index: 2; }
.hs-flag.is-seq .hs-flag__poster { transition: none; }
.hs-flag__plate.is-3d .hs-flag__poster { opacity: 0 !important; transition: opacity 700ms var(--ease) !important; }
.hs-flag__plate canvas { z-index: 3; }
.hs-flag__poster--fb { -webkit-mask-image: radial-gradient(closest-side, #000 58%, transparent 100%); mask-image: radial-gradient(closest-side, #000 58%, transparent 100%); transform-origin: 52% 50%; transform: perspective(1200px) rotateX(calc(var(--s) * 9deg)) rotateZ(calc(var(--s) * -2deg)) scale(calc(1 + var(--s) * .06)); will-change: transform; transition: transform 160ms linear; }
/* alt çağrılar (seviye, ağırlık) küçük kutularda plakanın altına sarkar → açıklama onların altında kalır */
.hs-flag__cap { display: block; margin-top: 34px; text-align: end; font-family: var(--f-m); letter-spacing: .1em; text-transform: uppercase; color: var(--fg3); }
.hs-flag__box ~ .hs-flag__cap { inline-size: min(100%, calc(100vh - var(--mast) - 196px)); min-inline-size: min(100%, 400px); margin-inline: auto; }

/* çağrılar: teknik resim balonları. Öğe kutu boyutunda; çapaya transform ile taşınır (yalnız transform/opacity).
   Konum fiziksel (görsel aynalanmaz); metin hizası mantıksal. Etiketler afişin boş üst/alt bantlarına çıkar. */
.hs-flag__calls { position: absolute; inset: 0; z-index: 4; margin: 0; pointer-events: none; }
.hs-call { position: absolute; inset: 0; transform: translate3d(var(--x), var(--y), 0); transition: transform 750ms var(--ease-out); }
.hs-flag.is-seq .hs-call, .hs-flag__box.is-live .hs-call { transition: none; }
.hs-call__dot { position: absolute; left: -6px; top: -6px; inline-size: 12px; block-size: 12px; border: 1.5px solid var(--au); background: rgba(6,7,8,.75); transition: opacity 350ms var(--ease), transform 450ms var(--ease-out); }
.hs-call__dot::after { content: ""; position: absolute; inset: 3px; background: var(--au); }
.hs-call__line { position: absolute; left: -.5px; inline-size: 1px; block-size: var(--len, 12%); background: rgba(245,200,66,.72); transition: transform 550ms var(--ease-out) 60ms; }
.hs-call--up .hs-call__line { top: calc(var(--len, 12%) * -1); transform-origin: 50% 100%; }
.hs-call--dn .hs-call__line { top: 0; transform-origin: 50% 0; }
.hs-call__box {
  position: absolute; display: grid; gap: 4px; inline-size: max-content; max-inline-size: 260px; padding: 10px 14px 11px;
  background: rgba(11,12,15,.86); border: 1px solid rgba(236,234,228,.16); text-align: start;
  transition: opacity 450ms var(--ease) 180ms, translate 650ms var(--ease-out) 180ms;
}
.hs-call--up .hs-call__box { top: calc(var(--len, 12%) * -1); transform: translateY(-100%); }
.hs-call--dn .hs-call__box { top: var(--len, 12%); }
.hs-call--r .hs-call__box { left: -1px; border-left: 2px solid var(--au); }
.hs-call--l .hs-call__box { right: 100%; margin-right: -1px; border-right: 2px solid var(--au); }
.hs-call__k { display: flex; align-items: center; gap: 8px; font-family: var(--f-m); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: rgba(236,234,228,.7); white-space: nowrap; }
.hs-call__k .idx { font-size: 11px; }
.hs-call__v { font-family: var(--f-d); font-stretch: 78%; font-weight: 780; font-size: 21px; line-height: 1.05; color: #fff; white-space: nowrap; }
.hs-call--gold .hs-call__box { background: rgba(28,24,12,.9); border-color: rgba(245,200,66,.55); }
.hs-call--gold .hs-call__k { color: var(--au); }
.hs-call--gold .streak { margin-inline-end: 2px; inline-size: 14px; vertical-align: middle; }
.js .hs-call:not(.is-on) .hs-call__dot, .hs-call.is-hid .hs-call__dot { opacity: 0; transform: scale(.4); }
.js .hs-call:not(.is-on) .hs-call__line, .hs-call.is-hid .hs-call__line { transform: scaleY(0); }
.js .hs-call:not(.is-on) .hs-call__box, .hs-call.is-hid .hs-call__box { opacity: 0; translate: 0 8px; }

.hs-flag__foot { position: relative; z-index: 1; grid-column: 1 / -1; display: flex; align-items: center; gap: 18px 32px; width: 100%; }
.hs-flag__steps { display: flex; flex-wrap: wrap; gap: 6px; }
.hs-flag__step { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px; border: 1px solid var(--line2); font-family: var(--f-m); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg2); transition: border-color var(--t1), color var(--t1), background-color var(--t1); }
.hs-flag__step .idx { color: inherit; opacity: .7; }
.hs-flag__step:hover { border-color: var(--au); color: #fff; }
.hs-flag__step[aria-pressed="true"] { background: var(--au); border-color: var(--au); color: #0B0C0F; }
.hs-flag__hint { display: none; align-items: center; gap: 10px; margin-inline-start: auto; }
.hs-flag.is-seq .hs-flag__hint { display: flex; }
.hs-flag__prog { position: absolute; inset-inline: 0; bottom: -12px; block-size: 2px; background: rgba(236,234,228,.1); overflow: hidden; display: none; }
.hs-flag.is-seq .hs-flag__prog { display: block; }
.hs-flag__prog-fill { position: absolute; inset: 0; background: var(--au); transform: scaleX(0); transform-origin: left center; }
[dir="rtl"] .hs-flag__prog-fill { transform-origin: right center; }
html:not(.js) .hs-flag__steps, .hs-flag:not(.has-steps) .hs-flag__steps { display: none; }
@media (max-width: 1240px) and (min-width: 1024px) {
  .hs-flag__spec { grid-template-columns: repeat(2, auto); row-gap: 14px; }
  .hs-flag__spec dd { white-space: normal; }
}
@media (max-width: 1023px) {
  /* tek sütun: başlık → görsel + çağrılar → açıklama, özellikler, eylemler */
  .hs-flag__grid { grid-template-columns: minmax(0, 1fr); row-gap: 18px; }
  .hs-flag__copy { display: contents; }
  .hs-flag__copy > * { margin-top: 0 !important; }
  .hs-flag__copy > .t-eye { order: 1; }
  .hs-flag__title { order: 2; }
  .hs-flag__tags { order: 3; }
  .hs-flag__vis { order: 4; margin-block: 10px 0; }
  /* görünüm seçici görselin hemen altında (önceden eylemlerin de altındaydı, plakadan ~1 ekran uzak) */
  .hs-flag__foot { order: 5; justify-content: center; }
  .hs-flag__lead { order: 6; }
  .hs-flag__spec { order: 7; margin-top: 4px !important; }
  .hs-flag__act { order: 8; }
}
@media (max-width: 760px) {
  .hs-flag__stage { padding-block: 84px 56px; min-height: 0; }
  .hs-flag__spec { grid-template-columns: 1fr 1fr; row-gap: 14px; }
  /* telefonda çağrılar görselin altında statik özellik listesi olur; afişin boş bantları kırpılır */
  .hs-flag__box, .hs-flag__box ~ .hs-flag__cap { inline-size: 100%; min-inline-size: 0; }
  .hs-flag__box { aspect-ratio: auto; }
  .hs-flag__plate { position: relative; inset: auto; aspect-ratio: 5 / 4; }
  .hs-flag__box.has-poster .hs-flag__poster { object-fit: cover; }
  .hs-flag__calls { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
  .hs-flag .hs-call { position: static; inset: auto; transform: none !important; }
  .hs-flag .hs-call .hs-call__dot, .hs-flag .hs-call .hs-call__line { display: none; }
  .hs-flag .hs-call .hs-call__box {
    position: static; transform: none; translate: none; opacity: 1; inline-size: auto; max-inline-size: none; block-size: 100%;
    margin: 0; padding: 10px 12px 11px; border: 1px solid rgba(236,234,228,.16); border-inline-start: 2px solid var(--au);
  }
  .hs-flag .hs-call--gold .hs-call__box { border-color: rgba(245,200,66,.55); border-inline-start-color: var(--au); }
  .hs-flag .hs-call__k { display: block; white-space: normal; font-size: 10px; letter-spacing: .1em; }
  .hs-flag .hs-call__k .streak { margin-inline-end: 6px; }
  .hs-call__v { font-size: 17px; white-space: normal; }
  .hs-flag__step { padding: 0 11px; gap: 7px; letter-spacing: .08em; }
  .hs-flag__cap { margin-top: 10px; }
  /* home.js seçiciyi plakanın hemen altına taşır (çağrı listesinin üstü): dokunulan düğme ile değişen görsel aynı ekranda */
  .hs-flag__box > .hs-flag__steps { justify-content: center; margin-block: 12px 4px; }
}

/* ═════════════ 5 · KARA · DENİZ · HAVA (açılır üçlü panel) ═════════════
   Masaüstü: paneller üst üste biner; yalnız transform ile kayar (genişlik animasyonu yok).
   --x: açık panel genişliği (kap yüzdesi) · --r: kapalı şerit / panel genişliği oranı ((100-x)/2/x) */
.hs-plat { padding-top: clamp(96px, 10vw, 170px); overflow: hidden; }
.hs-plat__head { align-items: end; }
.hs-plat__lead { max-width: 32em; font-size: clamp(16px, 1.15vw, 18.5px); }
.hs-plat__lead strong { display: block; margin-bottom: 6px; }
@media (max-width: 1023px) { .hs-plat__head { grid-template-columns: minmax(0, 1fr); } }
.hs-tri {
  --x: 56%; --r: .392857; --dir: 1; --p1: 1; --p2: calc(1 + var(--r));
  position: relative; block-size: clamp(640px, 84vh, 860px); overflow: hidden;
  border-top: 1px solid var(--line); background: var(--k0);
}
[dir="rtl"] .hs-tri { --dir: -1; }
.hs-tri[data-on="1"] { --p1: var(--r); --p2: calc(1 + var(--r)); }
.hs-tri[data-on="2"] { --p1: var(--r); --p2: calc(2 * var(--r)); }
html:not(.js) .hs-tri:has(> .hs-tri__p:nth-child(2):is(:hover, :focus-within)) { --p1: var(--r); --p2: calc(1 + var(--r)); }
html:not(.js) .hs-tri:has(> .hs-tri__p:nth-child(3):is(:hover, :focus-within)) { --p1: var(--r); --p2: calc(2 * var(--r)); }
.hs-tri__p {
  --off: 0;
  position: absolute; inset-block: 0; inset-inline-start: 0; inline-size: var(--x); overflow: hidden;
  background: var(--k0); color: #ECEAE4;
  transform: translate3d(calc(var(--off) * 100% * var(--dir)), 0, 0);
  transition: transform 950ms cubic-bezier(.7, 0, .2, 1);
  box-shadow: -1px 0 0 rgba(236,234,228,.16), -50px 0 70px -34px rgba(0,0,0,.85);
  cursor: pointer;
}
[dir="rtl"] .hs-tri__p { box-shadow: 1px 0 0 rgba(236,234,228,.16), 50px 0 70px -34px rgba(0,0,0,.85); }
.hs-tri__p:nth-child(1) { z-index: 1; box-shadow: none; }
.hs-tri__p:nth-child(2) { z-index: 2; --off: var(--p1); }
.hs-tri__p:nth-child(3) { z-index: 3; --off: var(--p2); }
/* zemin: şerit karesinin koyulaştırılmış, bulanık hâli (atmosfer; metin ve çizim bunun üzerinde) */
.hs-tri__bg { position: absolute; inset: -8%; z-index: 0; background-size: cover; background-position: center; filter: blur(24px) brightness(.36) saturate(.72); transform: scale(1.04); opacity: .8; transition: transform 1600ms var(--ease-out), opacity 900ms var(--ease); }
.hs-tri__p.is-on .hs-tri__bg { transform: scale(1.12); opacity: 1; }
.hs-tri__shade { position: absolute; inset: 0; z-index: 1; background:
  linear-gradient(90deg, rgba(6,7,8,.55) 0%, rgba(6,7,8,.35) calc(var(--r) * 100%), rgba(6,7,8,.62) 100%),
  linear-gradient(0deg, rgba(6,7,8,.9) 0%, rgba(6,7,8,0) 40%),
  linear-gradient(180deg, rgba(6,7,8,.6) 0%, rgba(6,7,8,0) 30%); }
[dir="rtl"] .hs-tri__shade { background:
  linear-gradient(270deg, rgba(6,7,8,.55) 0%, rgba(6,7,8,.35) calc(var(--r) * 100%), rgba(6,7,8,.62) 100%),
  linear-gradient(0deg, rgba(6,7,8,.9) 0%, rgba(6,7,8,0) 40%),
  linear-gradient(180deg, rgba(6,7,8,.6) 0%, rgba(6,7,8,0) 30%); }
.hs-tri__in { position: absolute; inset: 0; z-index: 2; display: grid; grid-template-columns: calc(var(--r) * 100%) minmax(0, 1fr); }
/* sol sütun = kapalıyken görünen şerit: sıra no + büyük ad + çerçeveli görsel + ürün adı */
.hs-tri__col { display: flex; flex-direction: column; gap: clamp(16px, 2.2vh, 26px); min-height: 0; padding: clamp(26px, 3.2vh, 40px) clamp(20px, 2.2vw, 36px) clamp(28px, 3.4vh, 42px); }
.hs-tri__k { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin: 0; }
.hs-tri__k .idx { font-size: 13px; }
.hs-tri__k-name { font-family: var(--f-d); font-stretch: 75%; font-weight: 850; font-size: clamp(64px, 6.4vw, 116px); line-height: .8; letter-spacing: .01em; text-transform: uppercase; color: rgba(236,234,228,.62); transition: color 700ms var(--ease); }
.hs-tri__p.is-on .hs-tri__k-name { color: #ECEAE4; }
.hs-tri__frame { --c: 16px; position: relative; flex: 1 1 auto; min-height: 120px; margin: 0; overflow: hidden; background: #000; clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); }
[dir="rtl"] .hs-tri__frame { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
.hs-tri__frame.hud::before { inset-block-start: 10px; inset-inline-start: 10px; inline-size: 14px; block-size: 14px; }
.hs-tri__frame.hud::after { inset-block-end: 10px; inset-inline-end: 10px; inline-size: 14px; block-size: 14px; }
.hs-tri__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.62) contrast(1.08) brightness(.74); transform: scale(1.04); transition: transform 1400ms var(--ease-out), filter 700ms var(--ease); }
.hs-tri__p.is-on .hs-tri__img { transform: scale(1.0); filter: saturate(.8) contrast(1.05) brightness(.84); }
/* nehir karesi: köpüklü su parlamasın */
.hs-tri__p--ship .hs-tri__img { filter: saturate(.6) contrast(1.06) brightness(.66); }
.hs-tri__p--ship.is-on .hs-tri__img { filter: saturate(.76) contrast(1.04) brightness(.76); }
.hs-tri__name { margin: 0; font-family: var(--f-d); font-stretch: 78%; font-weight: 800; font-size: clamp(22px, 1.8vw, 30px); line-height: 1; text-transform: uppercase; }
.hs-tri__link { display: inline-flex; flex-direction: column; gap: 14px; }
.hs-tri__link::before { content: ""; position: absolute; inset: 0; z-index: 1; }
.hs-tri__link::after { content: ""; display: block; order: -1; inline-size: 40px; block-size: 3px; background: var(--au); transform-origin: left center; transition: transform 700ms var(--ease-out); }
[dir="rtl"] .hs-tri__link::after { transform-origin: right center; }
.hs-tri__p.is-on .hs-tri__link::after { transform: scaleX(1.8); }
.hs-tri__link:focus-visible { outline: none; }
.hs-tri__p:has(.hs-tri__link:focus-visible)::after { content: ""; position: absolute; inset: 0; z-index: 4; border: 2px solid var(--au); pointer-events: none; }
/* sağ sütun = panel açılınca beliren teknik özet. Etkileşimli öğe içermez: tıklama alttaki panel bağlantısına
   (.hs-tri__link::before, tüm panel) geçer → "İNCELE →", metin ve rakamlar da ürüne götürür. */
.hs-tri__more {
  position: relative; z-index: 2; align-self: stretch; display: flex; flex-direction: column; justify-content: space-between; gap: clamp(18px, 2.6vh, 28px);
  padding: clamp(64px, 8vh, 92px) clamp(26px, 3.2vw, 56px) clamp(28px, 3.4vh, 42px) clamp(12px, 1.4vw, 24px);
  opacity: 0; transform: translate3d(calc(28px * var(--dir)), 0, 0); transition: opacity 450ms var(--ease), transform 900ms var(--ease-out);
  pointer-events: none;
}
/* teknik çizim: giriş metni ile rakamlar arasındaki alanı doldurur; ızgara zemin, açılınca çizim ileri kayar */
.hs-tri__plan { position: relative; flex: 1 1 auto; min-height: 96px; margin: 0; }
.hs-tri__plan::before {
  content: ""; position: absolute; inset: -4% -3%;
  background-image: linear-gradient(rgba(236,234,228,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(236,234,228,.06) 1px, transparent 1px);
  background-size: 24px 24px; background-position: center;
  -webkit-mask-image: radial-gradient(closest-side, #000 35%, transparent 100%); mask-image: radial-gradient(closest-side, #000 35%, transparent 100%);
}
.hs-tri__plan-img { position: absolute; inset: 0 0 22px; width: 100%; height: calc(100% - 22px); object-fit: contain; transform: translate3d(calc(-40px * var(--dir)), 0, 0); transition: transform 1300ms var(--ease-out) 240ms; }
.hs-tri__p.is-on .hs-tri__plan-img { transform: none; }
.hs-tri__plan-cap { position: absolute; inset-block-end: 0; inset-inline-end: 0; font-family: var(--f-m); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: rgba(236,234,228,.66); }
.hs-tri__p.is-on .hs-tri__more { opacity: 1; transform: none; transition-delay: 340ms, 280ms; }
html:not(.js) .hs-tri:has(> .hs-tri__p:not(:first-child):is(:hover, :focus-within)) > .hs-tri__p:first-child .hs-tri__more { opacity: 0; }
html:not(.js) .hs-tri__p:not(:first-child):is(:hover, :focus-within) .hs-tri__more { opacity: 1; transform: none; }
.hs-tri__intro { font-size: clamp(15px, 1.1vw, 17px); line-height: 1.6; color: rgba(236,234,228,.84); max-width: 32em; margin: 0; }
.hs-tri__end { display: grid; gap: clamp(16px, 2.2vh, 24px); }
.hs-tri__facts { display: grid; margin: 0; border-top: 1px solid rgba(236,234,228,.16); }
.hs-tri__fact { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 12px 0 10px; border-bottom: 1px solid rgba(236,234,228,.1); }
.hs-tri__fact dt { font-family: var(--f-m); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(236,234,228,.8); }
.hs-tri__fact dd { margin: 0; font-family: var(--f-d); font-stretch: 75%; font-weight: 820; font-size: clamp(36px, 3.2vw, 56px); line-height: .9; color: #fff; white-space: nowrap; }
.hs-tri__fact:first-child dd { color: var(--au); }
.hs-tri__fact dd small { margin-inline-start: 6px; font-family: var(--f-m); font-weight: 500; font-size: 12px; letter-spacing: .06em; color: rgba(236,234,228,.8); }
.hs-tri__models { display: flex; flex-wrap: wrap; gap: 6px; }
.hs-tri__models li { padding: 5px 10px 4px; border: 1px solid rgba(236,234,228,.24); font-family: var(--f-m); font-size: 11px; letter-spacing: .08em; color: rgba(236,234,228,.88); }
.hs-tri__go { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; font-stretch: 112%; letter-spacing: .12em; text-transform: uppercase; color: var(--au); }
.hs-tri__go .arr { transition: transform var(--t2) var(--ease-out); }
.hs-tri__p:hover .hs-tri__go .arr { transform: translateX(5px); }
[dir="rtl"] .hs-tri__p:hover .hs-tri__go .arr { transform: scaleX(-1) translateX(5px); }
@media (max-width: 1240px) and (min-width: 1024px) {
  .hs-tri { --x: 58%; --r: .362069; }
  .hs-tri__k-name { font-size: clamp(56px, 5.8vw, 88px); }
}
@media (max-height: 800px) and (min-width: 1024px) {
  .hs-tri__intro { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .hs-tri__fact dd { font-size: clamp(30px, 2.6vw, 44px); }
}
@media (max-width: 1023px) {
  .hs-tri { block-size: auto; display: grid; gap: 14px; padding: 0 var(--m) 8px; border: 0; background: none; }
  .hs-tri__p { --c: 18px; position: relative; inset: auto; inline-size: auto; transform: none !important; box-shadow: none !important; transition: none;
    clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); }
  [dir="rtl"] .hs-tri__p { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
  .hs-tri__bg { opacity: 1; }
  .hs-tri__in { position: relative; inset: auto; display: block; }
  .hs-tri__col { padding: 24px 22px 0; }
  .hs-tri__k { flex-direction: row; align-items: baseline; justify-content: space-between; }
  .hs-tri__k-name { order: -1; font-size: clamp(54px, 14vw, 92px); color: #ECEAE4; }
  .hs-tri__frame { flex: none; aspect-ratio: 16 / 10; }
  .hs-tri__more { opacity: 1; transform: none; padding: 22px 22px 26px; }
  .hs-tri__plan { flex: none; min-height: 0; aspect-ratio: 832 / 360; }
  .hs-tri__plan-img { transform: none; }
  .hs-tri__shade { background: linear-gradient(180deg, rgba(6,7,8,.5) 0%, rgba(6,7,8,.88) 100%); }
  .hs-tri__fact dd { font-size: clamp(30px, 8vw, 44px); }
  .hs-tri__link::after { transform: scaleX(1.8); }
}

/* ═════════════ 6 · ÜRÜN RAYI ═════════════ */
.hs-rail { overflow: hidden; background: var(--k1); }
.hs-rail .shead { margin-bottom: clamp(32px, 4vw, 56px); }
.hs-rail__vp {
  --pad: max(var(--m), calc((100% - var(--maxw)) / 2 + var(--m)));
  overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-padding-inline: var(--pad);
  padding: 6px var(--pad) 10px; scrollbar-width: none;
}
.hs-rail__vp::-webkit-scrollbar { display: none; }
.hs-rail__vp:focus-visible { outline-offset: -2px; }
.hs-rail__list { display: flex; gap: clamp(14px, 1.4vw, 22px); inline-size: max-content; }
.hs-rail__item { display: flex; flex: 0 0 auto; inline-size: clamp(268px, 22.5vw, 336px); scroll-snap-align: start; }
.hs-rail__item > .pcard { inline-size: 100%; }
/* tek tip kart: saydam ürün görseli kart yüksekliğini şişirmesin (ortak .pcard__media yalnız oran verir) */
.hs-rail .pcard__media { position: relative; min-height: 0; overflow: hidden; }
.hs-rail .pcard__media > .pvis { position: absolute; inset: 0; }
.hs-rail__ctl { display: flex; align-items: center; gap: 12px; margin-top: 30px; }
.hs-rail__btn { --c: 9px; position: relative; isolation: isolate; display: inline-grid; place-items: center; flex: none; inline-size: 48px; block-size: 48px; color: var(--fg); }
.hs-rail__btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--line2); clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); transition: background-color var(--t1); }
.hs-rail__btn::after { content: ""; position: absolute; inset: 1px; z-index: -1; background: var(--k1); clip-path: polygon(0 0, calc(100% - var(--c) + .41px) 0, 100% calc(var(--c) - .41px), 100% 100%, 0 100%); }
[dir="rtl"] .hs-rail__btn::before { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
[dir="rtl"] .hs-rail__btn::after { clip-path: polygon(calc(var(--c) - .41px) 0, 100% 0, 100% 100%, 0 100%, 0 calc(var(--c) - .41px)); }
.hs-rail__btn:hover:not(:disabled)::before { background: var(--au); }
.hs-rail__btn:disabled { opacity: .35; cursor: default; }
.hs-rail__bar { position: relative; flex: 1 1 auto; block-size: 2px; margin-inline: 10px; background: var(--line2); overflow: hidden; }
.hs-rail__thumb { position: absolute; inset-block: 0; inset-inline-start: 0; inline-size: var(--tw, 34%); background: var(--au); transform: translate3d(var(--tx, 0%), 0, 0); transition: transform 180ms linear; }
.hs-rail__all { margin-inline-start: 12px; --bgx: var(--k1); }
html:not(.js) .hs-rail__btn, html:not(.js) .hs-rail__bar { display: none; }
@media (max-width: 760px) {
  .hs-rail__item { inline-size: 78vw; }
  .hs-rail__bar { display: none; }
  .hs-rail__all { margin-inline-start: auto; }
}

/* ═════════════ 7 · TEHDİT ENERJİSİ ═════════════ */
.hs-nij { position: relative; overflow: hidden; }
.hs-nij::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(60% 50% at 30% 55%, rgba(245,200,66,.05), rgba(245,200,66,0) 70%); }
.hs-nij .wrap { position: relative; }
.hs-nij__grid { display: grid; grid-template-columns: minmax(0, 7.6fr) minmax(300px, 4.4fr); gap: clamp(28px, 4vw, 72px); align-items: start; }
.hs-nij__chart { --lw: clamp(108px, 9vw, 150px); --jw: clamp(92px, 7.4vw, 124px); --g: clamp(12px, 1.4vw, 22px); position: relative; padding-top: 30px; }
.hs-nij__axis { position: absolute; inset-block: 0 0; inset-inline: calc(var(--lw) + var(--g)) calc(var(--jw) + var(--g)); pointer-events: none; }
.hs-nij__tick { position: absolute; inset-block: 0; inset-inline-start: var(--p); inline-size: 1px; background: linear-gradient(180deg, rgba(236,234,228,.12), rgba(236,234,228,.04)); }
.hs-nij__tick span { position: absolute; top: 0; inset-inline-start: 8px; font-family: var(--f-m); font-size: 10.5px; letter-spacing: .1em; color: var(--fg3); white-space: nowrap; }
.hs-nij__rows { position: relative; }
.hs-nij__zone { padding: 26px 0 10px; }
.hs-nij__zone:first-child { padding-top: 10px; }
.hs-nij__zone span { display: inline-flex; align-items: center; gap: 10px; font-family: var(--f-m); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--fg3); }
.hs-nij__zone span::before { content: ""; inline-size: 18px; block-size: 1px; background: currentColor; }
.hs-nij__btn {
  position: relative; display: grid; inline-size: 100%;
  grid-template-columns: var(--lw) minmax(0, 1fr) var(--jw); grid-template-areas: "lvl bar j" "lvl meta meta";
  align-items: center; column-gap: var(--g); row-gap: 8px; padding: 14px 0 16px; text-align: start;
  border-top: 1px solid var(--line); color: var(--fg2); transition: color var(--t1);
}
.hs-nij__btn:hover, .hs-nij__btn[aria-checked="true"] { color: var(--fg); }
.hs-nij__btn:focus-visible { outline-offset: 4px; }
.hs-nij__lvl { grid-area: lvl; display: flex; align-items: center; font-family: var(--f-d); font-stretch: 75%; font-weight: 820; font-size: clamp(38px, 3.6vw, 64px); line-height: .9; color: var(--fg); letter-spacing: .01em; }
.hs-nij__lvl .streak, .hs-nij__nostreak { inline-size: 14px; block-size: 3px; margin-inline-end: 12px; vertical-align: middle; flex: none; }
.hs-nij__nostreak { display: inline-block; background: transparent; }
.hs-nij__bar { grid-area: bar; position: relative; block-size: clamp(26px, 2.5vw, 42px); background: rgba(236,234,228,.035); }
/* çubuk uzunluğu bilginin kendisi: iz zemine karşı ≥3:1 (gri), föyde belirtilen seviyeler altın tonda, seçili çubuk tam renk + çerçeve */
.hs-nij__fill { position: absolute; inset: 0; background: linear-gradient(90deg, #5B616C, #8D929B); transform-origin: left center; transform: scaleX(var(--w)); transition: transform 1300ms var(--ease-out), opacity 300ms; }
[dir="rtl"] .hs-nij__fill { transform-origin: right center; background: linear-gradient(270deg, #5B616C, #8D929B); }
.hs-nij__btn.is-rated .hs-nij__fill { background: linear-gradient(90deg, rgba(245,200,66,.45), rgba(245,200,66,.85)); }
[dir="rtl"] .hs-nij__btn.is-rated .hs-nij__fill { background: linear-gradient(270deg, rgba(245,200,66,.45), rgba(245,200,66,.85)); }
.hs-nij__btn:hover .hs-nij__fill { opacity: .85; }
.hs-nij__btn[aria-checked="true"].is-rated .hs-nij__fill { background: var(--au); }
.hs-nij__btn[aria-checked="true"]:not(.is-rated) .hs-nij__fill { background: var(--bone); }
.hs-nij__btn[aria-checked="true"] .hs-nij__bar { box-shadow: inset 0 0 0 1px rgba(236,234,228,.4); }
.js .hs-nij:not(.is-in) .hs-nij__fill { transform: scaleX(0); }
.hs-nij__rows li:nth-child(3) .hs-nij__fill { transition-delay: 60ms; }
.hs-nij__rows li:nth-child(4) .hs-nij__fill { transition-delay: 120ms; }
.hs-nij__rows li:nth-child(6) .hs-nij__fill { transition-delay: 220ms; }
.hs-nij__rows li:nth-child(7) .hs-nij__fill { transition-delay: 290ms; }
.hs-nij__j { grid-area: j; font-family: var(--f-d); font-stretch: 75%; font-weight: 800; font-size: clamp(22px, 1.9vw, 32px); line-height: 1; color: var(--fg); text-align: end; white-space: nowrap; }
.hs-nij__j small { font-size: .55em; color: var(--fg3); font-weight: 600; }
.hs-nij__btn[aria-checked="true"].is-rated .hs-nij__j { color: var(--au); }
.hs-nij__meta { grid-area: meta; font-family: var(--f-m); font-size: 12px; letter-spacing: .05em; color: var(--fg3); }

.hs-nij__read { position: sticky; top: calc(var(--mast) + 24px); }
.hs-nij__card { --c: 22px; position: relative; padding: clamp(24px, 2.4vw, 34px); background: linear-gradient(180deg, #15181E 0%, #101216 100%); clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); box-shadow: inset 0 2px 0 var(--k5); }
[dir="rtl"] .hs-nij__card { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
.hs-nij__card.is-rated { box-shadow: inset 0 2px 0 var(--au); }
.hs-nij__card-k { font-family: var(--f-m); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg3); }
.hs-nij__card-sel { color: var(--fg2); }
.hs-nij__card-lvl { margin-top: 14px !important; font-family: var(--f-d); font-stretch: 75%; font-weight: 850; font-size: clamp(64px, 6.2vw, 108px); line-height: .84; color: #fff; }
.hs-nij__card.is-rated .hs-nij__card-lvl { color: var(--au); }
.hs-nij__card-dl { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; margin: 26px 0 0; padding-top: 20px; border-top: 1px solid var(--line); }
.hs-nij__card-dl dt { font-family: var(--f-m); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg3); }
.hs-nij__card-dl dd { margin: 6px 0 0; font-weight: 620; font-size: 15.5px; color: var(--fg); }
.hs-nij__card-j { font-family: var(--f-d); font-stretch: 78%; font-weight: 800 !important; font-size: 26px !important; line-height: 1; }
.hs-nij__card-use { grid-column: 1 / -1; }
.hs-nij__card-prod { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.hs-nij__card-pk { font-family: var(--f-m); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg3); margin-bottom: 10px; }
.hs-nij__plist { display: grid; gap: 4px; }
.hs-nij__plist a { display: inline-flex; align-items: center; padding: 4px 0; font-weight: 600; font-size: 15px; color: var(--fg); transition: color var(--t1); }
.hs-nij__plist a:hover { color: var(--au); }
.hs-nij__card-none { font-size: 14.5px; color: var(--fg2); }
.hs-nij__legend { display: flex; align-items: center; gap: 4px; margin-top: 34px; font-size: 13px; color: var(--fg3); }
/* JS yoksa seçici çalışmaz → beş seviyenin okuma kartı alt alta (ürün bağlantıları erişilebilir); "Seçili seviye" etiketi gizli */
html:not(.js) .hs-nij__read { position: static; display: grid; gap: 14px; }
html:not(.js) .hs-nij__card[hidden] { display: block !important; }
html:not(.js) .hs-nij__card-sel { display: none; }
@media (max-width: 1100px) {
  .hs-nij__grid { grid-template-columns: minmax(0, 1fr); }
  .hs-nij__read { position: relative; top: auto; }
}
@media (max-width: 640px) {
  .hs-nij__chart { --lw: 64px; --jw: 78px; --g: 10px; }
  .hs-nij__lvl { font-size: 32px; }
  .hs-nij__lvl .streak, .hs-nij__nostreak { display: none; }
  .hs-nij__j { font-size: 19px; }
  .hs-nij__meta { font-size: 11px; letter-spacing: 0; }
  .hs-nij__tick span { font-size: 9.5px; inset-inline-start: 4px; }
  .hs-nij__tick:nth-child(odd) span { display: none; }
  .hs-nij__card-dl { grid-template-columns: 1fr 1fr; }
}

/* ═════════════ 8 · ÜRETİM AKIŞI ═════════════ */
.hs-proc { overflow: hidden; padding-block: clamp(80px, 8.5vw, 140px); }
.hs-proc__steps { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); margin-top: clamp(8px, 1vw, 16px); }
.hs-proc__step { position: relative; display: grid; grid-template-rows: auto auto auto auto; align-content: start; gap: 16px; padding-inline-end: 14px; }
.hs-proc__no { font-family: var(--f-d); font-stretch: 75%; font-weight: 820; font-size: clamp(40px, 4.2vw, 76px); line-height: .88; color: var(--fg); letter-spacing: .01em; }
.hs-proc__step.is-gold .hs-proc__no { color: var(--au); }
.hs-proc__node { position: relative; display: block; block-size: 18px; }
.hs-proc__node::before { content: ""; position: absolute; top: 8px; inset-inline: 9px -1px; block-size: 2px; background: var(--line2); transform-origin: left center; }
[dir="rtl"] .hs-proc__node::before { transform-origin: right center; }
.hs-proc__step:last-child .hs-proc__node::before { display: none; }
.hs-proc__step.is-gold .hs-proc__node::before { background: var(--au); }
.hs-proc__sym { position: relative; z-index: 1; inline-size: 18px; block-size: 18px; fill: var(--k2); stroke: var(--fg2); stroke-width: 1.5; }
.hs-proc__step.is-gold .hs-proc__sym { stroke: var(--au); }
.hs-proc__sym--test { fill: var(--au); stroke: var(--au) !important; }
/* RTL: akış sağdan sola → sevk oku da aynalanır */
[dir="rtl"] .hs-proc__sym--move { transform: scaleX(-1); }
.hs-proc__name { font-weight: 620; font-size: clamp(15px, 1.12vw, 17.5px); line-height: 1.35; color: var(--fg); max-width: 11em; }
.hs-proc__kind { margin-top: -8px; font-family: var(--f-m); font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--fg3); }
.hs-proc__step.is-gold .hs-proc__kind { color: rgba(245,200,66,.75); }
.hs-proc__legend { display: flex; align-items: center; margin-top: clamp(40px, 5vw, 64px); font-size: 13px; color: var(--fg3); }
@media (prefers-reduced-motion: no-preference) {
  .js .hs-proc__node::before { transform: scaleX(0); transition: transform 900ms var(--ease-out); transition-delay: calc(var(--d, 0ms) + 300ms); }
  .js .hs-proc__step.is-in .hs-proc__node::before { transform: none; }
}
@media (max-width: 1100px) {
  .hs-proc__steps { grid-template-columns: 1fr; gap: 0; }
  .hs-proc__step { grid-template-columns: 26px clamp(64px, 12vw, 96px) minmax(0, 1fr); grid-template-rows: auto; align-items: center; gap: 0 16px; padding: 16px 0; }
  .hs-proc__node { grid-column: 1; grid-row: 1; }
  .hs-proc__no { grid-column: 2; grid-row: 1; font-size: clamp(30px, 6vw, 44px); }
  .hs-proc__name { grid-column: 3; grid-row: 1; max-width: none; }
  .hs-proc__kind { grid-column: 3; grid-row: 2; margin-top: 4px; }
  .hs-proc__node::before { inset-inline: 8px auto; inline-size: 2px; top: 9px; block-size: calc(100% + 34px); transform-origin: center top; }
  .js .hs-proc__node::before { transform: scaleY(0); }
  .js .hs-proc__step.is-in .hs-proc__node::before { transform: none; }
}

/* ═════════════ 9 · DOKTRİN ═════════════ */
.hs-doc { position: relative; background: var(--k1); padding-bottom: clamp(88px, 9vw, 150px); }
.hs-doc__media { position: relative; block-size: clamp(400px, 64vh, 700px); }
.hs-doc__media > .hs-doc__img { inset: -9% 0 auto; height: 118%; object-position: 62% 38%; }
.hs-doc__scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none; background:
  linear-gradient(180deg, rgba(11,12,15,.6) 0%, rgba(11,12,15,0) 24%, rgba(11,12,15,0) 62%, var(--k1) 100%),
  radial-gradient(120% 90% at 60% 45%, rgba(11,12,15,0) 50%, rgba(11,12,15,.55) 100%); }
.hs-doc__in { position: relative; z-index: 3; margin-top: calc(-1 * clamp(28px, 3vw, 48px)); }
.hs-doc__title { max-width: 19ch; margin-top: 22px; font-size: clamp(48px, 7.1vw, 128px); line-height: .86; }
.hs-doc__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 28px 64px; margin-top: clamp(28px, 3vw, 44px); }
.hs-doc__lead { max-width: 30em; color: rgba(236,234,228,.82); }
.hs-doc__act { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; }
.hs-doc__measure { display: flex; align-items: baseline; gap: 6px; margin-top: clamp(56px, 6vw, 96px); padding-top: 22px; border-top: 1px solid var(--line); font-family: var(--f-m); font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg3); }
.hs-doc__measure span { color: var(--au); }
@media (max-width: 900px) {
  .hs-doc__row { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .hs-doc__media { block-size: 430px; }
  .hs-doc__media > .hs-doc__img { object-position: 64% 40%; }
  .hs-doc__in { margin-top: -24px; }
  .hs-doc__title { font-size: clamp(42px, 12vw, 60px); }
}

/* ═════════════ Ortak bölüm ayarları ═════════════ */
.tpl-home .nw { white-space: nowrap; }
@media (max-width: 1100px) {
  .hs-intro__grid { grid-template-columns: 1fr; }
  .hs-stats { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .hs-stat .stat__n { font-size: clamp(42px, 12.5vw, 64px); }
  .hs-stats__row { column-gap: 14px; }
  .hs-stat .stat__l { font-size: 10.5px; letter-spacing: .1em; }
  .hs-intro__mark { inline-size: 90vw; inset-inline-end: -30vw; top: 20px; }
}

/* ═════════════ Arapça (harf aralığı / büyük harf / italik yok; satır yüksekliği artar) ═════════════ */
[lang="ar"] .hx__t { font-size: clamp(36px, 5.6vw, 96px); line-height: 1.24; max-width: 14ch; }
[lang="ar"] .hx__t .w { padding-block: .1em .2em; margin-block: -.1em -.2em; }
[lang="ar"] .hx__seg-name, [lang="ar"] .hx__scroll, [lang="ar"] .hs-stats__k, [lang="ar"] .hs-ctile__n, [lang="ar"] .hs-ctile__name,
[lang="ar"] .hs-ctile__go, [lang="ar"] .hs-flag__spec dt, [lang="ar"] .hs-call__k, [lang="ar"] .hs-flag__step, [lang="ar"] .hs-flag__cap,
[lang="ar"] .hs-tri__k-name, [lang="ar"] .hs-tri__name, [lang="ar"] .hs-tri__facts dt, [lang="ar"] .hs-tri__go, [lang="ar"] .hs-nij__zone span,
[lang="ar"] .hs-nij__card-k, [lang="ar"] .hs-nij__card-dl dt, [lang="ar"] .hs-nij__card-pk, [lang="ar"] .hs-doc__measure, [lang="ar"] .hs-proc__name, [lang="ar"] .hs-proc__kind {
  letter-spacing: 0 !important; text-transform: none !important; font-stretch: 100% !important;
}
[lang="ar"] .hx__seg-name, [lang="ar"] .hx__scroll, [lang="ar"] .hs-stats__k, [lang="ar"] .hs-ctile__n, [lang="ar"] .hs-flag__spec dt, [lang="ar"] .hs-call__k,
[lang="ar"] .hs-flag__step, [lang="ar"] .hs-tri__facts dt, [lang="ar"] .hs-nij__zone span, [lang="ar"] .hs-nij__card-k, [lang="ar"] .hs-nij__card-dl dt,
[lang="ar"] .hs-nij__card-pk, [lang="ar"] .hs-doc__measure { font-family: var(--f-d); font-weight: 600; font-size: 12.5px; }
[lang="ar"] .hs-ctile__name, [lang="ar"] .hs-tri__name { font-family: var(--f-d); line-height: 1.3; font-weight: 800; }
[lang="ar"] .hs-ctile__name { font-size: clamp(24px, 2vw, 34px); }
[lang="ar"] .hs-tri__k-name { font-family: var(--f-d); font-weight: 800; line-height: 1.15; font-size: clamp(56px, 5.6vw, 100px); }
[lang="ar"] .hs-intro__text { letter-spacing: 0; line-height: 1.6; font-size: clamp(19px, 1.7vw, 28px); }
[lang="ar"] .hs-doc__title { font-size: clamp(36px, 5.4vw, 92px); line-height: 1.22; }
[lang="ar"] .hs-intro__head .t-h2, [lang="ar"] .hs-flag__title { max-width: 14ch; }
[lang="ar"] .hs-call__v { font-family: var(--f-d); font-stretch: 100%; font-size: 17px; line-height: 1.35; }
[lang="ar"] .hs-proc__name { font-family: var(--f-d); font-weight: 700; }
[lang="ar"] .hs-nij__lvl, [lang="ar"] .hs-nij__j, [lang="ar"] .hs-nij__card-lvl, [lang="ar"] .hs-proc__no, [lang="ar"] .hx__cur, [lang="ar"] .hs-tri__facts dd { font-family: "Hubot Sans", "Hubot Fallback", Arial, sans-serif; }
@media (max-width: 760px) {
  [lang="ar"] .hx__t { font-size: clamp(30px, 8.6vw, 44px); line-height: 1.28; }
}
@media (orientation: landscape) and (max-height: 500px) {
  [lang="ar"] .hx__t { font-size: clamp(24px, 7.2vh, 34px); line-height: 1.3; }
}
@media (max-width: 760px) and (max-height: 720px) and (orientation: portrait) {
  [lang="ar"] .hx__t { font-size: clamp(28px, 8vw, 36px); max-width: 18ch; }
}

/* ═════════════ Azaltılmış hareket: geçişler anlık ═════════════ */
@media (prefers-reduced-motion: reduce) {
  .hs-tri__p, .hs-tri__bg, .hs-tri__img, .hs-tri__more, .hs-tri__plan-img, .hs-tri__k-name, .hs-tri__link::after, .hs-nij__fill, .hs-ctile__img, .hs-ctile::after,
  .hs-ctile__lead, .hs-call, .hs-call__dot, .hs-call__line, .hs-call__box, .hs-flag__poster, .hs-flag__poster--fb, .hs-rail__thumb, .hs-proc__node::before, .hx__slide, .hx__t, .hx__t .wi { transition: none !important; }
}

/* ═══════════ 8 · KURUMSAL GÜVEN (hs-trust) ═══════════ */
.hs-trust__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: clamp(28px, 4vw, 72px); align-items: center; }
.hs-trust__txt > * + * { margin-top: 20px; }
.hs-trust__txt .btn { margin-top: 32px; }
.hs-trust__fig { position: relative; margin: 0; aspect-ratio: 16 / 11; background: var(--k0); overflow: hidden; }
.hs-trust__scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(0deg, rgba(6,7,8,.82) 0%, rgba(6,7,8,.06) 42%, rgba(6,7,8,0) 70%); }
.hs-trust__cap { position: absolute; z-index: 2; inset-inline-start: 18px; inset-block-end: 14px; font-family: var(--f-m); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: rgba(236,234,228,.82); }
[lang="ar"] .hs-trust__cap { font-family: var(--f-d); letter-spacing: 0; text-transform: none; }
.hs-trust__cards { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 2vw, 28px); margin-top: clamp(40px, 5vw, 72px); }
.hs-trust__card { display: flex; flex-direction: column; background: var(--k2); --c: 16px; clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); }
[dir="rtl"] .hs-trust__card { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
.hs-trust__card-media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--k0); }
.hs-trust__card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--t3) var(--ease-out); }
.hs-trust__card:hover .hs-trust__card-media img { transform: scale(1.04); }
.hs-trust__card-body { display: flex; flex-direction: column; gap: 14px; padding: clamp(22px, 2.2vw, 32px); }
.hs-trust__card-body .t-h3 { max-width: 20ch; }
.hs-trust__card-body .link { margin-top: auto; }
@media (max-width: 980px) { .hs-trust__top { grid-template-columns: 1fr; } .hs-trust__fig { aspect-ratio: 16 / 9; } }
@media (max-width: 680px) { .hs-trust__cards { grid-template-columns: 1fr; } }

/* ═══════════ 9 · REFERANSLAR (hs-refs) ═══════════ */
.hs-refs__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 1.6vw, 22px); margin-top: clamp(32px, 4vw, 56px); }
.hs-refs__item { display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.hs-refs__chip { display: grid; place-items: center; width: 100%; aspect-ratio: 3 / 2; padding: clamp(14px, 1.6vw, 24px); background: var(--bone); --c: 12px; clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); transition: transform var(--t2) var(--ease-out); }
[dir="rtl"] .hs-refs__chip { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
.hs-refs__item:hover .hs-refs__chip { transform: translateY(-4px); }
.hs-refs__chip img { max-width: 100%; max-height: 92px; width: auto; height: auto; object-fit: contain; }
.hs-refs__name { font-family: var(--f-m); font-size: 11.5px; line-height: 1.35; letter-spacing: .08em; text-transform: uppercase; color: var(--fg2); max-width: 22ch; }
[lang="ar"] .hs-refs__name { font-family: var(--f-d); letter-spacing: 0; text-transform: none; font-size: 13px; }
.hs-refs__note { display: inline-flex; align-items: center; gap: 8px; margin-top: clamp(28px, 3vw, 44px); font-size: 13px; color: var(--fg3); }
.hs-refs__note .ico { color: var(--au); flex: none; }
@media (max-width: 760px) { .hs-refs__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 380px) { .hs-refs__grid { grid-template-columns: 1fr; } }

/* ═══════════ 9 · STANDARTLAR VE BELGELER (hs-std) — belge kartları ═══════════ */
.hs-std__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.4vw, 20px); margin-top: clamp(28px, 3.4vw, 48px); }
.hs-std__card { --c: 14px; display: flex; gap: clamp(14px, 1.2vw, 20px); padding: clamp(16px, 1.4vw, 22px); background: var(--k2); clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%); transition: background-color var(--t2) var(--ease); }
[dir="rtl"] .hs-std__card { clip-path: polygon(var(--c) 0, 100% 0, 100% 100%, 0 100%, 0 var(--c)); }
.hs-std__card:hover { background: var(--k3); }
.hs-std__sheet { position: relative; flex: none; width: clamp(66px, 6vw, 86px); align-self: flex-start; }
.hs-std__sheet .docsheet { width: 100%; height: auto; display: block; filter: drop-shadow(0 10px 16px rgba(0,0,0,.5)); transition: transform var(--t2) var(--ease-out); }
.hs-std__card:hover .docsheet { transform: translateY(-3px); }
.hs-std__badge { position: absolute; inset-block-end: -6px; inset-inline-start: 50%; transform: translateX(-50%); white-space: nowrap; background: var(--au); color: #0b0c0f; font-family: var(--f-m); font-size: 9px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 3px 7px; }
[dir="rtl"] .hs-std__badge { transform: translateX(50%); }
[lang="ar"] .hs-std__badge { font-family: var(--f-d); letter-spacing: 0; text-transform: none; font-size: 10px; }
.hs-std__body { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.hs-std__code { font-family: var(--f-d); font-stretch: 75%; font-weight: 800; font-size: clamp(18px, 1.5vw, 23px); line-height: 1; text-transform: uppercase; letter-spacing: .01em; color: #fff; }
.hs-std__code bdi { font-family: var(--f-d); font-stretch: 75%; }
.hs-std__scope { font-size: 13px; line-height: 1.45; color: var(--fg2); }
.hs-std__req { margin-top: auto; font-size: 11.5px; gap: 6px; padding-top: 4px; }
.hs-std__req .ico { color: var(--au); }
.hs-std__foot { display: flex; flex-wrap: wrap; gap: 14px; margin-top: clamp(28px, 3vw, 44px); }
@media (max-width: 1000px) { .hs-std__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .hs-std__grid { grid-template-columns: 1fr; } }

/* ═══════════════════ 10 · STANAG 4569 KORUMA SEVİYELERİ (hs-stg) ═══════════════════ */
.hs-stg .stg__plats{ display:flex; flex-wrap:wrap; gap:.5rem .6rem; margin:1.4rem 0 1.8rem; }
.stg__plat{ display:inline-flex; align-items:center; gap:.45rem; padding:.42rem .85rem; border:1px solid var(--line); border-radius:999px; background:var(--k2); font:600 .8rem/1 var(--f); color:var(--fg2); }
.stg__plat .ico{ width:18px; height:18px; color:var(--au); }

.stg__table{ border:1px solid var(--line); border-radius:4px; overflow:hidden; background:var(--k1); }
.stg__head, .stg__row{ display:grid; grid-template-columns:5.5rem minmax(11rem,1.15fr) minmax(13rem,1.5fr) 6.5rem minmax(13rem,1.6fr); }
.stg__head{ background:var(--k2); border-bottom:1px solid var(--line2); }
.stg__head span{ padding:.75rem .95rem; font:600 .7rem/1.25 var(--f-m); letter-spacing:.07em; text-transform:uppercase; color:var(--fg3); }
.stg__row{ border-top:1px solid var(--line); transition:background var(--t1) var(--ease); }
.stg__row:first-of-type{ border-top:0; }
.stg__row:hover{ background:var(--k2); }
.stg__c{ padding:1rem .95rem; display:flex; flex-direction:column; gap:.3rem; min-width:0; }
.stg__lbl{ display:none; font:600 .64rem/1 var(--f-m); letter-spacing:.06em; text-transform:uppercase; color:var(--fg3); }

.stg__badge{ display:inline-flex; align-items:center; justify-content:center; min-width:2.5rem; height:2.5rem; padding:0 .55rem; border:1px solid var(--au3); border-radius:3px; background:var(--au-a); color:var(--au); font:800 1.05rem/1 var(--f-d); }
.stg__thr{ font:600 .92rem/1.4 var(--f); color:var(--fg); }
.stg__dot{ color:var(--fg3); margin:0 .3rem; }
.stg__dv{ font:500 .8rem/1.3 var(--f-m); color:var(--fg2); }
.stg__name{ font:700 .95rem/1.3 var(--f); color:var(--fg); }
.stg__mat{ font:400 .82rem/1.45 var(--f); color:var(--fg2); }
.stg__c--aw{ justify-content:center; }
.stg__aw{ font:800 1.35rem/1 var(--f-d); color:var(--fg); white-space:nowrap; }
.stg__aw small{ font:600 .7rem/1 var(--f-m); color:var(--fg3); }

.stg__cfg{ display:flex; flex-direction:column; gap:.22rem; }
.stg__cfg li{ position:relative; padding-inline-start:.9rem; font:400 .82rem/1.4 var(--f); color:var(--fg2); }
.stg__cfg li::before{ content:""; position:absolute; inset-inline-start:0; top:.52em; width:4px; height:4px; background:var(--au3); border-radius:50%; }
.stg__stack{ display:flex; height:9px; margin-top:.6rem; border-radius:2px; overflow:hidden; box-shadow:0 0 0 1px var(--line) inset; }
.stg__seg{ flex:var(--f,1) 1 0; min-width:3px; }
.stg__seg--ceramic{ background:linear-gradient(180deg,#d4d7dc,#b4b8bf); }
.stg__seg--uhmwpe{ background:linear-gradient(180deg,#ede7d6,#d8d1bb); }
.stg__seg--steel{ background:linear-gradient(180deg,#6b7480,#454c56); }
.stg__seg--composite{ background:linear-gradient(180deg,#a7acb4,#878d96); }
.stg__seg:first-child{ box-shadow:inset 0 2px 0 var(--au); }
.stg__foot{ margin-top:.85rem; font:500 .76rem/1.4 var(--f-m); color:var(--fg3); }

.stg__feats{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:2.4rem; border:1px solid var(--line); background:var(--line); border-radius:4px; overflow:hidden; }
.stg__feat{ display:flex; flex-direction:column; gap:.55rem; padding:1.4rem 1.25rem; background:var(--k1); }
.stg__fico{ display:inline-flex; width:40px; height:40px; align-items:center; justify-content:center; border:1px solid var(--au3); border-radius:3px; background:var(--au-a); color:var(--au); }
.stg__fico .ico{ width:22px; height:22px; }
.stg__ft{ font:700 1rem/1.25 var(--f); color:var(--fg); }
.stg__fd{ font:400 .86rem/1.5 var(--f); color:var(--fg2); }

.stg__mats{ margin-top:2.2rem; }
.stg__mats-h{ font:600 .72rem/1 var(--f-m); letter-spacing:.1em; text-transform:uppercase; color:var(--fg3); margin:0 0 .9rem; }
.stg__mats-list{ display:flex; flex-wrap:wrap; gap:.6rem; }
.stg__chip{ display:inline-flex; align-items:center; gap:.55rem; padding:.45rem .42rem .45rem .85rem; border:1px solid var(--line2); border-radius:999px; background:var(--k2); }
.stg__chip-n{ font:600 .85rem/1 var(--f); color:var(--fg); }
.stg__chip-t{ font:600 .62rem/1 var(--f-m); letter-spacing:.04em; text-transform:uppercase; padding:.3rem .55rem; border-radius:999px; background:var(--k4); color:var(--fg3); }
.stg__chip.is-kg .stg__chip-t{ background:var(--au-a); color:var(--au); }

.stg__note{ display:flex; gap:.55rem; align-items:flex-start; margin-top:1.9rem; padding-top:1.3rem; border-top:1px solid var(--line); font:400 .84rem/1.55 var(--f); color:var(--fg2); max-width:70ch; }
.stg__note .ico{ flex:none; width:18px; height:18px; color:var(--fg3); margin-top:.15rem; }

@media (max-width:860px){
  .stg__head{ display:none; }
  .stg__row{ grid-template-columns:1fr 1fr; padding:.2rem 0 1rem; }
  .stg__c{ padding:.75rem .95rem .25rem; }
  .stg__lbl{ display:block; }
  .stg__c--lvl{ grid-column:1 / -1; flex-direction:row; align-items:center; gap:.7rem; padding-top:1rem; }
  .stg__c--sol, .stg__c--cfg{ grid-column:1 / -1; }
  .stg__c--aw{ justify-content:flex-start; }
  .stg__feats{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .stg__row{ grid-template-columns:1fr; }
  .stg__feats{ grid-template-columns:1fr; }
}

/* STANAG bölümü — platform sunum galerisi (deck görselleri) */
.stg__decks{ margin-top:clamp(2rem,3.5vw,2.8rem); }
.stg__decks-h{ font:600 .72rem/1 var(--f-m); letter-spacing:.1em; text-transform:uppercase; color:var(--fg3); margin:0 0 1rem; }
.stg__decks-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(.8rem,1.4vw,1.2rem); }
.stg__deck{ display:flex; flex-direction:column; gap:.55rem; }
.stg__deck-card{ display:block; border:1px solid var(--line); border-radius:4px; overflow:hidden; background:var(--k2); transition:border-color var(--t1) var(--ease), transform var(--t1) var(--ease); }
.stg__deck-card:hover{ border-color:var(--au3); transform:translateY(-2px); }
.stg__deck-img{ display:block; aspect-ratio:3 / 2; overflow:hidden; background:var(--k1); }
.stg__deck-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.stg__deck-cap{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.8rem 1rem; }
.stg__deck-n{ font:700 .95rem/1.2 var(--f); color:var(--fg); }
.stg__deck-cap .ico{ color:var(--au); flex:none; }
.stg__deck-full{ display:inline-flex; align-items:center; gap:.4rem; font:500 .78rem/1 var(--f-m); color:var(--fg3); text-decoration:none; align-self:flex-start; }
.stg__deck-full:hover{ color:var(--au); }
.stg__deck-full .ico{ width:15px; height:15px; }
@media (max-width:860px){ .stg__decks-list{ grid-template-columns:1fr; } }