/* Addis Ababa Companies — kurumsal site. Dünya: Anadolu kilimi (kök boya, çivit, ham yün), ölçülü kullanım. */
@font-face { font-family: "Manrope"; font-weight: 400; font-display: swap; src: url(/fonts/manrope-400-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 400; font-display: swap; src: url(/fonts/manrope-400-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "Manrope"; font-weight: 500; font-display: swap; src: url(/fonts/manrope-500-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 500; font-display: swap; src: url(/fonts/manrope-500-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "Manrope"; font-weight: 600; font-display: swap; src: url(/fonts/manrope-600-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 600; font-display: swap; src: url(/fonts/manrope-600-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "Manrope"; font-weight: 800; font-display: swap; src: url(/fonts/manrope-800-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 800; font-display: swap; src: url(/fonts/manrope-800-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "Montserrat"; font-weight: 400; font-display: block; src: url(/fonts/montserrat-400-latin.woff2) format("woff2"); }
@font-face { font-family: "Montserrat"; font-weight: 500; font-display: block; src: url(/fonts/montserrat-500-latin.woff2) format("woff2"); }
@font-face { font-family: "Montserrat"; font-weight: 700; font-display: block; src: url(/fonts/montserrat-700-latin.woff2) format("woff2"); }

:root {
  --yun: #efe6d6;          /* ham yün: okuma zemini */
  --yun-2: #e5d9c4;
  --murekkep: #2a1712;     /* başlık ve metin */
  --metin-2: #5c4636;      /* ikincil metin (yün üstünde 6.9:1) */
  --kok: #8a2c22;          /* kök boya kırmızısı: eylem ve vizyon alanı */
  --kok-koyu: #6f2019;
  --civit: #1f2a44;        /* çivit: kariyer, alt bilgi */
  --ceviz: #4a3426;
  --safran: #d9a23b;
  --serit: clamp(76px, 11.5vw, 184px);
  --kenar: clamp(20px, 3.6vw, 56px);
  --azami: 1180px;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 24px; }
body {
  margin: 0; background: var(--yun); color: var(--murekkep);
  font: 400 1.0625rem/1.65 "Manrope", system-ui, sans-serif; font-feature-settings: "ss01" 1;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--kok); color: var(--yun); }
img { display: block; max-width: 100%; height: auto; }
figure { margin: 0; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.25em; }
:focus-visible { outline: 2px solid var(--kok); outline-offset: 3px; border-radius: 2px; }
h1, h2, h3, h4 { margin: 0; font-weight: 800; letter-spacing: -0.03em; line-height: 1.08; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
.gorunmez, .tuzak { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.atla { position: fixed; left: calc(var(--serit) + 12px); top: 12px; z-index: 60; background: var(--murekkep); color: var(--yun); padding: 10px 16px; transform: translateY(-160%); transition: transform 200ms var(--ease-out); }
.atla:focus { transform: none; }

/* ---------- logo ---------- */
.logo { display: block; width: 100%; height: auto; overflow: visible; }
.logo text { font-family: "Montserrat", sans-serif; }

/* ---------- açılış: iplik gibi atılan çizgiler, maskeyle yükselen yazı, logo yerine uçar ---------- */
.acilis {
  position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: var(--yun); color: var(--murekkep);
  animation: perde 600ms var(--ease-in-out) 2400ms forwards; /* JS yoksa güvenli kapanış */
}
.acilis.js-acilis { animation: none; }
.acilis-logo { width: min(340px, 64vw); transform-origin: 0 0; }
.acilis .c { stroke-dasharray: 1; stroke-dashoffset: 1; stroke: var(--kok);
  animation: ciz var(--d, 440ms) var(--e, var(--ease-out)) var(--g, 0ms) forwards, iplik 420ms var(--ease-out) 1080ms forwards; }
.acilis .c4 { --d: 560ms; --e: cubic-bezier(0.65, 0, 0.35, 1); --g: 0ms; }
.acilis .c1 { --g: 300ms; }
.acilis .c2 { --g: 340ms; }
.acilis .c3 { --d: 320ms; --g: 620ms; }
.acilis .c5 { --d: 300ms; --g: 660ms; }
.acilis .c6 { --d: 380ms; --g: 740ms; }
.acilis .y-addis, .acilis .y-ababa { clip-path: inset(100% 0 0 0); transform: translateY(5px); animation: yuksel 560ms var(--ease-out) forwards; }
.acilis .y-addis { animation-delay: 980ms; }
.acilis .y-ababa { animation-delay: 1060ms; }
.acilis .y-companies { opacity: 0; letter-spacing: 13px; animation: topla 700ms var(--ease-out) 1240ms forwards; }
@keyframes ciz { to { stroke-dashoffset: 0; } }
@keyframes iplik { to { stroke: currentColor; } }
@keyframes yuksel { to { clip-path: inset(0 0 0 0); transform: none; } }
@keyframes topla { to { opacity: 1; letter-spacing: 7.3px; } }
@keyframes perde { to { opacity: 0; visibility: hidden; } }
.acilis-gordu .acilis { display: none; }

/* ---------- kilim şeridi (sol kenar) ---------- */
.serit { /* yalnız açılış ekranında: sayfa kaydıkça onunla birlikte gider */
  position: absolute; left: 0; top: 0; height: 100svh; min-height: 640px; width: var(--serit); z-index: 3;
  display: flex; flex-direction: column; background: var(--yun);
}
.serit-logo { display: block; padding: clamp(14px, 2.2vw, 30px) clamp(10px, 1.4vw, 22px); color: var(--murekkep); background: var(--yun); }
.serit-dokuma {
  flex: 1; position: relative;
  background: var(--kok) url(/assets/img/kilim-serit.webp) center top / 100% auto repeat-y;
  box-shadow: inset 0 0 0 clamp(4px, 0.6vw, 8px) var(--yun);
}

/* ---------- üst menü ---------- */
.ust { position: absolute; top: 0; left: var(--serit); right: 0; z-index: 30; display: flex; align-items: center; gap: 28px; padding: 30px var(--kenar); }
.ust-logo { display: none; width: 92px; color: var(--murekkep); }
/* açılış ekranı geçilince: sade, sabit menü çubuğu */
.ust.sabit { position: fixed; left: 0; padding: 10px var(--kenar); background: color-mix(in oklab, var(--yun) 94%, transparent); backdrop-filter: saturate(1.2) blur(10px);
  box-shadow: 0 1px 0 color-mix(in oklab, var(--murekkep) 10%, transparent), 0 10px 30px -22px rgb(20 10 6 / 0.45); animation: in-ust 320ms var(--ease-out); }
.ust.sabit .ust-logo { display: block; margin-right: auto; }
.ust.sabit .menu { order: 2; } .ust.sabit .dil { order: 3; margin-left: 0; }
@keyframes in-ust { from { transform: translateY(-100%); } }
.menu ul { display: flex; gap: clamp(18px, 2.4vw, 38px); list-style: none; margin: 0; padding: 0; }
.menu a { font-weight: 600; font-size: 0.9375rem; text-decoration: none; padding: 6px 0; background: linear-gradient(currentColor, currentColor) left bottom / 0 1.5px no-repeat; transition: background-size 220ms var(--ease-out); }
.menu a:hover, .menu a:focus-visible { background-size: 100% 1.5px; }
.menu-ac { display: none; }
.dil { margin-left: auto; padding-left: 24px; border-left: 1px solid color-mix(in oklab, var(--murekkep) 35%, transparent); font-weight: 600; font-size: 0.9375rem; text-decoration: none; }
.dil [aria-current] { text-decoration: underline; text-underline-offset: 0.3em; }

/* ---------- açılış ekranı (hero) ---------- */
.hero { position: relative; display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); grid-template-rows: 1fr auto; min-height: 100svh; }
.hero .hero-metin { grid-column: 1; grid-row: 1; align-self: center; position: relative; z-index: 2; padding: 140px 0 48px var(--kenar); max-width: 760px; }
.hero h1 { font-size: clamp(2.6rem, 5.4vw, 5.25rem); line-height: 1; letter-spacing: -0.035em; }
.hero-alt { margin-top: 28px; font-size: clamp(1.125rem, 1.55vw, 1.4rem); line-height: 1.45; color: var(--metin-2); max-width: 30ch; }
.hero-eylem { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; margin-top: 40px; }
.hero .hero-gorsel { grid-column: 1 / -1; grid-row: 1; position: relative; margin-left: 30%; min-height: 0; }
.hero-gorsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; -webkit-mask-image: linear-gradient(to right, transparent 0, #000 34%); mask-image: linear-gradient(to right, transparent 0, #000 34%); }
.hero-alanlar { grid-column: 1 / -1; grid-row: 2; display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 3px; list-style: none; margin: 0; padding: 0; position: relative; z-index: 2; }
.hero-alanlar a { position: relative; display: block; height: clamp(150px, 21vh, 230px); overflow: hidden; color: #fff; text-decoration: none; background: var(--ceviz); }
.hero-alanlar img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease-out); }
.hero-alanlar a::after { content: ""; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, rgb(20 10 6 / 0.72)); }
.hero-alanlar span { position: absolute; left: 22px; right: 18px; bottom: 18px; z-index: 1; font-weight: 600; font-size: clamp(0.95rem, 1.15vw, 1.1rem); display: flex; align-items: center; gap: 10px; }
.hero-alanlar .ok { color: var(--safran); }
@media (hover: hover) and (pointer: fine) {
  .hero-alanlar a:hover img { transform: scale(1.04); }
  .hero-alanlar a:hover .ok { transform: translateX(4px); }
}

.ok { width: 1.15em; height: 1.15em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform 200ms var(--ease-out); }
.dugme {
  display: inline-flex; align-items: center; gap: 12px; padding: 15px 24px; border: 0; border-radius: 4px; cursor: pointer;
  background: var(--kok); color: var(--yun); font: 600 1rem/1 "Manrope", sans-serif; text-decoration: none;
  box-shadow: 0 1px 0 rgb(0 0 0 / 0.12), 0 8px 18px -10px rgb(111 32 25 / 0.6);
  transition: background-color 180ms var(--ease-out), transform 160ms var(--ease-out);
}
.dugme .ok { color: var(--safran); }
.dugme:hover { background: var(--kok-koyu); }
.dugme:hover .ok { transform: translateX(3px); }
.dugme:active { transform: scale(0.97); }
.dugme[disabled] { opacity: 0.6; cursor: progress; }
.metin-baglanti { font-weight: 600; text-decoration: underline; text-decoration-color: var(--kok); text-decoration-thickness: 2px; text-underline-offset: 0.4em; transition: color 160ms var(--ease-out); }
.metin-baglanti:hover { color: var(--kok); }

.kilim-bant { height: 22px; background: var(--kok) url(/assets/img/kilim-bant.webp) left center / auto 100% repeat-x; }

/* ---------- ortak bölüm düzeni ---------- */
main > section { padding: clamp(80px, 11vw, 150px) var(--kenar); }
main > section > *, .bolum-ic { max-width: var(--azami); margin-left: auto; margin-right: auto; }
main > .hero { padding: 0 0 0 var(--serit); }
/* metin genişliği iç dolguyla sınırlanır; blok sola hizalı kalır */
main > section > :is(.bolum-ana, .vizyon-metin) { max-width: var(--azami); }
main > .hero > * { max-width: none; margin: 0; }
.bolum-baslik { display: flex; align-items: center; gap: 18px; font-size: clamp(2.2rem, 4.4vw, 3.9rem); font-weight: 600; letter-spacing: -0.035em; }
.bolum-baslik .no { font-weight: 400; }
.bolum-baslik .cizgi { width: clamp(28px, 4vw, 56px); height: 2px; background: currentColor; flex: none; }
.bolum-ana { margin-top: 22px; font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.35; font-weight: 600; letter-spacing: -0.015em; padding-right: max(0px, calc(100% - 34ch)); color: var(--murekkep); }
.adim { display: block; font-size: 0.875rem; font-weight: 600; color: var(--kok); font-variant-numeric: tabular-nums; margin-bottom: 14px; }

/* ---------- hikâye: sabit görsel, akan bölümler ---------- */
.hikaye-govde { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); margin-top: clamp(48px, 6vw, 80px); }
.hikaye-medya { position: sticky; top: 8vh; height: 84vh; align-self: start; }
.hikaye-medya figure { position: absolute; inset: 0 0 44px; opacity: 0; transform: scale(1.03); transition: opacity 700ms var(--ease-out), transform 1100ms var(--ease-out); }
.hikaye-medya figure.etkin { opacity: 1; transform: none; }
.hikaye-medya img { width: 100%; height: 100%; object-fit: cover; border-radius: 2px; }
.hikaye-sayac { position: absolute; left: 0; bottom: 0; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--metin-2); }
.hikaye-sayac .sayac-no { color: var(--kok); }
.hikaye-bolumler { list-style: none; margin: 0; padding: 0; }
.hikaye-bolumler li { min-height: 72vh; display: flex; flex-direction: column; justify-content: center; padding: 6vh 0; opacity: 0.38; transition: opacity 500ms var(--ease-out); }
.hikaye-bolumler li.etkin, .js-yok .hikaye-bolumler li { opacity: 1; }
.hikaye-bolumler h3 { font-size: clamp(1.6rem, 2.6vw, 2.4rem); }
.hikaye-bolumler p { margin-top: 18px; font-size: 1.125rem; color: var(--metin-2); max-width: 42ch; }
.hikaye-mobil { display: none; }

/* ---------- ne yapıyoruz ---------- */
.alanlar { background: var(--yun-2); }
.bolum-bas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); align-items: end; margin-top: 22px; }
.bolum-bas .bolum-ana { margin-top: 0; }
.bolum-bas p:last-child { color: var(--metin-2); max-width: 52ch; }
.alan-liste { list-style: none; margin: clamp(56px, 7vw, 96px) auto 0; padding: 0; display: grid; gap: clamp(56px, 8vw, 120px); }
.alan-liste li { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.alan-liste li:nth-child(even) figure { order: 2; }
.alan-liste figure { aspect-ratio: 4 / 3; overflow: hidden; }
.alan-liste img { width: 100%; height: 100%; object-fit: cover; }
.alan-liste h3 { font-size: clamp(1.6rem, 2.8vw, 2.5rem); }
.alan-liste p { margin-top: 16px; font-size: 1.125rem; color: var(--metin-2); max-width: 44ch; }

/* ---------- vizyon: kök boya alanı ---------- */
.vizyon { background: var(--kok); color: var(--yun); position: relative; }
.vizyon .bolum-baslik { color: var(--yun); }
.vizyon .bolum-ana { font-size: clamp(1.9rem, 4vw, 3.6rem); line-height: 1.1; font-weight: 800; letter-spacing: -0.035em; padding-right: max(0px, calc(100% - 22ch)); color: var(--yun); margin-top: 36px; }
.vizyon-metin { margin-top: 28px; font-size: 1.1875rem; padding-right: max(0px, calc(100% - 56ch)); color: color-mix(in oklab, var(--yun) 88%, var(--kok)); }
.degerler { list-style: none; padding: 0; margin: clamp(56px, 7vw, 96px) auto 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid color-mix(in oklab, var(--yun) 35%, transparent); }
.degerler li { padding: 28px 28px 0 0; }
.degerler li + li { padding-left: 28px; border-left: 1px solid color-mix(in oklab, var(--yun) 35%, transparent); }
.ucgen { width: 22px; height: 19px; fill: var(--safran); }
.degerler h3 { margin-top: 18px; font-size: 1.375rem; }
.degerler p { margin-top: 10px; color: color-mix(in oklab, var(--yun) 85%, var(--kok)); }

/* ---------- sürdürülebilirlik ---------- */
.surdur-govde { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 6vw, 96px); align-items: start; margin-top: clamp(40px, 5vw, 64px); }
.surdur-govde figure { aspect-ratio: 4 / 5; overflow: hidden; position: sticky; top: 8vh; }
.surdur-govde img { width: 100%; height: 100%; object-fit: cover; }
.surdur-govde .bolum-ana { margin-top: 0; }
.surdur-metin { margin-top: 20px; color: var(--metin-2); max-width: 52ch; }
.ilkeler { list-style: none; padding: 0; margin: 40px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.ilkeler li { padding: 24px 0; border-top: 1px solid color-mix(in oklab, var(--murekkep) 20%, transparent); }
.ilkeler h3 { font-size: 1.25rem; letter-spacing: -0.02em; }
.ilkeler p { margin-top: 8px; color: var(--metin-2); font-size: 1rem; }
.projeler { margin-top: clamp(56px, 7vw, 96px); padding-top: 28px; border-top: 2px solid var(--murekkep); }
.projeler > h3 { font-size: 1.5rem; }
.projeler ul { list-style: none; padding: 0; margin: 24px 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 32px; }
.projeler h4 { font-size: 1.15rem; letter-spacing: -0.02em; }
.projeler li p { margin-top: 8px; color: var(--metin-2); }
.projeler li a { display: inline-flex; gap: 8px; align-items: center; margin-top: 12px; font-weight: 600; }
.projeler .katki { margin-top: 14px; color: var(--metin-2); font-size: 1.0625rem; max-width: 68ch; }

/* ---------- kariyer ---------- */
.kariyer { position: relative; padding: 0 !important; display: grid; min-height: 78vh; }
.kariyer > figure { grid-area: 1 / 1; max-width: none; margin: 0; }
.kariyer > figure img { width: 100%; height: 100%; object-fit: cover; }
.kariyer-kutu { grid-area: 1 / 1; align-self: end; justify-self: end; max-width: 560px !important; margin: 0 var(--kenar) clamp(32px, 6vw, 80px) !important; padding: clamp(28px, 4vw, 52px); background: var(--civit); color: var(--yun); position: relative; z-index: 1; }
.kariyer-kutu .bolum-baslik { font-size: clamp(1.9rem, 3.4vw, 3rem); color: var(--yun); }
.kariyer-kutu .bolum-ana { color: var(--yun); }
.kariyer-kutu p:not(.bolum-ana) { margin-top: 16px; color: color-mix(in oklab, var(--yun) 84%, var(--civit)); }
.kariyer-kutu .dugme { margin-top: 28px; }

/* ---------- iletişim ---------- */
.iletisim-govde { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(40px, 7vw, 112px); margin-top: clamp(40px, 5vw, 64px); }
.iletisim-bilgi .bolum-ana { margin-top: 0; }
.iletisim-bilgi > p:not(.bolum-ana) { margin-top: 18px; color: var(--metin-2); max-width: 44ch; }
.iletisim-bilgi dl { margin: 40px 0 0; display: grid; gap: 22px; }
.iletisim-bilgi dt { font-size: 0.875rem; font-weight: 600; color: var(--kok); }
.iletisim-bilgi dd { margin: 4px 0 0; font-size: 1.0625rem; }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 28px; align-content: start; }
.alan { display: grid; gap: 8px; }
.alan.genis, .genis { grid-column: 1 / -1; }
.alan label { font-size: 0.875rem; font-weight: 600; }
.alan input:not([type=checkbox]), .alan select, .alan textarea {
  width: 100%; font: 400 1.0625rem/1.5 "Manrope", sans-serif; color: var(--murekkep); background: transparent;
  border: 0; border-bottom: 1.5px solid color-mix(in oklab, var(--murekkep) 45%, transparent); border-radius: 0; padding: 10px 2px; transition: border-color 180ms var(--ease-out);
}
.alan select { appearance: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232a1712' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 4px center / 18px no-repeat; padding-right: 30px; }
.alan textarea { resize: vertical; min-height: 140px; }
.alan input:focus, .alan select:focus, .alan textarea:focus { outline: none; border-bottom-color: var(--kok); box-shadow: 0 1.5px 0 var(--kok); }
.alan [aria-invalid="true"] { border-bottom-color: #b3261e; }
.onay { grid-template-columns: auto 1fr; align-items: start; gap: 12px; }
.onay input { width: 20px; height: 20px; margin: 3px 0 0; accent-color: var(--kok); }
.onay label { font-weight: 400; font-size: 0.9375rem; color: var(--metin-2); }
.aydinlatma-ac { background: none; border: 0; padding: 0; font: inherit; color: var(--kok); text-decoration: underline; text-underline-offset: 0.25em; cursor: pointer; }
.form-alt { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 8px; }
.form-durum { font-weight: 600; }
.form-durum.basari { color: #2f6b3f; }
.form-durum.hata { color: #b3261e; }

/* ---------- alt bilgi ---------- */
.alt { background: var(--civit); color: var(--yun); padding: clamp(56px, 7vw, 96px) var(--kenar) 40px; display: grid; grid-template-columns: 180px 1fr auto; gap: 32px 56px; align-items: start; }
.alt-logo { width: 150px; color: var(--yun); }
.alt-menu { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 14px 32px; }
.alt-menu a { text-decoration: none; font-weight: 600; }
.alt-menu a:hover { text-decoration: underline; }
.sosyal { list-style: none; padding: 0; margin: 28px 0 0; display: flex; gap: 14px; }
.alt .sosyal { margin: 0; }
.sosyal a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid currentColor; transition: background-color 180ms var(--ease-out), color 180ms var(--ease-out); }
.sosyal a:hover { background: var(--safran); color: var(--murekkep); border-color: var(--safran); }
.sosyal svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.alt-not { grid-column: 1 / -1; padding-top: 28px; border-top: 1px solid color-mix(in oklab, var(--yun) 25%, transparent); font-size: 0.875rem; color: color-mix(in oklab, var(--yun) 78%, var(--civit)); }
.alt-not a, .alt-not .aydinlatma-ac { color: var(--yun); }

/* ---------- aydınlatma metni penceresi ---------- */
dialog { max-width: 620px; width: calc(100% - 32px); border: 0; padding: clamp(24px, 4vw, 44px); background: var(--yun); color: var(--murekkep); border-radius: 4px; box-shadow: 0 30px 80px -20px rgb(20 10 6 / 0.5); }
dialog::backdrop { background: rgb(20 10 6 / 0.55); }
dialog[open] { animation: pencere 260ms var(--ease-out); }
@keyframes pencere { from { opacity: 0; transform: translateY(8px) scale(0.98); } }
dialog h2 { font-size: 1.5rem; }
dialog p { margin-top: 16px; color: var(--metin-2); }
dialog form { margin-top: 24px; }

/* ---------- duyarlı düzen ---------- */
@media (max-width: 1100px) {
  .menu ul { gap: 18px; }
  .menu a { font-size: 0.875rem; }
}
@media (max-width: 900px) {
  main > .hero { padding-left: 0; }
  .serit { position: relative; width: 100%; height: 64px; min-height: 0; flex-direction: row; }
  .serit-logo { width: 104px; padding: 8px 14px; }
  .serit-dokuma { box-shadow: inset 0 0 0 4px var(--yun); background-size: auto 220%; background-repeat: repeat; }
  .ust, .ust.sabit { position: fixed; top: 0; right: 0; left: auto; padding: 10px 12px; z-index: 45; gap: 10px; background: none; box-shadow: none; backdrop-filter: none; animation: none; }
  .ust.sabit { left: 0; background: var(--yun); box-shadow: 0 10px 30px -22px rgb(20 10 6 / 0.45); }
  .ust.sabit .ust-logo { width: 78px; }
  .dil { order: -1; border: 0; padding: 8px 10px; background: var(--yun); border-radius: 4px; }
  .menu-ac { display: grid; place-items: center; gap: 5px; width: 44px; height: 44px; border: 0; border-radius: 4px; background: var(--yun); cursor: pointer; }
  .menu-ac span:not(.gorunmez) { display: block; width: 20px; height: 2px; background: var(--murekkep); transition: transform 220ms var(--ease-out); }
  .menu-ac[aria-expanded="true"] span:nth-child(1) { transform: translateY(3.5px) rotate(45deg); }
  .menu-ac[aria-expanded="true"] span:nth-child(2) { transform: translateY(-3.5px) rotate(-45deg); }
  .menu ul { position: fixed; inset: 64px 0 auto 0; flex-direction: column; gap: 0; padding: 12px var(--kenar) 28px; background: var(--yun); box-shadow: 0 20px 40px -24px rgb(20 10 6 / 0.45);
    opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out), visibility 0s 200ms; }
  .menu ul.acik { opacity: 1; visibility: visible; transform: none; transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out); }
  .menu ul a { display: block; padding: 14px 0; font-size: 1.125rem; border-bottom: 1px solid color-mix(in oklab, var(--murekkep) 14%, transparent); background: none; }
  .hero { grid-template-columns: 1fr; grid-template-rows: auto auto auto; min-height: 0; }
  .hero .hero-gorsel { grid-row: 1; margin-left: 0; aspect-ratio: 4 / 3; }
  .hero-gorsel img { -webkit-mask-image: linear-gradient(to top, transparent 0, #000 30%); mask-image: linear-gradient(to top, transparent 0, #000 30%); }
  .hero .hero-metin { grid-row: 2; padding: 0 var(--kenar) 40px; margin-top: -48px; }
  .hero-alanlar { grid-row: 3; grid-template-columns: 1fr; }
  .hero-alanlar a { height: 140px; }
  .hikaye-govde, .bolum-bas, .surdur-govde, .iletisim-govde, .alan-liste li { grid-template-columns: 1fr; }
  .hikaye-medya { display: none; }
  .hikaye-bolumler li { min-height: 0; opacity: 1; padding: 0 0 56px; }
  .hikaye-mobil { display: block; aspect-ratio: 3 / 2; overflow: hidden; margin-bottom: 22px; }
  .hikaye-mobil img { width: 100%; height: 100%; object-fit: cover; }
  .alan-liste li:nth-child(even) figure { order: 0; }
  .degerler { grid-template-columns: 1fr 1fr; }
  .degerler li, .degerler li + li { padding: 24px 16px 24px 0; border-left: 0; border-bottom: 1px solid color-mix(in oklab, var(--yun) 30%, transparent); }
  .surdur-govde figure { position: static; aspect-ratio: 3 / 2; }
  .kariyer { min-height: 0; }
  .kariyer > figure { grid-area: auto; aspect-ratio: 3 / 2; }
  .kariyer-kutu { grid-area: auto; margin: 0 !important; max-width: none !important; }
  .form { grid-template-columns: 1fr; }
  .alt { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .ilkeler { grid-template-columns: 1fr; }
  .degerler { grid-template-columns: 1fr; }
  .hero-alanlar a { height: 150px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .acilis { display: none; }
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}