/* Oldal: Nőgyógyász magánrendelés Kiskunhalason. Dr. Badó Attila.
   Az aloldal.css UTÁN töltődik, csak ezen az oldalon. Forrás: a jóváhagyott végleges oldal
   (design/mockup/valtozatok/), a közös drbado.css-ből és az oldal saját CSS-éből kiválogatva.
   Kézzel ne írd át: ha valami nem egyezik, a mérés (ellenorzes.py) mutatja meg, hol. */


/* ---- az oldal saját szabályai ---- */
.h-quick{margin-top:6px}
.h-quick li{padding:10px 0}
.h-quick .oic{width:44px; height:44px}
.h-quick .oic .ico{width:21px; height:21px}
.h-quick li>span:last-child{font-weight:600; font-size:16.5px}
.h-quick small{font-weight:500}
.h1b{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:40px clamp(40px,6vw,96px); align-items:center}
.h1b-ph{min-height:clamp(460px,44vw,620px)}
.h1b-tag{position:absolute; left:16px; bottom:16px; z-index:3; display:flex; align-items:center; gap:12px; padding:12px 16px; border-radius:18px; font-size:15px; line-height:1.3}
.h1b-tag .ico{width:22px; height:22px; color:var(--acc)}
.h1b-tag b{display:block; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--acc)}
.h2a{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px clamp(32px,5vw,72px); margin-top:36px; align-items:start}
.h-dl{display:flex; flex-direction:column}
.h-dl .r, .h-dl-extra{display:grid; grid-template-columns:48px minmax(0,1fr); gap:2px 16px; padding:16px 0; border-top:1px solid var(--line)}
.h-dl .r:first-child{border-top:0; padding-top:0}
.h-dl .oic, .h-dl-extra .oic{width:48px; height:48px; grid-row:span 2}
.h-dl .oic .ico, .h-dl-extra .oic .ico{width:22px; height:22px}
.h-dl dt, .h-dl-extra dt{font-weight:600; font-size:16px}
.h-dl dd, .h-dl-extra dd{margin:0; color:var(--mute); font-size:15.5px; line-height:1.5}
.h2a-r{display:flex; flex-direction:column; gap:16px}
.h-map{min-height:clamp(300px,28vw,380px); border-radius:30px; box-shadow:var(--shadow-card)}
.h-maplink{position:absolute; right:14px; bottom:14px; z-index:2; display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; background:#fff; color:var(--ink); font-weight:600; font-size:14.5px; text-decoration:none; box-shadow:var(--shadow-card)}
.h-maplink .ico{width:18px; height:18px; color:var(--acc)}
.h2a-ph{aspect-ratio:16/10}
.h-terseg-row{display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; margin-top:clamp(40px,4vw,56px); padding:18px 22px; border-radius:24px; background:rgba(255,255,255,.6); border:1px solid var(--outline)}
.h-terseg-row>b{font-family:var(--display); font-weight:600; font-size:19px}
.h-terseg-row .b1-chips{margin-top:0}
.h3b-gal{display:grid; grid-template-columns:1.3fr .9fr .9fr; grid-template-rows:1fr 1fr; gap:var(--gut); height:clamp(460px,44vw,600px); margin-top:36px}
.h3b-gal figure{margin:0; border-radius:28px; overflow:hidden; position:relative}
.h3b-gal img{position:absolute; inset:0}
.h3b-gal .g1{grid-row:span 2}
.h3b-gal .g1 img{object-position:50% 100%}
.h3b-gal .g4{grid-column:2 / span 2}
.h3b-sub{font-family:var(--display); font-weight:600; font-size:clamp(24px,2.3vw,32px); margin-top:clamp(56px,6vw,88px)}
.h3b-cols{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,3vw,44px); margin-top:24px}
.h3b-cols .c{display:flex; flex-direction:column; gap:10px}
.h3b-cols .mini{width:56px; height:56px}
.h3b-cols b{font-family:var(--display); font-weight:600; font-size:19px}
.h3b-cols span{color:var(--mute); font-size:15.5px; line-height:1.5}
.h3b-pr{display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; margin-top:16px; padding:18px 24px; border-radius:24px; background:linear-gradient(120deg,var(--h1) 0%,var(--h2) 100%)}
.h3b-pr>b{font-family:var(--display); font-weight:600; font-size:19px}
.h3b-pr>span{display:flex; flex-wrap:wrap; gap:8px 22px}
.h3b-pr i{font-style:normal; font-size:15px}
.h3b-pr em{font-style:normal; font-family:var(--display); font-weight:600; font-size:18px}
.g4a-box{max-width:600px}
@media (max-width:900px){
  .h1b, .h2a, .h3b-cols{grid-template-columns:1fr}
  .h1b-ph{min-height:420px}
  .h3b-gal{grid-template-columns:1fr 1fr; grid-template-rows:260px 160px 160px; height:auto}
  .h3b-gal .g1{grid-row:auto; grid-column:span 2}
  .h3b-gal .g4{grid-column:span 2}
}
.h3b-gal .g1 img{object-position:40% 50%}
.drbado-page img.kep-hal-nevtabla{object-position:50% 60%}
.zone>.blob+.g4a-cta{margin-top:0}
.drbado-page img.kep-hal-fejlec{object-position:10% 50%}
.drbado-page img.kep-hal-megkozelites{object-position:50% 50%}
.drbado-page img.kep-hal-zaro{object-position:50% 71%}
@media (max-width:900px){
  .drbado-page img.kep-hal-fejlec{object-position:4% 50%}
}
@media (max-width:640px){
  .drbado-page img.kep-hal-zaro{object-position:62% 50%}
}
.h1b-ph>.kep-forras{position:absolute; right:10px; top:12px; z-index:4; max-width:calc(100% - 20px); padding:4px 10px; border-radius:999px; background:rgba(255,255,255,.84); color:#40585C; font-size:11px; font-weight:600; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.kep-forras a{color:inherit; text-decoration:none}
.kep-forras a:hover{text-decoration:underline}
@media (max-width:560px){
  .h1b-ph>.kep-forras{white-space:normal; overflow:visible; text-overflow:clip; border-radius:12px; line-height:1.35}
}