/* ============================================================================
   Cégeknek oldal (main.cf-membership.cf-cegeknek) — oldal-stíluslap
   Forrás: 03-DESIGN-HANDOVER/import/design_handoff_cegeknek/Cegeknek.dc.html (2026-09-05).

   MIRE ÉPÜL: a lap a tagsági landing `cf-membership` rendszerét használja (tokenek, reveal,
   [data-spot] spotlight, .cfm-section/.cfm-container, .cfm-eyebrow-label/.cfm-h2/.cfm-lede,
   .cfm-cta*, partner-marquee, .cfm-faq-*) — azok a publikus bundle-ből jönnek
   (_membership-page.scss). Itt CSAK az van, amit a tagsági oldal nem ismer: a kéthasábos hero a
   2×2 statisztika-kártyával, az ikon-sorok, a szolgáltatás-kártyák, a referencia-tábla, a
   folyamat-lépések és az ajánlatkérő űrlap (a design .cf-input/.cf-field/… osztályai NINCSENEK a
   portálban, csak a design-system pillanatképében: _ds/…/live-site.css 258-280, innen másolva).

   MIÉRT KÜLÖN FÁJL, NEM A BUNDLE-BEN: egy oldalé; a CSS-bundle-bontás (2026-08-17) pontosan az
   ilyen halott súlyt vette le a többi oldalról. Sima .css (nincs LESS-fordítás), a cache-bustert
   az `assetVersion "cegeknek.css"` adja. Minta: public/rolunk.css.

   DESIGN vs. ÉLŐ RENDSZER (Roland 2026-09-05: „a mostani honlaphoz kell igazodnia"): ahol a
   design és az élesített tagsági/rólunk oldalak RENDSZER-eleme eltér (eyebrow, H2-méret, CTA,
   spotlight-változók, reveal-időzítés), az élő rendszer nyer; ahol a design ÚJ blokkot hoz, azt a
   design geometriájával, az élő tokenekkel építjük.

   TOKEN-CSAPDA: a design `--accent-text`-je csak a hub-bundle-ben él, `--down-text` sehol →
   lap-lokális `--cfb-accent-text`, illetve `--down-color`. `--field-bd` és `--chip-bg` globális.

   HATÓKÖR: minden szabály `.cf-cegeknek` alatt. Dekoratív hover CSAK `@media (hover:hover)` mögött.
   ============================================================================ */

/* --- 1. Lap-lokális tokenek ------------------------------------------------ */
.cf-cegeknek {
  --cfb-accent-text: #0d8040;
  --cfb-glow: rgba(13,128,64,.10);
  --cfb-shadow: 0 18px 40px -26px rgba(12,13,22,.35);
  --cfb-card-hover-bd: rgba(30,215,96,.35);
  --cfb-lime-soft: rgba(13,128,64,.08);
  --cfb-mesh-op: .08;
}
body.darkmode .cf-cegeknek {
  --cfb-accent-text: #1ed760;
  --cfb-glow: rgba(30,215,96,.13);
  --cfb-shadow: 0 22px 44px -26px rgba(0,0,0,.7);
  --cfb-lime-soft: rgba(30,215,96,.08);
  --cfb-mesh-op: .14;
}

/* --- 2. Közös apróságok ------------------------------------------------------ */
/* A design eyebrow-jának 22×1.5px lime vonala a felirat előtt. */
.cf-cegeknek .cfb-dash { display:inline-block; width:22px; height:1.5px; background:var(--mem-accent); margin-right:.7em; vertical-align:middle; }
.cf-cegeknek .cfb-h2 { margin-top:.5em; }
.cf-cegeknek .cfb-link-inline { color:var(--cfb-accent-text); font-weight:600; transition:color .16s ease; }
.cf-cegeknek .cfb-link-inline:hover { color:var(--primary-text); text-decoration:none; }
.cf-cegeknek .cfb-center { text-align:center; }
.cf-cegeknek .cfb-center .cfm-h2 { margin-left:auto; margin-right:auto; max-width:24ch; }
/* A tagsági `.cfm-container` alsó paddingje a design sűrűbb szekció-ritmusához (3.6em). */
.cf-cegeknek .cfm-section .cfm-container { padding-top:3.6em; padding-bottom:3.6em; }
/* Képernyőolvasónak szóló, vizuálisan rejtett szöveg (tábla-felirat). */
.cf-cegeknek .cfb-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* --- 3. 01 · HERO: kéthasábos, hex-mesh háttér + lime fény ------------------- */
.cf-cegeknek .cfb-hero-mesh {
  background:url('/public/assets/cegeknek-2026/06-hex-mesh-16x9.webp') right center/cover no-repeat;
  opacity:var(--cfb-mesh-op);
  /* A design jobbra kifutó maszkja (38%→85%) + függőleges kifutás alul, hogy a réteg a hero alsó
     élén beolvadjon a lap hátterébe (a landing sötétítő átmenete ALATTA van, l. cegeknek.hbs). */
  -webkit-mask-image:linear-gradient(100deg,transparent 38%,#000 85%),linear-gradient(180deg,#000 60%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(100deg,transparent 38%,#000 85%),linear-gradient(180deg,#000 60%,transparent 100%);
  mask-composite:intersect;
}
/* A design 640×640-es fényudvara (top:-220px; left:-160px) rétegként: középpont (160px,100px). */
.cf-cegeknek .cfb-hero-glow { background:radial-gradient(320px circle at 160px 100px,var(--cfb-glow),transparent 62%); }
.cf-cegeknek .cfb-hero-inner {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));
  gap:2.4em 3em; align-items:center;
  padding:3.8em 1.1em 3.2em;
}
/* Kéthasábos elrendezésben a landing 64px-es H1-je négy sorra törne: a design H1-mérete megy. */
.cf-cegeknek .cfm-hero-h1 { font-size:clamp(34px,4.6vw,56px); line-height:1.03; max-width:none; margin-top:.7em; }
.cf-cegeknek .cfm-hero-sub { font-size:16.5px; max-width:58ch; }
.cf-cegeknek .cfb-hero-quote { padding-left:1em; border-left:2px solid rgba(30,215,96,.45); font-size:14px; line-height:1.5; font-style:italic; margin-top:1.7em; }
.cf-cegeknek .cfb-hero-stats { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.cf-cegeknek .cfb-stat-card {
  position:relative; background:var(--x-cell); border:1px solid var(--x-hair-strong); border-radius:14px;
  padding:1.3em 1.3em 1.2em;
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.cf-cegeknek .cfb-stat-card .cfm-stat-num { display:block; font-size:clamp(28px,3vw,36px); letter-spacing:-.03em; line-height:1; }
.cf-cegeknek .cfb-stat-card .cfm-stat-label { display:block; margin-top:.5em; font-size:13.5px; color:var(--secondary-text); }

/* --- 4. Kártya-hover (dekoratív, csak mutatós eszközön) ----------------------- */
@media (hover:hover) {
  .cf-cegeknek .cfb-stat-card:hover,
  .cf-cegeknek .cfb-icon-row:hover,
  .cf-cegeknek .cfb-svc-card:hover,
  .cf-cegeknek .cfb-step:hover { border-color:var(--cfb-card-hover-bd); box-shadow:var(--cfb-shadow); transform:translateY(-2px); }
  .cf-cegeknek .cfb-svc-cta:hover { color:var(--primary-text); text-decoration:none; }
  .cf-cegeknek .cfb-chip:hover { border-color:rgba(30,215,96,.45); }
  .cf-cegeknek .cfb-done-reset:hover { border-color:rgba(30,215,96,.45); color:var(--primary-text); text-decoration:none; }
}

/* --- 5. 02 · MIÉRT HIHETŐ: két hasáb + 3 ikon-sor ------------------------------ */
.cf-cegeknek .cfb-split { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); gap:2.2em 3em; align-items:start; }
.cf-cegeknek .cfb-split .cfm-lede + .cfm-lede { margin-top:.9em; }
.cf-cegeknek .cfb-icon-rows { display:grid; gap:10px; }
.cf-cegeknek .cfb-icon-row {
  position:relative; display:grid; grid-template-columns:44px 1fr; gap:1em; align-items:start;
  background:var(--x-cell); border:1px solid var(--x-hair-strong); border-radius:14px; padding:1.2em 1.3em;
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
/* A tagsági 40px-es ikon-chipje a design 44px-ére. */
.cf-cegeknek .cfb-icon-chip { width:44px; height:44px; border-radius:12px; font-size:17px; background:var(--cfb-lime-soft); }
.cf-cegeknek .cfb-row-title { margin:0; font-size:16.5px; font-weight:700; letter-spacing:-.01em; color:var(--primary-text); line-height:1.3; }
.cf-cegeknek .cfb-row-text { margin:.35em 0 0; font-size:14px; line-height:1.55; color:var(--secondary-text); }

/* --- 6. Szekció-fejléc (eyebrow + H2, alatta a bevezető egy hasábban) --------------
   Roland 2026-09-06: a design jobbra tolt, 44ch-s bevezetője a képernyő harmadára szűkült, és a
   felsorolás-jellegű mondat ott furán ült; egy hasábban, a H2 alatt, szélesebb mérettel megy. */
.cf-cegeknek .cfb-section-head { display:block; }
.cf-cegeknek .cfb-section-head-lede { margin:.85em 0 0; max-width:64ch; font-size:15.5px; line-height:1.6; }

/* --- 7. 03 · SZOLGÁLTATÁSOK: 6 kártya, 3 oszlop 1280-on ------------------------- */
.cf-cegeknek .cfb-svc-grid { margin-top:1.8em; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:12px; }
.cf-cegeknek .cfb-svc-card {
  position:relative; display:flex; flex-direction:column; gap:.7em;
  background:var(--x-cell); border:1px solid var(--x-hair-strong); border-radius:14px; padding:1.4em;
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.cf-cegeknek .cfb-svc-top { display:flex; align-items:center; justify-content:space-between; gap:1em; }
.cf-cegeknek .cfb-svc-ico {
  width:40px; height:40px; border-radius:11px; background:var(--cfb-lime-soft); color:var(--mem-accent);
  display:flex; align-items:center; justify-content:center; font-size:16px;
}
.cf-cegeknek .cfb-svc-num { font-family:var(--mem-font-mono); font-size:12.5px; font-weight:700; letter-spacing:.08em; color:var(--pale-text); font-variant-numeric:tabular-nums; }
.cf-cegeknek .cfb-svc-title { margin:.3em 0 0; font-size:17.5px; font-weight:700; letter-spacing:-.01em; color:var(--primary-text); }
.cf-cegeknek .cfb-svc-text { margin:0; font-size:14px; line-height:1.55; color:var(--secondary-text); text-wrap:pretty; }
.cf-cegeknek .cfb-svc-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:.2em; }
.cf-cegeknek .cfb-svc-foot { margin-top:auto; padding-top:.9em; border-top:1px solid var(--x-hair); display:flex; justify-content:space-between; align-items:center; gap:1em; flex-wrap:wrap; }
.cf-cegeknek .cfb-svc-ref { font-size:12.5px; line-height:1.45; color:var(--pale-text); }
.cf-cegeknek .cfb-svc-cta { font-size:13.5px; font-weight:600; white-space:nowrap; color:var(--cfb-accent-text); transition:color .16s ease; }

/* --- 8. 04 · PARTNEREK: a sáv a közös partialból, csak a térköz --------------- */
.cf-cegeknek .cfm-logos-rows { margin-top:1.8em; }

/* --- 10. 06 · FOLYAMAT: 4 lépés, a 04 kiemelve (a Rólunk `--featured` értékei) ---- */
.cf-cegeknek .cfb-step-grid { margin:1.8em 0 0; padding:0; list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:12px; }
.cf-cegeknek .cfb-step { position:relative; background:var(--x-cell); border:1px solid var(--x-hair-strong); border-radius:14px; padding:1.4em; display:flex; flex-direction:column; gap:.6em; transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease; }
.cf-cegeknek .cfb-step--last { border:1.5px solid rgba(30,215,96,.5); box-shadow:0 0 0 1px rgba(30,215,96,.12),0 18px 44px -20px rgba(30,215,96,.35); }
.cf-cegeknek .cfb-step-num { font-family:var(--mem-font-mono); font-size:12.5px; font-weight:700; letter-spacing:.08em; color:var(--cfb-accent-text); } /* a design --accent-text-je: világosban AA-biztos mélyzöld (mérve 5,03:1), sötétben márkazöld */
.cf-cegeknek .cfb-step-title { margin:0; font-size:17px; font-weight:700; color:var(--primary-text); }
.cf-cegeknek .cfb-step-text { margin:0; font-size:14px; line-height:1.55; color:var(--secondary-text); }

/* --- 11. 08 · AJÁNLATKÉRŐ: keret, háttér, bal hasáb ------------------------------ */
.cf-cegeknek .cfb-contact { position:relative; overflow:hidden; scroll-margin-top:80px; border-bottom:none; }
.cf-cegeknek .cfb-contact-particle {
  position:absolute; inset:0; pointer-events:none; opacity:.12;
  /* Ugyanaz a fájl, ami a Rólunk záró CTA-ján fut (bájtazonos a csomagbelivel), ezért nem másoltuk be újra. */
  background:url('/public/assets/rolunk-2026/01-particle-network-16x9.webp') center/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 50%); mask-image:linear-gradient(180deg,transparent,#000 50%);
}
.cf-cegeknek .cfb-contact-glow {
  position:absolute; left:50%; bottom:-320px; transform:translateX(-50%); width:820px; height:620px; border-radius:50%;
  background:radial-gradient(circle,var(--cfb-glow),transparent 60%); pointer-events:none;
}
.cf-cegeknek .cfb-contact .cfb-contact-inner {
  position:relative; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
  gap:2.4em 3em; align-items:start; padding-top:4em; padding-bottom:4.4em;
}
.cf-cegeknek .cfb-contact-h2 { font-size:clamp(28px,3.6vw,42px); letter-spacing:-.025em; line-height:1.05; }
.cf-cegeknek .cfb-contact-copy .cfm-lede { max-width:46ch; }
.cf-cegeknek .cfb-trust { margin-top:1.8em; display:flex; flex-direction:column; gap:.8em; }
.cf-cegeknek .cfb-trust span { display:inline-flex; align-items:center; gap:.65em; font-size:14px; font-weight:600; color:var(--primary-text); }
.cf-cegeknek .cfb-trust i { color:var(--mem-accent); width:18px; text-align:center; }
.cf-cegeknek .cfb-contact-mail { margin:1.8em 0 0; font-size:14px; color:var(--pale-text); }
.cf-cegeknek .cfb-disclaimer { position:relative; margin:0 auto; max-width:var(--page-max-width); padding:0 1.1em 2em; font-size:12.5px; line-height:1.6; color:var(--pale-text); text-align:center; }

/* --- 12. 08 · ŰRLAP (a design-system .cf-form értékei, tokencserével) ------------ */
.cf-cegeknek .cfb-form-card { position:relative; background:var(--x-cell); border:1px solid var(--x-hair-strong); border-radius:20px; padding:1.7em 1.7em 1.8em; }
.cf-cegeknek .cfb-form { display:flex; flex-direction:column; gap:1.15em; }
.cf-cegeknek .cfb-form[hidden] { display:none; }
.cf-cegeknek .cfb-form-row { display:grid; grid-template-columns:1fr 1fr; gap:1em; }
.cf-cegeknek .cfb-field { display:flex; flex-direction:column; gap:.45em; min-width:0; }
.cf-cegeknek .cfb-fieldset { margin:0; padding:0; border:0; min-inline-size:0; }
.cf-cegeknek .cfb-fieldset legend { padding:0; margin-bottom:.45em; float:left; width:100%; }
.cf-cegeknek .cfb-fieldset .cfb-chips { clear:both; }
.cf-cegeknek .cfb-label { display:block; font-size:.875em; font-weight:600; color:var(--primary-text); letter-spacing:-.005em; }
.cf-cegeknek .cfb-req { color:var(--down-color); }
.cf-cegeknek .cfb-opt { font-weight:500; color:var(--pale-text); }
.cf-cegeknek .cfb-input, .cf-cegeknek .cfb-select, .cf-cegeknek .cfb-textarea {
  width:100%; box-sizing:border-box; height:46px; padding:0 1em; border-radius:12px;
  background:var(--chip-bg); border:1px solid var(--field-bd); color:var(--primary-text);
  font-family:inherit; font-size:14.5px; outline:none; caret-color:var(--color-primary);
  transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease;
}
.cf-cegeknek .cfb-input::placeholder, .cf-cegeknek .cfb-textarea::placeholder { color:var(--pale-text); }
.cf-cegeknek .cfb-input:focus, .cf-cegeknek .cfb-select:focus, .cf-cegeknek .cfb-textarea:focus { border-color:rgba(30,215,96,.55); box-shadow:0 0 0 3px rgba(30,215,96,.14); }
.cf-cegeknek .cfb-textarea { height:auto; min-height:112px; padding:.8em 1em; resize:vertical; line-height:1.5; }
.cf-cegeknek .cfb-select {
  appearance:none; -webkit-appearance:none; cursor:pointer; padding-right:2.6em;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6" viewBox="0 0 10 6" fill="none"><path d="M1 1l4 4 4-4" stroke="%2399A0A7" stroke-width="1.8" stroke-linecap="round"/></svg>');
  background-repeat:no-repeat; background-position:right 1em center;
}
.cf-cegeknek .cfb-hint { margin:0; font-size:.8em; color:var(--pale-text); line-height:1.45; }
.cf-cegeknek .cfb-hint--center { margin-top:-.3em; text-align:center; }
.cf-cegeknek .cfb-error-msg { margin:0; font-size:.85em; font-weight:600; color:var(--down-color); line-height:1.45; }
.cf-cegeknek .cfb-error-msg[hidden] { display:none; }
.cf-cegeknek .cfb-invalid, .cf-cegeknek .cfb-invalid:focus { border-color:color-mix(in srgb,var(--down-color) 60%,transparent); }
.cf-cegeknek .cfb-invalid:focus { box-shadow:0 0 0 3px color-mix(in srgb,var(--down-color) 14%,transparent); }
.cf-cegeknek .cfb-checkrow { display:flex; align-items:flex-start; gap:.6em; font-size:.9em; color:var(--secondary-text); line-height:1.45; cursor:pointer; }
.cf-cegeknek .cfb-checkrow input { width:18px; height:18px; margin:1px 0 0; accent-color:var(--color-primary); cursor:pointer; flex:none; }
.cf-cegeknek .cfb-checkrow--invalid { color:var(--down-color); }
.cf-cegeknek .cfb-checkrow--invalid .cfb-link-inline { color:inherit; }
/* Honeypot: képernyőn kívül, NEM display:none (a fejlettebb botok azt átlátják). */
.cf-cegeknek .cfb-hp { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }

/* Téma- és időzítés-chipek: rejtett checkbox/radio + label, JS nélkül is működnek.
   A bekapcsolt állapot két úton: `.is-on` (szerver-render + JS) és `:has(:checked)` (CSS-only),
   KÜLÖN szabályokban, mert egy `:has`-t nem ismerő motor az egész szelektor-listát eldobná. */
.cf-cegeknek .cfb-chips { display:flex; flex-wrap:wrap; gap:.5em; }
.cf-cegeknek .cfb-chip {
  position:relative; display:inline-flex; align-items:center; gap:.45em; border-radius:100px; padding:.55em 1.05em;
  font-size:13.5px; font-weight:600; cursor:pointer; user-select:none;
  background:var(--chip-bg); border:1px solid var(--x-hair-strong); color:var(--secondary-text);
  transition:border-color .15s ease,background-color .15s ease,color .15s ease;
}
.cf-cegeknek .cfb-chip-input { position:absolute; opacity:0; width:1px; height:1px; margin:0; pointer-events:none; }
.cf-cegeknek .cfb-chip-plus, .cf-cegeknek .cfb-chip-check { font-size:11px; }
.cf-cegeknek .cfb-chip-check { display:none; }
.cf-cegeknek .cfb-chip.is-on { background:var(--cfb-lime-soft); border-color:rgba(30,215,96,.55); color:var(--cfb-accent-text); }
.cf-cegeknek .cfb-chip:has(.cfb-chip-input:checked) { background:var(--cfb-lime-soft); border-color:rgba(30,215,96,.55); color:var(--cfb-accent-text); }
.cf-cegeknek .cfb-chip.is-on .cfb-chip-plus { display:none; }
.cf-cegeknek .cfb-chip:has(.cfb-chip-input:checked) .cfb-chip-plus { display:none; }
.cf-cegeknek .cfb-chip.is-on .cfb-chip-check { display:inline; }
.cf-cegeknek .cfb-chip:has(.cfb-chip-input:checked) .cfb-chip-check { display:inline; }
.cf-cegeknek .cfb-chip:focus-within { box-shadow:0 0 0 3px rgba(30,215,96,.2); }

/* Siker-állapot (a form helyén, ugyanabban a kártyában). */
.cf-cegeknek .cfb-done { display:flex; flex-direction:column; align-items:center; text-align:center; gap:1em; padding:2.2em 1em; }
.cf-cegeknek .cfb-done[hidden] { display:none; }
.cf-cegeknek .cfb-done-ico {
  width:64px; height:64px; border-radius:50%; background:var(--cfb-lime-soft); border:1.5px solid rgba(30,215,96,.5);
  display:flex; align-items:center; justify-content:center; color:var(--cfb-accent-text); font-size:24px;
}
.cf-cegeknek .cfb-done-title { margin:0; font-size:22px; font-weight:800; letter-spacing:-.015em; color:var(--primary-text); }
.cf-cegeknek .cfb-done-text { margin:0; font-size:15px; line-height:1.6; color:var(--secondary-text); max-width:34em; }
.cf-cegeknek .cfb-done-text strong { color:var(--primary-text); font-weight:600; }
.cf-cegeknek .cfb-done-reset {
  margin-top:.4em; display:inline-flex; align-items:center; gap:.55em; border:1px solid var(--x-hair-strong); background:var(--chip-bg);
  color:var(--secondary-text); border-radius:100px; padding:.65em 1.4em; font-size:13.5px; font-weight:600; transition:border-color .15s ease,color .15s ease;
}

/* --- 13. MOBIL <768px ---------------------------------------------------------- */
@media (max-width:767px) {
  .cf-cegeknek .cfb-hero-inner { padding:1.2em 1.05em 2.6em; gap:1.8em; }
  .cf-cegeknek .cfm-hero-h1 { font-size:clamp(30px,8.6vw,38px); }
  .cf-cegeknek .cfb-hero-stats { gap:8px; }
  .cf-cegeknek .cfb-stat-card { padding:1.1em 1em 1em; }
  .cf-cegeknek .cfb-stat-card .cfm-stat-num { font-size:24px; }
  .cf-cegeknek .cfm-section .cfm-container { padding-top:2.6em; padding-bottom:2.8em; }
  .cf-cegeknek .cfb-section-head-lede { font-size:14px; }
  .cf-cegeknek .cfb-contact .cfb-contact-inner { padding-top:2.8em; padding-bottom:3em; }
  .cf-cegeknek .cfb-form-card { padding:1.3em 1.1em 1.4em; }
  .cf-cegeknek .cfb-contact-glow { width:520px; height:400px; bottom:-220px; }
}
@media (max-width:559px) {
  .cf-cegeknek .cfb-form-row { grid-template-columns:1fr; }
}