/* ==========================================================================
   INTEGRÁL HEALING — referenciaoldal
   Paletta és tipográfia azonos a Szolgáltatások / Kapcsolat / Rólam oldalakkal.
   Minden szabály .ih- prefixet kap, hogy ne ütközzön a Divi CSS-ével.
   ========================================================================== */
/* A betűtípusokat az ih-fonts.css tölti be, helyben, minden oldalon
   (Divi → Integráció → fejléc). Ezért itt nincs Google Fonts @import. */

.ih-int{
  --navy:#17475D;   /* a lábléccel egyező navy */
  --navy-soft:#17475D;
  --gold:#C99A32;
  --gold-deep:#B87C2D;
  --ivory:#FBF8F1;
  --body:#4A5A61;

  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;

  font-family:var(--sans);
  color:var(--body);
  font-size:18px;            /* törzsszöveg minimum */
  font-weight:500;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  container-type:inline-size;
}
.ih-int *,.ih-int *::before,.ih-int *::after{box-sizing:border-box}
.ih-int p{margin:0 0 .85em}
.ih-int p:last-child{margin-bottom:0}
.ih-int img{display:block;max-width:100%}
.ih-int a{color:var(--gold-deep)}

.ih-int h1,.ih-int h2,.ih-int h3,.ih-int h4{
  font-family:var(--serif);color:var(--navy-soft);
  margin:0 0 .4em;line-height:1.16;letter-spacing:.01em;
}
.ih-int h1{font-size:clamp(34px,5vw,40px);font-weight:600}
.ih-int h2{font-size:clamp(27px,3.4vw,33px);font-weight:700}
.ih-int h3{font-size:clamp(21px,2.2vw,24px);font-weight:600}
.ih-int h4{font-size:20px;font-weight:600}

/* arany elválasztó pötty — azonos a többi oldallal */
.ih-rule{display:flex;align-items:center;gap:10px;margin:14px 0 22px}
.ih-rule::before,.ih-rule::after{content:"";height:1px;width:46px;background:var(--gold);opacity:.75}
.ih-rule i{width:7px;height:7px;border-radius:50%;background:var(--gold);flex:none}
.ih-c .ih-rule{justify-content:center}

.ih-sec{padding:clamp(30px,3.2vw,50px) clamp(20px,4vw,56px)}
.ih-wrap{max-width:1600px;margin:0 auto}
.ih-narrow{max-width:76ch;margin-inline:auto}
.ih-c{text-align:center}

/* ==========================================================================
   1 — FEJLÉC  (saját élénk fotó; NEM a Szolgáltatások halvány fotósávja)
   ========================================================================== */
/* Fejlécsáv: élénk fotó, mint a blog banner és a Programok oldal.
   A korábbi hero-sav.jpg szándékosan halvány textúra volt, ezért tűnt fakónak.
   A vilagosito reteg ellipszis: a kozepet emeli a szoveg alatt, a szeleket
   (bal oldali arany spiral, jobb oldali alak) erintetlenul hagyja. */
.ih-head{
  position:relative;
  padding-block:clamp(34px,3.4vw,56px);
  background:
    radial-gradient(ellipse 70% 86% at 50% 50%,
      rgba(251,248,241,.80) 0%,
      rgba(251,248,241,.62) 42%,
      rgba(251,248,241,.26) 70%,
      rgba(251,248,241,0) 100%),
    url("https://tisztanegyszeruen.hu/wp-content/uploads/2026/07/7dd381fa-ad38-4f5d-8c9a-1305fbc47d91.jpg") center top/cover no-repeat,
    var(--ivory);
  border-top:1px solid var(--gold);
  text-align:center;
}

/* Keskeny kijelzon a sav magasabb aranyu, ezert a cover a magassaghoz skalaz
   es oldalt vag: kozepre igazitva a bal oldali arany spiral es a jobb oldali
   alak is kiesne. 80%-ra tolva az alak feje es torzse is a kepben marad
   (72%-nal csak a karja latszott, ami furcsan hatott).
   Harom hatterreteg van, ezert mindharom poziciojat meg kell adni. */
@media (max-width:820px){
  .ih-head{background-position:0 0, 80% top, 0 0}
}
.ih-head h1,.ih-head .ih-lead,.ih-head p{
  text-shadow:0 1px 2px rgba(255,255,255,.95),0 2px 10px rgba(251,248,241,.9),0 0 26px rgba(251,248,241,.8)
}
.ih-lead{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(20px,2.2vw,26px);color:var(--gold-deep);
  line-height:1.4;margin:0 0 .7em
}
.ih-head .ih-bev{max-width:72ch;margin-inline:auto;color:var(--navy-soft)}

/* gombok — azonos a többi oldallal */
.ih-btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-weight:600;font-size:15px;
  letter-spacing:.11em;text-transform:uppercase;text-decoration:none;
  background:var(--gold);color:#fff;
  padding:15px 30px;border-radius:3px;border:1px solid var(--gold);
  transition:background .2s ease,color .2s ease;
}
.ih-btn:hover{background:var(--gold-deep);border-color:var(--gold-deep);color:#fff}
.ih-btn span{transition:transform .2s ease}
.ih-btn:hover span{transform:translateX(3px)}
.ih-head .ih-btn{margin-top:20px}

/* ==========================================================================
   2 — ALAPGONDOLAT
   ========================================================================== */
.ih-alap{background:#fff}
.ih-nagy{
  font-family:var(--serif);font-size:clamp(23px,2.6vw,29px);
  line-height:1.4;color:var(--navy);margin:0 0 1em
}
.ih-pelda{list-style:none;margin:0 0 1.2em;padding:0;display:grid;gap:10px}
.ih-pelda li{
  position:relative;padding:12px 16px 12px 44px;
  background:var(--ivory);border-left:3px solid var(--gold);
  border-radius:0 4px 4px 0;font-size:18px;line-height:1.5
}
.ih-pelda li::before{
  content:"";position:absolute;left:18px;top:1.25em;
  width:8px;height:8px;border-radius:50%;background:var(--gold)
}
.ih-idezet{
  margin:0;padding:clamp(22px,2.4vw,32px);
  background:var(--ivory);
  border:1px solid rgba(201,154,50,.45);border-radius:5px;text-align:center
}
.ih-idezet p{font-family:var(--serif);font-size:clamp(22px,2.4vw,28px);line-height:1.38;color:var(--navy);margin:0}
.ih-felvez{
  font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;color:var(--gold-deep);margin:0 0 .7em
}

/* ==========================================================================
   3 — ÖT DIMENZIÓ
   ========================================================================== */
.ih-dim{background:var(--ivory);border-top:1px solid rgba(201,154,50,.35)}
.ih-dimsor{
  display:flex;flex-wrap:wrap;justify-content:center;gap:10px;
  margin:0 0 clamp(22px,2.4vw,32px)
}
.ih-dimsor span{
  font-family:var(--sans);font-weight:600;font-size:14px;
  letter-spacing:.14em;text-transform:uppercase;color:#fff;
  background:var(--navy);padding:9px 18px;border-radius:40px
}
.ih-dimsor span:nth-child(even){background:var(--gold-deep)}

.ih-lista{display:grid;gap:14px;margin-top:clamp(20px,2.2vw,30px)}

/* nyitható elem — közös */
.ih-nyit{
  background:#fff;border:1px solid rgba(201,154,50,.28);
  border-radius:5px;overflow:hidden;
  transition:box-shadow .2s ease,border-color .2s ease
}
.ih-nyit:hover{border-color:rgba(201,154,50,.7)}
.ih-nyit[open]{box-shadow:0 6px 22px rgba(1,57,96,.07)}
.ih-nyit>summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;gap:clamp(12px,1.4vw,20px);
  padding:clamp(16px,1.6vw,22px) clamp(16px,1.8vw,26px);
  transition:background .18s ease
}
.ih-nyit>summary::-webkit-details-marker{display:none}
.ih-nyit>summary:hover{background:var(--ivory)}
.ih-plusz{
  flex:none;margin-left:auto;width:26px;height:26px;position:relative;
  border:1px solid rgba(201,154,50,.6);border-radius:50%
}
.ih-plusz::before,.ih-plusz::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--gold-deep);
  transform:translate(-50%,-50%);transition:opacity .2s ease,transform .2s ease
}
.ih-plusz::before{width:11px;height:1.6px}
.ih-plusz::after{width:1.6px;height:11px}
.ih-nyit[open] .ih-plusz::after{opacity:0;transform:translate(-50%,-50%) rotate(90deg)}
/* a teljes szélességű sávoknál a harmonika szövege elnőne; 82ch ≈ a korábbi sorhossz */
.ih-torzs{padding:0 clamp(16px,1.8vw,26px) clamp(20px,2vw,28px);max-width:82ch}
.ih-torzs>*:first-child{margin-top:0}

/* dimenzió-kártya */
.ih-dimkartya{border-left:4px solid var(--gold)}
.ih-szam{
  flex:none;width:clamp(42px,3.6vw,52px);height:clamp(42px,3.6vw,52px);
  border-radius:50%;background:var(--navy);color:#fff;
  font-family:var(--serif);font-size:clamp(21px,2vw,25px);font-weight:600;
  display:flex;align-items:center;justify-content:center;line-height:1
}
.ih-fej{min-width:0}
.ih-nev{
  font-family:var(--sans);font-weight:600;font-size:15px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--navy-soft);
  margin:0 0 3px;line-height:1.3
}
.ih-kerdes{
  font-family:var(--serif);font-size:clamp(20px,2vw,24px);
  color:var(--gold-deep);margin:0;line-height:1.25
}

/* belső listák */
.ih-kerdlista{list-style:none;margin:0 0 1em;padding:0;display:grid;gap:7px}
.ih-kerdlista li{
  position:relative;padding-left:26px;line-height:1.5;
  font-family:var(--serif);font-size:20px;color:var(--navy-soft)
}
.ih-kerdlista li::before{
  content:"";position:absolute;left:4px;top:.62em;
  width:7px;height:7px;border-radius:50%;background:var(--gold)
}
.ih-be{
  margin:1em 0;padding:14px 18px;border-left:3px solid var(--gold);
  background:var(--ivory);font-family:var(--serif);
  font-size:clamp(19px,1.8vw,22px);line-height:1.4;color:var(--navy)
}
.ih-be p{margin:0}
.ih-jegyzet{
  font-size:18px;line-height:1.55;color:#6E7F86;
  border-top:1px solid rgba(23,71,93,.12);padding-top:12px;margin-top:1em
}

/* összegzés — sötét sáv, mint a záró felhívás */
.ih-ossz{
  margin-top:clamp(22px,2.4vw,34px);
  background:var(--navy);color:#DCE6EC;border-radius:5px;
  padding:clamp(26px,2.8vw,40px) clamp(20px,2.4vw,36px);text-align:center
}
.ih-ossz h3{color:#fff}
.ih-ossz .ih-rule{justify-content:center}
.ih-ossz .ih-rule::before,.ih-ossz .ih-rule::after{opacity:.55}
.ih-osszlista{list-style:none;margin:0 auto 1.2em;padding:0;display:grid;gap:10px;max-width:62ch;text-align:left}
.ih-osszlista li{
  display:flex;gap:14px;align-items:baseline;
  padding:11px 16px;background:rgba(255,255,255,.055);border-radius:4px;
  font-size:18px;line-height:1.45
}
.ih-osszlista b{
  font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.12em;
  flex:none;min-width:14ch;color:var(--gold)
}
.ih-zaras{font-family:var(--serif);font-size:clamp(20px,2.1vw,25px);color:#fff;line-height:1.38;margin:0}

/* ==========================================================================
   4 — SZEMLÉLETVÁLTÁS
   ========================================================================== */
.ih-valtas{background:#fff}
.ih-csere{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:clamp(14px,1.8vw,28px);margin:0 0 clamp(22px,2.4vw,32px)
}
.ih-csere-el{
  padding:clamp(20px,2.2vw,30px);border-radius:5px;text-align:center;
  font-family:var(--serif);font-size:clamp(21px,2.2vw,27px);line-height:1.32
}
.ih-cimke{
  display:block;font-family:var(--sans);font-size:13px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;margin:0 0 10px
}
.ih-regi{background:#F3F1EC;color:#8A9499;border:1px solid rgba(23,71,93,.12)}
.ih-regi .ih-cimke{color:#A8B1B5}
.ih-uj{background:var(--navy);color:#fff;border:1px solid var(--navy)}
.ih-uj .ih-cimke{color:var(--gold)}
.ih-nyil{color:var(--gold);font-size:30px;line-height:1;flex:none;text-align:center}

/* ==========================================================================
   5 — MIRE VALÓ / MIRE NEM
   ========================================================================== */
.ih-hatar{background:var(--ivory);border-top:1px solid rgba(201,154,50,.35)}
.ih-ketto{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(18px,2vw,30px);align-items:start}
.ih-dob{background:#fff;border-radius:5px;padding:clamp(24px,2.4vw,34px);border:1px solid rgba(201,154,50,.28)}
.ih-dob-igen{border-top:4px solid var(--gold)}
.ih-dob-nem{border-top:4px solid var(--navy);background:#FDFCF9}
.ih-pipa{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ih-pipa li{position:relative;padding-left:32px;font-size:18px;line-height:1.5}
.ih-pipa li::before{
  content:"";position:absolute;left:5px;top:.38em;
  width:13px;height:8px;border-left:2px solid var(--gold);border-bottom:2px solid var(--gold);
  transform:rotate(-45deg)
}

/* ==========================================================================
   6 — LÉTREHOZÓ
   ========================================================================== */
.ih-szerzo{background:#fff}
.ih-szerzo-grid{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(22px,3vw,48px);align-items:center}
.ih-szerzo-kep{border-radius:5px;overflow:hidden;border:1px solid rgba(201,154,50,.45)}
.ih-szerzo-kep img{width:100%;height:auto}
.ih-kiemel{
  font-family:var(--serif);font-size:clamp(20px,2.1vw,25px);
  color:var(--navy);line-height:1.38;
  border-left:3px solid var(--gold);padding-left:18px;margin-top:1em
}

/* ==========================================================================
   7 — HOGYAN KEZDD
   ========================================================================== */
.ih-kezd{background:var(--navy);color:#DCE6EC;border-top:1px solid var(--gold)}
.ih-kezd h2{color:#fff}
.ih-kezd .ih-rule::before,.ih-kezd .ih-rule::after{opacity:.55}
.ih-kezd>.ih-wrap>p{color:#C9D8E0}
.ih-utak{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,22px);margin-top:clamp(22px,2.4vw,34px)}
.ih-ut{
  display:flex;flex-direction:column;align-items:center;
  background:rgba(255,255,255,.055);border:1px solid rgba(201,154,50,.3);
  border-radius:5px;padding:clamp(20px,2vw,28px);
  transition:background .2s ease,border-color .2s ease,transform .2s ease
}
.ih-ut:hover{background:rgba(255,255,255,.1);border-color:rgba(201,154,50,.7);transform:translateY(-2px)}
.ih-ut h3{color:#fff;font-size:22px;margin-bottom:.35em}
.ih-ut p{font-size:18px;line-height:1.5;color:#C3D3DC;margin:0 0 18px}
.ih-ut a{
  margin-top:auto;
  font-family:var(--sans);font-weight:600;font-size:13.5px;
  letter-spacing:.11em;text-transform:uppercase;text-decoration:none;
  color:var(--gold);border:1px solid rgba(201,154,50,.55);
  border-radius:3px;padding:9px 16px;
  transition:background .2s ease,color .2s ease
}
.ih-ut a:hover{background:var(--gold);color:#fff}

/* ==========================================================================
   8 — GYIK
   ========================================================================== */
.ih-gyik{background:#fff;border-top:1px solid rgba(201,154,50,.35)}
.ih-gyik .ih-lista{max-width:960px;margin-inline:auto;gap:10px}
.ih-gyik .ih-nyit{background:var(--ivory)}
.ih-gyik .ih-nyit>summary:hover{background:#F6F1E6}
.ih-kerd{
  font-family:var(--serif);font-size:clamp(19px,1.9vw,22px);
  color:var(--navy-soft);margin:0;line-height:1.3
}

/* ==========================================================================
   9 — ZÁRÓ FELHÍVÁS
   ========================================================================== */
.ih-cta{
  position:relative;overflow:hidden;text-align:center;
  background:var(--navy);color:#E8EEF2
}
.ih-cta h2{color:#fff}
.ih-cta p{max-width:58ch;margin-inline:auto;color:#DCE6EC}
.ih-cta .ih-rule{justify-content:center}
.ih-cta .ih-rule::before,.ih-cta .ih-rule::after{opacity:.6}
.ih-cta .ih-btn{margin-top:22px}
.ih-cta-disz{
  position:absolute !important;display:block;
  right:clamp(10px,2%,40px);bottom:0;width:clamp(120px,18%,260px);
  opacity:.16;pointer-events:none;z-index:0
}
.ih-cta .ih-wrap{position:relative;z-index:1}

/* ==========================================================================
   RESPONZÍV — konténer-lekérdezések (a blokk valós szélessége szerint)
   ========================================================================== */
@container (max-width:1000px){
  .ih-utak{grid-template-columns:repeat(2,1fr)}
}
@container (max-width:860px){
  .ih-ketto{grid-template-columns:1fr}
  .ih-szerzo-grid{grid-template-columns:1fr;justify-items:start}
  .ih-szerzo-kep{max-width:320px}
  .ih-csere{grid-template-columns:1fr;gap:10px}
  .ih-nyil{transform:rotate(90deg)}
}
@container (max-width:620px){
  .ih-utak{grid-template-columns:1fr}
  .ih-szam{width:38px;height:38px;font-size:19px}
  .ih-osszlista li{flex-direction:column;gap:3px}
  .ih-osszlista b{min-width:0}
}

/* ==========================================================================
   ÖT DIMENZIÓ — INFOGRAFIKA
   ========================================================================== */
.ih-abra{
  margin:clamp(22px,2.4vw,34px) auto 0;
  max-width:1000px;
  background:#fff;
  border:1px solid rgba(201,154,50,.35);
  border-radius:5px;
  padding:clamp(12px,1.2vw,18px);
  box-shadow:0 6px 24px rgba(1,57,96,.06);
}
.ih-abra a{display:block;text-decoration:none;border-radius:3px;overflow:hidden}
.ih-abra img{width:100%;height:auto;border-radius:3px}
.ih-abra figcaption{
  margin-top:12px;text-align:center;
  font-family:var(--sans);font-size:16px;line-height:1.45;color:#6E7F86
}
.ih-abra figcaption b{
  display:inline-block;font-weight:600;color:var(--gold-deep);
  font-size:13px;letter-spacing:.11em;text-transform:uppercase
}
