/* ==========================================================================
   Interior pages — page head, reading layout, facts, paper, related, closer,
   profile, treatments index, FAQ, publications, videos, contact, MRI
   ========================================================================== */

/* ---------- page head ---------- */
.phead { padding: 132px 0 56px; position: relative; }
.phead::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 80% at 85% 0%, rgb(9 44 116 / .07), transparent 70%);
}
.phead__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(28px, 5vw, 80px); align-items: end; }
.phead:not(.phead--article) .phead__in { grid-template-columns: minmax(0, 1fr); }
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: .88rem; color: var(--ink-3); margin-bottom: 28px; }
.crumbs a { text-decoration: none; color: var(--ink-2); }
.crumbs a:hover { color: var(--cobalt); }
.crumbs [aria-current] { color: var(--ink-3); }
.phead__h {
  font-family: var(--f-display); font-weight: 400; font-size: clamp(2.8rem, 1.5rem + 4.4vw, 5.4rem); line-height: 1;
  letter-spacing: -.04em; text-wrap: balance; max-width: 16ch;
}
.phead__h em { font-style: normal; color: var(--cobalt); }
.phead__lead { margin-top: 24px; }
.phead__act { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }

.facts__core { padding: 24px 26px 18px; }
.facts__zone { display: inline-flex; align-items: center; gap: 10px; font-size: .86rem; font-weight: 500; color: var(--cobalt); margin-bottom: 8px; }
.facts dl div { padding: 13px 0; border-bottom: 1px solid var(--seam); }
.facts dl div:last-child { border-bottom: 0; }
.facts dt { font-size: .82rem; color: var(--ink-3); margin-bottom: 3px; }
.facts dd { font-size: .98rem; color: var(--ink); line-height: 1.45; }

/* ---------- reading layout: sticky proximity ToC + prose ---------- */
.read { background: var(--white); border-block: 1px solid var(--seam); padding: clamp(44px, 5vw, 76px) 0; }
.read__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.toc { position: sticky; top: 110px; }
.toc__h { font-size: .82rem; color: var(--ink-3); margin-bottom: 14px; }
.toc ol { display: grid; gap: 2px; }
.toc a {
  display: flex; align-items: center; gap: 12px; padding: 7px 0; font-size: .92rem; color: var(--ink-3); text-decoration: none;
  transition: color var(--t-fast) var(--ease);
}
.toc a::before { content: ""; flex: none; width: 32px; height: 1.5px; background: currentColor; transform-origin: left; transform: scaleX(var(--dash, .44)); transition: transform var(--t-mid) var(--ease); }
.toc a:hover { color: var(--ink); }
.toc a[aria-current="true"] { color: var(--cobalt); }
.toc a[aria-current="true"]::before { transform: scaleX(.9); }

.prose { max-width: 70ch; font-size: 1.06rem; line-height: 1.72; color: var(--ink-2); }
/* inside the page layout (contents list + text) the text runs to the same right edge as the page head and its card */
.read__in > .prose { max-width: none; }
.prose > * + * { margin-top: 1.1em; }
.prose h2 { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.7rem, 1.3rem + 1vw, 2.3rem); line-height: 1.12; letter-spacing: -.03em; color: var(--ink); margin-top: 1.6em; scroll-margin-top: 110px; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-weight: 600; font-size: 1.15rem; letter-spacing: -.015em; color: var(--ink); margin-top: 1.8em; }
.prose strong { color: var(--ink); font-weight: 600; }
.prose a { color: var(--cobalt); }
.prose ul { display: grid; gap: .5em; }
.prose ul li { position: relative; padding-left: 22px; }
.prose ul li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--cobalt); opacity: .75; }
.prose .note { padding: 20px 22px; border-radius: 18px; background: var(--milk); box-shadow: inset 0 0 0 1px var(--seam); color: var(--ink-2); font-size: .98rem; }
.prose .note b { color: var(--ink); }
.prose .qs { border-top: 1px solid var(--seam-2); margin-top: 1.4em; }

/* ---------- doctor's paper on this topic ---------- */
.paperband { padding: clamp(56px, 7vw, 96px) 0 0; }
.paperband__in { max-width: var(--wrap); margin: 0 auto; }
.paperband__core { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 40px; padding: clamp(24px, 3vw, 40px); }
.paperband__h { font-size: .9rem; font-weight: 500; color: var(--ink-3); margin-bottom: 10px; }
.paperband__t { font-family: var(--f-display); font-size: clamp(1.3rem, 1rem + 1vw, 1.9rem); font-weight: 500; letter-spacing: -.025em; line-height: 1.2; color: var(--ink); max-width: 36ch; }
.paperband__j { margin-top: 10px; font-size: .86rem; color: var(--cobalt); }
@media (max-width: 1440px) { .paperband__in { margin-inline: var(--gut); } }

/* ---------- related + closer ---------- */
.related { padding: clamp(56px, 7vw, 96px) 0 0; }
.related__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.related .h2 { font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.8rem); }
.closer { padding: clamp(44px, 5vw, 80px) 0 var(--sec); }
.closer__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.closer__act { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------- generic band inside plain pages ---------- */
.band { padding: clamp(48px, 6vw, 88px) 0; }
.band--white { background: var(--white); border-block: 1px solid var(--seam); }
.band__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.band__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 64px; align-items: end; margin-bottom: 44px; }
.band__head .h2 { margin: 0; }

/* ---------- profile (Hakkımda) ---------- */
.profile { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.profile__photo .core { aspect-ratio: 4 / 5; overflow: hidden; }
.profile__photo .ph { border-radius: var(--r-core); }
.profile__photo { position: sticky; top: 110px; }
.bio { font-size: 1.1rem; line-height: 1.7; color: var(--ink-2); max-width: 64ch; }
.bio > * + * { margin-top: 1em; }
.bio strong { color: var(--ink); font-weight: 600; }
.cv { border-top: 1px solid var(--seam-2); }
.cv li { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--seam-2); }
.cv .yr { color: var(--cobalt); font-weight: 500; font-variant-numeric: tabular-nums; }
.cv b { display: block; color: var(--ink); font-weight: 600; letter-spacing: -.01em; }
.cv span { color: var(--ink-2); font-size: .96rem; }
.chips-list { display: flex; flex-wrap: wrap; gap: 10px; }
.chips-list li { padding: 10px 16px; border-radius: var(--r-pill); background: var(--white); box-shadow: inset 0 0 0 1px var(--seam-2); font-size: .94rem; color: var(--ink-2); }
.stat-line { display: flex; flex-wrap: wrap; gap: 10px 34px; color: var(--ink-2); }
.stat-line b { font-family: var(--f-display); font-size: 2rem; font-weight: 500; color: var(--ink); margin-right: 6px; letter-spacing: -.03em; }

/* ---------- treatments index ---------- */
.tx-zone + .tx-zone { margin-top: 64px; }
.tx-zone__h { display: flex; align-items: baseline; gap: 16px; font-family: var(--f-display); font-weight: 400; font-size: clamp(2.4rem, 1.6rem + 2.4vw, 3.8rem); letter-spacing: -.04em; line-height: 1; margin-bottom: 20px; }
.tx-zone__h small { font-family: var(--f-sans); font-size: .95rem; color: var(--ink-3); letter-spacing: 0; }

/* ---------- FAQ page ---------- */
.faqpage { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.faqpage__nav { position: sticky; top: 110px; display: grid; gap: 6px; }
.faqpage__nav a { padding: 10px 16px; border-radius: var(--r-pill); text-decoration: none; color: var(--ink-2); font-weight: 500; }
@media (hover: hover) { .faqpage__nav a:hover { background: var(--white); color: var(--ink); } }
.faqgroup + .faqgroup { margin-top: 56px; }
.faqgroup__h { font-family: var(--f-display); font-weight: 500; font-size: 2rem; letter-spacing: -.03em; margin-bottom: 14px; scroll-margin-top: 110px; }
.faqgroup .q { background: none; }

/* ---------- publications ---------- */
.pubs { border-top: 1px solid var(--seam-2); }
.pubs li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 24px; padding: 18px 0; border-bottom: 1px solid var(--seam-2); }
.pubs .t { color: var(--ink); font-weight: 500; letter-spacing: -.01em; }
/* studies open at their DOI (journal page) */
.pubs a.t { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size var(--t-mid) var(--ease), color var(--t-fast) var(--ease); }
.pubs a.t::after { content: "\2197"; display: inline-block; margin-left: 6px; font-size: .85em; color: var(--cobalt); opacity: .55; transition: transform var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease); }
.pubs a.t:hover, .pubs a.t:focus-visible { color: var(--cobalt); background-size: 100% 1px; }
.pubs a.t:hover::after, .pubs a.t:focus-visible::after { opacity: 1; transform: translate(2px, -2px); }
.pubs .j { grid-column: 1; font-size: .88rem; color: var(--ink-3); }
.pubs .y { grid-row: 1 / span 2; grid-column: 2; align-self: center; color: var(--cobalt); font-variant-numeric: tabular-nums; }
.pubs-topic + .pubs-topic { margin-top: 56px; }
.pubs-topic__h { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.6rem, 1.2rem + 1vw, 2.2rem); letter-spacing: -.03em; margin-bottom: 12px; }

/* ---------- videos page ---------- */
.vgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.vgrid .vid--wide { grid-column: span 2; }
.vgrid .vid__frame .ph { position: absolute; inset: 0; min-height: 0; border-radius: var(--r-core); }

/* ---------- contact ---------- */
.map { overflow: hidden; }
.map iframe { display: block; width: 100%; height: 420px; border: 0; border-radius: var(--r-core); filter: grayscale(.35) contrast(1.05); }
.info-list { border-top: 1px solid var(--seam-2); }
.info-list li { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--seam-2); }
.info-list dt, .info-list .k { color: var(--ink-3); font-size: .92rem; }
.info-list a { color: var(--ink); text-decoration: none; font-weight: 500; }
.info-list a:hover { color: var(--cobalt); }

/* ---------- MRI steps ---------- */
.steps3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: s; }
.steps3 .core { padding: 26px 26px 24px; height: 100%; }
.steps3 h3 { font-family: var(--f-display); font-weight: 500; font-size: 1.4rem; letter-spacing: -.025em; margin-bottom: 8px; }
.steps3 p { color: var(--ink-2); }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .read__in, .faqpage { grid-template-columns: 1fr; }
  .toc, .faqpage__nav { position: static; }
  .toc ol { display: flex; flex-wrap: wrap; gap: 4px 18px; }
  .toc a::before { display: none; }
  .faqpage__nav { display: flex; flex-wrap: wrap; }
}
@media (max-width: 900px) {
  .phead { padding-top: 120px; }
  .phead__in, .profile, .band__head { grid-template-columns: 1fr; }
  .profile__photo { position: static; max-width: 380px; }
  .vgrid { grid-template-columns: 1fr 1fr; }
  .steps3 { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .phead { padding-bottom: 48px; }
  .phead__act .pill, .closer__act .pill { width: 100%; justify-content: space-between; }
  .cv li, .info-list li { grid-template-columns: 1fr; gap: 4px; }
  .vgrid { grid-template-columns: 1fr; }
  .vgrid .vid--wide { grid-column: auto; }
  .pubs li { grid-template-columns: 1fr; }
  .pubs .y { grid-row: auto; grid-column: 1; }
  .map iframe { height: 320px; }
}

/* contact: two equal columns; the map grows so both sides end on the same line */
.desk__in--even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
.contact__side { display: flex; flex-direction: column; }
.contact__side .map { flex: 1; display: flex; }
.contact__side .map .core { flex: 1; display: flex; }
.contact__side .map iframe { height: auto; min-height: 320px; flex: 1; }
@media (max-width: 900px) { .desk__in--even { grid-template-columns: 1fr; } }

/* portrait (from the doctor's CV) */
.portrait { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; border-radius: var(--r-core); }

/* =====================================================================
   Treatments index: zone navigator + figure cards
   ===================================================================== */
.zonenav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-self: end; }
.zonenav__a { display: block; text-decoration: none; transition: transform var(--t-mid) var(--ease); }
.zonenav__a:hover { transform: translateY(-3px); }
.zonenav__core { display: grid; gap: 4px; padding: 16px 16px 14px; }
.zonenav__fig { display: block; height: 86px; margin-bottom: 8px; }
.zonenav__fig .tile__ico { width: 100%; height: 100%; }
.zonenav__core b { font-family: var(--f-display); font-weight: 500; font-size: 1.2rem; letter-spacing: -.02em; }
.zonenav__core small { font-size: .8rem; color: var(--ink-3); }
.zonenav__a:hover b { color: var(--cobalt); }
.zonenav__a:hover .tile__ret > g { opacity: 1; transform: none; }

.txz + .txz { margin-top: clamp(56px, 8vw, 96px); }
.txz__h { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; font-family: var(--f-display); font-weight: 500; font-size: clamp(2rem, 1.5rem + 1.6vw, 3rem); letter-spacing: -.04em; margin-bottom: 24px; scroll-margin-top: 110px; }
.txz__h small { font-family: var(--f-text, inherit); font-size: .95rem; letter-spacing: 0; color: var(--ink-3); font-weight: 400; }
.txgrid { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.txc {
  position: relative; display: grid; grid-template-rows: auto 1fr; height: 100%; padding: 18px 18px 20px; border-radius: 22px; text-decoration: none; overflow: hidden; isolation: isolate;
  background: var(--milk); box-shadow: inset 0 0 0 1px var(--seam);
  transition: transform var(--t-mid) var(--ease), box-shadow var(--t-mid) var(--ease), background var(--t-mid) var(--ease);
}
.txc:hover { transform: translateY(-4px); background: var(--white); box-shadow: inset 0 0 0 1px rgb(9 44 116 / .22), var(--shadow-lift); }
.txc__fig { display: grid; place-items: center; height: 150px; margin: 0 -4px 16px; border-radius: 14px; background: radial-gradient(90% 90% at 50% 100%, rgb(9 44 116 / .07), transparent 70%), var(--white); box-shadow: inset 0 0 0 1px var(--seam); }
.txc__fig .tile__ico { width: 78%; height: 84%; }
.txc__t { display: grid; gap: 6px; padding-right: 40px; }
.txc__t b { font-family: var(--f-display); font-weight: 500; font-size: 1.2rem; letter-spacing: -.025em; line-height: 1.15; color: var(--ink); }
.txc__t span { font-size: .9rem; color: var(--ink-3); }
.txc__go { position: absolute; right: 16px; bottom: 18px; width: 34px; height: 34px; padding: 9px; border-radius: 50%; background: var(--cobalt-w); color: var(--cobalt); fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform var(--t-mid) var(--ease), background var(--t-fast) var(--ease), color var(--t-fast) var(--ease); }
.txc:hover .txc__go { background: var(--cobalt); color: var(--white); transform: translate(2px, -2px); }
.txc__tag, .facts__fig figcaption {
  position: absolute; top: 26px; left: 26px; display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px 3px 7px; border-radius: 999px;
  font-size: .7rem; font-weight: 500; color: var(--ink-3); background: rgb(255 255 255 / .92); box-shadow: inset 0 0 0 1px var(--seam);
}
.txc__tag i, .facts__fig figcaption i { width: 6px; height: 6px; border-radius: 50%; background: var(--cobalt); opacity: .6; }
.txc:hover .txc__tag { color: var(--cobalt); box-shadow: inset 0 0 0 1px rgb(9 44 116 / .28); }

/* =====================================================================
   Article pages: figure on the facts card, livelier prose, sticky booking
   ===================================================================== */
.facts__fig { position: relative; display: grid; place-items: center; height: 190px; margin: -6px -6px 18px; border-radius: 16px; background: radial-gradient(90% 90% at 50% 100%, rgb(9 44 116 / .08), transparent 70%), var(--milk); box-shadow: inset 0 0 0 1px var(--seam); }
.facts__fig .tile__ico { width: 72%; height: 84%; }
.facts__fig figcaption { top: 12px; left: 12px; color: var(--cobalt); }
.facts .tile__ret > g { opacity: 1; transform: none; transition: opacity .5s ease 1.6s, transform .8s var(--ease) 1.6s; }
[data-bento].is-armed.facts .tile__ret > g { opacity: 0; transform: scale(1.7) rotate(-45deg); }
[data-bento].is-armed.facts.is-on .tile__ret > g { opacity: 1; transform: none; }

/* numbered section heads */
.prose { counter-reset: sec; }
.prose h2 { counter-increment: sec; position: relative; padding-top: 18px; border-top: 1px solid var(--seam); }
.prose h2::before {
  content: counter(sec, decimal-leading-zero); display: inline-grid; place-items: center; min-width: 38px; height: 26px; margin-right: 14px; padding: 0 8px; border-radius: 999px; vertical-align: .35em;
  font-family: var(--f-text, inherit); font-size: .78rem; font-weight: 600; letter-spacing: .02em; color: var(--cobalt); background: var(--cobalt-w);
}
.prose h2:first-child { border-top: 0; padding-top: 0; }
/* symptom / fact lists as a soft panel with check marks */
.prose ul { list-style: none; padding: 18px 20px; border-radius: 18px; background: var(--milk); box-shadow: inset 0 0 0 1px var(--seam); display: grid; gap: 10px; }
.prose ul li { position: relative; padding-left: 32px; }
.prose ul li::before {
  content: ""; position: absolute; left: 0; top: .2em; width: 20px; height: 20px; border-radius: 50%;
  background: var(--cobalt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 12px no-repeat;
}
/* treatment options: each h3 + its paragraph read as one card */
.prose h3 { margin-top: 18px; padding: 18px 22px 0; border-radius: 18px 18px 0 0; background: var(--white); box-shadow: inset 0 1px 0 var(--seam), inset 1px 0 0 var(--seam), inset -1px 0 0 var(--seam); position: relative; }
.prose h3::after { content: ""; position: absolute; left: 22px; top: 0; width: 42px; height: 3px; border-radius: 0 0 3px 3px; background: var(--cobalt); }
.prose h3 + p { margin-top: 0; padding: 8px 22px 20px; border-radius: 0 0 18px 18px; background: var(--white); box-shadow: inset 0 -1px 0 var(--seam), inset 1px 0 0 var(--seam), inset -1px 0 0 var(--seam), 0 14px 30px -26px rgb(13 17 23 / .35); }
.prose .note { border-radius: 18px; }

.toc-wrap { position: sticky; top: 110px; align-self: start; display: grid; gap: 22px; }
.toc-wrap .toc { position: static; }
.tocbook__core { padding: 18px 18px 18px; display: grid; gap: 6px; justify-items: start; }
.tocbook__h { font-family: var(--f-display); font-weight: 500; font-size: 1.05rem; letter-spacing: -.02em; }
.tocbook__p { font-size: .8rem; color: var(--ink-3); margin-bottom: 8px; }
@media (max-width: 900px) {
  .zonenav { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 8px; }
  .zonenav__fig { height: 60px; }
  .toc-wrap { position: static; }
  .tocbook { display: none; }
}
@media (max-width: 640px) {
  .txgrid { grid-template-columns: 1fr; }
  .txc { grid-template-columns: 112px 1fr; grid-template-rows: auto; align-items: center; gap: 14px; padding: 12px; }
  .txc__fig { height: 96px; margin: 0; }
  .txc__tag { display: none; }
  .txc__go { bottom: auto; top: 50%; transform: translateY(-50%); }
  .txc:hover .txc__go { transform: translateY(-50%); }
  .prose h3, .prose h3 + p { padding-left: 16px; padding-right: 16px; }
}
/* the facts card is its own [data-bento] (no .tile inside): draw when the card itself turns on */
[data-bento].is-armed.is-on > .core .tile__ico > :not(.tile__ret):not(.tile__ghost) { stroke-dashoffset: 0; transition: stroke-dashoffset 1.1s cubic-bezier(.65, 0, .35, 1) .15s; }
[data-bento].is-armed.is-on > .core .tile__ico > .tile__hot { transition: stroke-dashoffset .6s cubic-bezier(.65, 0, .35, 1) 1.05s; }
[data-bento].is-armed.is-on > .core .tile__ico > .tile__ghost { opacity: .6; transition: opacity .6s ease 1.3s; }

/* author + last-updated line on treatment pages */
.byline { display: flex; align-items: center; gap: 12px; margin: 18px 0 26px; font-size: .88rem; color: var(--ink-2); line-height: 1.35; }
.byline a { color: var(--ink); font-weight: 600; text-decoration: none; }
.byline a:hover { color: var(--cobalt); }
.byline small { font-size: .8rem; color: var(--ink-3); }
.byline__av { flex: none; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: linear-gradient(180deg, var(--milk), rgb(9 44 116 / .14)); box-shadow: inset 0 0 0 1px var(--seam); }
.byline__av img { display: block; width: 100%; height: auto; transform: scale(2.1); transform-origin: 50% 14%; }

/* ---------- page heads: a card balances the right half on profile / FAQ / list pages ---------- */
.phead.phead--card .phead__in { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); }
.headcard__core { padding: 22px 24px 24px; display: grid; gap: 16px; }
.headcard .next__who { padding-bottom: 16px; }
.headcard--photo .headcard__core { padding: 10px 10px 22px; }
.headcard--photo .headcard__core > :not(.headcard__fig) { margin-inline: 14px; }
/* the doctor: a large round portrait on the site's cobalt scan field, name beside it */
.headcard__fig {
  position: relative; margin: 0; padding: 22px 20px; border-radius: 18px; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 18px;
  background: radial-gradient(120% 120% at 18% 20%, #3466E0 0%, #0E3283 50%, #061A47 100%);
}
.headcard__fig::before { /* scan grid */
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(rgb(255 255 255 / .07) 1px, transparent 1px) 0 0 / 24px 24px, linear-gradient(90deg, rgb(255 255 255 / .07) 1px, transparent 1px) 0 0 / 24px 24px;
  -webkit-mask-image: radial-gradient(90% 120% at 20% 50%, #000 20%, transparent 85%); mask-image: radial-gradient(90% 120% at 20% 50%, #000 20%, transparent 85%);
}
.headcard__ph { /* round frame: white ring + a thin outer scan ring */
  position: relative; width: clamp(118px, 10.5vw, 150px); aspect-ratio: 1; border-radius: 50%;
  padding: 4px; background: #fff; box-shadow: 0 0 0 7px rgb(255 255 255 / .12), 0 0 0 8px rgb(255 255 255 / .28), 0 18px 34px -12px rgb(0 0 0 / .55);
}
.headcard__ph img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; object-position: 50% 50%; transition: transform .9s var(--ease); }
.headcard:hover .headcard__ph img { transform: scale(1.04); }
.headcard__id { color: #fff; }
.headcard__id b { display: block; font-family: var(--f-display); font-weight: 500; font-size: 1.25rem; line-height: 1.15; letter-spacing: -.02em; }
.headcard__id span { display: block; margin-top: 6px; font-size: .82rem; line-height: 1.4; color: rgb(255 255 255 / .78); }
@media (prefers-reduced-motion: reduce) { .headcard__ph img { transition: none; } .headcard:hover .headcard__ph img { transform: none; } }
.headcard__list { list-style: none; display: grid; gap: 12px; }
.headcard__list li { display: grid; gap: 2px; }
.headcard__list b { font-family: var(--f-display); font-weight: 500; font-size: 1rem; letter-spacing: -.02em; }
.headcard__list span, .headcard__p { font-size: .88rem; color: var(--ink-3); line-height: 1.5; }
.headcard__act .pill { width: 100%; justify-content: space-between; }
@media (max-width: 900px) { .phead.phead--card .phead__in { grid-template-columns: 1fr; } .headcard { max-width: 520px; } }

/* interior pages: running text is justified (hyphenation keeps the word gaps even) */
body:not(.is-home) :is(.prose, .bio, .q__a, .band__head, .contact__side, .pubs-intro) p {
  text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto;
}
/* narrow columns: Turkish hyphenation is not available in every browser, so justify leaves rivers - go ragged-right */
@media (max-width: 680px) {
  body:not(.is-home) :is(.prose, .bio, .q__a, .band__head, .contact__side, .pubs-intro) p { text-align: left; }
}
/* card heads: centre the title block against the taller facts card instead of dropping it to the bottom */
.phead:is(.phead--card, .phead--article) .phead__in { align-items: center; }
/* full-width ghost pill with a leading icon: centre it, space-between pushed the label to the far edge */
.phead__act .pill--ghost, .closer__act .pill--ghost { justify-content: center; }

/* interior page heads: a light blue wash */
.phead { background: linear-gradient(180deg, #E9EEFD 0%, #F2F5FE 70%, var(--milk) 100%); }

/* booking page, single column: the form comes first, contact details and map follow it */
@media (max-width: 900px) {
  .desk__in:has(> .contact__side) > .contact__side { order: 2; }
}

/* =====================================================================
   BLOG ("Hasta rehberi") — index, cards, post head, brief, references,
   home teaser. Image slots are 16:10; until a file exists they show a
   designed placeholder (light cobalt wash + the topic's line drawing).
   ===================================================================== */
.pmedia { position: relative; margin: 0; aspect-ratio: 16 / 10; overflow: hidden; border-radius: var(--r-core); background: var(--mist); }
.pmedia img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pmedia--ph {
  display: grid; place-items: center;
  background:
    radial-gradient(70% 90% at 80% 10%, rgb(9 44 116 / .10), transparent 60%),
    linear-gradient(rgb(9 44 116 / .05) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(90deg, rgb(9 44 116 / .05) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(180deg, #EEF2FE, #F6F8FF);
}
.pmedia__art { width: min(46%, 220px); }
.bcard__media .pmedia__art { width: min(60%, 280px); margin-bottom: 18px; } /* guide cards: the drawing fills most of the image slot */
.pmedia__art .tile__ret { display: none; }
.pmedia__ico { width: 40px; height: 40px; fill: none; stroke: rgb(9 44 116 / .45); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.pmedia__cap {
  position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px;
  border-radius: var(--r-pill); background: rgb(255 255 255 / .85); box-shadow: inset 0 0 0 1px var(--seam);
  font-size: .72rem; font-weight: 500; color: var(--ink-3);
}
.pmedia__cap::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--cobalt); opacity: .45; }

/* cards */
.bgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.bcard[hidden] { display: none; }
.bcard__a { display: block; height: 100%; text-decoration: none; color: inherit; transition: transform var(--t-mid) var(--ease); }
.bcard__core { display: flex; flex-direction: column; height: 100%; padding: 8px; transition: box-shadow var(--t-mid) var(--ease); }
.bcard__a:hover { transform: translateY(-4px); }
.bcard__a:hover .bcard__core { box-shadow: var(--shadow-lift), inset 0 1px 0 rgb(255 255 255 / .9); }
.bcard__media { border-radius: calc(var(--r-core) - 6px); }
.bcard__media img { transition: transform var(--t-slow) var(--ease); }
.bcard__a:hover .bcard__media img { transform: scale(1.03); }
.bcard__body { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 16px 14px 12px; }
.bcard__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: .8rem; color: var(--ink-3); }
.bcard__cat { display: inline-block; padding: 3px 10px; border-radius: var(--r-pill); background: var(--cobalt-w); color: var(--cobalt); font-weight: 600; font-size: .74rem; }
.bcard__h { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.15rem, 1rem + .4vw, 1.35rem); line-height: 1.2; letter-spacing: -.025em; color: var(--ink); text-wrap: balance; }
.bcard__ex { font-size: .92rem; line-height: 1.55; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bcard__go { margin-top: auto; padding-top: 6px; display: inline-flex; align-items: center; gap: 6px; font-size: .88rem; font-weight: 600; color: var(--cobalt); }
.bcard__go svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform var(--t-fast) var(--ease); }
.bcard__a:hover .bcard__go svg { transform: translateX(3px); }

/* index */
.blog { padding: clamp(40px, 5vw, 72px) 0 0; }
.blog__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.bfilter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; }
.bfilter__b { padding: 9px 16px; border-radius: var(--r-pill); background: var(--white); box-shadow: inset 0 0 0 1px var(--seam-2); font-size: .9rem; font-weight: 500; color: var(--ink-2); transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease); }
.bfilter__b small { margin-left: 4px; font-size: .78rem; color: var(--ink-3); }
.bfilter__b:hover { box-shadow: inset 0 0 0 1px rgb(9 44 116 / .35); }
.bfilter__b[aria-pressed="true"] { background: var(--ink); color: #fff; box-shadow: none; }
.bfilter__b[aria-pressed="true"] small { color: rgb(255 255 255 / .6); }
.blog__none { padding: 40px 0; color: var(--ink-3); }
@media (min-width: 901px) {
  .bgrid:not(.is-filtered) .bcard--lead { grid-column: 1 / -1; }
  .bgrid:not(.is-filtered) .bcard--lead .bcard__core { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: stretch; }
  .bgrid:not(.is-filtered) .bcard--lead .bcard__media { aspect-ratio: auto; min-height: 340px; height: 100%; }
  .bgrid:not(.is-filtered) .bcard--lead .bcard__body { justify-content: center; padding: clamp(24px, 3vw, 44px); gap: 14px; }
  .bgrid:not(.is-filtered) .bcard--lead .bcard__h { font-size: clamp(1.6rem, 1.1rem + 1.2vw, 2.3rem); }
  .bgrid:not(.is-filtered) .bcard--lead .bcard__ex { -webkit-line-clamp: 5; font-size: 1rem; }
}

/* post head: image slot in the right column, meta chips under the byline */
.phead--post .phead__media { box-shadow: var(--shadow-soft); outline: 6px solid rgb(13 17 23 / .035); }
.phead--post .phead__h { font-size: clamp(2.1rem, 1.3rem + 2.4vw, 3.6rem); }
.postmeta { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: -8px 0 26px; font-size: .84rem; color: var(--ink-3); }
.byline__lab { display: block; font-size: .74rem; color: var(--ink-3); margin-bottom: 1px; }

/* post body: "Kısaca" answer box (GEO), references, disclaimer */
.prose .brief { padding: 20px 22px; border-radius: 18px; background: linear-gradient(180deg, #EEF2FE, #F4F6FF); box-shadow: inset 0 0 0 1px rgb(9 44 116 / .14); }
.prose .brief p { margin: 0; }
.prose .brief__h { font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cobalt); margin-bottom: 6px; }
.prose .note { font-size: .92rem; color: var(--ink-2); padding-left: 14px; border-left: 2px solid rgb(9 44 116 / .3); }
.prose ol:not(.refs) { list-style: decimal; padding-left: 1.3em; display: grid; gap: .5em; }
.prose .refs { list-style: decimal; padding-left: 1.3em; display: grid; gap: 8px; font-size: .84rem; line-height: 1.5; color: var(--ink-3); }
.prose .disclaim { margin-top: 28px; font-size: .84rem; color: var(--ink-3); }
body:not(.is-home) .prose :is(.refs li, .disclaim, .note) { text-align: left; }
.related__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px 24px; margin-bottom: 22px; }
.related__head .h2 { margin: 0; }

/* home teaser */
.bteaser { padding: var(--sec) 0; background: var(--white); border-block: 1px solid var(--seam); }
.bteaser__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.bteaser__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 64px; align-items: end; margin-bottom: 36px; }
.bteaser__head .h2 { margin: 0; }
.bteaser__head .lead { margin-bottom: 14px; }

@media (max-width: 1100px) { .bgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bgrid--3 > :nth-child(3) { display: none; } }
@media (max-width: 900px) { .bteaser__head { grid-template-columns: 1fr; } .phead--post .phead__media { max-width: 560px; } }
@media (max-width: 640px) {
  .bgrid { grid-template-columns: 1fr; }
  .bgrid--3 > :nth-child(3) { display: block; }
  .bfilter { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--gut) * -1); padding: 2px var(--gut) 6px; scrollbar-width: none; }
  .bfilter__b { flex: none; }
}

/* =====================================================================
   BLOG (Instagram posts) — photo-first cards: the picture fills the card,
   a navy fade carries date + title; the first card of the listing is a
   2x2 feature. Post pages mirror the head: text left, facts + booking
   right, photos full width underneath.
   ===================================================================== */
.igrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: dense; gap: 18px; }
.icard { min-width: 0; }
.icard__a {
  position: relative; display: block; aspect-ratio: 4 / 5; height: 100%; overflow: hidden; isolation: isolate;
  border-radius: var(--r-shell); text-decoration: none; color: #fff; background: var(--ink);
  box-shadow: 0 1px 1px rgb(13 17 23 / .04), 0 18px 40px -26px rgb(6 26 71 / .55);
  transition: transform var(--t-mid) var(--ease), box-shadow var(--t-mid) var(--ease);
}
.icard__a:hover { transform: translateY(-4px); box-shadow: 0 2px 2px rgb(13 17 23 / .05), 0 28px 56px -26px rgb(6 26 71 / .6); }
.icard__media { position: absolute; inset: 0; z-index: -1; }
.icard__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(6 26 71 / .28) 0%, rgb(6 26 71 / 0) 26%, rgb(6 26 71 / 0) 42%, rgb(6 26 71 / .62) 70%, rgb(3 16 43 / .92) 100%); }
.icard__img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.icard__a:hover .icard__img { transform: scale(1.05); }
.icard__top { position: absolute; inset: 14px 14px auto 14px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.icard__chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 6px 11px; border-radius: var(--r-pill);
  background: rgb(255 255 255 / .9); color: var(--cobalt); font-size: .74rem; font-weight: 600;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.icard__chip--dark { background: rgb(3 16 43 / .5); color: #fff; box-shadow: inset 0 0 0 1px rgb(255 255 255 / .18); }
.icard__chip svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; }
.icard__chip svg path[d^="M8 5"] { fill: currentColor; stroke: none; }
.icard__body { position: absolute; inset: auto 0 0 0; display: grid; gap: 8px; padding: 20px 64px 20px 20px; }
.icard__meta { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: .78rem; color: rgb(255 255 255 / .78); }
.icard__meta > * + *::before { content: "·"; margin-right: 12px; opacity: .6; }
.icard__h { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.08rem, .96rem + .35vw, 1.26rem); line-height: 1.2; letter-spacing: -.02em; color: #fff; text-wrap: balance; }
.icard__ex { font-size: .95rem; line-height: 1.55; color: rgb(255 255 255 / .82); max-width: 52ch; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.icard__go {
  position: absolute; right: 18px; bottom: 20px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%;
  background: rgb(255 255 255 / .16); box-shadow: inset 0 0 0 1px rgb(255 255 255 / .3);
  transition: background var(--t-fast) var(--ease), transform var(--t-mid) var(--ease);
}
.icard__go svg { width: 16px; height: 16px; fill: none; stroke: #fff; stroke-width: 1.8; }
.icard__a:hover .icard__go { background: #fff; transform: translate(2px, -2px); }
.icard__a:hover .icard__go svg { stroke: var(--cobalt); }
.icard__a:focus-visible { outline: 3px solid var(--cobalt); outline-offset: 3px; }
@media (min-width: 901px) {
  .icard--feat { grid-column: span 2; grid-row: span 2; }
  .icard--feat .icard__a { aspect-ratio: auto; }
  .icard--feat .icard__body { padding: 32px 90px 32px 32px; gap: 12px; }
  .icard--feat .icard__h { font-size: clamp(1.6rem, 1.1rem + 1.3vw, 2.4rem); }
  .icard--feat .icard__go { width: 48px; height: 48px; right: 28px; bottom: 32px; }
}

.pager { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin-top: 48px; }
.pager__n, .pager__step { min-width: 44px; height: 44px; display: inline-grid; place-items: center; padding: 0 14px; border-radius: var(--r-pill); font-weight: 600; font-size: .92rem; text-decoration: none; color: var(--ink-2); background: var(--white); box-shadow: inset 0 0 0 1px var(--seam-2); }
.pager a:hover { box-shadow: inset 0 0 0 1px rgb(9 44 116 / .4); color: var(--cobalt); }
.pager__n[aria-current] { background: var(--cobalt); color: #fff; box-shadow: none; }

/* post: head photo, then a two-column body that lines up with the head */
.phead--ig .phead__media--ig { aspect-ratio: 1; }
.phead--ig .phead__media--ig img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.postmeta--ig { margin-top: 4px; }
.igread {
  max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut);
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(28px, 5vw, 80px); align-items: start;
}
.igpost h2 { counter-increment: none; }
.igpost h2::before { display: none; }
.igpost > p:first-child { font-size: 1.12rem; line-height: 1.7; color: var(--ink); }
.iginfo { position: sticky; top: 104px; display: grid; gap: 14px; }
.iginfo__core { padding: 22px 24px; display: grid; gap: 14px; }
.iginfo__h { font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cobalt); }
.iginfo__dl { display: grid; }
.iginfo__dl div { display: grid; grid-template-columns: 5.5rem 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--seam); }
.iginfo__dl div:last-child { border-bottom: 0; }
.iginfo__dl dt { font-size: .82rem; color: var(--ink-3); }
.iginfo__dl dd { font-size: .95rem; font-weight: 500; color: var(--ink); }
.iginfo__ig { justify-self: start; }
.iginfo__core--book { background: linear-gradient(160deg, #061a47, var(--cobalt) 70%); color: #fff; }
.iginfo__bh { font-family: var(--f-display); font-weight: 500; font-size: 1.2rem; letter-spacing: -.02em; }
.iginfo__bp { font-size: .86rem; color: rgb(255 255 255 / .75); margin-top: -6px; }
.iginfo__core--book .pill { justify-self: start; --bg: #fff; --fg: var(--cobalt); --dot: var(--cobalt-w); }
.igshots { max-width: var(--wrap); margin: clamp(36px, 4vw, 56px) auto 0; padding: 0 var(--gut); display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.igshots--1 { grid-template-columns: minmax(0, 1fr); }
.igshots--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.igshots__a { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--r-shell); background: var(--mist); }
.igshots--1 .igshots__a { aspect-ratio: 21 / 9; }
.igshots__img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.igshots__a:hover .igshots__img { transform: scale(1.04); }
.igvid { position: relative; display: block; overflow: hidden; border-radius: var(--r-core); text-decoration: none; }
.igvid img { display: block; width: 100%; height: auto; }
.igvid__play { position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; display: grid; place-items: center; border-radius: 50%; background: rgb(255 255 255 / .92); color: var(--cobalt); box-shadow: 0 12px 30px -12px rgb(13 17 23 / .5); transition: transform var(--t-mid) var(--ease); }
.igvid__play svg { width: 26px; height: 26px; fill: currentColor; margin-left: 4px; }
.igvid:hover .igvid__play { transform: scale(1.08); }
.igvid__t { position: absolute; left: 14px; bottom: 14px; padding: 6px 12px; border-radius: var(--r-pill); background: rgb(3 16 43 / .6); color: #fff; font-size: .8rem; font-weight: 600; }
.ignav { padding: clamp(40px, 5vw, 64px) 0 0; }
.ignav__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ignav__a { display: grid; gap: 6px; padding: 20px 22px; border-radius: var(--r-core); background: var(--white); box-shadow: inset 0 0 0 1px var(--seam); text-decoration: none; transition: box-shadow var(--t-fast) var(--ease); }
.ignav__a:hover { box-shadow: inset 0 0 0 1px rgb(9 44 116 / .35), var(--shadow-soft); }
.ignav__a small { font-size: .78rem; color: var(--ink-3); }
.ignav__a b { font-family: var(--f-display); font-weight: 500; font-size: 1.05rem; line-height: 1.25; letter-spacing: -.015em; color: var(--ink); }
.ignav__a--next { text-align: right; }
.ignav__all { grid-column: 1 / -1; justify-self: center; margin-top: 8px; }

/* home preview */
.bprev { padding: var(--sec) 0; }
.bprev__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.bprev__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 64px; align-items: end; margin-bottom: 36px; }
.bprev__head .h2 { margin: 0; }
.bprev__head .lead { margin-bottom: 14px; }

@media (max-width: 1100px) { .igrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .igrid--3 > :nth-child(3) { display: none; } }
@media (max-width: 900px) {
  .bprev__head { grid-template-columns: 1fr; }
  .phead--ig .phead__media--ig { max-width: 460px; }
  .igread { grid-template-columns: 1fr; }
  .iginfo { position: static; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
}
@media (max-width: 640px) {
  .igrid { grid-template-columns: 1fr; }
  .igrid--3 > :nth-child(3) { display: block; }
  .igshots, .igshots--2 { grid-template-columns: 1fr 1fr; }
  .igshots--3 > :first-child { grid-column: 1 / -1; }
  .igshots--1 .igshots__a { aspect-ratio: 4 / 3; }
  .ignav__in { grid-template-columns: 1fr; }
  .ignav__a--next { text-align: left; }
}

/* ---------- blog cards v3: compact editorial cards (photo on top, text below) ---------- */
.igrid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; }
.icard__a {
  aspect-ratio: auto; height: 100%; display: flex; flex-direction: column; gap: 14px;
  color: var(--ink); background: transparent; box-shadow: none; border-radius: 0; overflow: visible;
}
.icard__a:hover { transform: none; box-shadow: none; }
.icard__media { position: relative; inset: auto; z-index: 0; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 16px; background: var(--mist); box-shadow: inset 0 0 0 1px var(--seam); }
.icard__media::after { display: none; }
.icard__a:hover .icard__img { transform: scale(1.04); }
.icard__top { inset: 10px 10px auto 10px; z-index: 1; }
.icard__chip { padding: 4px 9px; font-size: .7rem; }
.icard__body { position: static; padding: 0 2px; gap: 6px; }
.icard__meta { color: var(--ink-3); font-size: .76rem; }
.icard__h { color: var(--ink); font-size: 1.02rem; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; transition: color var(--t-fast) var(--ease); }
.icard__a:hover .icard__h { color: var(--cobalt); }
.icard__ex, .icard__go { display: none; }
@media (min-width: 901px) { .icard--feat { grid-column: auto; grid-row: auto; } }
@media (max-width: 1180px) { .igrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .igrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; } }
@media (max-width: 480px) { .igrid { grid-template-columns: 1fr; } }
/* home preview keeps three */
.igrid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .igrid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .igrid--3 > :nth-child(3) { display: none; } }
@media (max-width: 480px) { .igrid--3 { grid-template-columns: 1fr; } .igrid--3 > :nth-child(3) { display: block; } }
.icard__meta { flex-wrap: nowrap; white-space: nowrap; overflow: hidden; }
.icard__meta > span { overflow: hidden; text-overflow: ellipsis; }

/* ---------- lightbox (blog post photos) ---------- */
.phead__media--ig a { position: absolute; inset: 0; cursor: zoom-in; }
.igshots__a { cursor: zoom-in; }
html.lb-open { overflow: hidden; }
.lb { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 64px 84px; background: rgb(3 16 43 / .9); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 0; transition: opacity .22s ease; }
.lb.is-open { opacity: 1; }
.lb[hidden] { display: none; }
.lb__fig { margin: 0; display: grid; justify-items: center; gap: 12px; width: 100%; height: 100%; align-content: center; }
.lb__img { max-width: 100%; max-height: calc(100svh - 150px); width: auto; height: auto; border-radius: 16px; box-shadow: 0 30px 80px -30px rgb(0 0 0 / .6); transform: scale(.97); transition: transform .3s var(--ease); }
.lb.is-open .lb__img { transform: none; }
.lb__cap { color: rgb(255 255 255 / .7); font-size: .85rem; }
.lb__btn { position: absolute; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: rgb(255 255 255 / .12); box-shadow: inset 0 0 0 1px rgb(255 255 255 / .25); color: #fff; transition: background var(--t-fast) var(--ease); }
.lb__btn:hover { background: rgb(255 255 255 / .24); }
.lb__btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lb__close { top: 18px; right: 18px; }
.lb__prev { left: 18px; top: 50%; margin-top: -24px; }
.lb__next { right: 18px; top: 50%; margin-top: -24px; }
.lb__btn[hidden] { display: none; }
@media (max-width: 640px) {
  .lb { padding: 64px 12px 80px; }
  .lb__prev, .lb__next { top: auto; bottom: 18px; margin-top: 0; }
  .lb__prev { left: calc(50% - 60px); } .lb__next { right: calc(50% - 60px); }
}
@media (prefers-reduced-motion: reduce) { .lb, .lb__img { transition: none; } }

/* ---------- tablet (641-1100px) ---------- */
@media (min-width: 641px) and (max-width: 1100px) {
  /* home treatments: same head layout as desktop (title left, lead right) */
  .bento__head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 40px; margin-bottom: 36px; }

  /* home patient guide: one wide card on row 1, two cards on row 2 */
  .bteaser__head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 40px; }
  .bteaser .bgrid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bteaser .bgrid--3 > :nth-child(3) { display: block; }
  .bteaser .bgrid--3 > :first-child { grid-column: 1 / -1; }
  .bteaser .bgrid--3 > :first-child .bcard__core { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: stretch; }
  .bteaser .bgrid--3 > :first-child .bcard__media { aspect-ratio: auto; min-height: 240px; height: 100%; }
  .bteaser .bgrid--3 > :first-child .bcard__body { justify-content: center; padding: 22px 22px 20px; }
  .bteaser .bgrid--3 > :first-child .bcard__h { font-size: clamp(1.3rem, 1rem + 1vw, 1.7rem); }
}

/* ---------- regulatory notice (Tanıtım Yönetmeliği md. 7/1-k, 7/1-g) and legal pages ---------- */
.notice-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.notice { display: flex; gap: 12px; align-items: flex-start; margin: 28px 0 0; padding: 14px 18px; border-radius: 14px; background: rgb(9 44 116 / .045); box-shadow: inset 0 0 0 1px rgb(9 44 116 / .1); font-size: .9rem; line-height: 1.55; color: var(--ink-2); }
.notice svg { flex: none; width: 18px; height: 18px; margin-top: 2px; fill: none; stroke: var(--cobalt); stroke-width: 1.8; stroke-linecap: round; }
.notice p { margin: 0; }
.notice b { font-weight: 600; color: var(--ink); }
.notice span { display: block; margin-top: 2px; font-size: .84rem; color: var(--ink-3); }
.foot__legal a { color: #C9D1DE; text-decoration: underline; text-underline-offset: 2px; }
.foot__legal a:hover { color: #fff; }
.legal { max-width: var(--wrap); margin: 0 auto; padding: 8px var(--gut) clamp(64px, 8vw, 120px); }
.legal .prose { max-width: 78ch; }
/* legal pages sit exactly in the header's frame: same width and inner padding as the floating nav, so the
   breadcrumb, title and text start under the logo and the content ends under the booking button */
.phead--legal .phead__in, .legal { width: min(calc(100% - 2 * var(--gut)), calc(var(--wrap) - 2 * var(--gut))); max-width: none; padding-left: 22px; padding-right: 8px; }
.legal { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.legal .prose { max-width: none; }
@media (max-width: 1100px) {
  .legal { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .legal .toc { position: static; }
  .legal .toc ol { display: flex; flex-wrap: wrap; gap: 4px 18px; }
  .legal .toc a::before { display: none; }
}
@media (max-width: 680px) { .phead--legal .phead__in, .legal { padding-left: 18px; } }
.legal .prose table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.legal .prose th, .legal .prose td { padding: 10px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--seam); }
.legal__date { color: var(--ink-3); font-size: .9rem; }

/* ---------- tablet, small and large (540-1100px): phone stacking rules lifted ---------- */
@media (max-width: 900px) {
  /* footer: clinic across, "Site" and "Profiles" side by side (phones too) */
  .foot__in { grid-template-columns: 1fr 1fr; gap: 40px 32px; }
  .foot__lead, .foot__in > .foot__col:nth-child(2) { grid-column: 1 / -1; }
}
@media (max-width: 539px) { .foot__in { gap: 32px 20px; } }
@media (min-width: 540px) and (max-width: 680px) {
  /* "book" + "contact" side by side in the page heads and the closing booking card */
  .phead__act, .closer__act { flex-wrap: nowrap; }
  .phead__act .pill, .closer__act .pill { width: auto; }
  /* bottom dock: centred, booking button a little longer than on a phone */
  .dock { left: 50%; right: auto; transform: translateX(-50%); grid-template-columns: 300px auto; }
  .dock.is-hidden { transform: translate(-50%, 140%); }
}

/* videos page: two per row on tablets and desktops */
@media (min-width: 540px) {
  .vgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vgrid .vid--wide { grid-column: auto; }
}

/* ---------- home "Hasta rehberi": a small cyan runner crosses the section's bottom line once ----------
   runs in from the right, stops mid-screen, stretches each quad (heel held to the seat), runs out to the left.
   site.js builds the figure and poses every joint per frame (feet stay planted: stride follows speed). */
.bteaser { position: relative; }
.bteaser:has(.runlane) { padding-bottom: calc(var(--sec) + 28px); } /* head room: the runner stays clear of the cards */
.runlane { --rh: 80px; position: absolute; left: 0; right: 0; bottom: 0; height: calc(var(--rh) + 16px); overflow: hidden; pointer-events: none; }
.runner { position: absolute; left: 0; bottom: 0; width: calc(var(--rh) * .6); height: var(--rh); transform: translateX(-300px); }
.runner svg { display: block; width: 100%; height: 100%; overflow: visible; transform: scaleX(-1); } /* drawn facing right, runs left */
.runner .rn-near { stroke: #1199C2; fill: #1199C2; }
.runner .rn-far { stroke: #79CDE6; fill: #79CDE6; }
.runner line { stroke-linecap: round; }
@media (max-width: 1100px) { .runlane { --rh: 64px; } }
@media (max-width: 680px) { .runlane { --rh: 52px; } }
@media (prefers-reduced-motion: reduce) { .runlane { display: none; } }

/* ---------- home "Hasta rehberi": a scroll stop. The section pins when its bottom line meets the bottom of the
   screen (--bt-top, set by site.js) and stays for ~45% of a screen of scrolling, then the page moves on ---------- */
.bthold { position: relative; background: var(--white); height: calc(var(--bt-h, auto) + 45svh); }
.bthold > .bteaser { position: sticky; top: var(--bt-top, 0px); }
@media (max-width: 680px) { .bthold { height: calc(var(--bt-h, auto) + 35svh); } }

/* ---------- uncropped card covers (site.js): the whole photo over a blurred copy of itself ---------- */
.fitbox { position: relative; overflow: hidden; }
.fitbg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: blur(22px) saturate(1.15); transform: scale(1.18); opacity: .9; pointer-events: none; }
img.is-fit { object-fit: contain !important; }
img.is-fit--flow { position: relative; }
.vid__frame .fitbg, .vid__frame:hover .fitbg { transform: scale(1.18); } /* the hover zoom is for the photo, never the backdrop */

/* guide articles: source byline (Acıbadem International Medical Board) instead of the doctor's portrait */
.byline__av--src { display: grid; place-items: center; background: var(--milk); }
.byline__av--src svg { width: 20px; height: 20px; fill: none; stroke: var(--cobalt); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.prose .brief__facts { margin: 10px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .9rem; }
.prose .brief__facts li { margin: 0; padding: 0; }
.prose .brief__facts li::before { content: none; }
.prose .srcline { font-size: .88rem; color: var(--ink-2); border-top: 1px solid var(--seam); padding-top: 14px; margin-top: 28px; }

/* Blog: paper summaries (stock photo + credit, journal line on the card) */
.pmedia--photo { background: var(--mist); }
.pmedia--photo img { object-fit: cover; }
.bcard--paper .pmedia { aspect-ratio: 16 / 10; }
.bcard--paper .pmedia img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.bcard--paper .bcard__a:hover .pmedia img { transform: scale(1.03); }
.bcard__j { display: block; margin-top: 10px; font-size: .74rem; letter-spacing: .02em; color: var(--ink-3); }
.prose .pref { font-size: .92rem; }

/* paper summaries: left = h1 + lead; right = photo, with the summary note and reading time underneath */
.phead__side { display: grid; gap: 14px; align-self: center; }
.phead__note { display: flex; align-items: center; justify-content: space-between; gap: 12px 18px; flex-wrap: wrap; padding: 0 4px; }
.phead__note .byline { margin: 0; }
.phead__time { display: inline-flex; align-items: center; gap: 6px; flex: none; padding: 6px 12px; border-radius: var(--r-pill); background: var(--white); box-shadow: inset 0 0 0 1px var(--seam); font-size: .82rem; color: var(--ink-2); white-space: nowrap; }
.phead__time svg { width: 15px; height: 15px; fill: none; stroke: var(--cobalt); stroke-width: 1.8; stroke-linecap: round; }
@media (max-width: 900px) { .phead__side { max-width: 560px; } }
.phead__note { flex-wrap: nowrap; align-items: center; }
.phead__note .byline { min-width: 0; flex: 1 1 auto; }
@media (max-width: 420px) { .phead__note { flex-wrap: wrap; } }
/* paper summaries: title column and photo column the same width */
.phead--paper .phead__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 900px) { .phead--paper .phead__in { grid-template-columns: 1fr; } }
/* paper summaries v2 (user: both halves exactly equal): the breadcrumb runs across the top, then the title
   column and the photo column share the same top and bottom edges — the title starts where the photo starts,
   the lead ends where the note under the photo ends; the photo stretches when the title column is taller. */
@media (min-width: 901px) {
  .phead--paper .phead__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto 1fr auto; align-items: stretch; row-gap: 0; }
  .phead--paper .phead__main { display: contents; }
  .phead--paper .crumbs { grid-column: 1 / -1; grid-row: 1; }
  .phead--paper .phead__h { grid-column: 1; grid-row: 2; align-self: start; margin-top: 0; }
  .phead--paper .phead__lead { grid-column: 1; grid-row: 3; align-self: end; margin-bottom: 0; }
  .phead--paper .phead__side { grid-column: 2; grid-row: 2 / 4; align-self: stretch; display: flex; flex-direction: column; }
  .phead--paper .phead__side .pmedia { flex: 1 1 auto; aspect-ratio: auto; min-height: 280px; }
  .phead--paper .phead__side .pmedia img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
}

/* ---------- About: roles & memberships with the organisations' own logos ----------
   Leadership roles read as a ledger (logo plate · role over body · years, hairlines between rows);
   memberships follow as a wall of equal logo plates with the full name underneath. Logos keep their own
   colours on white plates; the plate, not the logo, carries the site's frame. */
.orgs { display: grid; gap: 0; }
.orgs__roles { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--seam-2); }
.orole { display: grid; grid-template-columns: 168px minmax(0, 1fr) auto; align-items: center; gap: 28px; padding: 18px 0; border-bottom: 1px solid var(--seam-2); }
.orole__logo, .omem__logo { display: grid; place-items: center; background: var(--white); border-radius: 16px; box-shadow: inset 0 0 0 1px var(--seam), 0 10px 24px -18px rgb(9 44 116 / .35); }
.orole__logo { height: 84px; padding: 12px 18px; }
.orole__logo img, .omem__logo img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.orole__txt { display: grid; gap: 4px; min-width: 0; }
.orole__txt b { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.15rem, 1rem + .45vw, 1.45rem); letter-spacing: -.02em; color: var(--ink); line-height: 1.2; }
.orole__txt span { color: var(--ink-2); font-size: .95rem; line-height: 1.45; }
.orole__yr { font-variant-numeric: tabular-nums; font-size: .9rem; font-weight: 500; color: var(--cobalt); padding: 6px 12px; border-radius: var(--r-pill); background: rgb(9 44 116 / .06); white-space: nowrap; }
.orgs__mark { font-family: var(--f-display); font-weight: 600; font-size: 1.35rem; letter-spacing: .14em; color: var(--cobalt); }
.orgs__h { font-family: var(--f-display); font-weight: 500; font-size: 1.25rem; letter-spacing: -.01em; margin: 52px 0 18px; color: var(--ink); }
.orgs__wall { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.omem { display: grid; grid-template-rows: auto 1fr auto; gap: 10px; }
.omem__logo { aspect-ratio: 16 / 10; padding: 16px 20px; }
.omem__name { font-size: .86rem; line-height: 1.4; color: var(--ink-2); }
.omem__note { font-size: .78rem; font-variant-numeric: tabular-nums; color: var(--cobalt); }
@media (max-width: 1100px) { .orgs__wall { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) {
  .orole { grid-template-columns: 96px minmax(0, 1fr); gap: 6px 16px; }
  .orole__logo { height: 64px; padding: 8px 10px; grid-row: span 2; }
  .orole__yr { justify-self: start; grid-column: 2; padding: 3px 10px; font-size: .82rem; }
  .orgs__wall { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}
/* logos sit inside their plates: explicit caps (a percentage max-height has no definite parent height here) */
.orole__logo { overflow: hidden; }
.orole__logo img { max-height: 58px; max-width: 132px; }
.omem__logo { overflow: hidden; min-height: 0; }
.omem__logo img { max-height: 64px; max-width: 86%; }
@media (max-width: 680px) { .orole__logo img { max-height: 46px; max-width: 76px; } .omem__logo img { max-height: 52px; } }
@media (max-width: 680px) { .orgs__mark { font-size: 1rem; letter-spacing: .08em; } }

/* band sub-heading + justified text (About: reviewer journals) */
.band__sub { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.35rem, 1.1rem + .8vw, 1.8rem); letter-spacing: -.02em; line-height: 1.15; color: var(--ink); margin: 48px 0 14px; }
.band__text { font-size: 1.08rem; line-height: 1.7; color: var(--ink-2); text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto; }
/* band heads: the lead's right edge sits on the content's right edge */
body:not(.is-home) .band__head .lead { justify-self: end; text-align: justify; text-align-last: right; }
@media (max-width: 680px) { .band__text { text-align: left; } body:not(.is-home) .band__head .lead { justify-self: start; text-align: left; text-align-last: auto; } }

/* phones (user request 2026-10-21):
   - guide and blog articles drop the "Bu sayfada" table of contents; the article starts straight away
   - interior pages justify their title block and content headings (hyphenation keeps the gaps even) */
@media (max-width: 680px) {
  .phead--post ~ .read .toc-wrap { display: none; }
  body:not(.is-home) :is(.phead__h, .phead__lead, .prose h2, .prose h3, .band__head .h2, .band__sub) {
    text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto;
  }
}
/* justified titles on phones: full column width and normal wrapping ("balance" shortens every line on purpose,
   which is exactly what opens the gaps), a touch smaller so lines carry more words */
@media (max-width: 680px) {
  body:not(.is-home) :is(.phead__h, .prose h2, .prose h3, .band__head .h2, .band__sub) { max-width: none; text-wrap: wrap; }
  body:not(.is-home) .phead__h { font-size: clamp(1.9rem, 1.2rem + 3.6vw, 2.4rem); letter-spacing: -.035em; }
  body:not(.is-home) .phead--post .phead__h { font-size: clamp(1.8rem, 1.15rem + 3.4vw, 2.2rem); }
}
/* soft hyphens (Turkish and Russian, site.js) are in the markup on every screen: wider screens ignore them (left-aligned titles never break words) */
body:not(.is-home) :is(.phead__h, .phead__lead, .prose h2, .prose h3, .band__head .h2, .band__sub) { hyphens: none; -webkit-hyphens: none; }
@media (max-width: 680px) {
  body:not(.is-home) :is(.phead__h, .phead__lead, .prose h2, .prose h3, .band__head .h2, .band__sub) {
    hyphens: manual; -webkit-hyphens: manual; overflow-wrap: break-word;
  }
  /* title size follows the phone's width: 320px → ~1.6rem, 680px → ~2.4rem */
  body:not(.is-home) .phead__h { font-size: clamp(1.6rem, 1.05rem + 2.7vw, 2.4rem); }
  body:not(.is-home) .phead--post .phead__h { font-size: clamp(1.55rem, 1rem + 2.6vw, 2.25rem); }
  body:not(.is-home) .prose h2 { font-size: clamp(1.3rem, 1rem + 1.6vw, 1.7rem); }
}

/* ---------- tablets (user: "tek ise 2 yap"): between 540px and 680px card lists run two to a row, as they do up to
   1100px; on narrower phones they stay one per row ---------- */
@media (min-width: 540px) and (max-width: 680px) {
  .bgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bgrid--3:not(.bteaser .bgrid--3) > :nth-child(3) { display: none; } /* related rows: two cards, no orphan */
  .bteaser .bgrid--3 > :first-child { grid-column: 1 / -1; }
  .bteaser .bgrid--3 > :first-child .bcard__core { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: stretch; }
  .bteaser .bgrid--3 > :first-child .bcard__media { aspect-ratio: auto; min-height: 220px; height: 100%; }
  .bteaser .bgrid--3 > :first-child .bcard__body { justify-content: center; padding: 20px; }
}

/* guide headers: the joint drawing fills the card height instead of floating small in the middle
   (sized from the card's height, which the grid sets) */
.phead__side .pmedia--ph .pmedia__art { position: absolute; left: 50%; top: 47%; translate: -50% -50%; height: 84%; width: auto; max-width: 92%; aspect-ratio: 10 / 7; }