/* Eryon Digital sitesi: tasarım sistemi (Toparlanma yönünden).
   Kapakta işletmenin dağınık işi kaydırdıkça tek bir "Bugün" paneline akar; sayfanın tek gösterişli anı budur, geri kalanı sakin.
   Tek yazı ailesi (Mona Sans, genişlik ekseniyle), tek marka rengi (ultramarin), tek görünüm (açık). Kehribar yalnız insan onayıdır.
   Yazı tipleri ve kodlar kendi sunucumuzdan gelir; sayfa üçüncü tarafa istek göndermez. */
@font-face { font-family: "Mona Sans"; font-style: normal; font-weight: 200 900; font-stretch: 75% 125%; font-display: swap;
  src: url(../yazi/mona-sans-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: "Mona Sans"; font-style: normal; font-weight: 200 900; font-stretch: 75% 125%; font-display: swap;
  src: url(../yazi/mona-sans-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Caveat"; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../yazi/caveat-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: "Caveat"; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../yazi/caveat-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
:root {
  --zemin: #F4F5F7;
  --kart: #FFFFFF;
  --murekkep: #0C1220;
  --soluk: #586174;
  --cizgi: #DCE0E8;
  --eryon: #2F3FF0;
  --eryon-koyu: #1E28B4;
  --eryon-acik: #E8EAFF;
  --amber-zemin: #FFF1D6;
  --amber-yazi: #8A5300;
  --amber: #F5A524;
  --gece-yazi: #B6BDCC;
  --gece-soluk: #8C94A8;
  --gece-cizgi: rgba(255,255,255,.14);
  --f: "Mona Sans", "Helvetica Neue", Arial, sans-serif;
  --f-el: "Caveat", "Bradley Hand", cursive;
  --kenar: clamp(1.125rem, 5vw, 4.5rem);
  --sar: 75rem;
  --ust-boy: 4.25rem;
  color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--ust-boy) + 1rem); }
/* ölçek sabit: her ekran genişliğinde aynı boy, içerik ortada en çok 75rem (leftflow.ai ölçüsü, 10 Ekim 2026) */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body { margin: 0; background: var(--zemin); color: var(--murekkep); font: 400 1rem/1.6 var(--f); overflow-x: clip; }
img { max-width: 100%; display: block; }
a { color: inherit; }
button { font: inherit; }
:focus-visible { outline: 0.1875rem solid var(--eryon); outline-offset: 0.1875rem; border-radius: 0.375rem; }
.sar { width: min(var(--sar), 100% - 2 * var(--kenar)); margin-inline: auto; }
h1, h2, h3 { margin: 0; font-weight: 750; letter-spacing: -.03em; text-wrap: balance; }
h2 { font-size: clamp(2rem, 3.6vw, 2.875rem); line-height: .98; font-stretch: 112%; letter-spacing: -.04em; }
h3 { font-size: clamp(1.25rem, 1.8vw, 1.5rem); line-height: 1.05; font-stretch: 108%; }
p { margin: 0; }
::selection { background: var(--eryon); color: #fff; }
.gizli { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.atla { position: fixed; z-index: 100; left: 1rem; top: 1rem; padding: 0.75rem 1.125rem; border-radius: 999px; background: var(--murekkep); color: #fff; font-weight: 600; text-decoration: none; transform: translateY(-180%); transition: transform .2s; }
.atla:focus-visible { transform: none; }
/* sayfalar arası geçiş: tarayıcı destekliyorsa kısa bir solma */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .22s; }

/* düğmeler */
.dugme { display: inline-flex; align-items: center; justify-content: center; gap: 0.625rem; min-height: 3rem; padding: 0 1.5rem; border-radius: 999px; border: 0; cursor: pointer; text-decoration: none; font: 600 .9375rem/1 var(--f); background: var(--eryon); color: #fff; transition: background .2s, transform .2s; }
.dugme:hover { background: var(--eryon-koyu); }
.dugme:active { transform: scale(.98); }
.dugme.ikincil { background: transparent; color: var(--murekkep); box-shadow: inset 0 0 0 1.5px var(--murekkep); }
.dugme.ikincil:hover { background: var(--murekkep); color: #fff; }
.dugme.beyaz { background: #fff; color: var(--murekkep); }
.dugme.beyaz:hover { background: var(--eryon-acik); }

/* üst şerit */
.ust { position: fixed; z-index: 50; left: 0; right: 0; top: 0; padding-top: env(safe-area-inset-top, 0px); transition: background .3s, box-shadow .3s; }
.ust.dolu { background: rgba(244, 245, 247, .86); backdrop-filter: blur(0.875rem); -webkit-backdrop-filter: blur(0.875rem); box-shadow: 0 1px 0 var(--cizgi); }
.ust-ic { display: flex; align-items: center; gap: 1.75rem; min-height: 4.75rem; }
.logo { display: inline-flex; align-items: center; gap: 0.75rem; text-decoration: none; }
.logo svg { width: 2.125rem; height: 2.125rem; flex: none; }
.logo-ad { font: 800 1.45rem/1 var(--f); font-stretch: 125%; letter-spacing: -.03em; }
.menu { display: flex; gap: 1.625rem; margin-left: auto; }
.menu a { text-decoration: none; font-weight: 500; font-size: .98rem; color: var(--soluk); padding-block: 0.5rem; }
.menu a:hover { color: var(--murekkep); }
.ust-sag { display: flex; align-items: center; gap: 0.875rem; }
.dil { display: inline-flex; padding: 0.1875rem; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--cizgi); background: rgba(255,255,255,.6); }
.dil a { padding: 0.4375rem 0.6875rem; border-radius: 999px; font-size: .8rem; font-weight: 600; color: var(--soluk); text-decoration: none; }
.dil a:hover { color: var(--murekkep); }
.dil a[aria-current="true"] { background: var(--murekkep); color: #fff; }
.ust.koyu.dolu { background: rgba(12, 18, 32, .8); box-shadow: 0 1px 0 rgba(255,255,255,.08); }
.ust.koyu .logo-ad { color: #fff; }
.ust.koyu .menu a { color: var(--gece-yazi); }
.ust.koyu .menu a:hover { color: #fff; }
.ust.koyu .dil { background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.ust.koyu .dil a { color: var(--gece-yazi); }
.ust.koyu .dil a[aria-current="true"] { background: #fff; color: var(--murekkep); }
.ust.koyu .menu-ac { background: rgba(255,255,255,.08); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
.ust .dugme { min-height: 2.625rem; padding: 0 1.125rem; font-size: .875rem; }
.menu-ac { display: none; }
.menu .menu-cta { display: none; }

/* ——— kapak ——— */
.kapak { position: relative; height: 100vh; height: 100svh; min-height: 43.75rem; overflow: hidden; }
.sahne { position: absolute; inset: 0; }
.kapak-metin { position: absolute; z-index: 5; left: max(var(--kenar), (100% - var(--sar)) / 2); top: 50%; translate: 0 -46%; width: min(37.5rem, 44vw); display: grid; gap: 1.625rem; }
.baslik { --agirlik: 320; --aralik: 0.01; font-size: clamp(2.75rem, 5vw, 4rem); line-height: .94; font-weight: var(--agirlik); letter-spacing: calc(var(--aralik) * 1em); font-stretch: 100%; display: grid; }
.kapak-alt { font-size: clamp(1.05rem, 1.3vw, 1.2rem); color: #333B4D; max-width: 50ch; }
.dugmeler { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.ipucu { display: inline-flex; align-items: center; gap: 0.75rem; font-size: .9rem; color: var(--soluk); }
.ipucu i { position: relative; width: 2.75rem; height: 2px; background: var(--cizgi); overflow: hidden; }
.ipucu i::after { content: ""; position: absolute; inset: 0; width: 40%; background: var(--eryon); animation: ipucu 1.8s cubic-bezier(.6, 0, .2, 1) infinite; }
@keyframes ipucu { from { transform: translateX(-100%); } to { transform: translateX(260%); } }

.kutu { position: absolute; inset: max(var(--ust-boy), (100% - 72rem) / 2) max(0px, (100% - 120rem) / 2) max(0px, (100% - 72rem) / 2); }
.parca { position: absolute; left: var(--x, 0); top: var(--y, 0); width: var(--g, 13.75rem); z-index: 4; will-change: transform; }
.ses-sure { font-size: .78rem; color: #3D8B58; }
.parca-ic { will-change: transform; }
.parca-govde { border-radius: 0.875rem; padding: 0.75rem 0.875rem; background: #fff; box-shadow: 0 1px 1px rgba(12,18,32,.06), 0 0.75rem 1.875rem -0.875rem rgba(12,18,32,.28); font-size: .9rem; line-height: 1.35; animation: suzul 6s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.7s); }
@keyframes suzul { from { transform: translateY(-0.3125rem); } to { transform: translateY(0.375rem); } }
.p-ust { display: flex; justify-content: space-between; gap: 0.625rem; font-size: .74rem; color: #667085; margin-bottom: 0.25rem; }
.p-ust b { font-weight: 650; color: #075E54; }
.tip-wa .parca-govde, .tip-ses .parca-govde { background: #D9FDD3; border-radius: 0.875rem 0.875rem 0.875rem 0.25rem; }
.tip-not .parca-govde { background: linear-gradient(180deg, #FFF3A6, #FFE97A); border-radius: 0.1875rem; font: 600 1.32rem/1.12 var(--f-el); color: #3A3200; padding: 1rem 1rem 1.125rem; box-shadow: 0 1.125rem 1.5rem -1.125rem rgba(70,60,0,.45), 0 1px 0 rgba(0,0,0,.05); }
.tip-xls .parca-govde { padding: 0; overflow: hidden; }
.xls-bas { display: flex; align-items: center; gap: 0.5rem; padding: 0.5625rem 0.75rem; background: #107C41; color: #fff; font-size: .78rem; font-weight: 600; }
.xls-bas i { width: 1rem; height: 1rem; border-radius: 0.1875rem; background: #fff; color: #107C41; display: grid; place-items: center; font-style: normal; font-size: .66rem; font-weight: 800; }
.xls-izgara { display: grid; grid-template-columns: 1.625rem repeat(3, 1fr); font-size: .74rem; }
.xls-izgara span { padding: 0.3125rem 0.375rem; border-right: 1px solid #E4E7EC; border-bottom: 1px solid #E4E7EC; white-space: nowrap; overflow: hidden; }
.xls-izgara span.k { color: #98A2B3; background: #F7F8FA; text-align: center; }
.xls-izgara span.hata { color: #D92D20; font-weight: 700; background: #FEF3F2; }
.p-sira { display: flex; align-items: center; gap: 0.625rem; }
.p-ikon { flex: none; width: 2.125rem; height: 2.125rem; border-radius: 50%; display: grid; place-items: center; }
.p-ikon svg { width: 1.125rem; height: 1.125rem; }
.tip-cagri .p-ikon { background: #FEE4E2; color: #D92D20; }
.tip-mail .p-ikon { background: #E8EAFF; color: var(--eryon); }
.tip-pdf .p-ikon { background: #FEE4E2; color: #B42318; border-radius: 0.375rem; font-size: .62rem; font-weight: 800; }
.tip-dm .p-ikon { background: conic-gradient(#FEDA75, #FA7E1E, #D62976, #962FBF, #4F5BD5, #FEDA75); padding: 2px; }
.tip-dm .p-ikon i { width: 100%; height: 100%; border-radius: 50%; background: #fff; display: grid; place-items: center; font-style: normal; font-size: .72rem; font-weight: 700; }
.p-metin { min-width: 0; }
.p-metin b { display: block; font-weight: 650; font-size: .86rem; }
.p-metin span { color: #475467; font-size: .82rem; }
.okunmadi { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--eryon); flex: none; margin-left: auto; }
.tip-cal .tarih { flex: none; width: 2.625rem; border-radius: 0.5rem; overflow: hidden; text-align: center; box-shadow: 0 0 0 1px #E4E7EC; }
.tip-cal .tarih b { display: block; background: #D92D20; color: #fff; font-size: .62rem; padding: 2px 0; letter-spacing: .04em; }
.tip-cal .tarih span { display: block; font-size: 1.05rem; font-weight: 700; padding: 2px 0 0.1875rem; }
.dalga { display: flex; align-items: center; gap: 2px; height: 1.375rem; flex: 1; }
.dalga i { width: 0.1875rem; border-radius: 2px; background: #3D8B58; }
.oynat { width: 1.75rem; height: 1.75rem; border-radius: 50%; background: #3D8B58; display: grid; place-items: center; flex: none; }
.oynat::after { content: ""; border-left: 0.5rem solid #fff; border-top: 0.3125rem solid transparent; border-bottom: 0.3125rem solid transparent; margin-left: 2px; }
.tip-makbuz .parca-govde { border-radius: 2px; background: #FBFAF4; -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 0.5rem) no-repeat, radial-gradient(circle at 0.375rem 0.5rem, transparent 0.3125rem, #000 0.3438rem) bottom / 0.75rem 0.5rem repeat-x; mask: linear-gradient(#000 0 0) top / 100% calc(100% - 0.5rem) no-repeat, radial-gradient(circle at 0.375rem 0.5rem, transparent 0.3125rem, #000 0.3438rem) bottom / 0.75rem 0.5rem repeat-x; padding-bottom: 1.25rem; }
.tip-makbuz .el { font: 600 1.15rem/1 var(--f-el); color: #B42318; margin-top: 0.375rem; display: block; }

.panel-yer { position: absolute; z-index: 3; top: 0; bottom: 0; right: max(var(--kenar), (100% - var(--sar)) / 2); width: min(35rem, 41vw); display: flex; align-items: center; pointer-events: none; }
.panel { position: relative; width: 100%; pointer-events: auto; border-radius: 1.375rem; background: var(--kart); box-shadow: 0 0 0 1px rgba(12,18,32,.06), 0 3.125rem 6.25rem -2.5rem rgba(12,18,32,.45); padding: 1.375rem 1.375rem 1rem; }
.panel-bas { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; padding: 0 0.25rem 0.875rem; border-bottom: 1px solid var(--cizgi); }
.panel-bas b { font-size: 1.5rem; font-weight: 750; font-stretch: 110%; letter-spacing: -.02em; }
.panel-bas span { color: var(--soluk); font-size: .92rem; }
.satirlar { list-style: none; margin: 0; padding: 0.375rem 0 0; display: grid; }
.satir { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; padding: 0.625rem 0.25rem; border-bottom: 1px solid #EEF0F4; }
.satir:last-child { border-bottom: 0; }
.s-ikon { width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; display: grid; place-items: center; background: var(--eryon-acik); color: var(--eryon); }
.s-ikon svg { width: 1.125rem; height: 1.125rem; }
.satir b { font-weight: 600; font-size: .98rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.durum { font-size: .8rem; font-weight: 600; padding: 0.375rem 0.625rem; border-radius: 999px; background: var(--eryon-acik); color: var(--eryon-koyu); white-space: nowrap; }
.durum.amber { background: var(--amber-zemin); color: var(--amber-yazi); }
.panel-alt { display: flex; justify-content: space-between; gap: 0.75rem; padding: 0.75rem 0.25rem 0; font-size: .82rem; color: var(--soluk); }

/* ——— bölümler ——— */
.bolum { padding-block: clamp(4.5rem, 8vw, 7.5rem); }
.bolum-bas { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 1.5rem 4rem; align-items: end; margin-bottom: clamp(2.5rem, 4vw, 3.5rem); }
.bolum-bas p { color: var(--soluk); font-size: 1.15rem; max-width: 44ch; }

/* hizmetler: üst üste binen kartlar */
.yigin { display: grid; gap: 1.75rem; }
.hizmet { position: sticky; top: calc(6.25rem + var(--s) * 1.375rem); min-height: min(35rem, 76vh); border-radius: 1.75rem; padding: clamp(1.75rem, 4vw, 3.5rem); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 2.5rem; align-items: center; transform-origin: center top; box-shadow: 0 -1px 0 rgba(255,255,255,.4) inset, 0 2.5rem 5rem -3.125rem rgba(12,18,32,.5); }
.hizmet.h-a { background: var(--kart); }
.hizmet.h-b { background: var(--eryon); color: #fff; }
.hizmet.h-c { background: var(--murekkep); color: #fff; }
.hizmet-metin { display: grid; gap: 1.375rem; align-content: start; min-width: 0; }
.hizmet h3 { font-size: clamp(1.6rem, 2.4vw, 2.125rem); font-stretch: 112%; letter-spacing: -.035em; line-height: 1; }
.hizmet p { font-size: 1.1rem; max-width: 48ch; opacity: .86; }
.hizmet ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.5rem; }
.hizmet li { padding: 0.75rem 0; border-top: 1px solid currentColor; border-top-color: color-mix(in srgb, currentColor 22%, transparent); font-weight: 500; }
.kanit-link { justify-self: start; display: inline-block; text-decoration: none; font-weight: 600; padding-bottom: 0.25rem; border-bottom: 2px solid currentColor; }
.cizim { width: 100%; max-width: 28.75rem; justify-self: center; }
.cizim svg { width: 100%; height: auto; overflow: visible; }
.cizim .c { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cizim .v { fill: var(--eryon); }
.h-b .cizim .v { fill: #fff; }
.h-c .cizim .v { fill: #8F99FF; }

/* işler */
.isler { background: var(--kart); overflow-x: clip; } /* eğik Bak&Ar ekranı ekrandan taşıp yana kaydırmasın */
.bakar-ust { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem 4rem; align-items: end; margin-bottom: 2.5rem; }
.urun-etiket { font-size: .95rem; font-weight: 600; color: var(--eryon); }
.bakar-ust h3 { font-size: clamp(2.25rem, 3.6vw, 3rem); font-stretch: 118%; letter-spacing: -.045em; line-height: .95; margin-top: 0.5rem; }
.bakar-ust p { color: #333B4D; }
.bakar-yazi { display: grid; gap: 1rem; }
.bakar-bag { display: inline-block; margin-top: 2rem; }
.rakamlar { display: flex; flex-wrap: wrap; gap: 1.125rem 2.5rem; margin-top: 1.25rem; }
.rakamlar div { display: grid; gap: 2px; align-content: start; }
.rakamlar b { font-size: clamp(1.6rem, 2.2vw, 2rem); font-weight: 800; font-stretch: 115%; letter-spacing: -.04em; font-variant-numeric: tabular-nums; line-height: 1; }
.rakamlar span { font-size: .9rem; color: var(--soluk); max-width: 18ch; }
.durum-cip { display: inline-flex; align-items: center; gap: 0.5rem; font-size: .88rem; font-weight: 600; padding: 0.4375rem 0.75rem; border-radius: 999px; background: var(--amber-zemin); color: var(--amber-yazi); justify-self: start; }
.durum-cip.mavi { background: var(--eryon-acik); color: var(--eryon-koyu); }
.durum-cip i { width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: currentColor; }
.sahne-3b { perspective: 87.5rem; }
.cerceve { border-radius: 1.375rem; padding: 0.75rem; background: #11182A; box-shadow: 0 3.75rem 7.5rem -3.75rem rgba(12,18,32,.7); transform-origin: center top; }
.cerceve-ic { border-radius: 0.75rem; overflow: hidden; aspect-ratio: 16 / 9; background: #F3ECE9; }
.cerceve-ic img { width: 100%; height: 100%; object-fit: cover; object-position: top left; transition: opacity .3s; }
.sekmeler { display: flex; justify-content: center; gap: 0.375rem; margin-top: 1.375rem; flex-wrap: wrap; }
.sekmeler button { border: 0; cursor: pointer; padding: 0.625rem 1rem; border-radius: 999px; background: var(--zemin); color: var(--soluk); font-weight: 600; font-size: .92rem; }
.sekmeler button[aria-pressed="true"] { background: var(--murekkep); color: #fff; }

.ikili { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; margin-top: clamp(3.5rem, 6vw, 5rem); }
.vaka { border-radius: 1.75rem; padding: clamp(1.625rem, 3.6vw, 3rem); display: grid; gap: 1.375rem; align-content: start; min-width: 0; }
.vaka.mavi { background: var(--eryon-acik); }
.vaka.gri { background: var(--zemin); }
.vaka h3 { font-size: clamp(1.6rem, 2.4vw, 2.125rem); font-stretch: 115%; letter-spacing: -.04em; }
.vaka p { color: #333B4D; }
.telefon { width: min(21.25rem, 100%); justify-self: center; border-radius: 2.5rem; padding: 0.625rem; background: var(--murekkep); box-shadow: 0 2.5rem 4.375rem -2.5rem rgba(12,18,32,.6); }
.telefon-ic { border-radius: 1.9375rem; background: #E6EBF5; padding: 1rem 0.75rem 1.125rem; display: grid; gap: 0.5625rem; }
.telefon-bas { display: flex; align-items: center; gap: 0.625rem; padding: 0 0.25rem 0.625rem; border-bottom: 1px solid rgba(12,18,32,.08); font-weight: 600; font-size: .92rem; }
.telefon-bas svg { width: 1.875rem; height: 1.875rem; }
.telefon-bas small { display: block; font-weight: 400; color: var(--soluk); font-size: .74rem; }
.balon { background: #fff; border-radius: 1rem 1rem 1rem 0.3125rem; padding: 0.6875rem 0.8125rem 0.5625rem; font-size: .86rem; line-height: 1.45; }
.balon .bosluk { height: .5em; }
.balon .sonuc-satir { margin-top: 0.4375rem; font-weight: 700; color: var(--eryon); }
.klavye { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.3125rem; }
.klavye button { border: 0; cursor: pointer; border-radius: 0.625rem; background: rgba(12,18,32,.42); color: #fff; padding: 0.5625rem 2px; font-size: .74rem; font-weight: 500; min-width: 0; }
.klavye button:hover { background: rgba(12,18,32,.6); }
.klavye button[aria-pressed="true"] { background: var(--eryon); }
.hat { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; counter-reset: h; }
.hat li { counter-increment: h; display: grid; grid-template-columns: 2.125rem 1fr; align-items: center; gap: 0.875rem; padding: 0.75rem 0.875rem; border-radius: 0.875rem; background: #fff; font-weight: 600; }
.hat li::before { content: counter(h); width: 2.125rem; height: 2.125rem; border-radius: 50%; display: grid; place-items: center; background: var(--zemin); font-size: .84rem; color: var(--soluk); }
.hat li:last-child { background: var(--murekkep); color: #fff; }
.hat li:last-child::before { background: var(--eryon); color: #fff; }
.mini-rakam { display: flex; gap: 1.75rem; flex-wrap: wrap; }
.mini-rakam b { display: block; font-size: 1.8rem; font-weight: 800; font-stretch: 112%; letter-spacing: -.03em; line-height: 1; }
.mini-rakam span { font-size: .86rem; color: var(--soluk); }
.metin-link { justify-self: start; font-weight: 600; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 0.1875rem; }

/* neden */
.neden { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 4rem; }
.neden-oge { display: grid; gap: 0.75rem; padding-block: 2.125rem; border-top: 1.5px solid var(--murekkep); }
.neden-oge h3 { font-size: clamp(1.25rem, 1.8vw, 1.5rem); }
.neden-oge p { color: #3A4256; max-width: 52ch; }
.soz { margin: clamp(3.5rem, 6vw, 5rem) 0 0; max-width: 68.75rem; }
.soz blockquote { margin: 0; font-size: clamp(1.75rem, 3vw, 2.625rem); line-height: 1.04; font-weight: 650; font-stretch: 110%; letter-spacing: -.04em; text-wrap: balance; }
.soz figcaption { margin-top: 1.75rem; display: flex; align-items: center; gap: 0.875rem; font-weight: 600; }
.soz figcaption span { color: var(--soluk); font-weight: 400; }
.soz figcaption i { width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--eryon); color: #fff; display: grid; place-items: center; font-style: normal; font-weight: 700; font-size: .9rem; }

/* süreç */
.surec { background: var(--kart); }
.yol { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.75rem; list-style: none; margin: 0; padding: 0; }
.yol::before, .yol::after { content: ""; position: absolute; left: 1.375rem; right: 1.375rem; top: 1.3125rem; height: 0.1875rem; border-radius: 0.1875rem; background: var(--cizgi); }
.yol::after { background: var(--eryon); transform-origin: left; transform: scaleX(var(--ilerleme, 0)); }
.yol li { position: relative; display: grid; gap: 0.875rem; align-content: start; }
.yol .no { position: relative; z-index: 1; width: 2.75rem; height: 2.75rem; border-radius: 50%; display: grid; place-items: center; background: var(--kart); box-shadow: inset 0 0 0 2px var(--cizgi); font-weight: 700; transition: background .3s, color .3s, box-shadow .3s; }
.yol li.gecti .no { background: var(--eryon); color: #fff; box-shadow: none; }
.yol h3 { font-size: 1.6rem; margin-top: 0.5rem; }
.yol p { color: #3A4256; }
.yol .cikti { font-size: .92rem; color: var(--soluk); }
.yol .cikti b { color: var(--murekkep); font-weight: 600; }
.onay-not { margin-top: 2.75rem; display: flex; align-items: center; gap: 0.75rem; color: var(--soluk); }
.onay-not i { width: 0.75rem; height: 0.75rem; border-radius: 50%; background: #F5A524; box-shadow: 0 0 0 0.3125rem var(--amber-zemin); flex: none; }

/* iletişim */
.iletisim { background: var(--murekkep); color: #fff; padding-block: clamp(5rem, 9vw, 8rem); }
.iletisim h2 { font-size: clamp(2.25rem, 4.4vw, 3.5rem); font-stretch: 118%; letter-spacing: -.05em; line-height: .92; max-width: 14ch; }
.iletisim-alt { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem 4rem; align-items: end; margin-top: 3rem; }
.iletisim-alt p { color: #B6BDCC; font-size: 1.15rem; max-width: 48ch; }
.eposta { display: block; margin-top: 1.75rem; font-size: clamp(1.375rem, 2.4vw, 2rem); font-weight: 650; font-stretch: 112%; letter-spacing: -.03em; text-decoration: none; overflow-wrap: anywhere; }
.eposta:hover { color: #A9B1FF; }
.eposta-dugmeler { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.kopya.kopyalandi { background: #E8EAFF; color: var(--eryon-koyu); }

/* alt */
.alt { background: var(--murekkep); color: #B6BDCC; padding-block: 0 2.75rem; }
.alt-ic { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, .6fr)); gap: 2rem; padding-top: 3.5rem; border-top: 1px solid rgba(255,255,255,.12); }
.alt .logo-ad { color: #fff; }
.alt .alt-baslik { margin: 0 0 0.875rem; color: #fff; font-size: .95rem; font-weight: 600; font-stretch: 100%; letter-spacing: 0; line-height: 1.3; }
.alt-marka { display: grid; gap: 0.875rem; align-content: start; }
.alt-eposta { color: #fff; font-weight: 600; }
.alt-son-sag { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
.alt ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.625rem; }
.alt a { text-decoration: none; }
.alt a:hover { color: #fff; }
.alt-son { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.75rem; margin-top: 3rem; font-size: .88rem; }

/* ——— ajan odası: bir dert seçilir, ajanlar sırayla çalışır, son söz kehribar onay düğmesinde ——— */
.oda-bolum { padding-top: 0; }
.oda { --ajan: var(--eryon); --ajan-acik: var(--eryon-acik); --ajan-koyu: var(--eryon-koyu); --insan: var(--amber); --insan-acik: var(--amber-zemin); --insan-koyu: var(--amber-yazi);
  border-radius: 1.75rem; background: var(--kart); box-shadow: 0 0 0 1px rgba(12,18,32,.06), 0 3.125rem 6.25rem -3.125rem rgba(12,18,32,.42); overflow: hidden; }
.oda-ust { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--cizgi); }
.oda-ad { display: inline-flex; align-items: center; gap: 0.625rem; font-weight: 700; }
.nabiz { position: relative; width: 0.5625rem; height: 0.5625rem; border-radius: 50%; background: var(--ajan); }
.nabiz::after { content: ""; position: absolute; inset: -0.3125rem; border-radius: 50%; border: 2px solid var(--ajan); opacity: 0; animation: nabiz 2s ease-out infinite; }
@keyframes nabiz { 0% { transform: scale(.5); opacity: .9; } 100% { transform: scale(1.6); opacity: 0; } }
.soru { color: var(--soluk); font-weight: 500; }
.ciplar { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-left: auto; }
.cip { border: 0; cursor: pointer; padding: 0.5625rem 0.875rem; border-radius: 999px; background: var(--zemin); color: var(--murekkep); font-weight: 600; font-size: .92rem; transition: background .2s, color .2s, box-shadow .2s; }
.cip:hover { box-shadow: inset 0 0 0 1.5px var(--murekkep); }
.cip[aria-pressed="true"] { background: var(--murekkep); color: #fff; }
.oda-govde { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); min-height: 32.5rem; }
.sohbet { display: flex; flex-direction: column; gap: 0.75rem; padding: 1.375rem 1.25rem; border-right: 1px solid var(--cizgi); background: linear-gradient(180deg, #FAFBFC, #F4F5F8); max-height: 37.5rem; overflow: hidden; }
.mesaj { max-width: 92%; padding: 0.75rem 0.9375rem; border-radius: 1.125rem; font-size: .97rem; line-height: 1.5; animation: mesaj .35s ease both; }
@keyframes mesaj { from { opacity: 0; transform: translateY(0.5rem); } }
.mesaj.siz { align-self: flex-end; background: var(--murekkep); color: #fff; border-bottom-right-radius: 0.375rem; }
.mesaj.eryon { align-self: flex-start; background: #fff; box-shadow: 0 0 0 1px var(--cizgi); border-bottom-left-radius: 0.375rem; }
.mesaj.eryon .kim { display: flex; align-items: center; gap: 0.5rem; font-size: .8rem; font-weight: 700; color: var(--ajan-koyu); margin-bottom: 0.25rem; }
.mesaj.eryon .kim svg { width: 1.125rem; height: 1.125rem; }
.mesaj.onay { align-self: flex-start; background: var(--insan-acik); color: var(--insan-koyu); font-weight: 600; }
.yaziyor { display: inline-flex; gap: 0.25rem; padding: 0.375rem 0.125rem; }
.yaziyor i { width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: var(--soluk); animation: zipla 1s infinite ease-in-out; }
.yaziyor i:nth-child(2) { animation-delay: .15s; } .yaziyor i:nth-child(3) { animation-delay: .3s; }
@keyframes zipla { 0%, 80%, 100% { transform: translateY(0); opacity: .4; } 40% { transform: translateY(-0.25rem); opacity: 1; } }
.calisma { display: grid; grid-template-rows: auto auto 1fr; gap: 1.125rem; padding: 1.375rem; min-width: 0; }
.ajanlar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.5rem; }
.ajan { display: grid; gap: 0.375rem; padding: 0.625rem 0.625rem 0.5625rem; border-radius: 0.875rem; background: var(--zemin); font-size: .82rem; min-width: 0; transition: background .3s, box-shadow .3s; }
.ajan b { font-weight: 700; font-size: .86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ajan span { display: inline-flex; align-items: center; gap: 0.375rem; color: var(--soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ajan span::before { content: ""; flex: none; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: #C3C9D6; }
.ajan.calisiyor { background: var(--ajan-acik); }
.ajan.calisiyor span::before { background: var(--ajan); animation: yanip .8s infinite alternate; }
@keyframes yanip { from { opacity: .3; } }
.ajan.bitti span::before { background: var(--ajan); }
.ajan.bitti span { color: var(--ajan-koyu); }
.ajan.insan { background: var(--insan-acik); }
.ajan.insan span::before { background: var(--insan); }
.ajan.insan.bitti span { color: var(--insan-koyu); }
.akis { position: relative; display: grid; grid-template-columns: minmax(0, 11rem) minmax(7.5rem, 1fr) minmax(0, 11rem); align-items: center; padding: 0.625rem 0; min-height: 13rem; }
.akis svg.isinlar { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.isin { fill: none; stroke: #CBD2E0; stroke-width: 2; }
.isin.akan { stroke: var(--ajan); stroke-dasharray: 6 8; animation: ak .9s linear infinite; filter: drop-shadow(0 0 3px rgba(47,63,240,.45)); }
@keyframes ak { to { stroke-dashoffset: -28; } }
.dugumler { display: grid; gap: 0.625rem; position: relative; z-index: 1; }
.dugumler small { font-size: .74rem; font-weight: 600; color: var(--soluk); }
.dugum { padding: 0.625rem 0.75rem; border-radius: 0.75rem; background: #fff; box-shadow: 0 0 0 1px var(--cizgi); font-weight: 600; font-size: .9rem; opacity: .45; transition: opacity .4s, box-shadow .4s, transform .4s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dugum.yanik { opacity: 1; box-shadow: 0 0 0 1.5px var(--ajan), 0 0.5rem 1.125rem -0.625rem rgba(47,63,240,.55); }
.cikislar .dugum.yanik { background: var(--ajan-acik); }
.merkez { position: relative; z-index: 1; justify-self: center; width: 5.75rem; height: 5.75rem; border-radius: 1.75rem; display: grid; place-items: center; background: var(--murekkep); transition: box-shadow .5s; }
.merkez svg { width: 2.875rem; height: 2.875rem; }
.merkez.parla { box-shadow: 0 0 0 0.5rem rgba(47,63,240,.14), 0 0 2.5rem rgba(47,63,240,.5); }
.sonuc { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 1.125rem; align-items: center; padding: 0.875rem; border-radius: 1.125rem; background: var(--zemin); opacity: .35; transition: opacity .5s; }
.sonuc.hazir { opacity: 1; }
.onizleme { border-radius: 0.75rem; overflow: hidden; aspect-ratio: 16 / 9; background: #fff; box-shadow: 0 0 0 1px var(--cizgi); position: relative; }
.onizleme img { width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.onizleme .mini { position: absolute; inset: 0; padding: 0.75rem; display: grid; align-content: center; gap: 0.5rem; background: #E6EBF5; font-size: .78rem; }
.mini-kart { background: #fff; border-radius: 0.75rem 0.75rem 0.75rem 0.25rem; padding: 0.5625rem 0.6875rem; line-height: 1.4; box-shadow: 0 1px 1px rgba(0,0,0,.06); }
.mini-dugmeler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.25rem; }
.mini-dugmeler i { font-style: normal; text-align: center; padding: 0.3125rem 0; border-radius: 0.4375rem; background: rgba(12,18,32,.42); color: #fff; font-size: .68rem; }
.takvim { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.25rem; }
.takvim i { aspect-ratio: 1; border-radius: 0.375rem; background: #fff; display: grid; place-items: center; font-style: normal; font-size: .62rem; color: var(--soluk); }
.takvim i.dolu { background: var(--ajan-acik); color: var(--ajan-koyu); font-weight: 700; }
.sonuc-metin { display: grid; gap: 0.625rem; align-content: start; min-width: 0; }
.sonuc-metin b { font-size: 1.02rem; }
.sonuc-metin span { font-size: .88rem; color: var(--soluk); }
.onayla { justify-self: start; border: 0; cursor: pointer; padding: 0.6875rem 1rem; border-radius: 0.75rem; background: var(--insan); color: #2B1A00; font-weight: 800; font-size: .95rem; box-shadow: 0 0 0 0 rgba(245,165,36,.5); }
.sonuc.hazir .onayla:not([disabled]) { animation: cagir 1.6s ease-out infinite; }
@keyframes cagir { 0% { box-shadow: 0 0 0 0 rgba(245,165,36,.5); } 100% { box-shadow: 0 0 0 0.875rem rgba(245,165,36,0); } }
.onayla[disabled] { background: var(--insan-acik); color: var(--insan-koyu); cursor: default; }
.oda-alt { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.625rem; padding: 0.75rem 1.25rem; border-top: 1px solid var(--cizgi); font-size: .84rem; color: var(--soluk); }

/* ——— iletişim: solda adres, sağda e-postayı hazırlayan kısa kart ——— */
.iletisim-izgara { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 3rem 5rem; align-items: start; }
.iletisim-sol { display: grid; gap: 1.75rem; align-content: start; }
.iletisim-sol > p { color: var(--gece-yazi); font-size: 1.15rem; max-width: 46ch; }
.iletisim-sol .eposta { margin-top: 0; }
.iletisim-izgara h2 { font-size: clamp(2.25rem, 4vw, 3.25rem); max-width: 12ch; }
.yazici { display: grid; gap: 1.125rem; padding: clamp(1.5rem, 2.6vw, 2.25rem); border-radius: 1.5rem; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--gece-cizgi); }
.yazici h3 { font-size: 1.35rem; font-stretch: 108%; }
.alan { display: grid; gap: 0.4375rem; }
.alan label, .alan legend { font-size: .9rem; font-weight: 600; color: var(--gece-yazi); padding: 0; }
.alan label small { font-weight: 400; color: var(--gece-soluk); }
.alan input, .alan textarea { width: 100%; border: 0; border-radius: 0.875rem; padding: 0.875rem 1rem; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); color: #fff; font: inherit; font-size: 1rem; transition: box-shadow .2s, background .2s; }
.alan textarea { min-height: 7.5rem; resize: vertical; line-height: 1.5; }
.alan input::placeholder, .alan textarea::placeholder { color: var(--gece-soluk); }
.alan input:focus-visible, .alan textarea:focus-visible { outline: 0; background: rgba(255,255,255,.09); box-shadow: inset 0 0 0 2px #A9B1FF; }
.ikili-alan { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; }
fieldset.alan { border: 0; margin: 0; padding: 0; min-width: 0; }
.konular { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.konular label { cursor: pointer; }
.konular input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.konular span { display: inline-flex; padding: 0.5625rem 0.875rem; border-radius: 999px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); color: #fff; font-weight: 600; font-size: .9rem; transition: background .2s, box-shadow .2s; }
.konular label:hover span { box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.konular input:checked + span { background: #fff; color: var(--murekkep); box-shadow: none; }
.konular input:focus-visible + span { outline: 0.1875rem solid #A9B1FF; outline-offset: 0.125rem; }
.yazici-alt { display: grid; gap: 0.75rem; }
.yazici-alt .dugme { justify-self: start; }
.yazici-not { font-size: .86rem; color: var(--gece-soluk); }
.yazici-uyari { font-size: .9rem; font-weight: 600; color: #FFD58A; }

/* ——— ürün sayfası (Bak&Ar) ——— */
.urun-kapak { position: relative; overflow-x: clip; padding: calc(var(--ust-boy) + clamp(3rem, 7vw, 6.5rem)) 0 clamp(4rem, 8vw, 7rem); }
.urun-izgara { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 3rem 4.5rem; align-items: center; }
.urun-metin { display: grid; gap: 1.5rem; align-content: center; min-width: 0; }
.urun-metin h1 { font-size: clamp(2.75rem, 5vw, 4rem); font-stretch: 122%; letter-spacing: -.05em; line-height: .9; font-weight: 800; }
.urun-slogan { font-size: clamp(1.25rem, 1.7vw, 1.5rem); line-height: 1.12; font-weight: 650; font-stretch: 108%; letter-spacing: -.025em; max-width: 22ch; text-wrap: balance; }
.urun-metin > p:not(.urun-etiket):not(.urun-slogan):not(.durum-cip) { color: #333B4D; max-width: 50ch; }
.urun-ekran { margin-right: calc(-1 * max(var(--kenar), (100vw - var(--sar)) / 2)); perspective: 87.5rem; min-width: 0; }
.urun-ekran .cerceve { border-radius: 1.375rem 0 0 1.375rem; padding: 0.75rem 0 0.75rem 0.75rem; }
.urun-ekran .cerceve-ic { border-radius: 0.75rem 0 0 0.75rem; }
.cerceve-ic img { width: 100%; height: 100%; }

.sorun-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem 5rem; align-items: center; }
.sorun-izgara h2 { max-width: 16ch; }
.sorun-izgara > div > p { margin-top: 1.5rem; color: var(--soluk); font-size: 1.15rem; max-width: 46ch; }
.donusum { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.05fr); gap: 1.25rem; align-items: center; }
.donusum-yigin { position: relative; height: 16.5rem; }
.donusum-yigin .parca { position: absolute; width: 12.5rem; }
.donusum-yigin .parca-govde { animation: none; }
.xls-izgara.iki { grid-template-columns: 1.625rem repeat(2, 1fr); }
.donusum-ok { width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center; background: var(--eryon); color: #fff; }
.donusum-ok svg { width: 1.25rem; height: 1.25rem; }
.donusum .panel { padding: 1rem 1rem 0.75rem; }
.donusum .satir { grid-template-columns: 2.25rem minmax(0, 1fr); row-gap: 0.375rem; }
.donusum .satir .durum { grid-column: 2; justify-self: start; }
.donusum .satir .s-ikon { grid-row: span 2; }
.donusum .panel-bas b { font-size: 1.2rem; }

.moduller { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 4rem; }
.modul { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 0.375rem 1.125rem; padding-block: 1.75rem; border-top: 1.5px solid var(--murekkep); }
.modul .s-ikon { width: 2.75rem; height: 2.75rem; border-radius: 0.875rem; grid-row: span 2; }
.modul .s-ikon svg { width: 1.375rem; height: 1.375rem; }
.modul h3 { font-size: clamp(1.125rem, 1.4vw, 1.25rem); }
.modul p { color: #3A4256; max-width: 52ch; }

.galeri { display: grid; gap: 1.5rem; }
.galeri .cerceve-ic img { transition: opacity .25s; }
.galeri-yazi { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.5rem 2rem; }
.galeri-yazi b { font-size: 1.35rem; font-weight: 700; font-stretch: 108%; letter-spacing: -.02em; }
.galeri-yazi span { color: var(--soluk); }
.kucukler { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 0.75rem; }
.kucuk { display: grid; gap: 0.5rem; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; color: var(--soluk); font-weight: 600; font-size: .86rem; min-width: 0; }
.kucuk img { width: 100%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; object-position: top left; border-radius: 0.5rem; box-shadow: 0 0 0 1px var(--cizgi); transition: box-shadow .2s, transform .2s; }
.kucuk span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kucuk:hover img { transform: translateY(-2px); }
.kucuk[aria-pressed="true"] { color: var(--murekkep); }
.kucuk[aria-pressed="true"] img { box-shadow: 0 0 0 2px var(--eryon); }

.saha-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); gap: 3rem 5rem; align-items: center; }
.saha-giris { margin-top: 1.5rem; color: var(--soluk); font-size: 1.15rem; max-width: 46ch; }
.saha-liste { list-style: none; margin: 2.25rem 0 0; padding: 0; display: grid; gap: 0; }
.saha-liste li { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 0.25rem 1.125rem; padding-block: 1.25rem; border-top: 1px solid var(--cizgi); }
.saha-liste .s-ikon { width: 2.75rem; height: 2.75rem; border-radius: 0.875rem; grid-row: span 2; }
.saha-liste b { font-size: 1.1rem; }
.saha-liste span { color: #3A4256; }
.saha-cizim { justify-self: center; width: min(22rem, 100%); }
.saha-cizim svg { width: 100%; height: auto; overflow: visible; }
.saha-cizim .c { fill: none; stroke: var(--murekkep); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.saha-cizim .v { fill: var(--eryon); }
.saha-cizim .a { fill: var(--amber); }

.guven { background: var(--murekkep); color: #fff; }
.guven h2 { max-width: 18ch; }
.guven-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto; gap: 0 3rem; margin-top: clamp(2.5rem, 4vw, 3.5rem); }
.guven-oge { display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: 0.75rem; align-content: start; padding-top: 1.5rem; border-top: 1px solid var(--gece-cizgi); }
.guven-oge.kelime b { font-size: clamp(1.6rem, 2.2vw, 2rem); line-height: 1.02; align-self: end; }
.guven-oge b { font-size: clamp(2.25rem, 3.6vw, 3rem); font-weight: 800; font-stretch: 118%; letter-spacing: -.05em; line-height: .95; font-variant-numeric: tabular-nums; }
.guven-oge span { color: var(--gece-yazi); max-width: 30ch; }

.son-cta { background: var(--eryon); color: #fff; padding-block: clamp(4.5rem, 8vw, 7rem); }
.son-cta h2 { font-size: clamp(2rem, 3.6vw, 2.875rem); font-stretch: 116%; letter-spacing: -.05em; max-width: 18ch; }
.son-cta p { margin-top: 1.5rem; font-size: 1.15rem; color: #DDE1FF; max-width: 46ch; }
.son-cta .dugmeler { margin-top: 2.5rem; }
.son-cta .dugme.cizgili { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7); }
.son-cta .dugme.cizgili:hover { background: rgba(255,255,255,.12); }
.geri-baglanti { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 600; text-decoration: none; color: var(--soluk); }
.geri-baglanti:hover { color: var(--murekkep); }

/* ——— metin sayfası (gizlilik) ——— */
.metin-sayfa { padding: calc(var(--ust-boy) + clamp(3rem, 7vw, 6rem)) 0 clamp(5rem, 10vw, 8rem); }
.metin-sar { max-width: 46rem; }
.metin-sayfa h1 { font-size: clamp(2.25rem, 4vw, 3rem); font-stretch: 116%; letter-spacing: -.045em; line-height: .95; }
.metin-guncel { margin-top: 1rem; color: var(--soluk); font-size: .95rem; }
.metin-giris { margin-top: 2rem; font-size: 1.2rem; line-height: 1.55; color: #333B4D; }
.metin-bolum { margin-top: 2.75rem; padding-top: 1.75rem; border-top: 1px solid var(--cizgi); display: grid; gap: 0.875rem; }
.metin-bolum h2 { font-size: clamp(1.25rem, 1.7vw, 1.5rem); font-stretch: 108%; letter-spacing: -.025em; line-height: 1.1; }
.metin-bolum p { color: #333B4D; }
.metin-bolum a { color: var(--eryon); font-weight: 600; }

/* ——— 404 ——— */
.yok { min-height: 100vh; min-height: 100svh; display: grid; place-items: center; padding: calc(var(--ust-boy) + 3rem) var(--kenar) 4rem; text-align: center; }
.yok-ic { display: grid; gap: 1.5rem; justify-items: center; max-width: 40rem; }
.yok-not { padding: 1.125rem 1.375rem 1.375rem; transform: rotate(-4deg); background: linear-gradient(180deg, #FFF3A6, #FFE97A); border-radius: 3px; font: 600 2rem/1.1 var(--f-el); color: #3A3200; box-shadow: 0 1.125rem 1.5rem -1.125rem rgba(70,60,0,.45); }
.yok h1 { font-size: clamp(2.25rem, 4vw, 3rem); font-stretch: 114%; letter-spacing: -.045em; line-height: .98; }
.yok p { color: var(--soluk); font-size: 1.1rem; }
.yok .yok-ikinci { font-size: .95rem; }
.yok .yok-ikinci a { color: var(--eryon); font-weight: 600; }

/* kırılımlar */
@media (max-width: 1100px) {
  .menu { display: none; }
  .menu-ac { display: inline-flex; margin-left: auto; align-items: center; gap: 0.5rem; cursor: pointer; border: 0; background: #fff; box-shadow: inset 0 0 0 1px var(--cizgi); border-radius: 999px; padding: 0.625rem 1rem; font-weight: 600; font-size: .92rem; color: var(--murekkep); }
  .menu-ac i { position: relative; width: 1rem; height: 0.625rem; }
  .menu-ac i::before, .menu-ac i::after { content: ""; position: absolute; left: 0; right: 0; height: 2px; border-radius: 2px; background: currentColor; transition: transform .25s, top .25s; }
  .menu-ac i::before { top: 0; } .menu-ac i::after { top: calc(100% - 2px); }
  .ust.acik .menu-ac i::before { top: calc(50% - 1px); transform: rotate(45deg); }
  .ust.acik .menu-ac i::after { top: calc(50% - 1px); transform: rotate(-45deg); }
  /* buzlu cam (backdrop-filter) sabit konumlu menüyü şeridin içine hapseder; menü açıkken kapatılır */
  .ust.acik { background: var(--zemin); box-shadow: 0 1px 0 var(--cizgi); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .ust.acik .menu { display: flex; flex-direction: column; position: fixed; left: 0; right: 0; top: calc(var(--ust-boy) + env(safe-area-inset-top, 0px)); bottom: 0; gap: 0; margin: 0; padding: 1rem var(--kenar) calc(2rem + env(safe-area-inset-bottom, 0px)); background: var(--zemin); overflow-y: auto; animation: menu-gel .28s cubic-bezier(.2, .7, .2, 1) both; }
  .ust.acik .menu a { padding: 0.875rem 0; border-bottom: 1px solid var(--cizgi); font-size: clamp(1.6rem, 7vw, 2.4rem); font-weight: 700; font-stretch: 112%; letter-spacing: -.03em; color: var(--murekkep); }
  .ust.acik .menu .menu-cta { display: inline-flex; margin-top: auto; align-self: stretch; min-height: 3.5rem; border-bottom: 0; color: #fff; font-size: 1.05rem; font-stretch: 100%; letter-spacing: 0; }
  html.menu-acik { overflow: hidden; }
  @keyframes menu-gel { from { opacity: 0; transform: translateY(-0.75rem); } }
}
@media (max-width: 959px) {
  .kapak { height: auto; min-height: 0; overflow: visible; padding-top: 6.75rem; }
  .sahne { position: relative; }
  .kapak-metin { position: relative; left: auto; top: auto; translate: none; width: auto; padding-inline: var(--kenar); }
  .baslik { font-size: clamp(2.5rem, 10vw, 3.5rem); }
  .kutu { position: relative; inset: auto; height: 40rem; margin: 2.5rem var(--kenar) 0; }
  .parca { left: var(--xm, 0); top: var(--ym, 0); width: var(--gm, 10.5rem); font-size: .9em; }
  .donusum-yigin .parca { width: 12.5rem; }
  .panel-yer { left: 0; right: 0; width: auto; }
  .panel { padding: 1rem 0.875rem 0.75rem; }
  .bolum-bas { grid-template-columns: minmax(0, 1fr); }
  .hizmet { grid-template-columns: minmax(0, 1fr); position: relative; top: auto; min-height: 0; }
  .cizim { max-width: 20rem; }
  .bakar-ust { grid-template-columns: minmax(0, 1fr); }
  .ikili { grid-template-columns: minmax(0, 1fr); }
  .neden { grid-template-columns: minmax(0, 1fr); }
  .yol { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2.75rem; }
  .yol::before, .yol::after { display: none; }
  .iletisim-alt { grid-template-columns: minmax(0, 1fr); }
  .alt-ic { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alt-ic > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .ust .dugme { display: none; }
  .ust-ic { gap: 0.75rem; min-height: 4.125rem; }
  .kapak { padding-top: 6rem; }
  .hizmet ul { grid-template-columns: minmax(0, 1fr); }
  .yol { grid-template-columns: minmax(0, 1fr); }
  .satir { grid-template-columns: 2rem minmax(0, 1fr); }
  .satir .durum { grid-column: 2; justify-self: start; }
  .s-ikon { width: 2rem; height: 2rem; }
  .kutu { height: 51.25rem; }
  .alt-ic { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
/* yeni parçaların kırılımları */
@media (max-width: 1279px) {
  .urun-izgara { grid-template-columns: minmax(0, 1fr); }
  .urun-ekran { margin-right: 0; }
  .urun-ekran .cerceve { border-radius: 1.375rem; padding: 0.75rem; }
  .urun-ekran .cerceve-ic { border-radius: 0.75rem; }
  .kucukler { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 0.5rem; scrollbar-width: thin; }
  .kucuk { flex: 0 0 11rem; scroll-snap-align: start; }
}
@media (max-width: 959px) {
  .oda-govde { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .sohbet { border-right: 0; border-bottom: 1px solid var(--cizgi); min-height: 15rem; max-height: 22rem; }
  .ciplar { margin-left: 0; }
  .sonuc { grid-template-columns: minmax(0, 1fr); }
  .iletisim-izgara, .sorun-izgara, .saha-izgara, .moduller, .guven-izgara { grid-template-columns: minmax(0, 1fr); }
  .guven-izgara { grid-template-rows: none; row-gap: 2rem; }
  .guven-oge { grid-row: auto; grid-template-rows: none; }
  .saha-cizim { width: min(16rem, 100%); }
}
@media (max-width: 600px) {
  .oda-ust { padding: 0.875rem 1rem; }
  .calisma { padding: 1rem; }
  .ajanlar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .akis { grid-template-columns: minmax(0, 1fr); gap: 0.875rem; min-height: 0; padding: 0; }
  .akis svg.isinlar { display: none; }
  .dugumler { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.375rem; }
  .dugumler small { grid-column: 1 / -1; }
  .dugum { padding: 0.5rem 0.375rem; font-size: .76rem; white-space: normal; text-align: center; line-height: 1.25; }
  .merkez { width: 3.5rem; height: 3.5rem; border-radius: 1.125rem; }
  .merkez svg { width: 1.75rem; height: 1.75rem; }
  .ikili-alan { grid-template-columns: minmax(0, 1fr); }
  .donusum { grid-template-columns: minmax(0, 1fr); }
  .donusum-ok { justify-self: center; transform: rotate(90deg); }
  .modul { grid-template-columns: 2.5rem minmax(0, 1fr); }
}
/* kare alma: ?kare ile kapak sabit yükseklikte (uzun başsız pencerede ekran boyu birimleri şişmesin) */
@media (min-width: 960px) { .kare .kapak { height: 56.25rem; min-height: 0; } .kare .hizmet { min-height: 35rem; } }
@media (max-width: 959px) { .duz .kutu { height: auto; } .duz .panel-yer { position: relative; } }
/* hareket yok ya da betik yüklenmedi: kapak doğrudan düzenli hâliyle */
.duz .kapak .parca, .js-yok .kapak .parca { display: none; }
.duz .baslik, .js-yok .baslik { --agirlik: 780; --aralik: -0.035; }
.duz .ipucu, .js-yok .ipucu { display: none; }
@media (max-width: 959px) { .js-yok .kutu { height: auto; } .js-yok .panel-yer { position: relative; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}