@layer temel, duzen, bilesen, uyum;

@layer temel {
  :root {
    --alm-zemin: #f4f4ef;
    --alm-yuzey: #ffffff;
    --alm-yuzey-alt: #eceadf;
    --alm-cizgi: #d9d7cb;
    --alm-cizgi-koyu: #bfbcab;
    --alm-murekkep: #1a1418;
    --alm-murekkep-yumusak: #5c545f;
    --alm-sarap: #8c1d3f;
    --alm-sarap-koyu: #6d1531;
    --alm-sarap-dip: #2a0e1a;
    --alm-okra: #c8871a;
    --alm-okra-metin: #8a5a00;
    --alm-dip-metin: #f4f0ea;
    --alm-dip-yumusak: #c9bdc4;
    --alm-serif: "Newsreader", Georgia, "Times New Roman", serif;
    --alm-gorsel-yazi: "Schibsted Grotesk", "Segoe UI", Arial, sans-serif;
    --alm-ara-1: 6px;
    --alm-ara-2: 14px;
    --alm-ara-3: 24px;
    --alm-ara-4: 40px;
    --alm-ara-5: 64px;
    --alm-ara-6: 92px;
    --alm-yuvarlak: 2px;
    --alm-hiz: 180ms ease-out;
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  html {
    background: var(--alm-zemin);
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
  }

  body {
    margin: 0;
    background: var(--alm-zemin);
    color: var(--alm-murekkep);
    font-family: var(--alm-gorsel-yazi);
    font-size: 17px;
    line-height: 1.72;
    overflow-x: hidden;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin: 0;
    font-family: var(--alm-serif);
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: -0.005em;
  }

  p,
  ul,
  ol,
  dl,
  figure,
  table {
    margin: 0;
  }

  a {
    color: var(--alm-sarap);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color var(--alm-hiz);
  }

  a:hover,
  a:focus-visible {
    color: var(--alm-okra-metin);
  }

  img {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
  }

  button {
    font: inherit;
    cursor: pointer;
  }

  a:focus-visible,
  button:focus-visible,
  [tabindex]:focus-visible {
    outline: 3px solid var(--alm-sarap);
    outline-offset: 2px;
  }

  ::selection {
    background: var(--alm-okra);
    color: var(--alm-murekkep);
  }
}

@layer duzen {
  .alm-sinir {
    inline-size: min(1200px, 100% - 40px);
    margin-inline: auto;
  }

  .alm-sakli {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
  }

  .alm-atlama {
    position: absolute;
    inset-inline-start: -999px;
    inset-block-start: 0;
    z-index: 90;
    background: var(--alm-sarap);
    color: #ffffff;
    font-size: 14px;
    padding-block: 12px;
    padding-inline: 22px;
  }

  .alm-atlama:focus {
    inset-inline-start: 0;
    color: #ffffff;
  }

  .alm-kesim {
    padding-block: var(--alm-ara-6);
    border-block-start: 1px solid var(--alm-cizgi);
  }

  .alm-kesim-beyaz {
    background: var(--alm-yuzey);
  }

  .alm-kesim-kum {
    background: var(--alm-yuzey-alt);
  }

  .alm-kesim-dar {
    padding-block: var(--alm-ara-5);
  }

  .alm-izgara {
    display: grid;
    gap: var(--alm-ara-3);
    grid-template-columns: 1fr;
  }

  .alm-izgara > * {
    min-inline-size: 0;
  }

  .alm-govde-sabit {
    overflow: hidden;
  }
}

@layer bilesen {
  .alm-tepe {
    position: sticky;
    inset-block-start: 0;
    z-index: 40;
    background: rgba(244, 244, 239, 0.95);
    backdrop-filter: blur(6px);
    border-block-end: 1px solid var(--alm-cizgi);
  }

  .alm-tepe-ic {
    display: flex;
    align-items: center;
    gap: var(--alm-ara-3);
    min-block-size: 72px;
  }

  .alm-marka {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    text-decoration: none;
    color: var(--alm-murekkep);
  }

  .alm-marka:hover,
  .alm-marka:focus-visible {
    color: var(--alm-murekkep);
  }

  .alm-marka-gorsel {
    display: block;
    inline-size: auto;
    max-inline-size: 100%;
    block-size: clamp(34px, 5vw, 48px);
  }

  .alm-ust-menu {
    display: none;
  }

  .alm-ust-menu ul {
    display: flex;
    align-items: center;
    gap: var(--alm-ara-3);
    list-style: none;
    padding: 0;
  }

  .alm-ust-bag {
    display: inline-block;
    color: var(--alm-murekkep);
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    padding-block: 6px;
    white-space: nowrap;
    border-block-end: 2px solid transparent;
  }

  .alm-ust-bag:hover,
  .alm-ust-bag:focus-visible {
    color: var(--alm-sarap);
    border-block-end-color: var(--alm-cizgi-koyu);
  }

  .alm-ust-bag-etkin {
    color: var(--alm-sarap);
    border-block-end-color: var(--alm-sarap);
  }

  .alm-panel-tus {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-inline-start: auto;
    background: transparent;
    border: 1px solid var(--alm-cizgi-koyu);
    border-radius: var(--alm-yuvarlak);
    color: var(--alm-murekkep);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding-block: 10px;
    padding-inline: 15px;
    transition: border-color var(--alm-hiz), color var(--alm-hiz);
  }

  .alm-panel-tus:hover {
    border-color: var(--alm-sarap);
    color: var(--alm-sarap);
  }

  .alm-panel-yazi {
    white-space: nowrap;
  }

  .alm-panel-cizgi {
    position: relative;
    inline-size: 18px;
    block-size: 2px;
    background: currentColor;
    display: inline-block;
  }

  .alm-panel-cizgi::before,
  .alm-panel-cizgi::after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inline-size: 18px;
    block-size: 2px;
    background: currentColor;
    transition: transform var(--alm-hiz);
  }

  .alm-panel-cizgi::before {
    inset-block-start: -6px;
  }

  .alm-panel-cizgi::after {
    inset-block-start: 6px;
  }

  .alm-panel-tus[aria-expanded="true"] .alm-panel-cizgi {
    background: transparent;
  }

  .alm-panel-tus[aria-expanded="true"] .alm-panel-cizgi::before {
    transform: translateY(6px) rotate(45deg);
  }

  .alm-panel-tus[aria-expanded="true"] .alm-panel-cizgi::after {
    transform: translateY(-6px) rotate(-45deg);
  }

  .alm-panel {
    background: var(--alm-yuzey);
    border-block-start: 1px solid var(--alm-cizgi);
    border-block-end: 3px solid var(--alm-sarap);
    max-block-size: 78vh;
    overflow-y: auto;
  }

  .alm-panel-ic {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--alm-ara-3);
    padding-block: var(--alm-ara-4);
  }

  .alm-panel-kume {
    min-inline-size: 0;
  }

  .alm-panel-baslik {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--alm-okra-metin);
    padding-block-end: 10px;
    border-block-end: 1px solid var(--alm-cizgi);
    margin-block-end: 12px;
  }

  .alm-panel-kume ul {
    list-style: none;
    padding: 0;
    display: grid;
    gap: 2px;
  }

  .alm-panel-kume a {
    display: block;
    color: var(--alm-murekkep);
    text-decoration: none;
    font-size: 15px;
    padding-block: 7px;
  }

  .alm-panel-kume a:hover,
  .alm-panel-kume a:focus-visible {
    color: var(--alm-sarap);
    text-decoration: underline;
  }

  .alm-panel-kume a[aria-current="page"] {
    color: var(--alm-sarap);
    font-weight: 700;
  }

  .alm-yol {
    padding-block-start: var(--alm-ara-3);
  }

  .alm-yol ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    list-style: none;
    padding: 0;
    font-size: 13px;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-yol li + li::before {
    content: "\203a";
    margin-inline-end: 7px;
    color: var(--alm-cizgi-koyu);
  }

  .alm-yol a {
    color: var(--alm-murekkep-yumusak);
    text-decoration: none;
  }

  .alm-yol a:hover {
    color: var(--alm-sarap);
  }

  .alm-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--alm-okra-metin);
    margin-block-end: var(--alm-ara-2);
  }

  .alm-eyebrow::before {
    content: "";
    inline-size: 26px;
    block-size: 2px;
    background: var(--alm-okra);
    flex: 0 0 auto;
  }

  .alm-giris-blok {
    padding-block: var(--alm-ara-4) var(--alm-ara-3);
  }

  .alm-ana-baslik {
    font-size: clamp(31px, 5.2vw, 55px);
    max-inline-size: 19ch;
    letter-spacing: -0.018em;
  }

  .alm-ana-baslik-genis {
    max-inline-size: 25ch;
  }

  .alm-ozet {
    margin-block-start: var(--alm-ara-3);
    max-inline-size: 62ch;
    font-size: 19px;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-imza {
    display: flex;
    flex-wrap: wrap;
    gap: var(--alm-ara-3);
    list-style: none;
    padding: 0;
    margin-block-start: var(--alm-ara-3);
    padding-block-start: var(--alm-ara-2);
    border-block-start: 1px solid var(--alm-cizgi);
    font-size: 13px;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-imza li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }

  .alm-imza i {
    color: var(--alm-sarap);
  }

  .alm-baslik-blok {
    max-inline-size: 66ch;
    margin-block-end: var(--alm-ara-4);
  }

  .alm-bolum-baslik {
    font-size: clamp(25px, 3.4vw, 37px);
  }

  .alm-bolum-alt {
    margin-block-start: var(--alm-ara-2);
    color: var(--alm-murekkep-yumusak);
  }

  .alm-yazi {
    max-inline-size: 70ch;
  }

  .alm-yazi > * + * {
    margin-block-start: var(--alm-ara-2);
  }

  .alm-yazi h2 {
    font-size: clamp(23px, 3vw, 31px);
    margin-block-start: var(--alm-ara-4);
  }

  .alm-yazi h3 {
    font-size: 21px;
    margin-block-start: var(--alm-ara-3);
    color: var(--alm-sarap);
  }

  .alm-yazi h4 {
    font-size: 18px;
    margin-block-start: var(--alm-ara-3);
  }

  .alm-yazi ul,
  .alm-yazi ol {
    padding-inline-start: 20px;
    display: grid;
    gap: 9px;
  }

  .alm-yazi li::marker {
    color: var(--alm-okra-metin);
  }

  .alm-kapak {
    inline-size: 100%;
    aspect-ratio: 20 / 9;
    object-fit: cover;
    border: 1px solid var(--alm-cizgi);
  }

  .alm-gorsel {
    inline-size: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    border: 1px solid var(--alm-cizgi);
  }

  .alm-serit-gorsel {
    inline-size: 100%;
    aspect-ratio: 8 / 3;
    object-fit: cover;
    border: 1px solid var(--alm-cizgi);
  }

  .alm-cizelge {
    position: relative;
    padding-inline-start: 30px;
    list-style: none;
    margin: 0;
  }

  .alm-cizelge::before {
    content: "";
    position: absolute;
    inset-block: 10px;
    inset-inline-start: 5px;
    inline-size: 2px;
    background: var(--alm-cizgi);
  }

  .alm-cizelge-adim {
    position: relative;
    padding-block: var(--alm-ara-3);
    border-block-end: 1px solid var(--alm-cizgi);
  }

  .alm-cizelge-adim:last-child {
    border-block-end: 0;
  }

  .alm-cizelge-adim::before {
    content: "";
    position: absolute;
    inset-block-start: 34px;
    inset-inline-start: -30px;
    inline-size: 12px;
    block-size: 12px;
    border-radius: 50%;
    background: var(--alm-zemin);
    border: 2px solid var(--alm-sarap);
  }

  .alm-cizelge-gun {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--alm-sarap);
  }

  .alm-cizelge-ad {
    font-size: 23px;
    margin-block-start: 8px;
  }

  .alm-cizelge-metin {
    margin-block-start: 10px;
    color: var(--alm-murekkep-yumusak);
    max-inline-size: 68ch;
  }

  .alm-oyun {
    background: var(--alm-yuzey);
    border: 1px solid var(--alm-cizgi);
    display: flex;
    flex-direction: column;
    transition: border-color var(--alm-hiz);
  }

  .alm-oyun:hover {
    border-color: var(--alm-sarap);
  }

  .alm-oyun-gorsel {
    inline-size: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-block-end: 1px solid var(--alm-cizgi);
  }

  .alm-oyun-govde {
    padding: var(--alm-ara-3);
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1 1 auto;
  }

  .alm-oyun-tur {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--alm-okra-metin);
  }

  .alm-oyun-ad {
    font-size: 23px;
  }

  .alm-oyun-ozet {
    color: var(--alm-murekkep-yumusak);
    font-size: 16px;
  }

  .alm-oyun-kunye {
    margin-block-start: auto;
    padding-block-start: 13px;
    border-block-start: 1px solid var(--alm-cizgi);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 14px;
    font-size: 13px;
  }

  .alm-oyun-kunye dt {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-oyun-kunye dd {
    margin: 0;
  }

  .alm-kutu {
    background: var(--alm-yuzey);
    border: 1px solid var(--alm-cizgi);
    padding: var(--alm-ara-3);
    display: flex;
    flex-direction: column;
    gap: 11px;
  }

  .alm-kutu i {
    font-size: 22px;
    color: var(--alm-sarap);
  }

  .alm-kutu-etiket {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--alm-okra-metin);
  }

  .alm-kutu-ad {
    font-size: 21px;
  }

  .alm-kutu-ad a {
    color: var(--alm-murekkep);
    text-decoration: none;
  }

  .alm-kutu-ad a:hover,
  .alm-kutu-ad a:focus-visible {
    color: var(--alm-sarap);
  }

  .alm-kutu-metin {
    color: var(--alm-murekkep-yumusak);
  }

  .alm-tip {
    background: var(--alm-yuzey);
    border: 1px solid var(--alm-cizgi);
    border-inline-start: 4px solid var(--alm-okra);
    padding: var(--alm-ara-3);
    display: flex;
    flex-direction: column;
    gap: 11px;
  }

  .alm-tip-basi {
    display: flex;
    align-items: center;
    gap: 13px;
  }

  .alm-tip-basi i {
    font-size: 20px;
    color: var(--alm-sarap);
    flex: 0 0 auto;
  }

  .alm-tip-ad {
    font-size: 21px;
  }

  .alm-tip-sezon {
    font-weight: 700;
    color: var(--alm-sarap);
  }

  .alm-tip-metin,
  .alm-tip-ayrinti {
    color: var(--alm-murekkep-yumusak);
  }

  .alm-tip-ayrinti {
    padding-block-start: 12px;
    border-block-start: 1px dashed var(--alm-cizgi-koyu);
    font-size: 16px;
  }

  .alm-rozet {
    display: inline-block;
    background: var(--alm-okra);
    color: var(--alm-murekkep);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding-block: 4px;
    padding-inline: 11px;
  }

  .alm-uyari {
    display: flex;
    gap: var(--alm-ara-2);
    background: var(--alm-yuzey-alt);
    border-inline-start: 4px solid var(--alm-sarap);
    padding: var(--alm-ara-3);
    margin-block-start: var(--alm-ara-3);
  }

  .alm-uyari i {
    color: var(--alm-sarap);
    font-size: 19px;
    flex: 0 0 auto;
    padding-block-start: 4px;
  }

  .alm-uyari-govde {
    min-inline-size: 0;
  }

  .alm-uyari-govde h3 {
    font-size: 18px;
    margin-block-end: 6px;
  }

  .alm-uyari-govde p {
    color: var(--alm-murekkep-yumusak);
  }

  .alm-tablo-sarma {
    overflow-x: auto;
    border: 1px solid var(--alm-cizgi);
    background: var(--alm-yuzey);
  }

  .alm-tablo {
    inline-size: 100%;
    border-collapse: collapse;
    min-inline-size: 560px;
  }

  .alm-tablo th,
  .alm-tablo td {
    text-align: start;
    vertical-align: top;
    padding-block: 14px;
    padding-inline: 18px;
    border-block-end: 1px solid var(--alm-cizgi);
    font-size: 16px;
  }

  .alm-tablo thead th {
    background: var(--alm-yuzey-alt);
    font-family: var(--alm-gorsel-yazi);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--alm-okra-metin);
  }

  .alm-tablo tbody tr:last-child td {
    border-block-end: 0;
  }

  .alm-sekme-serit {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border: 1px solid var(--alm-cizgi-koyu);
    margin-block-end: var(--alm-ara-4);
    background: var(--alm-yuzey);
  }

  .alm-sekme-tus {
    flex: 1 1 auto;
    background: transparent;
    border: 0;
    border-inline-end: 1px solid var(--alm-cizgi);
    color: var(--alm-murekkep);
    font-size: 14px;
    font-weight: 500;
    padding-block: 13px;
    padding-inline: 16px;
    transition: background var(--alm-hiz), color var(--alm-hiz);
  }

  .alm-sekme-tus:last-child {
    border-inline-end: 0;
  }

  .alm-sekme-tus:hover {
    background: var(--alm-yuzey-alt);
  }

  .alm-sekme-tus[aria-selected="true"] {
    background: var(--alm-sarap);
    color: #ffffff;
    font-weight: 700;
  }

  .alm-sekme-panel[hidden] {
    display: none;
  }

  .alm-tus-dizi {
    display: flex;
    flex-wrap: wrap;
    gap: var(--alm-ara-2);
    margin-block-start: var(--alm-ara-3);
  }

  .alm-tus {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    padding-block: 13px;
    padding-inline: 24px;
    border: 1px solid transparent;
    border-radius: var(--alm-yuvarlak);
    transition: background var(--alm-hiz), color var(--alm-hiz), border-color var(--alm-hiz);
  }

  .alm-tus-dolu {
    background: var(--alm-sarap);
    color: #ffffff;
  }

  .alm-tus-dolu:hover,
  .alm-tus-dolu:focus-visible {
    background: var(--alm-sarap-koyu);
    color: #ffffff;
  }

  .alm-tus-cizgi {
    border-color: var(--alm-cizgi-koyu);
    color: var(--alm-murekkep);
  }

  .alm-tus-cizgi:hover,
  .alm-tus-cizgi:focus-visible {
    border-color: var(--alm-sarap);
    color: var(--alm-sarap);
  }

  .alm-alinti {
    margin-block: var(--alm-ara-4);
    padding-inline-start: var(--alm-ara-3);
    border-inline-start: 3px solid var(--alm-okra);
    max-inline-size: 58ch;
  }

  .alm-alinti p {
    font-family: var(--alm-serif);
    font-size: clamp(20px, 2.6vw, 27px);
    font-style: italic;
    font-weight: 500;
    line-height: 1.38;
  }

  .alm-alinti footer {
    margin-block-start: 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-kunye-serit {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--alm-ara-2);
    border: 1px solid var(--alm-cizgi);
    background: var(--alm-yuzey);
    padding: var(--alm-ara-3);
  }

  .alm-kunye-serit div {
    min-inline-size: 0;
  }

  .alm-kunye-serit dt {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-kunye-serit dd {
    margin: 0;
    margin-block-start: 4px;
    font-family: var(--alm-serif);
    font-size: 19px;
    font-weight: 700;
  }

  .alm-sss-oge {
    padding-block: var(--alm-ara-3);
    border-block-end: 1px solid var(--alm-cizgi);
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
  }

  .alm-sss-soru {
    font-size: 20px;
  }

  .alm-sss-cevap {
    color: var(--alm-murekkep-yumusak);
    max-inline-size: 68ch;
  }

  .alm-yazar {
    display: flex;
    gap: var(--alm-ara-3);
    align-items: flex-start;
    margin-block-start: var(--alm-ara-4);
    padding-block-start: var(--alm-ara-3);
    border-block-start: 1px solid var(--alm-cizgi);
  }

  .alm-yazar img {
    flex: 0 0 auto;
    inline-size: 76px;
    block-size: 76px;
    object-fit: cover;
    border: 1px solid var(--alm-cizgi-koyu);
  }

  .alm-yazar-govde {
    min-inline-size: 0;
  }

  .alm-yazar-ad {
    font-size: 19px;
  }

  .alm-yazar-metin {
    margin-block-start: 6px;
    font-size: 16px;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-harita {
    border: 1px solid var(--alm-cizgi);
    overflow: hidden;
    aspect-ratio: 16 / 9;
  }

  .alm-harita iframe {
    inline-size: 100%;
    block-size: 100%;
    border: 0;
    display: block;
  }

  .alm-liste-dizin {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--alm-ara-4);
  }

  .alm-liste-kume {
    min-inline-size: 0;
  }

  .alm-liste-ad {
    font-size: 21px;
    padding-block-end: 11px;
    border-block-end: 2px solid var(--alm-okra);
    margin-block-end: 14px;
  }

  .alm-liste-kume ul {
    list-style: none;
    padding: 0;
    display: grid;
    gap: 9px;
    font-size: 16px;
  }

  .alm-404 {
    padding-block: var(--alm-ara-6);
    text-align: center;
  }

  .alm-404-kod {
    font-family: var(--alm-serif);
    font-size: clamp(64px, 15vw, 132px);
    font-style: italic;
    line-height: 1;
    color: var(--alm-sarap);
  }

  .alm-404-baslik {
    font-size: clamp(25px, 4vw, 38px);
    margin-block-start: var(--alm-ara-2);
  }

  .alm-404-metin {
    margin-block-start: var(--alm-ara-2);
    margin-inline: auto;
    max-inline-size: 54ch;
    color: var(--alm-murekkep-yumusak);
  }

  .alm-404 .alm-tus-dizi {
    justify-content: center;
  }

  .alm-dip {
    background: var(--alm-sarap-dip);
    color: var(--alm-dip-metin);
    margin-block-start: var(--alm-ara-6);
    padding-block: var(--alm-ara-5) var(--alm-ara-3);
  }

  .alm-dip a {
    color: var(--alm-okra);
  }

  .alm-dip a:hover,
  .alm-dip a:focus-visible {
    color: var(--alm-dip-metin);
  }

  .alm-dip-tanitim {
    max-inline-size: 68ch;
  }

  .alm-dip-marka {
    margin-block-end: 4px;
  }

  .alm-dip-cumle {
    margin-block-start: var(--alm-ara-2);
    max-inline-size: 56ch;
    color: var(--alm-dip-yumusak);
  }

  .alm-dip-iletisim {
    list-style: none;
    padding: 0;
    margin-block-start: var(--alm-ara-3);
    display: flex;
    flex-wrap: wrap;
    gap: var(--alm-ara-2) var(--alm-ara-4);
    font-size: 15px;
  }

  .alm-dip-iletisim li {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .alm-dip-iletisim i {
    color: var(--alm-okra);
  }

  .alm-dip-satirlar {
    margin-block-start: var(--alm-ara-4);
  }

  .alm-dip-satir {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    padding-block: var(--alm-ara-3);
    border-block-start: 1px solid rgba(244, 240, 234, 0.16);
  }

  .alm-dip-etiket {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--alm-dip-yumusak);
  }

  .alm-dip-satir ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px var(--alm-ara-3);
    font-size: 15px;
  }

  .alm-dip-alt {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--alm-ara-3);
    justify-content: space-between;
    padding-block: var(--alm-ara-3);
    border-block-start: 1px solid rgba(244, 240, 234, 0.16);
  }

  .alm-dip-sosyal {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
  }

  .alm-sosyal-oge {
    inline-size: 38px;
    block-size: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(244, 240, 234, 0.28);
    color: var(--alm-okra);
    font-size: 15px;
  }

  .alm-dip-not {
    font-size: 14px;
    color: var(--alm-dip-yumusak);
    max-inline-size: 66ch;
  }

  .alm-dip-yasal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--alm-ara-2);
    padding-block-start: var(--alm-ara-3);
    border-block-start: 1px solid rgba(244, 240, 234, 0.16);
    font-size: 14px;
    color: var(--alm-dip-yumusak);
  }

  .alm-dip-yasal ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--alm-ara-3);
  }
}

@layer uyum {
  @media (max-width: 480px) {
    .alm-tepe-ic {
      gap: var(--alm-ara-2);
    }

    .alm-marka {
      min-inline-size: 0;
    }


    .alm-panel-tus {
      padding-inline: 12px;
      flex: 0 0 auto;
    }
  }

  @media (min-width: 620px) {
    .alm-izgara-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alm-kunye-serit {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alm-sss-oge {
      grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.25fr);
      gap: var(--alm-ara-3);
    }

    .alm-dip-satir {
      grid-template-columns: 130px 1fr;
      gap: var(--alm-ara-3);
      align-items: baseline;
    }

    .alm-panel-ic {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: var(--alm-ara-4) var(--alm-ara-3);
    }
  }

  @media (min-width: 900px) {
    .alm-izgara-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .alm-izgara-4 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alm-kunye-serit {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .alm-liste-dizin {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alm-panel-ic {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .alm-cizelge {
      padding-inline-start: 44px;
    }

    .alm-cizelge::before {
      inset-inline-start: 7px;
    }

    .alm-cizelge-adim::before {
      inset-inline-start: -44px;
      inline-size: 16px;
      block-size: 16px;
      inset-block-start: 32px;
    }
  }

  @media (min-width: 1040px) {
    .alm-ust-menu {
      display: block;
      margin-inline-start: auto;
    }

    .alm-panel-tus {
      margin-inline-start: 0;
    }

    .alm-izgara-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .alm-liste-dizin {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .alm-panel-ic {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
      animation-duration: 0.01ms !important;
      transition-duration: 0.01ms !important;
    }
  }
}