/* ═══════════════════════════════════════════════════════════════════════════
   OLDAL-KAPCSOLAT.CSS – CSAK A KAPCSOLAT LAPON
   ---------------------------------------------------------------------------
   A fej.php automatikusan betölti, ha ez a fájl létezik. A terv.css-t NEM
   írja át: minden szabály vagy a lap törzsosztályára (.o-kapcsolat) van kötve,
   vagy olyan osztályra, ami csak ezen a lapon fordul elő (.urlap*, .terkep*,
   .hero-lapok, .kapcs-grid).

   NINCS BENNE: img{height:…}, .pg{object-fit:…}. Azt a két szabályt a terv.css
   vége tartja (49 képből 0 torzult), és itt sem kerül megint szóba.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ═══ NYITÁNY ═══════════════════════════════════════════════════════════════
   A v1 nyitánya KÉT mondatot ígér („Kérdése van…? Válassza ki…"), a terv.css
   .hero-line-ja viszont egy mondatra van szabva (32ch). 46ch-n ugyanez a két
   mondat három sor, nem öt – a nyitány így nem nyúlik szét alatta. */
.o-kapcsolat .hero-line{max-width:46ch}

/* A terv.css a hero-állításokat EGY SORBA szánja, és a tételek közé „·"-ot tesz
   (.claims li+li::before). A főoldalon négy RÖVID állítás van, ott a második
   sorra is jut kettő, tehát a sor eleji pont a „· tétel · tétel" ritmus része.
   Itt két HOSSZÚ állítás van: a második mindig új sorba kerül, és a pont
   egyedül, a sor elején áll – elütésnek látszik. Ezen a lapon ezért a két
   állítás egymás alatt áll, elválasztó nélkül. A betűméret, a szín és a
   félkövér kiemelés változatlan, tehát a főoldal nyelvén marad. */
.o-kapcsolat .claims{flex-direction:column;gap:6px}
.o-kapcsolat .claims li+li::before{content:none}

/* A v1 hero-actions négy szakterület-gombja. Saját gombstílus NEM készült
   hozzá: a terv.css .btn-ghost-light + .btn-sm párosa pontosan az, ami a
   v1-ben a btn-outline-light btn-sm volt. */
.hero-lapok{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.hero-lapok .btn .i{width:15px;height:15px;color:var(--gray-2)}
.hero-lapok .btn:hover .i{color:#fff}
/* Kéthasábos nyitányban a négy gomb 3+1-re törik – ott 2×2 egyenlő mezőben
   áll, ami szándékosnak látszik, nem megcsúszott sornak. Egyhasábos
   nyitányban (1080 px alatt) a teljes szélességen elfér mind a négy. */
@media (min-width:1081px){
  .hero-lapok{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-lapok .btn{justify-content:flex-start}
}

/* A nyitókép a v1-ből jön (1200×800), nem a főoldal 1400-as készletéből –
   ezért magas képernyőn ne nagyítsa fel magát a szemcséig. */
@media (min-width:1081px){
  .o-kapcsolat .hero-shot{max-width:640px;justify-self:end;width:100%}
}

/* ═══ 01 — GYORSCSATORNÁK (ol.szolg) ════════════════════════════════════════
   A sorok harmadik hasábja itt rövid (egy gomb vagy egy szöveglink), nem a
   főoldal 260 px-es cselekvés-hasábja – a gomb így a saját szélességén áll. */
.o-kapcsolat .szolg-row{grid-template-columns:72px minmax(0,1fr) minmax(0,300px)}
.o-kapcsolat .szolg-akcio{align-items:flex-start;padding-top:2px}
.o-kapcsolat .szolg-akcio .btn{padding:12px 18px}
.o-kapcsolat .szolg-akcio .pg{width:18px;height:18px}
@media (max-width:1000px){
  .o-kapcsolat .szolg-row{grid-template-columns:52px minmax(0,1fr)}
}
@media (max-width:620px){
  .o-kapcsolat .szolg-row{grid-template-columns:1fr}
  .o-kapcsolat .szolg-akcio .btn{width:100%;justify-content:center}
}

/* ═══ 02 — KÖZVETLEN ELÉRHETŐSÉG ════════════════════════════════════════════
   Ezen a lapon KÉT kiegészítő elérhetőség van (szerviz, finanszírozás), a
   terv.css viszont három hasábra osztja a sávot – két elem ott csonkán ülne. */
.o-kapcsolat .people-more{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:1080px){
  .o-kapcsolat .people-more{grid-template-columns:1fr}
}

/* ═══ 03 — ŰRLAP ÉS TÉRKÉP ══════════════════════════════════════════════════ */
.kapcs-grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:clamp(24px,2.8vw,44px);row-gap:36px;align-items:start;
}
/* A rácscella alapértelmezett min-width:auto-ja a LEGSZÉLESEBB oszthatatlan
   gyerekhez igazodik. A terv.css .btn-je white-space:nowrap, és a küldés
   gombja egy egész mondat: emiatt a hasáb 390 px-es nézetben 420 px-re nyílt
   szét, és vele együtt az egész űrlap kilógott (mérve: 46 px). A clip ezt
   elrejtette a görgetéstesztek elől – a 0-ás maxOverflow tehát nem jelentette,
   hogy rendben van. Két szabály zárja ki: a cella nem nyúlhat, a két hosszú
   feliratú gomb pedig tördelhet. */
.kapcs-grid>*{min-width:0}
@media (max-width:1000px){ .kapcs-grid{grid-template-columns:1fr;row-gap:30px} }

/* ── az űrlap. Ipari derékszög: nincs lekerekítés, nincs árnyék, a keret
      ugyanaz az 1 px-es --line, ami a lap többi dobozán. ─────────────────── */
.urlap{border-top:2px solid var(--ink);padding-top:26px}
.urlap-l{
  display:flex;align-items:center;gap:12px;margin-bottom:14px;
  font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;
  color:var(--gray);
}
.urlap-l+.urlap-l{margin-top:28px}
.urlap-n{
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:26px;height:26px;background:var(--ink);color:#fff;
  font-size:12px;font-weight:900;letter-spacing:0;
}
.urlap-valaszt{display:flex;flex-wrap:wrap;gap:8px}
.urlap-v{
  font:inherit;font-size:13.5px;font-weight:700;line-height:1.3;
  color:var(--ink);background:#fff;border:1px solid var(--line);
  padding:10px 14px;cursor:pointer;text-align:left;
  transition:background .15s,color .15s,border-color .15s;
}
.urlap-v:hover{border-color:var(--ink)}
.urlap-v.on{background:var(--ink);border-color:var(--ink);color:#fff}

.urlap-m{
  display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;
  column-gap:12px;border:1px solid var(--line);background:#fff;
  padding:0 14px;margin-bottom:10px;
}
.urlap-m .i{width:17px;height:17px;color:var(--gray-2)}
.urlap-m:focus-within{border-color:var(--ink)}
.urlap-m:focus-within .i{color:var(--red)}
.urlap-m input,.urlap-m textarea{
  font:inherit;font-size:15px;color:var(--ink);
  background:none;border:0;width:100%;min-width:0;padding:14px 0;
}
.urlap-m input::placeholder,.urlap-m textarea::placeholder{color:var(--gray-2);opacity:1}
.urlap-m--sz{grid-template-columns:minmax(0,1fr)}
.urlap-m--sz textarea{resize:vertical;line-height:1.55;min-height:112px}
/* „Üzenet elküldése – visszahívást kérek!" – egy mondat egy gombon, ezért ez
   az EGY gomb tördelhet. A terv.css nowrap-ja máshol érintetlen marad.
   A .btn display:inline-flex: a felirat ott NÉVTELEN rácselem, ami a maradék
   szélességet elfoglalja, ezért a justify-content:center nem rá hat. Mérve
   390 px-en: az ikon a gomb bal szélén ragadt, a két sorba tört felirat meg a
   gomb közepén – a kettő köszönőviszonyban sem volt. Ezért ez a két, tördelő
   gomb NEM rács, hanem folyó szöveg: az ikon a felirat elé sorjázik be, és az
   egész blokk középre áll. */
.urlap-kuld{
  display:block;width:100%;margin-top:8px;
  white-space:normal;text-align:center;line-height:1.3;
}
.urlap-kuld .i,.terkep-btn .i{
  display:inline-block;vertical-align:-3px;margin-right:9px;
}
.urlap-jegy{
  display:flex;align-items:flex-start;gap:9px;margin-top:14px;
  font-size:12.5px;line-height:1.5;color:var(--gray);
}
.urlap-jegy .i{width:15px;height:15px;color:var(--gray-2);margin-top:3px;flex:0 0 auto}
/* a második jegyzet ikon nélkül áll, és a lakat sorával egy vonalban kezdődik */
.urlap-jegy--mit{margin-top:8px;padding-left:24px;color:var(--gray-2);font-size:12px}

/* ── a térkép és a megközelítés ─────────────────────────────────────────── */
.terkep{border-top:2px solid var(--ink);padding-top:26px}
.terkep-fej{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:16px;align-items:start}
.terkep-ic{
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:44px;height:44px;border:1px solid var(--line);color:var(--ink);
}
.terkep-ic .i{width:20px;height:20px}
.terkep-fej h3{font-size:1.12rem;line-height:1.22}
.terkep-fej p{margin-top:7px;font-size:14px;line-height:1.55;color:var(--gray)}

/* A térkép szürkén ül a lapon, mint a lap többi fotója (.pers-img,
   .more-foto), és csak mutató alatt vált színesre. */
.terkep-keret{
  position:relative;margin-top:20px;overflow:hidden;
  border:1px solid var(--line);background:var(--bone);
  height:clamp(240px,26vw,320px);
}
.terkep-keret iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;display:block;
  filter:grayscale(1) contrast(1.04);transition:filter .2s;
}
.terkep-keret:hover iframe{filter:none}
/* „Útvonaltervezés indítása (Waze / Google Maps)" – ugyanaz az eset. */
.terkep-btn{
  display:block;margin-top:14px;width:100%;
  white-space:normal;text-align:center;line-height:1.3;
}
.terkep-parkolas{margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}

/* A TELEFONMEZŐ FELIRATA 420 PX ALATT NEM FÉRT KI. Mérve 390 px-en: a
   „Telefonszám (kötelező – a gyors visszahíváshoz)" 15 px-en 331 px-t kért, a
   mezőben 299 px volt – a felirat a „visszahívás" szó közepén vágódott el, és
   a látogató pont azt nem olvasta el, MIÉRT kötelező. A szöveg egyetlen betűje
   sem változott: a beírt érték marad 15 px, csak a helykitöltő kisebb.
   (A mező vízszintes belmagassága is szűkül, ezzel együtt 390 px-en 32 px
   tartalék marad.) */
@media (max-width:470px){
  .urlap-m{padding:0 11px;column-gap:10px}
  .urlap-m input::placeholder,.urlap-m textarea::placeholder{font-size:12.5px}
}

@media (max-width:720px){
  .hero-lapok{gap:8px;margin-top:20px}
  .hero-lapok .btn{padding:8px 12px;font-size:12.5px}
  .urlap,.terkep{padding-top:22px}
  .urlap-v{font-size:12.5px;padding:9px 12px}
  .terkep-btn{font-size:13px;padding:13px 14px}
  .terkep-keret{height:220px}
}

/* ═══ 04 — CÉGADATOK ════════════════════════════════════════════════════════
   Csendes adatsáv, nem szakaszfejléces blokk: a v1-ben is cím nélkül állt.
   Ezért kap rövidebb szakasz-belmagasságot, mint egy teljes szakasz. */
#cegadatok{padding:clamp(34px,3.6vw,48px) 0}
#cegadatok .lepcso{margin-top:0}
#cegadatok .lp b{font-size:16px;letter-spacing:-.01em}