
    :root {
      --bg:       #07090F;
      --bg2:      #0C0F1A;
      --bg3:      #111827;
      --border:   rgba(255,255,255,0.07);
      --border2:  rgba(255,255,255,0.12);
      --text:     #E8EAF2;
      --muted:    #64748B;
      --muted2:   #94A3B8;
      --primary:  #4F6EF7;
      --pg:       rgba(79,110,247,0.18);
      --pg2:      rgba(79,110,247,0.08);
      --accent:   #00D4AA;
      --ag:       rgba(0,212,170,0.15);
      --purple:   #A78BFA;
      --orange:   #FB923C;
      --pink:     #F472B6;
      --fd: 'Syne', sans-serif;
      --fb: 'DM Sans', sans-serif;
      --max: 1240px;
      --px: clamp(20px, 5vw, 80px);
      --py: clamp(72px, 11vw, 128px);
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }

    body {
      font-family: var(--fb);
      background: var(--bg);
      color: var(--text);
      font-size: 16px;
      line-height: 1.7;
      font-weight: 300;
      overflow-x: hidden;
    }

    /* ─── NOISE ─── */
    body::after {
      content: '';
      position: fixed;
      inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
      opacity: .025;
      pointer-events: none;
      z-index: 9999;
    }

    /* ─── NAV ─── */
    nav {
      position: sticky; top: 0; z-index: 500;
      display: flex; align-items: center; justify-content: space-between;
      padding: 8px var(--px);
      min-height: 122px;
      background: rgba(7,9,15,0.88);
      backdrop-filter: blur(24px);
      border-bottom: 1px solid var(--border);
    }

    .nav__logo {
      font-family: var(--fd);
      font-size: 19px; font-weight: 800;
      text-decoration: none; color: var(--text);
      letter-spacing: -0.02em;
      display: flex; align-items: center; gap: 10px;
    }

    .brand-logo {
      display: block;
      width: auto;
      max-width: 100%;
      object-fit: contain;
    }

    .nav__logo-img {
      height: clamp(84px, 8.8vw, 104px);
      max-width: min(430px, 58vw);
    }

    .footer__logo-img {
      height: clamp(68px, 6.8vw, 84px);
      max-width: min(380px, 82vw);
    }

    .pulse {
      width: 8px; height: 8px;
      background: var(--accent);
      border-radius: 50%;
      box-shadow: 0 0 10px var(--accent);
      animation: blink 2s ease-in-out infinite;
    }

    @keyframes blink {
      0%,100%{transform:scale(1);opacity:1}
      50%{transform:scale(1.5);opacity:.6}
    }

    .nav__list {
      display: flex; gap: 32px; list-style: none; align-items: center;
    }

    .nav__list a {
      text-decoration: none; color: var(--muted);
      font-size: 13px; font-weight: 400;
      transition: color .2s;
    }

    .nav__list a:hover { color: var(--text); }

    .nav__btn {
      background: var(--primary); color: #fff !important;
      padding: 9px 22px; border-radius: 7px;
      font-weight: 500 !important; font-size: 13px !important;
      transition: background .2s, box-shadow .2s !important;
    }

    .nav__btn:hover {
      background: #3d5ae0 !important;
      box-shadow: 0 0 24px var(--pg) !important;
    }

    .burger {
      display: none; flex-direction: column; gap: 5px;
      cursor: pointer; background: none; border: none; padding: 4px;
    }

    .burger span {
      display: block; width: 22px; height: 1.5px;
      background: var(--text); transition: .3s;
    }

    /* ─── HERO ─── */
    .hero {
      position: relative;
      min-height: 96vh;
      display: flex; flex-direction: column;
      align-items: center; justify-content: center;
      text-align: center;
      padding: 80px var(--px) 60px;
      overflow: hidden;
    }

    .hero__grid {
      position: absolute; inset: 0;
      background-image:
        linear-gradient(rgba(79,110,247,0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(79,110,247,0.06) 1px, transparent 1px);
      background-size: 64px 64px;
      mask-image: radial-gradient(ellipse 80% 65% at 50% 50%, black 30%, transparent 100%);
    }

    .hero__orb1 {
      position: absolute; width: 700px; height: 700px;
      background: radial-gradient(circle, rgba(79,110,247,0.13) 0%, transparent 65%);
      top: -180px; left: 50%; transform: translateX(-50%);
      pointer-events: none;
    }

    .hero__orb2 {
      position: absolute; width: 500px; height: 500px;
      background: radial-gradient(circle, rgba(0,212,170,0.08) 0%, transparent 65%);
      bottom: -80px; right: -120px;
      pointer-events: none;
    }

    .badge {
      position: relative; z-index: 2;
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(79,110,247,0.1);
      border: 1px solid rgba(79,110,247,0.28);
      padding: 6px 18px; border-radius: 100px;
      font-size: 12px; letter-spacing: .08em; font-weight: 500;
      color: #a5b4fc; margin-bottom: 28px;
    }

    .badge__dot { width: 6px; height: 6px; background: #a5b4fc; border-radius: 50%; animation: blink 1.5s ease-in-out infinite; }

    h1.hero__title {
      position: relative; z-index: 2;
      font-family: var(--fd);
      font-size: clamp(40px, 6.5vw, 84px);
      font-weight: 800; line-height: 1.0;
      letter-spacing: -0.03em;
      margin-bottom: 24px; max-width: 960px;
    }

    .grad {
      background: linear-gradient(135deg, #4F6EF7 0%, #00D4AA 55%, #A78BFA 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .hero__sub {
      position: relative; z-index: 2;
      font-size: clamp(16px, 1.8vw, 19px);
      color: var(--muted2);
      max-width: 600px; margin-bottom: 48px;
    }

    .hero__btns {
      position: relative; z-index: 2;
      display: flex; gap: 14px; flex-wrap: wrap; justify-content: center;
    }

    .btn {
      display: inline-flex; align-items: center; gap: 8px;
      text-decoration: none; font-family: var(--fb);
      font-size: 14px; font-weight: 500;
      padding: 14px 30px; border-radius: 8px;
      transition: .25s; cursor: pointer; border: none; outline: none;
    }

    .btn--pri { background: var(--primary); color: #fff; }
    .btn--pri:hover { background: #3d5ae0; box-shadow: 0 0 32px var(--pg); transform: translateY(-1px); }
    .btn--ghost { background: transparent; color: var(--text); border: 1px solid var(--border2); }
    .btn--ghost:hover { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.22); }

    .hero__modules {
      position: relative; z-index: 2;
      display: flex; gap: 10px; flex-wrap: wrap;
      justify-content: center; margin-top: 52px;
    }

    .module-pill {
      display: flex; align-items: center; gap: 8px;
      background: var(--bg2);
      border: 1px solid var(--border);
      padding: 8px 16px; border-radius: 8px;
      font-size: 13px; font-weight: 500;
      transition: border-color .2s, background .2s;
      cursor: default;
    }

    .module-pill:hover { border-color: rgba(79,110,247,0.4); background: var(--pg2); }
    .module-pill__dot { width: 7px; height: 7px; border-radius: 50%; }
    .c1 { background: var(--primary); box-shadow: 0 0 8px var(--primary); }
    .c2 { background: var(--accent); box-shadow: 0 0 8px var(--accent); }
    .c3 { background: var(--purple); box-shadow: 0 0 8px var(--purple); }
    .c4 { background: var(--orange); box-shadow: 0 0 8px var(--orange); }
    .c5 { background: var(--pink); box-shadow: 0 0 8px var(--pink); }

    /* ─── STATS ─── */
    .stats {
      display: grid; grid-template-columns: repeat(5,1fr);
      border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
      background: var(--bg2);
    }

    .stat {
      padding: 32px 20px; text-align: center;
      border-right: 1px solid var(--border);
    }

    .stat:last-child { border-right: none; }

    .stat__n {
      font-family: var(--fd);
      font-size: clamp(26px,3vw,40px); font-weight: 700;
      line-height: 1.1;
      background: linear-gradient(135deg, var(--primary), var(--accent));
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }

    .stat__l { font-size: 12px; color: var(--muted); margin-top: 6px; }

    /* ─── SECTIONS ─── */
    .wrap {
      max-width: var(--max);
      margin: 0 auto;
      padding: var(--py) var(--px);
    }

    .eyebrow {
      font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
      color: var(--accent); margin-bottom: 14px; font-weight: 500;
    }

    .s-title {
      font-family: var(--fd);
      font-size: clamp(28px, 3.8vw, 50px);
      font-weight: 700; letter-spacing: -.02em;
      line-height: 1.15; margin-bottom: 14px;
    }

    .s-sub {
      color: var(--muted2); font-size: 16px;
      max-width: 540px; margin-bottom: 56px;
    }

    /* ─── MODULES GRID ─── */
    #moduly { background: var(--bg); }

    .modules-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
    }

    .mcard {
      background: var(--bg2);
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 36px 32px;
      position: relative; overflow: hidden;
      transition: border-color .3s, transform .3s, box-shadow .3s;
      cursor: default;
    }

    .mcard:hover {
      transform: translateY(-4px);
      box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    }

    .mcard--wide { grid-column: span 2; }

    .mcard__glow {
      position: absolute; width: 300px; height: 300px;
      border-radius: 50%; opacity: 0;
      transition: opacity .4s;
      pointer-events: none;
      top: -80px; right: -80px;
    }

    .mcard:hover .mcard__glow { opacity: 1; }

    .mcard--blue:hover  { border-color: rgba(79,110,247,0.45); }
    .mcard--green:hover { border-color: rgba(0,212,170,0.4); }
    .mcard--purple:hover{ border-color: rgba(167,139,250,0.4); }
    .mcard--orange:hover{ border-color: rgba(251,146,60,0.4); }
    .mcard--pink:hover  { border-color: rgba(244,114,182,0.4); }

    .mcard--blue   .mcard__glow { background: radial-gradient(circle, rgba(79,110,247,0.15) 0%, transparent 70%); }
    .mcard--green  .mcard__glow { background: radial-gradient(circle, rgba(0,212,170,0.12) 0%, transparent 70%); }
    .mcard--purple .mcard__glow { background: radial-gradient(circle, rgba(167,139,250,0.12) 0%, transparent 70%); }
    .mcard--orange .mcard__glow { background: radial-gradient(circle, rgba(251,146,60,0.12) 0%, transparent 70%); }
    .mcard--pink   .mcard__glow { background: radial-gradient(circle, rgba(244,114,182,0.12) 0%, transparent 70%); }

    .mcard__header {
      display: flex; align-items: flex-start;
      justify-content: space-between; margin-bottom: 20px;
    }

    .mcard__icon {
      width: 52px; height: 52px;
      border-radius: 12px;
      display: flex; align-items: center; justify-content: center;
    }

    .mcard__icon--blue   { background: rgba(79,110,247,0.12); border: 1px solid rgba(79,110,247,0.2); }
    .mcard__icon--green  { background: rgba(0,212,170,0.1); border: 1px solid rgba(0,212,170,0.2); }
    .mcard__icon--purple { background: rgba(167,139,250,0.1); border: 1px solid rgba(167,139,250,0.2); }
    .mcard__icon--orange { background: rgba(251,146,60,0.1); border: 1px solid rgba(251,146,60,0.2); }
    .mcard__icon--pink   { background: rgba(244,114,182,0.1); border: 1px solid rgba(244,114,182,0.2); }

    .mcard__name {
      font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
      font-weight: 600; padding: 5px 12px; border-radius: 6px;
    }

    .mcard__name--blue   { color: #a5b4fc; background: rgba(79,110,247,0.1); }
    .mcard__name--green  { color: #6ee7b7; background: rgba(0,212,170,0.1); }
    .mcard__name--purple { color: #c4b5fd; background: rgba(167,139,250,0.1); }
    .mcard__name--orange { color: #fdba74; background: rgba(251,146,60,0.1); }
    .mcard__name--pink   { color: #f9a8d4; background: rgba(244,114,182,0.1); }

    .mcard__title {
      font-family: var(--fd);
      font-size: clamp(18px,2vw,24px); font-weight: 700;
      letter-spacing: -.01em; margin-bottom: 10px;
    }

    .mcard__desc {
      color: var(--muted2); font-size: 14px; line-height: 1.7;
      margin-bottom: 24px;
    }

    .mcard__features {
      display: flex; flex-direction: column; gap: 9px;
    }

    .feat {
      display: flex; align-items: flex-start; gap: 10px;
      font-size: 13px; color: var(--muted2);
    }

    .feat__check {
      width: 18px; height: 18px; border-radius: 5px;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0; margin-top: 2px;
    }

    .feat__check--blue   { background: rgba(79,110,247,0.15); }
    .feat__check--green  { background: rgba(0,212,170,0.12); }
    .feat__check--purple { background: rgba(167,139,250,0.12); }
    .feat__check--orange { background: rgba(251,146,60,0.12); }
    .feat__check--pink   { background: rgba(244,114,182,0.12); }

    /* ─── HOW IT WORKS ─── */
    .hiw { background: var(--bg2); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }

    .steps {
      display: grid; grid-template-columns: repeat(4,1fr);
      gap: 0; position: relative;
    }

    .steps::before {
      content: '';
      position: absolute; top: 44px; left: 10%; right: 10%; height: 1px;
      background: linear-gradient(90deg, transparent, var(--primary), var(--accent), transparent);
      opacity: .35;
    }

    .step {
      padding: 0 28px 0;
      text-align: center; position: relative;
    }

    .step__bubble {
      width: 56px; height: 56px; border-radius: 14px;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 20px;
      font-family: var(--fd); font-size: 20px; font-weight: 800;
      position: relative; z-index: 2;
      border: 1px solid var(--border2);
      background: var(--bg3);
    }

    .step:nth-child(1) .step__bubble { color: var(--primary); border-color: rgba(79,110,247,.3); }
    .step:nth-child(2) .step__bubble { color: var(--accent);  border-color: rgba(0,212,170,.3); }
    .step:nth-child(3) .step__bubble { color: var(--purple);  border-color: rgba(167,139,250,.3); }
    .step:nth-child(4) .step__bubble { color: var(--orange);  border-color: rgba(251,146,60,.3); }

    .step__title { font-family: var(--fd); font-size: 16px; font-weight: 600; margin-bottom: 8px; }
    .step__desc  { color: var(--muted); font-size: 13px; line-height: 1.65; }

    /* ─── INTEL DEEP DIVE ─── */
    .intel-grid {
      display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center;
    }

    .intel-visual {
      background: var(--bg2); border: 1px solid var(--border);
      border-radius: 14px; padding: 28px; position: relative;
    }

    .intel-visual__bar { margin-bottom: 10px; }

    .ibar {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 8px; font-size: 12px; color: var(--muted2);
    }

    .ibar__label { width: 110px; flex-shrink: 0; font-size: 11px; }
    .ibar__track { flex: 1; height: 6px; background: var(--bg3); border-radius: 4px; overflow: hidden; }
    .ibar__fill { height: 100%; border-radius: 4px; transition: width 1.5s ease; width: 0; }
    .ibar__fill--blue   { background: linear-gradient(90deg, var(--primary), #818cf8); }
    .ibar__fill--green  { background: linear-gradient(90deg, var(--accent), #34d399); }
    .ibar__fill--purple { background: linear-gradient(90deg, var(--purple), #c084fc); }
    .ibar__fill--orange { background: linear-gradient(90deg, var(--orange), #fbbf24); }
    .ibar__val  { width: 32px; text-align: right; font-size: 11px; color: var(--muted2); flex-shrink: 0; }

    .intel-visual__tags {
      display: flex; flex-wrap: wrap; gap: 6px; margin-top: 20px;
    }

    .itag {
      font-size: 11px; padding: 4px 10px; border-radius: 5px;
      font-weight: 500; background: var(--bg3); border: 1px solid var(--border);
      color: var(--muted2);
    }

    .itag--hot { background: rgba(251,146,60,0.1); border-color: rgba(251,146,60,.25); color: #fdba74; }

    .intel-list { display: flex; flex-direction: column; gap: 16px; }

    .intel-item {
      display: flex; gap: 16px; align-items: flex-start;
      padding: 18px 20px;
      background: var(--bg2); border: 1px solid var(--border);
      border-radius: 10px; transition: border-color .25s;
    }

    .intel-item:hover { border-color: rgba(167,139,250,.35); }

    .intel-item__icon {
      width: 40px; height: 40px; border-radius: 9px;
      background: rgba(167,139,250,0.1);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }

    .intel-item__title { font-family: var(--fd); font-size: 14px; font-weight: 600; margin-bottom: 4px; }
    .intel-item__desc  { color: var(--muted); font-size: 13px; line-height: 1.6; }

    /* ─── SMS VISUAL ─── */
    .sms-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }

    .phone {
      width: 260px; margin: 0 auto;
      background: var(--bg3);
      border: 1.5px solid var(--border2);
      border-radius: 36px;
      padding: 40px 20px 30px;
      position: relative;
      box-shadow: 0 32px 80px rgba(0,0,0,0.5);
    }

    .phone::before {
      content: '';
      position: absolute; top: 14px; left: 50%; transform: translateX(-50%);
      width: 60px; height: 5px;
      background: var(--border2); border-radius: 4px;
    }

    .sms-bubble {
      background: var(--bg2); border: 1px solid var(--border);
      border-radius: 12px 12px 12px 3px;
      padding: 12px 14px; font-size: 12px;
      line-height: 1.6; color: var(--text);
      margin-bottom: 10px;
    }

    .sms-bubble--out {
      background: var(--primary);
      border-radius: 12px 12px 3px 12px;
      color: #fff; margin-left: 20px;
    }

    .sms-time { font-size: 10px; color: var(--muted); text-align: center; margin: 8px 0; }

    .sms-features { display: flex; flex-direction: column; gap: 14px; }

    .sms-feat {
      display: flex; gap: 14px; align-items: flex-start;
      padding: 16px 18px; border-radius: 10px;
      background: var(--bg2); border: 1px solid var(--border);
      font-size: 13px; transition: border-color .25s;
    }

    .sms-feat:hover { border-color: rgba(0,212,170,.35); }

    .sms-feat__icon {
      width: 36px; height: 36px; border-radius: 8px;
      background: rgba(0,212,170,0.1);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }

    .sms-feat__title { font-weight: 500; font-size: 13px; margin-bottom: 2px; }
    .sms-feat__desc  { color: var(--muted); font-size: 12px; line-height: 1.5; }

    /* ─── INDUSTRIES ─── */
    .ind-bg { background: var(--bg2); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }

    .ind-grid {
      display: grid; grid-template-columns: repeat(4,1fr);
      gap: 10px;
    }

    .ind-tag {
      background: var(--bg3); border: 1px solid var(--border);
      border-radius: 9px; padding: 16px 18px;
      display: flex; align-items: center; gap: 12px;
      font-size: 13px; font-weight: 400;
      transition: .2s;
    }

    .ind-tag:hover { border-color: rgba(79,110,247,.35); background: var(--pg2); }
    .ind-tag__e { font-size: 20px; }

    /* ─── CTA ─── */
    .cta-wrap {
      padding: var(--py) var(--px);
      text-align: center; position: relative; overflow: hidden;
    }

    .cta-wrap::before {
      content: '';
      position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
      width: 900px; height: 500px;
      background: radial-gradient(ellipse, rgba(79,110,247,0.11) 0%, transparent 65%);
      pointer-events: none;
    }

    .cta-title {
      font-family: var(--fd);
      font-size: clamp(30px, 5vw, 60px); font-weight: 800;
      letter-spacing: -.03em; line-height: 1.1;
      margin-bottom: 18px; position: relative; z-index: 1;
    }

    .cta-sub {
      color: var(--muted2); font-size: 17px;
      margin-bottom: 44px; position: relative; z-index: 1;
    }

    .cta-form {
      display: flex; gap: 12px; max-width: 460px;
      margin: 0 auto; position: relative; z-index: 1;
    }

    .cta-form input {
      flex: 1; background: var(--bg2); border: 1px solid var(--border2);
      color: var(--text); padding: 14px 18px;
      border-radius: 8px; font-family: var(--fb); font-size: 15px;
      outline: none; transition: border-color .25s;
    }

    .cta-form input:focus { border-color: var(--primary); }
    .cta-form input::placeholder { color: var(--muted); }

    .cta-note {
      color: var(--muted); font-size: 12px;
      margin-top: 16px; position: relative; z-index: 1;
    }

    /* ─── FOOTER ─── */
    footer {
      border-top: 1px solid var(--border);
      padding: 36px var(--px);
      display: flex; justify-content: space-between; align-items: center;
      flex-wrap: wrap; gap: 16px;
    }

    .footer__logo {
      font-family: var(--fd); font-size: 17px; font-weight: 800;
      color: var(--text); display: flex; align-items: center; gap: 8px;
    }

    .footer__links {
      display: flex; gap: 28px; list-style: none;
    }

    .footer__links a {
      text-decoration: none; color: var(--muted);
      font-size: 13px; transition: color .2s;
    }

    .footer__links a:hover { color: var(--text); }
    .footer__copy { color: var(--muted); font-size: 12px; }

    /* ─── ANIMATIONS ─── */
    .fade-in {
      opacity: 0; transform: translateY(28px);
      transition: opacity .7s ease, transform .7s ease;
    }

    .fade-in.visible { opacity: 1; transform: none; }

    /* ─── RESPONSIVE ─── */
    @media (max-width: 1024px) {
      .modules-grid { grid-template-columns: 1fr 1fr; }
      .mcard--wide { grid-column: span 2; }
      .steps { grid-template-columns: repeat(2,1fr); gap: 32px; }
      .steps::before { display: none; }
      .intel-grid { grid-template-columns: 1fr; }
      .sms-grid { grid-template-columns: 1fr; }
      .stats { grid-template-columns: repeat(3,1fr); }
      .stat:nth-child(4) { border-top: 1px solid var(--border); }
    }

    @media (max-width: 700px) {
      .modules-grid { grid-template-columns: 1fr; }
      .mcard--wide { grid-column: span 1; }
      .nav__list { display: none; flex-direction: column; position: absolute; top: 100%; left: 0; right: 0; background: rgba(7,9,15,.97); padding: 24px var(--px); border-bottom: 1px solid var(--border); gap: 20px; }
      .nav__list.open { display: flex; }
      .burger { display: flex; }
      .nav__logo-img { height: 78px; max-width: 300px; }
      .steps { grid-template-columns: 1fr; }
      .ind-grid { grid-template-columns: repeat(2,1fr); }
      .stats { grid-template-columns: repeat(2,1fr); }
      .cta-form { flex-direction: column; }
      footer { flex-direction: column; text-align: center; }
      .hero__modules { display: none; }
    }


    /* ─── MODERN CLASSIC / STONOWANY REDESIGN ─── */
    :root {
      --bg:       #0B0D10;
      --bg2:      #11151B;
      --bg3:      #171D25;
      --border:   rgba(214, 199, 167, 0.12);
      --border2:  rgba(214, 199, 167, 0.22);
      --text:     #F4F0E8;
      --muted:    #8E96A3;
      --muted2:   #BAC0C8;
      --primary:  #D6C7A7;
      --pg:       rgba(214,199,167,0.18);
      --pg2:      rgba(214,199,167,0.08);
      --accent:   #BFA36A;
      --ag:       rgba(191,163,106,0.14);
      --purple:   #A7AFC0;
      --orange:   #C99A6B;
      --pink:     #C8A3A5;
      --radius:   18px;
      --shadow:   0 28px 80px rgba(0,0,0,.34);
    }

    body {
      background:
        radial-gradient(circle at 20% 0%, rgba(214,199,167,.08), transparent 34%),
        linear-gradient(180deg, #0B0D10 0%, #10141A 48%, #0B0D10 100%);
      letter-spacing: -0.005em;
    }

    body::after { opacity: .015; }

    nav {
      background: rgba(11,13,16,.82);
      border-bottom: 1px solid rgba(214,199,167,.12);
      box-shadow: 0 16px 42px rgba(0,0,0,.2);
    }

    .nav__logo, .footer__logo { letter-spacing: -.03em; }
    .pulse { background: var(--accent); box-shadow: none; animation: none; }
    .nav__list a { color: #A9AFB9; }
    .nav__btn, .btn--pri {
      background: linear-gradient(135deg, #D6C7A7 0%, #BFA36A 100%);
      color: #11151B !important;
      border: 1px solid rgba(255,255,255,.16);
      box-shadow: 0 12px 34px rgba(191,163,106,.16);
    }
    .nav__btn:hover, .btn--pri:hover {
      background: linear-gradient(135deg, #E3D7BF 0%, #C9AE78 100%) !important;
      box-shadow: 0 18px 48px rgba(191,163,106,.22) !important;
    }
    .btn--ghost {
      background: rgba(255,255,255,.025);
      border-color: rgba(214,199,167,.2);
      color: var(--text);
    }

    .hero { min-height: 88vh; }
    .hero__grid {
      background-image:
        linear-gradient(rgba(214,199,167,0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(214,199,167,0.045) 1px, transparent 1px);
      background-size: 82px 82px;
      mask-image: radial-gradient(ellipse 75% 60% at 50% 45%, black 28%, transparent 100%);
    }
    .hero__orb1 { background: radial-gradient(circle, rgba(214,199,167,.12) 0%, transparent 66%); }
    .hero__orb2 { background: radial-gradient(circle, rgba(191,163,106,.08) 0%, transparent 66%); }
    .badge {
      background: rgba(214,199,167,.08);
      border-color: rgba(214,199,167,.22);
      color: #D6C7A7;
      letter-spacing: .12em;
    }
    .badge__dot { background: #D6C7A7; animation: none; }
    .grad {
      background: linear-gradient(135deg, #F4F0E8 0%, #D6C7A7 52%, #A9AFB9 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    h1.hero__title { max-width: 1040px; }
    .hero__sub { color: #C0C5CC; max-width: 680px; }

    .stats, .hiw, .ind-bg, section[style*="background:var(--bg2)"] {
      background: rgba(17,21,27,.72) !important;
      backdrop-filter: blur(18px);
      border-color: rgba(214,199,167,.12) !important;
    }
    .stat__n {
      background: linear-gradient(135deg, #F4F0E8, #BFA36A);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }

    .mcard, .intel-visual, .intel-item, .sms-feat, .phone, .ind-tag {
      background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
      border-color: rgba(214,199,167,.13);
      border-radius: var(--radius);
      box-shadow: 0 1px 0 rgba(255,255,255,.04) inset;
    }
    .mcard:hover, .intel-item:hover, .sms-feat:hover, .ind-tag:hover {
      border-color: rgba(214,199,167,.32);
      box-shadow: var(--shadow);
      background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
    }
    .mcard__icon, .step__bubble, .sms-feat__icon, .intel-item__icon {
      border-radius: 14px;
      background: rgba(214,199,167,.08) !important;
      border: 1px solid rgba(214,199,167,.16) !important;
    }
    .mcard__name {
      background: rgba(214,199,167,.08) !important;
      color: #D6C7A7 !important;
      border: 1px solid rgba(214,199,167,.12);
    }
    .feat__check { background: rgba(214,199,167,.1) !important; }
    .eyebrow { color: #D6C7A7; }

    .cta-wrap {
      background:
        linear-gradient(180deg, rgba(17,21,27,.2), rgba(17,21,27,.86)),
        radial-gradient(circle at 50% 0%, rgba(214,199,167,.14), transparent 52%);
      border-top: 1px solid rgba(214,199,167,.12);
    }
    .cta-wrap::before { background: radial-gradient(ellipse, rgba(214,199,167,0.10) 0%, transparent 66%); }

    .cta-form {
      display: grid;
      grid-template-columns: 1fr;
      gap: 14px;
      max-width: 680px;
      padding: 24px;
      background: rgba(17,21,27,.82);
      border: 1px solid rgba(214,199,167,.16);
      border-radius: 24px;
      box-shadow: var(--shadow);
      text-align: left;
    }
    .form-row { display: grid; grid-template-columns: 1fr; gap: 8px; }
    .form-label {
      color: #D6C7A7;
      font-size: 12px;
      letter-spacing: .08em;
      text-transform: uppercase;
      font-weight: 600;
    }
    .cta-form input,
    .cta-form textarea {
      width: 100%;
      background: rgba(11,13,16,.76);
      border: 1px solid rgba(214,199,167,.18);
      color: var(--text);
      padding: 14px 16px;
      border-radius: 12px;
      font-family: var(--fb);
      font-size: 15px;
      outline: none;
      transition: border-color .25s, box-shadow .25s, background .25s;
    }
    .cta-form textarea { min-height: 142px; resize: vertical; line-height: 1.6; }
    .cta-form input:focus,
    .cta-form textarea:focus {
      border-color: rgba(214,199,167,.52);
      box-shadow: 0 0 0 4px rgba(214,199,167,.08);
      background: rgba(11,13,16,.92);
    }
    .cta-form input::placeholder,
    .cta-form textarea::placeholder { color: #737C89; }
    .form-consents { display: grid; gap: 12px; margin-top: 2px; }
    .consent {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      color: #AEB5BF;
      font-size: 12px;
      line-height: 1.55;
    }
    .consent input { width: 16px; height: 16px; flex: 0 0 16px; margin-top: 2px; accent-color: #BFA36A; }
    .consent a, .footer__legal a, .footer__company a { color: #D6C7A7; text-decoration: none; border-bottom: 1px solid rgba(214,199,167,.28); }
    .consent a:hover, .footer__legal a:hover, .footer__company a:hover { border-bottom-color: rgba(214,199,167,.72); }
    .form-hint { color: #8E96A3; font-size: 12px; line-height: 1.55; }
    .form-actions { display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin-top: 4px; }
    .form-status { color:#D6C7A7; font-size:13px; min-height: 20px; }

    footer {
      display: grid;
      grid-template-columns: minmax(220px, 1fr) minmax(260px, 1.2fr) minmax(220px, .9fr);
      align-items: start;
      gap: 34px;
      background: #090B0E;
      border-top: 1px solid rgba(214,199,167,.14);
      padding-top: 42px;
      padding-bottom: 42px;
    }
    .footer__links, .footer__legal {
      display: flex;
      flex-wrap: wrap;
      gap: 12px 24px;
      list-style: none;
    }
    .footer__company { color: #8E96A3; font-size: 12px; line-height: 1.7; }
    .footer__company strong { color: #F4F0E8; font-weight: 600; }
    .footer__bottom { color: #737C89; font-size: 12px; line-height: 1.7; }
    .footer__legal a, .footer__links a { font-size: 13px; }

    @media (max-width: 900px) {
      footer { grid-template-columns: 1fr; }
    }
    @media (max-width: 700px) {
      .cta-form { padding: 18px; }
      .form-actions { align-items: stretch; }
      .form-actions .btn { width: 100%; justify-content: center; }
      footer { text-align: left; }
      .footer__links, .footer__legal { flex-direction: column; gap: 10px; }
    }


    /* ─── PREMIUM V2: klasyczna, stonowana identyfikacja ─── */
    :root {
      --bg:       #0A0A08;
      --bg2:      #11100D;
      --bg3:      #181611;
      --panel:    rgba(255, 252, 244, .045);
      --panel2:   rgba(255, 252, 244, .07);
      --border:   rgba(232, 214, 177, .13);
      --border2:  rgba(232, 214, 177, .22);
      --text:     #F7F1E6;
      --muted:    #8F8779;
      --muted2:   #BEB4A3;
      --primary:  #C7A45D;
      --accent:   #D9C08A;
      --pg:       rgba(199, 164, 93, .18);
      --pg2:      rgba(199, 164, 93, .075);
      --ag:       rgba(217, 192, 138, .13);
      --purple:   #AFA89C;
      --orange:   #B8895D;
      --pink:     #B99B91;
      --fd: 'Cormorant Garamond', Georgia, serif;
      --fb: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      --radius:   22px;
      --shadow:   0 30px 90px rgba(0,0,0,.42);
    }

    body {
      background:
        radial-gradient(circle at 50% -10%, rgba(217,192,138,.13), transparent 34%),
        radial-gradient(circle at 12% 20%, rgba(255,255,255,.035), transparent 24%),
        linear-gradient(180deg, #080806 0%, #11100D 44%, #090907 100%);
      font-weight: 400;
      color: var(--text);
    }

    body::after { opacity: .018; mix-blend-mode: soft-light; }

    nav {
      background: rgba(10,10,8,.76);
      border-bottom-color: rgba(232,214,177,.14);
      box-shadow: 0 18px 54px rgba(0,0,0,.30);
    }

    .nav__logo, .footer__logo {
      font-family: var(--fd);
      font-weight: 700;
      font-size: 23px;
      letter-spacing: .01em;
    }

    .nav__logo {
      min-height: 102px;
      padding: 0;
      gap: 0;
      flex-shrink: 0;
    }

    .footer__logo {
      gap: 0;
    }

    .nav__list a {
      color: #B7AE9E;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: .08em;
      text-transform: uppercase;
    }

    .nav__list a:hover { color: #F7F1E6; }
    .pulse { background: #C7A45D; box-shadow: 0 0 0 5px rgba(199,164,93,.10); }

    .nav__btn, .btn--pri {
      background: linear-gradient(135deg, #E7D09A 0%, #C7A45D 45%, #A77D3C 100%) !important;
      color: #16120B !important;
      border: 1px solid rgba(255,244,218,.42) !important;
      box-shadow: 0 18px 48px rgba(167,125,60,.20), inset 0 1px 0 rgba(255,255,255,.34) !important;
      font-weight: 700 !important;
      letter-spacing: .02em;
    }

    .nav__btn:hover, .btn--pri:hover {
      background: linear-gradient(135deg, #F1DEAF 0%, #D3B46E 48%, #B58A47 100%) !important;
      box-shadow: 0 22px 60px rgba(167,125,60,.28), inset 0 1px 0 rgba(255,255,255,.42) !important;
    }

    .btn {
      border-radius: 999px;
      font-size: 13px;
      letter-spacing: .02em;
      padding: 14px 28px;
    }

    .btn--ghost {
      background: rgba(247,241,230,.025);
      border-color: rgba(232,214,177,.24);
      color: #EFE7D8;
    }

    .btn--ghost:hover {
      background: rgba(247,241,230,.055);
      border-color: rgba(232,214,177,.42);
    }

    .hero {
      min-height: 90vh;
      background: radial-gradient(ellipse at 50% 16%, rgba(199,164,93,.08), transparent 54%);
    }

    .hero__grid {
      background-image:
        linear-gradient(rgba(232,214,177,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(232,214,177,.04) 1px, transparent 1px);
      background-size: 96px 96px;
      mask-image: radial-gradient(ellipse 72% 58% at 50% 45%, black 22%, transparent 100%);
    }

    .hero__orb1 { background: radial-gradient(circle, rgba(199,164,93,.115) 0%, transparent 67%); }
    .hero__orb2 { background: radial-gradient(circle, rgba(255,255,255,.04) 0%, transparent 66%); }

    .badge {
      background: rgba(247,241,230,.045);
      border-color: rgba(232,214,177,.23);
      color: #D9C08A;
      font-size: 11px;
      letter-spacing: .18em;
      font-weight: 700;
    }

    .badge__dot { background: #C7A45D; }

    h1.hero__title, .s-title, .cta-title, .mcard__title, .step__title {
      font-family: var(--fd);
      font-weight: 700;
      letter-spacing: -.012em;
    }

    h1.hero__title {
      font-size: clamp(48px, 7.5vw, 104px);
      line-height: .92;
      max-width: 1080px;
    }

    .s-title { font-size: clamp(36px, 4.6vw, 64px); line-height: 1.02; }
    .cta-title { font-size: clamp(38px, 5.8vw, 76px); line-height: .98; }

    .grad {
      background: linear-gradient(135deg, #FFF7EA 0%, #D9C08A 43%, #9E7B3E 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .hero__sub, .s-sub, .cta-sub {
      color: #C8BEAD;
      font-weight: 400;
    }

    .module-pill {
      background: rgba(247,241,230,.045);
      border-color: rgba(232,214,177,.14);
      border-radius: 999px;
      color: #D9D0C0;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }

    .module-pill:hover {
      background: rgba(247,241,230,.065);
      border-color: rgba(232,214,177,.28);
    }

    .c1, .c2, .c3, .c4, .c5 {
      background: #C7A45D !important;
      box-shadow: 0 0 10px rgba(199,164,93,.35) !important;
    }

    .stats, .hiw, .ind-bg, section[style*="background:var(--bg2)"] {
      background: linear-gradient(180deg, rgba(24,22,17,.88), rgba(17,16,13,.88)) !important;
      border-color: rgba(232,214,177,.13) !important;
    }

    .stat { border-color: rgba(232,214,177,.10); }
    .stat__n {
      font-family: var(--fd);
      background: linear-gradient(135deg, #FFF7EA, #C7A45D);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 700;
    }

    .stat__l, .step__desc, .intel-item__desc, .sms-feat__desc, .footer__bottom, .footer__company {
      color: #9F9688;
    }

    .eyebrow {
      color: #C7A45D;
      font-weight: 700;
      letter-spacing: .24em;
    }

    .mcard, .intel-visual, .intel-item, .sms-feat, .phone, .ind-tag, .cta-form {
      background:
        linear-gradient(180deg, rgba(247,241,230,.060), rgba(247,241,230,.024));
      border: 1px solid rgba(232,214,177,.15);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 24px 70px rgba(0,0,0,.24);
    }

    .mcard {
      padding: 38px 34px;
    }

    .mcard:hover, .intel-item:hover, .sms-feat:hover, .ind-tag:hover {
      transform: translateY(-3px);
      border-color: rgba(232,214,177,.34);
      background: linear-gradient(180deg, rgba(247,241,230,.078), rgba(247,241,230,.032));
      box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 34px 96px rgba(0,0,0,.34);
    }

    .mcard__glow { display: none; }
    .mcard__icon, .step__bubble, .sms-feat__icon, .intel-item__icon {
      background: rgba(199,164,93,.08) !important;
      border-color: rgba(199,164,93,.22) !important;
      color: #C7A45D !important;
    }

    .mcard__icon svg, .feat__check svg, .sms-feat__icon svg, .intel-item__icon svg {
      stroke: #C7A45D !important;
    }

    .mcard__name {
      color: #D9C08A !important;
      background: rgba(199,164,93,.075) !important;
      border-color: rgba(199,164,93,.18) !important;
      letter-spacing: .16em;
    }

    .mcard__desc, .feat, .sms-bubble, .ind-tag {
      color: #BFB4A3;
      font-weight: 400;
    }

    .feat__check {
      background: rgba(199,164,93,.105) !important;
      border: 1px solid rgba(199,164,93,.13);
    }

    .step__bubble {
      font-family: var(--fb);
      font-weight: 700;
      color: #C7A45D !important;
    }

    .intel-visual__tags .itag {
      background: rgba(247,241,230,.04);
      border-color: rgba(232,214,177,.13);
      color: #BFB4A3;
    }

    .itag--hot {
      background: rgba(199,164,93,.09) !important;
      border-color: rgba(199,164,93,.22) !important;
      color: #D9C08A !important;
    }

    .phone {
      border-radius: 42px;
      background: linear-gradient(180deg, rgba(247,241,230,.075), rgba(247,241,230,.028));
    }

    .sms-bubble--out {
      background: linear-gradient(135deg, #C7A45D, #9E7B3E);
      color: #15110A;
      font-weight: 600;
      border-color: rgba(255,244,218,.24);
    }

    .cta-wrap {
      background:
        linear-gradient(180deg, rgba(10,10,8,.30), rgba(10,10,8,.90)),
        radial-gradient(circle at 50% 4%, rgba(199,164,93,.16), transparent 46%);
    }

    .cta-form {
      max-width: 720px;
      padding: 30px;
      border-radius: 28px;
      background: linear-gradient(180deg, rgba(24,22,17,.92), rgba(15,14,11,.92));
    }

    .form-label {
      color: #D9C08A;
      font-weight: 700;
      letter-spacing: .12em;
    }

    .cta-form input,
    .cta-form textarea {
      background: rgba(7,7,5,.62);
      border-color: rgba(232,214,177,.18);
      color: #F7F1E6;
      border-radius: 16px;
      font-family: var(--fb);
    }

    .cta-form input:focus,
    .cta-form textarea:focus {
      border-color: rgba(199,164,93,.62);
      box-shadow: 0 0 0 4px rgba(199,164,93,.10);
    }

    .consent { color: #BFB4A3; }
    .consent input { accent-color: #C7A45D; }
    .consent a, .footer__legal a, .footer__company a {
      color: #D9C08A;
      border-bottom-color: rgba(217,192,138,.28);
    }

    footer {
      background: #070705;
      border-top-color: rgba(232,214,177,.16);
    }

    .footer__links a, .footer__legal a {
      color: #B7AE9E;
      letter-spacing: .04em;
    }

    .footer__links a:hover, .footer__legal a:hover { color: #F7F1E6; }


    /* ─── DODATKOWY BLOK + BLOG ─── */
    .mcard--consult {
      background:
        linear-gradient(180deg, rgba(199,164,93,.092), rgba(247,241,230,.026)),
        radial-gradient(circle at 82% 0%, rgba(217,192,138,.14), transparent 42%);
      border-color: rgba(217,192,138,.24);
    }

    .mcard--consult .mcard__title {
      font-size: clamp(24px, 2.4vw, 34px);
      line-height: 1.08;
    }

    .mcard__icon--gold,
    .mcard__name--gold,
    .feat__check--gold { color: #D9C08A !important; }

    .blog-section {
      background:
        linear-gradient(180deg, rgba(10,10,8,.16), rgba(24,22,17,.62));
      border-top: 1px solid rgba(232,214,177,.12);
    }

    .blog-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }

    .blog-card {
      min-height: 260px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 18px;
      padding: 30px;
      border-radius: var(--radius);
      background: linear-gradient(180deg, rgba(247,241,230,.060), rgba(247,241,230,.024));
      border: 1px solid rgba(232,214,177,.15);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 24px 70px rgba(0,0,0,.20);
      transition: transform .25s, border-color .25s, box-shadow .25s, background .25s;
    }

    .blog-card:hover {
      transform: translateY(-3px);
      border-color: rgba(232,214,177,.34);
      background: linear-gradient(180deg, rgba(247,241,230,.078), rgba(247,241,230,.032));
      box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 34px 96px rgba(0,0,0,.30);
    }

    .blog-card__meta {
      color: #C7A45D;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .blog-card h3 {
      font-family: var(--fd);
      font-size: clamp(24px, 2.2vw, 34px);
      line-height: 1.06;
      font-weight: 700;
      color: #F7F1E6;
    }

    .blog-card p:not(.blog-card__meta) {
      color: #BFB4A3;
      font-size: 14px;
      line-height: 1.72;
    }

    .blog-card a {
      color: #D9C08A;
      text-decoration: none;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      border-bottom: 1px solid rgba(217,192,138,.32);
      width: fit-content;
      padding-bottom: 4px;
    }

    .blog-card a:hover { border-bottom-color: rgba(217,192,138,.8); }

    @media (max-width: 1024px) {
      .blog-grid { grid-template-columns: 1fr; }
    }


    /* Mobile: transparentna górna belka */
    @media (max-width: 700px) {
      nav {
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        border-bottom-color: transparent !important;
        box-shadow: none !important;
      }

      .nav__list.open {
        background: rgba(10, 10, 8, .94);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        border-top: 1px solid rgba(232,214,177,.10);
        border-bottom: 1px solid rgba(232,214,177,.14);
        box-shadow: 0 18px 48px rgba(0,0,0,.32);
      }
    }

  

    /* Transparentna belka na starcie + tło po przewinięciu */
    nav {
      position: fixed !important;
      top: 0;
      left: 0;
      right: 0;
      background: transparent !important;
      border-bottom-color: transparent !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
      transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, backdrop-filter .25s ease;
    }

    nav.nav--scrolled,
    nav.nav--open {
      background: rgba(10, 10, 8, .86) !important;
      border-bottom-color: rgba(232,214,177,.14) !important;
      box-shadow: 0 18px 54px rgba(0,0,0,.30) !important;
      backdrop-filter: blur(22px) !important;
      -webkit-backdrop-filter: blur(22px) !important;
    }

    @media (max-width: 700px) {
      nav {
        background: transparent !important;
        border-bottom-color: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
      }

      nav.nav--scrolled,
      nav.nav--open {
        background: rgba(10, 10, 8, .76) !important;
        border-bottom-color: rgba(232,214,177,.12) !important;
        box-shadow: 0 14px 38px rgba(0,0,0,.28) !important;
        backdrop-filter: blur(16px) !important;
        -webkit-backdrop-filter: blur(16px) !important;
      }
    }


    /* Belka zawsze przezroczysta — również w trybie sticky i po scrollu */
    nav,
    nav.nav--scrolled,
    nav.nav--open {
      background: transparent !important;
      border-bottom-color: transparent !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }

    @media (max-width: 700px) {
      nav,
      nav.nav--scrolled,
      nav.nav--open {
        background: transparent !important;
        border-bottom-color: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
      }

      .nav__list.open {
        top: 100%;
      }
    }

  

/* CMS additions */
.page-hero{padding:180px var(--px) 70px;text-align:center;position:relative;overflow:hidden}.page-hero .s-sub{margin-left:auto;margin-right:auto}.post-wrap{max-width:860px;margin:0 auto;padding:140px var(--px) var(--py)}.post-cover{width:100%;max-height:460px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--border);margin:28px 0}.post-content{color:#D7CDBD;font-size:17px}.post-content p{margin:0 0 1.2em}.post-content h2,.post-content h3{font-family:var(--fd);color:var(--text);margin:1.5em 0 .5em}.alert{max-width:720px;margin:0 auto 18px;padding:14px 18px;border:1px solid rgba(199,164,93,.25);border-radius:14px;background:rgba(199,164,93,.08);color:#D9C08A}.blog-card__image{width:100%;height:160px;object-fit:cover;border-radius:16px;margin-bottom:16px;border:1px solid var(--border)}

/* ─── HERO / HEADER: tło z pliku tlo.png w katalogu głównym strony ───
   style.css jest w /assets/css/, dlatego ścieżka do pliku obok index.php to ../../tlo.png */
.hero {
  position: relative;
  isolation: isolate;
  background-image:
    linear-gradient(180deg, rgba(8, 8, 6, .24) 0%, rgba(8, 8, 6, .46) 58%, rgba(8, 8, 6, .86) 100%),
    url('../../tlo.png') !important;
  background-size: cover !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
}

.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 12%, rgba(199,164,93,.10), transparent 46%),
    linear-gradient(90deg, rgba(8,8,6,.36) 0%, rgba(8,8,6,.05) 50%, rgba(8,8,6,.36) 100%);
}

.hero__grid,
.hero__orb1,
.hero__orb2 {
  z-index: 0;
  opacity: .22;
}

@media (max-width: 1366px) {
  .hero {
    min-height: 760px;
    background-size: cover !important;
    background-position: center top !important;
  }
}

@media (max-width: 1024px) {
  .hero {
    min-height: 720px;
    background-position: center top !important;
  }
}

@media (max-width: 700px) {
  .hero {
    min-height: 760px;
    background-position: center top !important;
  }
}
