/* ══════════════════════════════════════════════════════════════════
   HAKKIMIZDA  ·  kök sınıf .hk  (hakkimizda.php, js/hakkimizda.js)
   20 Ekim 2026: kurumun gönderdiği tasarım ("Hakkımızda · Versiyon A
   (klasik)"). Ölçüler altın orana göre: yazı 12·16·20·26·42·68, boşluk
   8·13·21·34·55·89·144, köşe 8·13·21. Başlıklar Literata, gövde Bricolage
   Grotesque (sitenin yazıları), Arapça filigranlar Amiri.
   Renkler sitenin tema değişkenlerine bağlı; tasarımın değerleri varsayılan.
   Üst menü ve altbilgi sitenin.
   ══════════════════════════════════════════════════════════════════ */
.hk{
  --hk-petrol:var(--birincil,#015150); --hk-petrol-koyu:var(--birincil-koyu,#01403F);
  --hk-acik:var(--birincil-acik,#E1EAEA); --hk-amber:var(--vurgu,#F8931F);
  --hk-petrol-acik:#5FB8B0;
  --hk-krem:#F3ECDF; --hk-zemin:#FBF8F4; --hk-kum:#F3ECDF; --hk-murekkep:#241C1F; --hk-soluk:#5F595B;
  --hk-cizgi:#E5E4E4; --hk-cizgi2:#F0EFEF; --hk-gece:#0A1817; --hk-gri:#BFC9C3;
  --hk-serif:"Literata",Georgia,serif; --hk-arap:"Amiri",serif;
  --hk-golge:0 1px 2px rgba(36,28,31,.07),0 34px 55px -34px rgba(36,28,31,.4);
  --hk-golge2:0 1px 2px rgba(36,28,31,.07),0 21px 34px -21px rgba(36,28,31,.3);
  display:block;background:var(--hk-zemin);color:var(--hk-murekkep);font-size:16px;line-height:1.618;
  overflow-x:clip;-webkit-font-smoothing:antialiased;
}
.hk *{box-sizing:border-box}
.hk p{margin:0}
.hk img{max-width:none}
.hk a{color:var(--hk-petrol)}
.hk a:hover{color:var(--hk-petrol-koyu)}
body .hk h1,body .hk h2,body .hk h3{font-family:var(--hk-serif);font-weight:600;letter-spacing:-.01em;margin:0;
  text-transform:none;color:inherit;text-wrap:balance}
body .hk h2{font-size:clamp(32px,3.6vw,42px);line-height:1.2}
body .hk h2 em,body .hk h1 em{font-style:italic;color:var(--hk-petrol)}
.hk :focus-visible{outline:3px solid var(--hk-petrol);outline-offset:3px}
.hk-koyu :focus-visible,.hk-hero :focus-visible,.hk-bant :focus-visible,.hk-ilt-panel :focus-visible{outline-color:var(--hk-amber)}
.hk-kap{position:relative;width:100%;max-width:1240px;margin-inline:auto;padding-inline:21px}
.hk-bolum{padding-block:144px}
.hk-ikon{flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hk-karo{flex:none;fill:var(--hk-amber)}
.hk-metin{font-size:16px;color:var(--hk-soluk);max-width:38em}
.hk-ust{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.hk-ust--petrol{color:var(--hk-petrol)}
.hk-ust--amber{color:var(--hk-amber)}
.hk-bas{display:flex;flex-direction:column;gap:13px;max-width:61.8%;min-width:min(100%,320px)}
.hk-bas-sira{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:21px;margin-bottom:34px}
.hk-tumu{display:inline-flex;align-items:center;gap:4px;font-weight:700;white-space:nowrap;text-underline-offset:3px}
.hk-radyo{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.hk-filigran{position:absolute;right:34px;top:8px;font-family:var(--hk-arap);line-height:1;pointer-events:none;
  transform:translateY(calc(var(--i,0) * -55px))}

/* Düğmeler */
.hk-btn{display:inline-flex;align-items:center;gap:13px;min-height:55px;padding:0 34px;border-radius:8px;font-weight:700;font-size:16px;
  text-decoration:none;transition:transform .2s,filter .2s,background-color .2s}
.hk-btn:hover{transform:translateY(-2px);filter:brightness(1.06)}
.hk .hk-btn--amber{background:var(--hk-amber);color:var(--hk-murekkep)}
.hk .hk-btn--amber:hover{color:var(--hk-murekkep)}
.hk .hk-btn--cizgi{padding:0 21px;border:1px solid rgba(243,236,223,.35);color:var(--hk-krem);font-weight:600}
.hk .hk-btn--cizgi:hover{color:#fff;background:rgba(243,236,223,.08)}
.hk-eylem{display:flex;flex-wrap:wrap;gap:13px}

/* ---------- Hareketler ---------- */
@keyframes hk-kb{from{transform:scale(1.04)}to{transform:scale(1.16) translate(-2%,-1%)}}
@keyframes hk-yuksel{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
@keyframes hk-ak{to{transform:translateX(-50%)}}
@keyframes hk-nabiz{0%{box-shadow:0 0 0 0 rgba(248,147,31,.55)}100%{box-shadow:0 0 0 18px rgba(248,147,31,0)}}
@keyframes hk-parla{from{background-position:-200% 0}to{background-position:200% 0}}
@keyframes hk-video{from{width:8%}to{width:72%}}
@keyframes hk-suzul{0%,100%{transform:translate(-50%,-100%)}50%{transform:translate(-50%,calc(-100% - 8px))}}
@keyframes hk-dolum{from{width:0}to{width:100%}}
@keyframes hk-gel{from{opacity:0;transform:translateY(55px)}to{opacity:1;transform:none}}
.hk-kb{animation:hk-kb 14s ease-in-out infinite alternate}
.hk-acil{animation:hk-yuksel .9s cubic-bezier(.2,.7,.2,1) both}
.hk-g1{animation-delay:.13s}.hk-g2{animation-delay:.21s}.hk-g3{animation-delay:.34s}.hk-g4{animation-delay:.55s}
.hk-kalk{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .25s,background-color .25s}
.hk-kalk:hover{transform:translateY(-8px);box-shadow:0 34px 55px -34px rgba(1,64,63,.6)}
.hk-yakin{overflow:hidden}
.hk-yakin img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.hk-yakin:hover img{transform:scale(1.08)}
.hk-parla{background:linear-gradient(90deg,#F8931F 0%,#FFD49A 50%,#F8931F 100%);background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:hk-parla 6s linear infinite}
body .hk h1 em.hk-parla{font-style:normal}
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .hk-js .hk-gel{animation:hk-gel linear both;animation-timeline:view();animation-range:entry 0% cover 18%}
  }
  @supports not (animation-timeline:view()){
    .hk-js .hk-gel{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
    .hk-js .hk-gel.gorundu{opacity:1;transform:none}
  }
}
@media (prefers-reduced-motion:reduce){
  .hk *,.hk *::before,.hk *::after{animation:none !important;transition:none !important}
}

/* ---------- Açılış ---------- */
.hk-hero{position:relative;background:var(--hk-gece);color:var(--hk-krem);overflow:hidden}
.hk-hero::before,.hk-hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none}
.hk-hero::before{background:linear-gradient(100deg,rgba(10,24,23,.97) 0%,rgba(10,24,23,.9) 61.8%,rgba(1,64,63,.6) 100%)}
.hk-hero::after{background:radial-gradient(38.2% 120% at 0% 100%,rgba(248,147,31,.16),transparent 70%)}
.hk-hero-zemin{position:absolute;inset:0}
.hk-slayt{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity 1.2s ease}
.hk-slayt.etkin{opacity:.6}
.hk-slayt img{width:100%;height:100%;object-fit:cover;filter:blur(3px) saturate(.9)}
.hk-hero-kap{z-index:2;padding-block:89px 144px;display:flex;flex-wrap:wrap;gap:55px;align-items:center}
.hk-hero-metin{flex:1.618 1 0%;min-width:min(100%,420px);display:flex;flex-direction:column;align-items:flex-start;gap:21px;
  opacity:calc(1 - var(--hk-kaydir,0) * 1.618);transform:translateY(calc(var(--hk-kaydir,0) * 89px))}
.hk-kirinti{font-size:13px;color:var(--hk-gri)}
.hk .hk-kirinti a{color:var(--hk-gri)}
.hk .hk-kirinti a:hover{color:#fff}
body .hk .hk-hero h1{font-size:clamp(42px,5.6vw,68px);line-height:1.08}
.hk .hk-hero-giris{font-size:20px;color:var(--hk-gri);max-width:34em}
.hk-hero .hk-eylem{margin-top:8px}
.hk-kolaj{flex:1 1 0%;min-width:min(100%,320px);max-width:470px;position:relative;aspect-ratio:1/1.1}
.hk-kolaj > *{transform:translateY(calc(var(--hk-kaydir,0) * var(--p,0) * 1px)) rotate(var(--r,0deg))}
.hk-kolaj > div{position:absolute;overflow:hidden;border:5px solid var(--hk-krem);box-shadow:0 34px 55px -34px rgba(0,0,0,.85)}
.hk-kolaj img{width:100%;height:100%;object-fit:cover;display:block}
.hk-kolaj-a{left:0;top:13%;width:55%;aspect-ratio:1/1.618;border-radius:13px;--r:-6deg}
.hk-kolaj-b{right:0;top:0;width:50%;aspect-ratio:1/1.618;border-radius:13px;--r:5deg}
.hk-kolaj-c{left:19%;bottom:0;width:61.8%;aspect-ratio:1.618/1;border-radius:144px 144px 13px 13px}
.hk-kolaj-etiket{position:absolute;left:0;bottom:13%;background:var(--hk-amber);color:var(--hk-murekkep);border-radius:8px;padding:8px 13px;
  font-weight:700;font-size:13px;box-shadow:0 21px 34px -21px rgba(0,0,0,.6)}

/* ---------- Rakamlar ---------- */
.hk-sayilar{margin-top:-89px;z-index:3}
.hk-sayilar ul{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--hk-cizgi);border-radius:13px;box-shadow:var(--hk-golge);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));overflow:hidden}
.hk-sayilar li{padding:21px 34px;display:flex;flex-direction:column;gap:5px;box-shadow:1px 0 0 var(--hk-cizgi2)}
.hk-sayi-ad{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--hk-soluk)}
.hk-sayilar b{font-family:var(--hk-serif);font-size:42px;line-height:1.1;font-weight:600;color:var(--hk-petrol);font-variant-numeric:tabular-nums}
.hk-sayi-cubuk{height:3px;border-radius:3px;background:var(--hk-acik);overflow:hidden}
.hk-sayi-cubuk i{display:block;height:100%;width:100%;background:var(--hk-amber);transition:width 1.6s cubic-bezier(.2,.7,.2,1)}
.hk-js .hk-sayilar:not(.sayildi) .hk-sayi-cubuk i{width:0}

/* ---------- Kurumumuz ---------- */
.hk-kurum{padding-block:144px 89px;display:flex;flex-wrap:wrap;gap:55px;align-items:flex-start}
.hk-kurum-sol{flex:1.618 1 0%;min-width:min(100%,420px);display:flex;flex-direction:column;align-items:flex-start;gap:21px}
/* Perde açılması fotoğrafın kendisinde: kırpılmış KUTU görünürlük gözcüsünü tetiklemiyor (ölçüldü). */
.hk-kurum-foto{position:relative;margin:13px 0 0;width:100%;border-radius:13px;aspect-ratio:1.618/1;background:var(--hk-kum)}
.hk-kurum-foto img{width:100%;height:118%;object-fit:cover;display:block;transform:translateY(calc(var(--i,0) * -55px - 9%));
  transition:clip-path 1.2s cubic-bezier(.7,0,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.hk-kurum-foto:hover img{transform:translateY(calc(var(--i,0) * -55px - 9%)) scale(1.08)}
.hk-js .hk-kurum-foto:not(.acildi) img{clip-path:inset(0 100% 0 0)}
.hk-js .hk-kurum-foto:not(.acildi) figcaption{opacity:0}
.hk-kurum-foto figcaption{transition:opacity .6s ease .8s}
.hk-kurum-foto figcaption{position:absolute;left:13px;bottom:13px;display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;
  background:rgba(10,24,23,.8);color:var(--hk-krem);font-size:13px;font-weight:600}
.hk-kurum-sag{flex:1 1 0%;min-width:min(100%,320px);display:flex;flex-direction:column;gap:21px}
.hk-yol{position:relative;background:#fff;border:1px solid var(--hk-cizgi);border-radius:21px;padding:34px;box-shadow:var(--hk-golge2)}
body .hk .hk-yol h3{margin-bottom:21px;font-size:26px;line-height:1.2}
.hk-yol-taslar{position:relative;display:grid;grid-template-columns:repeat(var(--hk-yol-n,4),minmax(0,1fr));gap:8px;margin-bottom:21px}
.hk-yol-cizgi{position:absolute;left:calc(50% / var(--hk-yol-n,4));right:calc(50% / var(--hk-yol-n,4));top:21px;height:2px;background:var(--hk-acik)}
.hk-yol-cizgi i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--hk-amber);transition:width .5s cubic-bezier(.2,.7,.2,1)}
.hk-yol-tas{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;min-height:44px}
.hk-yol-yuvar{width:42px;height:42px;border-radius:50%;border:2px solid var(--hk-gri);background:#fff;color:var(--hk-petrol);display:grid;place-items:center;transition:all .25s}
.hk-yol-tas:hover .hk-yol-yuvar{border-color:var(--hk-petrol)}
.hk-yol-yil{font-family:var(--hk-serif);font-weight:600;font-size:16px;color:var(--hk-soluk);text-align:center;line-height:1.2}
.hk-yol-panel{display:none;flex-direction:column;gap:8px;min-height:178px;border-radius:13px;background:var(--hk-petrol);color:var(--hk-krem);padding:21px;
  animation:hk-yuksel .6s cubic-bezier(.2,.8,.2,1) both}
.hk-yol-panel-yil{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--hk-amber);text-transform:uppercase}
.hk-yol-panel b{font-family:var(--hk-serif);font-size:20px;font-weight:600;line-height:1.3}
.hk-yol-panel > span:last-child{font-size:14px;color:var(--hk-gri)}
.hk-yol-alt{display:none;justify-content:space-between;align-items:center;margin-top:13px;font-size:13px;color:var(--hk-soluk)}
.hk-js .hk-yol-alt{display:flex}
.hk-yol-alt button{min-width:44px;min-height:44px;border-radius:8px;font-size:18px;cursor:pointer;font-family:inherit}
.hk-yol-onceki{border:1px solid var(--hk-cizgi);background:var(--hk-zemin);color:var(--hk-petrol)}
.hk-yol-sonraki{border:0;background:var(--hk-petrol);color:#fff}
.hk-kartlar{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1.618fr) minmax(0,1fr);grid-auto-rows:144px;gap:13px}
.hk-kart{position:relative;overflow:hidden;border-radius:21px;padding:21px;display:flex;flex-direction:column;justify-content:space-between}
.hk-kart--1{background:var(--hk-petrol);color:var(--hk-krem)}
.hk-kart--2{background:var(--hk-amber);color:var(--hk-murekkep)}
.hk-kart--3{background:var(--hk-gece);color:var(--hk-krem)}
.hk-kart--4{background:#fff;color:var(--hk-petrol);border:1px solid var(--hk-cizgi)}
.hk-kart > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hk-kart--foto::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(10,24,23,.55),rgba(10,24,23,.2) 40%,rgba(10,24,23,.88))}
.hk-kart-ad,.hk-kart-deger{position:relative;z-index:1}
.hk-kart-ad{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.hk-kart-deger{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.hk-kart-deger b{font-family:var(--hk-serif);font-size:42px;font-weight:600;line-height:1;white-space:nowrap}
.hk-kart--4 .hk-kart-deger b{font-size:clamp(28px,2.6vw,38px)}
.hk-kart-deger span{font-size:13px;opacity:.85}

/* ---------- Misyon / vizyon ---------- */
.hk-mv{padding-bottom:144px;display:flex;flex-wrap:wrap;gap:21px}
.hk-mv article{position:relative;overflow:hidden;border-radius:21px;display:flex;flex-direction:column;align-items:flex-start;gap:21px}
.hk-misyon{flex:1.618 1 0%;min-width:min(100%,420px);background:var(--hk-petrol);color:var(--hk-krem);padding:55px}
.hk-vizyon{flex:1 1 0%;min-width:min(100%,320px);background:var(--hk-kum);color:var(--hk-murekkep);padding:55px 34px;border:1px solid #E5DCCB}
.hk-misyon .hk-filigran{font-size:110px;color:rgba(243,236,223,.08)}
.hk-vizyon .hk-filigran{right:21px;font-size:89px;color:rgba(1,81,80,.08);transform:translateY(calc(var(--i,0) * 55px))}
.hk-mv-ikon{width:55px;height:55px;border-radius:13px;display:grid;place-items:center}
.hk-misyon .hk-mv-ikon{background:rgba(248,147,31,.16);color:var(--hk-amber)}
.hk-vizyon .hk-mv-ikon{background:var(--hk-petrol);color:var(--hk-amber)}
.hk-mv-ad{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.hk-misyon .hk-mv-ad{color:var(--hk-amber)}
.hk-vizyon .hk-mv-ad{color:var(--hk-petrol)}
.hk-mv p{position:relative;font-family:var(--hk-serif);font-weight:500}
.hk-misyon p{font-size:26px;line-height:1.5}
.hk-vizyon p{font-size:20px;line-height:1.618}

/* ---------- Kayan şerit ---------- */
.hk-serit{background:var(--hk-petrol);color:var(--hk-krem);overflow:hidden;padding:13px 0}
.hk-serit-ray{display:flex;width:max-content;animation:hk-ak 40s linear infinite}
.hk-serit:hover .hk-serit-ray{animation-play-state:paused}
.hk-serit ul{list-style:none;margin:0;padding:0;display:flex;flex:none}
.hk-serit li{display:inline-flex;align-items:center;gap:21px;padding-right:21px;font-family:var(--hk-serif);font-size:26px;white-space:nowrap}
@media (prefers-reduced-motion:reduce){ .hk-serit{overflow-x:auto} }

/* ---------- Akademiler ---------- */
.hk-kum{background:var(--hk-kum)}
.hk-akademi .hk-bas-sira{align-items:flex-end}
.hk-ak{position:relative}
.hk-ak-sekmeler{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:34px}
.hk-ak-sekme{display:inline-flex;align-items:center;gap:8px;min-height:47px;padding:0 21px;border-radius:999px;border:1px solid var(--hk-cizgi);background:#fff;
  color:var(--hk-murekkep);font-weight:700;font-size:14px;cursor:pointer;user-select:none;transition:background-color .25s,color .25s,border-color .25s}
.hk-ak-sekme:hover{border-color:var(--hk-petrol)}
.hk-ak-sekme span{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--hk-acik);color:var(--hk-petrol)}
.hk-okullar{display:none;list-style:none;margin:0;padding:0;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:21px}
.hk-okullar li{animation:hk-yuksel .7s cubic-bezier(.2,.8,.2,1) both}
.hk-okullar li:nth-child(4n+2){animation-delay:.13s}.hk-okullar li:nth-child(4n+3){animation-delay:.26s}.hk-okullar li:nth-child(4n){animation-delay:.39s}
.hk .hk-okul{height:100%;display:flex;flex-direction:column;background:#fff;border:1px solid var(--hk-cizgi);border-radius:13px;text-decoration:none;color:var(--hk-murekkep)}
.hk .hk-okul:hover{color:var(--hk-murekkep)}
.hk-okul-gorsel{display:block;overflow:hidden;aspect-ratio:1.618/1}
.hk-okul-gorsel img{display:block;width:100%;height:100%;object-fit:cover}
.hk-okul-gorsel--yok{display:grid;place-items:center;background:var(--hk-petrol);color:rgba(243,236,223,.85);
  background-image:radial-gradient(circle at 30% 20%,rgba(248,147,31,.18),transparent 60%)}
.hk-okul-alt{display:flex;justify-content:space-between;align-items:center;gap:13px;padding:13px 21px}
.hk-okul-alt > span{display:flex;flex-direction:column}
.hk-okul-alt b{font-family:var(--hk-serif);font-weight:600;font-size:20px;line-height:1.3}
.hk-okul-alt > span > span{font-size:13px;color:var(--hk-soluk)}
.hk-okul-alt i{flex:none;width:34px;height:34px;border-radius:50%;background:var(--hk-acik);color:var(--hk-petrol);display:grid;place-items:center;
  font-style:normal;font-weight:700;transition:transform .25s}
.hk-okul:hover .hk-okul-alt i{transform:translateX(5px)}

/* ---------- Nasıl öğreniyoruz ---------- */
.hk-koyu{position:relative;background:var(--hk-gece);color:var(--hk-krem);overflow:hidden}
.hk-ogren::before{content:"";position:absolute;right:-15%;top:-40%;width:61.8%;height:140%;background:radial-gradient(closest-side,rgba(1,81,80,.7),transparent);pointer-events:none}
.hk-ogren::after{content:"";position:absolute;left:-10%;bottom:-50%;width:38.2%;height:120%;background:radial-gradient(closest-side,rgba(248,147,31,.14),transparent);pointer-events:none}
.hk-ogren > .hk-kap{z-index:1}
.hk-ogren-bas{padding-top:144px;padding-bottom:55px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:21px}
.hk-ogren .hk-metin{color:var(--hk-gri)}
body .hk .hk-kelimeler{font-size:clamp(32px,4.2vw,42px)}
.hk-kelime{color:var(--hk-gri);transition:color .5s}
.hk-nokta{color:var(--hk-gri)}
.hk-ogren-oklar{display:none;gap:13px}
.hk-js .hk-ogren-oklar{display:flex}
.hk-yuvarlak{width:55px;height:55px;border-radius:50%;border:1px solid rgba(243,236,223,.3);background:transparent;color:var(--hk-krem);cursor:pointer;
  display:grid;place-items:center;transition:transform .2s,filter .2s}
.hk-yuvarlak:hover{transform:translateY(-2px)}
.hk-yuvarlak--amber{border:0;background:var(--hk-amber);color:var(--hk-murekkep)}
.hk-cipler{display:flex;align-items:center;gap:8px;overflow-x:auto;padding-bottom:34px;scrollbar-width:none}
.hk-cipler::-webkit-scrollbar{display:none}
.hk-cip{flex:1 0 auto;display:flex;align-items:center;gap:13px;min-height:55px;padding:8px 21px 8px 8px;border-radius:999px;border:1px solid rgba(243,236,223,.16);
  background:rgba(243,236,223,.05);color:var(--hk-krem);cursor:pointer;user-select:none;transition:background-color .3s,border-color .3s,color .3s}
.hk-cip-ikon{flex:none;width:42px;height:42px;border-radius:50%;background:rgba(243,236,223,.1);display:grid;place-items:center;transition:background-color .3s,color .3s}
.hk-cip > span:last-child{display:flex;flex-direction:column;line-height:1.3}
.hk-cip small{font-size:12px;font-weight:700;letter-spacing:.14em;opacity:.8}
.hk-cip b{font-size:15px}
.hk-cip-ok{flex:none;fill:none;stroke:rgba(243,236,223,.3);stroke-width:2;stroke-dasharray:4 5;stroke-linecap:round;stroke-linejoin:round}
.hk-adim-paneller{display:grid}
.hk-adim{--hk-on:0;grid-area:1/1;display:flex;flex-wrap:wrap;background:var(--hk-kum);color:var(--hk-murekkep);border-radius:21px;overflow:hidden;min-height:470px;
  opacity:var(--hk-on);visibility:hidden;transform:translateX(calc((1 - var(--hk-on)) * 34px));
  transition:opacity .6s ease,transform .8s cubic-bezier(.7,0,.2,1),visibility 0s linear .6s}

.hk-adim-gorsel{flex:1.618 1 0%;min-width:min(100%,420px);position:relative;min-height:377px;overflow:hidden;background:var(--hk-petrol)}
.hk-adim-gorsel > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(calc(1.2 - var(--hk-on) * .12));transition:transform 6s ease-out}
.hk-adim-gorsel::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(10,24,23,.15),rgba(10,24,23,.75))}
.hk-adim-gorsel > *:not(img){z-index:1}
.hk-adim-no{position:absolute;left:34px;top:21px;font-family:var(--hk-serif);font-size:144px;font-weight:600;line-height:1;color:rgba(243,236,223,.18)}
.hk-mini-okul{position:absolute;right:34px;bottom:34px;display:flex;flex-direction:column;gap:8px;width:61.8%;max-width:280px}
.hk-mini-okul div{display:flex;align-items:center;gap:13px;padding:8px 13px;border-radius:13px;background:rgba(251,248,244,.95);color:var(--hk-murekkep);
  box-shadow:0 13px 21px -13px rgba(0,0,0,.5);transform:translateX(calc((1 - var(--hk-on)) * 55px));opacity:var(--hk-on);
  transition:transform .8s cubic-bezier(.2,.8,.2,1) var(--d),opacity .6s ease var(--d)}
.hk-mini-okul b{flex:1;font-size:14px}
.hk-mini-okul i{font-style:normal;color:var(--hk-petrol)}
.hk-mini-renk{width:34px;height:34px;border-radius:8px;background:var(--hk-petrol)}
.hk-mini-renk--1{background:var(--hk-amber)}.hk-mini-renk--2{background:var(--hk-soluk)}
.hk-oynat{position:absolute;left:50%;top:50%;width:89px;height:89px;margin:-44px 0 0 -44px;border-radius:50%;background:var(--hk-amber);display:grid;place-items:center;
  animation:hk-nabiz 2s ease-out infinite}
.hk-oynat path{fill:var(--hk-murekkep)}
.hk-video-cubuk{position:absolute;left:34px;right:34px;bottom:34px;display:flex;flex-direction:column;gap:8px}
.hk-video-cubuk small{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--hk-amber)}
.hk-video-cubuk > span{height:5px;border-radius:5px;background:rgba(243,236,223,.25);overflow:hidden}
.hk-video-cubuk i{display:block;height:100%;width:30%;background:var(--hk-amber);animation:hk-video 6s linear infinite}
.hk-balonlar{position:absolute;right:34px;bottom:34px;display:flex;flex-direction:column;gap:8px;width:61.8%;max-width:300px}
.hk-balonlar > div{font-size:14px;transform:translateY(calc((1 - var(--hk-on)) * 21px));opacity:var(--hk-on);transition:all .7s cubic-bezier(.2,.8,.2,1) .2s}
.hk-balon{align-self:flex-start;padding:13px 15px;border-radius:13px 13px 13px 3px;background:rgba(251,248,244,.95);color:var(--hk-murekkep)}
.hk-balonlar .hk-balon--hoca{align-self:flex-end;border-radius:13px 13px 3px 13px;background:var(--hk-petrol);color:var(--hk-krem);transition-delay:.55s}
.hk-balonlar .hk-balon-rozet{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;background:#0B7A55;color:#fff;
  font-size:13px;font-weight:700;transition-delay:.9s}
.hk-belge{position:absolute;right:34px;bottom:34px;width:61.8%;max-width:300px;aspect-ratio:1.618/1;border-radius:8px;background:#fff;border:2px solid var(--hk-petrol);
  outline:5px solid rgba(255,255,255,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-align:center;color:var(--hk-murekkep);
  transform:rotate(calc(8deg - var(--hk-on) * 11deg)) scale(calc(.8 + var(--hk-on) * .2));opacity:var(--hk-on);
  transition:transform .9s cubic-bezier(.2,.8,.2,1) .2s,opacity .6s ease .2s}
.hk-belge img{height:26px;width:auto;border-radius:4px}
.hk-belge small{font-size:10px;letter-spacing:.3em;color:var(--hk-petrol);font-weight:700}
.hk-belge b{font-family:var(--hk-serif);font-size:16px;font-weight:600}
.hk-belge span{font-size:11px;color:var(--hk-soluk)}
.hk-belge i{position:absolute;right:-13px;bottom:-13px;width:42px;height:42px;border-radius:50%;background:var(--hk-amber);color:var(--hk-murekkep);display:grid;place-items:center}
.hk-adim-metin{flex:1 1 0%;min-width:min(100%,320px);padding:55px 34px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:21px}
.hk-adim-ust{display:inline-flex;align-items:center;gap:13px;font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--hk-petrol);text-transform:uppercase}
.hk-adim-ikon{width:55px;height:55px;border-radius:13px;background:var(--hk-petrol);color:var(--hk-amber);display:grid;place-items:center}
body .hk .hk-adim-metin h3{font-size:42px;line-height:1.1}
.hk-adim-metin p{font-size:16px;color:var(--hk-soluk)}
.hk-etiketler{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.hk-etiketler li{padding:5px 13px;border-radius:999px;background:var(--hk-acik);color:var(--hk-petrol-koyu);font-size:13px;font-weight:600}
.hk-sonraki{display:inline-flex;align-items:center;gap:13px;min-height:55px;margin-top:8px;padding:0 8px 0 21px;border-radius:999px;background:var(--hk-petrol);
  color:var(--hk-krem);font-weight:700;font-size:15px;cursor:pointer;transition:transform .2s}
.hk-sonraki:hover{transform:translateY(-2px)}
.hk-sonraki span{width:42px;height:42px;border-radius:50%;background:var(--hk-amber);color:var(--hk-murekkep);display:grid;place-items:center}
.hk-ilerleme{display:flex;gap:8px;padding:21px 0 144px}
.hk-ilerleme label{flex:1;padding:8px 0;cursor:pointer}
.hk-ilerleme label > span{display:block;height:5px;border-radius:5px;background:rgba(243,236,223,.18);overflow:hidden}
.hk-ilerleme i{display:block;height:100%;width:0;background:var(--hk-amber)}
.hk-ogren.hk-oynuyor:hover .hk-ilerleme i,.hk-ogren.hk-oynuyor:focus-within .hk-ilerleme i{animation-play-state:paused !important}

/* ---------- Kapanış bandı ---------- */
.hk-bant{position:relative;min-height:610px;overflow:hidden;display:flex;align-items:center;background:var(--hk-gece);color:var(--hk-krem)}
.hk-bant-zemin{position:absolute;left:0;top:-15%;width:100%;height:130%;object-fit:cover;opacity:.75;transform:translateY(calc(var(--i,0) * -89px)) scale(1.08)}
.hk-bant::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(10,24,23,.96) 0%,rgba(10,24,23,.72) 61.8%,rgba(10,24,23,.15) 100%)}
.hk-bant-halka{position:absolute;z-index:1;right:8%;top:50%;width:233px;height:233px;margin-top:-116px;border-radius:50%;border:1px solid rgba(248,147,31,.4);
  transform:translateY(calc(var(--i,0) * 89px)) rotate(calc(var(--i,0) * 180deg))}
.hk-bant-halka::before{content:"";position:absolute;left:50%;top:-7px;width:13px;height:13px;margin-left:-7px;background:var(--hk-amber);transform:rotate(45deg)}
.hk-bant-halka i{position:absolute;inset:34px;border-radius:50%;border:1px dashed rgba(243,236,223,.25)}
.hk-bant .hk-kap{z-index:2;padding-block:89px;display:flex;flex-direction:column;align-items:flex-start;gap:21px}
body .hk .hk-bant-baslik{font-size:clamp(42px,5vw,68px);line-height:1.08;max-width:61.8%;min-width:min(100%,320px)}
.hk-soz{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em}
.hk-soz > span{display:inline-block;transition:opacity .7s ease var(--d),transform .9s cubic-bezier(.2,.8,.2,1) var(--d)}
.hk-soz--vurgu{color:var(--hk-amber);font-style:italic}
.hk-js .hk-bant:not(.gorundu) .hk-soz > span{opacity:0;transform:translateY(100%)}
.hk-bant .hk-eylem{margin-top:13px}

/* ---------- İletişim ---------- */
.hk-iletisim{padding-bottom:89px}
.hk-acik{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 21px;border-radius:999px;background:var(--hk-kum);color:var(--hk-soluk);font-weight:700;font-size:14px}
.hk-acik i{width:10px;height:10px;border-radius:50%;background:var(--hk-gri)}
.hk-acik--evet{background:#E3F3EC;color:#0B5A40}
.hk-acik--evet i{background:#0B7A55;animation:hk-nabiz 2s ease-out infinite}
.hk-ilt{display:flex;flex-wrap:wrap;gap:21px;align-items:stretch}
.hk-ilt-panel{flex:1.618 1 0%;min-width:min(100%,420px);position:relative;overflow:hidden;border-radius:21px;background:var(--hk-petrol);color:var(--hk-krem);padding:34px;
  display:flex;flex-direction:column;gap:21px}
.hk-filigran--alt{top:auto;bottom:-21px;right:21px;font-size:144px;color:rgba(243,236,223,.06);transform:none}
.hk-ilt-kartlar{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(233px,1fr));gap:13px}
.hk-ilt-kart{border-radius:13px;background:rgba(243,236,223,.06);border:1px solid rgba(243,236,223,.12);padding:21px;display:flex;flex-direction:column;gap:3px}
.hk-ilt-ust{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.hk-ilt-ust > span{display:inline-flex;align-items:center;gap:13px;font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--hk-amber);text-transform:uppercase}
.hk-ilt-ust i{width:42px;height:42px;border-radius:13px;background:var(--hk-amber);color:var(--hk-murekkep);display:grid;place-items:center}
.hk-ilt-ust button{display:none;min-height:34px;padding:0 13px;border-radius:999px;border:1px solid rgba(243,236,223,.25);background:transparent;color:var(--hk-krem);
  font-family:inherit;font-size:12px;font-weight:700;cursor:pointer}
.hk-js .hk-ilt-ust button{display:inline-flex;align-items:center}
.hk-ilt-ust button.kopyalandi{background:#0B7A55;border-color:#0B7A55}
.hk .hk-ilt-kart a,.hk-ilt-kart > b{color:var(--hk-krem);text-decoration:none;font-family:var(--hk-serif);font-size:20px;font-weight:600;line-height:1.4;word-break:break-word}
.hk .hk-ilt-kart a.hk-ilt-kucuk{font-size:17px}
.hk .hk-ilt-kart a:hover{text-decoration:underline;text-underline-offset:3px}
.hk-ilt-kart small{font-size:13px;color:var(--hk-gri)}
.hk-gunler{position:relative;display:flex;flex-direction:column;gap:8px}
.hk-gunler > span{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--hk-gri);text-transform:uppercase}
.hk-gunler ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.hk-gunler li{min-height:47px;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;font-weight:700;line-height:1.2;
  border:1px solid rgba(243,236,223,.12)}
.hk-gunler li small{font-size:10px;font-weight:600;opacity:.8}
.hk-gunler .acik{background:rgba(243,236,223,.1);color:var(--hk-krem)}
.hk-gunler .kapali{color:#7F938F}
.hk-gunler .bugun{background:var(--hk-amber);border-color:var(--hk-amber);color:var(--hk-murekkep)}
.hk-ilt-alt{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:13px;padding-top:21px;border-top:1px solid rgba(243,236,223,.12)}
.hk-sosyal{display:flex;flex-wrap:wrap;gap:8px}
.hk .hk-sosyal a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 13px;border-radius:999px;background:rgba(243,236,223,.08);color:var(--hk-krem);
  text-decoration:none;font-size:13px;font-weight:700;transition:background-color .2s}
.hk .hk-sosyal a:hover{background:rgba(243,236,223,.16);color:#fff}
.hk-sosyal svg{width:16px;height:16px}
.hk .hk-form-not{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--hk-gri);text-decoration:none}
.hk a.hk-form-not:hover{color:#fff}
.hk .hk-harita{flex:1 1 0%;min-width:min(100%,320px);position:relative;overflow:hidden;border-radius:21px;background:var(--hk-kum);border:1px solid #E5DCCB;
  text-decoration:none;color:var(--hk-murekkep);display:flex;flex-direction:column;min-height:470px}
.hk .hk-harita:hover{color:var(--hk-murekkep)}
.hk-harita-cizim{position:relative;flex:1;min-height:290px;background:#EDE5D6;overflow:hidden}
.hk-harita-cizim svg{position:absolute;inset:0;width:100%;height:100%}
.hk-harita-nokta{position:absolute;left:47%;top:44%;width:21px;height:21px;margin:-10px 0 0 -10px;border-radius:50%;background:var(--hk-amber);border:4px solid #fff;
  animation:hk-nabiz 2s ease-out infinite}
.hk-harita-etiket{position:absolute;left:47%;top:44%;margin-top:-21px;padding:8px 13px;border-radius:8px;background:var(--hk-petrol);color:var(--hk-krem);font-size:13px;
  font-weight:700;white-space:nowrap;box-shadow:0 13px 21px -13px rgba(0,0,0,.5);transform:translate(-50%,-100%);animation:hk-suzul 3s ease-in-out infinite}
.hk-harita-alt{padding:21px 34px 34px;display:flex;flex-direction:column;gap:8px}
.hk-harita-alt small{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--hk-petrol);text-transform:uppercase}
.hk-harita-alt b{font-family:var(--hk-serif);font-size:20px;font-weight:600;line-height:1.4}
.hk-harita-alt > span{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--hk-petrol)}
.hk-harita-alt i{font-style:normal;transition:transform .25s}
.hk-harita:hover .hk-harita-alt i{transform:translateX(5px)}

/* ---------- Hızlı bağlantılar ---------- */
.hk-hizli{margin-top:89px}
.hk-hizli--yalniz{margin-top:0}
.hk-hizli .hk-bas-sira{margin-bottom:21px;align-items:baseline}
body .hk .hk-hizli h3{font-size:26px;line-height:1.2}
.hk-hizli .hk-bas-sira > span{font-size:14px;color:var(--hk-soluk)}
.hk-hizli-liste{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:13px}
.hk-hizli-liste li{flex:1 1 170px}
.hk-hizli-liste li.hk-hizli--amber{flex-grow:1.618}
.hk-hizli-liste li.hk-hizli--koyu{flex-basis:100%}
/* Kart dikey: simge ve ok üstte, başlık altta; dar kartta metin sıkışmasın. Koyu kart tam satır, yatay. */
.hk .hk-hizli-liste a{position:relative;height:100%;display:flex;flex-direction:column;align-items:flex-start;gap:13px;padding:21px;border-radius:21px;border:1px solid var(--hk-cizgi);background:#fff;
  color:var(--hk-murekkep);text-decoration:none}
.hk-hizli-ikon{flex:none;width:55px;height:55px;border-radius:13px;background:var(--hk-acik);color:var(--hk-petrol);display:grid;place-items:center}
.hk-hizli-metin{flex:1;min-width:0;display:flex;flex-direction:column}
.hk-hizli-metin b{font-family:var(--hk-serif);font-size:20px;font-weight:600;line-height:1.25}
.hk-hizli-metin span{font-size:13px;color:var(--hk-soluk)}
.hk-hizli-ok{position:absolute;right:21px;top:27px;flex:none;width:42px;height:42px;border-radius:50%;background:var(--hk-petrol);color:#fff;display:grid;place-items:center;transition:transform .25s}
.hk .hk-hizli-liste a:hover .hk-hizli-ok{transform:translateX(5px)}
.hk .hk-hizli--amber a{background:var(--hk-amber);border-color:var(--hk-amber)}
.hk-hizli--amber .hk-hizli-ikon{background:rgba(36,28,31,.1);color:var(--hk-murekkep)}
.hk-hizli--amber .hk-hizli-metin span{color:rgba(36,28,31,.75)}
.hk-hizli--amber .hk-hizli-ok{background:var(--hk-murekkep);color:var(--hk-amber)}
.hk .hk-hizli--koyu a{background:var(--hk-gece);border-color:var(--hk-gece);color:var(--hk-krem)}
.hk .hk-hizli--koyu a:hover{color:var(--hk-krem)}
.hk-hizli--koyu .hk-hizli-ikon{background:var(--hk-petrol);color:var(--hk-krem)}
.hk-hizli--koyu .hk-hizli-metin span{color:var(--hk-gri)}
.hk-hizli--koyu .hk-hizli-ok{background:var(--hk-amber);color:var(--hk-murekkep);position:static}
.hk .hk-hizli--koyu a{flex-direction:row;align-items:center}
.hk-hizli--koyu .hk-hizli-metin{flex:1}

/* ---------- Dar ekran ---------- */
@media (max-width:719px){
  .hk-kap{padding-inline:16px}
  .hk-bolum{padding-block:89px}
  .hk-bas{max-width:none}
  .hk-hero-kap{padding-block:55px 120px;gap:34px}
  .hk .hk-hero-giris{font-size:17px}
  .hk-kolaj{max-width:360px;margin-inline:auto}
  .hk-sayilar{margin-top:-72px}
  .hk-sayilar ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hk-sayilar li{padding:16px 18px}
  .hk-sayilar b{font-size:32px}
  .hk-kurum{padding-block:89px 55px}
  .hk-yol{padding:21px}
  .hk-yol-yil{font-size:14px}
  .hk-kartlar{grid-auto-rows:128px}
  .hk-kart-deger b{font-size:32px}
  .hk-mv{padding-bottom:89px}
  .hk-misyon,.hk-vizyon{padding:34px 21px}
  .hk-misyon p{font-size:21px}
  .hk-misyon .hk-filigran{font-size:72px}
  .hk-serit li{font-size:21px}
  .hk-ogren-bas{padding-top:89px;padding-bottom:34px}
  .hk-cip{flex:none}
  .hk-adim{min-height:0}
  .hk-adim-gorsel{min-height:300px}
  .hk-adim-no{font-size:96px;left:21px}
  .hk-mini-okul,.hk-balonlar,.hk-belge{right:21px;bottom:21px;width:72%}
  .hk-adim-metin{padding:34px 21px}
  body .hk .hk-adim-metin h3{font-size:32px}
  .hk-ilerleme{padding-bottom:89px}
  .hk-bant{min-height:480px}
  .hk-bant-halka{display:none}
  body .hk .hk-bant-baslik{max-width:none}
  .hk-ilt-panel{padding:21px}
  .hk-gunler ul{gap:3px}
  .hk-harita{min-height:380px}
  .hk-eylem .hk-btn{flex:1 1 auto;justify-content:center}
}