/* ===================================================================
   Tarih ve Teknoloji Koleji — tema-içi ince ayarlar (en son yüklenir)
   İç sayfa başlıkları (page-head / prose) okul markasına (Baloo/sıcak) uyarlanır.
=================================================================== */

/* İç sayfa hero başlığı: uppercase yerine yuvarlak Baloo */
.page-head h1{ font-family:"Baloo 2",system-ui,sans-serif; text-transform:none; letter-spacing:-.02em; line-height:1.05; }
.page-head .lead{ font-family:"Nunito",system-ui,sans-serif; }
.crumb{ text-transform:none; letter-spacing:.02em; }

/* prose (haber / sayfa içeriği) başlıkları da sıcak */
.prose h2,.prose h3{ font-family:"Baloo 2",system-ui,sans-serif; text-transform:none; letter-spacing:-.01em; }
.prose blockquote{ border-left-color:var(--accent); }

/* page-head sağ görsel paneli — fotoğraf + hafif overlay */
.ph-art .ph-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.ph-art .ph-shade{ position:absolute; inset:0; background:linear-gradient(120deg,rgba(11,23,16,.55),transparent 60%); pointer-events:none; }

/* Dil değiştirici — temel CSS button'a stil verir; bizim linklerimiz <a>.
   Yuvarlak pill, yeşil aktif, ayraçlı. */
.lang{ border:1.5px solid var(--hair); border-radius:999px; overflow:hidden; align-items:stretch; }
.lang a{ display:flex; align-items:center; background:var(--paper); color:var(--faint);
  padding:7px 13px; font-family:"Nunito",system-ui,sans-serif; font-weight:800; font-size:12.5px;
  letter-spacing:.03em; transition:background .14s,color .14s; }
.lang a + a{ border-left:1.5px solid var(--hair); }
.lang a.active{ background:var(--accent); color:#fff; }
.lang a:hover:not(.active){ background:var(--mist); color:var(--ink); }
.dark .lang,.dark .lang a{ border-color:rgba(255,255,255,.18); }
.dark .lang a{ background:transparent; color:rgba(255,255,255,.5); }
.dark .lang a.active{ background:var(--accent); color:#fff; }

/* ===================================================================
   MOBİL ÇEKMECE MENÜ — okul markası (açık/krem drawer + yumuşak backdrop)
   Temel tema siyah drawer + %70 saf siyah backdrop kullanıyordu ("her şey
   siyahlaşıyor"); sıcak okul paletine (krem zemin, koyu metin, yeşil aksan) çeviriyoruz.
=================================================================== */
.menu-backdrop{ background:rgba(11,23,16,.5); z-index:190; }

.mobile-menu{ width:min(90vw,360px); background:var(--paper); border-left:1px solid var(--hair);
  box-shadow:-24px 0 60px rgba(11,23,16,.16); }
.mobile-menu.open{ box-shadow:-24px 0 70px rgba(11,23,16,.22); }

.mobile-menu .mm-head{ background:var(--paper); border-bottom:1px solid var(--hair); color:var(--faint);
  font-family:"Nunito",system-ui,sans-serif; font-weight:800; text-transform:uppercase; letter-spacing:.12em;
  font-size:11px; padding:20px 26px; }
.mobile-menu .mm-close{ width:38px; height:38px; border:1px solid var(--hair); border-radius:50%;
  background:var(--paper); color:var(--ink); font-size:16px; transition:background .15s,border-color .15s,color .15s; }
.mobile-menu .mm-close:hover{ background:var(--mist); border-color:var(--accent); color:var(--accent); }

/* Menü linkleri — koyu metin, Baloo, numarasız/oksuz, sade */
.mobile-menu a:not(.btn){ color:var(--ink); font-family:"Baloo 2",system-ui,sans-serif; font-weight:700;
  font-size:clamp(19px,4.8vw,22px); text-transform:none; letter-spacing:-.01em; padding:18px 26px;
  border-bottom:1px solid var(--hair); }
.mobile-menu a:not(.btn)::before,.mobile-menu a:not(.btn)::after{ content:none !important; display:none !important; }
.mobile-menu a:not(.btn):hover{ background:var(--mist); color:var(--accent); padding-left:32px; }

/* Dil değiştirici — açık drawer için pill */
.mobile-menu .lang{ align-self:flex-start; width:auto; margin:20px 26px 6px; padding:0;
  border:1.5px solid var(--hair); border-radius:999px; overflow:hidden; }
.mobile-menu .lang a{ background:transparent; color:var(--faint); font-family:"Nunito",system-ui,sans-serif;
  font-weight:800; font-size:13px; letter-spacing:.05em; text-transform:uppercase; padding:9px 18px; border-bottom:none; }
.mobile-menu .lang a + a{ border-left:1.5px solid var(--hair); }
.mobile-menu .lang a.active{ background:var(--accent); color:#fff; }
.mobile-menu .lang a:hover:not(.active){ background:var(--mist); color:var(--ink); }

/* İletişim butonu — yeşil accent. Temel CSS (voecore.css) butonu #fff!important ile
   beyaza zorluyor; biz de !important ile eziyoruz. */
.mobile-menu .btn-primary{ background:var(--accent) !important; color:#fff !important; border-color:var(--accent) !important; }
.mobile-menu .btn-primary:hover{ background:#27913f !important; transform:translateY(-2px); box-shadow:0 14px 26px -10px rgba(47,168,79,.55); }

/* Kademe / etkinlik arşiv kartı başlıkları sıcak */
.k-card h3,.k-card .k-age{ font-family:"Baloo 2",system-ui,sans-serif; }

/* Kademe arşiv kartı */
.k-card{ display:flex; flex-direction:column; border:1px solid var(--hair); border-radius:24px; overflow:hidden;
  background:var(--paper); box-shadow:var(--soft); text-decoration:none; color:inherit;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease); }
.k-card:hover{ transform:translateY(-5px); box-shadow:0 24px 46px -22px rgba(22,41,29,.24); }
.k-card .k-medal{ display:flex; align-items:center; justify-content:center; padding:30px; background:linear-gradient(180deg,#F0F8F1,#E6F5E9); }
.k-card .k-medal img{ height:130px; width:auto; object-fit:contain; }
.k-card .k-body{ padding:24px clamp(20px,2vw,28px); display:flex; flex-direction:column; flex:1; }
.k-card .k-age{ display:inline-block; align-self:flex-start; background:var(--accent); color:#fff; font-weight:800;
  font-size:12px; padding:5px 13px; border-radius:999px; margin-bottom:12px; }
.k-card h3{ font-size:22px; letter-spacing:-.01em; }
.k-card .k-body p{ color:var(--gray); font-size:14.5px; line-height:1.66; margin-top:10px; flex:1; }
.k-card .k-more{ margin-top:16px; color:var(--accent); font-weight:700; font-size:14px; }

/* Kademe arşiv ızgarası */
.k-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,1.8vw,24px);
  padding:clamp(34px,5vh,60px) var(--pad); }
@media(max-width:900px){ .k-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .k-grid{ grid-template-columns:1fr; } }

/* ===================================================================
   FORM BUILDER (Forms::render → .cms-form) — okul temasına uyarla
=================================================================== */
.cms-form{ width:100%; }
.cms-form-fields{ display:flex; flex-wrap:wrap; gap:18px 18px; }
.cms-form-field{ display:flex; flex-direction:column; flex:1 1 100%; min-width:0; margin:0; }
.cms-form-field-w-half{ flex:1 1 calc(50% - 9px); }
.cms-form-field-w-third{ flex:1 1 calc(33.333% - 12px); }
@media(max-width:640px){ .cms-form-field-w-half,.cms-form-field-w-third{ flex:1 1 100%; } }

.cms-form-field > label{
  display:block; font-family:"Nunito",system-ui,sans-serif; font-weight:700; font-size:13px;
  letter-spacing:.01em; color:var(--gray); margin-bottom:8px; text-transform:none;
}
.cms-form-field .required{ color:var(--accent2); font-weight:800; }

.cms-form-field input,
.cms-form-field textarea,
.cms-form-field select{
  width:100%; padding:13px 15px; font-family:"Nunito",system-ui,sans-serif; font-size:15px;
  color:var(--ink); background:var(--paper); border:1.5px solid var(--hair); border-radius:14px;
  transition:border-color .15s,box-shadow .15s; -webkit-appearance:none; appearance:none;
}
.cms-form-field input::placeholder,.cms-form-field textarea::placeholder{ color:var(--faint); }
.cms-form-field input:focus,
.cms-form-field textarea:focus,
.cms-form-field select:focus{
  outline:none; border-color:var(--accent); box-shadow:0 0 0 4px rgba(47,168,79,.14);
}
.cms-form-field textarea{ min-height:150px; resize:vertical; line-height:1.6; }
.cms-form-field select{
  cursor:pointer; padding-right:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232FA84F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 15px center;
}

/* onay kutuları / radyolar */
.cms-form-check,.cms-form-radio{
  display:flex; align-items:flex-start; gap:10px; flex-direction:row;
  font-family:"Nunito",system-ui,sans-serif; font-size:13.5px; line-height:1.5; color:var(--gray);
  cursor:pointer; margin-top:4px;
}
.cms-form-check input,.cms-form-radio input{
  width:auto; flex:none; margin-top:2px; accent-color:var(--accent); cursor:pointer;
}
.cms-form-check a{ color:var(--accent); font-weight:700; text-decoration:underline; }

/* layout blokları */
.cms-form-heading{ font-family:"Baloo 2",system-ui,sans-serif; font-weight:700; color:var(--ink); font-size:20px; }
.cms-form-paragraph{ color:var(--gray); font-size:14.5px; line-height:1.6; }
.cms-form-divider{ border:none; border-top:1px solid var(--hair); margin:6px 0; }

/* gönder butonu — yeşil pill */
.cms-form-actions{ margin-top:22px !important; }
.cms-form-submit{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  background:var(--accent); color:#fff; border:none; border-radius:999px; cursor:pointer;
  padding:14px 30px; font-family:"Baloo 2",system-ui,sans-serif; font-weight:700; font-size:16px;
  transition:transform .15s var(--ease),box-shadow .15s,background .15s;
}
.cms-form-submit:hover{ background:#27913f; transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(47,168,79,.6); }

/* başarı / hata mesajları */
.cms-form-message,.cms-form-success,.cms-form-error{
  border-radius:16px; padding:16px 18px; margin-bottom:18px; font-family:"Nunito",system-ui,sans-serif; font-size:14.5px;
}
.cms-form-success,.cms-form-message{ background:rgba(47,168,79,.12); color:#1e7a38; border:1px solid rgba(47,168,79,.3); }
.cms-form-error{ background:rgba(226,74,74,.1); color:#c23b3b; border:1px solid rgba(226,74,74,.3); }

/* Foto galeri lightbox */
.ttk-gallery img{ cursor:zoom-in; }
.ttk-lb{ position:fixed; inset:0; z-index:1300; display:none; align-items:center; justify-content:center;
  background:rgba(11,23,16,.93); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.ttk-lb.open{ display:flex; animation:popFade .2s var(--ease); }
.ttk-lb-img{ max-width:92vw; max-height:86vh; object-fit:contain; border-radius:12px; box-shadow:0 30px 80px rgba(0,0,0,.6); }
.ttk-lb-close{ position:absolute; top:18px; right:22px; width:46px; height:46px; border-radius:50%; border:none;
  background:rgba(255,255,255,.14); color:#fff; font-size:26px; line-height:1; cursor:pointer; transition:background .15s; }
.ttk-lb-close:hover{ background:var(--accent); }
.ttk-lb-nav{ position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border-radius:50%; border:none;
  background:rgba(255,255,255,.14); color:#fff; font-size:30px; line-height:1; cursor:pointer; transition:background .15s;
  display:flex; align-items:center; justify-content:center; }
.ttk-lb-nav:hover{ background:var(--accent); }
.ttk-lb-prev{ left:22px; } .ttk-lb-next{ right:22px; }
.ttk-lb-count{ position:absolute; bottom:20px; left:50%; transform:translateX(-50%); color:#fff;
  font-family:"Nunito",system-ui,sans-serif; font-weight:700; font-size:13.5px; background:rgba(0,0,0,.4); padding:6px 15px; border-radius:999px; }
@media(max-width:560px){ .ttk-lb-nav{ width:42px; height:42px; font-size:24px; } .ttk-lb-prev{ left:8px; } .ttk-lb-next{ right:8px; } .ttk-lb-close{ top:10px; right:12px; } }

/* İletişim harita çerçevesi */
.ttk-map{ margin:0 var(--pad) clamp(40px,6vh,72px); border:1px solid var(--hair); border-radius:24px; overflow:hidden; box-shadow:var(--soft); }
.ttk-map iframe{ display:block; width:100%; height:clamp(320px,44vh,460px); border:0; }