/* Közös elemek minden oldalon: portfólió-sáv, lábléc-linkek */
.gyakorlo{margin:0;padding:8px 24px;background:#2A1430;color:#F3EAF4;font-family:'Figtree',system-ui,sans-serif;font-size:15px;line-height:1.4;text-align:center}
.gyakorlo a{display:inline-block;margin-right:8px;padding:8px 16px;line-height:1;border-radius:999px;background:#F2C66D;color:#2A1430;font-weight:600;text-decoration:none}
.gyakorlo a:hover{background:#FFFFFF}
a.logo{text-decoration:none}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.footer-links a{color:var(--footer-head,#F3EAF4);text-decoration:underline;text-underline-offset:4px}
.footer-links a:hover{color:#F2C66D}

/* Betűköz (Magdolna szabálya): alapszöveg -0,005 és -0,03 em között */
body{letter-spacing:-0.01em}
.footer .note{max-width:700px}

/* ===== 2026-11-04 este (Magdolna): betűskála és sorhossz minden oldalon =====
   5 méret nézetenként: főcím / szakaszcím / kártyacím / alapszöveg és gombok / kis felirat
   telefon 56/36/29/19/14, tablet 67/48/30/21/17, gép 78/60/30/22/20 */
:root{--h1:56px;--h2:36px;--h3:29px;--body:19px;--cap:14px}
@media (min-width:768px){:root{--h1:67px;--h2:48px;--h3:30px;--body:21px;--cap:17px}}
@media (min-width:1280px){:root{--h1:78px;--h2:60px;--h3:30px;--body:22px;--cap:20px;--cta-max:560px}}
.gyakorlo{font-size:var(--cap)}
.kod{font-size:var(--h2)!important}
.konyv h2{font-size:var(--h3)!important}
h1,h2,h3,.h1,.h2,.h3{line-height:1.1;overflow-wrap:break-word}
p,li{line-height:1.5}
/* fő gomb: 20-22 px betű, 24 px függőleges, 48 px vízszintes belső térköz */
.cta{font-size:var(--body);padding:24px 48px;min-height:72px}
@media (max-width:599px){.cta{padding:24px}}
/* szövegoszlop: gépen kb. 74 karakter soronként, a sáv közepén vagy két oszlopban */
.text-col,.hero-body,.offer-text,.store-card,.footer .note,.lap,.pair-card{max-width:min(740px,100%)}
.pair-grid{grid-template-columns:minmax(0,1fr)!important;max-width:740px;margin-left:auto;margin-right:auto}
p{max-width:min(720px,100%)}
@media (min-width:1280px){
  .wrap,.divider>div{max-width:1312px}
  .section > .wrap > .text-col,.section > .wrap > .stack-16,.section > .wrap > .stack-32,.lap{margin-left:auto;margin-right:auto}
  .community .text-col{align-items:center;text-align:center}
  .pair-grid,.benefits{grid-template-columns:minmax(0,1fr)!important;max-width:740px;margin-left:auto;margin-right:auto}
  .pair-card{max-width:none}
  .section > .wrap > .cta-block,.wrap.stack-32 > *{margin-left:auto;margin-right:auto;width:100%;max-width:740px}
  .wrap.stack-32 > .cta-block{max-width:var(--cta-max)}
  .section > .wrap > .cta-block{max-width:var(--cta-max)}
}
.konyv .sz{font-size:var(--body)!important}
/* lábléc: felül 48, alul 32 px, az elemek között 16-24 px */
.footer{padding-top:48px!important;padding-bottom:32px!important}
.footer .wrap{gap:16px}
.footer .note{margin-top:8px;padding-top:16px}.gyakorlo{max-width:none!important}

/* 2026-11-04 este (Magdolna): minden szakasz úgy, mint a Bolt szakasz: egy közös, középre tett
   740 px-es oszlop (22 px-es betűvel 60-75 karakter egy teli sor) tableten és gépen is, a címek középen */
@media (min-width:768px){
  .wrap,.divider>div{max-width:1312px}
  .section > .wrap > .text-col,.section > .wrap > .stack-16,.section > .wrap > .stack-32,.lap{margin-left:auto;margin-right:auto}
  .pair-grid,.benefits{grid-template-columns:minmax(0,1fr)!important;max-width:740px;margin-left:auto;margin-right:auto}
  .pair-card{max-width:none}
  .section > .wrap > .cta-block,.wrap.stack-32 > *{margin-left:auto;margin-right:auto;width:100%;max-width:740px}
  .community .text-col{align-items:center;text-align:center}
  .section .wrap > h2,.section .stack-32 > h2,.section .stack-16 > h2,.section .text-col > h2,.community h2{text-align:center}
  .section .stack-16.text-col > p{text-align:center;margin-left:auto;margin-right:auto}
  .section .stack-16.text-col{align-items:center}
}
/* Teli sor legfeljebb 75 karakter: a bekezdés 31em (22 px-nél 682 px, 21 px-nél 651 px), a kártyák a belső térközzel szélesebbek */
p{max-width:min(31em,100%)}
.lap li{max-width:min(31em,100%)}
.cta-block .coupon-note{max-width:36em !important}
@media (min-width:768px){
  .pair-grid,.wrap.stack-32 > .benefits{max-width:780px}
  .section > .wrap > .stack-16{max-width:min(31em,100%)}
}
/* Űrlapoldal: az oszlop középen, a cím középen; a kártyák belső szövege is 60-75 karakter */
@media (min-width:768px){
  .main > .wrap > .column{max-width:780px;margin-left:auto;margin-right:auto}
  .main .column > .h1{text-align:center}
  .main .column .privacy,.main .column .consent span{max-width:none}
}
/* Aloldalak (e-book, köszönő, adatkezelés, impresszum): a főcím és a bevezető középen, a hosszú szöveg balra zárva a középre tett oszlopban */
@media (min-width:768px){
  .lap{max-width:min(780px,100%)}
  .lap > .h1{text-align:center}
  .lap > .h1 + p:not(.kupon){text-align:center;margin-left:auto;margin-right:auto}
}
/* Tableten (768-1279 px) a nyitó rész és az ajánlat is egy oszlopban, középen */
@media (min-width:768px) and (max-width:1279px){
  .hero .wrap{max-width:740px}
  .hero-intro,.hero-intro .h1{text-align:center}
  .hero-body{max-width:none}
  .hero-body p{margin-left:auto;margin-right:auto;text-align:center}
  .offer-text{margin-left:auto;margin-right:auto;width:100%;max-width:740px}
  .offer-text h2{text-align:center;align-self:stretch}
}

/* A kupon-mondat is a teli sorhosszt kapja gépen (50-75 karakter) */
.cta-block{max-width:740px !important}.cta-block .btn,.cta-block button{max-width:var(--cta-max);margin-left:auto;margin-right:auto}.cta-block .coupon-note{max-width:34em !important;margin-left:auto;margin-right:auto}
/* Lábléc a WebRendbe lábléc mintájára (Magdolna, 2026-11-04 este): a tartalommal egy szélességű sáv (1312 px),
   gépen balra a név és a köszönő mondat, jobbra a linkek, alul középen a copyright, vonal nélkül; telefonon minden középen */
.footer .wrap{max-width:1312px;align-items:center;text-align:center}
.footer .wrap > p{margin-left:auto;margin-right:auto}
.footer .footer-links{justify-content:center}
.footer .note{border-top:0!important;padding-top:0!important;margin-top:8px!important;max-width:none!important;text-align:center}
@media (min-width:1024px){
  .footer .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:48px;row-gap:16px;align-items:start;text-align:left}
  .footer .wrap > *,.footer .wrap > p{grid-column:1;margin-left:0;margin-right:0;text-align:left}
  .footer .wrap > p.footer-links{grid-column:2;grid-row:1;justify-content:flex-end;margin:0}
  .footer .wrap > p.note{grid-column:1 / -1;text-align:center;margin-left:auto!important;margin-right:auto!important}
}
/* Egy közös tartalomsáv gépen (Magdolna, 2026-11-04 este): minden szakasz a teljes 1312 px-es sávot tölti ki, azonos bal és jobb széllel.
   Ahol a szöveg magában keskeny lenne, mellette második oszlop áll (cím balra, szöveg vagy kártyák jobbra), a sor így is 60-75 karakter */
@media (min-width:1280px){
  .pair-grid{max-width:none!important;grid-template-columns:minmax(0,1fr)!important;gap:32px}
  .pair-card{max-width:none!important}
  .pair-card > h2{text-align:left!important}
  .pair .wrap > .cta-block{max-width:none!important;width:100%}
  .wrap.stack-32:has(> .benefits){display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:64px;row-gap:32px;align-items:start}
  .wrap.stack-32:has(> .benefits) > h2{grid-column:1 / -1;grid-row:1;text-align:left!important;max-width:none!important;margin:0!important;width:auto}
  .wrap.stack-32:has(> .benefits) > .cta-block{grid-column:1;grid-row:2;margin:0!important;max-width:none!important;width:auto}
  .wrap.stack-32:has(> .benefits) > .benefits{grid-column:2;grid-row:2 / span 2;max-width:none!important;margin:0!important;width:auto;gap:32px}
  .community .wrap > .text-col{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:64px;max-width:none!important;text-align:left!important;align-items:start}
  .community .text-col > h2{grid-column:1 / -1;grid-row:1;text-align:left!important}
  .community .text-col > .cta-block{grid-column:1!important;grid-row:2 / span 2;margin-top:0!important}
  .community .text-col > p{grid-column:2!important}
  .community .text-col > p,.community .text-col > .cta-block{grid-column:2;margin-left:0!important;margin-right:0!important;text-align:left!important}
  .community .text-col > .cta-block{max-width:none!important}
  .wrap.stack-32:has(> .store-card){display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);column-gap:64px;align-items:center}
  .wrap.stack-32:has(> .store-card) > *{max-width:none!important;margin:0!important;width:auto}
  .wrap.stack-32:has(> .store-card) > .stack-16{align-items:flex-start}
  .wrap.stack-32:has(> .store-card) h2,.wrap.stack-32:has(> .store-card) .stack-16 > p{text-align:left!important;margin-left:0!important;margin-right:0!important}
  .store-card{grid-template-columns:minmax(0,1fr)!important}
  .offer-text{max-width:none!important}
}
@media (min-width:1280px){.cover-stack{justify-self:start}.cta-block > .cta{max-width:var(--cta-max);margin-left:auto;margin-right:auto}.community .text-col > .cta-block > .cta{margin-left:0}}
/* Aloldalak gépen is a közös 1312 px-es sávban: balra a címek, jobbra a szöveg (60-75 karakter); e-book: a könyvek két oszlopban; űrlap: balra a cím és az ajándék, jobbra az űrlap */
@media (min-width:1280px){
  .main > .wrap > .lap{max-width:none!important;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:64px;row-gap:24px;align-items:start}
  .main > .wrap > .lap > *{grid-column:2;margin-left:0!important;margin-right:0!important;text-align:left!important}
  .main > .wrap > .lap > h1,.main > .wrap > .lap > h2{grid-column:1}
  .main > .wrap > .lap > h2{margin-top:0}
  .main > .wrap > .lap:has(> .konyv) > h1{grid-row:1 / span 3;align-self:start;position:sticky;top:32px}
  .main > .wrap > .column{max-width:none!important;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:64px;row-gap:32px;align-items:start}
  .main > .wrap > .column > .h1{grid-column:1;grid-row:1;text-align:left!important}
  .main > .wrap > .column > .gift{grid-column:1;grid-row:2}
  .main > .wrap > .column > .form{grid-column:2;grid-row:1 / span 3}
}
.main .column .privacy{max-width:min(31em,100%)!important}
@media (min-width:1280px){.community .wrap > .text-col{row-gap:32px}}
/* Copyright-sor gépen is legfeljebb 75 karakter, középen (2026-11-04) */
.footer .note{max-width:min(34em,100%)!important;margin-left:auto!important;margin-right:auto!important;text-wrap:balance}

/* ---------- 2026-11-05 (Magdolna): kivezető portfólió-sáv, nincs szóelválasztás, nincs árva szó, szélesebb sorok ---------- */
html{scroll-padding-top:24px}
html,body,body *{-webkit-hyphens:none!important;hyphens:none!important}
h1,h2,h3,.h1,.h2,.h3{overflow-wrap:normal!important;word-break:normal!important;text-wrap:balance}
p,li,.benefit-text p,blockquote,dd{text-wrap:pretty}
.nowrap{white-space:nowrap}
/* a főcímben a „10-es” egyben marad, de nem külön sorban */
.h1 span span{display:inline}
/* a fejléc és az első sor között több hely */
.hero{padding-top:48px}
/* Mi van, ha rossz könyvet választasz: gépen szélesebb szövegoszlop (65-75 karakter), a kártyák középen */
@media (min-width:1280px){
  .pair-grid{max-width:960px!important;margin-left:auto;margin-right:auto}
  .pair-card p{max-width:35em!important}
  /* hős: a főcím a teljes sáv szélességében, alatta balra a bevezető, jobbra az ajánlat */
  .hero .wrap{grid-template-areas:"intro intro" "body offer"!important}
  .hero-intro .h1{max-width:18em}
}
/* Portfólió-sáv: vissza a portfólióhoz és a WebRendbe főoldalra, telefonon rövid felirattal, egy sorban */
.gyakorlo{display:flex;align-items:center;justify-content:center;gap:16px;padding:8px 16px;white-space:nowrap}
.gyakorlo a.gy-link{display:inline-flex;align-items:center;gap:4px;margin:0;padding:8px 12px;flex:none}
.gyakorlo .gy-szoveg{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.gyakorlo .gy-hosszu{display:none}.gyakorlo .gy-rovid{display:inline}
@media (min-width:768px){.gyakorlo .gy-hosszu{display:inline}.gyakorlo .gy-rovid{display:none}}
