/* ============================================================
   hakkimizda.css — referans afişten uyarlanan Hakkımızda bölümü
   ============================================================ */

.hk {
  --hk-blue: #073d86;
  --hk-orange: #ef8a18;
  --hk-line: rgba(224, 155, 75, 0.42);
  background:
    radial-gradient(circle at 85% 10%, rgba(255, 255, 255, 0.9), transparent 30%),
    linear-gradient(145deg, #fffdf9 0%, #fff9ef 58%, #fffdf9 100%);
  color: #30343b;
  scroll-margin-top: calc(var(--nav-h, 100px) + var(--menu-h, 60px));
}

.hk__inner {
  width: min(1480px, calc(100% - (2 * var(--gutter))));
  margin: 0 auto;
  padding: clamp(3rem, 6vw, 5.5rem) 0 clamp(2.75rem, 5vw, 4.8rem);
}

.hk__ust {
  display: grid;
  grid-template-columns: minmax(270px, 0.72fr) minmax(500px, 1.28fr);
  gap: clamp(3rem, 7vw, 7.5rem);
  align-items: stretch;
}

.hk__baslik {
  padding-right: clamp(2rem, 5vw, 5rem);
  border-right: 1px solid var(--hk-line);
}

.hk__eyebrow {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: var(--hk-blue);
  font-size: clamp(0.7rem, 0.8vw, 0.9rem);
  font-weight: 800;
  letter-spacing: 0.34em;
  text-transform: uppercase;
}

.hk__eyebrow span {
  width: clamp(38px, 4vw, 58px);
  height: 4px;
  border-radius: 999px;
  background: var(--hk-orange);
}

.hk__title {
  margin-top: clamp(1.5rem, 2.4vw, 2.5rem);
  color: var(--hk-blue);
  line-height: 0.98;
}

.hk__title-line {
  display: flex;
  align-items: baseline;
  gap: 0.22em;
  white-space: nowrap;
}

.hk__title-line + .hk__title-line { margin-top: 0.22em; }

.hk__title em {
  min-width: 1.35em;
  font-family: var(--font-display);
  font-size: clamp(2.65rem, 4.2vw, 4.8rem);
  font-weight: 400;
  font-style: italic;
  letter-spacing: -0.04em;
}

.hk__title strong {
  font-family: var(--font-body);
  font-size: clamp(2.5rem, 3.95vw, 4.5rem);
  font-weight: 800;
  letter-spacing: -0.055em;
  text-transform: uppercase;
}

.hk__icerik {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: space-between;
}

.hk__metin { display: grid; gap: clamp(1.2rem, 2vw, 2rem); }

.hk__metin p {
  font-size: clamp(0.94rem, 1.15vw, 1.16rem);
  line-height: 1.5;
  letter-spacing: -0.025em;
}

.hk__metin strong { color: var(--hk-blue); font-weight: 800; }

.hk__davet {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: clamp(1rem, 2vw, 2rem);
  align-items: center;
  margin-top: clamp(2rem, 3.6vw, 3.5rem);
  padding: clamp(1.5rem, 2.5vw, 2.5rem) 0 0;
  border-top: 1px solid rgba(7, 61, 134, 0.1);
  color: var(--hk-blue);
}

.hk__davet p {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 2.55vw, 2.8rem);
  line-height: 1.12;
  letter-spacing: -0.035em;
}

.hk__davet strong { font-family: var(--font-body); font-weight: 800; }

.hk__tirnak {
  color: #e2a04f;
  font-family: Georgia, serif;
  font-size: clamp(3.5rem, 5vw, 5.7rem);
  font-weight: 700;
  line-height: 0.45;
}

.hk__tirnak--sol { align-self: start; transform: translateY(0.22em); }
.hk__tirnak--sag { align-self: end; transform: translateY(-0.02em); }

.hk__yayin {
  display: grid;
  grid-template-columns: 42% 58%;
  margin-top: clamp(2.4rem, 5vw, 4.8rem);
  border: 1px solid rgba(7, 61, 134, 0.1);
  border-radius: 8px;
  background: rgba(255, 253, 248, 0.7);
  box-shadow: 0 12px 35px rgba(79, 49, 16, 0.03);
  overflow: hidden;
}

.hk__canli {
  display: grid;
  grid-template-columns: auto 1px 1fr;
  gap: clamp(1rem, 1.7vw, 1.6rem);
  align-items: center;
  margin: clamp(1rem, 1.7vw, 1.6rem) 0;
  padding: 0 clamp(1rem, 2vw, 2rem);
  border-right: 1px solid var(--hk-line);
}

.hk__canli-icon {
  display: grid;
  place-items: center;
  width: clamp(64px, 5.5vw, 84px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(239, 138, 24, 0.1);
  color: var(--hk-orange);
}

.hk__canli-icon svg { width: 54%; fill: none; stroke: currentColor; stroke-width: 2.5; }

.hk__canli-ayrac {
  width: 1px;
  height: 84%;
  background: var(--hk-line);
}

.hk__canli p {
  color: #656b73;
  font-size: clamp(0.78rem, 0.9vw, 0.94rem);
  line-height: 1.42;
}

.hk__canli strong { color: #424750; font-weight: 800; }
.hk__takvim { padding: clamp(1rem, 1.7vw, 1.6rem) clamp(1.2rem, 2vw, 2rem); }

.hk__takvim-baslik {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--hk-blue);
  font-size: clamp(0.67rem, 0.8vw, 0.82rem);
  font-weight: 800;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}

.hk__takvim-baslik svg {
  width: 24px;
  color: var(--hk-orange);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.hk__takvim-baslik i { height: 1px; flex: 1; background: var(--hk-line); }

.hk__saatler {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 0.8rem;
}

.hk__saat {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(0.5rem, 0.9vw, 0.8rem);
  align-items: center;
  min-width: 0;
  padding: 0 clamp(0.6rem, 1.1vw, 1rem);
}

.hk__saat:first-child { padding-left: 0; }
.hk__saat + .hk__saat { border-left: 1px solid var(--hk-line); }

.hk__saat-icon {
  display: grid;
  place-items: center;
  width: clamp(44px, 3.8vw, 58px);
  aspect-ratio: 1;
  border-radius: 50%;
  transition: transform 0.35s var(--ease-out), background-color 0.35s ease;
}

.hk__saat:hover .hk__saat-icon { transform: translateY(-4px) scale(1.05); }

.hk__saat-icon svg { width: 72%; fill: none; stroke: currentColor; stroke-width: 1.8; }
.hk__saat-icon--play { color: #df303b; }
.hk__saat-icon--play svg path { fill: currentColor; stroke: none; }
.hk__saat-icon--grup { color: #2573df; background: rgba(37, 115, 223, 0.1); }
.hk__saat-icon--sohbet { color: var(--hk-orange); background: rgba(239, 138, 24, 0.1); }

.hk__saat dt,
.hk__saat dd { white-space: nowrap; }

.hk__saat dt,
.hk__saat dd:last-child {
  color: #68717b;
  font-size: clamp(0.68rem, 0.82vw, 0.8rem);
  line-height: 1.35;
}

.hk__saat .hk__vakit {
  color: var(--hk-blue);
  font-size: clamp(1.28rem, 1.65vw, 1.7rem);
  font-weight: 800;
  line-height: 1.05;
}

@media (max-width: 900px) {
  .hk__ust { grid-template-columns: minmax(240px, 0.7fr) minmax(430px, 1.3fr); gap: 3rem; }
  .hk__yayin { grid-template-columns: 1fr; }
  .hk__canli { border-right: 0; border-bottom: 1px solid var(--hk-line); padding-bottom: 1.4rem; }
}

@media (max-width: 760px) {
  .hk__inner { width: min(100% - 2.5rem, 620px); }
  .hk__ust { grid-template-columns: 1fr; gap: 2.5rem; }
  .hk__baslik { padding: 0 0 2.5rem; border-right: 0; border-bottom: 1px solid var(--hk-line); }
  .hk__title { width: min(100%, 420px); }
  .hk__title em { font-size: clamp(1.9rem, 8.8vw, 3.15rem); }
  .hk__title strong { font-size: clamp(1.78rem, 8.35vw, 2.95rem); }
  .hk__metin p { font-size: 0.92rem; }
  .hk__davet { grid-template-columns: auto 1fr; gap: 0.75rem; }
  .hk__davet p { font-size: clamp(1.4rem, 6.2vw, 2.05rem); }
  .hk__tirnak { font-size: 3.4rem; }
  .hk__tirnak--sag { display: none; }
  .hk__saatler { grid-template-columns: 1fr; gap: 1rem; }
  .hk__saat { padding: 0 0 1rem; }
  .hk__saat + .hk__saat { padding-top: 1rem; border-left: 0; border-top: 1px solid var(--hk-line); }
  .hk__saat-icon { width: 56px; }
}

@media (prefers-reduced-motion: reduce) {
  .hk__saat-icon { transition: none; }
}

@media (max-width: 420px) {
  .hk__inner { width: min(100% - 2rem, 620px); }
  .hk__title em { min-width: 1.25em; }
  .hk__canli { grid-template-columns: auto 1px 1fr; }
  .hk__canli-icon { width: 68px; }
  .hk__takvim { padding-inline: 1.1rem; }
}