/* ============================================================
   Concorde UI — the class layer behind the blocks.

   Compressed from the prototype's inline styles; the prototype is the
   measure, and `npm run measure:css` is what keeps this honest against it.
   Prefix: cu-. Dark theme: <html data-theme="dark">, or the system
   preference while no choice has been stored.
   ============================================================ */

/* Tokens live in assets/tokens.css, generated from the kit by tools/tokens.mjs.
   It is enqueued as this stylesheet's dependency, so it is always loaded first. */

/* ---------- alap ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:var(--fw-body);background:var(--bg-soft);color:var(--text);overflow-x:hidden;min-height:100vh;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
input::placeholder,textarea::placeholder{color:var(--text-mute)}
section[id]{scroll-margin-top:90px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
em{font-style:italic}
.cu-wrap{max-width:var(--maxw);margin:0 auto;padding:var(--secpad) var(--gut)}
.cu-bleed{width:var(--vw100,100vw);margin:calc(-1*var(--secpad)) 0 calc(-1*var(--secpad)) calc(50% - .5*var(--vw100,100vw))}
.cu-bleed-wide{position:relative;overflow:hidden;width:min(var(--wide),var(--vw100,100vw));margin:calc(-1*var(--secpad)) 0 calc(-1*var(--secpad)) calc(50% - .5*min(var(--wide),var(--vw100,100vw)))}
.cu-section{border-bottom:1px solid var(--border)}
.cu-section--flush .cu-wrap{padding-top:0}
.cu-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- atoms: typography ---------- */
.cu-rule{display:block;width:48px;height:1px;background:var(--accent);margin-bottom:18px}
.cu-eyebrow{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--accent-text);font-weight:500;margin-bottom:18px}
.cu-eyebrow--hero{letter-spacing:.36em;margin-bottom:26px}
/* The dot the prototype puts before the label on the split hero, the statement
   and the band (.wf-dot). We had the label and not the dot. */
.cu-eyebrow--dot{display:flex;align-items:center;gap:14px}
.cu-eb-dot{display:inline-block;flex-shrink:0;width:9px;height:9px;border-radius:50%;background:var(--accent)}
.cu-h1{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.6vw,58px);line-height:1.1;letter-spacing:-.015em;color:var(--text)}
.cu-h1 em,.cu-h1 .cu-em{font-style:italic;color:var(--accent-text)}
.cu-h1 .cu-line{display:block}
.cu-h1--xl{font-size:clamp(44px,6.4vw,84px);line-height:1.04}
/* h1-oldal: 56/32 px a kit elemtablaja szerint. A .cu-pagehead ugyanezt adja
   kontextusbol; ez az a valtozat, amit egy sajat fejkent allo szekcio kerhet. */
.cu-h1--page{font-size:clamp(32px,4.4vw,56px);letter-spacing:-.012em}
.cu-h2{font-family:var(--serif);font-weight:400;font-size:clamp(27px,3.2vw,42px);line-height:1.14;letter-spacing:-.01em;color:var(--text);max-width:760px}
.cu-h2 em{font-style:italic;color:var(--text-soft)}
.cu-h2--accent em{color:var(--accent-text)}
.cu-h3{font-family:var(--serif);font-weight:400;font-size:23px;line-height:1.22;color:var(--text)}
.cu-lede{font-family:var(--serif);font-weight:300;font-size:calc(clamp(17px,1.9vw,21px)*var(--fs));line-height:1.6;color:var(--text-soft);max-width:680px;margin-top:18px}
.cu-sub{font-family:var(--serif);font-weight:300;font-size:calc(clamp(17px,1.9vw,22px)*var(--fs));line-height:1.5;color:var(--text-soft);max-width:520px;margin-top:24px}
.cu-sub--sans{font-family:var(--sans);font-weight:400;font-size:calc(clamp(15px,1.4vw,17px)*var(--fs))}
.cu-p{font-size:max(var(--fs-p),calc(15px*var(--fs)));line-height:1.78;color:var(--text-soft);margin-bottom:15px}
/* A bullet item is the same paragraph, not a list: the kit sets it in flex
   with the mark beside it. */
.cu-p--li{display:flex;gap:10px;margin-bottom:8px}
.cu-p-dot{flex-shrink:0}
.cu-p:last-child{margin-bottom:0}
.cu-p--sm{font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:1.65}
.cu-pull{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(21px,2.2vw,28px);line-height:1.4;color:var(--text);max-width:560px;margin-top:22px}
.cu-meta{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);font-weight:500}
/*
 * A link inside body copy is the accent, the way the prototype writes it on
 * every such element (`style="color: var(--wf-accent)"`). Ours are recognised
 * by what they are not: a link that is a component of its own -- a button, a
 * card, a row, a nav item -- always carries its class, and a bare <a> only
 * ever comes out of a rich-text field. The e-mail encoder rewrites a mailto
 * into a scripted link, so that one is named.
 *
 * Underlined on hover and focus: orange on the body grey is 2.83:1, just under
 * the 3:1 that colour-alone distinction needs, so the cue is not only colour.
 * `--accent-text` rather than `--accent`, so the accessibility panel's high
 * contrast darkens these too.
 */
/* Underlined at rest, not on hover: 1.4.1 asks that colour not be the only
   signal, and an underline is the one remedy that leaves the brand colour
   alone. Thickness and offset keep it quiet in running text. */
main a:not([class]),main a.mail-link{color:var(--accent-text);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
main a:not([class]):hover,main a:not([class]):focus-visible,main a.mail-link:hover,main a.mail-link:focus-visible{text-decoration-thickness:2px}
.cu-note{font-size:11px;line-height:1.6;color:var(--text-mute);margin-top:18px}
.cu-rows + .cu-note{margin-top:20px;max-width:760px}
.cu-stats + .cu-note{margin-top:14px}
/* Beágyazott tartalom. A keret idegen origóról üresen jelenik meg
   (docs/market-data), ezért van kerete: különben a hiány nem látszik. */
.cu-embed{border:1px solid var(--border);background:var(--panel)}
.cu-embed-f{display:block;width:100%;border:0}
.cu-embed-pat{display:block;min-height:500px}
.cu-num{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--accent-text)}
.cu-arw{color:var(--accent-text)}
.cu-tick{display:block;width:54px;height:2px;background:var(--accent);transform:scaleX(.4815);transform-origin:left center;transition:transform calc(var(--dur)*var(--spd)) var(--ease)}

/* ---------- atoms: buttons and links ---------- */
.cu-btn{display:inline-block;cursor:pointer;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:16px 36px;background:var(--accent);border:1px solid var(--accent);color:var(--on-accent);transition:transform calc(var(--dur)*var(--spd)) var(--ease),box-shadow calc(var(--dur)*var(--spd)) var(--ease),background var(--bt-dur),color var(--bt-dur),border-color var(--bt-dur);line-height:1.2}
.cu-btn:hover{background:var(--accent-deep);border-color:var(--accent-deep);transform:translateY(-3px);box-shadow:0 16px 34px rgba(241,142,0,.32)}
.cu-btn--outline{font-size:12px;padding:13px 28px;background:transparent;border-color:var(--border-strong);color:var(--text)}
.cu-btn--outline:hover{background:var(--accent-soft);border-color:var(--text)}
.cu-btn--hero{background:rgba(250,248,244,.55);border-color:rgba(26,26,26,.35);color:#1a1a1a}
.cu-btn--hero:hover{background:rgba(250,248,244,.85);border-color:#1a1a1a}
.cu-btn--sm{font-size:12px;padding:13px 28px}
.cu-btn--text{display:block;width:fit-content;margin-top:14px;padding:0;font-size:12px;letter-spacing:.1em;background:transparent;border:none;color:var(--accent-text)}
.cu-btn--text:hover{background:transparent;color:var(--accent-deep)}
.cu-btn--wide{padding:16px 40px}
.cu-btn--ondark.cu-btn--outline{border-color:rgba(250,250,248,.4);color:var(--paper-ink)}
.cu-btn--ondark.cu-btn--outline:hover{border-color:var(--paper-ink);background:rgba(250,250,248,.06)}
.cu-hbtn{cursor:pointer;font-family:var(--sans);font-size:13.5px;font-weight:600;letter-spacing:.015em;padding:11px 22px;background:var(--accent);border:1px solid var(--accent);color:var(--on-accent);transition:var(--bt-dur);white-space:nowrap}
.cu-hbtn:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.cu-hbtn--outline{font-weight:500;padding:11px 20px;background:transparent;border-color:var(--border-strong);color:var(--text)}
.cu-hbtn--outline:hover{border-color:var(--text);background:transparent}
.cu-more{display:inline-flex;flex-direction:column;gap:12px;width:fit-content;cursor:pointer}
.cu-more-row{display:inline-flex;align-items:center;gap:12px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--text)}
.cu-more-arrow{color:var(--accent-text);transition:transform calc(.32s*var(--spd)) var(--ease)}
.cu-more-line{position:relative;height:1px;width:100%;background:rgba(26,26,26,.28)}
[data-theme="dark"] .cu-more-line,.cu-ondark .cu-more-line{background:rgba(250,250,248,.28)}
.cu-more-line::after{content:"";position:absolute;left:0;top:0;height:1px;width:0;background:var(--accent);transition:width calc(.4s*var(--spd)) var(--ease)}
.cu-more:hover .cu-more-arrow{transform:translateX(7px)}
.cu-more:hover .cu-more-line::after{width:100%}
.cu-more--sm .cu-more-row{font-size:10px;font-weight:600;letter-spacing:.16em;color:var(--text-mute)}
.cu-icon-btn{background:transparent;border:1px solid var(--border-strong);border-radius:50%;color:var(--text-soft);cursor:pointer;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:border-color .25s,color .25s}
.cu-icon-btn:hover{border-color:var(--text);color:var(--text)}

/* ---------- atoms: form fields ---------- */
.cu-input,.cu-select,.cu-textarea{width:100%;font-family:var(--sans);font-size:15px;color:var(--text);border:none;border-bottom:1px solid var(--border-strong);background:transparent;padding:10px 0;outline:none;transition:border-color .25s;border-radius:0}
.cu-input:focus,.cu-select:focus,.cu-textarea:focus{border-bottom-color:var(--accent-text)}
.cu-select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none' stroke='%238a8884' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l4 3.6L9 1'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 2px center;padding-right:20px}
.cu-textarea{resize:vertical;min-height:96px}
.cu-field{display:block}
.cu-label{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mute);font-weight:600;margin-bottom:6px}
/* Consent-gated application: the button stays inactive until the box is ticked. */
.cu-apply{margin-top:28px}
.cu-apply-c{display:grid;grid-template-columns:16px 1fr;gap:12px;align-items:start;cursor:pointer;text-align:left;max-width:560px;margin:0 0 24px}
.cu-apply-c input{width:15px;height:15px;margin-top:2px;accent-color:var(--accent-text);cursor:pointer}
.cu-apply-t{font-size:12px;line-height:1.65;color:var(--text-soft)}
.cu-apply-t a{color:var(--accent-text)}
.cu-apply .cu-btn[aria-disabled="true"]{cursor:not-allowed;opacity:.45}
.cu-check{display:grid;grid-template-columns:16px 1fr;gap:12px;align-items:start;margin-top:12px;font-size:calc(12.5px*var(--fs));line-height:1.65;color:var(--text-soft);cursor:pointer}
.cu-check input{margin-top:2px;accent-color:var(--accent-text);width:15px;height:15px}
.cu-submit{cursor:pointer;border:none;background:var(--accent);color:var(--on-accent);font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;padding:14px 28px;transition:background var(--bt-dur)}
.cu-submit:hover{background:var(--accent-deep)}

/* ---------- molecules ---------- */
.cu-head{max-width:760px}
.cu-head--center{margin:0 auto;text-align:center}
.cu-head--center .cu-rule{margin-left:auto;margin-right:auto}
.cu-head--center .cu-lede{margin-left:auto;margin-right:auto}
/* Sorlista es szamsor-nyitany: a kit sajat meretei. */
/* Osztott hero es szakertoi racs — a kit mert ertekei. */
.cu-hero-split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,76px);align-items:center}
.cu-hs-cta{display:flex;gap:16px;flex-wrap:wrap;margin-top:38px}
.cu-xp-group{margin-top:40px;padding-bottom:14px;border-bottom:1px solid var(--border);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-mute);font-weight:600}
.cu-xpg{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(32px,4vw,56px) clamp(20px,3vw,40px);margin-top:32px}
/* Lekerekitett sarok: a sarkot a szerkeszto valasztja, a meretet a szekcio adja. */
.cu-spot{--corner:clamp(90px,12vw,180px)}
.cu-hero-split{--corner:clamp(110px,15vw,230px)}
.cu-rows{border-top:1px solid var(--border);margin-top:40px}
.cu-news{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(28px,4vw,56px);align-items:center}
.cu-news-lede{font-family:var(--serif);font-weight:300;font-size:20px;line-height:1.5;color:var(--text-soft);margin-top:14px}
.cu-news .cu-h2{font-size:clamp(27px,3.2vw,40px);line-height:1.14}
.cu-news-form{max-width:480px}
.cu-news-label{display:block;font-size:12px;font-weight:500;letter-spacing:.04em;color:var(--text);margin-bottom:8px}
.cu-news-input{display:block;width:100%;box-sizing:border-box;font-family:var(--sans);font-size:14px;color:var(--text);background:transparent;border:1px solid var(--border-strong);padding:15px 18px;outline:none;border-radius:0;transition:border-color .25s}
.cu-news-input:focus{border-color:var(--accent-text)}
/* The consents stay collapsed until there is an address to consent about. */
.cu-news-more{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows .5s var(--ease),opacity calc(var(--dur)*var(--spd)) var(--ease),visibility calc(var(--dur)*var(--spd)) var(--ease)}
.cu-news-more>div{overflow:hidden;min-height:0}
.cu-news-more.on{grid-template-rows:1fr;opacity:1;visibility:visible}
.cu-news-cst{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--text);margin-top:24px}
.cu-news-cb{display:grid;grid-template-columns:16px 1fr;gap:12px;align-items:start;cursor:pointer;margin-top:12px}
.cu-news-cb input{width:15px;height:15px;margin-top:2px;accent-color:var(--accent-text);cursor:pointer}
.cu-news-cb span{font-size:calc(12.5px*var(--fs));line-height:1.65;color:var(--text-soft)}
.cu-news-cb a{color:var(--text);text-decoration:underline;text-underline-offset:2px}
.cu-news-note{font-size:12px;line-height:1.6;color:var(--text-soft);margin-top:16px}
.cu-news-form .cu-btn{margin-top:18px;font-size:12px;padding:15px 34px}
.cu-news-status{font-size:12.5px;line-height:1.65;color:var(--text-soft)}
@media (prefers-reduced-motion:reduce){.cu-news-more{transition:none}}
.cu-statshead{max-width:760px;margin-bottom:32px}
.cu-grid{display:grid;border-top:1px solid var(--border);border-left:1px solid var(--border);margin-top:42px}
.cu-grid--2{grid-template-columns:repeat(2,1fr)}
.cu-grid--3{grid-template-columns:repeat(3,1fr)}
.cu-grid--4{grid-template-columns:repeat(4,1fr)}
.cu-grid--feat{grid-template-columns:1.45fr 1fr 1fr}
.cu-card{background:var(--panel);border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:32px 28px 30px;display:flex;flex-direction:column;min-height:208px;cursor:default;transition:transform calc(var(--dur)*var(--spd)) var(--ease),box-shadow calc(var(--dur)*var(--spd)) var(--ease);position:relative}
.cu-card:any-link{cursor:pointer}
a.cu-card:hover,.cu-card--hover:hover{transform:translateY(-8px) scale(1.008);box-shadow:0 26px 60px rgba(24,32,46,.16);z-index:1}
.cu-card-meta{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);font-weight:500}
.cu-card-title{font-family:var(--serif);font-weight:400;font-size:23px;line-height:1.22;color:var(--text);margin:26px 0 12px}
.cu-card-desc{font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:1.65;color:var(--text-soft)}
.cu-card-foot{margin-top:18px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);font-weight:500;display:flex;gap:10px;align-items:center}
.cu-card--img{position:relative;overflow:hidden;background:var(--navy);min-height:340px;justify-content:flex-end;padding:0}
.cu-card--img .cu-zoom{position:absolute;inset:-2px;background-size:cover;background-position:50% 50%}
.cu-card--img .cu-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(24,32,46,.88) 0%,rgba(24,32,46,.3) 55%,rgba(24,32,46,.08) 80%)}
.cu-card--img .cu-card-in{position:relative;padding:30px 28px}
.cu-card--img .cu-card-meta{color:var(--accent-text);margin-bottom:0}
.cu-card--img .cu-card-title{font-size:27px;color:var(--paper-ink);margin:16px 0 10px}
.cu-card--img .cu-card-desc{color:rgba(250,250,248,.78);max-width:420px}
.cu-list{border-top:1px solid var(--border);margin-top:40px}
.cu-row{display:grid;grid-template-columns:56px 1fr auto;gap:24px;align-items:baseline;padding:26px 18px;margin:0 -18px;border-bottom:1px solid var(--border);cursor:default;transition:background var(--bt-dur)}
/* Without an href the row is not a link, and the kit shows no arrow either. */
.cu-row:any-link{cursor:pointer}
a.cu-row:hover{background:var(--accent-soft)}
.cu-row-t{font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.4vw,25px);line-height:1.2;color:var(--text);margin-bottom:7px}
.cu-row-d{font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:1.7;color:var(--text-soft);max-width:560px;white-space:pre-line}
.cu-row-l{font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:2;color:var(--text-soft);max-width:560px}
.cu-row-end{display:flex;align-items:baseline;gap:14px}
.cu-row-end .cu-meta{text-align:right}
.cu-row-k{margin-bottom:7px}
/* rowsImg: a portrait that stays put while the rows scroll past it, and a
   denser row — the kit drops the end slot here, so there is no third column. */
.cu-rows-img{display:grid;grid-template-columns:.85fr 1.35fr;gap:clamp(30px,5vw,70px);align-items:start}
.cu-rows-pic{position:sticky;top:calc(var(--hdr) + 29px)}
.cu-rows-img .cu-row{grid-template-columns:48px 1fr;gap:20px;padding:22px 14px;margin:0 -14px}
.cu-rows-img .cu-row-end{display:none}
.cu-rows-img .cu-num{font-size:19px}
.cu-rows-img .cu-row-t{font-size:clamp(19px,2.2vw,23px)}
.cu-rows-img .cu-row-d{line-height:1.65;max-width:520px}
.cu-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.cu-stat{padding:38px 36px 36px;border-left:1px solid var(--border)}
.cu-stat:first-child{padding-left:0;border-left:none}
.cu-stat-n{font-family:var(--serif);font-weight:300;font-size:clamp(38px,4vw,54px);line-height:1;letter-spacing:-.02em;color:var(--text);margin-bottom:12px}
.cu-stat-l{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);font-weight:500;line-height:1.5}
.cu-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3.4vw,52px);margin-top:44px}
.cu-pill:hover .cu-tick{transform:scaleX(1)}
.cu-pill-t{display:block;font-family:var(--serif);font-size:clamp(20px,2vw,24px);line-height:1.22;color:var(--text);margin:18px 0 10px}
.cu-pill-d{display:block;font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:1.68;color:var(--text-soft)}
/* `pillars lista`: the same tick molecule stacked, one rule per row, with the
   tick in its own 56px column instead of above the title. */
.cu-pillars--list{display:block;margin-top:40px}
.cu-pillars--list .cu-pill{display:grid;grid-template-columns:56px 1fr;gap:24px;align-items:start;padding:24px 0;border-top:1px solid var(--border)}
.cu-pillars--list .cu-tick{grid-column:1;grid-row:1;margin-top:12px}
.cu-pillars--list .cu-pill-t{grid-column:2;grid-row:1;font-size:clamp(20px,2.2vw,24px);margin:0 0 8px}
.cu-pillars--list .cu-pill-d{grid-column:2;grid-row:2;max-width:560px}
.cu-faq{border-top:1px solid var(--border);margin-top:36px;max-width:860px}
.cu-faq-i{border-bottom:1px solid var(--border);scroll-margin-top:140px}
.cu-faq-q{width:100%;text-align:left;background:transparent;border:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-family:var(--serif);font-weight:400;font-size:clamp(18px,2vw,23px);line-height:1.3;color:var(--text)}
.cu-faq-sign{font-family:var(--sans);font-size:22px;font-weight:300;color:var(--accent-text);flex-shrink:0;transition:transform calc(var(--dur)*var(--spd)) var(--ease)}
.cu-faq-i.on .cu-faq-sign{transform:rotate(45deg)}
.cu-faq-w{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.cu-faq-i.on .cu-faq-w{grid-template-rows:1fr}
.cu-faq-wi{overflow:hidden;min-height:0}
.cu-faq-a{padding:2px 0 26px;max-width:660px}
.cu-faq-a .cu-more{margin-top:14px}
.cu-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(32px,5vw,80px)}
/* A szovegszekcio jobb hasabja; egyedul maradva szukebb mertek. */
.cu-textcol{padding-top:6px}
.cu-cols>.cu-textcol:only-child{max-width:760px}
.cu-intro{font-family:var(--serif);font-weight:300;font-size:21px;line-height:1.5;color:var(--text);margin-bottom:18px}
/* A szovegszekcio sajat meretei: a kit itt tagabb cimke-terkozt es 1.15 sorkozt ad. */
.cu-text .cu-eyebrow{margin-bottom:20px}
.cu-text .cu-h2{line-height:1.15}
.cu-text .cu-textcol .cu-btn{margin-top:14px}
.cu-cols--2{grid-template-columns:1fr 1fr}
/* Kepes valtozatok: a kit sajat racsai. */
.cu-cols--img{grid-template-columns:1.15fr 1fr;gap:clamp(30px,5vw,76px);align-items:center}
/* Keppel a cim es a szoveg egy hasabban fut, a bekezdesek 22px-re a cimtol. */
.cu-cols--img .cu-textcol{padding-top:0;margin-top:22px}
.cu-text .cu-cols--img .cu-frame{aspect-ratio:4/3;max-height:56vh}
.cu-faqwrap.cu-faq--img{display:grid;grid-template-columns:1.55fr .85fr;gap:clamp(30px,5vw,70px);align-items:start}
.cu-faq--img .cu-frame{aspect-ratio:3/4}
.cu-col-h{margin-bottom:14px}
.cu-col-h .cu-rule{margin-bottom:14px}
.cu-frame{position:relative;overflow:hidden;background:var(--paper-warm)}
/* An image slot with nothing chosen yet shows a hatch rather than a flat
   block, so an unfinished page reads as unfinished instead of broken. The
   element that carries the picture writes background-image inline, so one
   selector covers both states and nothing is stored for the placeholder. The
   editor loads this stylesheet too, so the two look the same. */
.cu-zoom:not([style*="url"]),.cu-hero-img:not([style*="url"]),.cu-dqr:not([style*="url"]),.cu-dbadgeimg:not([style*="url"]),.cu-bl-img:not(:has(img)),.cu-embed-pat{background-color:var(--paper-warm);background-image:repeating-linear-gradient(45deg,transparent 0 10px,rgba(26,26,26,.045) 10px 20px)}
[data-theme="dark"] .cu-zoom:not([style*="url"]),[data-theme="dark"] .cu-hero-img:not([style*="url"]),[data-theme="dark"] .cu-dqr:not([style*="url"]),[data-theme="dark"] .cu-dbadgeimg:not([style*="url"]),[data-theme="dark"] .cu-embed-pat{background-color:var(--panel);background-image:repeating-linear-gradient(45deg,transparent 0 10px,rgba(250,250,248,.06) 10px 20px)}

.cu-frame .cu-zoom{position:absolute;inset:-2px;background-size:cover;background-position:50% 50%;transition:transform calc(1.2s*var(--spd)) var(--ease)}
.cu-frame:hover .cu-zoom{transform:scale(1.07)}
/* The row link keeps its own feedback; everything else dips on press. */
a:active{transform:scale(.985)}
a.cu-row:active{transform:none}
.cu-frame--arc{border-radius:0 0 0 clamp(110px,15vw,230px)}
.cu-corner--tl{border-radius:var(--corner,clamp(80px,10vw,160px)) 0 0 0}
.cu-corner--tr{border-radius:0 var(--corner,clamp(80px,10vw,160px)) 0 0}
.cu-corner--br{border-radius:0 0 var(--corner,clamp(80px,10vw,160px)) 0}
.cu-corner--bl{border-radius:0 0 0 var(--corner,clamp(80px,10vw,160px))}
.cu-signoff{margin-top:28px;padding-top:22px;border-top:1px solid var(--border)}
.cu-signoff-n{font-family:var(--serif);font-size:21px;color:var(--text)}
.cu-signoff-r{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);font-weight:500;margin-top:6px}
.cu-src{margin-top:34px}

/* ---------- organism: header ---------- */
.cu-topbar{background:var(--bg-soft);font-family:var(--sans)}
.cu-topbar--navy{background:var(--navy);color:var(--paper-ink)}
.cu-topbar--paper{background:var(--paper-warm);border-bottom:1px solid var(--border)}
.cu-topbar-in{max-width:var(--wide);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;height:34px;padding:0 var(--gut)}
.cu-topbar-l{font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;font-weight:600;white-space:nowrap;color:var(--text-soft)}
.cu-topbar--navy .cu-topbar-l{color:rgba(250,250,248,.7)}
.cu-topbar-r{display:flex;align-items:center;gap:20px;font-size:10px;font-weight:600;letter-spacing:.12em;color:var(--text-mute)}
.cu-topbar-r button{background:transparent;border:none;cursor:pointer;padding:0;font:inherit;letter-spacing:inherit;color:inherit;display:inline-flex;align-items:center;gap:7px;text-transform:uppercase}
.cu-topbar-r button.on,.cu-topbar-r button:hover{color:var(--text)}
/* The two icon buttons in the top bar wear a ring (.wf-tbtheme in the
   prototype): 26px, the border mixed from the current text colour so it works
   on the paper and navy skins alike. Ours had none — the generic button reset
   above strips the border, and nothing put it back. */
.cu-topbar-r .cu-topbar-ctl{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:1px solid color-mix(in srgb,currentColor 40%,transparent);border-radius:50%;transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.cu-topbar-r .cu-topbar-ctl:hover{border-color:currentColor}
.cu-topbar-r .cu-topbar-ctl:focus-visible{outline:1px solid var(--accent);outline-offset:2px}
.cu-topbar--navy .cu-topbar-r button.on{color:var(--paper-ink)}
/* A sticky element only sticks inside its containing block, and the block
   theme wraps the header in a template-part div as tall as the header itself —
   so without this the header scrolls away on every page. */
.wp-block-template-part:has(>.cu-topbar){display:contents}
.cu-header{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--border)}
.cu-header-in{max-width:var(--wide);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px var(--gut)}
.cu-logo{display:inline-flex;align-items:center;flex-shrink:0}
.cu-logo img{height:var(--logo-h);width:auto}
.cu-logo-d,.cu-ic-sun{display:none}
[data-theme="dark"] .cu-logo-l,[data-theme="dark"] .cu-ic-moon{display:none}
[data-theme="dark"] .cu-logo-d,[data-theme="dark"] .cu-ic-sun{display:block}
.cu-nav{display:flex;align-items:center;gap:26px}
.cu-nav-item{position:relative}
/* The mega panel centres on the header, not on its own entry. */
.cu-nav-item--mega{position:static}
.cu-lang{display:flex;align-items:center;gap:8px}
.cu-tb-search{font-weight:500;letter-spacing:.16em}
.cu-lang button[disabled]{cursor:default;opacity:.55}
.cu-icon-btn--sm{width:34px;height:34px}
/* Shown only where the kit shows them: the controls move from the top bar
   into the header row below the burger breakpoint. */
.cu-header-ctl{display:none}
.cu-nav-l{position:relative;display:inline-flex;align-items:center;gap:6px;padding:8px 0;font-family:var(--sans);font-size:13px;font-weight:400;letter-spacing:.02em;color:var(--text-soft);background:transparent;border:none;cursor:pointer;transition:color var(--bt-dur)}
.cu-nav-l:hover,.cu-nav-item.open .cu-nav-l{color:var(--text)}
/* The kit animates scaleX and keys the open state off aria-expanded, which
   also covers keyboard focus. The transition is left off: on a pseudo
   element Chrome does not restart it when the attribute flips, and the
   underline then never arrives. */
.cu-nav-l::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left center}
.cu-nav-l:hover::after,.cu-nav-l:focus-visible::after,.cu-nav-l[aria-expanded="true"]::after{transform:scaleX(1)}
.cu-chev{color:var(--text-mute);margin-top:1px;transition:transform .3s var(--ease),color .25s}
.cu-nav-item.open .cu-chev{transform:rotate(180deg);color:var(--accent-text)}
/* mega menu (kit v3: image card plus columns) */
.cu-mega{position:absolute;top:100%;left:50%;transform:translateX(-50%);width:min(920px,92vw);background:var(--panel);border:1px solid var(--border);box-shadow:0 16px 44px rgba(0,0,0,.14);display:none;z-index:60}
.cu-nav-item.open .cu-mega{display:block}
/* Three groups or more need the wider panel, as the kit's own panels do. */
.cu-mega--wide{width:min(1160px,92vw)}
.cu-mega-in{display:grid;grid-template-columns:280px repeat(var(--cols,2),1fr)}
.cu-mega-card{background:var(--mega-card,var(--bg-soft));border-right:1px solid var(--border);padding:22px 24px 24px;display:flex;flex-direction:column;gap:14px;text-align:left}
[data-theme="dark"] .cu-mega-card{--mega-card:#18181c}
.cu-mega-img{aspect-ratio:16/10;border-radius:0 0 0 72px;background-size:cover;background-position:center;background-repeat:no-repeat;background-color:var(--border)}
.cu-mega-name{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.1;color:var(--text)}
.cu-mega-lede{margin:0;font-family:var(--serif);font-weight:400;font-size:17px;line-height:1.45;color:var(--text-soft)}
.cu-mega-btn{display:inline-flex;align-items:center;gap:12px;align-self:flex-start;margin-top:auto;padding:13px 22px;background:var(--text);color:var(--bg);font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:.06em;border:1px solid var(--text);transition:background var(--bt-dur),color var(--bt-dur),border-color var(--bt-dur)}
.cu-mega-btn:hover{background:transparent;color:var(--text);border-color:var(--text)}
.cu-mega-arr{font-size:16px;line-height:1}
.cu-mega-col{padding:24px 26px 18px}
.cu-mega-h{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-text);font-weight:600;margin-bottom:14px}
.cu-mega-i{display:block;padding:9px 10px;margin:0 -10px;transition:background .2s}
.cu-mega-i:hover{background:var(--accent-soft)}
.cu-mega-i span:first-child{display:block;font-size:calc(var(--fs-mi)*var(--fs));color:var(--text)}
.cu-mega-i span:last-child{display:block;font-size:calc(var(--fs-md)*var(--fs));line-height:1.5;color:var(--text-soft)}
.cu-nav-item.open .cu-dd{display:block}
.cu-nav-item.open .cu-mega{display:block}
.cu-header-r{display:flex;align-items:center;gap:12px;flex-shrink:0}
.cu-burger{background:transparent;border:none;cursor:pointer;width:40px;height:40px;display:none;flex-direction:column;justify-content:center;gap:5px;align-items:center}
.cu-burger span{width:22px;height:1.5px;background:var(--text);display:block;transition:transform .3s,opacity .3s}
.cu-burger.on span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.cu-burger.on span:nth-child(2){opacity:0}
.cu-burger.on span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
/* mobile menu (kit v3: accordion, from the mega menu data) */
/* A local search field under a page title (the document library's). */
.cu-sb-bar{max-width:640px;margin-top:30px}
.cu-sb-bar .cu-bl-q{margin-top:0}

/* ---------- search results (sr-*) ---------- */
/* Every value here is the prototype's own (wireframe/v33-kereso), translated
   to our tokens. The family is `sr-`, the field and chips are the shared
   `bl-` ones. */
.cu-sr-chips{margin-top:22px}
.cu-sr-chips .cu-bl-chip,.cu-sr-sub .cu-bl-chip{gap:8px;text-decoration:none}
.cu-sr-n{font-size:11px;color:var(--text-mute);font-variant-numeric:tabular-nums}
.cu-sr-sub{margin-top:10px}
.cu-sr-sub .cu-bl-chip{padding:5px 11px;font-size:12px}
.cu-sr-status{margin-top:28px}
.cu-sr-all{display:inline-block;margin-top:10px}
.cu-sr-grp{margin-top:clamp(40px,4.4vw,56px)}
.cu-sr-grp-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--border-strong);max-width:880px}
.cu-sr-grp-t{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.4vw,30px);line-height:1.2;color:var(--text)}
.cu-sr-grp-t .cu-sr-n{font-family:var(--sans);font-size:12px;margin-left:8px}
.cu-sr-list{display:grid;max-width:880px}
.cu-sr-it{display:grid;gap:8px;padding:22px 0;border-bottom:1px solid var(--border)}
.cu-sr-k{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mute);font-weight:500}
.cu-sr-kind{font-weight:600;color:var(--text-soft)}
.cu-sr-path{letter-spacing:.02em;text-transform:none;font-size:12px;font-weight:400}
.cu-sr-t{font-family:var(--serif);font-weight:400;font-size:23px;line-height:1.25;color:var(--text);text-wrap:pretty;overflow-wrap:break-word}
.cu-sr-t a{color:inherit;text-decoration:none;transition:color var(--dur) var(--ease)}
@media (hover:hover){.cu-sr-t a:hover{color:var(--accent)}}
.cu-sr-t a:focus-visible,.cu-sr-f a:focus-visible{outline:2px solid var(--text);outline-offset:3px}
.cu-sr-ext{font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent-line);padding:3px 8px;margin-left:10px;vertical-align:3px;white-space:nowrap}
.cu-sr-x{font-size:13.5px;line-height:1.65;color:var(--text-soft);max-width:700px}
.cu-sr-f{font-size:12.5px;line-height:1.6;color:var(--text-mute)}
.cu-sr-f a{color:var(--accent);text-decoration:none}
@media (hover:hover){.cu-sr-f a:hover{text-decoration:underline;text-underline-offset:.25em}}
.cu-sr mark,.cu-srp mark{background:rgba(241,142,0,.22);color:inherit;padding:0 .06em;border-radius:2px}
.cu-sr-none{margin-top:20px;max-width:700px}
.cu-sr-none ul{margin:14px 0 0;padding-left:18px;color:var(--text-soft);font-size:14px;line-height:1.8}
.cu-sr-none ul a{color:var(--accent)}
.cu-sr-cta{margin-top:36px;padding-top:24px;border-top:1px solid var(--border)}
.cu-sr-pager{display:flex;flex-wrap:wrap;gap:6px;margin-top:36px}
.cu-sr-pager a.cu-bl-pg{text-decoration:none}
.cu-bl-pg{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);background:transparent;color:var(--text-soft);font-family:var(--sans);font-size:13px}
@media (hover:hover){.cu-bl-pg:hover{border-color:var(--accent)}}
.cu-bl-pg[aria-current="page"]{border-color:var(--text);color:var(--text)}

/* The mobile menu opens with the same field, a little smaller. */
.cu-mob-srch{margin:0 0 18px;max-width:none}
.cu-mob-srch input{font-size:22px;padding:10px 0}

/* ---------- header: search panel ---------- */
/* Values and class names are the prototype's own (wireframe/v33-kereso,
   `wf-srp*` and `sr-quick*`), not ours: the first version here invented both
   and therefore styled nothing the design describes. The panel is absolutely
   positioned against the header, which is why it renders inside it. */
.cu-srp-bd{position:fixed;inset:0;z-index:48;background:rgba(14,17,19,.32);animation:cu-sr-fade .2s var(--ease)}
.cu-srp{position:absolute;left:0;right:0;top:100%;z-index:55;background:var(--bg);border-bottom:1px solid var(--border);box-shadow:0 18px 40px rgba(0,0,0,.10);animation:cu-sr-in .22s var(--ease)}
.cu-srp-in{max-width:1080px;margin:0 auto;padding:clamp(24px,3.6vw,44px) clamp(20px,5vw,64px) clamp(26px,3.2vw,38px)}
.cu-srp-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.cu-srp .cu-bl-q{max-width:none;margin-top:10px}
.cu-srp-x{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--text-soft);cursor:pointer;margin-right:-12px;transition:color var(--dur) var(--ease)}
@media (hover:hover){.cu-srp-x:hover{color:var(--text)}}
.cu-srp-x:focus-visible{outline:2px solid var(--text);outline-offset:3px}
.cu-srp-hint{font-size:12px;color:var(--text-mute);margin-top:12px}
.cu-sr-quick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:22px}
.cu-sr-quick-l{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mute);font-weight:500;margin-right:6px}
.cu-sr-quick a{text-decoration:none}
.cu-sr-quick a:focus-visible{outline:2px solid var(--text);outline-offset:3px}
/* The browser's own clear button is hidden, as the design asks (§8). */
.cu-bl-q input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
@keyframes cu-sr-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes cu-sr-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.cu-srp,.cu-srp-bd{animation:none}}
html.cu-a11y-nomotion .cu-srp,html.cu-a11y-nomotion .cu-srp-bd{animation:none}

.cu-mobile{display:none;position:fixed;inset:69px 0 0;z-index:45;background:var(--bg);padding:24px var(--gut) 60px;overflow-y:auto}
.cu-mobile.on{display:block}
.cu-mobile-g{border-bottom:1px solid var(--border);padding:6px 0}
.cu-macc-t{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;background:transparent;border:none;cursor:pointer;padding:14px 0;font-family:var(--serif);font-size:24px;color:var(--text);text-align:left}
.cu-macc-t svg{flex-shrink:0;color:var(--text-soft);transition:none}
.cu-mobile-g.open .cu-macc-t svg{transform:rotate(180deg)}
.cu-macc-l{display:block;font-family:var(--serif);font-size:24px;color:var(--text);padding:14px 0}
.cu-macc-p{display:none}
.cu-mobile-g.open .cu-macc-p{display:block}
/* The mobile card is the mega card at another size; the kit reuses the same
   inner classes for it. */
.cu-mob-card{background:var(--mega-card,var(--bg-soft));border:1px solid var(--border);padding:14px 14px 16px;margin:2px 0 10px;display:flex;flex-direction:column;gap:12px}
[data-theme="dark"] .cu-mob-card{--mega-card:#18181c}
.cu-mob-card .cu-mega-img{aspect-ratio:16/7;border-radius:0 0 0 48px}
.cu-mob-card .cu-mega-lede{font-size:16px}
.cu-mob-card .cu-mega-btn{display:flex;justify-content:space-between;width:100%;box-sizing:border-box;margin:0}
.cu-mobile-cta{display:flex;flex-direction:column;gap:12px;margin-top:24px}
.cu-mobile-cta .cu-hbtn{text-align:center;padding:15px}
.cu-crumb{max-width:var(--maxw);margin:0 auto;padding:16px var(--gut) 0;font-size:11px;letter-spacing:.06em;color:var(--text-mute);display:flex;gap:10px}
.cu-crumb a{color:var(--text-soft)}
.cu-crumb a:hover{color:var(--text)}

/* ---------- organizmus: hero ---------- */
.cu-hero{background:var(--paper-warm);aspect-ratio:1672/941;min-height:clamp(460px,60vh,640px);max-height:800px;display:flex;align-items:center;justify-content:center}
.cu-hero-img{position:absolute;inset:-2px;background-size:cover;background-position:var(--hero-pos,70% 50%);background-repeat:no-repeat;will-change:transform;filter:var(--hero-filter,none)}
.cu-hero-wash{position:absolute;inset:0;pointer-events:none}
.cu-hero--left .cu-hero-wash{background:linear-gradient(to right,rgba(250,248,244,.94) 0%,rgba(250,248,244,.6) 44%,rgba(250,248,244,0) 74%)}
.cu-hero--left.cu-wash-medium .cu-hero-wash{background:linear-gradient(to right,rgba(250,248,244,.97) 0%,rgba(250,248,244,.78) 52%,rgba(250,248,244,.2) 86%)}
.cu-hero--left.cu-wash-high .cu-hero-wash{background:linear-gradient(to right,rgba(250,248,244,.99) 0%,rgba(250,248,244,.9) 60%,rgba(250,248,244,.45) 100%)}
.cu-hero--center .cu-hero-wash{background:radial-gradient(ellipse 62% 78% at 50% 44%,rgba(250,248,244,.9) 0%,rgba(250,248,244,.5) 58%,rgba(250,248,244,0) 82%)}
.cu-hero--center.cu-wash-medium .cu-hero-wash{background:radial-gradient(ellipse 74% 90% at 50% 44%,rgba(250,248,244,.95) 0%,rgba(250,248,244,.7) 62%,rgba(250,248,244,.2) 92%)}
.cu-hero--center.cu-wash-high .cu-hero-wash{background:radial-gradient(ellipse 88% 104% at 50% 44%,rgba(250,248,244,.98) 0%,rgba(250,248,244,.85) 68%,rgba(250,248,244,.46) 100%)}
.cu-hero-copy{position:absolute;top:50%;left:0;transform:translateY(-50%);width:min(840px,100%);padding:0 clamp(24px,4vw,56px);text-align:left}
.cu-hero--center .cu-hero-copy{top:43%;left:50%;transform:translate(-50%,-50%);width:min(1160px,100%);padding:0 clamp(24px,4vw,64px);text-align:center}
.cu-hero--center .cu-sub{margin-left:auto;margin-right:auto;max-width:640px}
.cu-hero--center .cu-hero-meta{justify-content:center}
.cu-hero--center .cu-hero-cta{justify-content:center}
/* Literal, not tokens: the hero stays light in dark mode too. */
.cu-hero-copy .cu-h1 em,.cu-hero-split .cu-h1 em{display:block}
.cu-hero-copy .cu-h1{color:#1a1a1a}
.cu-hero-copy .cu-sub{color:#5a5a58}
.cu-hero-meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:26px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#5a5a58;font-weight:500}
.cu-hero-cta{display:flex;gap:16px;flex-wrap:wrap;margin-top:38px;align-items:center}
.cu-hero-split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,76px);align-items:center}
.cu-hero-split .cu-h1{font-size:clamp(34px,4vw,52px);line-height:1.06}
.cu-hero-split .cu-frame{aspect-ratio:4/5;max-height:76vh;--corner:clamp(110px,15vw,230px)}
.cu-hero-more{margin-top:38px}

/* ---------- organism: dark bands ---------- */
.cu-dark{background:var(--navy);color:var(--paper-ink)}
.cu-dark .cu-wrap{padding:clamp(56px,9vw,120px) var(--gut)}
.cu-dark .cu-eyebrow{letter-spacing:.36em;margin-bottom:30px}
.cu-dark .cu-h2{font-size:clamp(28px,3.8vw,52px);letter-spacing:-.012em;color:var(--paper-ink);max-width:900px}
.cu-dark .cu-h2 em{color:var(--accent-text)}
.cu-dark .cu-h3,.cu-dark .cu-card-title,.cu-dark .cu-row-t,.cu-dark .cu-stat-n,.cu-dark .cu-signoff-n,.cu-dark .cu-pull,.cu-dark .cu-pill-t{color:var(--paper-ink)}
.cu-dark .cu-p,.cu-dark .cu-lede,.cu-dark .cu-sub,.cu-dark .cu-card-desc,.cu-dark .cu-row-d,.cu-dark .cu-row-l{color:rgba(250,250,248,.74)}
.cu-dark .cu-meta,.cu-dark .cu-note,.cu-dark .cu-stat-l{color:rgba(250,250,248,.55)}
.cu-dark .cu-pill-d{color:rgba(250,250,248,.68)}
/* A navy band whose heading keeps the ordinary type scale: the kit enlarges it
   in the statement and the closing call, but not where a grid follows it. */
.cu-dark--plain .cu-h2{font-size:clamp(27px,3.2vw,42px);letter-spacing:-.01em;max-width:760px}
.cu-dark--plain .cu-h2 em{color:rgba(250,250,248,.75)}
.cu-dark--plain .cu-eyebrow{letter-spacing:.32em;margin-bottom:18px}
.cu-dark .cu-more-row{color:var(--paper-ink)}
.cu-dark .cu-more-line{background:rgba(250,250,248,.28)}
.cu-dark .cu-rule{background:var(--accent)}
.cu-dark .cu-stats,.cu-dark .cu-stat,.cu-dark .cu-grid,.cu-dark .cu-card,.cu-dark .cu-list,.cu-dark .cu-row,.cu-dark .cu-signoff{border-color:rgba(250,250,248,.16)}
.cu-dark .cu-card{background:transparent}
.cu-dark a.cu-card:hover{box-shadow:0 20px 46px rgba(0,0,0,.35);background:rgba(250,250,248,.03)}
.cu-dark .cu-frame{background:rgba(250,250,248,.06)}
.cu-statement-p{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);margin-top:clamp(32px,4vw,52px);border-top:1px solid rgba(250,250,248,.16);padding-top:clamp(26px,3vw,40px)}
.cu-statement-p .cu-p{font-size:15px;line-height:1.82;color:rgba(250,250,248,.74)}
.cu-statement--light .cu-statement-p{border-top-color:var(--border)}
.cu-statement--light .cu-statement-p .cu-p{color:var(--text-soft)}
/* The section's button is a cell of the same grid (.wf-bt-cell), so it sits
   beside the last paragraph rather than under it, and it has to read on navy. */
.cu-statement-p .cu-btn{justify-self:start;align-self:start;margin-top:4px}
.cu-statement-p .cu-btn--outline{border-color:rgba(250,250,248,.4);color:var(--paper-ink)}
.cu-statement-p .cu-btn--outline:hover{border-color:var(--paper-ink);background:rgba(250,250,248,.06)}
.cu-statement--light .cu-statement-p .cu-btn--outline{border-color:var(--border-strong);color:var(--text)}
.cu-statement--light .cu-statement-p .cu-btn--outline:hover{border-color:var(--text);background:var(--accent-soft)}
.cu-statement--light .cu-h2{font-size:clamp(28px,3.8vw,52px);max-width:900px}
.cu-cta-in{text-align:center;padding:clamp(16px,4vw,48px) 0}
.cu-cta-in .cu-eyebrow{margin-bottom:26px}
.cu-cta-in .cu-h2{font-size:clamp(28px,3.6vw,46px);line-height:1.18;max-width:720px;margin:0 auto 38px}
/* Vilagos az alap, a navy sav irja felul — igy a szekcionak nem kell extra osztaly. */
.cu-cta-in .cu-h2 em{color:var(--text-soft)}
.cu-dark .cu-cta-in .cu-h2 em{color:rgba(250,250,248,.75)}
/* The heading leaves 38px below it, which the kit's lede reclaims 16px of.
   Centred here, and a touch narrower and tighter than the generic lede. */
.cu-cta-in .cu-lede{text-align:center;max-width:640px;line-height:1.55;margin:-16px auto 34px}
.cu-xpg + .cu-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.cu-cta-in .cu-btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.cu-cta-in .cu-btn{padding:16px 40px}
.cu-cta-in .cu-meta{margin-bottom:22px;display:block}

/* ---------- organism: form ---------- */
.cu-form{border:1px solid var(--border);background:var(--panel);padding:clamp(28px,4vw,44px);margin-top:36px;max-width:760px}
.cu-form-f{display:flex;flex-direction:column;gap:22px}
.cu-form-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.cu-form .cu-submit{align-self:flex-start;margin-top:8px}

/* ---------- organism: gallery (Outlook art_slider) ---------- */
.cu-gallery-top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.cu-gallery-frame{position:relative;margin-top:38px;background:var(--paper-warm);border:1px solid var(--border);aspect-ratio:1.42/1;max-height:min(70vh,760px);margin-inline:auto;overflow:hidden}
.cu-dark .cu-gallery-frame{background:rgba(250,250,248,.05);border-color:rgba(250,250,248,.12)}
.cu-gallery-stage{position:absolute;inset:0;outline:none;touch-action:pan-y;cursor:grab}
.cu-slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:clamp(18px,3vw,40px);opacity:0;transition:opacity calc(.7s*var(--spd)) ease;pointer-events:none}
.cu-slide.on{opacity:1;pointer-events:auto}
.cu-slide img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.cu-gallery-bot{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:22px;border-top:1px solid var(--border);padding-top:18px}
.cu-dark .cu-gallery-bot{border-top-color:rgba(250,250,248,.16)}
.cu-gallery-texts{position:relative;min-height:44px;flex:1}
.cu-gallery-text{display:none}
.cu-gallery-text.on{display:block}
.cu-gallery-text .cu-h3{font-size:21px}
.cu-gallery-text .cu-meta{margin-top:6px}
.cu-gallery-ctl{display:flex;align-items:center;gap:18px}
.cu-gallery-count{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--text-soft);min-width:52px}
.cu-dark .cu-gallery-count{color:rgba(250,250,248,.6)}
.cu-dots{display:flex;gap:8px}
.cu-dot{width:7px;height:7px;border-radius:50%;background:var(--border-strong);border:none;padding:0;cursor:pointer;transition:background .25s,transform .25s}
.cu-dot.on{background:var(--accent);transform:scale(1.25)}
.cu-dark .cu-dot{background:rgba(250,250,248,.3)}
.cu-dark .cu-dot.on{background:var(--accent)}
.cu-gallery-btn{background:transparent;border:1px solid var(--border-strong);color:var(--text-soft);width:38px;height:38px;border-radius:50%;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:border-color .25s,color .25s}
.cu-gallery-btn:hover{border-color:var(--text);color:var(--text)}
.cu-dark .cu-gallery-btn{border-color:rgba(250,250,248,.28);color:rgba(250,250,248,.82)}
.cu-dark .cu-gallery-btn:hover{border-color:var(--paper-ink);color:var(--paper-ink)}
.cu-gallery-btn .cu-ic-play,.cu-gallery-btn.paused .cu-ic-pause{display:none}
.cu-gallery-btn.paused .cu-ic-play{display:block}

/* ---------- organism: authors ---------- */
.cu-authors{display:grid;grid-template-columns:repeat(var(--cols,3),1fr);gap:clamp(24px,3vw,40px);margin-top:36px;--ph:120px}
.cu-authors--more{--ph:84px;margin-top:28px}
.cu-authors-l{margin-top:44px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-mute);font-weight:600;padding-bottom:14px;border-bottom:1px solid var(--border)}
.cu-author{text-align:center}
.cu-author-ph{width:var(--ph);height:var(--ph);border-radius:50%;overflow:hidden;margin:0 auto 18px;background:var(--paper-warm);border:1px solid var(--border-strong);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:calc(var(--ph)*.34);color:var(--text-mute)}
.cu-author-ph img{width:100%;height:100%;object-fit:cover}
.cu-author-n{font-family:var(--serif);font-size:21px;line-height:1.2;color:var(--text)}
.cu-authors--more .cu-author-n{font-size:18px}
.cu-author-r{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);font-weight:500;margin-top:8px;line-height:1.6}

/* ---------- organism: donut and table ---------- */
.cu-donut{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:clamp(32px,5vw,72px);align-items:center;margin-top:40px}
.cu-donut-ring{position:relative}
.cu-donut-ring svg{width:100%;height:auto;display:block;transform:rotate(-90deg)}
.cu-donut-mid{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.cu-donut-mid .y{font-family:var(--serif);font-weight:300;font-size:clamp(32px,3.4vw,44px);line-height:1;color:var(--text)}
.cu-donut-mid .l{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mute);font-weight:500;margin-top:8px}
.cu-legend{list-style:none;border-top:1px solid var(--border)}
.cu-legend li{display:grid;grid-template-columns:18px 1fr auto;gap:16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--border);font-size:14px;color:var(--text-soft)}
.cu-legend .sw{width:10px;height:10px;display:inline-block;transform:translateY(-1px)}
.cu-legend .pc{font-family:var(--serif);font-size:24px;line-height:1;color:var(--text)}
.cu-legend .pc em{font-style:italic;color:var(--accent-text)}
.cu-table{width:100%;border-collapse:collapse;margin-top:40px;border-top:1px solid var(--border)}
.cu-table th{text-align:left;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);font-weight:500;padding:14px 18px 14px 0;border-bottom:1px solid var(--border)}
.cu-table td{padding:18px 18px 18px 0;border-bottom:1px solid var(--border);font-size:14px;color:var(--text-soft);vertical-align:baseline}
.cu-table td.fig{font-family:var(--serif);font-size:21px;color:var(--text)}
.cu-table td.acc{color:var(--accent-text);font-weight:500}

/* ---------- organism: footer ---------- */
.cu-footer{background:var(--bg-soft);border-top:1px solid var(--border)}
.cu-footer-in{max-width:var(--maxw);margin:0 auto;padding:clamp(48px,6vw,72px) var(--gut) clamp(30px,3.6vw,44px)}
.cu-footer-top{display:grid;grid-template-columns:minmax(200px,.9fr) 3fr;gap:48px}
.cu-footer-top--solo{grid-template-columns:1fr;gap:18px}
.cu-footer-brand img{height:22px;width:auto;margin-bottom:18px}
.cu-footer-tag{font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.55;color:var(--text-soft);max-width:280px}
.cu-footer-tag span{display:block}
.cu-footer-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:32px 40px}
.cu-footer-cols h2{font-family:var(--sans);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text);font-weight:600;margin-bottom:16px}
.cu-footer-cols a{display:block;font-size:13px;color:var(--text-soft);margin-bottom:9px;transition:color .2s}
.cu-footer-cols a:hover{color:var(--accent-text)}
.cu-footer-bot{margin-top:48px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--text-mute)}
.cu-footer-bot span{display:flex;gap:22px;flex-wrap:wrap}
.cu-footer-bot a:hover{color:var(--text)}
.cu-gband{background:var(--navy)}
[data-theme="dark"] .cu-gband{background:var(--navy-deep);border-top:1px solid rgba(241,142,0,.3)}
.cu-gband-in{max-width:var(--maxw);margin:0 auto;padding:clamp(28px,3.4vw,38px) var(--gut);text-align:center}
.cu-glabel{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(250,250,248,.5);font-weight:600;margin-bottom:20px}
.cu-grow{display:flex;align-items:center;justify-content:center;gap:clamp(24px,4vw,56px);flex-wrap:wrap}
.cu-grow a{display:block;opacity:.84;transition:opacity var(--bt-dur) var(--ease)}
.cu-grow a:hover{opacity:1}
.cu-grow img{height:var(--logo-h);width:auto;display:block}
.cu-social{margin-top:20px}
.cu-social ul{list-style:none;display:flex;flex-wrap:wrap;gap:4px;margin-left:-9px}
.cu-social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;color:var(--text-soft)}
.cu-social a:hover,.cu-social a:focus-visible{color:var(--accent-text)}
.cu-social svg{display:block;width:18px;height:18px}

/* ---------- reveal ---------- */
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}



/* ---------- responsive ---------- */
/* Compressed header: nav and buttons draw in before the burger takes over. */
@media (min-width:980px) and (max-width:1199px){
  .cu-header-in{padding-left:24px;padding-right:24px;gap:16px}
  .cu-nav{gap:16px}
  .cu-nav button.cu-nav-l{font-size:12.5px}
  .cu-header-r{gap:8px}
  .cu-header-r .cu-hbtn{padding-left:14px;padding-right:14px}
}
@media (max-width:1199px){.cu-grid--4,.cu-xpg{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1099px){.cu-grid--4,.cu-xpg{grid-template-columns:repeat(2,1fr)}.cu-pillars{grid-template-columns:repeat(2,1fr)}.cu-footer-cols{grid-template-columns:repeat(2,1fr)}.cu-grid--feat{grid-template-columns:1fr 1fr}.cu-grid--feat .cu-card--img{grid-column:1/-1}.cu-mega-cols{grid-template-columns:1fr}}
@media (max-width:980px){
  .cu-nav,.cu-header-r .cu-hbtn,.cu-topbar-r .cu-topbar-ctl{display:none}
  .cu-burger{display:flex}
  .cu-header-ctl{display:inline-flex}
  .cu-grid--3{grid-template-columns:repeat(2,1fr)}
  .cu-hero-split{grid-template-columns:1fr}
  .cu-hero-split .cu-frame{aspect-ratio:4/3;max-height:none}
  .cu-cols--img{grid-template-columns:1fr}
  .cu-text .cu-cols--img .cu-frame{max-height:none}
  .cu-faqwrap.cu-faq--img{grid-template-columns:1fr}
  .cu-rows-img{grid-template-columns:1fr}
  .cu-rows-pic{position:static}
  .cu-donut{grid-template-columns:1fr}
  .cu-footer-top{grid-template-columns:1fr}
  .cu-authors{--cols:3!important}
  .cu-authors--more{--cols:3!important}
}
@media (max-width:760px){
  .cu-grid--2,.cu-grid--3,.cu-grid--4,.cu-grid--feat{grid-template-columns:1fr}
  .cu-cols--2,.cu-statement-p,.cu-form-2{grid-template-columns:1fr}
  .cu-pillars{grid-template-columns:1fr}
  .cu-row{grid-template-columns:48px 1fr;gap:20px}
  .cu-row-end{grid-column:2}
  .cu-hero{aspect-ratio:auto;min-height:0;max-height:none;padding:clamp(44px,8vw,72px) 0}
  .cu-hero-copy,.cu-hero--center .cu-hero-copy{position:relative;top:auto;left:auto;transform:none;width:100%;padding:0 var(--gut)}
  .cu-hero--left .cu-hero-wash,.cu-hero--left.cu-wash-medium .cu-hero-wash,.cu-hero--left.cu-wash-high .cu-hero-wash{background:linear-gradient(to bottom,rgba(250,248,244,.97) 0%,rgba(250,248,244,.92) 60%,rgba(250,248,244,.6) 100%)}
  .cu-hero--center .cu-hero-wash{background:rgba(250,248,244,.9)}
  .cu-footer-legal{columns:1}
  .cu-authors{--cols:2!important}
  .cu-table{display:block;overflow-x:auto}
  .cu-gallery-frame{aspect-ratio:1.2/1}
}
@media (max-width:599px){.cu-social ul{margin-left:-13px}.cu-social a{width:44px;height:44px}}
@media (max-width:560px){.cu-authors,.cu-authors--more{--cols:1!important}.cu-stat{padding:26px 20px 24px}}

/* ---------- print ---------- */
@media print{.cu-header,.cu-topbar,.cu-mobile,.cu-gband{display:none}}

/* ============================================================
   The rest of the site's organisms
   ============================================================ */
/* the 1500 band the image sections escape into */
/* --vw100 is what the accessibility panel's zoom sets, since 100vw then lies. */
.cu-wide{width:min(1500px,var(--vw100,100vw));margin-left:calc(50% - .5*min(1500px,var(--vw100,100vw)));padding:0 var(--gut)}
/* head: the opener without an image */
.cu-pagehead{max-width:840px}
.cu-pagehead .cu-eyebrow{margin-bottom:22px}
.cu-pagehead .cu-h1{font-size:clamp(32px,4.4vw,56px);letter-spacing:-.012em}
.cu-pagehead .cu-h1 em{color:var(--text-soft)}
.cu-pagehead .cu-lede{font-size:clamp(18px,2vw,23px);max-width:680px;margin-top:24px}
/* statement */
.cu-principle{padding:clamp(24px,5vw,64px) 0;font-family:var(--serif);font-weight:400;font-size:clamp(28px,4vw,50px);line-height:1.28;letter-spacing:-.01em;color:var(--text);max-width:1040px}
.cu-principle em{font-style:italic;color:var(--accent-text)}
/* split spot: image plus navy box */
.cu-spot{display:grid;grid-template-columns:1.1fr 1fr}
.cu-spot--right{grid-template-columns:1fr 1.1fr}
.cu-spot--right .cu-spot-img{order:1}
.cu-spot-cta{margin-top:32px}
/* No border-radius here: the corner comes from the .cu-corner--* class the
   block sets, which a rule of equal specificity further down would override. */
.cu-spot-img{position:relative;min-height:clamp(300px,46vh,560px);overflow:hidden}
.cu-spot-img .cu-zoom{position:absolute;inset:-2px;background-size:cover;background-position:50% 50%}
.cu-spot-box{background:var(--navy);color:var(--paper-ink);padding:clamp(34px,4.5vw,72px);display:flex;flex-direction:column;justify-content:center}
.cu-spot-box .cu-eyebrow{letter-spacing:.36em;margin-bottom:22px}
.cu-spot-box .cu-h2{font-size:clamp(28px,3.4vw,46px);line-height:1.12;color:var(--paper-ink);max-width:none}
.cu-spot-box .cu-h2 em{color:var(--accent-text)}
.cu-spot-box .cu-p{color:rgba(250,250,248,.74);margin-top:20px;max-width:460px}
.cu-spot-box .cu-p--strong{color:var(--paper-ink);font-weight:600;margin:0}
.cu-spot-box .cu-btn{margin-top:32px;align-self:flex-start;padding:15px 34px}
.cu-spot-box .cu-sub-h{font-size:11.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:rgba(250,250,248,.55);margin-bottom:10px}
.cu-spot-box .cu-block{margin-top:26px;padding-top:22px;border-top:1px solid rgba(250,250,248,.16);font-size:calc(15px*var(--fs));line-height:1.75;color:rgba(250,250,248,.78)}
/* band: photo strip with a fixed background */
.cu-band{min-height:clamp(480px,70vh,740px);display:flex;align-items:center;background-size:cover;background-position:50% 50%;background-attachment:fixed}
@supports (-webkit-touch-callout:none){.cu-band{background-attachment:scroll}}
.cu-band-box{position:relative;z-index:2;width:min(620px,100% - 40px);background:rgba(24,32,46,.72);backdrop-filter:blur(7px);border:1px solid rgba(250,250,248,.16);padding:clamp(30px,4vw,56px);margin:clamp(44px,6vw,92px) auto;text-align:center;color:var(--paper-ink)}
.cu-band-box .cu-eyebrow{letter-spacing:.36em;margin-bottom:22px}
.cu-band-box .cu-h2{font-size:clamp(28px,3.6vw,48px);color:var(--paper-ink);max-width:none}
.cu-band-box .cu-h2 em{color:var(--accent-text)}
.cu-band-box .cu-p{color:rgba(250,250,248,.8);margin:18px auto 0;max-width:440px}
.cu-band-box .cu-btn{margin-top:30px}
/* sections with an image beside them (cards, rows, FAQ) */
.cu-side{display:grid;grid-template-columns:.85fr 1.35fr;gap:clamp(30px,5vw,70px);align-items:start}
.cu-side--r{grid-template-columns:1.55fr .85fr}
.cu-side-img{position:sticky;top:96px}
.cu-side-img .cu-frame{aspect-ratio:3/4;border-radius:0 0 0 clamp(80px,10vw,160px)}
.cu-side--r .cu-side-img .cu-frame{border-radius:0 clamp(80px,10vw,160px) 0 0}
.cu-side .cu-list{margin-top:34px}
.cu-side .cu-row{grid-template-columns:48px 1fr;gap:20px;padding:22px 14px;margin:0 -14px}
.cu-side .cu-row .cu-num{font-size:19px}
.cu-side .cu-lede{font-size:calc(clamp(17px,1.9vw,20px)*var(--fs));line-height:1.6;margin-top:16px}
.cu-side .cu-faq{margin-top:36px;max-width:none}
/* image card grid (image plus 2x2) */
.cu-cardsimg{display:grid;grid-template-columns:1fr 2.3fr;border-top:1px solid var(--border);border-left:1px solid var(--border);margin-top:42px}
.cu-cardsimg .cu-frame{min-height:100%;border-right:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--paper-warm)}
.cu-cardsimg .cu-grid{border:none;margin:0;grid-template-columns:repeat(2,1fr)}
.cu-cardsimg .cu-card{padding:30px 26px 28px;min-height:200px}
.cu-cardsimg .cu-card-title{font-size:21px;margin:20px 0 10px}
.cu-cardsimg .cu-card-desc{font-size:max(var(--fs-c),calc(12.5px*var(--fs)));line-height:1.6}
/* slider */
.cu-rail-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.cu-rail-hint{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-mute);padding-bottom:8px;white-space:nowrap}
.cu-rail-hint .cu-arw{color:var(--accent-text)}
.cu-rail{display:flex;gap:1px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;background:var(--border);border:1px solid var(--border);margin-top:38px}
.cu-rail::-webkit-scrollbar{height:5px}.cu-rail::-webkit-scrollbar-track{background:transparent}.cu-rail::-webkit-scrollbar-thumb{background:var(--border-strong)}
.cu-rail>.cu-card{scroll-snap-align:start;flex:0 0 min(360px,82vw);border:none;padding:34px 30px 30px;min-height:280px}
.cu-rail>.cu-card .cu-card-meta{margin-bottom:0}
.cu-rail>.cu-card .cu-card-title{margin:22px 0 12px}
.cu-rail>.cu-card .cu-card-desc{margin-bottom:auto}
.cu-rail>.cu-card .cu-arw{margin-top:22px;font-size:14px}
/* dokumentumlista */
.cu-docs{border-top:1px solid var(--border);margin-top:36px;max-width:760px}
.cu-doc{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:20px 0;border-bottom:1px solid var(--border);cursor:pointer}
.cu-doc>:first-child{transition:transform var(--dur) var(--ease)}
.cu-doc:hover>:first-child{transform:translateX(10px)}
.cu-doc-n{display:flex;flex-direction:column;gap:6px}
.cu-doc-n>span:first-child{font-size:15px;color:var(--text)}
.cu-doc .cu-tag{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text);border:1px solid var(--accent-line);padding:5px 10px;flex-shrink:0}
/* sitemap */
.cu-sitemap{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:clamp(30px,4vw,56px) clamp(28px,3.4vw,48px);margin-top:36px}
.cu-smh{display:inline-block;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent-text);font-weight:600;padding-bottom:12px}
.cu-smh:hover{text-decoration:underline;text-underline-offset:3px}
.cu-sml{border-top:1px solid var(--border)}
.cu-smi{display:flex;align-items:baseline;gap:10px;padding:10px 0;border-bottom:1px solid var(--border);font-size:13.5px;color:var(--text-soft);transition:color .3s,padding-left .35s var(--ease)}
.cu-smi.sub{padding-left:16px;font-size:12.5px}
.cu-smi .cu-arw{font-size:13px;opacity:0;transform:translateX(-6px);transition:opacity .35s,transform .4s var(--ease)}
.cu-smi:hover{color:var(--accent-text)}.cu-smi:hover .cu-arw{opacity:1;transform:none}
/* contact: phone list, press, suggestion */
/* Elerhetosegek. A v2 ket hasabba szedte; a v3 egy hasab, 860 px-ig, es a
   soron belul a megnevezes es az ertek all szemben egymassal. */
.cu-tel{border-top:1px solid var(--border);margin-top:clamp(26px,3.5vw,44px);max-width:860px}
.cu-tel-i{padding:16px 0;border-bottom:1px solid var(--border)}
.cu-tel-h{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:nowrap}
.cu-tel-t{font-size:max(var(--fs-p),calc(15px*var(--fs)));font-weight:600;color:var(--text)}
.cu-tel-v{text-align:right;white-space:nowrap;font-size:max(var(--fs-p),calc(15px*var(--fs)))}
.cu-tel-a{color:var(--accent-text);text-decoration:none}
.cu-tel-x{color:var(--text-soft)}
.cu-tel-d{font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:1.7;color:var(--text-soft);max-width:640px;margin-top:6px}
.cu-sub-h{font-size:11.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--text);margin:26px 0 10px}
.cu-soft{background:var(--bg-soft)}
/* Sajtokapcsolat. A v2 egy osszefuggo keretes racsot irt le; a v3-ban minden
   nevjegy onallo panel, es a nevjegy maga a Szakerto molekula. */
.cu-press-band{background:var(--bg-soft)}
.cu-press-band>.cu-wrap{padding:clamp(48px,6vw,92px) var(--gut)}
.cu-press{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,28px);margin-top:38px}
.cu-press .cu-xp{display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:center;text-align:left;background:var(--panel);border:1px solid var(--border);padding:28px 28px 30px;font-size:max(var(--fs-p),calc(15px*var(--fs)));line-height:1.75;color:var(--text-soft)}
.cu-press .cu-xp .cu-arc{width:150px;max-width:150px;margin:0}
.cu-press .cu-xp-n{font-size:clamp(22px,2.2vw,26px)}
.cu-press .cu-xp-r{margin-bottom:14px}
.cu-press .cu-xp-m{font-size:inherit;line-height:inherit;color:inherit;margin-top:0}
.cu-press .cu-xp a{color:var(--accent-text);text-decoration:none}
.cu-jav{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,80px);align-items:start}
.cu-jav .cu-h2{max-width:none}
/* A v2 nagy szerifes cimkent hozta az e-mailt; a v3 egyszeru narancs
   hivatkozas 19 px-en, sajat bekezdesben. */
/* Terkep es iroda. A sav teljes szelessegu, a terkeprajz a tema sajat
   assetje; relativ URL-lel hivatkozunk ra, ezert nem kell hozza PHP. */
.cu-map{display:grid;grid-template-columns:1.15fr 1fr;width:min(1500px,var(--vw100,100vw));margin-left:calc(50% - min(1500px,var(--vw100,100vw))/2);padding:0 clamp(20px,5vw,64px)}
.cu-map-pic{position:relative;min-height:clamp(320px,52vh,560px);overflow:hidden;background:#faf8f4 url("map-office.svg") center/cover no-repeat}
.cu-map-box{background:var(--navy);padding:clamp(34px,4.4vw,66px);display:flex;flex-direction:column;justify-content:center}
.cu-map-box .cu-eyebrow{letter-spacing:.36em;margin-bottom:22px}
.cu-map-box .cu-h2{font-size:clamp(28px,3.4vw,46px);line-height:1.12;max-width:none}
.cu-map-box .cu-h2 em{color:var(--accent-text)}
.cu-map-addr{margin-top:20px;font-size:max(var(--fs-p),calc(15px*var(--fs)));line-height:1.75;color:rgba(250,250,248,.78)}
.cu-map-co{color:var(--paper-ink);font-weight:600}
.cu-map-cta{margin-top:28px}
/* A kit peldanyonkent meretezi a gombokat: a textImg korvonalas gombja
   12/13-28, ez 12.5/15-32, a heroe a 13/16-36 alapmeret. */
.cu-map-cta .cu-btn{font-size:12.5px;padding:15px 32px}
/* Impresszum. Ket hasab, hasabonkent felso vonallal es ritkitott fejleccel. */
.cu-impr{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);margin-top:clamp(30px,4vw,52px)}
.cu-impr-col{border-top:1px solid var(--border);padding-top:22px}
.cu-impr-h{font-size:11.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--text);margin-bottom:14px}
.cu-impr-i{margin-bottom:22px}
.cu-impr-i:last-child{margin-bottom:0}
.cu-impr-n{font-size:max(var(--fs-p),calc(16px*var(--fs)));font-weight:600;color:var(--text);line-height:1.6}
.cu-impr-l{font-size:max(var(--fs-p),calc(15px*var(--fs)));line-height:1.7;color:var(--text-soft)}
.cu-impr-l a{color:var(--accent-text);text-decoration:none}
.cu-jav-m{margin-top:14px;font-size:19px}
.cu-mail{color:var(--accent-text);text-decoration:none}
/* steps, icon band, video */
/* Szakertok: nev, szerep, elerhetoseg az iv-portre alatt. */
.cu-xp{display:flex;flex-direction:column;min-width:0}
.cu-xp-n{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.2;color:var(--text)}
.cu-xp-r{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);font-weight:500;margin-top:8px;line-height:1.6}
.cu-xp-m{font-size:12px;line-height:1.6;color:var(--text-soft);margin-top:9px;overflow-wrap:anywhere}
.cu-xp-m a{text-decoration:underline;text-underline-offset:2px}
.cu-xp .cu-arc{margin-bottom:18px}
.cu-xp-b{font-size:max(var(--fs-p),calc(14px*var(--fs)));line-height:1.75;color:var(--text-soft);margin-top:18px;max-width:640px}
/* The kit gives experts three containers: a bordered card grid, a single
   highlighted panel, and a list that carries the full bio beside the portrait. */
.cu-xpg--txt{gap:0;border-top:1px solid var(--border);border-left:1px solid var(--border);margin-top:28px}
.cu-xpg--txt .cu-xp{border-right:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--panel);padding:clamp(20px,2.4vw,28px) clamp(18px,2vw,26px) clamp(22px,2.6vw,30px)}
.cu-xpg--one{display:block}
.cu-xpg--one .cu-xp{display:grid;grid-template-columns:320px 1fr;gap:clamp(28px,4vw,56px);align-items:center;margin-top:40px;max-width:920px;padding:clamp(28px,4vw,44px);background:var(--panel);border:1px solid var(--border)}
.cu-xpg--one .cu-xp .cu-arc{margin-bottom:0;max-width:320px}
.cu-xpg--one .cu-xp-n{font-size:clamp(26px,2.8vw,34px)}
.cu-xpg--one .cu-xp-m{font-size:13px}
.cu-xpg--list{display:block}
.cu-xpg--list .cu-xp{display:grid;grid-template-columns:340px 1fr;gap:clamp(24px,5vw,72px);align-items:end;padding:clamp(28px,4vw,48px) 0;border-bottom:1px solid var(--border)}
.cu-xpg--list .cu-xp .cu-arc{margin-bottom:0;max-width:340px}
.cu-xpg--list .cu-xp-n{font-size:clamp(28px,3.2vw,40px)}
.cu-xpg--list .cu-xp-r{margin-top:10px}
/* Szerzok. Az iv-portre a kit .wf-arc-ja; a nevsor es a sajat oldal fejresze a
   blog-csalad bl-* osztalyaibol jon, amelyek a proto.css-ben valoban megvannak.
   A .cu-zoom-nak nincs onallo szabalya, ezert a dobozt a tartoja adja neki. */
.cu-arc{position:relative;overflow:hidden;width:100%;aspect-ratio:4/5;border-top-right-radius:30% 24%;background:color-mix(in srgb,var(--text) 6%,var(--bg-soft));display:flex;align-items:center;justify-content:center;container-type:inline-size}
.cu-arc .cu-zoom{position:absolute;inset:0;background-size:cover;background-position:50% 50%}
/* What the arc holds when there is no photo. v32-22 dropped the monogram for
   this masked stroke, so a photo-less author shows no letter. */
.cu-arc-pat{position:absolute;inset:0;background:color-mix(in srgb,var(--text) 16%, transparent);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20100%20125%22%20preserveAspectRatio%3D%22xMaxYMin%20slice%22%3E%3Ccircle%20cx%3D%2270%22%20cy%3D%2230%22%20r%3D%2258%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%220.9%22/%3E%3C/svg%3E") top right / cover no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20100%20125%22%20preserveAspectRatio%3D%22xMaxYMin%20slice%22%3E%3Ccircle%20cx%3D%2270%22%20cy%3D%2230%22%20r%3D%2258%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%220.9%22/%3E%3C/svg%3E") top right / cover no-repeat}
.cu-au-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 32px}
.cu-au-card{display:grid;grid-template-columns:104px 1fr;gap:20px;align-items:center;padding:22px 0;border-top:1px solid var(--border)}
.cu-au-n{font-family:var(--serif);font-size:22px;line-height:1.2;color:var(--text);transition:color var(--dur) var(--ease)}
.cu-au-card:hover .cu-au-n{color:var(--accent-text)}
.cu-bl-meta{font-size:12.5px;line-height:1.6;color:var(--text-mute)}
.cu-bl-meta b{font-weight:600;color:var(--text-soft)}
.cu-au-head{display:grid;grid-template-columns:minmax(200px,280px) 1fr;gap:clamp(28px,4vw,48px);align-items:end}
.cu-au-eb{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--accent-text);font-weight:500}
.cu-au-h1{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.4vw,56px);line-height:1.06;letter-spacing:-.015em;color:var(--text);text-wrap:balance;overflow-wrap:break-word;hyphens:auto;margin-top:12px}
.cu-au-role{font-size:max(var(--fs-p),calc(15px*var(--fs)));line-height:1.6;color:var(--text-soft);margin-top:12px}
.cu-au-spec{margin-top:6px}
/* The blog family's own breakpoint, not the theme's: these classes come from it. */
@media (max-width:640px){.cu-au-head{grid-template-columns:1fr}.cu-au-head .cu-arc{max-width:260px}}

/* The announcement archive: one scroll, a section per year, months inside it.
   The year selector is the header's sub-bar (.cu-subnav), so a heading has to
   clear both bars when an anchor jumps to it. */
.cu-ka{max-width:860px}
.cu-ka-y+.cu-ka-y{margin-top:clamp(48px,6vw,80px)}
.cu-ka-yt{display:flex;align-items:baseline;flex-wrap:wrap;gap:16px;font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.6vw,46px);line-height:1.1;color:var(--text);padding-bottom:6px;border-bottom:1px solid var(--border-strong);outline:none;scroll-margin-top:calc(var(--hdr) + 72px)}
.cu-ka-yn{font-family:var(--sans);font-size:13px;letter-spacing:.04em;color:var(--text-soft)}
.cu-ka-m{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--accent-text);font-weight:500;padding:16px 0 10px;margin-top:22px;border-bottom:1px solid var(--border)}
.cu-ka-l{list-style:none}

.cu-ann{padding:22px 0;border-bottom:1px solid var(--border)}
.cu-ann-d{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--accent-text);margin-bottom:8px}
.cu-ann-f{margin:6px 0 10px}
/* Without a document the kit opens no box; the editor still needs the slot. */
.cu-ann-f:empty{display:none}
/* The same download row as the document library, tighter and topped inside an
   announcement — the kit sets the geometry per context, not per class. */
.cu-ann-f .cu-doc{padding:12px 0;border-top:1px solid var(--border);border-bottom:0}
.cu-ann-f .cu-doc-n>span:first-child{font-size:14px}

.cu-steps{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--border);border-left:1px solid var(--border);margin-top:42px}
.cu-step{background:var(--panel);border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:30px 28px 32px;display:flex;flex-direction:column}
.cu-step-h{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
.cu-step-ic{width:38px;height:38px;background-size:contain;background-position:center;background-repeat:no-repeat;opacity:.85}
[data-theme="dark"] .cu-step-ic{filter:invert(1) hue-rotate(180deg);opacity:.7}
.cu-step-t{font-family:var(--serif);font-size:21px;line-height:1.22;color:var(--text);margin-bottom:14px}
.cu-step-d{font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:1.62;color:var(--text-soft);margin-bottom:8px}
.cu-step-l{display:block;margin-top:14px;font-size:calc(12.5px*var(--fs));line-height:1.6;color:var(--accent);text-decoration:none}
.cu-step-l:hover{text-decoration:underline}
.cu-step-li{display:grid;grid-template-columns:14px 1fr;gap:10px;font-size:max(var(--fs-c),calc(13px*var(--fs)));line-height:1.62;color:var(--text-soft);margin-bottom:8px}
.cu-step-li span:first-child{color:var(--accent-text)}
.cu-icons{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border);border-left:1px solid var(--border);margin-top:42px}
.cu-icons .cu-card-ic{width:40px;height:40px;background-size:contain;background-position:center;background-repeat:no-repeat;margin-bottom:auto}
[data-theme="dark"] .cu-card-ic{filter:invert(1) hue-rotate(180deg)}
.cu-video{width:100%;position:relative;overflow:hidden;background:var(--navy);display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;margin-top:34px}
.cu-video .cu-hero-img{background-position:50% 50%}
.cu-play{position:relative;z-index:2;cursor:pointer;width:clamp(54px,5vw,72px);height:clamp(54px,5vw,72px);border-radius:50%;border:1px solid rgba(250,250,248,.55);background:rgba(24,32,46,.42);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;transition:transform .3s,background .3s}
.cu-play:hover{transform:scale(1.06);background:rgba(24,32,46,.6)}
.cu-play span{display:block;width:0;height:0;margin-left:5px;border-top:11px solid transparent;border-bottom:11px solid transparent;border-left:18px solid var(--paper-ink)}
.cu-video-h{text-align:center;max-width:840px;margin:0 auto}
.cu-video-h .cu-h2 em{color:var(--accent-text)}
/* spectrum (service levels) */
/* The spectrum arc. The prototype is the measure (output/index.html, .wf-sp*):
   five points on a log scale, the orange arc running up to the selected one,
   the captions above and below the dot. The v2 kit's three-point, filter-chip
   version is obsolete; nothing renders .cu-spfrm any more, but the kit's own
   stylesheet still carries it. */
.cu-spfrm{display:flex;gap:24px;flex-wrap:wrap;margin-top:34px}
.cu-spfrm button{background:transparent;border:none;border-bottom:1px solid transparent;cursor:pointer;font-family:var(--sans);font-size:12px;letter-spacing:.04em;color:var(--text-soft);padding:6px 2px;transition:color .3s,border-color .3s}
.cu-spfrm button:hover{color:var(--accent-text)}
.cu-spfrm button.on{color:var(--text);border-bottom-color:var(--accent-text)}
.cu-sparc{position:relative;margin-top:18px;padding:30px 0 44px}
.cu-sparc-in{position:relative;touch-action:pan-y;cursor:pointer;outline:none;border-radius:6px}
.cu-sparc-in:focus-visible{box-shadow:0 0 0 2px var(--accent)}
.cu-sparc-in svg{display:block;width:100%;height:auto}
.cu-spink{transition:stroke-dasharray .6s var(--ease)}
.cu-spt{position:absolute;display:flex;align-items:center;justify-content:center;width:44px;height:44px;transform:translate(-50%,-50%);background:transparent;border:none;cursor:pointer;text-align:center;font-family:var(--sans);padding:0}
.cu-spdot{display:block;width:22px;height:22px;border-radius:50%;background:var(--bg-soft);border:1.5px solid var(--border-strong);position:relative;margin:0 auto;transition:border-color var(--dur) var(--ease)}
.cu-spdot::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:var(--text-mute);transform:translate(-50%,-50%);transition:background-color var(--dur) var(--ease)}
.cu-spamt{position:absolute;left:50%;bottom:100%;transform:translateX(-50%);display:block;font-family:var(--sans);font-style:normal;font-size:clamp(11px,1.2vw,13px);line-height:1.2;color:var(--text-soft);margin-bottom:2px;padding:0 4px;white-space:nowrap;transition:color var(--dur) var(--ease)}
.cu-splbl{position:absolute;left:50%;top:100%;transform:translateX(-50%);display:block;font-size:clamp(10px,1.1vw,12px);line-height:1.3;color:var(--text);margin-top:4px;padding:3px 6px;width:max-content;max-width:min(120px,10.4vw);text-align:center;transition:color var(--dur) var(--ease)}
.cu-spt:hover .cu-spdot{border-color:var(--accent-text)}
/* The selected point. One source of truth: `data-on` on the arc against
   `data-point` on the buttons, so the server draws the selection too and two
   points cannot both be selected. That is why these rules list five selectors
   each instead of a plain `.on` class — which stays supported, because the
   script sets it as well. */
.cu-sparc-in[data-on="1"] .cu-spt[data-point="1"] .cu-spdot,
.cu-sparc-in[data-on="2"] .cu-spt[data-point="2"] .cu-spdot,
.cu-sparc-in[data-on="3"] .cu-spt[data-point="3"] .cu-spdot,
.cu-sparc-in[data-on="4"] .cu-spt[data-point="4"] .cu-spdot,
.cu-sparc-in[data-on="5"] .cu-spt[data-point="5"] .cu-spdot,
.cu-spt.on .cu-spdot{border-color:var(--accent-text)}
.cu-sparc-in[data-on="1"] .cu-spt[data-point="1"] .cu-spdot::after,
.cu-sparc-in[data-on="2"] .cu-spt[data-point="2"] .cu-spdot::after,
.cu-sparc-in[data-on="3"] .cu-spt[data-point="3"] .cu-spdot::after,
.cu-sparc-in[data-on="4"] .cu-spt[data-point="4"] .cu-spdot::after,
.cu-sparc-in[data-on="5"] .cu-spt[data-point="5"] .cu-spdot::after,
.cu-spt.on .cu-spdot::after{background:var(--accent)}
.cu-sparc-in[data-on="1"] .cu-spt[data-point="1"] .cu-spamt,
.cu-sparc-in[data-on="2"] .cu-spt[data-point="2"] .cu-spamt,
.cu-sparc-in[data-on="3"] .cu-spt[data-point="3"] .cu-spamt,
.cu-sparc-in[data-on="4"] .cu-spt[data-point="4"] .cu-spamt,
.cu-sparc-in[data-on="5"] .cu-spt[data-point="5"] .cu-spamt,
.cu-spt.on .cu-spamt{color:var(--text);font-weight:600}
.cu-sparc-in[data-on="1"] .cu-spt[data-point="1"] .cu-splbl,
.cu-sparc-in[data-on="2"] .cu-spt[data-point="2"] .cu-splbl,
.cu-sparc-in[data-on="3"] .cu-spt[data-point="3"] .cu-splbl,
.cu-sparc-in[data-on="4"] .cu-spt[data-point="4"] .cu-splbl,
.cu-sparc-in[data-on="5"] .cu-spt[data-point="5"] .cu-splbl,
.cu-spt.on .cu-splbl{font-weight:600}
/* Below 720px the captions under the dots do not fit (the 0 Ft, 5 M and 20 M
   bands sit close together), so the amounts alternate above and below. */
@media (max-width:719px){
.cu-sparc{padding:26px 0 30px}
.cu-splbl{display:none}
.cu-spamt{font-size:11px}
.cu-spt.alt .cu-spamt{bottom:auto;top:100%;margin:2px 0 0}
}
/* One band's cards at a time; card order is point order. Without JavaScript
   the selected band's cards show and the rest stay in the DOM. */
/* Filtered by the card's own point, not by its position: a level may hold
   more than one card -- Premium Banking holds two -- and nth-child cannot
   count a group whose size varies. */
.cu-spcards[data-on="1"]>:not([data-point="1"]),
.cu-spcards[data-on="2"]>:not([data-point="2"]),
.cu-spcards[data-on="3"]>:not([data-point="3"]),
.cu-spcards[data-on="4"]>:not([data-point="4"]),
.cu-spcards[data-on="5"]>:not([data-point="5"]){display:none}
.cu-spcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--border);border:1px solid var(--border);margin-top:18px}
.cu-spcard{background:var(--panel);padding:24px 24px 22px;display:block;transition:background .3s}
.cu-spcard:hover{background:var(--bg-soft)}
.cu-spcard .m{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-text);font-weight:600}
.cu-spcard .t{display:block;font-family:var(--serif);font-size:22px;line-height:1.2;color:var(--text);margin:10px 0 8px;transition:color .3s}
.cu-spcard:hover .t{color:var(--accent-text)}
.cu-spcard .d{display:block;font-size:max(var(--fs-c),calc(12.5px*var(--fs)));line-height:1.65;color:var(--text-soft)}
/* subnav and breadcrumb (measured from the prototype) */
/* The last row of the sticky header, so it needs no sticky of its own. */
.cu-subnav{background:var(--bg-soft);border-top:1px solid var(--border)}
.cu-subnav-in{max-width:var(--wide);margin:0 auto;padding:0 clamp(16px,4vw,44px);display:flex;align-items:center;gap:clamp(14px,2.4vw,34px);overflow-x:auto;scrollbar-width:none}
.cu-subnav-in::-webkit-scrollbar{display:none}
.cu-subnav-l{flex:0 0 auto;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-text);font-weight:600;white-space:nowrap;padding:13px 0}
.cu-subnav a{flex:0 0 auto;font-size:12px;letter-spacing:.06em;color:var(--text-soft);white-space:nowrap;padding:13px 0;border-bottom:1px solid transparent}
.cu-subnav a:hover{border-bottom-color:var(--accent-text)}
.cu-subnav a[aria-current="true"]{color:var(--accent-text);border-bottom-color:var(--accent-text)}
.cu-crumb{padding:22px var(--gut) 0;font-size:12px;letter-spacing:.04em;gap:9px;align-items:center}
.cu-crumb .cur{color:var(--text)}
.cu-topbar-l{color:var(--text-mute)}
.cu-topbar-r button.on{color:var(--accent-text)}
@media (max-width:980px){.cu-spot,.cu-spot--right{grid-template-columns:1fr}.cu-spot--right .cu-spot-img{order:0}.cu-side,.cu-side--r{grid-template-columns:1fr}.cu-side-img{position:static}.cu-cardsimg{grid-template-columns:1fr}.cu-cardsimg .cu-frame{min-height:260px}.cu-steps,.cu-icons{grid-template-columns:repeat(2,1fr)}.cu-press,.cu-jav,.cu-impr,.cu-map{grid-template-columns:1fr}.cu-press .cu-xp{grid-template-columns:1fr}.cu-xpg--one .cu-xp,.cu-xpg--list .cu-xp{grid-template-columns:1fr}.cu-xpg--list .cu-xp{align-items:start}.cu-xpg--one .cu-xp .cu-arc,.cu-xpg--list .cu-xp .cu-arc{margin-bottom:18px}}
@media (max-width:760px){.cu-steps,.cu-icons{grid-template-columns:1fr}.cu-band{background-attachment:scroll}}

/* The app-download section. Measured from the kit's own rules rather than
   eyeballed: the prototype writes most of this in proto.css, and the numbers
   below (8px dot, 150px QR, 136x36 badge, 190px tile) are its numbers. The
   kit's own --ad-* variables map onto our tokens, so light and dark follow the
   theme instead of carrying a second palette. The QR and the badge are image
   slots, so they inherit the hatch above and the section renders honestly
   before the six images arrive. */
.cu-dl{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(32px,4.4vw,64px);align-items:start}
.cu-dpts{margin-top:28px;max-width:620px}
.cu-dpt{display:grid;grid-template-columns:8px 1fr;gap:14px;align-items:start;padding:12px 0;font-size:max(14px,calc(14px*var(--fs,1)));line-height:1.65;color:var(--text)}
.cu-dpt+.cu-dpt{border-top:1px solid var(--border)}
.cu-ddot{width:8px;height:8px;border:1px solid var(--accent);border-radius:50%;box-sizing:border-box;margin-top:8px;background:transparent}
.cu-dnote{font-size:12px;line-height:1.65;color:var(--text-mute);margin-top:18px;max-width:620px}
.cu-dnote a{color:var(--accent-text)}
.cu-dtiles{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;justify-content:flex-end}
.cu-dtile{background:var(--panel);border:1px solid var(--border);padding:20px;width:190px;box-sizing:border-box;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.cu-dlbl{font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--text-soft);line-height:1.4}
.cu-dqr{width:150px;height:150px;display:block;background-color:var(--paper-warm);background-position:center;background-size:contain;background-repeat:no-repeat}
.cu-dbadgeimg{display:block;width:136px;height:36px;background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat}
.cu-dbadge{display:block;transition:opacity var(--bt-dur) var(--ease)}
.cu-dbadge:hover{opacity:.82}
@media (max-width:899px){.cu-dl{grid-template-columns:1fr}.cu-dtiles{justify-content:flex-start;margin-top:32px}}

/* The blog family. Its own namespace in the kit (bl-), kept rather than
   renamed: the markup is the kit's and the parity target is its own CSS, which
   proto.css states in full. The numbers below are its numbers.

   The four badge colours are the reason the content model has four types: the
   kit defines t-cikk, t-podcast, t-elemzes and t-sajto and nothing else. The
   second value of each is the dark theme's. */
.cu-bl{--bl-cikk:#2c4a78;--bl-podcast:var(--accent);--bl-sajto:#2f7a68;--bl-elemzes:#6d4f8f}
[data-theme="dark"] .cu-bl{--bl-cikk:#8fb0e4;--bl-sajto:#7cc7b3;--bl-elemzes:#c0a4e0}

.cu-bl a{color:inherit;text-decoration:none}
.cu-bl-sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:clamp(24px,3vw,32px)}
.cu-bl-eb{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--accent-text);font-weight:500}
.cu-bl-h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.8vw,36px);line-height:1.14;color:var(--text);margin-top:14px}
.cu-bl-lnk{font-size:12.5px;color:var(--text);border-bottom:1px solid var(--border);padding-bottom:2px;white-space:nowrap}
.cu-bl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(36px,4vw,56px) clamp(24px,3vw,40px)}
.cu-bl-card{display:flex;flex-direction:column;gap:14px;min-width:0}
.cu-bl-img{position:relative;overflow:hidden;aspect-ratio:16/9;background:var(--paper-warm)}
.cu-bl-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform calc(1.2s*var(--spd)) var(--ease)}
.cu-bl-img.is-logo img{object-fit:contain;padding:12%}
.cu-bl-card:hover .cu-bl-img img{transform:scale(1.035)}
.cu-bl-card:hover .cu-bl-card-t{color:var(--accent-text)}
.cu-bl-card-k{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.cu-bl-type{display:inline-flex;align-items:center;gap:7px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--bl-c,var(--text-mute))}
.cu-bl-type::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--bl-c,var(--text-mute))}
.cu-bl-type.t-cikk{--bl-c:var(--bl-cikk)}
.cu-bl-type.t-podcast{--bl-c:var(--bl-podcast)}
.cu-bl-type.t-sajto{--bl-c:var(--bl-sajto)}
.cu-bl-type.t-elemzes{--bl-c:var(--bl-elemzes)}
.cu-bl-slot{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mute);font-weight:600}
.cu-bl-card-t{font-family:var(--serif);font-size:21px;line-height:1.25;color:var(--text);overflow-wrap:break-word;hyphens:auto;transition:color var(--bt-dur) var(--ease)}
.cu-bl-card-x{font-size:max(13.5px,calc(13.5px*var(--fs,1)));line-height:1.65;color:var(--text-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cu-bl-meta b+span::before{content:" · "}
@media (max-width:1023px){.cu-bl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cu-bl-grid{grid-template-columns:1fr}.cu-bl-sec-h{flex-direction:column;align-items:flex-start}}

/* The Radar list head. The kit gives .cu-bl-h1 two sizes: the big one for an
   article, the smaller for a listing, which is what --list carries. */
.cu-bl-top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 32px;margin-bottom:clamp(28px,3.4vw,44px)}
.cu-bl-h1{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.4vw,56px);line-height:1.06;letter-spacing:-.015em;color:var(--text);text-wrap:balance;overflow-wrap:break-word;hyphens:auto;margin-top:14px}
.cu-bl-h1--list{font-size:clamp(30px,3.6vw,46px)}
.cu-bl-srch{display:flex;border-bottom:1px solid var(--border);min-width:min(320px,100%)}
.cu-bl-srch input{flex:1;min-width:0;border:none;background:transparent;padding:10px 0;color:var(--text);font-family:var(--sans);font-size:14px;outline:none}
.cu-bl-srch button{border:none;background:transparent;color:var(--text-soft);cursor:pointer;padding:0 2px 0 12px;font:inherit;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.cu-bl-srch input:focus-visible,.cu-bl-srch button:focus-visible{outline:2px solid var(--text);outline-offset:2px}

/* The search surface. .cu-bl-chip's active state is the kit's own is-on, so the
   filters needed no new rule -- only that they are links rather than buttons. */
/* The search field, measured off the prototype on 2026-11-03 (v33 restyled it
   and our values came from the older kit): a serif display field with a solid
   accent button, not a sans 16px field with a text button. */
.cu-bl-q{display:flex;border-bottom:1px solid var(--border-strong);max-width:640px;margin-top:24px}
.cu-bl-q:focus-within{border-bottom-color:var(--accent)}
.cu-bl-q input{flex:1;min-width:0;border:none;background:transparent;padding:14px 0;color:var(--text);font-family:var(--serif);font-size:clamp(22px,2.4vw,28px);outline:none}
.cu-bl-q button{border:none;background:var(--accent);color:var(--on-accent);cursor:pointer;padding:0 20px;font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
/* No ring on the field: the design shows focus by turning the underline
   accent (`:focus-within` above), and a 2px dark outline around the whole
   field is what it looked like we had invented. The button keeps a ring,
   and the accessibility panel's focus mode strengthens both. */
.cu-bl-q input{outline:none}
.cu-bl-q button:focus-visible{outline:2px solid var(--text);outline-offset:2px}
.cu-bl-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:22px}
.cu-bl-chip{display:inline-flex;align-items:center;padding:7px 13px;border:1px solid var(--border);font-size:12.5px;color:var(--text-soft);background:transparent;font-family:var(--sans);transition:border-color var(--bt-dur) var(--ease),color var(--bt-dur) var(--ease)}
.cu-bl-chip:hover{border-color:var(--accent);color:var(--text)}
.cu-bl-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cu-bl-chip:active{transform:scale(.97)}
/* A chip with no hits is dimmed but still clickable (design §3). */
.cu-bl-chip.is-zero{opacity:.55}
.cu-bl-chip.is-on{border-color:var(--text);color:var(--text);background:var(--paper-warm)}
.cu-bl-stat{margin-top:28px}
.cu-bl-res{margin-top:8px}
.cu-bl-res .cu-bl-card-x{-webkit-line-clamp:unset;display:block}

/* The section archive's navigation band. A self-contained strip: its own rules
   above and below, so it sits between the head and the grid. The toggle only
   appears on a narrow screen; with no script the band is simply open, which is
   why nothing is hidden in the markup. */
.cu-bl-nav{margin:clamp(40px,5vw,64px) 0 clamp(32px,4vw,48px);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.cu-bl-nav-tg{display:none;width:100%;align-items:center;justify-content:space-between;padding:16px 0;background:none;border:none;color:var(--text);font:inherit;font-size:13px;font-weight:600;letter-spacing:.06em;cursor:pointer}
.cu-bl-nav-tg svg{transition:transform var(--bt-dur) var(--ease)}
.cu-bl-nav-tg[aria-expanded="true"] svg{transform:rotate(180deg)}
.cu-bl-nav-in{display:grid;grid-template-columns:auto 1fr auto;gap:14px 28px;align-items:center;padding:16px 0}
.cu-bl-nav-l{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-mute);font-weight:600}
.cu-bl-nav-r{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;justify-content:flex-end}
.cu-bl-rov{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mute);font-weight:500}
@media (max-width:899px){
  .cu-bl-nav-tg{display:flex}
  .cu-bl-nav-in{display:none;grid-template-columns:1fr;padding:0 0 18px}
  .cu-bl-nav-in.is-open{display:grid}
  .cu-bl-nav-r{justify-content:flex-start}
}
@media (prefers-reduced-motion:reduce){.cu-bl-nav-tg svg{transition:none}}

/* The entry's page. The measurements are the kit's own (700px column, 48px
   player disc, 112px portrait), and its --wf-* variables map onto our tokens. */
.cu-bl-art1{max-width:700px;margin-inline:auto}
.cu-bl-art-h{display:grid;gap:20px;margin-bottom:clamp(28px,3vw,40px)}
.cu-bl-art-k{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.cu-bl-art-m{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}
.cu-bl-au-l{color:var(--text);border-bottom:1px solid var(--border)}
.cu-bl-player{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:center;padding:18px 20px;border:1px solid var(--border);background:var(--panel);margin:0 0 clamp(28px,3vw,36px)}
.cu-bl-player i{width:48px;height:48px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:inline-flex;align-items:center;justify-content:center;font-style:normal}
.cu-bl-wave{height:22px;margin-top:8px;background:repeating-linear-gradient(90deg,var(--border) 0 2px,transparent 2px 6px);mask:linear-gradient(90deg,#000 35%,rgba(0,0,0,.35));-webkit-mask:linear-gradient(90deg,#000 35%,rgba(0,0,0,.35))}
.cu-bl-hero{aspect-ratio:16/9;max-height:400px;width:100%;object-fit:cover;display:block;background:var(--paper-warm);margin-bottom:clamp(28px,3vw,40px)}
.cu-bl-body{max-width:700px}
.cu-bl-body p{font-size:max(16.5px,calc(16.5px*var(--fs,1)));line-height:1.8;color:var(--text-soft);margin:0 0 1.15em}
.cu-bl-body h2{font-family:var(--serif);font-weight:400;font-size:clamp(23px,2.4vw,30px);line-height:1.2;color:var(--text);margin:1.8em 0 .6em;overflow-wrap:break-word;hyphens:auto}
.cu-bl-body a{color:var(--accent-text);text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:3px}
.cu-bl-body img{max-width:100%;height:auto;display:block;margin:1.6em 0}
.cu-bl-lead{margin:clamp(28px,3vw,40px) 0;padding:22px 26px;background:var(--paper-warm);border-left:2px solid var(--accent)}
.cu-bl-lead-l{display:block;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text);font-weight:600;margin-bottom:10px}
.cu-bl-label{margin:1.8em 0 .7em;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--accent-text)}
.cu-bl-disc{margin-top:2.2em;padding-top:16px;border-top:1px solid var(--border)}
.cu-bl-share{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:22px 0;margin-top:clamp(32px,4vw,48px);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.cu-bl-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid var(--border);background:transparent;color:var(--text-soft);cursor:pointer;font-family:var(--sans);font-size:12.5px;transition:border-color var(--bt-dur) var(--ease),color var(--bt-dur) var(--ease)}
.cu-bl-btn:hover{border-color:var(--text-soft);color:var(--text)}
.cu-bl-btn:active{transform:scale(.97)}
.cu-bl-copied{font-size:12px;color:var(--text-mute)}
.cu-bl-aubox{display:grid;grid-template-columns:112px 1fr;gap:24px;align-items:center;padding:28px 0;border-bottom:1px solid var(--border)}
.cu-bl-au-n{font-family:var(--serif);font-size:23px;color:var(--text);display:block;margin:6px 0 4px}
.cu-bl-sec{margin-top:clamp(48px,5vw,72px)}
@media (max-width:640px){.cu-bl-aubox{grid-template-columns:1fr}.cu-bl-player{grid-template-columns:1fr}}

/* Contact Form 7's own wrappers.
 *
 * CF7 decides the markup around a control: it wraps every field in
 * .wpcf7-form-control-wrap, every choice in .wpcf7-list-item > label, and puts
 * the label text in .wpcf7-list-item-label. Our `class:` option lands on the
 * input, not on the label — so .cu-check, which is the grid for the row, was
 * being applied to the checkbox itself and the rows had no layout at all.
 *
 * The numbers are the kit's own, read off its form specimen: a 16px + 1fr grid
 * with a 12px gap, a 15px control, and 10px between rows. A consent sits
 * start-aligned with smaller, softer text; a radio centres on one line.
 */
.wpcf7-form-control-wrap{display:block}
.cu-consent .wpcf7-list-item,.cu-fieldset .wpcf7-list-item{display:block;margin:0}
.cu-consent .wpcf7-list-item label,.cu-fieldset .wpcf7-list-item label{display:grid;grid-template-columns:16px 1fr;gap:12px;margin-top:10px;cursor:pointer}
.cu-consent .wpcf7-list-item label{align-items:start}
.cu-fieldset .wpcf7-list-item label{align-items:center}
.cu-consent .wpcf7-list-item input,.cu-fieldset .wpcf7-list-item input{width:15px;height:15px;margin:0;accent-color:var(--accent-text);cursor:pointer}
.cu-consent .wpcf7-list-item input{margin-top:2px}
.cu-consent .wpcf7-list-item-label{font-size:max(12.5px,calc(12.5px*var(--fs,1)));line-height:1.65;color:var(--text-soft)}
.cu-fieldset .wpcf7-list-item-label{font-size:max(14px,calc(14px*var(--fs,1)));line-height:1.5;color:var(--text)}
.cu-consent .wpcf7-list-item-label a{color:var(--accent-text);text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:3px}
/* The kit draws the group's legend exactly as a field label. */
.cu-fieldset{border:none;padding:0;margin:0;min-width:0}
.cu-fieldset legend{float:none;width:auto}

/* A navy surface is a dark island inside the light theme, so the accent text
   there is the plain accent, not the deepened one: #955800 on #18202E is
   2.85:1, the accent itself 6.76:1. Axe found this on eight key pages after the
   deepening — the fix for one surface had moved the problem to another. */
.cu-dark,.cu-spot-box,.cu-map-box,.cu-topbar--navy,.cu-gband,.cu-card--img{--accent-text:var(--accent)}

/* Two things a narrow screen exposed, both measured rather than guessed.
   A bare URL in an announcement is one unbreakable word -- 2 of 1 873 entries
   carry one, and at 320px it pushed the page sideways; prose breaks it instead.
   And .cu-tick is a 54px rule that only a transform shrinks, so its layout box
   stays 54 and overflowed a narrow pillar cell. */
body{overflow-wrap:break-word}

/* A flex item will not shrink below its content, so the URL above broke out of
   the download row however prose wrapped elsewhere. */
.cu-doc>*{min-width:0}

/* A phone number must not break across lines, and one row carries two of them
   (266px of nowrap beside its label). So the row wraps instead of the number;
   above a phone there is room and it never triggers. */
.cu-tel-h{flex-wrap:wrap}

/* 1fr has an automatic minimum of its own content, so the author card's text
   column could not shrink and the 104px photo pushed the card 47px wide. */
.cu-au-card{grid-template-columns:104px minmax(0,1fr)}

/* WCAG 1.4.10 asks for 320px with no sideways scrolling, and the kit is drawn
   at 390 — so nothing covered the width below that. Measured: a 169px logo plus
   132px of header controls inside a 280px content box, which made every page
   scroll sideways at 320. The gutter and the logo height are tokens, so this is
   one rule rather than a dozen overrides. */
@media (max-width:359px){
  :root{--gut:14px;--logo-h:22px}
  .cu-header-in{gap:12px}
  .cu-header-r{gap:8px}
  /* The row bleeds 18px past the text column so its hover background reaches
     the gutter edge. With a 14px gutter that is 4px off the screen on each
     side, so the bleed follows the gutter instead of a fixed figure. */
  .cu-row{padding-left:14px;padding-right:14px;margin-left:-14px;margin-right:-14px}
}