@layer components{
.hub-bevezeto{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
gap:var(--space-48);align-items:start;}
.hub-bevezeto-szoveg{display:grid;gap:var(--space-16);max-width:62ch}
.hub-bevezeto-szoveg > p{margin:0;color:var(--text-secondary)}
.hub-bevezeto-szoveg > .type-ui-body-strong{color:var(--text-primary)}
.hub-lenyeg{display:grid;gap:var(--space-16);
background:var(--hub-lenyeg-bg);
border:1px solid var(--card-border);border-left:4px solid var(--hub-lenyeg-jel);
border-radius:var(--card-radius);padding:var(--card-padding);
box-shadow:var(--card-shadow);}
.hub-lenyeg-cim{margin:0;color:var(--text-primary)}
.hub-lenyeg > p{margin:0;color:var(--text-secondary)}
.hub-kulcsadatok{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--space-16);margin:0;}
.hub-kulcsadat{display:flex;flex-direction:column-reverse;gap:var(--space-4);
padding:var(--space-16);border-radius:var(--r-md);background:var(--surface-muted);}
.hub-kulcsadat dt{color:var(--text-secondary)}
.hub-kulcsadat dd{margin:0;color:var(--text-primary)}
.hub-lenyeg-jegyzet{margin:0;color:var(--text-tertiary)}
.hub-lenyeg-jegyzet a{text-decoration:underline;text-underline-offset:2px}
.hub-tartalom{margin-top:var(--space-8);padding-top:var(--space-16);
border-top:1px solid var(--border);}
.hub-tartalom-cim{margin:0 0 var(--space-8);color:var(--text-tertiary)}
.hub-tartalom-lista{display:flex;flex-wrap:wrap;gap:var(--space-8);
margin:0;padding:0;list-style:none;}
.hub-tartalom-link{display:inline-flex;align-items:center;min-height:44px;
padding:0 var(--space-16);border-radius:var(--chip-radius);
background:var(--chip-bg);color:var(--chip-text);
font-family:var(--font-body);font-size:var(--type-ui-caption-size);font-weight:600;
text-decoration:none;
transition:background var(--dur-fast) var(--ease-out);}
.hub-tartalom-link:hover{background:var(--canvas);color:var(--text-primary)}
.hub-tartalom-link:focus-visible{outline:3px solid var(--border-focus);outline-offset:2px}
.hub-folyamat{margin:0 0 var(--space-48);display:grid;gap:var(--space-24)}
.hub-folyamat-fej{display:grid;gap:var(--space-8)}
.hub-folyamat-cim{margin:0;color:var(--text-primary)}
.hub-lepesek{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
gap:var(--space-24);margin:0;padding:0;list-style:none;
counter-reset:none;}
.hub-lepes{position:relative;display:flex;flex-direction:column;gap:var(--space-8);
background:var(--card-bg);border:1px solid var(--card-border);
border-radius:var(--card-radius);padding:var(--space-24);
box-shadow:var(--card-shadow);}
.hub-lepes + .hub-lepes::before{content:"";position:absolute;
left:calc(-1 * var(--space-24) + var(--space-4));top:var(--space-64);
width:calc(var(--space-24) - var(--space-8));height:2px;
background:var(--abra-kiemeles);}
.hub-lepes-rajz{display:block;width:100%;height:auto;aspect-ratio:120 / 84;
background:var(--surface-muted);border-radius:var(--r-md);
padding:var(--space-8);}
.hub-lepes-szam{margin:var(--space-8) 0 0;color:var(--text-secondary)}
.hub-lepes-cim{margin:0;color:var(--text-primary)}
.hub-irany{margin:var(--space-4) 0 0;align-self:start;
padding:var(--space-4) var(--space-8);
border-radius:var(--r-md);
background:var(--badge-bg);color:var(--badge-text);
text-wrap:balance;}
.hub-lepes-szoveg{margin:0;color:var(--text-secondary)}
.hub-folyamat-jegyzet{margin:0;color:var(--text-tertiary)}
.hub-lepesek-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hub-pipa{stroke-dasharray:34;stroke-dashoffset:0}
.hub-kerdesek{grid-template-columns:repeat(2,minmax(0,1fr))}
.hub-kerdes{gap:var(--space-8)}
.hub-kerdes-cim{margin:0;color:var(--text-primary)}
.hub-kerdes-link{margin:auto 0 0}
.hub-hullo{opacity:.9}
.hub-bub{opacity:.85}
.hub-foto{margin:0;display:grid;gap:var(--space-8)}
.hub-foto img{display:block;width:100%;height:auto;aspect-ratio:3 / 2;object-fit:cover;
border-radius:var(--card-radius);background:var(--surface-muted);}
.hub-foto-felirat{margin:0;color:var(--text-secondary);max-width:62ch}
.hub-foto-par,.hub-foto-sor{display:grid;gap:var(--space-24);margin-block:var(--space-32);}
.hub-foto-par{grid-template-columns:repeat(2,minmax(0,1fr))}
.hub-foto-sor{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:0}
.hub-foto-szeles{margin-block:var(--space-32)}
.hub-foto-szeles img{aspect-ratio:16 / 7}
.hub-tovabb{display:flex;margin:var(--space-16) 0 0}
.hub-tovabb + .hub-tovabb{margin-top:0}
.folyoszoveg + .compare-scroll.hub-adat-keret{margin-top:var(--space-16)}
.hub-tabla th[scope="row"]{text-align:left;color:var(--text-primary)}
.hub-tabla td{text-align:left;color:var(--text-secondary)}
.hub-tabla thead th{text-align:left}
.hub-adat-tabla{max-width:36rem}
.hub-adat-tabla th,.hub-adat-tabla td{text-align:left}
.hub-adat-tabla .hub-ertek{text-align:right;color:var(--text-primary);white-space:nowrap}
.hub-adat-tabla thead th:last-child{text-align:right}
.hub-kerdes-panel{grid-template-columns:minmax(0,1fr);gap:var(--space-16);
margin-block:var(--space-32);max-width:72ch;
padding:var(--space-32);}
.section-alt .hub-kerdes-panel{background:var(--surface)}
.hub-kerdes-panel h3{margin:0;color:var(--text-primary)}
.hub-elv{margin-block:var(--space-32);max-width:72ch;
padding:var(--space-16) var(--space-24);
background:var(--surface);
border-left:4px solid var(--hub-lenyeg-jel);
border-radius:0 var(--r-md) var(--r-md) 0;}
.hub-elv p{margin:0;color:var(--text-primary)}
.hub-bizalom{margin-top:var(--space-32);gap:var(--space-24)}
.hub-bizalom .trust-item{padding:var(--space-24);
background:var(--card-bg);border:1px solid var(--card-border);
border-radius:var(--card-radius);box-shadow:var(--card-shadow);}
.hub-bizalom .trust-item + .trust-item{border-left:1px solid var(--card-border)}
.hub-bizalom:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.hub-feltetelek{margin-block:var(--space-24);padding:0;list-style:none}
.hub-cimkek{display:flex;flex-wrap:wrap;gap:var(--space-8);
margin:var(--space-16) 0 var(--space-24);padding:0;list-style:none;}
.hub-utem,.hub-koltseg{margin-block:var(--space-32);padding:var(--card-padding);
background:var(--card-bg);border:1px solid var(--card-border);
border-radius:var(--card-radius);box-shadow:var(--card-shadow);}
.hub-koltseg-cim{margin:0;color:var(--text-primary)}
.hub-utem figcaption,.hub-koltseg figcaption{display:grid;gap:var(--space-4)}
.hub-utem-sav{position:relative;overflow:hidden;
display:grid;grid-template-columns:7fr 3fr;
height:var(--space-40);border-radius:var(--r-md);
border:1px solid var(--card-border);}
.hub-utem-be{background:var(--hub-utem-be)}
.hub-utem-ki{background:repeating-linear-gradient(135deg,var(--hub-utem-ki) 0 8px,transparent 8px 16px),var(--surface);}
.hub-utem-skala{display:grid;grid-template-columns:7fr 3fr;gap:var(--space-8);
margin:var(--space-8) 0 0;padding:0;list-style:none;color:var(--text-secondary);}
.hub-utem-skala strong{color:var(--text-primary)}
.hub-utem-adatok{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-16);
margin:var(--space-24) 0 0;}
.hub-utem-adatok > div{display:flex;flex-direction:column-reverse;gap:var(--space-4);
padding:var(--space-16);border-radius:var(--r-md);background:var(--surface-muted);}
.hub-utem-adatok dt{color:var(--text-secondary)}
.hub-utem-adatok dd{margin:0;color:var(--text-primary)}
.hub-szamitas{margin-block:var(--space-32);max-width:48rem}
.hub-szamitas h3{margin:0 0 var(--space-16);color:var(--text-primary)}
.hub-tetelek{margin:0;display:grid}
.hub-tetel{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-16);
padding-block:var(--space-8);border-bottom:1px solid var(--border);}
.hub-tetel dt{color:var(--text-secondary)}
.hub-tetel dd{margin:0;color:var(--text-primary);text-align:right;white-space:nowrap}
.hub-koltseg-sorok{display:grid;gap:var(--space-24);margin:var(--space-24) 0 0;padding:0;list-style:none;}
.hub-koltseg-sor{display:grid;grid-template-columns:minmax(0,1fr) auto;
column-gap:var(--space-16);row-gap:var(--space-8);align-items:baseline;}
.hub-koltseg-nev{margin:0;color:var(--text-primary)}
.hub-koltseg-reszlet{color:var(--text-tertiary);font-weight:400}
.hub-koltseg-osszeg{margin:0;color:var(--text-primary);white-space:nowrap}
.hub-koltseg-egyseg{color:var(--text-tertiary)}
.hub-koltseg-sav{grid-column:1 / -1;display:block;width:100%;height:var(--space-24);
border-radius:var(--r-md);overflow:hidden;
background:var(--canvas);box-shadow:inset 0 0 0 1px var(--border);}
.hub-sav-aram{fill:var(--hub-sav-aram)}
.hub-sav-zsak{fill:var(--hub-sav-zsak)}
.hub-sav-membran{fill:var(--hub-sav-membran)}
.hub-jelek{display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-24);
margin:var(--space-24) 0 0;padding:0;list-style:none;}
.hub-jel{display:inline-flex;align-items:center;gap:var(--space-8);color:var(--text-secondary)}
.hub-jel-minta{display:inline-block;width:var(--space-16);height:var(--space-16);
border-radius:var(--r-md);}
.hub-jel-minta.hub-sav-aram{background:var(--hub-sav-aram)}
.hub-jel-minta.hub-sav-zsak{background:var(--hub-sav-zsak)}
.hub-jel-minta.hub-sav-membran{background:var(--hub-sav-membran)}
.hub-esetek{margin-top:var(--space-24)}
.hub-eset{display:flex;flex-direction:column}
.hub-eset-link{margin:auto 0 0;padding-top:var(--space-8)}
.hub-jogi{margin:0 0 var(--space-24);display:grid;gap:var(--space-16);max-width:72ch}
.hub-jogi-tetel{display:grid;gap:var(--space-4);
padding-left:var(--space-16);border-left:2px solid var(--border);}
.hub-jogi-tetel dt{color:var(--text-primary)}
.hub-jogi-tetel dd{margin:0;color:var(--text-secondary)}
.hub-szerzo{margin-top:var(--space-32);padding:var(--space-24);max-width:72ch;
border-radius:var(--card-radius);background:var(--surface-muted);
display:grid;gap:var(--space-8);}
.hub-szerzo p{margin:0;color:var(--text-secondary)}
.hub-szerzo-datum{color:var(--text-tertiary)}
}
@layer responsive{
@media (max-width:1024px){
.hub-bevezeto{grid-template-columns:minmax(0,1fr);gap:var(--space-32)}
.hub-lepes + .hub-lepes::before{display:none}
.hub-bizalom:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
}
}
@layer responsive{
@media (max-width:640px){
.hub-kulcsadatok{grid-template-columns:minmax(0,1fr)}
.hub-utem-adatok{grid-template-columns:minmax(0,1fr)}
.hub-bizalom,
.hub-bizalom:has(> :nth-child(3):last-child){grid-template-columns:minmax(0,1fr);row-gap:var(--space-16)}
.hub-foto-szeles img{aspect-ratio:3 / 2}
.hub-tetel{flex-direction:column;gap:0}
.hub-tetel dd{text-align:left}
.hub-koltseg-sor{grid-template-columns:minmax(0,1fr)}
}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
.hub-hullo{transform-box:fill-box;transform-origin:center;
animation:hub-hullo 2.8s ease-in infinite;
animation-delay:calc(var(--i,0) * 460ms);}
.hub-pipa{animation:hub-pipa 900ms var(--ease-out) both}
.hub-bub{transform-box:fill-box;transform-origin:center;
animation:hub-bub 2.6s ease-in infinite;
animation-delay:calc(var(--i,0) * 620ms);}
.hub-bub.hub-bub-magas{--ut:34px;animation-duration:3.4s}
.hub-pulzus{transform-box:fill-box;transform-origin:center;
animation:hub-pulzus 3.6s ease-in-out infinite;
animation-delay:calc(var(--i,0) * 450ms);}
.hub-utem-sav::after{content:"";position:absolute;inset:0;
background:linear-gradient(to right,var(--text-primary) 0 3px,transparent 3px);
transform:translateX(0);
animation:hub-utem 10s linear infinite;}
}
}
@layer motion{
@media (prefers-reduced-motion:no-preference){
@supports (animation-timeline:view()){
.hub-koltseg-sav{animation:hub-sav linear both;
animation-timeline:view();
animation-range:entry 10% cover 35%;}
}
}
}