/* ── Tipografi ─────────────────────────────────────────────────────────
   Çift `agirbasli` (Source Serif 4 + Source Sans 3): `klasik`in Georgia'sı
   Android'de ve Linux'ta yok, başlık orada Times kopyasına düşüyordu.
   Serif yalnız iri başlıkta. Gövde boyundaki başlıklar (madde başlığı,
   sayı etiketi) gövde ailesinde yarı kalın: küçük kalın serif lekeli
   duruyordu ve aynı görevdeki kart başlıklarının bir kısmı zaten sans'tı. */
:root { --site-h-weight: 500; }
/* ferah'ın iri başlıktaki -0.03em'i serifte harfleri birbirine değdiriyordu. */
.blk-h2, .blk-stage-title, .blk-statement-title, .blk-scene-title { letter-spacing: -0.01em; }
.blk-half-item-title, .blk-half-fact-label {
  font-family: var(--site-font-body);
  font-weight: 600;
}

/* İkincil metin: 16px açık gri yerine gövdeye yakın boy, koyu ton. */
.blk-half-p, .blk-half-item-text, .blk-spec-text, .blk-specs-intro,
.blk-half-fact-text, .blk-half-sign-role, .blk-prose p {
  font-size: 1.125rem;
  color: #3d4f51;
}
.blk-half-p[data-lead="true"] { font-weight: 600; color: var(--site-ink); }
.blk-half-fact-text, .blk-half-sign-role { font-size: 1rem; }

/* Koyu açılış perdesinde marka teal'i okunmuyor: vurgu ve üst etiket açık ton. */
.blk-classic .blk-accent, .blk-classic .blk-eyebrow { color: #8fd3c8; }

/* Tedavi tablosu: aranan şey tedavinin adı — büyük harf ve gri değil. */
.blk-sheet-label {
  text-transform: none;
  letter-spacing: normal;
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--site-ink);
}

/* Adımlar: kartlar en uzununa esnetilince artan boşluk satırlara
   dağılıyor ve başlıklar kayıyordu. Satırlar içeriği kadar. */
.blk-stepblock .blk-steps > li { align-content: start; }

/* Gönder düğmesi <button>: yazı tipini miras almadığı için 13px kalıyordu. */
.blk-form-actions .blk-btn { font: inherit; font-weight: 500; }

/* Zorunlu alanlar: form "yıldızlı alanlar zorunlu" diyor, yıldızı çiz. */
.blk-form-field:has(:required) > span:first-child::after,
.blk-consent:has(:required) > span::after {
  content: " *";
  color: var(--site-primary);
}

/* Düğmesiz vurgulu bantta boş eylem satırı alta boşluk bırakıyordu. */
.blk-cta .blk-actions:not(:has(*)) { display: none; }

/* Üst bar: imza logosu (imza.py) ve altında ne iş yapıldığını söyleyen
   satır. Logo varken isim yazısı basılmıyor; satır CSS'te, çünkü üst barda
   başka metin alanı yok — TR gelince :lang(tr) ile çevrilecek. İmzanın boyu
   yazı olarak denenen 48px Corinthia'ya denk. */
.site-head[data-logo-size] { --site-logo-height: 2.2rem; }
.site-head .site-brand { flex-direction: column; align-items: flex-start; gap: 0.2rem; }
.site-head .site-brand::after {
  content: "Cancer treatment coordination · Istanbul";
  font-family: var(--site-font-body);
  font-size: 0.875rem;
  font-weight: 400;
  color: #3d4f51;
}
@media (max-width: 40rem) {
  .site-head .site-brand::after { display: none; }
}
/* Açılış barın boyu kadar yukarı çekiliyor ve o pay (--site-head-h) normal
   logoya göre 4.6rem. İmza + alt satır barı 89 piksele çıkardı; pay eski
   kalınca açılışın üstünde 16 piksellik beyaz şerit görünüyordu. Mobilde
   alt satır gizli, bar 73 piksel — orada pay olduğu gibi. */
@media (min-width: 40.01rem) {
  :root { --site-head-h: 5.6rem; }
}

/* Menü markayla yarışıyordu: gövde boyundaki 19px yerine 17px. Yalnız
   geniş ekranda — mobil panelde iri bağlantı dokunmayı kolaylaştırıyor. */
@container site-head (min-width: 48rem) {
  .site-nav a, .site-head .site-action { font-size: 1.0625rem; }
}

/* Yüzen WhatsApp düğmesi yalnız geniş ekranda: mobilde alttaki Call /
   WhatsApp şeridi aynı işi görüyor, düğme onun üstünde ikinci bir WhatsApp
   olarak duruyordu. Eşik şeridin kendi eşiği (48rem). */
@media (max-width: 47.99rem) {
  .site-fab { display: none; }
}

/* Açılır menü "Services" kelimesinin genişliğine sıkışıyor ve hizmet adları
   iki satıra bölünüyordu; en uzun öğe kadar genişlesin. */
.site-nav-sub { inline-size: max-content; max-inline-size: 22rem; }

/* ── Çizimler (.ho-*, build.py "Çizimler") ───────────────────────────
   Serbest Yazı içinde; .blk-prose'un liste ve paragraf kuralları
   burada sıfırlanıyor. Tonlar temanın teal'inden ve iki yardımcı
   renkten (gök, kum) türetiliyor. Dar ekranda her akış dikey. */
.ho-lead { max-inline-size: 46rem; margin-inline: auto; text-align: center; }
.blk-prose .ho-lead p { margin: 0; }
/* Ağırlığı .blk-prose :is(ul, ol) ile eşit: onu ezsin, aşağıdaki
   .ho-* kurallarını ezmesin. */
.blk-prose :is(ul, ol):where(.ho-flow, .ho-partners, .ho-values, .ho-traits ul, .ho-branch ul, .ho-journey ol) {
  list-style: none; padding: 0; margin: 0;
}
.blk-prose :is(.ho-flow, .ho-traits, .ho-branch, .ho-journey, .ho-partners, .ho-venn, .ho-values) li { margin: 0; }
.ho-ico { inline-size: 1.6rem; block-size: 1.6rem; flex: none; }
.ho-dot {
  inline-size: 3.5rem; block-size: 3.5rem; flex: none;
  display: grid; place-items: center; border-radius: 50%;
  background: color-mix(in srgb, var(--site-ink) 6%, var(--site-surface));
  color: var(--site-ink);
}
.ho-dot[data-tone="1"] { background: color-mix(in srgb, var(--site-primary) 16%, #fff); }
.ho-dot[data-tone="2"] { background: #F4E9DD; }
.ho-dot[data-tone="3"] { background: #E2EDF5; }
.ho-dot[data-tone="4"] { background: color-mix(in srgb, var(--site-primary) 9%, #fff); }
.ho-dot[data-tone="5"] { background: #EFEBE3; }

/* Modeller */
.ho-compare { display: grid; gap: var(--space-md); }
.ho-model {
  border: 1px solid var(--site-line); border-radius: var(--site-radius);
  padding: clamp(1.25rem, 1rem + 1.5vw, 2.25rem);
  background: var(--site-surface);
}
.ho-model[data-model="coordination"] {
  background: color-mix(in srgb, var(--site-primary) 5%, var(--site-surface));
  border-color: color-mix(in srgb, var(--site-primary) 28%, var(--site-surface));
}
.blk-prose .ho-model-head h3 { margin: 0; font-size: var(--step-2); color: var(--site-ink); }
.blk-prose .ho-model-head p { margin: 0.35rem 0 0; }
.ho-model[data-model="coordination"] .ho-dot {
  background: color-mix(in srgb, var(--site-primary) 15%, var(--site-surface));
  color: var(--site-primary-ink);
}
.ho-model .ho-dot.ho-mono {
  background: var(--site-primary); color: var(--site-on-primary);
  font-family: var(--site-font-heading); font-weight: 700; font-size: 1.15rem; letter-spacing: 0.02em;
}
.blk-prose .ho-flow { display: grid; gap: 0.25rem; margin-block: 1.5rem; }
.ho-flow > li {
  display: grid; grid-template-columns: 3.5rem 1fr; column-gap: 1rem;
  grid-template-areas: "arrow ." "dot name" "dot text" "dot .";
  align-items: center;
}
.ho-flow > li + li::before {
  content: "↓"; grid-area: arrow; justify-self: center;
  color: var(--site-muted); font-size: 1.1rem; line-height: 1; padding-block: 0.15rem 0.4rem;
}
.ho-node > .ho-dot { grid-area: dot; align-self: start; }
.ho-node > strong { grid-area: name; color: var(--site-ink); font-size: 1.0625rem; line-height: 1.25; align-self: end; }
.ho-node > span:last-child { grid-area: text; color: #3d4f51; font-size: 0.975rem; line-height: 1.4; }
.ho-branch > ul { grid-column: 2; grid-row: 2; display: grid; gap: 0.45rem; }
.ho-branch li {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.65rem 0.85rem; border-radius: calc(var(--site-radius) * 0.8);
  color: var(--site-ink); font-size: 0.95rem; line-height: 1.35;
}
.ho-branch li > span { display: grid; color: #3d4f51; }
.ho-branch li strong { color: var(--site-ink); font-size: 1rem; }
.ho-branch li[data-tone="1"] { background: color-mix(in srgb, var(--site-primary) 14%, #fff); }
.ho-branch li[data-tone="2"] { background: #E2EDF5; }
.ho-branch li[data-tone="3"] { background: #F4E9DD; }
.ho-branch li[data-tone="4"] { background: #E6EFE4; }
.ho-traits {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem 1rem;
  border-top: 1px solid var(--site-line); padding-top: 1.1rem;
}
.ho-traits > strong {
  font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--site-muted);
}
.ho-traits ul { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.ho-traits li {
  padding: 0.3rem 0.8rem; border-radius: 999px; font-size: 0.95rem;
  border: 1px solid var(--site-line); background: var(--site-surface); color: var(--site-ink);
}
.ho-model[data-model="coordination"] .ho-traits li {
  border-color: transparent;
  background: color-mix(in srgb, var(--site-primary) 14%, var(--site-surface));
  color: var(--site-primary-ink);
}
.ho-model[data-model="coordination"] .ho-traits li::before { content: "✓ "; }

@media (min-width: 64rem) {
  .blk-prose .ho-flow { display: flex; align-items: flex-start; gap: 1.6rem; }
  .ho-flow > li {
    position: relative; flex: 1 1 0; min-inline-size: 0;
    grid-template-columns: 1fr; grid-template-areas: "dot" "name" "text";
    justify-items: center; text-align: center; row-gap: 0.45rem;
  }
  .ho-flow > li + li::before {
    content: "→"; position: absolute; inset-inline-start: -1.25rem; inset-block-start: 2rem;
    translate: 0 -50%; padding: 0;
  }
  .ho-node > .ho-dot { inline-size: 4rem; block-size: 4rem; margin-block-end: 0.35rem; }
  .ho-node > strong { font-size: 1rem; }
  .ho-node > span:last-child { font-size: 0.9rem; }
  .ho-flow > .ho-branch { flex: 2.3 1 0; justify-items: stretch; text-align: start; }
  .ho-flow > .ho-branch::before { inset-block-start: 50%; }
  .ho-branch > ul {
    grid-column: 1; grid-row: auto; padding-inline: 0.75rem;
    border-inline: 1.5px solid color-mix(in srgb, var(--site-primary) 35%, var(--site-surface));
    border-radius: 0.75rem;
  }
  .ho-branch li { padding: 0.55rem 0.75rem; font-size: 0.875rem; }
  .ho-branch li strong { font-size: 0.95rem; }
  .ho-branch .ho-ico { inline-size: 1.4rem; block-size: 1.4rem; }
}

/* Yolculuk */
.ho-journey { margin-block-start: var(--space-md); text-align: center; }
.ho-journey ol { position: relative; display: grid; gap: 1rem; text-align: start; max-inline-size: 26rem; margin-inline: auto; }
.ho-journey ol::before {
  content: ""; position: absolute; inset-block: 1.75rem; inset-inline-start: 1.75rem;
  border-inline-start: 1.5px dashed color-mix(in srgb, var(--site-primary) 45%, var(--site-surface));
}
.ho-journey li { position: relative; display: flex; align-items: center; gap: 1rem; color: var(--site-ink); font-size: 1.0625rem; }
.blk-prose .ho-journey-close {
  margin: var(--space-md) auto 0; max-inline-size: 36rem;
  font-family: var(--site-font-heading); font-size: var(--step-1); line-height: 1.35; color: var(--site-ink);
}
.blk-prose .ho-journey-tag {
  margin: 0.75rem 0 0; font-size: 0.8125rem; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--site-primary-ink);
}
.ho-journey-tag::before {
  content: ""; display: block; inline-size: 3rem; margin: 0 auto 0.75rem;
  border-block-start: 2px solid var(--site-primary);
}
@media (min-width: 48rem) {
  .ho-journey ol { grid-template-columns: repeat(5, 1fr); max-inline-size: none; text-align: center; }
  .ho-journey ol::before {
    inset-block: 2.25rem auto; inset-inline: 10%;
    border-inline-start: 0;
    border-block-start: 1.5px dashed color-mix(in srgb, var(--site-primary) 45%, var(--site-surface));
  }
  .ho-journey li { flex-direction: column; justify-content: flex-start; gap: 0.75rem; }
  .ho-journey .ho-dot { inline-size: 4.5rem; block-size: 4.5rem; box-shadow: 0 0 0 6px var(--site-surface); }
  .ho-journey .ho-ico { inline-size: 1.9rem; block-size: 1.9rem; }
}

/* Venn */
.ho-venn { position: relative; inline-size: min(100%, 36rem); aspect-ratio: 1 / 0.93; margin: var(--space-md) auto 0; }
.ho-venn-c, .ho-venn-core {
  position: absolute; box-sizing: border-box; border-radius: 50%; aspect-ratio: 1;
  display: flex; flex-direction: column; align-items: center; gap: 0.5rem; text-align: center;
  font-family: var(--site-font-heading); font-size: clamp(1rem, 0.9rem + 0.4vw, 1.2rem); line-height: 1.2;
  color: var(--site-ink);
}
.ho-venn-c { inline-size: 58%; mix-blend-mode: multiply; }
.ho-venn-c .ho-ico, .ho-venn-core .ho-ico { inline-size: 2.2rem; block-size: 2.2rem; }
.ho-venn-c[data-c="1"] {
  inset-inline-start: 21%; inset-block-start: 0; padding: 8% 10% 0;
  background: color-mix(in srgb, var(--site-primary) 22%, #fff);
}
.ho-venn-c[data-c="2"] {
  inset-inline-start: 0; inset-block-end: 0; justify-content: flex-end; padding: 0 23% 9% 5%;
  background: #CFE1EE;
}
.ho-venn-c[data-c="3"] {
  inset-inline-end: 0; inset-block-end: 0; justify-content: flex-end; padding: 0 5% 9% 23%;
  background: #F2DCC9;
}
.ho-venn-core {
  inline-size: 32%; inset-inline-start: 34%; inset-block-start: 39%;
  justify-content: center; padding: 3%;
  background: var(--site-primary); color: var(--site-on-primary);
  border: 3px solid var(--site-surface);
  font-family: var(--site-font-body); font-size: 0.875rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
}
@media (max-width: 40rem) {
  .ho-venn { aspect-ratio: auto; display: grid; gap: 0.6rem; }
  .ho-venn-c, .ho-venn-core {
    position: static; inline-size: auto; aspect-ratio: auto; mix-blend-mode: normal;
    flex-direction: row; justify-content: flex-start; text-align: start; gap: 1rem;
    padding: 1rem 1.25rem; border-radius: var(--site-radius);
  }
  .ho-venn-c[data-c] { justify-content: flex-start; padding: 1rem 1.25rem; }
  .ho-venn-core { order: -1; border: 0; }
}

/* Ortaklar */
/* Sarmalayıcı: doğrudan çocuk liste prose'un 44rem ölçüsüne takılıyordu. */
.ho-partners-wrap { margin-block-start: var(--space-md); }
/* Menüden çapayla gelince yapışkan üst bar başlığı örtmesin. */
.ho-anchor { scroll-margin-top: calc(var(--site-head-h, 4.5rem) + 2rem); }
.blk-prose .ho-partners {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 0.75rem;
}
.ho-partners li {
  display: flex; flex-direction: column; align-items: center; gap: 0.75rem; text-align: center;
  padding: 1.25rem 0.75rem; border: 1px solid var(--site-line); border-radius: var(--site-radius);
  color: var(--site-ink); font-size: 1rem; line-height: 1.3;
}
.ho-partners .ho-dot {
  background: color-mix(in srgb, var(--site-primary) 12%, var(--site-surface));
  color: var(--site-primary-ink);
}

/* Değerler */
.ho-values-wrap { max-inline-size: 60rem; margin-inline: auto; }
.ho-values li {
  display: grid; gap: 1rem 3rem; padding-block: 2rem;
  border-block-start: 1px solid var(--site-line);
}
.ho-values li:last-child { border-block-end: 1px solid var(--site-line); }
.ho-values-head { display: flex; align-items: center; gap: 1rem; }
.ho-values .ho-dot {
  background: color-mix(in srgb, var(--site-primary) 12%, var(--site-surface));
  color: var(--site-primary-ink);
}
.blk-prose .ho-values h3 { margin: 0; font-size: var(--step-1); color: var(--site-ink); }
.blk-prose .ho-values-body p { margin: 0 0 0.85rem; }
.blk-prose .ho-values-body p:last-child { margin: 0; }
@media (min-width: 48rem) {
  .ho-values li { grid-template-columns: 15rem 1fr; }
  .ho-values-head { flex-direction: column; align-items: flex-start; }
}

/* Hareket: kelime bulanıklığı yok, belirme kısa ve kısa mesafeli. */
@media (prefers-reduced-motion: no-preference) {
  [data-motion] [data-reveal="rise"] {
    translate: 0 0.5rem;
    transition: opacity 0.45s ease, translate 0.45s ease;
    transition-delay: calc(var(--i, 0) * 40ms);
  }
  [data-motion] [data-reveal="words"] .blk-word {
    filter: none;
    transition: opacity 0.4s ease;
    transition-delay: calc(var(--i, 0) * 20ms);
  }
  [data-motion] [data-reveal="zoom"] { scale: 1.02; }
}