/* Rana Theme · ortak · v1.0.0 */

/* ── RENKLER ── */
:root{
  --rana-yesil:#81A17B;
  --rana-koyu:#5C7857;
  --rana-derin:#3C5138;
  --rana-derin2:#2C3A28;
  --rana-sari:#FDD975;
  --rana-sari-ink:#33402F;
  --rana-acik:#EFF3EC;
  --rana-zemin:#F7F9F5;
  --rana-ink:#2A2A2A;
  --rana-metin:#5B6B66;
  --rana-soluk:#6E7A69;
  --rana-kenar:#DCE5DA;
  --rana-kenar-acik:#E4E9DE;
  --rana-hata:#A8442D;
  --rana-hata-zemin:#FBEDE8;
}

/* ── BUTON ── */
:root .rana-buton{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:46px; padding:12px 26px; margin:0;
  border:1.5px solid transparent; border-radius:999px;
  font-family:"Open Sans", sans-serif; font-size:15.5px; font-weight:700; line-height:1.2;
  letter-spacing:0; text-transform:none; text-decoration:none; white-space:nowrap;
  box-shadow:none; cursor:pointer;
  transition:background-color .22s cubic-bezier(.22,1,.36,1), color .22s cubic-bezier(.22,1,.36,1), border-color .22s cubic-bezier(.22,1,.36,1), box-shadow .22s cubic-bezier(.22,1,.36,1), transform .22s cubic-bezier(.22,1,.36,1);
}
:root .rana-buton svg{ width:18px; height:18px; flex:none; stroke:currentColor; }
:root .rana-buton--sari{ background:var(--rana-sari); color:var(--rana-sari-ink); }
:root .rana-buton--yesil{ background:var(--rana-koyu); color:#fff; }
:root .rana-buton--cizgi{ background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
:root .rana-buton--kucuk{ min-height:40px; padding:9px 22px; font-size:14.5px; }
:root .rana-buton--sari:hover,
:root a:hover > .rana-buton--sari{ background:var(--rana-koyu); color:#fff; }
:root .rana-buton--yesil:hover,
:root a:hover > .rana-buton--yesil{ background:var(--rana-sari); color:var(--rana-sari-ink); }
:root .rana-buton--cizgi:hover{ background:#fff; color:var(--rana-derin); border-color:#fff; }
:root .rana-buton:hover,
:root a:hover > .rana-buton{ transform:translateY(-2px); box-shadow:0 6px 14px rgba(60,81,56,.18); }
:root .rana-buton:active{ transform:scale(.97); box-shadow:none; transition-duration:.1s; }
:root .rana-buton:focus-visible{ outline:3px solid var(--rana-derin); outline-offset:3px; }
:root .rana-buton--cizgi:focus-visible{ outline-color:#fff; }
:root .rana-buton:disabled{ opacity:.6; cursor:not-allowed; transform:none; box-shadow:none; }

/* ── BAŞLIK ── */
:root .rana-baslik{
  position:relative; display:block; width:fit-content; max-width:100%;
  margin:0 0 22px; padding:0 0 12px; border:0;
  font-family:"Poppins", sans-serif; font-size:clamp(26px, 1.6vw + 18px, 32px); font-weight:800;
  line-height:1.25; letter-spacing:-.015em; color:var(--rana-ink); text-transform:none; text-wrap:balance;
}
:root .rana-baslik::before{ content:none; }
:root .rana-baslik::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:4px; border-radius:2px; background:var(--rana-sari); }
:root .rana-baslik--buyuk{ font-size:clamp(30px, 2.6vw + 10px, 44px); line-height:1.18; letter-spacing:-.02em; }
:root .rana-baslik--acik{ color:#fff; }

/* ── ETİKET ── */
:root .rana-etiket{
  display:flex; align-items:center; gap:9px; width:fit-content;
  margin:0 0 12px; padding:0; border:0; border-radius:0; background:none;
  font-family:"Open Sans", sans-serif; font-size:15px; font-weight:600; line-height:1.3;
  letter-spacing:0; text-transform:none; color:var(--rana-koyu);
}
:root .rana-uzmanlik .rana-etiket,
:root .rana-bolum--surec-sss .rana-etiket{ color:var(--rana-derin); }
:root .rana-etiket::before{ content:""; width:4px; height:17px; border-radius:2px; background:currentColor; flex:none; }
:root .rana-etiket--acik{ color:var(--rana-sari); }
@media(prefers-reduced-motion:reduce){
  :root .rana-buton{ transition:background-color .2s, color .2s, border-color .2s; }
  :root .rana-buton:hover,
  :root a:hover > .rana-buton,
  :root .rana-buton:active{ transform:none; }
}
