/* GENERÁLT FÁJL — NE SZERKESZD. Előállítja: scripts/epit.py
   ÖRÖKÖLT a főprojektből: assets/css/modul/fooldal.css, assets/css/modul/mukodes.css, assets/css/modul/video.css
   utána: src/akcio.css (a landing saját rétege) */

/* GENERÁLT FÁJL — NE SZERKESZD. Forrás: assets/css/app.css
   Előállítja: scripts/oldalgyartas/css_szetvalaszt.py (modul: fooldal).
   Forrás-ujjlenyomat: fe2499a00725de61 */
@layer typography{
.hl{background:var(--surface-muted);color:var(--text-primary);padding:.02em .2em;border-radius:.15em;font-weight:inherit}
}
@layer components{
.product-media img{width:100%;height:100%;object-fit:contain}
.product-title{color:var(--text-primary)}
.product-cimke{color:var(--text-tertiary);margin-top:calc(var(--space-8) * -1)}
.product-text{color:var(--text-secondary)}
.product-note{color:var(--text-secondary);margin-top:var(--space-16)}
.chip-link:hover{color:var(--chip-text);box-shadow:var(--shadow-1);transform:translateY(-1px)}
.chip-link:focus-visible{outline:3px solid var(--border-focus);outline-offset:3px}
.chip-arrow{margin-left:var(--space-4)}
.utana{margin-top:var(--space-32);padding:var(--space-32);
    border:1px solid var(--border);border-radius:var(--panel-radius)}
.utana-cim{color:var(--text-primary);margin-bottom:var(--space-32)}
.utana-sin::before{content:"";position:absolute;
    left:calc((100% - 3 * var(--space-24)) / 8);
    right:calc((100% - 3 * var(--space-24)) / 8);
    top:calc(var(--space-64) / 2);height:2px;
    background:color-mix(in srgb,var(--primary) 40%,transparent);}
.utana-sin::after{content:"";position:absolute;
    left:calc((100% - 3 * var(--space-24)) / 8);
    right:calc((100% - 3 * var(--space-24)) / 8);
    top:calc(var(--space-64) / 2);height:2px;
    background:var(--primary);
    transform-origin:left center;}
.utana-szoveg{color:var(--text-secondary)}
.utana-szoveg strong{color:var(--text-primary);display:block;
    margin-bottom:var(--space-4)}
}
@layer responsive{
@media (max-width:1024px){
.utana-sin{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--space-32)}
.utana-sin::before,.utana-sin::after{display:none}
}
}
@layer responsive{
@media (max-width:640px){
.product-grid{grid-template-columns:minmax(0,1fr)}
.utana-sin{grid-template-columns:minmax(0,1fr)}
}
}
@layer motion{
.utana-sin::after{transition:transform 1400ms var(--ease-out)}
.utana-lepes{--utana-kesleltetes:0ms}
.utana-lepes:nth-child(2){--utana-kesleltetes:300ms}
.utana-lepes:nth-child(3){--utana-kesleltetes:600ms}
.utana-lepes:nth-child(4){--utana-kesleltetes:900ms}
.utana-szam{transition:opacity 500ms var(--ease-out) var(--utana-kesleltetes),
               transform 500ms var(--ease-out) var(--utana-kesleltetes);}
.utana-szoveg{transition:opacity 500ms var(--ease-out) calc(var(--utana-kesleltetes) + 120ms),
               transform 500ms var(--ease-out) calc(var(--utana-kesleltetes) + 120ms);}
}
@layer motion{
@media (prefers-reduced-motion:reduce){
.utana-sin::after,.utana-szam,.utana-szoveg{transition:none}
}
}
@layer components{
.tech-hivas{margin-top:var(--space-32);
    padding:var(--space-32) var(--space-24);
    display:grid;justify-items:center;gap:var(--space-24);
    text-align:center;
    background:var(--surface-muted);
    border:1px solid var(--border);
    border-radius:var(--panel-radius);}
.tech-hivas-fej{display:grid;justify-items:center;gap:var(--space-8);max-width:52ch}
.tech-hivas-eyebrow{color:var(--text-tertiary)}
.tech-hivas-cim{color:var(--text-primary)}
.tech-hivas-lead{color:var(--text-secondary)}
.tech-hivas-sor{list-style:none;margin:0;padding:0;width:100%;max-width:46rem;
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-16);}
.tech-hivas-sor > li{display:flex}
.tech-hivas-elem{flex:1;
    display:grid;justify-items:center;align-content:start;gap:var(--space-8);
    padding:var(--space-24) var(--space-16);
    background:var(--surface);
    border:1px solid var(--border);border-radius:var(--card-radius);
    text-decoration:none;color:inherit;
    transition:border-color var(--dur-fast) var(--ease-out),
               box-shadow var(--dur-fast) var(--ease-out);}
.tech-hivas-elem > .tech-hivas-ikon{margin-bottom:var(--space-8)}
.tech-hivas-elem:hover{border-color:var(--primary);box-shadow:var(--shadow-1)}
.tech-hivas-elem:hover .tech-hivas-nev{text-decoration:underline;text-underline-offset:.18em}
.tech-hivas-elem:focus-visible{outline:3px solid var(--border-focus);outline-offset:3px}
.tech-hivas-hol{color:var(--text-secondary);max-width:26ch;text-wrap:balance}
.tech-hivas-nyil{color:var(--primary);margin-top:var(--space-4)}
}
@layer components{
@media (prefers-reduced-motion: no-preference){
.tech-hivas-nyil{transition:transform var(--dur-fast) var(--ease-out)}
.tech-hivas-elem:hover .tech-hivas-nyil{transform:translateX(.25em)}
}
}
@layer components{
.tech-hivas-ikon{display:grid;place-items:center;
    width:var(--badge-lg-size);height:var(--badge-lg-size);
    border-radius:50%;
    background:var(--surface-muted);
    color:var(--text-secondary);}
.tech-hivas-ikon .icon{height:var(--space-48)}
.tech-hivas-nev{color:var(--text-primary)}
.tech-hivas-mit{color:var(--text-secondary);
    padding:var(--space-4) var(--space-16);
    border-radius:999px;
    background:var(--surface-muted);}
.tech-hivas-akcio{align-self:center}
}
@layer responsive{
@media (max-width:640px){
.tech-hivas{padding:var(--space-24) var(--space-16)}
.tech-hivas-sor{grid-template-columns:minmax(0,1fr)}
}
}
@layer motion{
@supports (animation-timeline: view()){
@media (prefers-reduced-motion:no-preference){
.tech-hivas-elem{animation:tech-hivas-be linear both;
        animation-timeline:view();}
.tech-hivas-elem:nth-child(1){animation-range:entry 8% entry 52%}
.tech-hivas-elem:nth-child(2){animation-range:entry 16% entry 60%}
.tech-hivas-elem:nth-child(3){animation-range:entry 24% entry 68%}
.tech-hivas-ikon{animation:tech-hivas-tanyer linear both;
        animation-timeline:view();
        animation-range:entry 18% entry 72%;}
}
}
}
@layer motion{
.tech-hivas-elem{transition:transform var(--dur-ui) var(--ease-out),
               border-color var(--dur-ui) var(--ease-out),
               box-shadow var(--dur-ui) var(--ease-out);}
.tech-hivas-ikon{transition:color var(--dur-ui) var(--ease-out),
               background var(--dur-ui) var(--ease-out),
               transform var(--dur-ui) var(--ease-out);}
.tech-hivas:hover .tech-hivas-elem{border-color:var(--primary)}
.tech-hivas:hover .tech-hivas-ikon{color:var(--primary)}
.tech-hivas-elem:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)}
.tech-hivas-elem:hover .tech-hivas-ikon{background:var(--primary);color:var(--on-primary);transform:scale(1.06);}
.tech-hivas-akcio .action-arrow{transition:translate var(--dur-fast) var(--ease-out)}
.tech-hivas-akcio:hover .action-arrow{translate:var(--space-4) 0}
}

/* GENERÁLT FÁJL — NE SZERKESZD. Forrás: assets/css/app.css
   Előállítja: scripts/oldalgyartas/css_szetvalaszt.py (modul: mukodes).
   Forrás-ujjlenyomat: fe2499a00725de61 */
@layer components{
.mukodes-jelenet{position:relative;isolation:isolate;
     
    overflow:hidden;
    display:grid;grid-template-columns:minmax(0,1fr);
     
    align-content:end;
    min-height:var(--jelenet-min-h);
     
    margin-block:var(--space-64);}
.mukodes-jelenet-kep{position:absolute;left:0;right:0;bottom:0;z-index:-1;
    width:100%;height:auto;}
.mukodes-jelenet-felirat{position:absolute;left:50%;bottom:var(--space-16);translate:-50% 0;z-index:0;
    margin:0;padding:var(--space-4) var(--space-16);border-radius:var(--r-lg);
    background:var(--surface);color:var(--text-secondary);white-space:nowrap;}
.mukodes-jelenet-racs{position:relative;
    width:100%;max-width:var(--container-wide);margin-inline:auto;
    padding-inline:var(--page-gutter);padding-block:var(--space-48);
    display:grid;
     
    grid-template-columns:minmax(0,1fr) 30vw minmax(0,1fr);
    gap:var(--space-24);align-items:end;}
.mukodes-jelenet-racs > :first-child{grid-column:1}
.mukodes-jelenet-racs > :last-child{grid-column:3}
.mukodes-kartya{display:flex;flex-direction:column;gap:var(--space-16);
    padding:var(--card-padding);
    background:var(--card-bg);
    border:1px solid var(--card-border);
    border-radius:var(--card-radius);
    box-shadow:var(--jelenet-kartya-shadow);}
.mukodes-kartya-cim{color:var(--text-primary)}
.mukodes-kartya-link{margin-top:auto;align-self:flex-start}
.mukodes-lepesek{list-style:none;margin:0;padding:0;
    display:grid;gap:0;}
.mukodes-lepesek[data-tagolt]{gap:var(--space-16)}
.mukodes-lepes{color:var(--text-secondary)}
.mukodes-lepes-cim{color:var(--text-primary)}
.mukodes-lepes-szam{color:var(--text-tertiary);white-space:nowrap}
.mukodes-zsak-kepek{position:relative;
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:var(--space-32);align-items:center;}
.mukodes-zsak-kep{width:100%;height:auto}
.mukodes-zsak-kepek::before{content:"";position:absolute;top:0;bottom:0;left:50%;
    border-left:1px solid var(--border);}
.mukodes-lista{display:grid;gap:var(--space-8);color:var(--text-secondary)}
.mukodes-lista li{position:relative;padding-left:var(--space-16)}
.mukodes-lista li::before{content:"";position:absolute;left:0;top:.55em;
    width:var(--space-4);height:var(--space-4);border-radius:50%;
    background:var(--primary);}
.mukodes-alcim{color:var(--text-primary);margin-top:var(--space-8)}
.mukodes-feltetelek{display:grid;gap:var(--space-24)}
.mukodes-feltetel{padding-left:var(--space-16);
    border-left:2px solid var(--feltetel-ok);}
.mukodes-feltetel[data-allapot="feltetellel"]{border-left-color:var(--feltetel-figyelem)}
.mukodes-feltetel[data-allapot="kizaro"]{border-left-color:var(--feltetel-kizaro)}
.mukodes-feltetel-cim{color:var(--text-primary)}
.mukodes-feltetel-szoveg{color:var(--text-secondary);margin-top:var(--space-4)}
}
@layer responsive{
@media (max-width:1024px){
.mukodes-jelenet{display:block;min-height:0;margin-block:var(--space-48);}
.mukodes-jelenet-kep{position:static;width:100%;height:auto}
.mukodes-jelenet-felirat{position:static;translate:none;margin:var(--space-8) auto 0;
      padding:0 var(--page-gutter);background:none;border-radius:0;
      text-align:center;white-space:normal;color:var(--text-tertiary);}
.mukodes-jelenet-racs{max-width:var(--container-max);
      padding-block:0;margin-top:var(--space-32);
      grid-template-columns:repeat(2,minmax(0,1fr));}
.mukodes-jelenet-racs > :first-child,
    .mukodes-jelenet-racs > :last-child{grid-column:auto}
}
}
@layer responsive{
@media (max-width:640px){
.mukodes-jelenet-racs{grid-template-columns:minmax(0,1fr)}
}
}

/* GENERÁLT FÁJL — NE SZERKESZD. Forrás: assets/css/app.css
   Előállítja: scripts/oldalgyartas/css_szetvalaszt.py (modul: video).
   Forrás-ujjlenyomat: fe2499a00725de61 */
@layer components{
.video-lejatszo{margin:0;display:grid;gap:var(--space-16)}
.video-lejatszo-keret{position:relative;aspect-ratio:16 / 9;overflow:hidden;isolation:isolate;
    border-radius:var(--r-xl);background:var(--panel-dark-bg);box-shadow:var(--shadow-3);}
.video-lejatszo-keret:fullscreen{border-radius:0;aspect-ratio:auto;box-shadow:none}
.video-lejatszo-video{display:block;width:100%;height:100%;object-fit:cover;background:var(--panel-dark-bg)}
.video-lejatszo-keret:fullscreen .video-lejatszo-video{object-fit:contain}
.video-lejatszo[data-nyugvo] .video-lejatszo-keret{cursor:none}
.video-lejatszo-indit{position:absolute;inset:0;z-index:2;display:grid;place-items:center;
    padding:0;border:0;cursor:pointer;color:var(--video-vezerlo-text);
    background:linear-gradient(to top,var(--video-arnyek) 0%,transparent 58%);}
.video-lejatszo-indit-jel{display:grid;place-items:center;width:clamp(4rem,9vw,6rem);aspect-ratio:1;border-radius:50%;
    background:var(--primary);color:var(--on-primary);box-shadow:var(--shadow-3);
    transition:transform var(--dur-ui) var(--ease-out),background-color var(--dur-ui) var(--ease-out);}
.video-lejatszo-indit-jel svg{width:42%;height:42%;margin-left:8%}
.video-lejatszo-indit:hover .video-lejatszo-indit-jel{transform:scale(1.06);background:var(--primary-hover)}
.video-lejatszo-indit:focus-visible{outline:3px solid var(--border-focus);outline-offset:-6px;border-radius:var(--r-xl)}
.video-lejatszo-indit-szoveg{position:absolute;left:clamp(var(--space-16),3vw,var(--space-32));bottom:clamp(var(--space-16),3vw,var(--space-32));
    right:var(--space-16);display:grid;gap:var(--space-4);text-align:left;}
.video-lejatszo-cimke{justify-self:start;padding:var(--space-4) var(--space-16);border-radius:999px;
    background:var(--video-arnyek);color:var(--video-vezerlo-text);}
.video-lejatszo-vezerlo{position:absolute;left:0;right:0;bottom:0;z-index:3;
    display:flex;align-items:center;gap:var(--space-4);
    padding:var(--space-24) var(--space-8) var(--space-8);
    background:linear-gradient(to top,var(--video-arnyek),transparent);
    color:var(--video-vezerlo-text);
     
    transition:opacity var(--dur-ui) var(--ease-out),visibility 0s;}
.video-lejatszo[data-allapot="kezdo"] .video-lejatszo-vezerlo,
  .video-lejatszo[data-nyugvo] .video-lejatszo-vezerlo{opacity:0;visibility:hidden;
    transition:opacity var(--dur-ui) var(--ease-out),visibility 0s linear var(--dur-ui)}
.video-lejatszo-gomb{display:grid;place-items:center;flex:none;min-width:44px;min-height:44px;
    padding:0;border:0;border-radius:var(--r-md);background:transparent;color:inherit;cursor:pointer;}
.video-lejatszo-gomb svg{width:24px;height:24px}
.video-lejatszo-gomb:hover{background:var(--video-gomb-hover)}
.video-lejatszo-gomb:focus-visible,
  .video-lejatszo-sav:focus-visible,
  .video-lejatszo-hangero:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px}
.video-lejatszo-jel-szunet,
  .video-lejatszo[data-allapot="megy"] .video-lejatszo-jel-lejatszas,
  .video-lejatszo-jel-nema,
  .video-lejatszo[data-nema] .video-lejatszo-jel-hang{display:none}
.video-lejatszo[data-allapot="megy"] .video-lejatszo-jel-szunet,
  .video-lejatszo[data-nema] .video-lejatszo-jel-nema{display:block}
.video-lejatszo-ido{flex:none;padding:0 var(--space-8);font-variant-numeric:tabular-nums;white-space:nowrap}
.video-lejatszo-sav,.video-lejatszo-hangero{-webkit-appearance:none;appearance:none;height:44px;margin:0;background:transparent;cursor:pointer;
    --vl-kitoltes:0%;}
.video-lejatszo-sav{flex:1 1 auto;min-width:0}
.video-lejatszo-hangero{flex:none;width:5.5rem}
.video-lejatszo-sav::-webkit-slider-runnable-track,
  .video-lejatszo-hangero::-webkit-slider-runnable-track{height:4px;border-radius:999px;
    background:linear-gradient(to right,var(--video-sav-kitoltes) var(--vl-kitoltes),var(--video-sav-alap) var(--vl-kitoltes));}
.video-lejatszo-sav::-moz-range-track,
  .video-lejatszo-hangero::-moz-range-track{height:4px;border-radius:999px;background:var(--video-sav-alap)}
.video-lejatszo-sav::-moz-range-progress,
  .video-lejatszo-hangero::-moz-range-progress{height:4px;border-radius:999px;background:var(--video-sav-kitoltes)}
.video-lejatszo-sav::-webkit-slider-thumb,
  .video-lejatszo-hangero::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;margin-top:-5px;border:0;border-radius:50%;
    background:var(--video-vezerlo-text);box-shadow:var(--shadow-1);}
.video-lejatszo-sav::-moz-range-thumb,
  .video-lejatszo-hangero::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:var(--video-vezerlo-text);box-shadow:var(--shadow-1);}
}
@layer components{
@media (hover:none),(max-width:480px){
.video-lejatszo-hangero{display:none}
}
}
@layer components{
@media (max-width:480px){
.video-lejatszo-ido-osszes{display:none}
}
}
@layer components{
.video-lejatszo-felirat{color:var(--text-secondary);max-width:62ch}
}
@layer components{
@media (prefers-reduced-motion:reduce){
.video-lejatszo-indit-jel,.video-lejatszo-vezerlo{transition:none}
.video-lejatszo-indit:hover .video-lejatszo-indit-jel{transform:none}
}
}
@layer components{
.video-tortenet{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(var(--space-24),4vw,var(--space-48));align-items:start}
.video-tortenet-alcim{color:var(--text-secondary);margin-top:var(--space-8);max-width:62ch}
.video-tortenet-szoveg{display:grid;gap:var(--space-16)}
.video-tortenet-szoveg p{margin:0}
.video-tortenet-adat{display:flex;flex-wrap:wrap;gap:var(--space-8);margin:0;padding:0;list-style:none}
.video-tortenet-adat li{padding:var(--space-4) var(--space-16);border-radius:999px;background:var(--surface-muted);color:var(--text-primary)}
.video-tortenet-megjegyzes{padding:var(--space-16);border-radius:var(--card-radius);background:var(--card-bg);border:1px solid var(--card-border);color:var(--text-secondary)}
}
@layer components{
@media (max-width:1024px){
.video-tortenet{grid-template-columns:minmax(0,1fr)}
}
}
@layer components{
.video-kartya{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-24);align-items:center;
    margin-top:var(--space-32);padding:var(--card-padding);
    background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--card-radius);}
.video-kartya-kep{position:relative;display:block;aspect-ratio:16 / 9;overflow:hidden;border-radius:var(--r-lg);background:var(--panel-dark-bg)}
.video-kartya-kep img{display:block;width:100%;height:100%;object-fit:cover}
.video-kartya-jel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;
    width:3.5rem;aspect-ratio:1;border-radius:50%;background:var(--primary);color:var(--on-primary);box-shadow:var(--shadow-2);}
.video-kartya-jel svg{width:40%;height:40%;margin-left:8%}
.video-kartya-kep:focus-visible{outline:3px solid var(--border-focus);outline-offset:3px}
.video-kartya-szoveg{display:grid;gap:var(--space-8)}
.video-kartya-szoveg p{margin:0}
}
@layer components{
@media (max-width:768px){
.video-kartya{grid-template-columns:minmax(0,1fr)}
}
}

/* ==========================================================================
   akcio.css — az akciós landing SAJÁT rétege a főprojekt designrendszere fölött
   --------------------------------------------------------------------------
   A keret (keret-app.css) és a főoldali modul (fooldal.css) ÖRÖKÖLT, ez a fájl
   csak azt adja hozzá, amit a landing látványterve (leadlinker #77, #69) a
   meglévő komponenseken felül kér. Szabályok, mint a főprojektben:
   - csak szemantikus token (primitív `--color-*` és nyers hex nincs),
   - a szabályok a keret rétegeibe kerülnek (`components`, `responsive`): réteg
     nélkül a kaszkád minden rétegzett szabályt felülírnának, a keret
     töréspont-szabályait is.
   Az epit.py a főprojekt `fooldal` moduljával EGY fájlba fűzi (a fejben így két
   stíluslap marad, mint a főprojekt lapjain).
   ========================================================================== */

@layer components {

  /* ===== HERO — a főprojekt `.hero` borítója, szövegpanellel =====
     A főoldali hero szövege fátyol nélkül áll a felvételen. Itt a háttér egy
     tagolt kerti jelenet, és a látványterv a szöveget sötét, áttetsző panelre
     teszi — ez a `.panel-dark` felülete, átlátszósággal. A főprojekt lágy foltja
     (veil) ezért kikapcsol: a világos ellipszis a sötét panel körül szürke
     udvart rajzolna. */
  .akcio-hero .hero-media::after{display:none}
  .akcio-hero-panel{
    max-width:calc(var(--container-max) / 2);
    padding:var(--panel-padding);
    border-radius:var(--panel-radius);
    background:color-mix(in srgb,var(--panel-dark-bg) 86%,transparent);
    -webkit-backdrop-filter:blur(var(--space-8));
    backdrop-filter:blur(var(--space-8));
  }
  .akcio-hero .hero-title,
  .akcio-hero .hero-lead{color:var(--panel-dark-text)}
  /* A kiemelés a terven Fern — Fern felületen mindig Forest a szöveg
     (designrendszer: a fehér a Fernen nem éri el a 4,5:1-et). */
  .akcio-hero .hl{background:var(--primary);color:var(--on-primary)}
  /* A panel gombja a panel ellentéte — ugyanaz a fogás, mint a
     `.panel-dark .btn-inverse`-nél: a sötét gomb a sötét panelen eltűnne. */
  .akcio-hero-panel .btn-inverse{
    background:var(--panel-dark-text);color:var(--panel-dark-bg);
    border-color:var(--panel-dark-text);
  }
  /* Az akció feltétele: a gombok alatt, kisebb fokon — nem ígéret, hanem a hozzá
     tartozó apró betű. A panel TELJES szövegszínét kapja, nem a halványat: az
     áttetsző panel a kép miatt világosabb a tömör `.panel-dark`-nál, és a 12px-es
     halvány szöveg rajta mérve 3,7:1 volt (AA: 4,5:1; Lighthouse, 2026-10-12). */
  .akcio-hero-feltetel{
    color:var(--panel-dark-text);
    max-width:var(--measure);
    margin-top:var(--space-24);
    text-wrap:pretty;
  }

  /* ===== 3. SZEKCIÓ — „A zárt emésztő terhei” =====
     Fejléc két hasábban: bal oldalt eyebrow + cím, jobb oldalt a bevezető. */
  .akcio-fej-ketoszlop{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:var(--space-24) var(--space-48);align-items:end;
  }
  .akcio-fej-ketoszlop .section-lead{margin-top:0}
  .akcio-fej-ketoszlop .section-lead strong{color:var(--text-primary)}

  /* Törzs: balra a körforgás-panel, jobbra a négy teher 2 × 2-es rácsban. */
  .akcio-terhek-racs{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:var(--space-32);align-items:stretch;
  }
  /* Új rács-variáns: két hasáb (a keretben a 3 és a 4 létezik). Tableten és
     telefonon a keret `.situation-grid[data-cols]` szabálya érvényes. */
  .situation-grid[data-cols="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}

  /* A körforgás-panel a `.panel-dark` felülete, de nem a kéthasábos záró
     blokk: egy oszlop, felső margó nélkül (a rács adja a távolságot). */
  .akcio-korforgas-panel{
    grid-template-columns:minmax(0,1fr);gap:var(--space-24);
    margin:0;align-content:space-between;
    /* A terven szűkebb a margó, mint a záró panelé: a négy lépés így egy sorban fér el. */
    padding:min(var(--panel-padding),var(--space-32));
  }
  .akcio-abra{display:block;width:100%;height:auto}
  .akcio-abra-vonal{stroke:var(--panel-dark-text)}
  .akcio-abra-zold{stroke:var(--primary)}
  .akcio-abra-folyadek{fill:var(--primary)}
  .akcio-abra-fold{fill:color-mix(in srgb,var(--panel-dark-text) 12%,transparent)}
  .akcio-abra-felirat{color:var(--panel-dark-muted);text-align:center}

  /* A körforgás négy lépése: egy sor, a lépések közt dekoratív nyíl (a
     képernyőolvasó a listát olvassa fel, a nyilat nem — üres alternatív szöveg). */
  .akcio-korforgas{
    display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
    gap:var(--space-8);
    margin:0;padding:var(--space-16);list-style:none;
    border:1px solid color-mix(in srgb,var(--panel-dark-text) 18%,transparent);
    border-radius:var(--r-md);
    background:color-mix(in srgb,var(--panel-dark-text) 6%,transparent);
  }
  .akcio-korforgas li{display:flex;align-items:center;gap:var(--space-8);color:var(--panel-dark-text)}
  .akcio-korforgas li + li::before{content:"→";content:"→" / "";color:var(--primary)}

  /* ===== 4. SZEKCIÓ — Alkalmasság (#70) =====
     Két sor, mindkettő szöveg + fotó. A második sorban asztalon a fotó áll balra
     (`order`) — a DOM-ban a szöveg van elöl, így felolvasva és keskeny nézetben is
     a kérdések jönnek előbb. */
  .akcio-alkalmassag-sor{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:var(--space-48) var(--space-64);align-items:start;
  }
  .akcio-alkalmassag-sor + .akcio-alkalmassag-sor{margin-top:var(--space-96)}
  .akcio-alkalmassag-sor-fordit .akcio-alkalmassag-kep{order:-1}
  .akcio-alkalmassag-szoveg{display:flex;flex-direction:column;gap:var(--space-24)}
  .akcio-csoport-cim{color:var(--text-primary)}
  .akcio-csoport-lead{
    color:var(--text-secondary);
    padding-bottom:var(--space-24);border-bottom:1px solid var(--border);
  }
  .akcio-kerdes{display:flex;flex-direction:column;gap:var(--space-8)}
  .akcio-kerdes-cimke{color:var(--text-tertiary)}
  .akcio-kerdes-cim{color:var(--text-primary)}
  .akcio-kerdes-szoveg{color:var(--text-secondary)}
  .akcio-alkalmassag-kep{margin:0;border-radius:var(--card-radius);overflow:hidden}
  .akcio-alkalmassag-kep img{display:block;width:100%;height:auto}
  .akcio-gombsor{display:flex;flex-wrap:wrap;gap:var(--space-8);margin-top:var(--space-8)}

  /* ===== 7. SZEKCIÓ — Gyors összehasonlítás (#71) =====
     A keret `.compare-table`-je egy lime panelen (a terv szerint), a hasábfejben a
     két termék örökölt fotójával. */
  .akcio-osszevetes{
    padding:var(--panel-padding);border-radius:var(--panel-radius);
    background:var(--surface-muted);
  }
  .akcio-osszevetes-fej{margin-bottom:0}
  .akcio-osszevetes-termek{
    width:calc(var(--space-96) + var(--space-16));height:auto;
    object-fit:contain;
  }

  /* ===== 8. SZEKCIÓ — Az A.B. Clear ára (#74) =====
     Sötét sáv a `.panel-dark` tokenjeivel (sötét témában ezek maguktól váltanak). */
  /* `content-visibility: visible`: a keret a `.section`-öket `auto`-ra állítja. A képernyőn
     kívüli szekciót ilyenkor a böngésző nem rajzolja ki, és az akadálymentességi mérés
     (axe/Lighthouse) a sötét háttér helyett a vásznat látja a világos szöveg mögött — téves
     kontraszthibát jelez (mérve 2026-10-12: 1,07:1, a valóságban ~15:1). Egy sáv ennyiért
     megéri; a többi szekcióé marad `auto`. A keret szelektora `main > .section:not(:first-child)`
     — ugyanilyen erős kell, hogy a későbbi (ez a) szabály nyerjen. */
  .akcio-ar{background:var(--panel-dark-bg);color:var(--panel-dark-text)}
  main > .section.akcio-ar:not(:first-child){content-visibility:visible}
  .akcio-ar .section-eyebrow{color:var(--panel-dark-muted)}
  .akcio-ar .section-title,
  .akcio-ar .section-lead{color:var(--panel-dark-text)}
  .akcio-ar-racs{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-24);
    margin:0;padding:0;list-style:none;
  }
  .akcio-ar-kartya{
    display:flex;flex-direction:column;gap:var(--space-16);
    padding:var(--space-32);border-radius:var(--card-radius);
    border:1px solid color-mix(in srgb,var(--panel-dark-text) 16%,transparent);
    background:color-mix(in srgb,var(--panel-dark-text) 5%,transparent);
  }
  .akcio-ar-cimke{color:var(--panel-dark-muted)}
  .akcio-ar-osszeg,
  .akcio-ar-meta{color:var(--panel-dark-text)}
  .akcio-ar-szoveg{color:var(--panel-dark-muted)}
  .akcio-ar-akcio{
    margin-top:auto;display:flex;flex-direction:column;gap:var(--space-8);
    padding:var(--space-16) var(--space-24);border-radius:var(--r-md);
    border:1px solid color-mix(in srgb,var(--primary) 45%,transparent);
    background:color-mix(in srgb,var(--primary) 16%,transparent);
    color:var(--panel-dark-text);
  }
  .akcio-pipa-lista,
  .akcio-plusz-lista{display:flex;flex-direction:column;gap:var(--space-8);margin:0;padding:0;list-style:none}
  .akcio-pipa-lista li,
  .akcio-plusz-lista li{display:flex;gap:var(--space-8);color:var(--panel-dark-text)}
  .akcio-pipa-lista li::before{content:"✓";content:"✓" / "";color:var(--primary);flex:none}
  .akcio-plusz-lista li::before{content:"+";content:"+" / "";color:var(--primary);flex:none}
  .akcio-ar-savok{display:flex;flex-direction:column;gap:var(--space-16);margin:0}
  .akcio-ar-savsor{display:flex;flex-direction:column;gap:var(--space-4)}
  .akcio-ar-savsor dt{color:var(--panel-dark-text)}
  .akcio-ar-savsor dd{margin:0;display:flex;flex-direction:column;gap:var(--space-4)}
  .akcio-ar-savertek{color:var(--panel-dark-muted)}
  .akcio-sav{display:block;block-size:var(--space-8);border-radius:var(--r-md)}
  /* A SÁVOK HOSSZA ADAT, nem díszítés: az emésztő évi 512 000 Ft-ja a 100%, az
     A.B. Clear fenntartásának felső értéke (27 500 Ft) ennek 5,4%-a. Ha a számok
     változnak, ezt is igazítani kell. */
  .akcio-sav-emeszto{inline-size:100%;background:color-mix(in srgb,var(--panel-dark-text) 30%,transparent)}
  .akcio-sav-abclear{inline-size:5.4%;min-inline-size:var(--space-8);background:var(--primary)}
  .akcio-ar-apro{color:var(--panel-dark-muted);max-width:var(--measure);margin-top:var(--space-24)}
  .akcio-ar-info{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-32);
    margin-top:var(--space-48);padding-top:var(--space-48);
    border-top:1px solid color-mix(in srgb,var(--panel-dark-text) 18%,transparent);
  }
  .akcio-ar-info-elem{display:flex;flex-direction:column;gap:var(--space-16)}
  .akcio-ar-info-elem h3{color:var(--panel-dark-text)}
  .akcio-ar-info-elem p,
  .akcio-ar-info .akcio-plusz-lista li{color:var(--panel-dark-muted)}
  .akcio-ar-cta{
    display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-16) var(--space-32);
    margin-top:var(--space-48);
  }
  .akcio-ar-cta p{color:var(--panel-dark-text)}
  /* Link a sötét sávon: a panel linkszíne (a --link kékje itt nem érné el a 4,5:1-et). */
  .akcio-ar a:not(.btn){color:var(--panel-dark-link)}
  .akcio-ar a:not(.btn):focus-visible{outline-color:var(--panel-dark-link)}

  /* ===== 9. SZEKCIÓ — Tapasztalatok (#73) =====
     Balra a szöveg, jobbra a főprojekt videólejátszója (örökölt `video` modul). */
  .akcio-video-sor{
    display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    gap:var(--space-48);align-items:start;
  }
  .akcio-video-szoveg{margin-bottom:0}
  .akcio-video-megjegyzes{
    margin-top:var(--space-24);padding:var(--space-16);
    border-radius:var(--card-radius);background:var(--card-bg);border:1px solid var(--card-border);
    color:var(--text-secondary);
  }

  /* Saját ikonok (src/icon/ — IDEIGLENES rajzolatok a főprojekt 24-es rácsán), a
     keret `.icon` maszkrendszerében: a szín a `currentColor`-ból jön. */
  .icon-akcio-naptar{-webkit-mask-image:url("/assets/akcio/icon/naptar.svg?v=fbce69c7c5");mask-image:url("/assets/akcio/icon/naptar.svg?v=fbce69c7c5")}
  .icon-akcio-szag{-webkit-mask-image:url("/assets/akcio/icon/szag.svg?v=594735b78c");mask-image:url("/assets/akcio/icon/szag.svg?v=594735b78c")}
}

@layer responsive {
  @media (max-width: 1024px) {
    /* Szűk nézetben a keret a szöveget a kép FÖLÉ teszi (`.hero{display:block}`):
       a panel ott önálló kártya a vásznon, teljes szélességben. */
    .akcio-hero-panel{max-width:none}
    .akcio-fej-ketoszlop,
    .akcio-terhek-racs{grid-template-columns:minmax(0,1fr)}
    .akcio-fej-ketoszlop .section-lead{margin-top:var(--space-16)}
    .akcio-alkalmassag-sor,
    .akcio-video-sor{grid-template-columns:minmax(0,1fr)}
    .akcio-alkalmassag-sor + .akcio-alkalmassag-sor{margin-top:var(--space-64)}
    .akcio-alkalmassag-sor-fordit .akcio-alkalmassag-kep{order:0}
    .akcio-ar-racs{grid-template-columns:minmax(0,1fr)}
    .akcio-ar-info{grid-template-columns:repeat(2,minmax(0,1fr))}
  }
  @media (max-width: 640px) {
    .akcio-ar-info{grid-template-columns:minmax(0,1fr)}
    .akcio-ar-kartya{padding:var(--space-24)}
  }
}