/* =========================================================
   Közös lábléc (_Layout.cshtml) – sötét navy, többoszlopos.
   Minden szabály a .cs-footer wrapperre van skálázva; a régi
   theme.css .footer/.copyright szabályai így nem érvényesülnek.
   A fájl a theme.css/responsive.css UTÁN töltődik be.
   ========================================================= */

.cs-footer{
  --csf-navy:#0F172A; --csf-navy-2:#172033;
  --csf-brand:#01997A; --csf-brand-light:#5EEAD4;
  --csf-text:#CBD5E1; --csf-muted:#94A3B8; --csf-line:rgba(255,255,255,.09);

  background:var(--csf-navy);
  color:var(--csf-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:15px;
  line-height:1.6;
  padding:0;
  margin:0;
}
.cs-footer,.cs-footer *{box-sizing:border-box}
.cs-footer p,.cs-footer ul,.cs-footer h3{margin:0;padding:0}
.cs-footer ul{list-style:none}
.cs-footer img{max-width:100%;display:block}

.cs-footer .cs-footer-wrap{width:min(1180px,calc(100% - 40px));margin:0 auto}

/* ===== Felső, oszlopos rész ===== */
.cs-footer .cs-footer-top{
  display:grid;
  grid-template-columns:1.7fr 1fr 1fr 1fr 1fr;
  gap:44px 32px;
  padding:72px 0 56px;
}

/* Márka blokk */
.cs-footer .cs-footer-logo img{width:150px;height:auto}
.cs-footer .cs-footer-claim{color:#fff;font-weight:700;font-size:1.02rem;margin-top:22px}
.cs-footer .cs-footer-desc{color:var(--csf-muted);font-size:.94rem;margin-top:10px;max-width:34ch}

.cs-footer .cs-footer-social{display:flex;gap:10px;margin-top:24px}
.cs-footer .cs-footer-social a{
  width:38px;height:38px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);border:1px solid var(--csf-line);
  color:var(--csf-text);transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.cs-footer .cs-footer-social a:hover{background:var(--csf-brand);border-color:var(--csf-brand);color:#fff;transform:translateY(-2px)}
.cs-footer .cs-footer-social svg{width:17px;height:17px}

/* Link oszlopok */
.cs-footer .cs-footer-col h3{
  color:#fff;font-size:.78rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;margin-bottom:18px;
}
.cs-footer .cs-footer-col li{margin-bottom:11px}
.cs-footer .cs-footer-col a{color:var(--csf-muted);font-size:.94rem;transition:color .18s ease}
.cs-footer .cs-footer-col a:hover{color:var(--csf-brand-light);text-decoration:none}
.cs-footer .cs-footer-mail{color:var(--csf-text);font-weight:600;word-break:break-word}
.cs-footer .cs-footer-mail:hover{color:var(--csf-brand-light)}

/* ===== Fizetési sáv – diszkrét, a navigációtól elválasztva ===== */
.cs-footer .cs-footer-pay{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:20px 0;border-top:1px solid var(--csf-line);
}
.cs-footer .cs-footer-pay span{color:#64748B;font-size:.82rem;letter-spacing:.02em}
.cs-footer .cs-footer-pay img{height:26px;width:auto;opacity:.85;transition:opacity .18s ease}
.cs-footer .cs-footer-pay a:hover img{opacity:1}

/* ===== Jogi sáv ===== */
.cs-footer .cs-footer-legal{
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  padding:18px 0 26px;border-top:1px solid var(--csf-line);
}
.cs-footer .cs-footer-copy{color:#64748B;font-size:.85rem}
.cs-footer .cs-footer-legal-links{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.cs-footer .cs-footer-legal-links a{color:#64748B;font-size:.85rem;transition:color .18s ease}
.cs-footer .cs-footer-legal-links a:hover{color:var(--csf-brand-light);text-decoration:none}

/* Vissza a tetejére.
   A theme.css #backTo (ID, 1-0-0) és a responsive.css top:-30px felülírná a
   sima osztályt, ezért itt is ID-vel kell szelektálni, és a régi pozicionálást
   explicit vissza kell állítani. */
.cs-footer #backTo.cs-footer-top-btn{
  position:static;top:auto;
  width:36px;height:36px;border-radius:10px;flex:0 0 36px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);border:1px solid var(--csf-line);color:var(--csf-text);
  transition:background .18s ease,transform .18s ease,color .18s ease;
}
.cs-footer #backTo.cs-footer-top-btn:hover{background:var(--csf-brand);color:#fff;transform:translateY(-2px)}
.cs-footer #backTo.cs-footer-top-btn svg{width:15px;height:15px}

@media (prefers-reduced-motion:reduce){
  .cs-footer .cs-footer-social a:hover,.cs-footer #backTo.cs-footer-top-btn:hover{transform:none}
}

/* =========================================================
   Reszponzív
   ========================================================= */
@media (max-width:1024px){
  /* Tableten 2 oszlop: a márka blokk a teljes sort elfoglalja. */
  .cs-footer .cs-footer-top{grid-template-columns:repeat(2,1fr);gap:36px 28px;padding:56px 0 44px}
  .cs-footer .cs-footer-brand{grid-column:1 / -1}
  .cs-footer .cs-footer-desc{max-width:52ch}
}

@media (max-width:600px){
  .cs-footer .cs-footer-top{grid-template-columns:1fr;gap:32px;padding:44px 0 36px}
  .cs-footer .cs-footer-wrap{width:calc(100% - 28px)}
  /* Mobilon egymás alatt: copyright, majd a jogi linkek a gombbal. */
  .cs-footer .cs-footer-legal{flex-direction:column;align-items:flex-start;gap:14px;padding-bottom:22px}
  .cs-footer .cs-footer-legal-links{gap:16px}
  .cs-footer .cs-footer-col h3{margin-bottom:14px}
}