/* ============================================================================
   İLK YARDIM EĞİTİM MERKEZİ — Özel Tema (Canvas dokusu)
   Sade · Foto-odaklı · Kenarlıksız temiz kartlar · Tek vurgu · Bol boşluk.
   Bağımlılıksız (SVG ikonlar gömülü). (2026-07-23)
   ============================================================================ */

/* ---------- 1) Tokenlar ---------- */
:root {
  --iu-primary: #1C9DD8;         /* ana vurgu (logo mavisi) */
  --iu-primary-dark: #1683B8;
  --iu-primary-soft: #EAF6FC;
  --iu-accent: #F07E1B;          /* ikincil vurgu (logo turuncusu) — az kullanılır */
  --iu-accent-dark: #DC6E10;
  --iu-accent-soft: #FDF1E5;

  --iu-ink: #1E2733;             /* başlık/koyu metin */
  --iu-body: #48525E;            /* gövde metin */
  --iu-muted: #8A93A0;           /* ikincil/gri metin */
  --iu-bg: #FFFFFF;
  --iu-surface: #FFFFFF;         /* kart/yüzey (dark modda koyulaşır) */
  --iu-bg-alt: #F6F8FA;          /* açık gri bölüm */
  --iu-line: #E8EBEF;
  --iu-dark: #17222E;            /* koyu bölüm zemini */
  --iu-star: #F4C150;

  --iu-r-sm: 6px;
  --iu-r: 10px;
  --iu-r-lg: 14px;
  --iu-container: 1200px;

  --iu-shadow-sm: 0 2px 6px rgba(20,35,55,.05);
  --iu-shadow: 0 14px 34px -14px rgba(20,35,55,.18);
  --iu-shadow-lg: 0 26px 60px -24px rgba(20,35,55,.28);

  --iu-font-head: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --iu-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ---------- 1b) Dark mod — Manegix `.dark` class (data-theme = önizleme toggle) ---------- */
.dark, :root[data-theme="dark"] {
  --iu-primary: #34ABE0;
  --iu-primary-dark: #1C9DD8;
  --iu-primary-soft: #12303F;
  --iu-accent: #FF8C3A;
  --iu-accent-dark: #F07E1B;
  --iu-accent-soft: #33251A;
  --iu-ink: #EDF1F6;
  --iu-body: #B8C2CE;
  --iu-muted: #808C9A;
  --iu-bg: #0E141B;
  --iu-surface: #18222E;
  --iu-bg-alt: #131C25;
  --iu-line: #27323E;
  --iu-line-strong: #37454F;
  --iu-dark: #090E14;
  --iu-shadow-sm: 0 2px 6px rgba(0,0,0,.35);
  --iu-shadow: 0 14px 34px -14px rgba(0,0,0,.55);
  --iu-shadow-lg: 0 26px 60px -24px rgba(0,0,0,.68);
}

/* ---------- 2) Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
body.iu-theme {
  margin: 0; font-family: var(--iu-font-body); font-size: 16px; line-height: 1.65;
  color: var(--iu-body); background: var(--iu-bg); -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
.iu-theme img { max-width: 100%; height: auto; display: block; }
.iu-theme a { color: inherit; text-decoration: none; }
.iu-theme h1, .iu-theme h2, .iu-theme h3, .iu-theme h4, .iu-theme h5 {
  font-family: var(--iu-font-head); color: var(--iu-ink); line-height: 1.22; margin: 0 0 .5em; font-weight: 600; letter-spacing: -.015em; text-wrap: balance;
}
.iu-theme h1 { font-size: clamp(2.15rem, 3.8vw, 3.05rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.14; }
.iu-theme h2 { font-size: clamp(1.6rem, 2.6vw, 2.15rem); font-weight: 700; letter-spacing: -.022em; }
.iu-theme h3 { font-size: clamp(1.1rem, 1.5vw, 1.28rem); font-weight: 600; }
.iu-theme p { margin: 0 0 1rem; }

/* İkonlar (gömülü SVG — CSS mask, currentColor) */
.iu-ic { width: 1.35em; height: 1.35em; display: inline-block; vertical-align: -.28em; flex: none; background-color: currentColor; -webkit-mask: var(--m) center/contain no-repeat; mask: var(--m) center/contain no-repeat; }
.iu-ic--arrow-right{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M1%208a.5.5%200%200%201%20.5-.5h11.793l-3.147-3.146a.5.5%200%200%201%20.708-.708l4%204a.5.5%200%200%201%200%20.708l-4%204a.5.5%200%200%201-.708-.708L13.293%208.5H1.5A.5.5%200%200%201%201%208%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--check{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M12.736%203.97a.733.733%200%200%201%201.047%200c.286.289.29.756.01%201.05L7.88%2012.01a.733.733%200%200%201-1.065.02L3.217%208.384a.757.757%200%200%201%200-1.06.733.733%200%200%201%201.047%200l3.052%203.093%205.4-6.425z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--clock{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M8%203.5a.5.5%200%200%200-1%200V9a.5.5%200%200%200%20.252.434l3.5%202a.5.5%200%200%200%20.496-.868L8%208.71z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8%2016A8%208%200%201%200%208%200a8%208%200%200%200%200%2016m7-8A7%207%200%201%201%201%208a7%207%200%200%201%2014%200%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--calendar{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M14%200H2a2%202%200%200%200-2%202v12a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V2a2%202%200%200%200-2-2M1%203.857C1%203.384%201.448%203%202%203h12c.552%200%201%20.384%201%20.857v10.286c0%20.473-.448.857-1%20.857H2c-.552%200-1-.384-1-.857z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M6.5%207a1%201%200%201%200%200-2%201%201%200%200%200%200%202m3%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202m3%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202m-9%203a1%201%200%201%200%200-2%201%201%200%200%200%200%202m3%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202m3%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202m3%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202m-9%203a1%201%200%201%200%200-2%201%201%200%200%200%200%202m3%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202m3%200a1%201%200%201%200%200-2%201%201%200%200%200%200%202%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--phone{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M3.654%201.328a.678.678%200%200%200-1.015-.063L1.605%202.3c-.483.484-.661%201.169-.45%201.77a17.6%2017.6%200%200%200%204.168%206.608%2017.6%2017.6%200%200%200%206.608%204.168c.601.211%201.286.033%201.77-.45l1.034-1.034a.678.678%200%200%200-.063-1.015l-2.307-1.794a.68.68%200%200%200-.58-.122l-2.19.547a1.75%201.75%200%200%201-1.657-.459L5.482%208.062a1.75%201.75%200%200%201-.46-1.657l.548-2.19a.68.68%200%200%200-.122-.58zM1.884.511a1.745%201.745%200%200%201%202.612.163L6.29%202.98c.329.423.445.974.315%201.494l-.547%202.19a.68.68%200%200%200%20.178.643l2.457%202.457a.68.68%200%200%200%20.644.178l2.189-.547a1.75%201.75%200%200%201%201.494.315l2.306%201.794c.829.645.905%201.87.163%202.611l-1.034%201.034c-.74.74-1.846%201.065-2.877.702a18.6%2018.6%200%200%201-7.01-4.42%2018.6%2018.6%200%200%201-4.42-7.009c-.362-1.03-.037-2.137.703-2.877z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--mail{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M0%204a2%202%200%200%201%202-2h12a2%202%200%200%201%202%202v8a2%202%200%200%201-2%202H2a2%202%200%200%201-2-2zm2-1a1%201%200%200%200-1%201v.217l7%204.2%207-4.2V4a1%201%200%200%200-1-1zm13%202.383-4.708%202.825L15%2011.105zm-.034%206.876-5.64-3.471L8%209.583l-1.326-.795-5.64%203.47A1%201%200%200%200%202%2013h12a1%201%200%200%200%20.966-.741M1%2011.105l4.708-2.897L1%205.383z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--geo{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M12.166%208.94c-.524%201.062-1.234%202.12-1.96%203.07A32%2032%200%200%201%208%2014.58a32%2032%200%200%201-2.206-2.57c-.726-.95-1.436-2.008-1.96-3.07C3.304%207.867%203%206.862%203%206a5%205%200%200%201%2010%200c0%20.862-.305%201.867-.834%202.94M8%2016s6-5.686%206-10A6%206%200%200%200%202%206c0%204.314%206%2010%206%2010%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8%208a2%202%200%201%201%200-4%202%202%200%200%201%200%204m0%201a3%203%200%201%200%200-6%203%203%200%200%200%200%206%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--people{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M15%2014s1%200%201-1-1-4-5-4-5%203-5%204%201%201%201%201zm-7.978-1L7%2012.996c.001-.264.167-1.03.76-1.72C8.312%2010.629%209.282%2010%2011%2010c1.717%200%202.687.63%203.24%201.276.593.69.758%201.457.76%201.72l-.008.002-.014.002zM11%207a2%202%200%201%200%200-4%202%202%200%200%200%200%204m3-2a3%203%200%201%201-6%200%203%203%200%200%201%206%200M6.936%209.28a6%206%200%200%200-1.23-.247A7%207%200%200%200%205%209c-4%200-5%203-5%204q0%201%201%201h4.216A2.24%202.24%200%200%201%205%2013c0-1.01.377-2.042%201.09-2.904.243-.294.526-.569.846-.816M4.92%2010A5.5%205.5%200%200%200%204%2013H1c0-.26.164-1.03.76-1.724.545-.636%201.492-1.256%203.16-1.275ZM1.5%205.5a3%203%200%201%201%206%200%203%203%200%200%201-6%200m3-2a2%202%200%201%200%200%204%202%202%200%200%200%200-4%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--building{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M4%202.5a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%20.5.5v1a.5.5%200%200%201-.5.5h-1a.5.5%200%200%201-.5-.5zm3%200a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%20.5.5v1a.5.5%200%200%201-.5.5h-1a.5.5%200%200%201-.5-.5zm3.5-.5a.5.5%200%200%200-.5.5v1a.5.5%200%200%200%20.5.5h1a.5.5%200%200%200%20.5-.5v-1a.5.5%200%200%200-.5-.5zM4%205.5a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%20.5.5v1a.5.5%200%200%201-.5.5h-1a.5.5%200%200%201-.5-.5zM7.5%205a.5.5%200%200%200-.5.5v1a.5.5%200%200%200%20.5.5h1a.5.5%200%200%200%20.5-.5v-1a.5.5%200%200%200-.5-.5zm2.5.5a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%20.5.5v1a.5.5%200%200%201-.5.5h-1a.5.5%200%200%201-.5-.5zM4.5%208a.5.5%200%200%200-.5.5v1a.5.5%200%200%200%20.5.5h1a.5.5%200%200%200%20.5-.5v-1a.5.5%200%200%200-.5-.5zm2.5.5a.5.5%200%200%201%20.5-.5h1a.5.5%200%200%201%20.5.5v1a.5.5%200%200%201-.5.5h-1a.5.5%200%200%201-.5-.5zm3.5-.5a.5.5%200%200%200-.5.5v1a.5.5%200%200%200%20.5.5h1a.5.5%200%200%200%20.5-.5v-1a.5.5%200%200%200-.5-.5z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M2%201a1%201%200%200%201%201-1h10a1%201%200%200%201%201%201v14a1%201%200%200%201-1%201H3a1%201%200%200%201-1-1zm11%200H3v14h3v-2.5a.5.5%200%200%201%20.5-.5h3a.5.5%200%200%201%20.5.5V15h3z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--shield{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M5.338%201.59a61%2061%200%200%200-2.837.856.48.48%200%200%200-.328.39c-.554%204.157.726%207.19%202.253%209.188a10.7%2010.7%200%200%200%202.287%202.233c.346.244.652.42.893.533q.18.085.293.118a1%201%200%200%200%20.101.025%201%201%200%200%200%20.1-.025q.114-.034.294-.118c.24-.113.547-.29.893-.533a10.7%2010.7%200%200%200%202.287-2.233c1.527-1.997%202.807-5.031%202.253-9.188a.48.48%200%200%200-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552%201.29%208.531%201.067%208%201.067c-.53%200-1.552.223-2.662.524zM5.072.56C6.157.265%207.31%200%208%200s1.843.265%202.928.56c1.11.3%202.229.655%202.887.87a1.54%201.54%200%200%201%201.044%201.262c.596%204.477-.787%207.795-2.465%209.99a11.8%2011.8%200%200%201-2.517%202.453%207%207%200%200%201-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7%207%200%200%201-1.048-.625%2011.8%2011.8%200%200%201-2.517-2.453C1.928%2010.487.545%207.169%201.141%202.692A1.54%201.54%200%200%201%202.185%201.43%2063%2063%200%200%201%205.072.56%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M10.854%205.146a.5.5%200%200%201%200%20.708l-3%203a.5.5%200%200%201-.708%200l-1.5-1.5a.5.5%200%201%201%20.708-.708L7.5%207.793l2.646-2.647a.5.5%200%200%201%20.708%200%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--award{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M9.669.864%208%200%206.331.864l-1.858.282-.842%201.68-1.337%201.32L2.6%206l-.306%201.854%201.337%201.32.842%201.68%201.858.282L8%2012l1.669-.864%201.858-.282.842-1.68%201.337-1.32L13.4%206l.306-1.854-1.337-1.32-.842-1.68zm1.196%201.193.684%201.365%201.086%201.072L12.387%206l.248%201.506-1.086%201.072-.684%201.365-1.51.229L8%2010.874l-1.355-.702-1.51-.229-.684-1.365-1.086-1.072L3.614%206l-.25-1.506%201.087-1.072.684-1.365%201.51-.229L8%201.126l1.356.702z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M4%2011.794V16l4-1%204%201v-4.206l-2.018.306L8%2013.126%206.018%2012.1z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--mortarboard{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M8.211%202.047a.5.5%200%200%200-.422%200l-7.5%203.5a.5.5%200%200%200%20.025.917l7.5%203a.5.5%200%200%200%20.372%200L14%207.14V13a1%201%200%200%200-1%201v2h3v-2a1%201%200%200%200-1-1V6.739l.686-.275a.5.5%200%200%200%20.025-.917zM8%208.46%201.758%205.965%208%203.052l6.242%202.913z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M4.176%209.032a.5.5%200%200%200-.656.327l-.5%201.7a.5.5%200%200%200%20.294.605l4.5%201.8a.5.5%200%200%200%20.372%200l4.5-1.8a.5.5%200%200%200%20.294-.605l-.5-1.7a.5.5%200%200%200-.656-.327L8%2010.466zm-.068%201.873.22-.748%203.496%201.311a.5.5%200%200%200%20.352%200l3.496-1.311.22.748L8%2012.46z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--heart{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22m8%202.748-.717-.737C5.6.281%202.514.878%201.4%203.053.918%203.995.78%205.323%201.508%207H.43c-2.128-5.697%204.165-8.83%207.394-5.857q.09.083.176.171a3%203%200%200%201%20.176-.17c3.23-2.974%209.522.159%207.394%205.856h-1.078c.728-1.677.59-3.005.108-3.947C13.486.878%2010.4.28%208.717%202.01zM2.212%2010h1.315C4.593%2011.183%206.05%2012.458%208%2013.795c1.949-1.337%203.407-2.612%204.473-3.795h1.315c-1.265%201.566-3.14%203.25-5.788%205-2.648-1.75-4.523-3.434-5.788-5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M10.464%203.314a.5.5%200%200%200-.945.049L7.921%208.956%206.464%205.314a.5.5%200%200%200-.88-.091L3.732%208H.5a.5.5%200%200%200%200%201H4a.5.5%200%200%200%20.416-.223l1.473-2.209%201.647%204.118a.5.5%200%200%200%20.945-.049l1.598-5.593%201.457%203.642A.5.5%200%200%200%2012%209h3.5a.5.5%200%200%200%200-1h-3.162z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--graph{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M0%200h1v15h15v1H0zm10%203.5a.5.5%200%200%201%20.5-.5h4a.5.5%200%200%201%20.5.5v4a.5.5%200%200%201-1%200V4.9l-3.613%204.417a.5.5%200%200%201-.74.037L7.06%206.767l-3.656%205.027a.5.5%200%200%201-.808-.588l4-5.5a.5.5%200%200%201%20.758-.06l2.609%202.61L13.445%204H10.5a.5.5%200%200%201-.5-.5%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--clipboard{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M9.5%200a.5.5%200%200%201%20.5.5.5.5%200%200%200%20.5.5.5.5%200%200%201%20.5.5V2a.5.5%200%200%201-.5.5h-5A.5.5%200%200%201%205%202v-.5a.5.5%200%200%201%20.5-.5.5.5%200%200%200%20.5-.5.5.5%200%200%201%20.5-.5z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M3%202.5a.5.5%200%200%201%20.5-.5H4a.5.5%200%200%200%200-1h-.5A1.5%201.5%200%200%200%202%202.5v12A1.5%201.5%200%200%200%203.5%2016h9a1.5%201.5%200%200%200%201.5-1.5v-12A1.5%201.5%200%200%200%2012.5%201H12a.5.5%200%200%200%200%201h.5a.5.5%200%200%201%20.5.5v12a.5.5%200%200%201-.5.5h-9a.5.5%200%200%201-.5-.5z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M9.979%205.356a.5.5%200%200%200-.968.04L7.92%2010.49l-.94-3.135a.5.5%200%200%200-.926-.08L4.69%2010H4.5a.5.5%200%200%200%200%201H5a.5.5%200%200%200%20.447-.276l.936-1.873%201.138%203.793a.5.5%200%200%200%20.968-.04L9.58%207.51l.94%203.135A.5.5%200%200%200%2011%2011h.5a.5.5%200%200%200%200-1h-.128z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--cross{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M8%202a.5.5%200%200%201%20.5.5v5h5a.5.5%200%200%201%200%201h-5v5a.5.5%200%200%201-1%200v-5h-5a.5.5%200%200%201%200-1h5v-5A.5.5%200%200%201%208%202%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--chat{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M5%208a1%201%200%201%201-2%200%201%201%200%200%201%202%200m4%200a1%201%200%201%201-2%200%201%201%200%200%201%202%200m3%201a1%201%200%201%200%200-2%201%201%200%200%200%200%202%22%2F%3E%0A%20%20%3Cpath%20d%3D%22m2.165%2015.803.02-.004c1.83-.363%202.948-.842%203.468-1.105A9%209%200%200%200%208%2015c4.418%200%208-3.134%208-7s-3.582-7-8-7-8%203.134-8%207c0%201.76.743%203.37%201.97%204.6a10.4%2010.4%200%200%201-.524%202.318l-.003.011a11%2011%200%200%201-.244.637c-.079.186.074.394.273.362a22%2022%200%200%200%20.693-.125m.8-3.108a1%201%200%200%200-.287-.801C1.618%2010.83%201%209.468%201%208c0-3.192%203.004-6%207-6s7%202.808%207%206-3.004%206-7%206a8%208%200%200%201-2.088-.272%201%201%200%200%200-.711.074c-.387.196-1.24.57-2.634.893a11%2011%200%200%200%20.398-2%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--clock2{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M8.515%201.019A7%207%200%200%200%208%201V0a8%208%200%200%201%20.589.022zm2.004.45a7%207%200%200%200-.985-.299l.219-.976q.576.129%201.126.342zm1.37.71a7%207%200%200%200-.439-.27l.493-.87a8%208%200%200%201%20.979.654l-.615.789a7%207%200%200%200-.418-.302zm1.834%201.79a7%207%200%200%200-.653-.796l.724-.69q.406.429.747.91zm.744%201.352a7%207%200%200%200-.214-.468l.893-.45a8%208%200%200%201%20.45%201.088l-.95.313a7%207%200%200%200-.179-.483m.53%202.507a7%207%200%200%200-.1-1.025l.985-.17q.1.58.116%201.17zm-.131%201.538q.05-.254.081-.51l.993.123a8%208%200%200%201-.23%201.155l-.964-.267q.069-.247.12-.501m-.952%202.379q.276-.436.486-.908l.914.405q-.24.54-.555%201.038zm-.964%201.205q.183-.183.35-.378l.758.653a8%208%200%200%201-.401.432z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M8%201a7%207%200%201%200%204.95%2011.95l.707.707A8.001%208.001%200%201%201%208%200z%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M7.5%203a.5.5%200%200%201%20.5.5v5.21l3.248%201.856a.5.5%200%200%201-.496.868l-3.5-2A.5.5%200%200%201%207%209V3.5a.5.5%200%200%201%20.5-.5%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--star{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M3.612%2015.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173%206.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927%200l2.184%204.327%204.898.696c.441.062.612.636.282.95l-3.522%203.356.83%204.73c.078.443-.36.79-.746.592L8%2013.187l-4.389%202.256z%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--play{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22m11.596%208.697-6.363%203.692c-.54.313-1.233-.066-1.233-.697V4.308c0-.63.692-1.01%201.233-.696l6.363%203.692a.802.802%200%200%201%200%201.393%22%2F%3E%3C%2Fsvg%3E")}
.iu-ic--search{--m:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2016%2016%27%20fill%3D%27black%27%3E%3Cpath%20d%3D%22M11.742%2010.344a6.5%206.5%200%201%200-1.397%201.398h-.001q.044.06.098.115l3.85%203.85a1%201%200%200%200%201.415-1.414l-3.85-3.85a1%201%200%200%200-.115-.1zM12%206.5a5.5%205.5%200%201%201-11%200%205.5%205.5%200%200%201%2011%200%22%2F%3E%3C%2Fsvg%3E")}

/* ---------- 2b) Bootstrap Icons (builder ikon seçici / nsicon) ----------
   Düzenlenebilir ikonlar bi-font (ns-icons.css) ile gelir; sabit ikonlar mask (.iu-ic).
   Boyut mask'takiyle birebir: .iu-ic width/height -> .bi font-size karşılığı. */
.bi { font-size: 1.35em; line-height: 1; vertical-align: -.125em; }
.iu-btn .bi { font-size: 1.15em; }
.iu-card__icon .bi { font-size: 27px; }
.iu-stat__ic .bi { font-size: 21px; }
.iu-num__ic .bi { font-size: 27px; }
.iu-showcase__badge-ic .bi { font-size: 24px; }
.iu-feat__ic .bi { font-size: 24px; }
.iu-hero__float-ic .bi { font-size: 24px; }
.iu-tile__overlay .bi { font-size: 26px; }
.iu-htile__ic .bi { font-size: 24px; }
.iu-logo .bi { font-size: 1.5em; color: var(--iu-primary); }

/* ---------- 3) Yerleşim ---------- */
.iu-container { max-width: var(--iu-container); margin: 0 auto; padding: 0 24px; }
.iu-section { padding: clamp(60px, 7vw, 96px) 0; }
.iu-section--alt { background: var(--iu-bg-alt); }
.iu-grid { display: grid; gap: 28px; }
@media (min-width: 640px) { .iu-grid--2 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) {
  .iu-grid--3 { grid-template-columns: repeat(3, 1fr); }
  .iu-grid--4 { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- 4) Bölüm başlığı (heading-block) ---------- */
.iu-heading { max-width: 680px; margin: 0 auto 56px; text-align: center; }
.iu-heading--left { margin-left: 0; text-align: left; }
.iu-eyebrow { display: inline-block; font-family: var(--iu-font-head); font-weight: 700; font-size: .78rem; letter-spacing: 2.5px; text-transform: uppercase; color: var(--iu-primary); margin-bottom: 14px; }
.iu-eyebrow--accent { color: var(--iu-accent); }
.iu-heading h2 { margin: 0 0 .5rem; }
.iu-heading p { color: var(--iu-muted); font-size: 1.08rem; margin: 0; }

/* ---------- 5) Butonlar ---------- */
.iu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-family: var(--iu-font-head); font-weight: 500; font-size: 1rem; padding: 12px 26px; border-radius: 6px; border: 1.5px solid transparent; cursor: pointer; transition: background .2s, color .2s, border-color .2s, box-shadow .2s, transform .2s; }
.iu-btn .iu-ic { width: 1.15em; height: 1.15em; }
.iu-btn__arrow { transition: transform .2s ease; }
.iu-btn:hover .iu-btn__arrow { transform: translateX(3px); }
.iu-btn--primary { background: var(--iu-primary); color: #fff; }
.iu-btn--primary:hover { background: var(--iu-primary-dark); box-shadow: var(--iu-shadow); transform: translateY(-1px); }
.iu-btn--accent { background: var(--iu-accent); color: #fff; }
.iu-btn--accent:hover { background: var(--iu-accent-dark); box-shadow: var(--iu-shadow); transform: translateY(-1px); }
.iu-btn--outline { background: transparent; color: var(--iu-ink); border-color: var(--iu-line); }
.iu-btn--outline:hover { border-color: var(--iu-primary); color: var(--iu-primary); }
.iu-btn--light { background: #fff; color: var(--iu-primary); }
.iu-btn--light:hover { box-shadow: var(--iu-shadow); transform: translateY(-1px); }
.iu-btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.4); }
.iu-btn--ghost-light:hover { background: rgba(255,255,255,.12); border-color: #fff; }
.iu-btn--sm { padding: 10px 18px; font-size: .9rem; }
.iu-btn-play { display: inline-flex; align-items: center; gap: 13px; font-family: var(--iu-font-head); font-weight: 600; color: var(--iu-ink); }
.iu-btn-play__ring { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--iu-accent-soft); color: var(--iu-accent); transition: transform .2s ease; }
.iu-btn-play__ring .iu-ic { width: 1em; height: 1em; }
.iu-btn-play:hover .iu-btn-play__ring { transform: scale(1.06); }

/* ---------- 6) Güven ---------- */
.iu-stars { display: inline-flex; align-items: center; gap: 1px; color: var(--iu-star); }
.iu-stars .iu-ic { width: 1em; height: 1em; }
.iu-avatars { display: inline-flex; align-items: center; }
.iu-avatars span { width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--iu-surface); margin-left: -11px; display: flex; align-items: center; justify-content: center; font-family: var(--iu-font-head); font-weight: 700; font-size: .82rem; color: #fff; box-shadow: var(--iu-shadow-sm); }
.iu-avatars span:first-child { margin-left: 0; }
.iu-avatars span:nth-child(3n+1) { background: var(--iu-primary); }
.iu-avatars span:nth-child(3n+2) { background: var(--iu-accent); }
.iu-avatars span:nth-child(3n) { background: #2C3E50; }
.iu-avatars .iu-avatars__more { background: var(--iu-primary-soft) !important; color: var(--iu-primary-dark); }

/* ---------- 7) Kartlar (kenarlıksız, hover'da yükselir) ---------- */
.iu-card { background: var(--iu-surface); border: 1px solid var(--iu-line); border-radius: var(--iu-r-lg); padding: 36px 30px; height: 100%; transition: transform .3s ease, box-shadow .3s ease; }
.iu-card:hover { transform: translateY(-6px); box-shadow: var(--iu-shadow-lg); }
.iu-card__icon { width: 58px; height: 58px; border-radius: var(--iu-r); display: flex; align-items: center; justify-content: center; margin-bottom: 22px; background: var(--iu-primary-soft); color: var(--iu-primary); }
.iu-card__icon .iu-ic { width: 27px; height: 27px; }
.iu-card--accent .iu-card__icon { background: var(--iu-accent-soft); color: var(--iu-accent); }
.iu-card h3 { font-size: 1.22rem; margin-bottom: .5rem; }
.iu-card p { color: var(--iu-muted); margin: 0; }

/* Kurs kartı (Canvas: foto üstte, kenarlıksız) */
.iu-course { position: relative; background: var(--iu-surface); border: 1px solid var(--iu-line); border-radius: var(--iu-r-lg); overflow: hidden; display: flex; flex-direction: column; height: 100%; box-shadow: var(--iu-shadow-sm); transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.iu-course:hover { transform: translateY(-6px); box-shadow: var(--iu-shadow-lg); }
.iu-course__media { position: relative; aspect-ratio: 16/10; overflow: hidden; background: var(--iu-bg-alt); }
.iu-course__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.iu-course:hover .iu-course__media img { transform: scale(1.05); }
.iu-ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--iu-bg-alt); color: #C4CDD6; }
.iu-ph .iu-ic { width: 40px; height: 40px; }
.iu-ph--dark { background: #E6EBF0; }
.iu-course__tag { position: absolute; top: 14px; left: 14px; z-index: 2; background: var(--iu-surface); color: var(--iu-ink); font-family: var(--iu-font-head); font-weight: 600; font-size: .74rem; padding: 5px 12px; border-radius: var(--iu-r-sm); box-shadow: var(--iu-shadow-sm); }
.iu-course__tag:empty { display: none; }
.iu-course__body { padding: 22px 24px 24px; display: flex; flex-direction: column; flex: 1; }
.iu-course__cat { font-family: var(--iu-font-head); text-transform: uppercase; letter-spacing: 1.3px; font-size: .7rem; font-weight: 600; color: var(--iu-muted); margin-bottom: 9px; }
.iu-course__rating { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 10px; font-size: .86rem; color: var(--iu-muted); font-weight: 700; }
.iu-course h3 { font-size: 1.15rem; margin-bottom: .4rem; }
.iu-course__body p { color: var(--iu-muted); font-size: .95rem; margin: 0; }
.iu-course__foot { margin-top: 20px; padding-top: 18px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--iu-line); }
.iu-course__price { font-family: var(--iu-font-head); font-weight: 700; font-size: .95rem; color: var(--iu-primary-dark); background: var(--iu-primary-soft); padding: 6px 14px; border-radius: var(--iu-r-sm); }
.iu-course__meta { display: inline-flex; align-items: center; gap: 6px; color: var(--iu-muted); font-size: .86rem; font-weight: 600; }
.iu-course__meta .iu-ic { width: 1.05em; height: 1.05em; }
.iu-course--featured { border: 2px solid var(--iu-primary); box-shadow: var(--iu-shadow); }
.iu-course__ribbon { position: absolute; top: 14px; right: 14px; z-index: 2; background: var(--iu-accent); color: #fff; font-family: var(--iu-font-head); font-weight: 600; font-size: .72rem; padding: 5px 12px; border-radius: var(--iu-r-sm); }
.iu-course:not(.iu-course--featured) .iu-course__ribbon { display: none; }

/* Onay rozeti (hero) */
.iu-badge { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: .92rem; color: var(--iu-body); }
.iu-badge .iu-ic { width: 1.2em; height: 1.2em; color: var(--iu-primary); }

/* ---------- 8) İstatistik ---------- */
.iu-stat { text-align: center; position: relative; }
.iu-stat__ic { width: 44px; height: 44px; margin: 0 auto 13px; border-radius: var(--iu-r-sm); background: rgba(255,255,255,.15); color: #fff; display: flex; align-items: center; justify-content: center; }
.iu-stat__ic .iu-ic { width: 21px; height: 21px; }
.iu-stat__num { font-family: var(--iu-font-head); font-weight: 700; font-size: clamp(1.85rem, 3.2vw, 2.4rem); color: #fff; line-height: 1; letter-spacing: -.02em; }
.iu-stat__label { color: rgba(255,255,255,.74); font-weight: 500; font-size: .92rem; margin-top: 5px; }

/* ---------- 9a) Üst bar ---------- */
.iu-topbar { background: var(--iu-dark); color: #B7C0CC; font-size: .86rem; }
.iu-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; flex-wrap: wrap; }
.iu-topbar__contact { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.iu-topbar__contact a { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.iu-topbar__contact a:hover { color: #fff; }
.iu-topbar__contact .iu-ic { width: 1.05em; height: 1.05em; color: var(--iu-primary); }
.iu-topbar__social { display: flex; align-items: center; gap: 14px; }
.iu-topbar__social a { color: #B7C0CC; font-weight: 700; font-size: .82rem; text-transform: lowercase; }
.iu-topbar__social a:hover { color: var(--iu-accent); }
@media (max-width: 640px) { .iu-topbar__social { display: none; } }

/* ---------- 9b) Header ---------- */
.iu-header { position: sticky; top: 0; z-index: 100; background: var(--iu-surface); border-bottom: 1px solid var(--iu-line); transition: box-shadow .3s ease; }
.iu-header--scrolled { box-shadow: var(--iu-shadow-sm); }
.iu-header__bar { display: flex; align-items: center; justify-content: space-between; height: 92px; gap: 24px; }
.iu-header__logo img { max-height: 46px; width: auto; }
.iu-header__actions { display: flex; align-items: center; gap: 14px; }
@media (max-width: 560px) { .iu-header__cta { display: none; } }
.iu-nav { display: none; }
@media (min-width: 992px) { .iu-nav { display: block; } }
.iu-nav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; }
.iu-nav__item { position: relative; }
.iu-nav__item > a { display: inline-flex; align-items: center; gap: 6px; font-family: var(--iu-font-head); font-weight: 600; font-size: .96rem; color: var(--iu-ink); padding: 10px 15px; border-radius: var(--iu-r-sm); transition: color .2s; }
.iu-nav__item > a:hover { color: var(--iu-primary); }
.iu-nav__caret { font-size: .7em; opacity: .6; }
.iu-nav__sub { list-style: none; margin: 0; padding: 8px; position: absolute; top: calc(100% + 6px); left: 0; min-width: 228px; background: var(--iu-surface); border: 1px solid var(--iu-line); border-radius: var(--iu-r); box-shadow: var(--iu-shadow-lg); opacity: 0; visibility: hidden; transform: translateY(6px); transition: all .2s ease; z-index: 20; }
.iu-nav__item--has:hover .iu-nav__sub { opacity: 1; visibility: visible; transform: translateY(0); }
.iu-nav__sub a { display: block; padding: 10px 14px; border-radius: var(--iu-r-sm); font-weight: 600; color: var(--iu-body); }
.iu-nav__sub a:hover { background: var(--iu-primary-soft); color: var(--iu-primary); }
.iu-burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 46px; height: 46px; padding: 0 12px; border: 1px solid var(--iu-line); border-radius: var(--iu-r-sm); background: var(--iu-surface); cursor: pointer; }
.iu-burger span { height: 2px; background: var(--iu-ink); border-radius: 2px; }
@media (min-width: 992px) { .iu-burger { display: none; } }

/* ---------- 9c) Mobil menü ---------- */
.iu-mobile-nav { position: fixed; inset: 0; z-index: 200; visibility: hidden; }
.iu-mobile-nav::before { content: ""; position: absolute; inset: 0; background: rgba(23,34,46,.5); opacity: 0; transition: opacity .3s ease; }
.iu-mobile-nav__panel { position: absolute; top: 0; right: 0; height: 100%; width: min(340px, 88vw); background: var(--iu-surface); box-shadow: var(--iu-shadow-lg); padding: 22px; overflow-y: auto; transform: translateX(100%); transition: transform .32s cubic-bezier(.4,0,.2,1); display: flex; flex-direction: column; }
body.iu-menu-open .iu-mobile-nav { visibility: visible; }
body.iu-menu-open .iu-mobile-nav::before { opacity: 1; }
body.iu-menu-open .iu-mobile-nav__panel { transform: translateX(0); }
.iu-mobile-nav__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--iu-line); }
.iu-mobile-nav__logo { max-height: 42px; width: auto; }
.iu-mobile-nav__close { border: 0; background: var(--iu-bg-alt); width: 42px; height: 42px; border-radius: var(--iu-r-sm); font-size: 26px; line-height: 1; color: var(--iu-ink); cursor: pointer; }
.iu-mobile-nav .iu-nav__list { flex-direction: column; align-items: stretch; gap: 2px; }
.iu-mobile-nav .iu-nav__item > a { padding: 13px 14px; }
.iu-mobile-nav .iu-nav__caret { display: none; }
.iu-mobile-nav .iu-nav__sub { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 0 0 6px 12px; min-width: 0; }
.iu-mobile-nav__contact { margin-top: auto; padding-top: 20px; }

/* ---------- 10) Footer ---------- */
.iu-footer { background: var(--iu-dark); color: #A8B2BF; }
.iu-footer__top { padding: 72px 0 48px; display: grid; gap: 40px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .iu-footer__top { grid-template-columns: 1.7fr 1fr 1.2fr; } }
.iu-footer__logo img { max-height: 50px; width: auto; margin-bottom: 18px; }
.iu-footer__brand p { color: #8994A2; max-width: 350px; }
.iu-footer__social { display: flex; gap: 10px; margin-top: 20px; }
.iu-footer__social a { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: var(--iu-r-sm); background: rgba(255,255,255,.06); font-family: var(--iu-font-head); font-weight: 700; font-size: .8rem; text-transform: lowercase; transition: background .2s; }
.iu-footer__social a:hover { background: var(--iu-primary); color: #fff; }
.iu-footer h4 { color: #fff; font-size: 1rem; margin-bottom: 20px; }
.iu-footer a:hover { color: #fff; }
.iu-footer__links, .iu-footer__info { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.iu-footer__info li { display: flex; align-items: flex-start; gap: 11px; color: #8994A2; }
.iu-footer__info li .iu-ic { flex: none; width: 1.15em; height: 1.15em; color: var(--iu-primary); margin-top: .3em; }
.iu-footer__bar { border-top: 1px solid rgba(255,255,255,.09); padding: 22px 0; text-align: center; font-size: .88rem; color: #7A8493; }

/* ---------- 10b) Yukarı çık ---------- */
.iu-to-top { position: fixed; right: 24px; bottom: 24px; width: 46px; height: 46px; border-radius: var(--iu-r); background: var(--iu-primary); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: var(--iu-shadow); z-index: 90; opacity: 0; visibility: hidden; transform: translateY(10px); transition: all .3s ease; }
.iu-to-top.iu-show { opacity: 1; visibility: visible; transform: none; }
.iu-to-top:hover { background: var(--iu-primary-dark); }

/* ---------- 11) Reveal ---------- */
[data-iu-reveal] { opacity: 0; transform: translateY(24px) scale(.99); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); will-change: opacity, transform; }
[data-iu-reveal].iu-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-iu-reveal] { opacity: 1; transform: none; transition: none; } }

/* ============================================================================
   12) BÖLÜMLER
   ============================================================================ */

/* ---- Hero ---- */
.iu-hero { padding: clamp(52px, 6vw, 92px) 0 clamp(60px, 7vw, 100px); background: var(--iu-bg-alt); border-bottom: 1px solid var(--iu-line); }
.iu-hero__inner { display: grid; gap: 48px; align-items: center; grid-template-columns: 1fr; }
@media (min-width: 992px) { .iu-hero__inner { grid-template-columns: 1.05fr .95fr; gap: 60px; } }
.iu-hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; font-family: var(--iu-font-head); font-weight: 700; font-size: .8rem; letter-spacing: 2px; text-transform: uppercase; color: var(--iu-accent); margin-bottom: 18px; }
.iu-hero__eyebrow .iu-ic { width: 1.2em; height: 1.2em; }
.iu-hero__title { margin-bottom: 20px; }
.iu-hero__title .iu-hl { color: var(--iu-primary); }
.iu-hero__lead { color: var(--iu-body); font-size: 1.16rem; max-width: 540px; margin: 0 0 30px; }
.iu-hero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.iu-hero__trust { display: flex; align-items: center; gap: 16px; margin-top: 34px; flex-wrap: wrap; }
.iu-hero__trust-text { font-size: .92rem; color: var(--iu-muted); line-height: 1.4; }
.iu-hero__trust-text strong { display: block; color: var(--iu-ink); font-family: var(--iu-font-head); font-size: 1.02rem; }
.iu-hero__badges { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 20px; }

.iu-hero__media { position: relative; }
.iu-hero__frame { position: relative; border-radius: var(--iu-r-lg); overflow: hidden; box-shadow: var(--iu-shadow-lg); aspect-ratio: 4/4.2; max-width: 500px; margin-inline: auto; background: var(--iu-surface); }
.iu-hero__frame img { width: 100%; height: 100%; object-fit: cover; }
.iu-hero__frame .iu-ph { color: #C4CDD6; }
.iu-hero__frame .iu-ph .iu-ic { width: 68px; height: 68px; }
.iu-hero__float { position: absolute; left: 18px; bottom: 18px; right: 18px; background: var(--iu-surface); border-radius: var(--iu-r); box-shadow: var(--iu-shadow-lg); padding: 16px 18px; display: flex; align-items: center; gap: 14px; }
.iu-hero__float-ic { width: 46px; height: 46px; border-radius: var(--iu-r-sm); background: var(--iu-accent-soft); color: var(--iu-accent); display: flex; align-items: center; justify-content: center; flex: none; }
.iu-hero__float-ic .iu-ic { width: 24px; height: 24px; }
.iu-hero__float-num { font-family: var(--iu-font-head); font-weight: 800; color: var(--iu-ink); font-size: 1.15rem; line-height: 1.1; }
.iu-hero__float-label { font-size: .84rem; color: var(--iu-muted); font-weight: 600; }

/* ---- İstatistik bandı ---- */
.iu-stats-band { background: var(--iu-primary); padding: clamp(40px, 5vw, 62px) 0; }
.iu-stats-band .iu-grid { gap: 20px; }
@media (min-width: 900px) {
  .iu-stats-band .iu-stat:not(:last-child)::after { content: ""; position: absolute; right: -10px; top: 18%; height: 64%; width: 1px; background: rgba(255,255,255,.20); }
}

/* ---- Neden biz: görsel + özellik listesi ---- */
.iu-showcase { display: grid; gap: 48px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 992px) { .iu-showcase { grid-template-columns: .95fr 1.05fr; gap: 64px; } }
.iu-showcase__visual { position: relative; }
.iu-showcase__frame { border-radius: var(--iu-r-lg); overflow: hidden; box-shadow: var(--iu-shadow-lg); aspect-ratio: 4/3.4; background: var(--iu-surface); }
.iu-showcase__frame img { width: 100%; height: 100%; object-fit: cover; }
.iu-showcase__frame .iu-ph .iu-ic { width: 64px; height: 64px; }
.iu-showcase__badge { position: absolute; right: -14px; bottom: -14px; background: var(--iu-surface); border-radius: var(--iu-r); box-shadow: var(--iu-shadow-lg); padding: 16px 20px; display: flex; align-items: center; gap: 13px; }
.iu-showcase__badge-ic { width: 46px; height: 46px; border-radius: var(--iu-r-sm); background: var(--iu-primary-soft); color: var(--iu-primary); display: flex; align-items: center; justify-content: center; flex: none; }
.iu-showcase__badge-ic .iu-ic { width: 24px; height: 24px; }
.iu-showcase__badge-num { font-family: var(--iu-font-head); font-weight: 800; color: var(--iu-ink); font-size: 1.3rem; line-height: 1; }
.iu-showcase__badge-lbl { font-size: .82rem; color: var(--iu-muted); font-weight: 600; }
.iu-feat-list { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-direction: column; gap: 22px; }
.iu-feat { display: flex; gap: 18px; align-items: flex-start; }
.iu-feat__ic { flex: none; width: 52px; height: 52px; border-radius: var(--iu-r); display: flex; align-items: center; justify-content: center; background: var(--iu-primary-soft); color: var(--iu-primary); }
.iu-feat:nth-child(even) .iu-feat__ic { background: var(--iu-accent-soft); color: var(--iu-accent); }
.iu-feat__ic .iu-ic { width: 24px; height: 24px; }
.iu-feat__body h3 { font-size: 1.12rem; margin-bottom: 3px; }
.iu-feat__body p { color: var(--iu-muted); margin: 0; font-size: .96rem; }

/* ---- CTA (form) ---- */
.iu-cta { background: var(--iu-dark); border-radius: var(--iu-r-lg); overflow: hidden; padding: clamp(38px, 5vw, 60px); position: relative; }
.iu-cta__grid { display: grid; gap: 40px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .iu-cta__grid { grid-template-columns: 1.1fr .9fr; gap: 52px; } }
.iu-cta__left .iu-eyebrow { color: var(--iu-accent); }
.iu-cta__left h2 { color: #fff; margin-bottom: 16px; }
.iu-cta__left > p { color: rgba(255,255,255,.72); font-size: 1.08rem; margin-bottom: 24px; }
.iu-cta__checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 13px; }
.iu-cta__checks li { display: flex; align-items: center; gap: 12px; color: #E6EAEF; font-weight: 600; }
.iu-cta__checks li .iu-ic { flex: none; width: 1.2em; height: 1.2em; color: var(--iu-accent); }
.iu-cta__form { background: var(--iu-surface); border-radius: var(--iu-r); padding: clamp(24px,3vw,32px); }
.iu-cta__form h3 { font-size: 1.3rem; margin-bottom: 6px; }
.iu-cta__form > p { color: var(--iu-muted); font-size: .93rem; margin-bottom: 20px; }
.iu-field { display: flex; align-items: center; gap: 11px; background: var(--iu-bg-alt); border: 1.5px solid var(--iu-line); border-radius: 8px; padding: 13px 15px; margin-bottom: 11px; transition: border-color .2s; }
.iu-field:focus-within { border-color: var(--iu-primary); }
.iu-field .iu-ic { color: var(--iu-muted); width: 1.2em; height: 1.2em; }
.iu-field input, .iu-field select { border: 0; background: transparent; outline: none; font-family: var(--iu-font-body); font-size: .98rem; color: var(--iu-ink); width: 100%; }
.iu-cta__form .iu-btn { width: 100%; margin-top: 6px; }
.iu-cta__form-note { text-align: center; font-size: .82rem; color: var(--iu-muted); margin: 12px 0 0; }

/* ============================================================================
   13) EK BİLEŞENLER (Faz 2 bölümleri için ortak kütüphane)
   ============================================================================ */

/* Genel medya çerçevesi + placeholder yardımcıları */
.iu-frame { border-radius: var(--iu-r-lg); overflow: hidden; box-shadow: var(--iu-shadow); background: var(--iu-surface); }
.iu-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.iu-frame .iu-ph { aspect-ratio: 4/3; }
.iu-frame .iu-ph .iu-ic { width: 60px; height: 60px; }

/* Genel onay listesi */
.iu-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.iu-checklist li { display: flex; align-items: flex-start; gap: 11px; color: var(--iu-body); }
.iu-checklist li .iu-ic { color: var(--iu-primary); flex: none; width: 1.2em; height: 1.2em; margin-top: .18em; }

/* Adımlar / süreç */
.iu-steps { display: grid; gap: 30px 24px; grid-template-columns: 1fr; }
@media (min-width: 700px) { .iu-steps--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 860px) { .iu-steps--4 { grid-template-columns: repeat(4, 1fr); } }
.iu-step { position: relative; text-align: center; padding: 0 10px; }
.iu-step__num { width: 58px; height: 58px; margin: 0 auto 18px; border-radius: 50%; background: var(--iu-primary-soft); color: var(--iu-primary); display: flex; align-items: center; justify-content: center; font-family: var(--iu-font-head); font-weight: 700; font-size: 1.25rem; position: relative; z-index: 1; }
.iu-step:nth-child(even) .iu-step__num { background: var(--iu-accent-soft); color: var(--iu-accent); }
.iu-step h3 { font-size: 1.12rem; margin-bottom: 6px; }
.iu-step p { color: var(--iu-muted); margin: 0; font-size: .96rem; }
@media (min-width: 860px) { .iu-steps--connected .iu-step:not(:last-child)::after { content: ""; position: absolute; top: 29px; left: calc(50% + 40px); right: calc(-50% + 40px); height: 2px; background: var(--iu-line); z-index: 0; } }

/* Eğitmen kartı */
.iu-team { background: var(--iu-surface); border: 1px solid var(--iu-line); border-radius: var(--iu-r-lg); overflow: hidden; text-align: center; transition: transform .3s ease, box-shadow .3s ease; height: 100%; }
.iu-team:hover { transform: translateY(-5px); box-shadow: var(--iu-shadow-lg); }
.iu-team__photo { aspect-ratio: 1; background: var(--iu-bg-alt); position: relative; overflow: hidden; }
.iu-team__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.iu-team:hover .iu-team__photo img { transform: scale(1.04); }
.iu-team__photo .iu-ph { position: absolute; inset: 0; }
.iu-team__photo .iu-ph .iu-ic { width: 52px; height: 52px; }
.iu-team__body { padding: 22px 18px 24px; }
.iu-team__body h3 { font-size: 1.12rem; margin-bottom: 2px; }
.iu-team__role { color: var(--iu-primary); font-weight: 600; font-size: .9rem; }
.iu-team__social { display: flex; justify-content: center; gap: 9px; margin-top: 14px; }
.iu-team__social a { width: 34px; height: 34px; border-radius: var(--iu-r-sm); background: var(--iu-bg-alt); color: var(--iu-muted); display: flex; align-items: center; justify-content: center; font-family: var(--iu-font-head); font-weight: 700; font-size: .72rem; text-transform: lowercase; transition: .2s; }
.iu-team__social a:hover { background: var(--iu-primary); color: #fff; }

/* Yorum / testimonial */
.iu-quote { position: relative; background: var(--iu-surface); border: 1px solid var(--iu-line); border-radius: var(--iu-r-lg); padding: 30px 28px; height: 100%; display: flex; flex-direction: column; gap: 16px; box-shadow: var(--iu-shadow-sm); transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.iu-quote:hover { transform: translateY(-5px); box-shadow: var(--iu-shadow-lg); border-color: transparent; }
.iu-quote::before { content: "\201D"; position: absolute; top: 10px; right: 24px; font-family: Georgia, "Times New Roman", serif; font-size: 5rem; line-height: 1; color: var(--iu-primary); opacity: .13; pointer-events: none; }
.iu-quote > * { position: relative; z-index: 1; }
.iu-quote__stars { color: var(--iu-star); display: inline-flex; gap: 1px; }
.iu-quote__stars .iu-ic { width: 1em; height: 1em; }
.iu-quote__text { color: var(--iu-body); font-size: 1.02rem; margin: 0; flex: 1; }
.iu-quote__author { display: flex; align-items: center; gap: 12px; }
.iu-quote__avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--iu-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--iu-font-head); font-weight: 700; overflow: hidden; flex: none; }
.iu-quote__avatar img { width: 100%; height: 100%; object-fit: cover; }
.iu-quote__name { font-family: var(--iu-font-head); font-weight: 600; color: var(--iu-ink); }
.iu-quote__meta { color: var(--iu-muted); font-size: .86rem; }

/* Fiyatlandırma */
.iu-price { background: var(--iu-surface); border: 1px solid var(--iu-line); border-radius: var(--iu-r-lg); padding: 32px 28px; height: 100%; display: flex; flex-direction: column; transition: transform .3s ease, box-shadow .3s ease; }
.iu-price:hover { transform: translateY(-5px); box-shadow: var(--iu-shadow-lg); }
.iu-price--featured { border: 2px solid var(--iu-primary); }
.iu-price__badge { align-self: flex-start; background: var(--iu-accent); color: #fff; font-family: var(--iu-font-head); font-weight: 600; font-size: .74rem; padding: 5px 12px; border-radius: var(--iu-r-sm); margin-bottom: 14px; }
.iu-price__name { font-family: var(--iu-font-head); font-weight: 600; font-size: 1.15rem; color: var(--iu-ink); }
.iu-price__amount { font-family: var(--iu-font-head); font-weight: 700; font-size: 2.4rem; color: var(--iu-ink); margin: 8px 0; line-height: 1; letter-spacing: -.02em; }
.iu-price__amount small { font-size: .88rem; font-weight: 500; color: var(--iu-muted); letter-spacing: 0; }
.iu-price__list { list-style: none; margin: 16px 0 24px; padding: 0; display: flex; flex-direction: column; gap: 11px; flex: 1; }
.iu-price__list li { display: flex; align-items: center; gap: 10px; color: var(--iu-body); font-size: .96rem; }
.iu-price__list li .iu-ic { color: var(--iu-primary); width: 1.1em; height: 1.1em; flex: none; }

/* SSS akordiyon (details/summary, JS'siz) */
.iu-faq { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }
.iu-faq__item { border: 1px solid var(--iu-line); border-radius: var(--iu-r); background: var(--iu-surface); overflow: hidden; transition: border-color .25s ease, box-shadow .25s ease; }
.iu-faq__item:hover { box-shadow: var(--iu-shadow-sm); }
.iu-faq__item[open] { border-color: var(--iu-primary); box-shadow: var(--iu-shadow-sm); }
.iu-faq__q { list-style: none; cursor: pointer; padding: 18px 22px; font-family: var(--iu-font-head); font-weight: 600; color: var(--iu-ink); display: flex; justify-content: space-between; align-items: center; gap: 16px; transition: color .2s ease; }
.iu-faq__q::-webkit-details-marker { display: none; }
.iu-faq__q:hover { color: var(--iu-primary); }
.iu-faq__q::after { content: "+"; font-size: 1.5rem; font-weight: 300; color: var(--iu-primary); line-height: 1; flex: none; transition: transform .3s cubic-bezier(.34,1.3,.64,1); }
.iu-faq__item[open] .iu-faq__q { color: var(--iu-primary); }
.iu-faq__item[open] .iu-faq__q::after { transform: rotate(135deg); }
/* Cevap — yükseklik JS ile animasyonlanır (theme.js initFaq; tarayıcı bağımsız garanti) */
.iu-faq__a { overflow: hidden; color: var(--iu-muted); }
.iu-faq__a p { margin: 0; padding: 2px 22px 20px; }
@media (prefers-reduced-motion: reduce) { .iu-faq__q::after { transition: none; } }

/* Kategori / hizmet görsel kutusu (Canvas tile) */
.iu-tile { position: relative; display: block; border-radius: var(--iu-r-lg); overflow: hidden; aspect-ratio: 4/3.2; background: var(--iu-bg-alt); }
.iu-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.iu-tile:hover img { transform: scale(1.06); }
.iu-tile .iu-ph { position: absolute; inset: 0; }
.iu-tile__overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 22px; background: linear-gradient(180deg, rgba(18,35,63,0) 42%, rgba(18,35,63,.78)); color: #fff; }
.iu-tile__overlay .iu-ic { width: 26px; height: 26px; margin-bottom: 8px; }
.iu-tile__title { font-family: var(--iu-font-head); font-weight: 600; font-size: 1.12rem; }
.iu-tile__meta { font-size: .86rem; opacity: .85; }

/* Logo / akreditasyon şeridi */
.iu-logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 18px 44px; }
.iu-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--iu-muted); font-family: var(--iu-font-head); font-weight: 700; font-size: 1.05rem; opacity: .85; transition: .2s; }
.iu-logo:hover { opacity: 1; color: var(--iu-ink); }
.iu-logo .iu-ic { width: 1.5em; height: 1.5em; color: var(--iu-primary); }

/* Beceri / progress bar */
.iu-skill { margin-bottom: 20px; }
.iu-skill__top { display: flex; justify-content: space-between; font-family: var(--iu-font-head); font-weight: 600; color: var(--iu-ink); margin-bottom: 8px; font-size: .95rem; }
.iu-skill__bar { height: 8px; border-radius: 99px; background: var(--iu-bg-alt); overflow: hidden; }
.iu-skill__fill { height: 100%; border-radius: 99px; background: var(--iu-primary); }

/* Sayfa başlığı (breadcrumb) */
.iu-pageheader { background: var(--iu-dark); color: #fff; padding: clamp(46px, 6vw, 78px) 0; text-align: center; }
.iu-pageheader h1 { color: #fff; margin-bottom: 10px; }
.iu-pageheader__crumb { color: rgba(255,255,255,.6); font-size: .92rem; }
.iu-pageheader__crumb a:hover { color: #fff; }

/* Video kutusu */
.iu-video { position: relative; border-radius: var(--iu-r-lg); overflow: hidden; aspect-ratio: 16/9; background: var(--iu-dark); display: flex; align-items: center; justify-content: center; }
.iu-video img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .85; }
.iu-video__play { position: relative; z-index: 1; width: 72px; height: 72px; border-radius: 50%; background: #fff; color: var(--iu-accent); display: flex; align-items: center; justify-content: center; box-shadow: var(--iu-shadow-lg); }
.iu-video__play .iu-ic { width: 26px; height: 26px; }

/* Form textarea + iletişim bilgi satırı */
.iu-field--area { align-items: flex-start; }
.iu-field textarea { border: 0; background: transparent; outline: none; font-family: var(--iu-font-body); font-size: .98rem; color: var(--iu-ink); width: 100%; resize: vertical; min-height: 92px; }
.iu-contact-item { display: flex; gap: 16px; align-items: flex-start; }
.iu-contact-item__ic { width: 48px; height: 48px; border-radius: var(--iu-r); background: var(--iu-primary-soft); color: var(--iu-primary); display: flex; align-items: center; justify-content: center; flex: none; }
.iu-contact-item h3 { font-size: 1.05rem; margin-bottom: 2px; }
.iu-contact-item p { color: var(--iu-muted); margin: 0; }

/* Serbest zengin metin */
.iu-prose { max-width: 760px; margin: 0 auto; color: var(--iu-body); }
.iu-prose h2, .iu-prose h3 { margin-top: 1.6em; }
.iu-prose > :first-child { margin-top: 0; }
.iu-prose ul { padding-left: 1.2em; }
.iu-prose li { margin-bottom: .4em; }

/* ============================================================================
   14) MİKRO-ETKİLEŞİMLER & İNCE HAREKET
   ============================================================================ */

/* İkon kutuları — kart/öğe hover'ında canlanma */
.iu-card__icon, .iu-contact-item__ic, .iu-feat__ic, .iu-step__num, .iu-showcase__badge-ic, .iu-hero__float-ic, .iu-tile__overlay .iu-ic { transition: transform .35s cubic-bezier(.34,1.4,.64,1); }
.iu-card:hover .iu-card__icon { transform: translateY(-4px) scale(1.06); }
.iu-contact-item:hover .iu-contact-item__ic { transform: translateY(-3px) scale(1.05); }
.iu-feat:hover .iu-feat__ic { transform: rotate(-6deg) scale(1.06); }
.iu-step:hover .iu-step__num { transform: translateY(-4px); }

/* Kategori / galeri kutusu */
.iu-tile__overlay, .iu-tile__title { transition: background .35s ease, transform .35s ease; }
.iu-tile:hover .iu-tile__overlay { background: linear-gradient(180deg, rgba(18,35,63,.12) 25%, rgba(18,35,63,.82)); }
.iu-tile:hover .iu-tile__title { transform: translateX(4px); }
.iu-tile:hover .iu-tile__overlay .iu-ic { transform: translateY(-3px); }

/* İstatistik hover */
.iu-stat { transition: transform .3s ease; }
.iu-stats-band .iu-stat:hover { transform: translateY(-4px); }

/* Nav altçizgi kayması */
.iu-nav__item > a { position: relative; }
.iu-nav__item > a::after { content: ""; position: absolute; left: 15px; right: 15px; bottom: 5px; height: 2px; border-radius: 2px; background: var(--iu-primary); transform: scaleX(0); transform-origin: left; transition: transform .28s ease; }
.iu-nav__item > a:hover::after { transform: scaleX(1); }

/* Buton üstünden geçen ışık (shine) */
.iu-btn--primary, .iu-btn--accent, .iu-btn--light { position: relative; overflow: hidden; }
.iu-btn--primary::after, .iu-btn--accent::after, .iu-btn--light::after { content: ""; position: absolute; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient(120deg, transparent, rgba(255,255,255,.30), transparent); transform: skewX(-20deg); transition: left .55s ease; pointer-events: none; }
.iu-btn--primary:hover::after, .iu-btn--accent:hover::after, .iu-btn--light:hover::after { left: 130%; }

/* İnce sürekli salınım — hero bilgi kartı + showcase rozeti */
@keyframes iu-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.iu-hero__float { animation: iu-bob 4.5s ease-in-out infinite; }
.iu-showcase__badge { animation: iu-bob 5s ease-in-out infinite .6s; }

/* Kurs 'öne çıkan' şerit hafif nabız */
@keyframes iu-ribbon { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
.iu-course--featured .iu-course__ribbon { animation: iu-ribbon 2.6s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce) {
  .iu-hero__float, .iu-showcase__badge, .iu-course--featured .iu-course__ribbon { animation: none; }
  .iu-btn--primary::after, .iu-btn--accent::after, .iu-btn--light::after { display: none; }
}
/* ---------- 15) Dark mod logo değişimi ----------
   DİKKAT: yukarıdaki `.iu-theme img { display: block }` sıfırlaması 0,1,1 özgüllüğünde.
   Tek sınıflı bir `.iu-logo--dark { display:none }` (0,1,0) onu ezemez ve iki logo da
   görünür. Bu yüzden seçiciler en az iki sınıf taşır (0,2,0). Karanlık mod kuralları
   aynı özgüllükte olduğundan sonra gelmeli. */
.iu-theme .iu-logo--dark { display: none; }
.iu-theme .iu-logo--light { display: block; }
.dark .iu-logo--light, :root[data-theme="dark"] .iu-logo--light { display: none; }
.dark .iu-logo--dark, :root[data-theme="dark"] .iu-logo--dark { display: block; }

/* Aydınlık/karanlık düğmesi — aydınlıkta ay, karanlıkta güneş gösterir. */
.iu-theme-toggle { display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 40px; height: 40px; border-radius: var(--iu-r-sm); border: 1px solid var(--iu-line);
  background: transparent; color: var(--iu-body); cursor: pointer; transition: color .2s, background .2s, border-color .2s; }
.iu-theme-toggle:hover { color: var(--iu-primary); border-color: var(--iu-primary); background: var(--iu-primary-soft); }
.iu-theme-toggle .bi { font-size: 18px; }
.iu-theme-toggle .iu-theme-toggle__sun { display: none; }
.dark .iu-theme-toggle .iu-theme-toggle__moon,
:root[data-theme="dark"] .iu-theme-toggle .iu-theme-toggle__moon { display: none; }
.dark .iu-theme-toggle .iu-theme-toggle__sun,
:root[data-theme="dark"] .iu-theme-toggle .iu-theme-toggle__sun { display: inline-block; }

/* ---------- 16) Görsel hero (TÜM zemin foto + üstünde yazı + hızlı-erişim) ---------- */
.iu-hero-photo { position: relative; overflow: hidden; background: var(--iu-dark); padding: clamp(60px, 7vw, 92px) 0 clamp(44px, 5vw, 72px); }
.iu-hero-photo__bg, .iu-hero-photo__ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.iu-hero-photo::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(15,25,42,.5) 0%, rgba(15,25,42,.82) 100%); }
.iu-hero-photo > .iu-container { position: relative; z-index: 2; }
.iu-hero-photo__inner { max-width: 780px; margin: 0 auto; text-align: center; padding-bottom: clamp(40px, 5vw, 66px); }
.iu-hero-photo__inner .iu-eyebrow { color: rgba(255,255,255,.82); justify-content: center; }
.iu-hero-photo__inner .iu-eyebrow::before { background: rgba(255,255,255,.55); }
.iu-hero-photo__inner h1 { color: #fff; margin: 14px 0 16px; }
.iu-hero-photo__lead { color: rgba(255,255,255,.9); font-size: 1.18rem; max-width: 620px; margin: 0 auto 28px; }
.iu-hero-photo__tiles { max-width: 960px; margin: 0 auto; }
.iu-hero-photo__grid { display: grid; gap: 14px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 700px) { .iu-hero-photo__grid { grid-template-columns: repeat(5, 1fr); } }
.iu-hero-photo__tiles .iu-htile { box-shadow: var(--iu-shadow-lg); }
.iu-htile { background: var(--iu-surface); border: 1px solid var(--iu-line); border-radius: var(--iu-r-lg); padding: 20px 12px; display: flex; flex-direction: column; align-items: center; gap: 10px; color: var(--iu-ink); font-family: var(--iu-font-head); font-weight: 600; font-size: .92rem; text-align: center; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.iu-htile:hover { transform: translateY(-4px); box-shadow: var(--iu-shadow-lg); border-color: var(--iu-primary); }
.iu-htile__ic { width: 48px; height: 48px; border-radius: var(--iu-r); background: var(--iu-primary-soft); color: var(--iu-primary); display: flex; align-items: center; justify-content: center; }
.iu-htile__ic .iu-ic { width: 24px; height: 24px; }