/* Alpi Diş · physician profile pages (hekim-<slug>.html), 2026-10-16: the client's choice "B · Kontakt baskı". Builds on
   site.css, tedavi.css (breadcrumb, intake sheet) and sube.css (live status, actions). One negative strip on the film,
   the chosen frame under the loupe on the light box, the intake sheet beside it. Pages come from tools/hekim-sayfalari.py. */

/* ---------- shared: the film masthead, the name, the facts ---------- */
.hp-hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(70% 120% at 50% 26%, #0B1068 0%, var(--navy) 38%, var(--navy-deep) 76%, var(--film) 100%)}
.hp-hero .hero-vignette{z-index:0}
.hp-in{position:relative;z-index:1;padding-top:clamp(18px, 2.2vw, 32px);padding-bottom:clamp(40px, 5vw, 72px)}
.hp-name{font-size:clamp(2.4rem, 1.1rem + 3vw, 3.9rem);font-weight:300;letter-spacing:-.03em;line-height:1.02;color:var(--white);text-wrap:balance}
.hp-name b{font-weight:640}
.hp-field{margin-top:10px;font-size:clamp(1.05rem, .95rem + .3vw, 1.2rem);font-weight:500;color:var(--bone-hi)}
.hp-facts{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:0 24px;margin-top:22px;border-top:1px solid var(--line-film)}
.hp-facts div{padding:11px 0 12px;border-bottom:1px solid var(--line-film)}
.hp-facts dt{font-size:.8rem;font-weight:600;letter-spacing:.01em;color:var(--on-film-2)}
.hp-facts dd{margin:3px 0 0;font-size:1.02rem;line-height:1.35;color:var(--white);font-variant-numeric:tabular-nums}
.hp-cta{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}
.hp-cta .link-film{text-decoration:underline;text-underline-offset:.2em;text-decoration-color:rgba(196,212,247,.45)}

/* ---------- shared light-box sections ---------- */
.hp-h2{font-size:clamp(1.9rem, 1.2rem + 1.6vw, 2.7rem);font-weight:340;letter-spacing:-.03em;line-height:1.08;color:var(--navy);text-wrap:balance}
.hp-h2 b{font-weight:620}
.hp-h3{font-family:var(--sans);font-size:.86rem;font-weight:650;letter-spacing:.01em;color:var(--on-glass-2);margin-bottom:10px}
.hp-lead{margin-top:12px;max-width:52ch;font-size:1.05rem;line-height:1.55;color:var(--on-glass-2)}
.hp-sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:8px 40px;margin-bottom:26px}
.hp-sec-head .hp-lead{margin-top:0}
/* "Tanıyalım:" on its own line, the name under it (client, 2026-10-16) */
.hp-bio-h>span,.hp-bio-h>b{display:block}
.hp-about-g{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px, 5vw, 80px);align-items:start}
.hp-bio-t{margin-top:20px;max-width:40ch;font-family:var(--display);font-size:clamp(1.2rem, 1rem + .6vw, 1.5rem);font-weight:340;line-height:1.5;letter-spacing:-.01em;color:var(--navy);text-wrap:pretty}
.hp-tl{position:relative;display:grid;gap:0}
.hp-tl li{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);gap:2px 16px;padding:12px 0 14px;border-bottom:1px solid var(--line-glass)}
.hp-tl-y{grid-row:span 2;font-family:var(--display);font-size:1.15rem;font-weight:620;color:var(--navy);font-variant-numeric:tabular-nums}
.hp-tl-k{font-size:.8rem;font-weight:650;color:var(--peri-ink)}
.hp-tl-v{font-size:1rem;line-height:1.4;color:var(--navy)}
.hp-cred-x{margin-top:26px;display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:20px}
.hp-langs li,.hp-mem li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;padding:6px 0;font-size:1rem;color:var(--navy)}
.hp-langs b{font-weight:600}
.hp-langs span{font-size:.86rem;color:var(--on-glass-2)}
.hp-groups{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:14px}
.hp-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);border-radius:8px;overflow:hidden;background:var(--white);box-shadow:0 18px 40px -26px rgba(9,13,95,.45), inset 0 0 0 1px rgba(9,13,95,.06)}
.hp-g-film{position:relative;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:22px 16px 14px;background:radial-gradient(90% 80% at 50% 40%, #0B1068 0%, var(--navy) 55%, var(--film) 100%)}
.hp-g-cap{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--on-film-2)}
.hp-g-b{padding:20px 22px 18px}
.hp-g h3 a{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-size:1.2rem;font-weight:620;letter-spacing:-.015em;color:var(--navy);text-decoration:none}
.hp-g h3 a:hover{text-decoration:underline;text-underline-offset:.15em}
.hp-g h3 .icon{width:18px;height:18px;color:var(--peri-ink)}
.hp-g-l{margin-top:10px;display:grid}
.hp-g-l li{border-top:1px solid var(--line-glass)}
.hp-g-l li>span,.hp-g-l a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:10px 0;font-size:.98rem;color:var(--navy)}
.hp-g-l a{font-weight:600;text-decoration:none}
.hp-g-l a:hover{color:var(--peri-ink)}
.hp-g-l .icon{width:16px;height:16px;color:var(--peri-ink)}
.hp-book .booking{max-width:1100px;margin-inline:auto}
.hp-rev-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px, 4vw, 64px);align-items:center}
.hp-rev-empty{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 16px;padding:22px 24px;border-radius:8px;box-shadow:inset 0 0 0 1.5px rgba(9,13,95,.16);background:rgba(255,255,255,.5)}
.hp-rev-i{grid-row:span 2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--white)}
.hp-rev-i .icon{width:22px;height:22px}
.hp-rev-empty p{font-size:1.02rem;line-height:1.5;color:var(--on-glass-2)}
.hp-rev-empty p b{display:block;color:var(--navy);font-weight:650}
.hp-rev-empty .btn-link{grid-column:2;justify-self:start}
.hp-col-l{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:12px}
.hp-col{display:grid;grid-template-columns:60px minmax(0,1fr) auto;align-items:center;gap:14px;min-height:92px;padding:12px 16px 12px 12px;border-radius:8px;background:var(--white);color:var(--navy);text-decoration:none;box-shadow:0 18px 40px -26px rgba(9,13,95,.45), inset 0 0 0 1px rgba(9,13,95,.06);transition:box-shadow .2s}
.hp-col:hover{box-shadow:0 18px 40px -22px rgba(9,13,95,.55), inset 0 0 0 1.5px var(--navy)}
.hp-col img{width:60px;height:75px;border-radius:4px;object-fit:cover;background:#1A2577}
.hp-col b{display:block;font-family:var(--display);font-size:1.02rem;font-weight:620}
.hp-col small{display:block;margin-top:3px;font-size:.86rem;color:var(--on-glass-2)}
.hp-col .icon{width:18px;height:18px;color:var(--peri-ink)}
.hp-col.is-all{grid-template-columns:minmax(0,1fr) auto;background:transparent;box-shadow:inset 0 0 0 1.5px rgba(9,13,95,.18)}

/* ---------- B · the contact sheet: the profile as one strip of frames, the chosen frame under the loupe ---------- */
.hpb-head{margin-top:16px;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 40px}
.hpb-head .hp-cta{margin-top:0}
.hpb-sub{margin-top:12px;font-size:1.05rem;color:var(--on-film-2)}
/* the strip is a lit negative viewer (client's choice of three samples, 2026-10-16: "Işık kutusu"): a dark bezel
   around a backlit panel, navy sprocket holes and edge print; the illustrations' pale ground melts into the light
   (multiply), unchosen frames sit underexposed, the chosen one is ringed in navy with its name on a navy label */
.hpb-sheet{position:relative;margin-top:clamp(26px, 3.4vw, 44px);padding:40px 16px 40px;border:10px solid #050834;border-radius:8px;background:radial-gradient(110% 170% at 50% 45%, #FFFFFF 0%, #F7F9FF 52%, #E7ECFB 100%);box-shadow:0 34px 64px -30px rgba(0,0,0,.95)}
.hpb-sheet::before,.hpb-sheet::after{content:"";position:absolute;left:0;right:0;height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='14'><rect x='6' y='3.5' width='10' height='7' rx='1.6' fill='%23090D5F' fill-opacity='.22'/></svg>") repeat-x 4px 0}
.hpb-sheet::before{top:6px}.hpb-sheet::after{bottom:6px}
.hpb-edge{position:absolute;left:18px;right:18px;top:19px;display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:.69rem;letter-spacing:.14em;color:rgba(9,13,95,.55);white-space:nowrap;overflow:hidden}
/* the portrait keeps its 4:5 print, the treatment frames are square (client, 2026-10-16); with 10px of frame padding
   each side, columns of 4.08 : 5 keep every picture the same height */
.hpb-strip{margin-top:10px;display:grid;grid-template-columns:4.08fr repeat(var(--k, 4), 5fr);gap:0;align-items:start}
.hpb-strip li+li{border-left:1px solid rgba(9,13,95,.14)}
.hpb-f{display:flex;flex-direction:column;gap:9px;width:100%;padding:0 10px;border:0;background:none;color:var(--on-glass-2);text-align:left;cursor:pointer}
.hpb-ph{display:grid;place-items:center;aspect-ratio:4 / 5;border-radius:4px;overflow:hidden;background:transparent;transition:opacity .3s, box-shadow .3s}
.hpb-ph img{width:100%;height:100%;object-fit:cover}
/* the treatment frames: the clinic's illustrations (konsept-2-rontgen/dis/), square; their pale ground takes the light */
.hpb-ph.is-sq{aspect-ratio:1 / 1;background:transparent}
.hpb-ph.is-sq img{mix-blend-mode:multiply}
.hpb-ph.is-ph{gap:8px;align-content:center;color:#4A5088;font-size:.8rem;font-weight:600;background:rgba(9,13,95,.04)}
.hpb-ph.is-ph .icon{width:26px;height:26px;color:#7C86C4}
.hpb-f:not([aria-pressed="true"]) .hpb-ph{opacity:.6}
.hpb-f:hover .hpb-ph{opacity:.85}
.hpb-f[aria-pressed="true"] .hpb-ph{opacity:1;box-shadow:0 0 0 2px var(--navy)}
.hpb-no{font-family:var(--mono);font-size:.69rem;letter-spacing:.12em;color:rgba(9,13,95,.55)}
.hpb-t{align-self:flex-start;margin-left:-9px;padding:3px 9px;border-radius:4px;font-family:var(--display);font-size:.98rem;font-weight:500;letter-spacing:-.01em;line-height:1.3;color:var(--navy)}
.hpb-f[aria-pressed="true"] .hpb-t{background:var(--navy);color:var(--white)}
.hpb-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px, 3.6vw, 56px);align-items:start}
.hpb-lp{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px, 2.8vw, 40px);align-items:start}
.hpb-lp[hidden]{display:none}
.hpb-big{margin:0;border-radius:6px;overflow:hidden;box-shadow:0 14px 30px -18px rgba(9,13,95,.45)}
.hpb-big img{display:block;width:100%;height:auto}
.hpb-big.is-sq{aspect-ratio:1 / 1;background:#EEF1FD;box-shadow:0 14px 30px -18px rgba(9,13,95,.45), inset 0 0 0 1px rgba(9,13,95,.06)}
.hpb-big.is-sq img{height:100%;object-fit:cover}
.hpb-big.is-ph{display:grid;place-items:center;align-content:center;gap:10px;color:#4A5088;font-size:.9rem;font-weight:600}
.hpb-big.is-ph .icon{width:34px;height:34px;color:#7C86C4}
.hpb-facts{border-top-color:var(--line-glass)}
.hpb-facts div{border-bottom-color:var(--line-glass)}
.hpb-facts dt{color:var(--on-glass-2)}
.hpb-facts dd{color:var(--navy)}
.hpb-side{position:sticky;top:calc(var(--header-h) + 20px)}
.hpb-side .booking .dk3-cols{grid-template-columns:minmax(0,1fr)}
@media (min-width:760px){ .hpb-side .dk3-row{grid-template-columns:86px minmax(0,1fr);padding:10px 18px} }


.hpb-fo{margin-top:16px;font-size:.98rem;line-height:1.5;color:var(--on-glass-2)}
.hpb-fo span:first-child{font-weight:650;color:var(--navy)}
.hp-lp-a{margin-top:12px;display:flex;flex-wrap:wrap;gap:4px 22px}
.hpb-lp-b .hp-h2{font-size:clamp(1.7rem, 1.2rem + 1.2vw, 2.3rem)}

@media (max-width:1100px){
  .hpb-grid,.hp-about-g,.hp-rev-g{grid-template-columns:minmax(0,1fr)}
  .hpb-side{position:static}
  .hp-col-l{grid-template-columns:repeat(2, minmax(0,1fr))}
  .hpb-strip{--u:4.4%;grid-template-columns:calc(4 * var(--u) + 4px) repeat(var(--k, 4), calc(5 * var(--u)));overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
  .hpb-strip::-webkit-scrollbar{display:none}
  .hpb-strip li{scroll-snap-align:start}
}
@media (max-width:759px){
  .hp-in{padding-top:16px;padding-bottom:32px}
  .hp-facts{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px}
  .hpb-head{flex-direction:column;align-items:flex-start}
  .hpb-sheet{margin-inline:calc(-1 * var(--gutter));border-width:6px 0;border-radius:0;padding-inline:var(--gutter)}
  .hpb-t{font-size:.9rem}
  .hpb-strip{--u:8.4%}
  .hpb-edge span:nth-child(n+3){display:none}
  .hpb-lp{grid-template-columns:minmax(0,1fr)}
  .hpb-big{width:100%}
  .hp-cred-x{grid-template-columns:minmax(0,1fr)}
  .hp-col-l{grid-template-columns:minmax(0,1fr)}
}

/* ---------- round two (finish review, client notes, 2026-10-16) ---------- */
/* frames the physician has no area for stay on the strip, unexposed and numbered, as on a real contact sheet */
.hpb-blank{display:flex;flex-direction:column;gap:9px;padding:0 10px}
.hpb-ph.is-blank{background:rgba(9,13,95,.035);box-shadow:inset 0 0 0 1px rgba(9,13,95,.1)}
.hpb-blank .hpb-no{color:rgba(9,13,95,.35)}
/* the loupe is a white sheet on the light box; the profile card has no second portrait */
.hpb-lp{padding:clamp(18px, 2.2vw, 28px);border-radius:8px;background:var(--white);box-shadow:0 18px 40px -26px rgba(9,13,95,.45), inset 0 0 0 1px rgba(9,13,95,.06)}
.hpb-lp-card{display:block}
.hpb-lp-card .hpb-facts{grid-template-columns:repeat(3, minmax(0,1fr))}
@media (max-width:759px){
  .hpb-lp-card .hpb-facts{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .hpb-lp{padding:18px 16px}
}

@media (prefers-reduced-motion:reduce){.hpb-ph{transition:none}}