/* ============================================================
   Boros Studio — stil
   Yön: brütalist + monolitik + occult + biyoteknolojik.
   Neredeyse siyah zemin; yeşil YALNIZ canlı/aktif olan şeyde; kırmızı
   yalnız yılanın gözlerinde. Görsel gürültü (ızgara, tarama çizgisi,
   tane, glitch) YOK — tuhaflığı yılan taşır.

   Yazı (kullanıcı seçti, 2026-09-22):
     başlık  Bricolage Grotesque — dar (%75), 600; kart başlıkları 500
     metin   Schibsted Grotesk
     etiket  Fragment Mono — YALNIZ küçük etiketlerde
   Büyük harf zorlaması ve geniş harf aralığı YOK: "ince serif + büyük harf
   + her yerde aralıklı mono" üçlüsü "AI fontu" gibi görünüyordu.
   Fontlar site/fonts/ içinde (SIL OFL, lisanslar yanında) — dışarıdan font
   çekilmez, CSP font-src 'self' yeter.
   Tek görünüm (koyu) bilinçli bir tercih: color-scheme: dark.
   ============================================================ */

/* ── Fontlar ───────────────────────────────────────────── */
/* Her aile iki dosya: latin (+ ı) ve latin-ext (ğ ş İ …) — Türkçe tam. */
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal; font-display: swap;
  font-weight: 200 800; font-stretch: 75% 100%;
  src: url("../fonts/bricolage-grotesque-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal; font-display: swap;
  font-weight: 200 800; font-stretch: 75% 100%;
  src: url("../fonts/bricolage-grotesque-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Schibsted Grotesk";
  font-style: normal; font-display: swap;
  font-weight: 400 900;
  src: url("../fonts/schibsted-grotesk-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Schibsted Grotesk";
  font-style: normal; font-display: swap;
  font-weight: 400 900;
  src: url("../fonts/schibsted-grotesk-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Fragment Mono";
  font-style: normal; font-display: swap;
  font-weight: 400;
  src: url("../fonts/fragment-mono-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Fragment Mono";
  font-style: normal; font-display: swap;
  font-weight: 400;
  src: url("../fonts/fragment-mono-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: dark;

  --bg: #030806;
  --yapi: #07130d;     /* yapı: kartlar, yer tutucular */
  --cizgi: rgba(150, 255, 190, 0.08);
  --cizgi-2: rgba(150, 255, 190, 0.16);
  --metin: #dde8e0;
  --soluk: #869a8e;
  --sonuk: #56685d;
  --zehir: #3cff8a;    /* canlı/aktif — seyrek */
  --derin: #0f7a45;    /* derin zümrüt — ışıma */
  --kukurt: #c4ff4a;   /* kükürt — uyarı, önizleme */
  --kan: #ff2d4a;      /* kan kırmızısı — YALNIZ yılanın gözleri */

  --baslik: "Bricolage Grotesque", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --yazi: "Schibsted Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
          Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: "Fragment Mono", ui-monospace, "Cascadia Code", "SF Mono", Consolas, monospace;

  /* Site artık "dar kule" değil: içerik geniş (kullanıcı, 2026-09-22) */
  --genislik: 1440px;
  --kenar: clamp(1.25rem, 4.5vw, 4rem);
}

/* ── Temel ─────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }

body {
  margin: 0;
  background: var(--bg);
  color: var(--metin);
  font-family: var(--yazi);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: inherit; }
::selection { background: color-mix(in srgb, var(--zehir) 30%, transparent); }

:focus-visible {
  outline: 1px solid var(--zehir);
  outline-offset: 4px;
  border-radius: 2px;
}

.skip {
  position: absolute; left: -999px; top: 0; z-index: 50;
  padding: .6rem 1rem; background: var(--zehir); color: var(--bg);
  font-family: var(--mono); font-size: .8rem;
}
.skip:focus { left: 0; }

/* Bölüm sigilleri: tanımlar görünmez, <use> ile çağrılır */
.sigil-kaynak { position: absolute; width: 0; height: 0; overflow: hidden; }
.sigil {
  width: 22px; height: 22px; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.1;
  stroke-linecap: round; stroke-linejoin: round;
}

/* Katman sırası (arkadan öne):
     0  .arka-plan    — köşe kararması (ışık yok: tek ışık kaynağı yılan)
     1  .yilan-3b     — WebGL: yılan + onun aydınlattığı sis ve spor tozu
     1  .kule-tuval   — 2B yedek (WebGL yoksa yılanın tamamı)
     2  içerik        — yazı her zaman yılanın ÜSTÜNDE
    15  kat göstergesi, 20 başlık çubuğu
   Kule levhası ve kenar ölçü çizgileri kaldırıldı (2026-09-22). */
/* 3B tuval SAYFAYA yerleşik: top/width/height'ı js/yilan-3b.js verir.
   Ekrana sabit olunca kaydırmanın gerisinde kalıp takılıyordu. */
.yilan-3b {
  position: absolute; left: 0; top: 0; z-index: 1;
  width: 100%; height: 100vh;
  pointer-events: none;
}
.kule-tuval {
  position: fixed; inset: 0; z-index: 1;
  pointer-events: none;
}

main, .site-head, .site-foot {
  position: relative; z-index: 2;
  width: 100%;
  max-width: var(--genislik);
  margin-inline: auto;
  padding-inline: var(--kenar);
}

/* ── Arka plan: karanlık ───────────────────────────────── */
/* Sabit ışık lekesi YOK: sahnenin tek ışığı yılan; onun aydınlattığı sis ve
   spor tozunu js/yilan-3b.js çizer. Burada yalnız köşe kararması. */
.arka-plan {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(120% 90% at 50% 40%, transparent 55%, rgba(0, 0, 0, .7));
}

/* Yılanın üstünden geçen yazı zeminden ayrılsın */
.hero h1, .hero-yazi, .hero-imza, h2, .hakkinda-govde p, .baglantilar a {
  text-shadow: 0 2px 16px rgba(2, 6, 4, .95), 0 0 2px rgba(2, 6, 4, .9);
}

/* ── Başlık çubuğu ─────────────────────────────────────── */
.site-head {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: clamp(1rem, 4vw, 3.5rem);
  padding-block: 1rem;
  /* backdrop-filter YOK: altında sürekli hareket eden tuval varken tarayıcı
     bulanıklığı her karede yeniden hesaplar — kare hızını düşürüyordu. */
  background: rgba(3, 8, 6, .92);
  border-bottom: 1px solid var(--cizgi);
}

.brand { display: inline-flex; align-items: center; gap: .75rem; text-decoration: none; }
.mark { width: 30px; height: 30px; color: var(--metin); flex: none; }
.mark-bas {
  fill: var(--zehir);
  filter: drop-shadow(0 0 4px color-mix(in srgb, var(--zehir) 60%, transparent));
}
.wordmark {
  display: inline-flex; align-items: baseline; gap: .45rem; line-height: 1;
  font-family: var(--baslik); font-weight: 600; font-stretch: 75%;
  font-size: 1.35rem; letter-spacing: .02em;
}
.wordmark-sub {
  font-family: var(--mono); font-weight: 400; font-stretch: normal;
  font-size: .72rem; letter-spacing: .02em;
  color: var(--soluk);
}

.site-nav { display: flex; gap: clamp(1rem, 3vw, 2.2rem); }
.site-nav a {
  padding-block: .3rem;
  font-family: var(--yazi); font-size: .92rem; font-weight: 500;
  text-decoration: none; color: var(--soluk);
  border-bottom: 1px solid transparent;
  transition: color .2s, border-color .2s;
}
.site-nav a:hover { color: var(--metin); }
.site-nav a[aria-current] { color: var(--zehir); border-color: var(--zehir); }

.head-sag {
  margin-left: auto;
  display: flex; align-items: center; gap: clamp(.8rem, 2vw, 1.6rem);
}
.head-meta {
  margin: 0;
  font-family: var(--mono); font-size: .72rem; color: var(--sonuk);
}

/* Dil: açılış İngilizce, seçim tarayıcıda hatırlanır (js/dil.js) */
.dil-secici { display: flex; align-items: center; gap: .5rem; }
.dil-secici button {
  padding: .2rem 0;
  font-family: var(--mono); font-size: .75rem;
  background: none; color: var(--sonuk);
  border: 0; border-bottom: 1px solid transparent;
  cursor: pointer;
  transition: color .2s, border-color .2s;
}
.dil-secici button:hover { color: var(--metin); }
.dil-secici button[aria-pressed="true"] { color: var(--zehir); border-color: var(--zehir); }

/* ── Kat göstergesi (yalnız çok geniş ekran) ───────────── */
/* İçerik 1440 px'e genişledi; ölçek ve dizin yan boşlukta yaşar, yalnız
   içerikle çakışmayacak kadar yer olunca görünür. */
.ray, .kat-dizin { display: none; }

@media (min-width: 1760px) {
  /* Sol: binanın ölçeği. İmleç sayfadaki derinliği gösterir. */
  .ray {
    display: block;
    position: fixed; z-index: 15; left: 30px; top: 110px; bottom: 80px;
    width: 90px; pointer-events: none;
  }
  .ray-oku { margin: 0; font-family: var(--mono); }
  .ray-kat { display: block; font-size: .72rem; color: var(--zehir); }
  .ray-ad { display: block; margin-top: .2rem; font-size: .68rem; color: var(--sonuk); }
  .ray-cizgi {
    position: absolute; left: 0; top: 64px; bottom: 0; width: 12px;
    background:
      linear-gradient(var(--cizgi-2), var(--cizgi-2)) 0 0 / 1px 100% no-repeat,
      repeating-linear-gradient(var(--cizgi-2) 0 1px, transparent 1px 24px) 0 0 / 5px 100% no-repeat,
      repeating-linear-gradient(var(--cizgi-2) 0 1px, transparent 1px 120px) 0 0 / 12px 100% no-repeat;
  }
  .ray-imlec {
    position: absolute; left: -3px;
    top: calc(var(--ilerleme, 0) * (100% - 7px));
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--zehir);
    box-shadow: 0 0 10px color-mix(in srgb, var(--zehir) 70%, transparent);
    transition: top .15s linear;
  }

  /* Sağ: asansör paneli gibi kat dizini */
  .kat-dizin {
    display: block;
    position: fixed; z-index: 15; right: 30px; top: 50%;
    transform: translateY(-50%);
  }
  .kat-dizin ol {
    list-style: none; margin: 0; padding: .2rem 0 .2rem 1.1rem;
    display: grid; gap: 1.1rem;
    border-left: 1px solid var(--cizgi-2);
  }
  .kat-dizin a {
    position: relative; display: flex; gap: .8rem;
    font-family: var(--yazi); font-size: .85rem;
    text-decoration: none; color: var(--sonuk);
    transition: color .2s;
  }
  .kat-dizin .kd-no { font-family: var(--mono); font-size: .72rem; padding-top: .1rem; }
  .kat-dizin a::before {
    content: ""; position: absolute; left: calc(-1.1rem - 3px); top: 50%;
    width: 5px; height: 5px; margin-top: -2.5px; border-radius: 50%;
    background: var(--zehir); opacity: 0;
    box-shadow: 0 0 8px var(--zehir);
    transition: opacity .2s;
  }
  .kat-dizin a:hover { color: var(--metin); }
  .kat-dizin a[aria-current] { color: var(--metin); }
  .kat-dizin a[aria-current] .kd-no { color: var(--zehir); }
  .kat-dizin a[aria-current]::before { opacity: 1; }
}

/* ── Giriş ─────────────────────────────────────────────── */
.hero {
  position: relative;
  min-height: min(92vh, 900px);
  display: flex; align-items: center;
  padding-block: clamp(4rem, 10vw, 7rem);
}
.hero-metin { max-width: 820px; }

.eyebrow {
  display: flex; align-items: center; gap: .8rem;
  margin: 0 0 1.8rem;
  font-family: var(--mono); font-size: .8rem;
  color: var(--soluk);
}
.eyebrow::before { content: ""; width: 28px; height: 1px; background: var(--zehir); flex: none; }

.hero h1 {
  margin: 0;
  font-family: var(--baslik); font-weight: 600; font-stretch: 75%;
  font-size: clamp(2.8rem, 6.8vw, 5.8rem);
  line-height: .96;
  letter-spacing: -.02em;
  text-wrap: balance;
}
.parla { color: color-mix(in srgb, var(--zehir) 72%, var(--metin)); }

.hero-yazi {
  margin: 1.8rem 0 0; max-width: 46ch;
  font-size: 1.12rem; line-height: 1.65;
  color: var(--soluk);
}

.hero-imza {
  display: flex; align-items: center; gap: .8rem;
  margin: 1.4rem 0 0;
  font-size: .95rem; color: var(--soluk);
}
.imza-cizgi { width: 28px; height: 1px; background: var(--cizgi-2); }
.imza-ad { color: var(--metin); font-weight: 500; }

.cta {
  display: inline-flex; align-items: center; gap: .8rem;
  margin-top: 2.4rem; padding-block: .4rem;
  font-size: 1rem; font-weight: 500;
  text-decoration: none; color: var(--zehir);
}
.cta::before {
  content: ""; width: 28px; height: 1px; background: currentColor;
  transition: width .3s ease;
}
.cta:hover::before { width: 48px; }

/* ── Bölüm başlıkları ──────────────────────────────────── */
section { scroll-margin-top: 5rem; }

h2 {
  display: flex; align-items: center; gap: .9rem;
  margin: 0;
  font-family: var(--baslik); font-weight: 600; font-stretch: 75%;
  font-size: clamp(2.1rem, 4.2vw, 3.2rem);
  line-height: 1; letter-spacing: -.015em;
}
h2 .sigil { color: var(--derin); width: 26px; height: 26px; }
.bolum-no {
  font-family: var(--mono); font-size: .8rem; font-weight: 400; font-stretch: normal;
  letter-spacing: 0; color: var(--zehir);
}

.bolum-baslik {
  display: flex; flex-wrap: wrap; align-items: flex-end;
  justify-content: space-between; gap: 1rem;
  padding-bottom: 1.3rem; margin-bottom: 2rem;
  border-bottom: 1px solid var(--cizgi);
}

/* ── Filtre ────────────────────────────────────────────── */
.filtre { display: flex; gap: 1.4rem; flex-wrap: wrap; }
.filtre button {
  padding: .35rem 0;
  font-family: var(--yazi); font-size: .92rem; font-weight: 500;
  background: none; color: var(--sonuk);
  border: 0; border-bottom: 1px solid transparent;
  cursor: pointer;
  transition: color .2s, border-color .2s;
}
.filtre button:hover { color: var(--metin); }
.filtre button[aria-pressed="true"] { color: var(--zehir); border-color: var(--zehir); }

.onizleme-notu {
  margin: -0.6rem 0 1.6rem;
  padding: .7rem 1rem;
  border: 1px dashed color-mix(in srgb, var(--kukurt) 55%, transparent);
  border-radius: 2px;
  font-size: .9rem; color: var(--soluk);
}
.onizleme-notu code { font-family: var(--mono); color: var(--kukurt); }

/* ── İş ızgarası ───────────────────────────────────────── */
.izgara {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  gap: clamp(1rem, 2vw, 1.25rem);
}

.kart {
  position: relative;
  display: flex; flex-direction: column; height: 100%;
  /* Koyu cam: arkadan geçen yılan sezilsin, yazı net kalsın.
     backdrop-filter YOK — hareketli tuval üstünde kare hızını düşürüyordu. */
  background: rgba(4, 10, 7, 0.88);
  border: 1px solid var(--cizgi);
  border-radius: 2px;
  text-decoration: none;
  transition: border-color .3s;
}
.kart:hover { border-color: color-mix(in srgb, var(--zehir) 35%, var(--cizgi)); }

.kart-medya {
  position: relative; aspect-ratio: 16 / 10;
  background: var(--yapi); overflow: hidden;
  border-bottom: 1px solid var(--cizgi);
}
.kart-medya img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .8s ease;
}
.kart:hover .kart-medya img { transform: scale(1.03); }

/* Görselsiz iş: teknik çizim gibi sessiz bir levha */
.yer-tutucu {
  position: absolute; inset: 0;
  display: grid; place-items: center;
  background:
    linear-gradient(var(--cizgi), var(--cizgi)) center / 1px 100% no-repeat,
    linear-gradient(var(--cizgi), var(--cizgi)) center / 100% 1px no-repeat,
    radial-gradient(circle at center, transparent 0 33%, var(--cizgi-2) 33% calc(33% + 1px), transparent calc(33% + 1px)),
    radial-gradient(70% 90% at 50% 115%, rgba(15, 122, 69, .2), transparent 70%),
    var(--yapi);
}
.yer-tutucu span {
  padding: .3rem .6rem;
  font-family: var(--mono); font-size: .72rem; color: var(--soluk);
  background: var(--yapi);
  border: 1px solid var(--cizgi-2);
}

.ornek-rozet {
  position: absolute; top: .7rem; left: .7rem;
  padding: .2rem .5rem;
  font-family: var(--mono); font-size: .7rem;
  color: var(--kukurt);
  background: rgba(3, 8, 6, .85);
  border: 1px solid color-mix(in srgb, var(--kukurt) 50%, transparent);
}

.kart-govde {
  display: flex; flex-direction: column; gap: .55rem; flex: 1;
  padding: 1.2rem 1.25rem 1.3rem;
}
.kart-ust {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: .72rem; color: var(--sonuk);
}
.kart-kat { color: var(--zehir); }
.kart h3 {
  margin: .1rem 0 0;
  font-family: var(--baslik); font-weight: 500; font-stretch: 78%;
  font-size: 1.65rem; line-height: 1.05; letter-spacing: -.01em;
  color: var(--metin);
}
.kart h3 .dis { color: var(--zehir); margin-left: .35rem; font-size: 1.1rem; }
.kart p { margin: 0; font-size: .95rem; line-height: 1.6; color: var(--soluk); }

.etiketler {
  list-style: none; margin: auto 0 0; padding: .6rem 0 0;
  display: flex; flex-wrap: wrap; gap: .35rem;
}
.etiketler li {
  padding: .14rem .45rem;
  font-family: var(--mono); font-size: .7rem;
  color: var(--sonuk);
  border: 1px solid var(--cizgi);
}

/* ── Boş durum ─────────────────────────────────────────── */
.bos {
  padding: clamp(3.5rem, 11vw, 6.5rem) 0; text-align: center;
  border: 1px dashed var(--cizgi-2);
  background: rgba(4, 10, 7, .6);
}
.bos-baslik {
  margin: 0;
  font-family: var(--baslik); font-weight: 600; font-stretch: 75%;
  font-size: 2.6rem; letter-spacing: -.015em;
}
.bos-alt { margin: .5rem 0 0; font-size: .95rem; color: var(--soluk); }

/* ── Hakkında / İletişim ───────────────────────────────── */
.isler, .hakkinda, .iletisim { padding-block: clamp(3rem, 8vw, 5.5rem); }

.hakkinda, .iletisim {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr);
  gap: 2rem;
  border-top: 1px solid var(--cizgi);
}
.hakkinda h2, .iletisim h2 { align-self: start; }
.hakkinda-govde p { margin: 0 0 1.1rem; max-width: 62ch; font-size: 1.12rem; line-height: 1.7; }
.hakkinda-govde .soluk-p { color: var(--soluk); font-size: 1rem; }

.baglantilar { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.baglantilar a {
  font-family: var(--baslik); font-weight: 500; font-stretch: 78%;
  font-size: clamp(1.7rem, 3.8vw, 2.8rem); letter-spacing: -.01em;
  text-decoration: none;
  background-image: linear-gradient(var(--zehir), var(--zehir));
  background-size: 0% 1px; background-position: 0 100%; background-repeat: no-repeat;
  padding-bottom: 4px;
  transition: background-size .35s ease, color .2s;
}
.baglantilar a:hover { background-size: 100% 1px; color: #fff; }

@media (max-width: 720px) {
  .hakkinda, .iletisim { grid-template-columns: 1fr; gap: 1.2rem; }
  .head-meta { display: none; }        /* dar ekranda yalnız dil düğmesi kalır */
}

/* ── Alt bilgi ─────────────────────────────────────────── */
.site-foot {
  display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  padding-block: 2.2rem 2.8rem;
  border-top: 1px solid var(--cizgi);
  font-family: var(--mono); font-size: .75rem; color: var(--sonuk);
}
.site-foot p { margin: 0; }

/* ── ?fps ölçer (yalnız sorun ayıklamada, js/serbest-yilan.js ekler) ── */
.fps-olcer {
  position: fixed; left: 12px; bottom: 12px; z-index: 30;
  padding: .3rem .6rem;
  font-family: var(--mono); font-size: .75rem; color: var(--zehir);
  background: rgba(0, 0, 0, .75);
  border: 1px solid var(--cizgi-2);
  pointer-events: none;
}

/* ── Hareket azaltma ───────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}