/* ============ Securent Elite – pixel-közeli luxus stílus ============ */
:root{
  --bg0:#050505;
  --bg1:#0a0a0a;
  --ink:#f1efe9;
  --muted:rgba(241,239,233,.74);
  --dim:rgba(241,239,233,.56);
  --gold:#ffd88a;
  --gold2:#ffcf72;
  --goldRGB:255,216,138;
  --line:rgba(255,216,138,.22);
  --cardLine:rgba(255,216,138,.40);
  --cardLineSoft:rgba(255,216,138,.26);
  --glass:rgba(12,12,12,.46);
  --glass2:rgba(12,12,12,.30);
  --shadow:0 24px 90px rgba(0,0,0,.62);
  --radius:18px;
  --radius2:22px;
  --cinzel:"Cinzel", ui-serif, Georgia, serif;
  --inter:"Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Helvetica Neue", sans-serif;
}

*{ box-sizing:border-box; }
html,body{
  margin:0;
  font-family:var(--inter);
  color:var(--ink);
  background:#050505;
  overflow-x:hidden;
}

/* Performance: disable heavy background layers */
.bg{ display:none !important; }


a{ color:inherit; text-decoration:none; }
.container{
  width:min(1120px, calc(100% - 40px));
  margin:0 auto;
}

/* ---------- Background layers (stars + glow + noise) ---------- */
.bg{ position:fixed; inset:0; z-index:-1; }
.bg__stars{
  position:absolute; inset:-40px;
  background:
    radial-gradient(1px 1px at 10% 20%, rgba(255,255,255,.65), transparent 2px),
    radial-gradient(1px 1px at 15% 80%, rgba(255,255,255,.45), transparent 2px),
    radial-gradient(1px 1px at 28% 35%, rgba(255,255,255,.35), transparent 2px),
    radial-gradient(1px 1px at 35% 60%, rgba(255,255,255,.55), transparent 2px),
    radial-gradient(1px 1px at 42% 25%, rgba(255,255,255,.25), transparent 2px),
    radial-gradient(1px 1px at 55% 75%, rgba(255,255,255,.45), transparent 2px),
    radial-gradient(1px 1px at 68% 40%, rgba(255,255,255,.28), transparent 2px),
    radial-gradient(1px 1px at 78% 65%, rgba(255,255,255,.50), transparent 2px),
    radial-gradient(1px 1px at 88% 25%, rgba(255,255,255,.40), transparent 2px);
  opacity:.60;
  filter: blur(.2px);
  animation: drift 16s linear infinite;
}
.bg__glow{
  position:absolute; inset:-120px;
  background:
    radial-gradient(520px 260px at 58% 14%, rgba(var(--goldRGB),.22), transparent 60%),
    radial-gradient(620px 280px at 26% 82%, rgba(var(--goldRGB),.14), transparent 62%),
    radial-gradient(360px 180px at 80% 70%, rgba(255,255,255,.06), transparent 60%);
  opacity:.85;
  filter: blur(10px);
}
.bg__noise{
  position:absolute; inset:0;
  background-image:
    linear-gradient(0deg, rgba(255,255,255,.03), rgba(255,255,255,.03)),
    radial-gradient(circle at 20% 10%, rgba(255,255,255,.06), transparent 34%),
    radial-gradient(circle at 80% 30%, rgba(255,255,255,.04), transparent 42%),
    radial-gradient(circle at 40% 80%, rgba(255,255,255,.03), transparent 46%);
  mix-blend-mode: overlay;
  opacity:.25;
  pointer-events:none;
}
100%{ transform: translate3d(-14px, -10px, 0); }
}

/* ---------- Glass ---------- */
.glass{
  background: var(--glass);
  border: 2px solid var(--cardLine);
  box-shadow: var(--shadow);
  position: relative;
}
.glass:after{
  content:"";
  position:absolute; inset:0;
  border-radius: inherit;
  pointer-events:none;
  box-shadow: 0 0 0 1px rgba(0,0,0,.35) inset, 0 0 26px rgba(255,216,138,.08) inset;
  opacity: .95;
}
@supports ((-webkit-backdrop-filter: blur(14px)) or (backdrop-filter: blur(14px))){
  .glass{
    background: var(--glass2);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }
}

/* ---------- Topbar ---------- */
.topbar{
  position:sticky; top:0; z-index:40;
  background: linear-gradient(180deg, rgba(0,0,0,.62), rgba(0,0,0,.12));
  border-bottom: 1px solid rgba(255,216,138,.10);
  backdrop-filter: blur(10px);
}
.topbar__inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 0;
}
.brand{ display:flex; align-items:center; gap:12px; }
.brand__text{ display:flex; flex-direction:column; line-height:1; }
.brand__name{
  font-family:var(--cinzel);
  letter-spacing:.34em;
  font-size:16px;
}
.brand__sub{
  font-family:var(--inter);
  letter-spacing:.42em;
  font-size:10px;
  opacity:.75;
  margin-top:2px;
}
.nav{ display:flex; gap:22px; }
.nav__link{
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.82;
  transition: opacity .2s ease;
}
.nav__link:hover{ opacity:1; }
.topbar__right{ display:flex; align-items:center; gap:12px; }
.pill{
  display:flex; align-items:center; gap:10px;
  padding:10px 14px;
  border-radius:999px;
  border:2px solid var(--cardLineSoft);
  background: rgba(10,10,10,.35);
  box-shadow: 0 12px 40px rgba(0,0,0,.45);
  font-size:13px;
  opacity:.92;
}
.ico{ opacity:.9; }

/* burger */
.burger{
  width:44px; height:44px;
  border-radius:14px;
  border:2px solid var(--cardLineSoft);
  background: rgba(10,10,10,.28);
  display:none;
  align-items:center; justify-content:center;
  gap:6px;
  box-shadow: 0 16px 55px rgba(0,0,0,.55);
  cursor:pointer;
}
.burger span{
  width:18px; height:2px;
  background: rgba(255,216,138,.78);
  display:block;
  border-radius:2px;
}
.burger span:nth-child(2){ width:14px; opacity:.85; }

/* ---------- Mobile menu ---------- */
.mobile{ position:fixed; inset:0; z-index:60; pointer-events:none; }
.mobile.is-open{ pointer-events:auto; }
.mobile__backdrop{
  position:absolute; inset:0;
  background: rgba(0,0,0,.62);
  opacity:0;
  transition: opacity .22s ease;
}
.mobile.is-open .mobile__backdrop{ opacity:1; }

.mobile__panel{
  position:absolute; right:16px; top:16px;
  width:min(420px, calc(100% - 32px));
  padding:16px;
  border-radius: var(--radius2);
  transform: translateY(-10px);
  opacity:0;
  transition: transform .22s ease, opacity .22s ease;
}
.mobile.is-open .mobile__panel{ transform: translateY(0); opacity:1; }

.mobile__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.x{
  width:42px; height:42px;
  border-radius:14px;
  border:2px solid var(--cardLineSoft);
  background: rgba(10,10,10,.22);
  color: rgba(255,216,138,.9);
  font-size:16px;
  cursor:pointer;
}
.mitem{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 12px;
  border-radius:16px;
  border:2px solid var(--cardLineSoft);
  background: rgba(12,12,12,.22);
  margin-top:10px;
  font-size:14px;
  letter-spacing:.02em;
}
.mitem__ico{ opacity:.9; margin-right:10px; }
.mitem__arr{ opacity:.7; }
.mobile__cta{ margin-top:14px; display:grid; gap:12px; }
.phone--big{
  display:flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 14px; border-radius:18px;
  border:2px solid var(--cardLineSoft);
  background: rgba(10,10,10,.35);
}

/* ---------- Typography ---------- */
.kicker{
  font-family:var(--cinzel);
  letter-spacing:.18em;
  font-size:12px;
  opacity:.82;
}
.h1{
  font-family:var(--cinzel);
  letter-spacing:.06em;
  font-weight:600;
  font-size: clamp(34px, 4.2vw, 54px);
  line-height:1.08;
  margin:10px 0 10px;
  text-transform:uppercase;
}
.h2{
  font-family:var(--cinzel);
  letter-spacing:.12em;
  font-weight:600;
  font-size: clamp(24px, 3vw, 34px);
  line-height:1.16;
  margin:0 0 10px;
  text-transform:uppercase;
}
.lead{
  color:var(--muted);
  font-size:16px;
  line-height:1.7;
  max-width:44ch;
  margin: 0 0 18px;
}
.muted{ color:var(--muted); }
.center{ text-align:center; }
.gold{ color: var(--gold); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:52px;
  padding:0 18px;
  border-radius:16px;
  border:2px solid var(--cardLineSoft);
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:12px;
  cursor:pointer;
  user-select:none;
  transition: transform .16s ease, box-shadow .22s ease, filter .22s ease, background .22s ease;
  white-space:nowrap;
}
.btn--gold{
  color:#221a0c;
  background: linear-gradient(180deg, rgba(255,216,138,.92), rgba(255,194,92,.75));
  box-shadow: 0 18px 60px rgba(var(--goldRGB), .22), 0 1px 0 rgba(255,255,255,.22) inset;
  position:relative;
}
.btn--gold:before{
  content:"";
  position:absolute; inset:-2px;
  border-radius: inherit;
  background: radial-gradient(160px 50px at 50% 0%, rgba(var(--goldRGB), .58), transparent 62%);
  filter: blur(7px);
  opacity:.40;
  pointer-events:none;
}
.btn--gold:hover{ transform: translateY(-1px); filter: saturate(1.07); box-shadow: 0 26px 90px rgba(var(--goldRGB), .28), 0 1px 0 rgba(255,255,255,.24) inset; }
.btn--gold:active{ transform: translateY(1px); }

.btn--ghost{
  background: rgba(12,12,12,.22);
  color: rgba(241,239,233,.92);
}
.btn--ghost:hover{ background: rgba(12,12,12,.32); }
.btn--full{ width:100%; }
.btn--wide{ width:min(360px, 100%); }

/* ---------- Hero ---------- */
.hero{ padding: 42px 0 18px; }
.hero__grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 34px;
  align-items:center;
}
.hero__actions{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:18px; }

.hero__badges{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 18px;
}
.badge{
  padding:14px 14px;
  border-radius: var(--radius);
}
.badge__top{ font-size:12px; color:var(--dim); letter-spacing:.08em; text-transform:uppercase; }
.badge__big{ font-family:var(--cinzel); letter-spacing:.10em; text-transform:uppercase; margin-top:6px; font-size:20px; }
.badge__sub{ margin-top:4px; font-size:12px; color:var(--muted); line-height:1.5; }

/* art */
.hero__art{ position:relative; min-height: 340px; }
.device-wrap{
  position:relative;
  width:100%;
  min-height:420px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 26px;
}
.device-wrap:before{
  content:"";
  position:absolute; inset:-30px -30px -30px -30px;
  background:
    radial-gradient(420px 180px at 60% 30%, rgba(var(--goldRGB), .22), transparent 70%),
    radial-gradient(320px 160px at 30% 70%, rgba(var(--goldRGB), .14), transparent 72%);
  filter: blur(14px);
  opacity:.9;
  pointer-events:none;
}
.device{
  width: min(420px, 92%);
  height: 260px;
  border-radius: 22px;
  border: 1px solid rgba(255,216,138,.22);
  background: linear-gradient(180deg, rgba(18,18,18,.65), rgba(10,10,10,.32));
  box-shadow: 0 38px 120px rgba(0,0,0,.75);
  position:relative;
  overflow:hidden;
}
.device:after{
  content:"";
  position:absolute; inset:-1px;
  background: linear-gradient(120deg, transparent 10%, rgba(255,216,138,.08), transparent 55%);
  opacity:.8;
  pointer-events:none;
}
.device__top{
  display:flex; gap:8px;
  padding:12px 14px;
  border-bottom: 1px solid rgba(255,216,138,.10);
}
.dot{ width:8px; height:8px; border-radius:99px; background: rgba(255,216,138,.38); }
.device__screen{
  padding:18px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
  height: calc(100% - 45px);
}
.mini-brand{
  display:flex; align-items:flex-start; gap:10px;
  font-family:var(--cinzel);
  letter-spacing:.14em;
}
.mini-brand__mark{ font-size:18px; opacity:.9; }
.mini-brand__text{ font-size:13px; opacity:.92; }
.mini-brand__text small{ font-family:var(--inter); letter-spacing:.28em; opacity:.7; }
.keypad{
  border:2px solid var(--cardLineSoft);
  border-radius:18px;
  background: rgba(0,0,0,.22);
  display:flex;
  align-items:center;
  justify-content:center;
}
.keypad__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:10px;
  font-family:var(--cinzel);
  font-size:14px;
  letter-spacing:.12em;
  opacity:.92;
}
.keypad__grid span{
  width:38px; height:30px;
  border-radius:10px;
  border:2px solid var(--cardLineSoft);
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.03);
}

/* cameras */
.cam{
  position:absolute;
  width:120px; height:84px;
  border-radius:18px;
  border:2px solid var(--cardLineSoft);
  background: linear-gradient(180deg, rgba(18,18,18,.72), rgba(8,8,8,.35));
  box-shadow: 0 26px 90px rgba(0,0,0,.70);
  filter: saturate(1.05);
}
.cam:before{
  content:"";
  position:absolute; left:16px; top:18px;
  width:44px; height:44px;
  border-radius:999px;
  border: 2px solid rgba(255,216,138,.40);
  box-shadow: 0 0 0 6px rgba(255,216,138,.10);
}
.cam:after{
  content:"";
  position:absolute; left:28px; top:30px;
  width:20px; height:20px;
  border-radius:999px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.35), rgba(255,216,138,.20), rgba(0,0,0,.75));
}
.cam--left{ left:6%; bottom:26%; transform: rotate(-8deg) scale(.92); }
.cam--mid{ left:24%; bottom:14%; transform: rotate(-4deg) scale(.98); }
.cam--right{ right:6%; bottom:22%; transform: rotate(6deg) scale(.96); }

/* gold sparks */
.spark{ position:absolute; width:180px; height:2px; background: linear-gradient(90deg, transparent, rgba(var(--goldRGB),.55), transparent); filter: blur(.2px); opacity:.9; }
.spark--a{ top:14%; left:8%; transform: rotate(2deg); }
.spark--b{ top:46%; right:12%; transform: rotate(-3deg); width:220px; opacity:.7; }
.spark--c{ bottom:10%; left:18%; transform: rotate(1deg); width:240px; opacity:.6; }

/* ---------- Trio ---------- */
.trio{ margin-top: 14px; }
.trio__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  padding: 24px 0;
}
.card{
  border-radius: var(--radius2);
  padding: 22px 18px;
  position:relative;
}
.card:before{
  content:"";
  position:absolute; inset:-1px;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,216,138,.18), transparent 65%);
  opacity:.45;
  pointer-events:none;
}
.card__ico{ font-size:18px; opacity:.9; }
.card__title{
  font-family:var(--cinzel);
  letter-spacing:.14em;
  font-size:14px;
  margin: 12px 0 8px;
}
.card__text{ color:var(--muted); font-size:13px; line-height:1.7; margin:0; }
.trio__line{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(255,216,138,.55), transparent);
  opacity:.55;
}

/* ---------- Configurator ---------- */
.config{ padding: 40px 0 34px; }
.config__head{ text-align:center; max-width: 860px; margin:0 auto 18px; }
.config__grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:16px;
  align-items:stretch;
}
.config__panel{
  border-radius: 22px;
  padding: 18px;
}
.panel__title{ display:flex; gap:12px; align-items:center; margin-bottom:12px; }
.panel__mark{
  width:42px; height:42px;
  display:flex; align-items:center; justify-content:center;
  border-radius:14px;
  border:2px solid var(--cardLineSoft);
  background: rgba(0,0,0,.18);
}
.panel__kicker{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--dim); }
.panel__name{ font-family:var(--cinzel); letter-spacing:.18em; text-transform:uppercase; }

.tabs{ display:flex; gap:10px; margin-top:10px; flex-wrap:wrap; }
.tab{
  height:44px;
  padding:0 14px;
  border-radius: 14px;
  border:2px solid var(--cardLineSoft);
  background: rgba(12,12,12,.18);
  color: rgba(241,239,233,.86);
  letter-spacing:.10em;
  text-transform:uppercase;
  font-size:11px;
  cursor:pointer;
}
.tab--active{
  background: linear-gradient(180deg, rgba(255,216,138,.20), rgba(12,12,12,.18));
  border-color: rgba(255,216,138,.32);
  box-shadow: 0 18px 60px rgba(var(--goldRGB), .12);
}
.options{ margin-top:14px; display:grid; gap:10px; }
.opt{
  display:flex; gap:10px; align-items:center;
  padding:12px 12px;
  border-radius:14px;
  border:2px solid var(--cardLineSoft);
  background: rgba(0,0,0,.14);
  font-size:13px;
}
.opt input{ accent-color: var(--gold); }

.billing{
  margin-top:14px;
  display:flex; gap:14px; flex-wrap:wrap;
  padding:12px 12px;
  border-radius:16px;
  border:2px solid var(--cardLineSoft);
  background: rgba(0,0,0,.12);
}
.radio{ display:flex; gap:10px; align-items:center; color: rgba(241,239,233,.82); font-size:13px; }
.radio input{ accent-color: var(--gold); }
.panel__cta{ margin-top:16px; display:flex; justify-content:center; }

/* quote card */
.quote{
  border-radius: 22px;
  padding: 18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.quote__head{
  display:flex; align-items:center; justify-content:space-between;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,216,138,.12);
}
.qbrand{ display:flex; align-items:center; gap:10px; }
.qbrand__mark{
  width:34px; height:34px;
  display:flex; align-items:center; justify-content:center;
  border-radius:12px;
  border:2px solid var(--cardLineSoft);
  background: rgba(0,0,0,.18);
}
.qbrand__name{ font-family:var(--cinzel); letter-spacing:.18em; font-size:12px; }
.qbrand__sub{ letter-spacing:.36em; font-size:10px; opacity:.72; }
.quote__phone{ color: rgba(241,239,233,.78); font-size:12px; letter-spacing:.12em; }
.quote__steps{ display:grid; gap:10px; }
.step{
  display:flex; align-items:center; gap:12px;
  padding:10px 10px;
  border-radius:14px;
  border:2px solid var(--cardLineSoft);
  background: rgba(0,0,0,.12);
}
.step .n{
  width:26px; height:26px;
  border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,216,138,.22);
  background: rgba(255,216,138,.10);
  color: rgba(255,216,138,.92);
  font-family:var(--cinzel);
}
.quote__price{ padding:12px 10px; border-radius:16px; border:1px solid rgba(255,216,138,.10); background: rgba(0,0,0,.12); }
.price__label{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color: var(--dim); }
.price__num{ margin-top:6px; font-family:var(--cinzel); letter-spacing:.10em; font-size:22px; color: rgba(255,216,138,.92); }

/* ---------- Services ---------- */
.services{ padding: 34px 0 46px; }
.services__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 18px;
}
.svc{
  border-radius: 22px;
  padding: 22px 18px;
}
.svc__ico{ font-size:18px; opacity:.9; }
.svc__title{ font-family:var(--cinzel); letter-spacing:.14em; font-size:14px; margin:12px 0 8px; }
.svc__text{ margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.services__line{
  margin-top: 34px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(255,216,138,.55), transparent);
  opacity:.55;
}

/* ---------- Footer ---------- */
.footer{ padding: 40px 0 26px; border-top: 1px solid rgba(255,216,138,.10); }
.footer__grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items:start;
}
.footer__card{
  border-radius: 22px;
  padding: 18px;
  display:grid;
  gap: 12px;
}
.row{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 10px; border-radius:14px; border:1px solid rgba(255,216,138,.10); background: rgba(0,0,0,.12); }
.link{ color: rgba(255,216,138,.92); letter-spacing:.06em; }
.footer__bottom{
  display:flex; align-items:center; justify-content:space-between;
  padding-top: 18px;
  margin-top: 18px;
  border-top: 1px solid rgba(255,216,138,.10);
  color: rgba(241,239,233,.70);
  font-size: 12px;
  letter-spacing: .06em;
}

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .hero__grid{ grid-template-columns: 1fr; }
  .hero__art{ min-height: 360px; }
  .hero__badges{ grid-template-columns: 1fr; }
  .trio__grid{ grid-template-columns: 1fr; }
  .config__grid{ grid-template-columns: 1fr; }
  .services__grid{ grid-template-columns: 1fr; }
  .footer__grid{ grid-template-columns: 1fr; }
  .nav--desktop{ display:none; }
  .burger{ display:flex; }
  .pill{ display:none; }
  .device-wrap{ min-height: 460px; }
}

@media (prefers-reduced-motion: no-preference){
  .btn--gold:before{ animation: shimmer 2.8s ease-in-out infinite; }
  @keyframes shimmer{
    0%,100%{ opacity:.30; transform: translateY(0); }
    50%{ opacity:.55; transform: translateY(-1px); }
  }
}


/* --- HERO photoreal render (mockup-like) --- */
.heroRenderWrap{
  position:relative;
  width: min(640px, 100%);
  margin-left:auto;
  padding: 10px 0;
}
.heroRenderWrap:before{ display:none !important; }
.heroRender{
  width:100%;
  height:auto;
  display:block;
  filter: drop-shadow(0 30px 90px rgba(0,0,0,.72));
  border-radius: 18px;
}
@media (max-width: 980px){
  .heroRenderWrap{
    width: min(520px, 100%);
    margin: 0 auto;
  }
}


/* --- Card borders: thick gold (override) --- */
.glass{
  border: 2px solid rgba(255,216,138,.58) !important;
}
.badge.glass, .card.glass, .svc.glass, .config__panel.glass, .quote.glass, .footer__card.glass{
  border: 2px solid rgba(255,216,138,.58) !important;
}


/* --- Mobile hero image placement --- */
.hero__art--mobile{ display:none; }



/* --- Mobile hero image placement (final) --- */
.hero__art--mobile{ display:none; }
@media (max-width: 980px){
  .hero__art--desktop{ display:none !important; }
  .hero__art--mobile{ display:block !important; margin: 16px 0 14px; }
}


/* === Premium arany glow keret minden kártyára (piros jelölés stílus) === */
.glass{
  position: relative !important;
  border: none !important;
  background-clip: padding-box;
  overflow: hidden;
}

.glass::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  padding: 3px; /* vastagság */
  background: linear-gradient(
    135deg,
    rgba(255,216,138,.95),
    rgba(255,216,138,.22),
    rgba(255,216,138,.85)
  );
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events:none;
  opacity: .95;
}

.glass::after{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius: inherit;
  pointer-events:none;
  box-shadow:
    0 0 0 1px rgba(255,216,138,.18) inset,
    0 0 24px rgba(255,216,138,.12),
    0 0 70px rgba(255,216,138,.08);
  opacity: .9;
}




/* --- Hero devices size: -50% on mobile (0.5x) + transparent background --- */
@media (max-width: 980px){
  .hero__art--mobile{
    background: transparent !important;
  }
  .hero__art--mobile .heroRenderWrap{
    width: 100% !important;
    margin: 14px auto 10px !important;
    overflow: visible !important;
    display:flex;
    justify-content:center;
    background: transparent !important;
  }
  .hero__art--mobile .heroRender{
    transform: scale(0.9);
transform-origin: 50% 50%;
    background: transparent !important;
  }
}


/* --- Ensure hero image itself has no background/backdrop --- */
.heroRender, .heroRenderWrap, .hero__art{
  background: transparent !important;
}


/* --- Logo +100% everywhere --- */
.brand img, .brand .logo, .nav__brand img, header img[alt*="Securent"], header img[alt*="SECURENT"]{
  height: 44px !important;
  width: auto !important;
}
@media (max-width: 980px){
  .brand img, .nav__brand img, header img[alt*="Securent"], header img[alt*="SECURENT"]{
    height: 42px !important;
  }
}


/* --- Devices +50% on desktop --- */
@media (min-width: 981px){
  .hero__art--desktop .heroRender{
    transform: scale(1.5);
    transform-origin: 50% 50%;
  }
  .hero__art--desktop .heroRenderWrap{
    overflow: visible !important;
  }
}


/* --- Force transparent background around hero art --- */
.hero__art, .heroRenderWrap, .heroRender{
  background: transparent !important;
}