/* ==========================================================================
   DZIKIE LEADY / SILNIK STRONY
   wycena.dzikieleady.pl
   Ciemny domyślnie, 4 warianty sekcji: dark / deep / light / peach
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. TOKENY
   -------------------------------------------------------------------------- */
:root{
  --bg:#0e0f1a; --bg-2:#14162a; --bg-soft:#1a1d36; --bg-3:#20233f;
  --bg-light:#fff8f3; --bg-light-2:#ffffff;
  --bg-dark:#0e0f1a; --bg-dark-2:#14162a;

  --ink:#0f172a; --ink-soft:#475569; --ink-mute:#94a3b8;
  --ink-light:#f1f5f9; --ink-light-soft:#cbd5e1; --ink-light-mute:#9aa0b4;

  --line:#ffe5d4; --line-2:#f1e4da; --line-dark:rgba(255,255,255,.08);

  --brand:#fe9d2b;
  --brand-hover:#e88a17; --brand-2:#fe9d2b; --brand-3:#fe9d2b; --brand-deep:#c0392b;
  --brand-soft:#fff0e2;
  --ok:#22c55e; --ok-soft:#86efac; --ok-deep:#15803d;
  --bad:#ef4444;

  --grad:linear-gradient(#fe9d2b,#fe9d2b);
  --grad-dark:linear-gradient(#fe9d2b,#fe9d2b);

  --shadow-sm:0 2px 8px rgba(254,157,43,.08);
  --shadow-md:0 10px 30px rgba(254,157,43,.15);
  --shadow-lg:0 20px 60px rgba(254,157,43,.25);
  --shadow-dark:0 30px 60px rgba(0,0,0,.45);

  --radius:16px; --radius-lg:24px;
  --t:cubic-bezier(.22,1,.36,1);

  --header-h:72px;
  --topbar-h:40px;
}

/* --------------------------------------------------------------------------
   2. RESET I BAZA
   -------------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 20px);-webkit-text-size-adjust:100%}
body{
  font-family:'Satoshi','Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--ink-light-soft);
  background:var(--bg-dark);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img,svg,video{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:2px solid var(--brand-3);outline-offset:3px;border-radius:6px}
::selection{background:var(--brand);color:#fff}

/* --------------------------------------------------------------------------
   3. TYPOGRAFIA I ELEMENTY WSPÓLNE
   -------------------------------------------------------------------------- */
.dl-container{max-width:1280px;margin:0 auto;padding:0 24px;width:100%}
.dl-h1{font-size:clamp(34px,5.4vw,60px);font-weight:800;line-height:1.06;letter-spacing:-.025em;margin:0 0 20px;color:#fff}
.dl-h2{font-size:clamp(28px,4.2vw,46px);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:0 0 16px;color:#fff}
.dl-h3{font-size:clamp(19px,2.2vw,23px);font-weight:700;margin:0 0 8px;color:#fff;letter-spacing:-.01em}
.dl-h4{font-size:16px;font-weight:800;color:#fff;margin:0 0 8px}
.dl-grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.dl-lead{font-size:clamp(15px,1.35vw,18px);color:var(--ink-light-mute);line-height:1.65}

.dl-eyebrow{
  display:inline-flex;align-items:center;gap:8px;padding:7px 15px;border-radius:999px;
  background:rgba(254,157,43,.14);border:1px solid rgba(254,157,43,.24);color:var(--brand-3);
  font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:20px;
}
.dl-eyebrow svg{width:14px;height:14px;flex:none}

.dl-section{padding:clamp(64px,7vw,104px) 0;position:relative;overflow:hidden;background:var(--bg-dark);color:var(--ink-light-soft)}
.dl-section.dark{background:var(--bg-dark)}
.dl-section.deep{background:radial-gradient(ellipse at top,#1a1d36 0%,#0e0f1a 70%)}
.dl-section.light{background:linear-gradient(180deg,#fff8f3 0%,#ffffff 100%);color:var(--ink)}
.dl-section.peach{background:linear-gradient(180deg,#fff0e2 0%,#fff8f3 100%);color:var(--ink)}
.dl-section.light .dl-h1,.dl-section.light .dl-h2,.dl-section.light .dl-h3,.dl-section.light .dl-h4,
.dl-section.peach .dl-h1,.dl-section.peach .dl-h2,.dl-section.peach .dl-h3,.dl-section.peach .dl-h4{color:var(--ink)}
.dl-section.light .dl-lead,.dl-section.peach .dl-lead{color:var(--ink-soft)}
.dl-section.light .dl-eyebrow,.dl-section.peach .dl-eyebrow{background:var(--brand-soft);border-color:rgba(254,157,43,.2);color:var(--brand)}

.dl-section-head{text-align:center;max-width:780px;margin:0 auto clamp(40px,5vw,64px)}

.dl-mesh-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.dl-mesh-bg::before,.dl-mesh-bg::after{content:'';position:absolute;width:600px;height:600px;border-radius:50%;filter:blur(90px)}
.dl-mesh-bg::before{background:var(--brand);top:-220px;left:-200px;opacity:.13}
.dl-mesh-bg::after{background:var(--brand-deep);bottom:-220px;right:-200px;opacity:.09}
.dl-section.light .dl-mesh-bg::before,.dl-section.peach .dl-mesh-bg::before{background:var(--brand);opacity:.07}
.dl-section.light .dl-mesh-bg::after,.dl-section.peach .dl-mesh-bg::after{background:var(--brand-3);opacity:.09}

/* Miękkie przejścia między sekcjami */
.dl-fade-down,.dl-fade-up{position:absolute;left:0;right:0;height:170px;pointer-events:none;z-index:2}
.dl-fade-down{bottom:0;background:radial-gradient(ellipse 70% 100% at 50% 100%,rgba(254,157,43,.09) 0%,transparent 70%),linear-gradient(180deg,transparent 0%,rgba(14,15,26,.55) 100%)}
.dl-fade-up{top:0;background:radial-gradient(ellipse 70% 100% at 50% 0%,rgba(254,157,43,.12) 0%,transparent 65%),linear-gradient(180deg,rgba(14,15,26,.9) 0%,rgba(20,22,42,.4) 50%,transparent 100%)}

/* Przyciski */
.dl-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 28px;border-radius:12px;
  background:var(--brand);color:#fff;font-weight:800;font-size:15px;line-height:1;
  transition:background-color .2s,border-color .2s,color .2s;
  text-align:center;
}
.dl-btn:hover{background:var(--brand-hover)}
.dl-btn svg{width:18px;height:18px;flex:none}
.dl-btn.outline{background:rgba(255,255,255,.04);color:#fff;border:2px solid rgba(255,255,255,.16);box-shadow:none}
.dl-btn.outline:hover{border-color:var(--brand);color:var(--brand-3);background:rgba(254,157,43,.08)}
.dl-section.light .dl-btn.outline,.dl-section.peach .dl-btn.outline{background:#fff;color:var(--ink);border-color:var(--line)}
.dl-section.light .dl-btn.outline:hover,.dl-section.peach .dl-btn.outline:hover{border-color:var(--brand);color:var(--brand)}
.dl-btn.lg{padding:17px 34px;font-size:16px}
.dl-btn.sm{padding:11px 20px;font-size:13px}
.dl-btn.block{width:100%}

/* Reveal (aktywne tylko gdy JS wystartował) */
.dl-reveal{transition:opacity .8s var(--t),transform .8s var(--t)}
.js .dl-reveal{opacity:0;transform:translateY(36px)}
.js .dl-reveal.in{opacity:1;transform:none}
.dl-reveal-delay-1{transition-delay:.08s}
.dl-reveal-delay-2{transition-delay:.16s}
.dl-reveal-delay-3{transition-delay:.24s}
.dl-reveal-delay-4{transition-delay:.32s}

/* Pasek postępu czytania */
.dl-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--grad);z-index:1200;transition:width .1s linear;box-shadow:0 0 10px rgba(254,157,43,.6)}

/* ==========================================================================
   4. GÓRNY PASEK + HEADER + MEGA MENU
   ========================================================================== */
.dl-topbar{
  /* min-height, nie height: przy sztywnej wysokości dłuższy tekst wylewał się
     spod paska i wchodził pod nagłówek na wąskich ekranach. */
  position:fixed;top:0;left:0;right:0;z-index:1000;min-height:var(--topbar-h);
  display:flex;align-items:center;justify-content:center;gap:8px 18px;flex-wrap:wrap;
  padding:0 20px;background:#080a12;border-bottom:1px solid rgba(255,255,255,.06);
  font-size:13px;color:var(--ink-light-mute);transition:transform .3s var(--t);
}
.dl-topbar b{color:var(--brand-3);font-weight:800}
.dl-topbar-link{display:inline-flex;align-items:center;gap:6px;color:#fff;font-weight:700;border-bottom:1px solid rgba(254,157,43,.45);transition:color .2s,border-color .2s}
.dl-topbar-link:hover{color:var(--brand-3);border-color:var(--brand-3)}
.dl-topbar-sep{opacity:.25}
.dl-topbar-mail{display:none;align-items:center;gap:7px}
.dl-topbar-mail svg{width:14px;height:14px;color:var(--brand-3)}
@media(min-width:900px){.dl-topbar-mail{display:inline-flex}}

/* Na wąskich ekranach zostaje sama obietnica i przycisk. Reszta zdania
   zawijała pasek do dwóch linii i rozjeżdżała nagłówek. */
.dl-topbar-dopisek{display:none}
@media(min-width:760px){.dl-topbar-dopisek{display:inline}}
@media(max-width:899px){
  .dl-topbar{flex-wrap:nowrap;gap:10px;padding:0 14px;font-size:12.5px}
  .dl-topbar-sep{display:none}
  .dl-topbar > span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dl-topbar-link{flex:none}
}
body.dl-scrolled .dl-topbar{transform:translateY(-100%)}

.dl-header{
  position:fixed;top:var(--topbar-h);left:0;right:0;z-index:1001;height:var(--header-h);
  display:flex;align-items:center;
  transition:top .3s var(--t),background-color .3s,box-shadow .3s,border-color .3s;
  border-bottom:1px solid transparent;
}
body.dl-scrolled .dl-header{
  top:0;background:rgba(10,12,22,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom-color:rgba(255,255,255,.07);box-shadow:0 10px 34px -16px rgba(0,0,0,.8);
}
.dl-header-inner{display:flex;align-items:center;gap:20px;width:100%}

.dl-logo{display:inline-flex;align-items:center;gap:11px;flex:none}
.dl-logo img{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(254,157,43,.35))}
.dl-logo-txt{display:flex;flex-direction:column;line-height:1.05}
.dl-logo-txt b{font-size:17px;font-weight:800;color:#fff;letter-spacing:-.02em}
.dl-logo-txt span{font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--brand-3);margin-top:3px}

/* ------- pasek nawigacji (desktop) ------- */
.dl-nav{display:none;align-items:center;gap:2px;margin-left:8px}
@media(min-width:1120px){.dl-nav{display:flex}}
.dl-nav-item{position:relative}
.dl-nav-link{
  display:inline-flex;align-items:center;gap:6px;padding:10px 14px;border-radius:10px;
  font-size:14.5px;font-weight:600;color:var(--ink-light-soft);
  transition:color .2s,background-color .2s;
}
.dl-nav-link svg{width:14px;height:14px;transition:transform .25s var(--t);opacity:.6}
.dl-nav-link:hover,.dl-nav-item.open .dl-nav-link{color:#fff;background:rgba(255,255,255,.06)}
.dl-nav-item.open .dl-nav-link svg{transform:rotate(180deg);opacity:1;color:var(--brand-3)}

/* ------- panel mega menu ------- */
.dl-mega{
  position:fixed;left:0;right:0;top:calc(var(--topbar-h) + var(--header-h));
  z-index:999;
  background:linear-gradient(180deg,#10121f 0%,#0b0d18 100%);
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);
  box-shadow:0 40px 80px -30px rgba(0,0,0,.9);
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:opacity .25s var(--t),transform .25s var(--t),visibility .25s,top .3s var(--t);
  max-height:calc(100vh - var(--topbar-h) - var(--header-h));overflow-y:auto;
}
body.dl-scrolled .dl-mega{top:var(--header-h)}
.dl-mega.open{opacity:1;visibility:visible;transform:translateY(0)}
.dl-mega-inner{display:grid;gap:32px;padding:36px 0 40px}
@media(min-width:900px){
  .dl-mega-inner{grid-template-columns:repeat(3,1fr) 300px}
  .dl-mega-inner.cols-2{grid-template-columns:repeat(2,1fr) 300px}
}
.dl-mega-title{
  font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-light-mute);margin-bottom:16px;padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.dl-mega-list{display:grid;gap:4px}
.dl-mega-link{
  display:flex;align-items:flex-start;gap:12px;padding:11px 12px;border-radius:12px;
  transition:background-color .2s,transform .2s var(--t);
}
.dl-mega-link:hover{background:rgba(255,255,255,.05);transform:translateX(3px)}
.dl-mega-ic{
  width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;
  background:rgba(254,157,43,.12);border:1px solid rgba(254,157,43,.22);color:var(--brand-3);
  transition:background .25s,color .25s,border-color .25s;
}
.dl-mega-ic svg{width:19px;height:19px}
.dl-mega-link:hover .dl-mega-ic{background:var(--grad);color:#fff;border-color:transparent}
.dl-mega-link b{display:block;font-size:14px;font-weight:700;color:#fff;line-height:1.3}
.dl-mega-link > span:last-child > span{display:block;font-size:12px;color:var(--ink-light-mute);line-height:1.45;margin-top:3px}
.dl-mega-tag{
  display:inline-block;margin-left:7px;padding:2px 7px;border-radius:5px;vertical-align:middle;
  background:rgba(34,197,94,.14);color:var(--ok-soft);
  font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}
.dl-mega-tag.hot{background:rgba(254,157,43,.16);color:var(--brand-3)}

.dl-mega-promo{
  position:relative;overflow:hidden;border-radius:18px;padding:24px;
  background:linear-gradient(160deg,rgba(254,157,43,.16) 0%,rgba(20,22,42,.9) 60%);
  border:1px solid rgba(254,157,43,.28);
}
.dl-mega-promo::after{content:'';position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(254,157,43,.35),transparent 70%);right:-90px;top:-110px;filter:blur(40px)}
.dl-mega-promo > *{position:relative;z-index:1}
.dl-mega-promo-badge{
  display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;
  background:var(--grad);color:#fff;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:14px;
}
.dl-mega-promo b{display:block;font-size:17px;font-weight:800;color:#fff;line-height:1.25;margin-bottom:8px}
.dl-mega-promo p{font-size:13px;color:var(--ink-light-mute);line-height:1.55;margin-bottom:16px}
.dl-mega-promo ul{display:grid;gap:8px;margin-bottom:18px}
.dl-mega-promo li{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--ink-light-soft)}
.dl-mega-promo li svg{width:14px;height:14px;flex:none;color:var(--ok);margin-top:2px}

.dl-header-cta{display:none;align-items:center;gap:12px;margin-left:auto;flex:none}
@media(min-width:1120px){.dl-header-cta{display:flex}}
.dl-header-phone{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:#fff;white-space:nowrap}
.dl-header-phone svg{width:16px;height:16px;color:var(--brand-3)}

.dl-burger{
  display:grid;place-items:center;width:44px;height:44px;border-radius:12px;margin-left:auto;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);color:#fff;flex:none;
}
.dl-burger svg{width:22px;height:22px}
@media(min-width:1120px){.dl-burger{display:none}}

/* ------- menu mobilne ------- */
.dl-drawer{
  position:fixed;inset:0;z-index:1100;background:#0b0d18;
  display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .32s var(--t);
  overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.dl-drawer.open{transform:translateX(0)}
.dl-drawer-top{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.07);position:sticky;top:0;background:#0b0d18;z-index:2}
.dl-drawer-body{padding:12px 20px 40px}
.dl-acc{border-bottom:1px solid rgba(255,255,255,.07)}
.dl-acc-btn{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:17px 0;font-size:17px;font-weight:700;color:#fff;text-align:left;
}
.dl-acc-btn svg{width:18px;height:18px;color:var(--brand-3);transition:transform .3s var(--t);flex:none}
.dl-acc.open .dl-acc-btn svg{transform:rotate(45deg)}
.dl-acc-panel{max-height:0;overflow:hidden;transition:max-height .35s var(--t)}
.dl-acc-list{display:grid;gap:2px;padding:0 0 14px}
.dl-acc-list a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;font-size:14.5px;color:var(--ink-light-soft);transition:background-color .2s}
.dl-acc-list a:hover{background:rgba(255,255,255,.05);color:#fff}
.dl-acc-list a svg{width:17px;height:17px;color:var(--brand-3);flex:none}
.dl-drawer-flat{display:flex;align-items:center;justify-content:space-between;padding:17px 0;font-size:17px;font-weight:700;color:#fff;border-bottom:1px solid rgba(255,255,255,.07)}
.dl-drawer-foot{padding:24px 0 0;display:grid;gap:12px}
.dl-drawer-mail{text-align:center;color:var(--brand-3);font-weight:700;font-size:14px}

/* ==========================================================================
   5. HERO
   ========================================================================== */
#dl-hero{
  position:relative;overflow:hidden;
  padding:calc(var(--topbar-h) + var(--header-h) + 44px) 0 clamp(64px,7vw,100px);
  background:var(--bg-dark);
}
.dl-hero-grid-bg{
  position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(254,157,43,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(254,157,43,.05) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);
  mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);
}
.dl-hero-wrap{display:grid;grid-template-columns:1fr;gap:40px;align-items:center;position:relative;z-index:2}
@media(min-width:1000px){.dl-hero-wrap{grid-template-columns:1.08fr .92fr;gap:56px}}

.dl-hero-eyebrow{
  display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;
  background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);
  color:var(--ok-soft);font-size:13px;font-weight:600;margin-bottom:22px;max-width:100%;
}
.dl-hero-eyebrow b{color:#fff;font-weight:800}
.dl-hero-eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(34,197,94,.22);flex:none}

.dl-hero-h1{font-size:clamp(30px,5.2vw,58px);line-height:1.07}
.dl-hero-strike{position:relative;display:inline-block;color:#fff;opacity:.5}
.dl-hero-strike::after{
  content:'';position:absolute;left:-4px;right:-4px;top:55%;height:4px;border-radius:4px;
  background:var(--brand);transform:translateY(-50%) scaleX(0);transform-origin:left;
  box-shadow:0 2px 8px rgba(254,157,43,.5);
}
.js .dl-hero-strike.go::after{animation:dl-strike .85s var(--t) forwards}
@keyframes dl-strike{to{transform:translateY(-50%) scaleX(1)}}

.dl-hero-lead{font-size:clamp(15px,1.6vw,17.5px);line-height:1.65;max-width:590px;margin:22px 0 0;color:var(--ink-light-mute)}
.dl-hero-lead strong{color:#fff;font-weight:700}

.dl-hero-usp{display:flex;flex-direction:column;gap:14px;margin:30px 0}
.dl-hero-usp li{display:flex;align-items:flex-start;gap:13px;color:var(--ink-light-soft);font-size:clamp(13.5px,1.5vw,15px);line-height:1.5}
.dl-hero-usp .ic{
  width:24px;height:24px;border-radius:50%;flex:none;margin-top:1px;display:grid;place-items:center;
  background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.35);color:var(--ok);
}
.dl-hero-usp .ic svg{width:13px;height:13px}
.dl-hero-usp b{color:#fff;font-weight:700}

.dl-hero-cta-row{display:flex;gap:13px;flex-wrap:wrap;align-items:center;margin-bottom:32px}
.dl-btn-pulse{padding-left:18px}
.dl-btn-pulse .badge-mini{background:#fff;color:var(--brand);font-size:11px;font-weight:900;padding:4px 8px;border-radius:6px;flex:none}

.dl-hero-trust{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.dl-hero-avatars{display:flex;align-items:center;flex:none}
.dl-hero-avatars > span{
  width:38px;height:38px;border-radius:50%;border:3px solid var(--bg-dark);margin-left:-10px;
  display:grid;place-items:center;color:#fff;font-weight:800;font-size:11px;flex:none;
}
.dl-hero-avatars > span:first-child{margin-left:0}
.dl-hero-avatars .more{background:var(--bg-soft);color:var(--brand-3)}
.dl-hero-trust .stars{color:var(--brand-3);font-size:15px;letter-spacing:1.5px;line-height:1;white-space:nowrap}
.dl-hero-trust .stars small{color:var(--ink-light-mute);font-size:12px;letter-spacing:0;margin-left:6px}
.dl-hero-trust .trust-txt{font-size:13px;color:var(--ink-light-mute);margin-top:6px}
.dl-hero-trust .trust-txt b{color:#fff}

/* ------- prawa kolumna: dzik, orbita, badge, karty ------- */
.dl-hero-visual{position:relative;min-height:420px;display:flex;align-items:center;justify-content:center;width:100%}
@media(min-width:1000px){.dl-hero-visual{min-height:560px}}
.dl-hero-orbit{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.dl-hero-orbit svg{width:100%;height:100%;max-width:560px;max-height:560px}
.js .dl-hero-orbit svg{animation:dl-rotate 70s linear infinite}
@keyframes dl-rotate{to{transform:rotate(360deg)}}
.dl-hero-glow{
  position:absolute;width:min(470px,90%);aspect-ratio:1;pointer-events:none;
  background:radial-gradient(circle,rgba(254,157,43,.42) 0%,rgba(254,157,43,.1) 38%,transparent 70%);
  filter:blur(42px);
}
.js .dl-hero-glow{animation:dl-glow 6s ease-in-out infinite}
@keyframes dl-glow{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.1);opacity:1}}
.dl-hero-dzik{position:relative;z-index:2;max-width:100%}
.js .dl-hero-dzik{animation:dl-bob 6s ease-in-out infinite}
.dl-hero-dzik img{width:min(430px,78vw);height:auto;filter:drop-shadow(0 25px 50px rgba(254,157,43,.45))}
@keyframes dl-bob{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-12px) rotate(1.5deg)}}

.dl-discount{position:absolute;top:2%;right:0;z-index:3;width:clamp(96px,17vw,160px);aspect-ratio:1}
.js .dl-discount{animation:dl-discount-bob 5s ease-in-out infinite}
@keyframes dl-discount-bob{0%,100%{transform:translateY(0) rotate(-10deg)}50%{transform:translateY(-12px) rotate(-6deg)}}
.dl-discount-ring{position:absolute;inset:-10px;border-radius:50%;border:2px dashed rgba(254,157,43,.5)}
.js .dl-discount-ring{animation:dl-rotate 18s linear infinite}
.dl-discount-inner{
  position:relative;width:100%;height:100%;border-radius:50%;overflow:hidden;
  background:#fe9d2b;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;
  box-shadow:0 20px 50px rgba(254,157,43,.5),inset 0 -8px 16px rgba(0,0,0,.2),inset 0 4px 12px rgba(255,255,255,.3);
}
.dl-discount-pct{position:relative;z-index:1;display:flex;align-items:baseline;line-height:.9;font-weight:900;text-shadow:0 2px 8px rgba(0,0,0,.2)}
.dl-discount-pct .m{font-size:clamp(20px,3.4vw,34px)}
.dl-discount-pct .n{font-size:clamp(34px,5.6vw,56px);letter-spacing:-.05em}
.dl-discount-pct .p{font-size:clamp(17px,2.8vw,28px);margin-left:2px}
.dl-discount-lbl{position:relative;z-index:1;margin-top:6px;font-size:clamp(7px,.95vw,10px);font-weight:800;letter-spacing:.08em;text-transform:uppercase;line-height:1.3;padding:0 8px;text-shadow:0 1px 4px rgba(0,0,0,.3)}

.dl-hero-card{
  position:absolute;z-index:3;display:flex;align-items:center;gap:10px;
  padding:12px 16px;border-radius:14px;max-width:calc(100% - 16px);
  background:rgba(20,22,42,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(254,157,43,.2);box-shadow:0 20px 50px rgba(0,0,0,.5);
}
.js .dl-hero-card{animation:dl-card-float 7s ease-in-out infinite}
.dl-hero-card-roas{bottom:6%;left:0;animation-delay:-1s}
.dl-hero-card-pickup{top:36%;right:0;animation-delay:-3.5s}
@keyframes dl-card-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.dl-hero-card .ic{width:clamp(34px,4vw,42px);aspect-ratio:1;border-radius:10px;display:grid;place-items:center;flex:none;background:rgba(254,157,43,.15);border:1px solid rgba(254,157,43,.3);color:var(--brand-3)}
.dl-hero-card .ic.green{background:rgba(34,197,94,.15);border-color:rgba(34,197,94,.3);color:var(--ok)}
.dl-hero-card .ic svg{width:60%;height:60%}
.dl-hero-card .num{font-size:clamp(16px,2.2vw,22px);font-weight:800;color:#fff;line-height:1}
.dl-hero-card .lbl{font-size:clamp(10px,1.1vw,11px);color:var(--ink-light-mute);margin-top:3px;white-space:nowrap}

/* pasek partnerów */
.dl-hero-partners{margin-top:clamp(48px,6vw,72px);padding-top:32px;border-top:1px solid rgba(255,255,255,.06);position:relative;z-index:2}
.dl-hero-partners .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.15em;color:var(--ink-light-mute);text-align:center;margin-bottom:20px;font-weight:700}
.dl-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%)}
.dl-marquee-track{display:flex;gap:28px;align-items:center;white-space:nowrap;width:max-content}
.js .dl-marquee-track{animation:dl-marquee 38s linear infinite}
.dl-marquee:hover .dl-marquee-track{animation-play-state:paused}
.dl-marquee-track span{font-size:clamp(15px,1.7vw,19px);font-weight:700;color:var(--ink-light-mute);letter-spacing:-.01em}
.dl-marquee-track span.sep{color:var(--brand);opacity:.5}
@keyframes dl-marquee{to{transform:translateX(-50%)}}

/* ==========================================================================
   5b. POWIADOMIENIE O REALNYM ZGŁOSZENIU
   Treść pochodzi z /api/ostatnie.php, czyli z prawdziwych wpisów formularza.
   ========================================================================== */
.dl-toast{
  position:fixed;left:20px;bottom:20px;z-index:950;
  display:flex;align-items:flex-start;gap:12px;
  width:min(336px,calc(100vw - 40px));padding:15px 38px 15px 16px;
  border-radius:16px;
  background:rgba(16,18,32,.96);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(254,157,43,.28);
  box-shadow:0 24px 60px -18px rgba(0,0,0,.85);
  opacity:0;visibility:hidden;transform:translateY(14px) scale(.97);
  transition:opacity .35s var(--t),transform .35s var(--t),visibility .35s;
}
.dl-toast.show{opacity:1;visibility:visible;transform:none}
.dl-toast-ic{
  width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;
  background:rgba(254,157,43,.14);border:1px solid rgba(254,157,43,.28);color:var(--brand-3);
}
.dl-toast-ic svg{width:19px;height:19px}
.dl-toast-body{min-width:0}
.dl-toast-body b{display:block;font-size:12.5px;font-weight:800;color:#fff;line-height:1.3}
.dl-toast-body > span{display:block;font-size:13px;color:var(--ink-light-soft);line-height:1.45;margin-top:3px}
.dl-toast-body small{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:11px;color:var(--ink-light-mute);margin-top:7px}
.dl-toast-body small i{
  font-style:normal;padding:2px 7px;border-radius:5px;
  background:rgba(34,197,94,.12);color:var(--ok-soft);font-weight:700;font-size:10px;
}
.dl-toast-x{
  position:absolute;top:9px;right:9px;width:24px;height:24px;border-radius:7px;
  display:grid;place-items:center;color:var(--ink-light-mute);
  transition:background-color .2s,color .2s;
}
.dl-toast-x svg{width:13px;height:13px}
.dl-toast-x:hover{background:rgba(255,255,255,.08);color:#fff}
@media(max-width:1119px){.dl-toast{bottom:84px}}
@media(max-width:420px){.dl-toast{left:12px;right:12px;width:auto}}

/* ==========================================================================
   5c. GWARANCJA NA LEADY
   ========================================================================== */
.dl-guar{display:grid;grid-template-columns:1fr;gap:32px;align-items:center}
@media(min-width:1000px){.dl-guar{grid-template-columns:340px 1fr;gap:56px}}

/* --------------------------------------------------------------------------
   Dokument gwarancyjny. Wygląda jak papier, który klient dostaje na start,
   dlatego czyta się jak zobowiązanie, a nie jak grafika ozdobna.
   -------------------------------------------------------------------------- */
.dl-cert{
  position:relative;overflow:hidden;border-radius:22px;padding:clamp(24px,3vw,32px);
  background:
    radial-gradient(130% 80% at 50% 0%,rgba(254,157,43,.18),transparent 62%),
    linear-gradient(170deg,#171b30 0%,#0c0e1a 100%);
  border:1px solid rgba(254,157,43,.35);
  box-shadow:0 45px 100px -42px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.07);
}
.dl-cert::before{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.022) 0 2px,transparent 2px 9px);
}
.dl-cert::after{
  content:'';position:absolute;inset:9px;border-radius:16px;pointer-events:none;
  border:1px solid rgba(254,157,43,.16);
}
.dl-cert > *{position:relative;z-index:1}
.dl-cert-top{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.dl-cert-top img{width:42px;height:42px;object-fit:contain;flex:none}
.dl-cert-top small{display:block;font-size:9.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--brand-3)}
.dl-cert-top b{display:block;font-size:13px;font-weight:800;color:#fff;margin-top:3px}
.dl-cert h3{font-size:clamp(23px,3vw,31px);font-weight:900;letter-spacing:-.02em;line-height:1.08;color:#fff;margin-bottom:9px}
.dl-cert h3 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.dl-cert-sub{font-size:13px;color:var(--ink-light-mute);line-height:1.55;padding-bottom:20px;margin-bottom:20px;border-bottom:1px dashed rgba(255,255,255,.15)}
.dl-cert-list{display:grid;gap:13px}
.dl-cert-list li{display:flex;gap:11px;align-items:flex-start;font-size:14px;color:var(--ink-light-soft);line-height:1.45}
.dl-cert-list li b{color:#fff;font-weight:800}
.dl-cert-list svg{width:18px;height:18px;flex:none;color:var(--ok);margin-top:1px}
.dl-cert-stamp{
  position:absolute;right:clamp(16px,2.4vw,26px);bottom:clamp(16px,2.4vw,26px);z-index:2;
  transform:rotate(-11deg);padding:11px 14px;border-radius:11px;
  border:2px solid rgba(254,157,43,.5);background:rgba(254,157,43,.07);
  color:var(--brand-3);font-size:10.5px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;
  text-align:center;line-height:1.3;
}
.dl-cert-stamp b{display:block;font-size:13px;letter-spacing:.06em}
.dl-cert-foot{
  margin-top:22px;padding-top:18px;border-top:1px dashed rgba(255,255,255,.15);
  font-size:12px;line-height:1.6;color:rgba(154,160,180,.85);max-width:62%;
}
@media(max-width:520px){
  .dl-cert-stamp{position:static;transform:none;display:inline-block;margin-top:20px}
  .dl-cert-foot{max-width:none}
}

.dl-seal-wrap{display:flex;justify-content:center}
.dl-seal{position:relative;width:min(300px,74vw);aspect-ratio:1;display:grid;place-items:center}
.dl-seal-ring{
  position:absolute;inset:0;border-radius:50%;
  border:2px dashed rgba(254,157,43,.45);
}
.js .dl-seal-ring{animation:dl-rotate 44s linear infinite}
.dl-seal-ring-2{position:absolute;inset:18px;border-radius:50%;border:1px solid rgba(254,157,43,.22)}
.dl-seal-core{
  position:relative;width:74%;height:74%;border-radius:50%;
  background:#fe9d2b;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  color:#fff;text-align:center;
  box-shadow:0 24px 60px rgba(254,157,43,.45),inset 0 -8px 18px rgba(0,0,0,.22),inset 0 5px 14px rgba(255,255,255,.28);
}
.dl-seal-core svg{width:44px;height:44px}
.dl-seal-core b{font-size:16px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;line-height:1}
.dl-seal-core span{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.9;line-height:1.3;padding:0 14px}
.dl-seal-badge{
  position:absolute;top:2px;right:6px;z-index:2;
  padding:6px 13px;border-radius:999px;background:#0e0f1a;
  border:1px solid rgba(254,157,43,.5);color:var(--brand-3);
  font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;
}

.dl-guar-list{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:640px){.dl-guar-list{grid-template-columns:repeat(2,1fr);gap:18px}}
.dl-guar-item{
  position:relative;padding:24px 22px;border-radius:18px;
  background:rgba(20,22,42,.72);border:1px solid rgba(255,255,255,.08);
  transition:border-color .3s,transform .3s var(--t),background-color .3s;
}
.dl-guar-item:hover{border-color:rgba(254,157,43,.38);transform:translateY(-4px);background:rgba(26,29,54,.85)}
.dl-guar-ic{
  width:44px;height:44px;border-radius:13px;display:grid;place-items:center;margin-bottom:14px;
  background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.3);color:var(--ok);
}
.dl-guar-ic svg{width:22px;height:22px}
.dl-guar-item h3{font-size:16.5px;font-weight:800;color:#fff;margin-bottom:7px;letter-spacing:-.01em}
.dl-guar-item p{font-size:13.5px;line-height:1.6;color:var(--ink-light-mute);margin:0}
.dl-guar-item p strong{color:#fff}

.dl-guar-foot{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  margin-top:26px;padding:22px 24px;border-radius:18px;
  background:linear-gradient(135deg,rgba(254,157,43,.13) 0%,rgba(254,157,43,.04) 100%);
  border:1px solid rgba(254,157,43,.28);
}
.dl-guar-foot-ic{
  width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex:none;
  background:var(--grad);color:#fff;box-shadow:0 10px 24px rgba(254,157,43,.4);
}
.dl-guar-foot-ic svg{width:24px;height:24px}
.dl-guar-foot div{flex:1;min-width:220px}
.dl-guar-foot b{display:block;font-size:15px;font-weight:800;color:#fff;margin-bottom:4px}
.dl-guar-foot div span{display:block;font-size:13.5px;color:var(--ink-light-mute);line-height:1.55}

/* ==========================================================================
   5d. ŹRÓDŁA POZYSKANIA
   ========================================================================== */
.dl-src-grid{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:640px){.dl-src-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1050px){.dl-src-grid{grid-template-columns:repeat(4,1fr)}}
.dl-src{
  position:relative;overflow:hidden;padding:28px 24px;border-radius:20px;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 18px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-src:hover{transform:translateY(-5px);box-shadow:0 26px 50px -22px rgba(254,157,43,.32);border-color:rgba(254,157,43,.35)}
.dl-src-ic{
  width:52px;height:52px;border-radius:15px;display:grid;place-items:center;margin-bottom:16px;
  background:var(--brand-soft);color:var(--brand);border:1px solid rgba(254,157,43,.18);
  transition:background .3s,color .3s,transform .3s var(--t);
}
.dl-src:hover .dl-src-ic{background:var(--grad);color:#fff;border-color:transparent;transform:rotate(-6deg) scale(1.05)}
.dl-src-ic svg{width:26px;height:26px}
.dl-src h3{font-size:17px;font-weight:800;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em}
.dl-src p{font-size:13.5px;line-height:1.6;color:var(--ink-soft);margin:0}
.dl-src-tag{
  display:inline-block;margin-top:14px;padding:5px 11px;border-radius:999px;
  background:var(--bg-2);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}
.dl-src-note{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  margin-top:24px;padding:24px 26px;border-radius:20px;
  background:linear-gradient(135deg,#0e0f1a 0%,#1a1d36 100%);position:relative;overflow:hidden;
}
.dl-src-note::before{content:'';position:absolute;top:-70px;right:-70px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(254,157,43,.26),transparent 70%);pointer-events:none}
.dl-src-note-ic{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;flex:none;background:rgba(254,157,43,.15);border:1px solid rgba(254,157,43,.3);color:var(--brand-3);position:relative;z-index:1}
.dl-src-note-ic svg{width:25px;height:25px}
.dl-src-note div{flex:1;min-width:240px;position:relative;z-index:1}
.dl-src-note b{display:block;color:#fff;font-size:16px;font-weight:800;margin-bottom:5px}
.dl-src-note div span{display:block;color:var(--ink-light-mute);font-size:13.5px;line-height:1.6}

/* ==========================================================================
   6. LICZBY
   ========================================================================== */
.dl-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(min-width:900px){.dl-stats{grid-template-columns:repeat(4,1fr);gap:20px}}
.dl-stat{
  text-align:center;padding:26px 18px;border-radius:20px;
  background:var(--bg-2);border:1px solid var(--line-dark);
  transition:border-color .3s,transform .3s var(--t);
}
.dl-stat:hover{border-color:rgba(254,157,43,.35);transform:translateY(-4px)}
.dl-stat-ic{width:44px;height:44px;margin:0 auto 14px;border-radius:12px;display:grid;place-items:center;background:rgba(254,157,43,.12);border:1px solid rgba(254,157,43,.24);color:var(--brand-3)}
.dl-stat-ic svg{width:22px;height:22px}
.dl-stat-num{font-size:clamp(30px,4.4vw,48px);font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;letter-spacing:-.03em}
.dl-stat-lbl{font-size:13px;color:var(--ink-light-mute);font-weight:600;margin-top:10px;line-height:1.45}

/* ==========================================================================
   7. PROBLEM
   ========================================================================== */
.dl-pains{display:grid;gap:16px}
@media(min-width:700px){.dl-pains{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1050px){.dl-pains{grid-template-columns:repeat(3,1fr)}}
.dl-pain{
  display:flex;gap:14px;align-items:flex-start;padding:22px;border-radius:18px;
  background:#fff;border:1px solid var(--line-2);box-shadow:0 4px 16px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-pain:hover{transform:translateY(-4px);box-shadow:0 20px 40px -18px rgba(254,157,43,.35);border-color:rgba(254,157,43,.3)}
.dl-pain-ic{width:44px;height:44px;border-radius:13px;flex:none;display:grid;place-items:center;background:rgba(239,68,68,.09);color:var(--bad)}
.dl-pain-ic svg{width:22px;height:22px}
.dl-pain b{display:block;font-size:16px;font-weight:800;color:var(--ink);margin-bottom:5px;letter-spacing:-.01em}
.dl-pain p{font-size:14px;line-height:1.6;color:var(--ink-soft);margin:0}

.dl-pain-cta{
  margin-top:32px;padding:32px 28px;border-radius:22px;text-align:center;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#0e0f1a 0%,#1a1d36 100%);
}
.dl-pain-cta::after{content:'';position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(254,157,43,.32),transparent 70%);right:-120px;top:-180px;filter:blur(50px)}
.dl-pain-cta p{position:relative;z-index:1;font-size:clamp(17px,2.2vw,24px);font-weight:800;color:#fff;line-height:1.4;max-width:44ch;margin:0 auto;letter-spacing:-.01em}
.dl-pain-cta em{font-style:normal;color:var(--brand-3)}

/* ==========================================================================
   8. BRANŻE
   ========================================================================== */
.dl-branze-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:44px}
@media(min-width:820px){.dl-branze-grid{grid-template-columns:repeat(2,1fr);gap:24px}}
.dl-branze-card{
  position:relative;display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(22px,3vw,32px);
  transition:transform .4s var(--t),box-shadow .4s var(--t),border-color .4s;
}
.dl-branze-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px rgba(254,157,43,.18);border-color:rgba(254,157,43,.4)}
.dl-branze-card-bg{position:absolute;top:-80px;right:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(254,157,43,.08),transparent 70%);transition:transform .6s var(--t);pointer-events:none}
.dl-branze-card:hover .dl-branze-card-bg{transform:scale(1.5) translate(-20px,20px)}
.dl-branze-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px;position:relative;z-index:1}
.dl-branze-ic{width:62px;height:62px;border-radius:18px;display:grid;place-items:center;flex:none;background:var(--grad);color:#fff;box-shadow:0 12px 30px rgba(254,157,43,.32);transition:transform .4s var(--t)}
.dl-branze-card:hover .dl-branze-ic{transform:rotate(-8deg) scale(1.06)}
.dl-branze-ic svg{width:30px;height:30px}
.dl-branze-ic-custom{width:62px;height:62px;border-radius:18px;display:grid;place-items:center;flex:none;background:var(--brand-soft);color:var(--brand);border:2px dashed rgba(254,157,43,.4);transition:all .4s var(--t)}
.dl-branze-card:hover .dl-branze-ic-custom{background:var(--grad);color:#fff;border-color:transparent;transform:rotate(90deg) scale(1.06);box-shadow:0 12px 30px rgba(254,157,43,.32)}
.dl-branze-ic-custom svg{width:28px;height:28px}
.dl-branze-flag{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:999px;background:#fe9d2b;color:#fff;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 4px 12px rgba(254,157,43,.35);flex:none}
.dl-branze-flag svg{width:10px;height:10px}
.dl-branze-flag-soft{padding:6px 12px;border-radius:999px;background:rgba(34,197,94,.12);color:var(--ok-deep);border:1px solid rgba(34,197,94,.25);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;flex:none}
.dl-branze-card .dl-h3{font-size:clamp(19px,2.4vw,24px);position:relative;z-index:1;margin-bottom:10px}
.dl-branze-desc{margin:0;color:var(--ink-soft);font-size:14px;line-height:1.6;position:relative;z-index:1}
.dl-branze-stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0;padding:18px 14px;
  background:linear-gradient(135deg,#fff8f3 0%,#fff0e2 100%);border:1px solid var(--line);border-radius:14px;
  position:relative;z-index:1;
}
.dl-branze-stats > div{display:flex;flex-direction:column;align-items:center;text-align:center}
.dl-branze-stats b{font-size:clamp(15px,1.8vw,18px);font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1}
.dl-branze-stats span{font-size:10px;color:var(--ink-mute);font-weight:600;margin-top:5px;line-height:1.3}
.dl-branze-foot{margin-top:auto;padding-top:20px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}
.dl-branze-cta{color:var(--brand);font-weight:800;font-size:14px}
.dl-branze-arrow{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);transition:all .35s var(--t);flex:none}
.dl-branze-arrow svg{width:16px;height:16px}
.dl-branze-card:hover .dl-branze-arrow{background:var(--grad);color:#fff;transform:translateX(4px);box-shadow:0 8px 20px rgba(254,157,43,.45)}
.dl-branze-card-custom{border-style:dashed;background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,248,243,.88))}
.dl-branze-card-custom .dl-branze-stats{background:rgba(255,255,255,.65)}

.dl-branze-help{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:26px 28px;border-radius:20px;
  background:linear-gradient(135deg,#0e0f1a 0%,#1a1d36 100%);position:relative;overflow:hidden;
}
.dl-branze-help::before{content:'';position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(254,157,43,.25),transparent 70%);pointer-events:none}
.dl-branze-help-ic{width:56px;height:56px;border-radius:15px;display:grid;place-items:center;flex:none;background:rgba(254,157,43,.15);border:1px solid rgba(254,157,43,.3);color:var(--brand-3);position:relative;z-index:1}
.dl-branze-help-ic svg{width:26px;height:26px}
.dl-branze-help-txt{flex:1;min-width:220px;position:relative;z-index:1}
.dl-branze-help-txt b{display:block;color:#fff;font-size:16px;font-weight:800;margin-bottom:4px}
.dl-branze-help-txt span{display:block;color:var(--ink-light-mute);font-size:13px;line-height:1.5}
@media(max-width:760px){.dl-branze-help{flex-direction:column;text-align:center}.dl-branze-help-txt{min-width:0}}

/* ==========================================================================
   9. DLACZEGO MY + VS
   ========================================================================== */
.dl-why-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:clamp(48px,6vw,64px)}
@media(min-width:700px){.dl-why-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1150px){.dl-why-grid{grid-template-columns:repeat(4,1fr)}}
.dl-why-card{
  position:relative;overflow:hidden;padding:32px 26px 26px;border-radius:20px;
  background:var(--bg-2);border:1px solid rgba(255,255,255,.08);
  transition:transform .4s var(--t),background-color .4s,border-color .4s,box-shadow .4s;
}
.dl-why-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--t)}
.dl-why-card:hover{transform:translateY(-6px);background:var(--bg-soft);border-color:rgba(254,157,43,.3);box-shadow:var(--shadow-dark)}
.dl-why-card:hover::before{transform:scaleX(1)}
.dl-why-num{
  position:absolute;top:22px;right:26px;font-size:62px;font-weight:900;line-height:1;letter-spacing:-.04em;pointer-events:none;
  background:linear-gradient(180deg,rgba(254,157,43,.2) 0%,rgba(254,157,43,.02) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
}
.dl-why-ic{
  width:54px;height:54px;border-radius:14px;display:grid;place-items:center;margin-bottom:20px;
  background:linear-gradient(135deg,rgba(254,157,43,.15),rgba(254,157,43,.05));
  border:1px solid rgba(254,157,43,.25);color:var(--brand-3);
  transition:all .4s var(--t);position:relative;z-index:1;
}
.dl-why-card:hover .dl-why-ic{background:var(--grad);color:#fff;border-color:transparent;transform:rotate(-6deg) scale(1.05);box-shadow:0 10px 24px rgba(254,157,43,.4)}
.dl-why-ic svg{width:26px;height:26px}
.dl-why-card .dl-h3{font-size:19px;position:relative;z-index:1;margin-bottom:10px}
.dl-why-card p{margin:0 0 18px;color:var(--ink-light-mute);font-size:14px;line-height:1.6;position:relative;z-index:1}
.dl-why-card p strong{color:#fff}
.dl-why-tag{
  display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;
  background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.25);color:var(--ok-soft);
  font-size:11px;font-weight:700;position:relative;z-index:1;
}
.dl-why-tag svg{width:12px;height:12px;color:var(--ok);flex:none}

.dl-vs{display:grid;grid-template-columns:1fr;gap:18px;align-items:center;max-width:1100px;margin:0 auto}
@media(min-width:900px){.dl-vs{grid-template-columns:1fr auto 1fr;gap:24px}}
.dl-vs-col{padding:clamp(24px,3vw,32px);border-radius:24px;position:relative;overflow:hidden}
.dl-vs-old{background:rgba(20,22,42,.7);border:1px solid rgba(255,255,255,.06);opacity:.9}
.dl-vs-new{background:linear-gradient(135deg,rgba(254,157,43,.13) 0%,rgba(254,157,43,.04) 100%);border:1px solid rgba(254,157,43,.3);box-shadow:0 30px 80px rgba(254,157,43,.14)}
.dl-vs-new::before{content:'';position:absolute;top:-40px;right:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(254,157,43,.3),transparent 70%);pointer-events:none}
.dl-vs-head{display:flex;align-items:center;gap:14px;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08);position:relative;z-index:1}
.dl-vs-head h4{margin:0;font-size:16px;font-weight:800;color:#fff;letter-spacing:-.01em}
.dl-vs-old .dl-vs-head h4{color:var(--ink-light-mute)}
.dl-vs-ic-bad,.dl-vs-ic-good{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none}
.dl-vs-ic-bad{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.25);color:var(--bad)}
.dl-vs-ic-good{background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(254,157,43,.4)}
.dl-vs-ic-bad svg,.dl-vs-ic-good svg{width:20px;height:20px}
.dl-vs-col ul{display:flex;flex-direction:column;gap:14px;position:relative;z-index:1}
.dl-vs-col li{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.5}
.dl-vs-old li{color:var(--ink-light-mute)}
.dl-vs-new li{color:#fff}
.dl-vs-new li b{color:var(--brand-3);font-weight:700}
.dl-vs-col .x,.dl-vs-col .v{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;flex:none;margin-top:1px}
.dl-vs-col .x svg,.dl-vs-col .v svg{width:12px;height:12px}
.dl-vs-col .x{background:rgba(239,68,68,.15);color:var(--bad)}
.dl-vs-col .v{background:rgba(34,197,94,.15);color:var(--ok)}
.dl-vs-arrow{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;margin:0 auto;background:var(--grad);color:#fff;box-shadow:0 12px 30px rgba(254,157,43,.45)}
.dl-vs-arrow svg{width:24px;height:24px;transform:rotate(90deg)}
@media(min-width:900px){.dl-vs-arrow svg{transform:none}}

/* ==========================================================================
   10. JAK TO DZIAŁA
   ========================================================================== */
.dl-steps{display:grid;grid-template-columns:1fr;gap:20px;position:relative}
@media(min-width:760px){.dl-steps{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1150px){.dl-steps{grid-template-columns:repeat(4,1fr)}}
.dl-step{
  position:relative;padding:28px 24px;border-radius:20px;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 16px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-step:hover{transform:translateY(-5px);box-shadow:0 26px 50px -22px rgba(254,157,43,.35);border-color:rgba(254,157,43,.35)}
.dl-step.hot{background:linear-gradient(160deg,#fff8f3 0%,#ffffff 70%);border-color:rgba(254,157,43,.35)}
.dl-step-phase{display:inline-block;margin-bottom:14px;padding:5px 11px;border-radius:7px;background:var(--bg-2);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.dl-step.hot .dl-step-phase{background:var(--grad)}
.dl-step-num{
  width:52px;height:52px;border-radius:16px;display:grid;place-items:center;margin-bottom:16px;
  background:var(--grad);color:#fff;font-size:20px;font-weight:900;
  box-shadow:0 10px 24px rgba(254,157,43,.3);transition:transform .35s var(--t);
}
.dl-step:hover .dl-step-num{transform:rotate(-7deg) scale(1.06)}
.dl-step h3{font-size:18px;font-weight:800;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em}
.dl-step > p{font-size:14px;line-height:1.6;color:var(--ink-soft);margin:0}
.dl-step > p strong{color:var(--ink)}
.dl-step-list{display:grid;gap:9px;margin-top:16px}
.dl-step-list li{display:flex;gap:9px;font-size:13px;line-height:1.5;color:var(--ink-soft)}
.dl-step-list svg{width:15px;height:15px;flex:none;color:var(--brand);margin-top:2px}
.dl-step-work{display:flex;align-items:center;gap:8px;margin-top:18px;padding-top:14px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--ink-mute)}
.dl-step-work svg{width:14px;height:14px;color:var(--brand);flex:none}
.dl-step-work b{color:var(--ink);font-weight:800}

/* ==========================================================================
   11. PAKIETY
   ========================================================================== */
.dl-plans{display:grid;grid-template-columns:1fr;gap:20px;align-items:stretch}
@media(min-width:820px){.dl-plans{grid-template-columns:repeat(3,1fr);gap:24px}}
.dl-plan{
  position:relative;display:flex;flex-direction:column;overflow:hidden;
  padding:32px 28px;border-radius:24px;
  background:var(--bg-2);border:1px solid rgba(255,255,255,.08);
  transition:transform .35s var(--t),border-color .35s,box-shadow .35s;
}
.dl-plan:hover{transform:translateY(-6px);border-color:rgba(254,157,43,.35);box-shadow:var(--shadow-dark)}
.dl-plan.featured{background:linear-gradient(160deg,rgba(254,157,43,.14) 0%,rgba(20,22,42,.96) 62%);border-color:rgba(254,157,43,.42);box-shadow:0 30px 70px -30px rgba(254,157,43,.5)}
.dl-plan-flag{position:absolute;top:20px;right:20px;padding:6px 12px;border-radius:999px;background:var(--grad);color:#fff;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 6px 16px rgba(254,157,43,.4)}
.dl-plan-name{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-3);margin-bottom:12px}
.dl-plan-vol{font-size:clamp(30px,3.6vw,40px);font-weight:900;color:#fff;line-height:1;letter-spacing:-.03em}
.dl-plan-vol span{font-size:14px;font-weight:600;color:var(--ink-light-mute);letter-spacing:0}
.dl-plan-desc{font-size:14px;line-height:1.6;color:var(--ink-light-mute);margin:14px 0 22px;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.08)}
.dl-plan-list{display:grid;gap:11px;margin-bottom:26px;flex:1}
.dl-plan-list li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.5;color:var(--ink-light-soft)}
.dl-plan-list svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--ok)}
.dl-plan-list li.off{color:var(--ink-light-mute);opacity:.6}
.dl-plan-list li.off svg{color:var(--ink-mute)}
.dl-plan-price{font-size:13px;color:var(--ink-light-mute);margin-bottom:18px}
.dl-plan-price b{display:block;font-size:17px;color:#fff;font-weight:800;margin-bottom:3px}
.dl-plans-note{margin-top:28px;text-align:center;font-size:13px;color:var(--ink-light-mute);line-height:1.6}

/* ==========================================================================
   12. OPINIE
   ========================================================================== */
.dl-opinions{position:relative;padding:clamp(80px,9vw,130px) 0 clamp(64px,7vw,100px);background:radial-gradient(ellipse at top,#1a1d36 0%,#0e0f1a 65%);overflow:hidden}
.dl-opinions-bg{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.dl-opinions-orbit{position:absolute;top:50%;left:50%;width:120%;aspect-ratio:1;transform:translate(-50%,-50%);border:1px solid rgba(254,157,43,.08);border-radius:50%}
.js .dl-opinions-orbit{animation:dl-orbit-spin 90s linear infinite}
.dl-opinions-orbit::before,.dl-opinions-orbit::after{content:'';position:absolute;border:1px solid rgba(254,157,43,.06);border-radius:50%;inset:8%}
.dl-opinions-orbit::after{inset:18%;border-color:rgba(254,157,43,.05)}
@keyframes dl-orbit-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.dl-opinions-glow-1,.dl-opinions-glow-2{position:absolute;border-radius:50%;filter:blur(100px)}
.dl-opinions-glow-1{width:480px;height:480px;top:8%;left:-10%;background:rgba(254,157,43,.2)}
.dl-opinions-glow-2{width:430px;height:430px;bottom:8%;right:-8%;background:rgba(254,157,43,.15)}
.js .dl-opinions-glow-1{animation:dl-glow-a 16s ease-in-out infinite}
.js .dl-opinions-glow-2{animation:dl-glow-b 18s ease-in-out infinite}
@keyframes dl-glow-a{0%,100%{transform:translate(0,0) scale(1);opacity:.55}50%{transform:translate(40px,30px) scale(1.1);opacity:.85}}
@keyframes dl-glow-b{0%,100%{transform:translate(0,0) scale(1);opacity:.45}50%{transform:translate(-30px,-20px) scale(1.1);opacity:.75}}
.dl-opinions-container{position:relative;z-index:3}

.dl-opinions-stats{
  display:flex;justify-content:center;gap:clamp(24px,4vw,48px);flex-wrap:wrap;
  margin:0 auto clamp(44px,5vw,60px);padding:24px 32px;max-width:760px;
  background:rgba(20,22,42,.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(254,157,43,.2);border-radius:20px;box-shadow:0 20px 50px rgba(0,0,0,.3);
}
.dl-opinion-stat{text-align:center}
.dl-opinion-stat .num{font-size:clamp(26px,3.4vw,40px);font-weight:900;letter-spacing:-.03em;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.dl-opinion-stat .num span{font-size:.55em;-webkit-text-fill-color:var(--ink-light-mute);color:var(--ink-light-mute);font-weight:700}
.dl-opinion-stat .stars{color:var(--brand-3);font-size:14px;letter-spacing:2px;margin-top:6px}
.dl-opinion-stat .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-light-mute);font-weight:700;margin-top:6px}

.dl-opinions-wall{
  display:grid;grid-template-columns:1fr;gap:16px;height:560px;max-width:1400px;margin:0 auto;
  padding:0 20px;position:relative;z-index:3;
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
}
@media(min-width:700px){.dl-opinions-wall{grid-template-columns:repeat(2,1fr);height:640px;gap:20px}}
@media(min-width:1050px){.dl-opinions-wall{grid-template-columns:repeat(3,1fr);height:720px}}
.dl-opinions-col{position:relative;overflow:hidden;height:100%}
.dl-opinions-col-2{display:none}
.dl-opinions-col-3{display:none}
@media(min-width:700px){.dl-opinions-col-2{display:block}}
@media(min-width:1050px){.dl-opinions-col-3{display:block}}
.dl-opinions-track{display:flex;flex-direction:column;gap:16px;will-change:transform}
@media(min-width:700px){.dl-opinions-track{gap:20px}}
.js .dl-opinions-col-1 .dl-opinions-track{animation:dl-op-up 46s linear infinite}
.js .dl-opinions-col-2 .dl-opinions-track{animation:dl-op-down 54s linear infinite}
.js .dl-opinions-col-3 .dl-opinions-track{animation:dl-op-up 62s linear infinite}
@keyframes dl-op-up{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
@keyframes dl-op-down{0%{transform:translateY(-50%)}100%{transform:translateY(0)}}
.dl-opinions-wall:hover .dl-opinions-track{animation-play-state:paused}

.dl-opinion{
  position:relative;flex:none;padding:22px;border-radius:18px;
  background:linear-gradient(180deg,rgba(20,22,42,.88) 0%,rgba(14,15,26,.95) 100%);
  border:1px solid rgba(255,255,255,.06);
  transition:transform .35s var(--t),border-color .35s,background-color .35s;
}
.dl-opinion:hover{border-color:rgba(254,157,43,.35);transform:translateY(-2px)}
.dl-opinion.featured{background:linear-gradient(180deg,rgba(254,157,43,.12) 0%,rgba(14,15,26,.95) 100%);border-color:rgba(254,157,43,.3)}
.dl-opinion.featured::after{content:'"';position:absolute;top:6px;right:18px;font-size:70px;line-height:1;font-family:Georgia,serif;color:rgba(254,157,43,.18);font-weight:700;pointer-events:none}
.dl-opinion-stars{color:var(--brand-3);font-size:14px;letter-spacing:2px;margin-bottom:12px}
.dl-opinion p{color:var(--ink-light-soft);font-size:14px;line-height:1.6;margin:0 0 18px;position:relative;z-index:1}
.dl-opinion-author{display:flex;align-items:center;gap:12px;padding-top:14px;border-top:1px solid rgba(255,255,255,.06)}
.dl-opinion-author .av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:none;color:#fff;font-weight:800;font-size:13px;box-shadow:0 6px 16px rgba(254,157,43,.25)}
.dl-opinion-author .inf{min-width:0;flex:1}
.dl-opinion-author .inf b{display:block;color:#fff;font-size:13px;font-weight:800;letter-spacing:-.01em}
.dl-opinion-author .inf span{display:block;color:var(--ink-light-mute);font-size:11px;margin-top:2px;line-height:1.4}
.dl-opinion-author .inf em{color:var(--brand-3);font-style:normal;font-weight:700}

/* ==========================================================================
   13. FAQ
   ========================================================================== */
.dl-faq{max-width:880px;margin:0 auto}
.dl-faq-filter{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-bottom:28px}
.dl-faq-filter button{
  display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;
  background:var(--bg-2);border:1px solid rgba(255,255,255,.1);color:var(--ink-light-soft);
  font-size:13px;font-weight:700;transition:all .25s var(--t);
}
.dl-faq-filter button i{font-style:normal;min-width:20px;padding:0 5px;border-radius:999px;background:rgba(255,255,255,.08);font-size:11px;color:var(--ink-light-mute)}
.dl-faq-filter button:hover{border-color:rgba(254,157,43,.4);color:#fff}
.dl-faq-filter button.active{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 8px 22px rgba(254,157,43,.35)}
.dl-faq-filter button.active i{background:rgba(255,255,255,.24);color:#fff}
.dl-faq-item{background:var(--bg-2);border:1px solid rgba(255,255,255,.08);border-radius:16px;margin-bottom:12px;overflow:hidden;transition:border-color .3s,box-shadow .3s}
.dl-faq-item:hover{border-color:rgba(254,157,43,.35)}
.dl-faq-item.open{border-color:rgba(254,157,43,.5);box-shadow:0 16px 40px -18px rgba(254,157,43,.5)}
.dl-faq-item.hidden{display:none}
.dl-faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;text-align:left;font-size:16px;font-weight:700;color:#fff;line-height:1.4}
.dl-faq-q-txt{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dl-faq-cat{padding:3px 8px;border-radius:6px;background:rgba(254,157,43,.14);color:var(--brand-3);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;flex:none}
.dl-faq-ico{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:none;background:rgba(254,157,43,.14);color:var(--brand-3);transition:transform .3s var(--t),background .3s,color .3s}
.dl-faq-ico svg{width:15px;height:15px}
.dl-faq-item.open .dl-faq-ico{transform:rotate(45deg);background:var(--grad);color:#fff}
.dl-faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--t)}
.dl-faq-a-inner{padding:0 24px 22px;color:var(--ink-light-mute);line-height:1.7;font-size:14.5px}
.dl-faq-a-inner strong{color:#fff}
.dl-faq-a-inner ul{display:grid;gap:9px;margin:12px 0}
.dl-faq-a-inner li{display:flex;gap:10px;align-items:flex-start}
.dl-faq-a-inner li svg{width:15px;height:15px;flex:none;color:var(--brand);margin-top:4px}

/* ==========================================================================
   14. FORMULARZ
   ========================================================================== */
.dl-form-wrap{display:grid;grid-template-columns:1fr;gap:36px;align-items:start;position:relative;z-index:2}
@media(min-width:1000px){.dl-form-wrap{grid-template-columns:.92fr 1.08fr;gap:56px}}
.dl-deliver{display:grid;gap:16px;margin-top:32px;padding-top:26px;border-top:1px solid rgba(255,255,255,.1)}
.dl-deliver-title{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-3)}
.dl-deliver-item{display:flex;gap:14px;align-items:flex-start}
.dl-deliver-item i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--grad);color:#fff;font-style:normal;font-weight:900;font-size:13px;box-shadow:0 8px 18px rgba(254,157,43,.35)}
.dl-deliver-item b{display:block;font-size:15px;font-weight:800;color:#fff;line-height:1.3}
.dl-deliver-item span{display:block;font-size:13.5px;color:var(--ink-light-mute);line-height:1.55;margin-top:3px}
.dl-contact-row{margin-top:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-wrap:wrap;gap:22px}
.dl-contact-row a{display:flex;align-items:center;gap:11px;font-weight:800;color:#fff;font-size:15px}
.dl-contact-row svg{width:20px;height:20px;color:var(--brand-3);flex:none}
.dl-contact-row small{display:block;font-weight:400;font-size:12px;color:var(--ink-light-mute);margin-top:2px}

.dl-form-card{
  position:relative;padding:clamp(24px,3.2vw,36px);border-radius:24px;
  background:linear-gradient(160deg,rgba(26,29,54,.96) 0%,rgba(14,15,26,.98) 70%);
  border:1px solid rgba(254,157,43,.24);box-shadow:0 40px 90px -40px rgba(0,0,0,.9);
}
.dl-form-ribbon{
  position:absolute;top:-14px;left:50%;transform:translateX(-50%);
  padding:7px 18px;border-radius:999px;background:var(--grad);color:#fff;
  font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;
  box-shadow:0 10px 24px rgba(254,157,43,.45);
}
.dl-form-card h3{font-size:clamp(21px,2.4vw,26px);font-weight:800;color:#fff;margin:6px 0 8px;letter-spacing:-.01em}
.dl-form-card > p{font-size:14px;color:var(--ink-light-mute);margin-bottom:22px;line-height:1.6}
.dl-form-progress{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.dl-form-progress-bar{position:relative;flex:1;height:6px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.dl-form-progress-bar i{position:absolute;inset:0 auto 0 0;width:0;border-radius:3px;background:var(--grad);transition:width .35s var(--t)}
.dl-form-progress span{font-size:11.5px;font-weight:800;color:var(--ink-light-mute);white-space:nowrap}

.dl-form{display:grid;gap:14px}
@media(min-width:560px){.dl-form.two{grid-template-columns:1fr 1fr}.dl-form .full{grid-column:1/-1}}
.dl-field{position:relative;display:flex;flex-direction:column;gap:6px}
.dl-field label{font-size:13px;font-weight:700;color:#fff}
.dl-field label .req{color:var(--brand-3)}
.dl-field input,.dl-field select,.dl-field textarea{
  width:100%;padding:14px 16px;border-radius:12px;font-size:15px;
  background:rgba(255,255,255,.04);border:2px solid rgba(255,255,255,.1);color:#fff;
  transition:border-color .2s,background-color .2s,box-shadow .2s;
}
.dl-field textarea{min-height:96px;resize:vertical}
.dl-field input::placeholder,.dl-field textarea::placeholder{color:var(--ink-light-mute);opacity:.7}
.dl-field select{appearance:none;cursor:pointer;padding-right:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fe9d2b' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;background-size:16px}
.dl-field select option{background:#14162a;color:#fff}
.dl-field input:focus,.dl-field select:focus,.dl-field textarea:focus{outline:none;border-color:var(--brand);background:rgba(255,255,255,.06);box-shadow:0 0 0 4px rgba(254,157,43,.15)}
.dl-field.ok input,.dl-field.ok select{border-color:rgba(34,197,94,.55)}
.dl-field.err input,.dl-field.err select,.dl-field.err textarea{border-color:var(--bad);background:rgba(239,68,68,.07)}
.dl-field-msg{display:none;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#fca5a5}
.dl-field-msg svg{width:13px;height:13px;flex:none}
.dl-field.err .dl-field-msg{display:flex}
.dl-field-ok{position:absolute;right:14px;top:37px;width:18px;height:18px;color:var(--ok);opacity:0;transition:opacity .2s;pointer-events:none}
.dl-field.ok .dl-field-ok{opacity:1}

.dl-consent{display:flex;gap:12px;align-items:flex-start;font-size:12.5px;line-height:1.55;color:var(--ink-light-mute)}
.dl-consent input{flex:none;width:20px;height:20px;margin-top:2px;accent-color:var(--brand);cursor:pointer}
.dl-consent a{color:var(--brand-3);text-decoration:underline;text-underline-offset:2px}
.dl-consent.err{color:#fca5a5}
.dl-form-submit{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;
  padding:17px 24px;border-radius:999px;background:var(--grad);color:#fff;
  font-size:16px;font-weight:800;line-height:1.2;white-space:nowrap;
  box-shadow:0 10px 28px rgba(254,157,43,.4);
  transition:transform .3s var(--t),box-shadow .3s;
}
@media(max-width:400px){.dl-form-submit{font-size:15px;padding:16px 18px}}
.dl-form-submit:hover{background:var(--brand-hover)}
.dl-form-submit svg{width:18px;height:18px}
.dl-spinner{display:none;width:18px;height:18px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:dl-spin .7s linear infinite}
@keyframes dl-spin{to{transform:rotate(360deg)}}
.dl-form.sending .dl-form-submit{pointer-events:none;opacity:.9}
.dl-form.sending .dl-spinner{display:block}
.dl-form.sending .dl-form-submit .txt,.dl-form.sending .dl-form-submit .arr{display:none}
.dl-form-foot{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;margin-top:6px;font-size:12px;color:var(--ink-light-mute)}
.dl-form-foot span{display:inline-flex;align-items:center;gap:6px}
.dl-form-foot svg{width:14px;height:14px;color:var(--brand-3)}
.dl-form-error{display:none;padding:13px 16px;border-radius:12px;background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.35);color:#fca5a5;font-size:13px;margin-bottom:14px}
.dl-form-error.show{display:block}
.dl-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.dl-form-ok{display:none;text-align:center;padding:20px 0 8px}
.dl-form-wrap-done .dl-form,.dl-form-wrap-done .dl-form-progress{display:none}
.dl-form-wrap-done .dl-form-ok{display:block}
.dl-form-ok-ic{width:80px;height:80px;margin:0 auto 20px;border-radius:50%;background:var(--grad);display:grid;place-items:center;box-shadow:0 16px 36px rgba(254,157,43,.45);animation:dl-pop .5s var(--t)}
.dl-form-ok-ic svg{width:38px;height:38px;color:#fff}
@keyframes dl-pop{0%{transform:scale(0)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
.dl-form-ok h3{font-size:22px;font-weight:800;color:#fff;margin-bottom:10px}
.dl-form-ok p{font-size:14.5px;color:var(--ink-light-mute);line-height:1.6}
.dl-form-ok ul{display:grid;gap:11px;margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);text-align:left}
.dl-form-ok li{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink-light-soft)}
.dl-form-ok li svg{width:16px;height:16px;flex:none;color:var(--ok);margin-top:2px}

/* ==========================================================================
   15. STOPKA
   ========================================================================== */
.dl-footer{background:#080a12;border-top:1px solid rgba(255,255,255,.07);padding:clamp(48px,6vw,72px) 0 28px}
.dl-footer-grid{display:grid;grid-template-columns:1fr;gap:36px}
@media(min-width:700px){.dl-footer-grid{grid-template-columns:1.5fr 1fr 1fr}}
@media(min-width:1000px){.dl-footer-grid{grid-template-columns:1.7fr 1fr 1fr 1fr}}
.dl-footer-about p{font-size:14px;line-height:1.7;color:var(--ink-light-mute);margin:16px 0 0;max-width:40ch}
.dl-footer-contact{display:grid;gap:11px;margin-top:20px}
.dl-footer-contact a{display:inline-flex;align-items:center;gap:9px;color:#fff;font-weight:700;font-size:14px}
.dl-footer-contact svg{width:17px;height:17px;color:var(--brand-3);flex:none}
.dl-footer h4{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:16px}
.dl-footer ul{display:grid;gap:10px}
/* Odnośniki w stopce mają tylko 17 px tekstu, więc na telefonie trudno w nie
   trafić kciukiem. Pionowy odstęp robi z nich cel o wysokości ponad 40 px. */
.dl-footer li a{display:inline-block;padding:11px 0;font-size:14px;line-height:1.2;color:var(--ink-light-mute);transition:color .2s}
.dl-footer li a:hover{color:var(--brand-3)}
@media(min-width:760px){.dl-footer li a{padding:5px 0}}
.dl-footer-seo{margin-top:36px;padding-top:24px;border-top:1px solid rgba(255,255,255,.06);font-size:12px;line-height:1.75;color:rgba(154,160,180,.7)}
.dl-footer-seo a{color:var(--brand-3);text-decoration:underline;text-underline-offset:2px}
.dl-footer-bottom{margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.06);display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center;font-size:12.5px;color:rgba(154,160,180,.7)}
.dl-footer-bottom nav{display:flex;flex-wrap:wrap;gap:18px}
.dl-footer-bottom a:hover{color:var(--brand-3)}

/* ==========================================================================
   16. STICKY CTA (mobile)
   ========================================================================== */
.dl-sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:900;display:flex;gap:10px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:rgba(8,10,18,.96);backdrop-filter:blur(14px);border-top:1px solid rgba(255,255,255,.09);
  transform:translateY(110%);transition:transform .3s var(--t);
}
.dl-sticky.show{transform:translateY(0)}
.dl-sticky .dl-btn{flex:1;padding:14px 16px;font-size:14px}
.dl-sticky .dl-btn.icon{flex:0 0 54px;padding:0;background:rgba(255,255,255,.1);box-shadow:none}
.dl-sticky .dl-btn.icon::before{display:none}
@media(min-width:1120px){.dl-sticky{display:none}}
body:has(.dl-sticky.show) .dl-footer{padding-bottom:88px}

/* --------------------------------------------------------------------------
   3f. HERO NA MNIEJSZYCH EKRANACH
   Dzik z orbitą, plakietką i kartami zajmuje na telefonie prawie cały ekran
   i spycha przyciski poniżej zgięcia. Poniżej 1000 px chowamy całą prawą
   kolumnę, a liczby z kart przenosimy do jednej wąskiej linijki pod CTA.
   -------------------------------------------------------------------------- */
.dl-hero-mini{display:none}
@media(max-width:999px){
  .dl-hero-visual{display:none}
  .dl-hero-mini{
    display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px;
  }
  .dl-hero-mini span{
    display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;
    background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.11);
    font-size:12.5px;color:var(--ink-light-mute);line-height:1;
  }
  .dl-hero-mini b{color:#fff;font-weight:800;font-size:14px}
  .dl-hero-mini svg{width:15px;height:15px;flex:none;color:var(--brand-3)}
  .dl-hero-mini span.ok svg{color:var(--ok)}
  #dl-hero{padding-bottom:clamp(48px,6vw,72px)}
}

/* ==========================================================================
   3g. PANEL W HERO
   Zamiast maskotki pokazujemy produkt: kartę kontaktu, którą klient kupuje.
   ========================================================================== */
.dl-hero-panel{
  position:relative;border-radius:22px;overflow:hidden;
  background:linear-gradient(170deg,#151829 0%,#0c0e1a 100%);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 45px 100px -40px rgba(0,0,0,.95),0 0 0 1px rgba(254,157,43,.1);
}
.dl-hero-panel .dl-panel-bar{padding:13px 18px}
.dl-hero-panel-body{padding:20px 18px 4px}
.dl-hero-panel .dl-panel-lead-top{margin-bottom:16px}
.dl-hero-panel .dl-panel-row{padding:9.5px 0}
@media(min-width:520px){.dl-hero-panel .dl-panel-row{grid-template-columns:118px 1fr;gap:12px}}
.dl-hero-panel .dl-panel-row dd{font-size:14px}
.dl-hero-panel .dl-panel-row dd small{font-size:11px}
.dl-hero-panel .dl-panel-actions{margin:16px 0 20px}
.dl-hero-panel .dl-panel-btn{padding:10px 16px;font-size:12.5px}

.dl-hero-panel-today{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:rgba(255,255,255,.07);border-top:1px solid rgba(255,255,255,.07);
}
.dl-hero-panel-today div{padding:14px 8px;text-align:center;background:#0e1120}
.dl-hero-panel-today b{display:block;font-size:19px;font-weight:900;color:#fff;line-height:1}
.dl-hero-panel-today span{display:block;font-size:10px;color:var(--ink-light-mute);margin-top:5px;line-height:1.3}
.dl-hero-panel-today div.hot b{color:var(--brand-3)}

.dl-hero-panel-foot{
  display:flex;align-items:center;gap:10px;padding:13px 18px;
  background:rgba(254,157,43,.08);border-top:1px solid rgba(255,255,255,.07);
  font-size:12px;color:var(--ink-light-mute);line-height:1.45;
}
.dl-hero-panel-foot svg{width:16px;height:16px;flex:none;color:var(--brand-3)}
.dl-hero-panel-foot b{color:#fff}

.dl-hero-panel-cap{margin-top:14px;text-align:center;font-size:11.5px;color:rgba(154,160,180,.7);line-height:1.5}

/* Na telefonie panel zostaje, ale w wersji skróconej, żeby nie spychał
   przycisków w dół. Znikają dopiski pod wartościami i drugi przycisk. */
@media(max-width:999px){
  .dl-hero-panel .dl-panel-row dd small{display:none}
  .dl-hero-panel .dl-panel-row{padding:8px 0}
  .dl-hero-panel .dl-panel-btn.ghost{display:none}
  .dl-hero-panel .dl-panel-actions{margin:14px 0 18px}
  .dl-hero-panel-body{padding:18px 16px 2px}
  .dl-hero-panel-cap{font-size:11px;margin-top:12px}
}

/* plakietka rabatu przyklejona do rogu panelu */
.dl-hero-stage{position:relative}
.dl-hero-stage .dl-discount{
  position:absolute;top:-26px;right:-14px;z-index:4;
  width:clamp(84px,9vw,116px);
}
@media(max-width:999px){.dl-hero-stage .dl-discount{top:-18px;right:0;width:78px}}

/* ==========================================================================
   8a. DZIKI PANEL / demonstracja produktu
   Nie opisujemy, co klient dostanie. Pokazujemy to.
   ========================================================================== */
.dl-panel{
  max-width:1120px;margin:0 auto;border-radius:24px;overflow:hidden;
  background:linear-gradient(170deg,#141728 0%,#0d0f1c 100%);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 50px 110px -45px rgba(0,0,0,.95),0 0 0 1px rgba(254,157,43,.08);
}
.dl-panel-bar{
  display:flex;align-items:center;gap:12px;padding:14px 20px;
  background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.08);
}
.dl-panel-dots{display:flex;gap:6px;flex:none}
.dl-panel-dots i{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.14)}
.dl-panel-dots i:first-child{background:rgba(239,68,68,.5)}
.dl-panel-dots i:nth-child(2){background:rgba(254,157,43,.5)}
.dl-panel-dots i:nth-child(3){background:rgba(34,197,94,.5)}
.dl-panel-bar b{font-size:13px;font-weight:800;color:#fff;letter-spacing:.02em}
.dl-panel-bar b span{color:var(--brand-3)}
.dl-panel-demo{
  margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-light-mute);
}
.dl-panel-demo i{width:7px;height:7px;border-radius:50%;background:var(--brand-3);flex:none}

.dl-panel-body{display:grid;grid-template-columns:1fr;gap:0}
@media(min-width:900px){.dl-panel-body{grid-template-columns:1.35fr 1fr}}

/* karta kontaktu */
.dl-panel-lead{padding:clamp(20px,2.6vw,28px);border-bottom:1px solid rgba(255,255,255,.08)}
@media(min-width:900px){.dl-panel-lead{border-bottom:0;border-right:1px solid rgba(255,255,255,.08)}}
.dl-panel-lead-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.dl-panel-status{
  display:inline-flex;align-items:center;gap:7px;padding:6px 13px;border-radius:999px;
  background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.35);color:var(--ok-soft);
  font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
}
.dl-panel-status i{width:7px;height:7px;border-radius:50%;background:var(--ok);flex:none}
.dl-panel-status.taken{background:rgba(254,157,43,.14);border-color:rgba(254,157,43,.4);color:var(--brand-3)}
.dl-panel-status.taken i{background:var(--brand)}
.dl-panel-time{font-size:12px;color:var(--ink-light-mute);margin-left:auto}
.dl-panel-time b{color:#fff;font-weight:700}

.dl-panel-rows{display:grid;gap:0}
.dl-panel-row{
  display:grid;grid-template-columns:1fr;gap:2px;
  padding:11px 0;border-bottom:1px dashed rgba(255,255,255,.07);
}
@media(min-width:480px){.dl-panel-row{grid-template-columns:132px 1fr;gap:14px;align-items:baseline}}
.dl-panel-row:last-child{border-bottom:0}
.dl-panel-row dt{font-size:12px;color:rgba(154,160,180,.85);letter-spacing:.01em}
.dl-panel-row dd{font-size:14.5px;font-weight:700;color:#fff;line-height:1.4}
.dl-panel-row dd small{display:block;font-size:11.5px;font-weight:400;color:var(--ink-light-mute);margin-top:3px}
.dl-panel-ok{display:inline-flex;align-items:center;gap:6px;color:var(--ok-soft);font-size:13.5px;font-weight:700}
.dl-panel-ok svg{width:15px;height:15px;flex:none;color:var(--ok)}
.dl-panel-chip{
  display:inline-block;padding:3px 9px;border-radius:7px;
  background:rgba(254,157,43,.14);color:var(--brand-3);font-size:12.5px;font-weight:700;
}
.dl-panel-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.dl-panel-btn{
  display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:12px;
  font-size:13px;font-weight:800;transition:all .25s var(--t);
}
.dl-panel-btn svg{width:15px;height:15px;flex:none}
.dl-panel-btn.main{background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(254,157,43,.35)}
.dl-panel-btn.main:hover{transform:translateY(-2px)}
.dl-panel-btn.ghost{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:var(--ink-light-soft)}
.dl-panel-btn.done{background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.32);color:var(--ok-soft);pointer-events:none;box-shadow:none}

/* prawa kolumna: dzisiaj + strumień */
.dl-panel-side{padding:clamp(20px,2.6vw,28px);display:flex;flex-direction:column;gap:20px}
.dl-panel-side h4{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-light-mute);margin:0 0 12px}
.dl-panel-day{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.dl-panel-day div{padding:13px 10px;border-radius:13px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);text-align:center}
.dl-panel-day b{display:block;font-size:22px;font-weight:900;color:#fff;line-height:1}
.dl-panel-day span{display:block;font-size:10.5px;color:var(--ink-light-mute);margin-top:5px;line-height:1.3}
.dl-panel-day div.hot b{color:var(--brand-3)}

.dl-panel-feed{display:grid;gap:8px}
.dl-panel-feed li{
  display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
}
.dl-panel-feed i{width:8px;height:8px;border-radius:50%;flex:none}
.dl-panel-feed .ok i{background:var(--ok)}
.dl-panel-feed .wait i{background:var(--brand-3)}
.dl-panel-feed b{font-size:12.5px;font-weight:700;color:#fff;line-height:1.3}
.dl-panel-feed span{display:block;font-size:11px;color:var(--ink-light-mute);margin-top:2px}
.dl-panel-feed em{margin-left:auto;font-style:normal;font-size:11px;color:rgba(154,160,180,.75);white-space:nowrap}

.dl-panel-foot{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:16px 20px;background:rgba(254,157,43,.06);border-top:1px solid rgba(255,255,255,.08);
  font-size:13px;color:var(--ink-light-mute);line-height:1.5;
}
.dl-panel-foot svg{width:18px;height:18px;flex:none;color:var(--brand-3)}
.dl-panel-foot b{color:#fff}
.dl-panel-note{margin-top:18px;text-align:center;font-size:12px;color:rgba(154,160,180,.7)}

/* ==========================================================================
   8b. DZIKI SYSTEM / pięć kroków
   ========================================================================== */
.dl-sys{display:grid;grid-template-columns:1fr;gap:14px;position:relative}
@media(min-width:700px){.dl-sys{grid-template-columns:repeat(2,1fr);gap:18px}}
@media(min-width:1150px){.dl-sys{grid-template-columns:repeat(5,1fr);gap:14px}}
.dl-sys-step{
  position:relative;overflow:hidden;padding:26px 22px 24px;border-radius:20px;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 18px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-sys-step::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--t)}
.dl-sys-step:hover{transform:translateY(-6px);box-shadow:0 28px 55px -24px rgba(254,157,43,.35);border-color:transparent}
.dl-sys-step:hover::before{transform:scaleX(1)}
.dl-sys-no{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:13px;margin-bottom:16px;
  background:var(--bg-2);color:#fff;font-size:14px;font-weight:900;letter-spacing:.02em;
  transition:background .3s ease;
}
.dl-sys-step:hover .dl-sys-no{background:var(--grad)}
.dl-sys-step h3{font-size:15px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin-bottom:9px}
.dl-sys-step p{font-size:13.5px;line-height:1.6;color:var(--ink-soft);margin:0}
.dl-sys-tag{
  display:inline-block;margin-top:14px;padding:5px 11px;border-radius:8px;
  background:var(--brand-soft);color:var(--brand);font-size:11px;font-weight:800;
}
.dl-sys-quote{
  max-width:760px;margin:0 auto clamp(32px,4vw,44px);padding:22px 26px;border-radius:18px;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 18px rgba(15,23,42,.05);
  display:flex;gap:16px;align-items:flex-start;
}
.dl-sys-quote-ic{width:44px;height:44px;border-radius:13px;flex:none;display:inline-flex;align-items:center;justify-content:center;background:var(--grad);color:#fff}
.dl-sys-quote-ic svg{width:22px;height:22px;display:block}
.dl-sys-quote small{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:6px}
.dl-sys-quote p{margin:0;font-size:clamp(15px,1.7vw,18px);font-weight:700;color:var(--ink);line-height:1.5}

/* ==========================================================================
   9a. KALKULATOR OPŁACALNOŚCI
   Klient wpisuje swoje liczby i widzi, ile może zapłacić za jeden kontakt.
   ========================================================================== */
.dl-calc{display:grid;grid-template-columns:1fr;gap:20px;align-items:start}
@media(min-width:1000px){.dl-calc{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:28px}}

.dl-calc-panel{
  padding:clamp(22px,3vw,32px);border-radius:24px;
  background:rgba(20,22,42,.72);border:1px solid rgba(255,255,255,.08);
}
.dl-calc-panel h3{font-size:15px;font-weight:800;color:#fff;margin-bottom:4px}
.dl-calc-panel > p{font-size:13px;color:var(--ink-light-mute);margin-bottom:22px;line-height:1.55}

.dl-calc-prod{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:24px}
.dl-calc-prod button{
  padding:12px 8px;border-radius:13px;text-align:center;
  background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.1);
  color:var(--ink-light-mute);font-size:12.5px;font-weight:700;line-height:1.3;
  transition:all .25s var(--t);
}
.dl-calc-prod button:hover{border-color:rgba(254,157,43,.4);color:#fff}
.dl-calc-prod button.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 8px 22px rgba(254,157,43,.35)}

.dl-calc-field{margin-bottom:22px}
.dl-calc-lab{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.dl-calc-lab span{font-size:13.5px;color:var(--ink-light-soft);font-weight:600}
.dl-calc-lab b{font-size:17px;font-weight:800;color:#fff;white-space:nowrap}
.dl-calc-lab b em{font-style:normal;font-size:12px;color:var(--ink-light-mute);font-weight:600;margin-left:3px}

/* Suwak ma 6 px paska, ale 28 px wysokości elementu, żeby dało się go złapać
   kciukiem na telefonie. Przezroczysta ramka wewnętrzna robi pole dotyku. */
.dl-calc-field input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:28px;
  border-radius:3px;border:11px solid transparent;
  background:rgba(255,255,255,.12);background-clip:content-box;
  outline:none;cursor:pointer;
}
.dl-calc-field input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;
  background:var(--grad);border:3px solid #0e0f1a;cursor:grab;
  box-shadow:0 4px 14px rgba(254,157,43,.55);
}
.dl-calc-field input[type=range]::-webkit-slider-thumb:active{cursor:grabbing}
.dl-calc-field input[type=range]::-moz-range-thumb{
  width:20px;height:20px;border-radius:50%;background:#FF7A3D;
  border:3px solid #0e0f1a;cursor:grab;box-shadow:0 4px 14px rgba(254,157,43,.55);
}
.dl-calc-hint{display:flex;justify-content:space-between;font-size:11px;color:rgba(154,160,180,.7);margin-top:7px}

.dl-calc-out{
  position:relative;overflow:hidden;padding:clamp(22px,3vw,32px);border-radius:24px;
  background:linear-gradient(165deg,rgba(254,157,43,.14) 0%,rgba(14,15,26,.95) 62%);
  border:1px solid rgba(254,157,43,.32);box-shadow:0 30px 70px -34px rgba(254,157,43,.5);
}
.dl-calc-out::after{content:'';position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(254,157,43,.3),transparent 70%);right:-120px;top:-150px;filter:blur(50px);pointer-events:none}
.dl-calc-out > *{position:relative;z-index:1}

.dl-calc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:20px}
.dl-calc-tile{padding:16px 16px 15px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.dl-calc-tile b{display:block;font-size:clamp(20px,2.4vw,26px);font-weight:900;color:#fff;line-height:1.05;letter-spacing:-.02em}
.dl-calc-tile span{display:block;font-size:11.5px;color:var(--ink-light-mute);margin-top:6px;line-height:1.4}

.dl-calc-hero{
  padding:22px;border-radius:18px;text-align:center;
  background:rgba(14,15,26,.55);border:1px solid rgba(254,157,43,.35);
}
.dl-calc-hero small{display:block;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--brand-3);margin-bottom:10px}
.dl-calc-hero b{
  display:block;font-size:clamp(34px,5.2vw,52px);font-weight:900;line-height:1;letter-spacing:-.03em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
}
.dl-calc-hero p{font-size:13px;color:var(--ink-light-soft);margin-top:12px;line-height:1.6}
.dl-calc-hero p em{font-style:normal;color:#fff;font-weight:700}

/* Suwak z ceną kontaktu jest jedyną liczbą, którą klient wpisuje o nas,
   więc dostaje własną ramkę, żeby nie zginął między pozostałymi czterema. */
.dl-calc-field.mark{
  padding:16px 16px 14px;border-radius:16px;margin-top:26px;
  background:rgba(254,157,43,.07);border:1px solid rgba(254,157,43,.24);
}
.dl-calc-tip{margin-top:10px;font-size:11.5px;line-height:1.55;color:rgba(154,160,180,.85)}

.dl-calc-tile.cost b{
  background:none;-webkit-text-fill-color:currentColor;color:var(--brand-3);
}

.dl-calc-hero.minus{border-color:rgba(255,255,255,.16);background:rgba(14,15,26,.72)}
.dl-calc-hero.minus small{color:var(--ink-light-mute)}
.dl-calc-hero.minus b{
  background:none;-webkit-text-fill-color:currentColor;color:#fff;opacity:.65;
}

/* Dwa fakty pod wynikiem: zwrot z każdej złotówki i liczba umów,
   która pokrywa całą dostawę. To one tłumaczą wynik, nie sam wynik. */
.dl-calc-facts{display:grid;grid-template-columns:1fr;gap:10px;margin-top:14px}
@media(min-width:520px){.dl-calc-facts{grid-template-columns:1fr 1fr}}
.dl-calc-fact{
  display:flex;align-items:flex-start;gap:11px;padding:14px 14px 13px;border-radius:14px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
}
.dl-calc-fact svg{
  flex:0 0 auto;width:20px;height:20px;margin-top:1px;color:var(--brand-3);
}
.dl-calc-fact b{display:block;font-size:16px;font-weight:900;color:#fff;line-height:1.15;letter-spacing:-.01em}
.dl-calc-fact span{display:block;font-size:11.5px;color:var(--ink-light-mute);margin-top:5px;line-height:1.45}

.dl-calc-cta{margin-top:20px}
.dl-calc-note{margin-top:16px;font-size:11.5px;line-height:1.6;color:rgba(154,160,180,.75);text-align:center}

@media(max-width:400px){
  .dl-calc-prod{grid-template-columns:1fr}
  .dl-calc-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   9b. PORÓWNANIE PUNKT PO PUNKCIE
   Jedna tabela, bez ozdobników. Pięć rzeczy, które klient realnie porównuje.
   ========================================================================== */

.dl-cmp{margin-top:26px;border-radius:20px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:rgba(20,22,42,.6)}
.dl-cmp-row{display:grid;grid-template-columns:1fr;gap:8px;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.06)}
.dl-cmp-row:last-child{border-bottom:0}
.dl-cmp-row.head{display:none}
@media(min-width:820px){
  .dl-cmp-row{grid-template-columns:1.05fr 1fr 1fr;gap:20px;align-items:center;padding:15px 24px}
  .dl-cmp-row.head{display:grid;background:rgba(255,255,255,.035);font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--ink-light-mute)}
}
.dl-cmp-k{font-weight:700;color:#fff;font-size:14px}
.dl-cmp-a,.dl-cmp-b{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;line-height:1.5}
.dl-cmp-a{color:var(--ink-light-mute)}
.dl-cmp-b{color:#fff}
.dl-cmp-a svg,.dl-cmp-b svg{width:15px;height:15px;flex:none;margin-top:3px}
.dl-cmp-a svg{color:var(--bad)}
.dl-cmp-b svg{color:var(--ok)}
.dl-cmp-b b{color:var(--brand-3);font-weight:700}
@media(max-width:819px){
  .dl-cmp-a::before,.dl-cmp-b::before{
    content:attr(data-l);flex:none;width:46px;font-size:10px;font-weight:800;
    letter-spacing:.08em;text-transform:uppercase;opacity:.55;margin-top:3px;
  }
}
.dl-cmp-foot{margin-top:26px;text-align:center}

/* ==========================================================================
   16b. DOSZLIFOWANIE POD TELEFON
   Większe pola dotyku, czytelniejszy tekst, spokojniejsze odstępy.
   ========================================================================== */
@media(max-width:760px){
  /* każdy przycisk łatwy do trafienia kciukiem */
  .dl-btn.sm{padding:14px 20px;font-size:14px}
  .dl-toast-x{width:32px;height:32px;top:7px;right:7px}
  .dl-toast-x svg{width:15px;height:15px}

  /* tekst pomocniczy nie schodzi poniżej 14 px */
  .dl-hero-usp li,.dl-guar-item p,.dl-src p,.dl-branze-desc,.dl-why-card p,
  .dl-plan-list li,.dl-step-list li,.dl-opinion p{font-size:14px}
  .dl-faq-a-inner{font-size:14.5px}

  /* przyciski w hero i na kartach na pełną szerokość */
  .dl-hero-cta-row{gap:10px}
  .dl-hero-cta-row .dl-btn{width:100%}
  .dl-branze-help .dl-btn,.dl-guar-foot .dl-btn{width:100%}
  .dl-guar-foot{flex-direction:column;align-items:flex-start;text-align:left}
  .dl-src-note{flex-direction:column;align-items:flex-start}

  /* mniej powietrza, żeby strona nie ciągnęła się w nieskończoność */
  .dl-section{padding:56px 0}
  .dl-section-head{margin-bottom:32px}
  .dl-opinions{padding:64px 0 56px}

  /* wizual hero: nic nie wychodzi poza ekran */
  .dl-hero-visual{min-height:360px}
  .dl-hero-card-roas{bottom:2%;left:0}
  .dl-hero-card-pickup{top:26%;right:0}
  .dl-discount{width:clamp(88px,23vw,112px);top:0}
}
@media(max-width:420px){
  .dl-container{padding:0 16px}
  .dl-hero-h1{font-size:clamp(26px,7.6vw,32px)}
  .dl-hero-dzik img{width:min(250px,64vw)}
  .dl-seal{width:min(240px,68vw)}
  .dl-hero-card{padding:9px 12px;gap:8px}
  .dl-hero-card .num{font-size:15px}
  .dl-hero-card .lbl{font-size:9.5px}
  .dl-plan,.dl-guar-item,.dl-why-card,.dl-src,.dl-step{padding:22px 18px}
  .dl-form-card{padding:22px 18px}
  .dl-faq-q{padding:17px 18px;font-size:15px}
  .dl-faq-a-inner{padding:0 18px 20px}
}

/* ==========================================================================
   17. DOSTĘPNOŚĆ / REDUKCJA RUCHU
   ========================================================================== */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .js .dl-reveal{opacity:1;transform:none}
}
.dl-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ==========================================================================
   18. IKONY: gwarantowane wyśrodkowanie
   Reguły tekstowe potrafią nadpisać display kontenera ikony, dlatego
   trzymamy je tutaj, na końcu arkusza i z wyższą specyficznością.
   ========================================================================== */
.dl-mega-link .dl-mega-ic,.dl-guar-foot .dl-guar-foot-ic,.dl-src-note .dl-src-note-ic,
.dl-guar-ic,.dl-src-ic,.dl-stat-ic,.dl-pain-ic,.dl-branze-ic,.dl-branze-ic-custom,.dl-why-ic,
.dl-branze-help .dl-branze-help-ic,.dl-vs-ic-bad,.dl-vs-ic-good,.dl-faq-ico,.dl-branze-arrow,
.dl-hero-usp .ic,.dl-hero-card .ic,.dl-toast .dl-toast-ic,.dl-deliver-item i,.dl-toast-x{
  display:inline-flex;align-items:center;justify-content:center;line-height:0;
}
.dl-mega-link .dl-mega-ic svg,.dl-guar-foot .dl-guar-foot-ic svg,.dl-src-note .dl-src-note-ic svg,
.dl-guar-ic svg,.dl-src-ic svg,.dl-stat-ic svg,.dl-pain-ic svg,.dl-branze-ic svg,.dl-branze-ic-custom svg,
.dl-why-ic svg,.dl-branze-help-ic svg,.dl-vs-ic-bad svg,.dl-vs-ic-good svg,.dl-faq-ico svg,
.dl-branze-arrow svg,.dl-hero-usp .ic svg,.dl-hero-card .ic svg,.dl-toast-ic svg{display:block;flex:none}

/* ==========================================================================
   20. PODSTRONY PRODUKTOWE
   Fotowoltaika, pompy ciepła, magazyny energii. Ten sam silnik dl-*,
   lżejszy nagłówek: bez panelu i bez animowanego tła, bo tu liczy się
   szybkie dojście do treści, a nie efekt pierwszego wrażenia.
   ========================================================================== */

.dl-sub-hero{
  position:relative;overflow:hidden;
  background:radial-gradient(ellipse at 70% 0,#1a1d36 0%,#0e0f1a 68%);
  padding:calc(var(--header-h) + 34px) 0 74px;
}
@media(min-width:900px){.dl-sub-hero{padding:calc(var(--header-h) + 52px) 0 92px}}
.dl-sub-hero > .dl-container{position:relative;z-index:1}

/* okruszki */
.dl-crumbs{
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  font-size:12.5px;color:var(--ink-light-mute);margin-bottom:26px;
}
.dl-crumbs a{color:var(--ink-light-mute);text-decoration:none;transition:color .2s}
.dl-crumbs a:hover{color:var(--brand-3)}
.dl-crumbs span[aria-hidden]{opacity:.45}
.dl-crumbs [aria-current]{color:var(--ink-light-soft);font-weight:700}

.dl-sub-hero-grid{display:grid;grid-template-columns:1fr;gap:34px;align-items:start}
@media(min-width:1000px){
  .dl-sub-hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px}
}
.dl-sub-hero-copy .dl-h1{margin-bottom:18px}
.dl-sub-hero-copy .dl-lead{max-width:60ch}

.dl-sub-bullets{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
.dl-sub-bullets li{display:flex;align-items:flex-start;gap:11px;font-size:14.5px;color:var(--ink-light-soft);line-height:1.5}
.dl-sub-bullets svg{
  flex:0 0 auto;width:19px;height:19px;padding:3.5px;margin-top:1px;border-radius:50%;
  background:rgba(34,197,94,.14);color:var(--ok-soft);
}

.dl-sub-cta{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:30px}
.dl-sub-cta-note{font-size:12.5px;color:var(--ink-light-mute);line-height:1.5}

/* karta ze standardem kontaktu */
.dl-spec{
  position:relative;padding:22px;border-radius:22px;
  background:linear-gradient(165deg,rgba(254,157,43,.13) 0%,rgba(20,22,42,.96) 58%);
  border:1px solid rgba(254,157,43,.3);box-shadow:0 30px 70px -34px rgba(254,157,43,.5);
}
.dl-spec-top{display:flex;align-items:center;gap:13px;padding-bottom:16px;margin-bottom:4px;border-bottom:1px solid rgba(255,255,255,.09)}
.dl-spec-ic{
  width:42px;height:42px;border-radius:13px;flex:none;
  display:grid;place-items:center;background:var(--grad);color:#fff;
}
.dl-spec-ic svg{width:22px;height:22px;display:block}
.dl-spec-top small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--brand-3)}
.dl-spec-top b{display:block;font-size:16px;font-weight:800;color:#fff;margin-top:3px}

.dl-spec-rows{margin:0}
.dl-spec-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:11px 0;border-bottom:1px dashed rgba(255,255,255,.08);
}
.dl-spec-row:last-child{border-bottom:0}
.dl-spec-row dt{font-size:12.5px;color:var(--ink-light-mute);flex:none}
.dl-spec-row dd{margin:0;font-size:13.5px;font-weight:700;color:#fff;text-align:right;line-height:1.4}

.dl-spec-foot{
  display:flex;align-items:center;gap:9px;margin:16px 0 0;padding-top:15px;
  border-top:1px solid rgba(255,255,255,.09);font-size:12px;color:var(--ink-light-soft);line-height:1.45;
}
.dl-spec-foot svg{flex:none;width:17px;height:17px;color:var(--ok-soft)}

/* blok pytań i krótkich odpowiedzi (czytany też przez asystentów AI) */
.dl-qa{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:760px){.dl-qa{grid-template-columns:1fr 1fr}}
.dl-qa-item{
  padding:22px 22px 20px;border-radius:18px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);
  transition:border-color .3s,transform .3s var(--t);
}
.dl-qa-item:hover{border-color:rgba(254,157,43,.3);transform:translateY(-2px)}
.dl-qa-item h3{font-size:16px;font-weight:800;color:#fff;margin:0 0 9px;line-height:1.35}
.dl-qa-item p{margin:0;font-size:14px;line-height:1.65;color:var(--ink-light-soft)}
@media(min-width:760px){
  /* pierwsze pytanie jest definicją produktu, więc dostaje pełną szerokość */
  .dl-qa-item:first-child{grid-column:1/-1;background:rgba(254,157,43,.08);border-color:rgba(254,157,43,.26)}
}

/* warianty leada */
.dl-vars{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:640px){.dl-vars{grid-template-columns:1fr 1fr}}
@media(min-width:1060px){.dl-vars{grid-template-columns:repeat(4,1fr)}}
.dl-var{
  position:relative;padding:26px 22px 24px;border-radius:20px;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 18px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-var:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(254,157,43,.16);border-color:rgba(254,157,43,.4)}
.dl-var-no{
  display:inline-block;font-size:12px;font-weight:900;letter-spacing:.06em;margin-bottom:12px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.dl-var h3{font-size:17px;font-weight:800;color:var(--ink);margin:0 0 8px;line-height:1.3}
.dl-var p{margin:0;font-size:13.5px;line-height:1.6;color:var(--ink-soft)}

/* odnośniki do pozostałych podstron */
.dl-rels{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:820px){.dl-rels{grid-template-columns:repeat(3,1fr)}}
.dl-rel{
  display:flex;align-items:center;gap:14px;padding:18px;border-radius:18px;text-decoration:none;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 18px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-rel:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(254,157,43,.16);border-color:rgba(254,157,43,.4)}
.dl-rel-ic{
  width:46px;height:46px;border-radius:14px;flex:none;
  display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);
}
.dl-rel-ic svg{width:23px;height:23px;display:block}
.dl-rel-txt{min-width:0;flex:1}
.dl-rel-txt b{display:block;font-size:15px;font-weight:800;color:var(--ink);line-height:1.3}
.dl-rel-txt > span{display:block;font-size:12.5px;color:var(--ink-soft);margin-top:4px;line-height:1.45}
.dl-rel-arr{flex:none;color:var(--brand);line-height:0;transition:transform .3s var(--t)}
.dl-rel-arr svg{width:19px;height:19px;display:block}
.dl-rel:hover .dl-rel-arr{transform:translateX(4px)}

/* na podstronach sekcja kontaktu nie ma nad sobą sekcji jasnej z cieniem */
.dl-sub-hero .dl-hero-eyebrow{margin-bottom:22px}

/* ==========================================================================
   21. STRONY TEMATYCZNE
   Cennik, wyłączność, gwarancja. Bloki składane z danych, więc te same
   klasy muszą wyglądać poprawnie na każdym z czterech teł sekcji.
   ========================================================================== */

/* karty na ciemnym tle: domyślne .dl-var są białe, tu potrzebna odwrotność */
.dl-section.deep .dl-var,
.dl-section.dark .dl-var{
  background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.09);box-shadow:none;
}
.dl-section.deep .dl-var:hover,
.dl-section.dark .dl-var:hover{
  background:rgba(255,255,255,.07);border-color:rgba(254,157,43,.34);box-shadow:0 18px 44px -20px rgba(254,157,43,.5);
}
.dl-section.deep .dl-var h3,
.dl-section.dark .dl-var h3{color:#fff}
.dl-section.deep .dl-var p,
.dl-section.dark .dl-var p{color:var(--ink-light-soft)}

/* siatka trzykolumnowa dla bloków po trzy karty */
@media(min-width:1000px){.dl-vars.trzy{grid-template-columns:repeat(3,1fr)}}

/* kropka zamiast numeru w kartach nienumerowanych */
.dl-var-dot{
  display:block;width:26px;height:5px;border-radius:99px;margin-bottom:14px;background:var(--grad);
}

/* zdanie domykające blok */
.dl-blok-stopka{
  max-width:74ch;margin:26px auto 0;text-align:center;font-size:14px;line-height:1.7;
  color:var(--ink-soft);
}
.dl-section.deep .dl-blok-stopka,
.dl-section.dark .dl-blok-stopka{color:var(--ink-light-mute)}

/* --- tabela tematyczna (zawsze na ciemnym tle) --------------------------- */
.dl-tab{margin-top:26px;border-radius:20px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:rgba(20,22,42,.6)}
.dl-tab-row{display:grid;grid-template-columns:1fr;gap:8px;padding:18px;border-bottom:1px solid rgba(255,255,255,.06)}
.dl-tab-row:last-child{border-bottom:0}
.dl-tab-row.head{display:none}
@media(min-width:860px){
  .dl-tab-row{grid-template-columns:.85fr 1.1fr 1.1fr;gap:24px;align-items:start;padding:18px 24px}
  .dl-tab-row.head{
    display:grid;background:rgba(255,255,255,.035);font-size:11px;letter-spacing:.1em;
    text-transform:uppercase;font-weight:800;color:var(--ink-light-mute);
  }
}
.dl-tab-k{font-weight:800;color:#fff;font-size:14.5px;line-height:1.4}
.dl-tab-a,.dl-tab-b{font-size:13.5px;line-height:1.6}
.dl-tab-a{color:var(--ink-light-mute)}
.dl-tab-b{color:var(--ink-light-soft)}
.dl-tab-row:not(.head) .dl-tab-b{
  padding-left:13px;border-left:2px solid rgba(254,157,43,.55);
}
@media(max-width:859px){
  .dl-tab-a::before,.dl-tab-b::before{
    content:attr(data-l);display:block;margin-bottom:4px;font-size:10px;font-weight:800;
    letter-spacing:.09em;text-transform:uppercase;color:var(--ink-light-mute);opacity:.75;
  }
  .dl-tab-row:not(.head) .dl-tab-b{padding-left:11px}
}

/* --- blok prozy z wyróżnikiem ------------------------------------------- */
.dl-proza{max-width:74ch}
.dl-proza p{margin:0 0 18px;font-size:clamp(15px,1.25vw,16.5px);line-height:1.8;color:var(--ink-soft)}
.dl-proza p:last-child{margin-bottom:0}
.dl-section.deep .dl-proza p,
.dl-section.dark .dl-proza p{color:var(--ink-light-soft)}

.dl-wyroznik{
  display:flex;flex-direction:column;align-items:flex-start;gap:16px;
  max-width:74ch;margin-top:28px;padding:22px;border-radius:18px;
  background:linear-gradient(135deg,rgba(254,157,43,.1),rgba(254,157,43,.06));
  border:1px solid rgba(254,157,43,.28);
}
@media(min-width:700px){.dl-wyroznik{flex-direction:row;align-items:center;justify-content:space-between;gap:24px}}
.dl-wyroznik b{display:block;font-size:16px;font-weight:800;color:var(--ink);line-height:1.3}
.dl-wyroznik span{display:block;font-size:13.5px;line-height:1.6;color:var(--ink-soft);margin-top:6px}
.dl-wyroznik .dl-btn{flex:none}
.dl-section.deep .dl-wyroznik b,
.dl-section.dark .dl-wyroznik b{color:#fff}
.dl-section.deep .dl-wyroznik span,
.dl-section.dark .dl-wyroznik span{color:var(--ink-light-soft)}

/* na stronach tematycznych karta faktów nie opisuje produktu, tylko warunki */
.dl-sub-hero .dl-hero-eyebrow b{color:#fff}

/* ==========================================================================
   22. PODSTRONY REGIONALNE
   Szesnaście województw plus strona zbiorcza. Trzy nowe elementy:
   siatka wyboru województwa, karty trzech produktów w regionie
   i lista największych ośrodków.
   ========================================================================== */

/* --- siatka wyboru województwa (strona zbiorcza) ------------------------ */
.dl-wojs{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:620px){.dl-wojs{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.dl-wojs{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1240px){.dl-wojs{grid-template-columns:repeat(4,1fr)}}

.dl-woj{
  display:flex;align-items:center;gap:12px;padding:15px 16px;border-radius:16px;text-decoration:none;
  background:#fff;border:1px solid var(--line);box-shadow:0 3px 14px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-woj:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(254,157,43,.16);border-color:rgba(254,157,43,.42)}
.dl-woj-ic{
  width:38px;height:38px;border-radius:12px;flex:none;
  display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);
}
.dl-woj-ic svg{width:19px;height:19px;display:block}
.dl-woj-txt{min-width:0;flex:1}
.dl-woj-txt b{display:block;font-size:14.5px;font-weight:800;color:var(--ink);line-height:1.25}
.dl-woj-txt span{
  display:block;font-size:11.5px;color:var(--ink-soft);margin-top:3px;line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.dl-woj-arr{flex:none;color:var(--brand);line-height:0;transition:transform .3s var(--t)}
.dl-woj-arr svg{width:17px;height:17px;display:block}
.dl-woj:hover .dl-woj-arr{transform:translateX(4px)}

/* --- trzy produkty w regionie ------------------------------------------ */
.dl-prods{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:820px){.dl-prods{grid-template-columns:repeat(3,1fr)}}
.dl-prod{
  display:flex;flex-direction:column;padding:26px 22px 22px;border-radius:20px;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 18px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-prod:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(254,157,43,.16);border-color:rgba(254,157,43,.4)}
.dl-prod-ic{
  width:48px;height:48px;border-radius:15px;margin-bottom:16px;
  display:grid;place-items:center;background:var(--grad);color:#fff;box-shadow:var(--shadow-md);
}
.dl-prod-ic svg{width:25px;height:25px;display:block}
.dl-prod h3{font-size:18px;font-weight:800;color:var(--ink);margin:0 0 9px;line-height:1.3}
.dl-prod p{margin:0 0 18px;font-size:13.5px;line-height:1.65;color:var(--ink-soft);flex:1}
.dl-prod a{
  display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:800;
  color:var(--brand);text-decoration:none;transition:gap .25s var(--t);
}
.dl-prod a svg{width:16px;height:16px}
.dl-prod a:hover{gap:11px}

/* --- lista największych ośrodków --------------------------------------- */
.dl-miasta{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
@media(min-width:640px){.dl-miasta{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1000px){.dl-miasta{grid-template-columns:repeat(4,1fr)}}
.dl-miasta li{
  display:flex;align-items:center;gap:9px;padding:13px 14px;border-radius:13px;
  background:#fff;border:1px solid var(--line);
  font-size:14px;font-weight:700;color:var(--ink);
}
.dl-miasta svg{flex:0 0 auto;width:17px;height:17px;color:var(--brand)}
.dl-miasta span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* odnośnik wyróżniony w stopce bloku */
.dl-link-mocny{
  display:inline-flex;align-items:center;gap:8px;
  font-weight:800;color:var(--brand);text-decoration:none;
  transition:gap .25s var(--t);
}
.dl-link-mocny svg{width:17px;height:17px}
.dl-link-mocny:hover{gap:12px}
.dl-section.deep .dl-link-mocny,
.dl-section.dark .dl-link-mocny{color:var(--brand-3)}

/* ==========================================================================
   23. BLOG I ARTYKUŁY
   Lista wpisów, nagłówek artykułu, spis treści i kolumna tekstu.
   Artykuł ma węższą kolumnę niż reszta serwisu, bo linijka powyżej
   około 75 znaków męczy oko i ludzie przestają czytać w połowie.
   ========================================================================== */

/* --- lista wpisów -------------------------------------------------------- */
.dl-wpisy{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:700px){.dl-wpisy{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.dl-wpisy{grid-template-columns:repeat(3,1fr)}}

.dl-wpis{
  display:flex;flex-direction:column;padding:24px 22px 20px;border-radius:20px;text-decoration:none;
  background:#fff;border:1px solid var(--line);box-shadow:0 4px 18px rgba(15,23,42,.05);
  transition:transform .3s var(--t),box-shadow .3s,border-color .3s;
}
.dl-wpis:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(254,157,43,.16);border-color:rgba(254,157,43,.4)}
.dl-wpis-kat{
  display:inline-block;align-self:flex-start;margin-bottom:13px;padding:5px 11px;border-radius:999px;
  background:var(--brand-soft);color:var(--brand);
  font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
}
.dl-wpis b{display:block;font-size:17px;font-weight:800;color:var(--ink);line-height:1.3;margin-bottom:10px}
.dl-wpis-lead{display:block;font-size:13.5px;line-height:1.6;color:var(--ink-soft);flex:1}
.dl-wpis-foot{
  display:flex;align-items:center;gap:7px;margin-top:18px;padding-top:14px;
  border-top:1px solid var(--line-2);font-size:12px;font-weight:700;color:var(--ink-mute);
}
.dl-wpis-foot svg{width:15px;height:15px;flex:none}
.dl-wpis-foot em{
  margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  font-style:normal;font-weight:800;color:var(--brand);transition:gap .25s var(--t);
}
.dl-wpis-foot em svg{width:16px;height:16px}
.dl-wpis:hover .dl-wpis-foot em{gap:10px}
.dl-wpis.ukryty{display:none}

/* --- nagłówek artykułu --------------------------------------------------- */
.dl-art-hero .dl-h1{max-width:20ch}
@media(min-width:900px){.dl-art-hero .dl-h1{max-width:24ch}}
.dl-art-lead{max-width:68ch;margin-top:18px}

.dl-art-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:22px}
.dl-art-kat{
  padding:6px 13px;border-radius:999px;background:rgba(254,157,43,.16);
  border:1px solid rgba(254,157,43,.3);color:var(--brand-3);
  font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
}
.dl-art-data,.dl-art-czas{
  display:inline-flex;align-items:center;gap:7px;
  font-size:12.5px;color:var(--ink-light-mute);
}
.dl-art-czas svg{width:15px;height:15px}

/* --- układ: spis treści obok tekstu -------------------------------------- */
.dl-art-wrap{display:grid;grid-template-columns:1fr;gap:32px;align-items:start}
@media(min-width:1000px){
  .dl-art-wrap{grid-template-columns:250px minmax(0,1fr);gap:56px}
}

.dl-art-spis{
  padding:20px;border-radius:18px;background:#fff;border:1px solid var(--line);
  box-shadow:0 4px 18px rgba(15,23,42,.05);
}
@media(min-width:1000px){.dl-art-spis{position:sticky;top:calc(var(--header-h) + 20px)}}
.dl-art-spis b{
  display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--brand);margin-bottom:14px;
}
.dl-art-spis ol{margin:0;padding:0;list-style:none;counter-reset:spis}
.dl-art-spis li{counter-increment:spis;margin-bottom:11px;line-height:1.45}
.dl-art-spis li:last-child{margin-bottom:0}
.dl-art-spis a{
  display:flex;gap:9px;font-size:13.5px;color:var(--ink-soft);text-decoration:none;transition:color .2s;
}
.dl-art-spis a::before{
  content:counter(spis);flex:none;width:20px;font-weight:800;color:var(--brand-3);
}
.dl-art-spis a:hover{color:var(--brand)}

/* --- kolumna tekstu ------------------------------------------------------ */
.dl-art{max-width:72ch}
.dl-art h2{
  font-size:clamp(21px,2.5vw,27px);font-weight:800;color:var(--ink);
  line-height:1.25;letter-spacing:-.015em;margin:38px 0 16px;scroll-margin-top:calc(var(--header-h) + 20px);
}
.dl-art h2:first-child{margin-top:0}
.dl-art p{margin:0 0 18px;font-size:clamp(15px,1.25vw,16.5px);line-height:1.8;color:var(--ink-soft)}

.dl-art-lista{margin:0 0 22px;padding:0;list-style:none;counter-reset:punkt;display:grid;gap:12px}
.dl-art-lista li{
  counter-increment:punkt;position:relative;padding:18px 18px 16px 54px;border-radius:16px;
  background:var(--bg-light);border:1px solid var(--line);
}
.dl-art-lista li::before{
  content:counter(punkt,decimal-leading-zero);position:absolute;left:18px;top:18px;
  font-size:13px;font-weight:900;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.dl-art-lista b{display:block;font-size:15.5px;font-weight:800;color:var(--ink);line-height:1.35;margin-bottom:6px}
.dl-art-lista span{display:block;font-size:14px;line-height:1.7;color:var(--ink-soft)}

.dl-art .dl-wyroznik{margin-top:34px;max-width:none}

/* ==========================================================================
   24. BEZPŁATNA WYCENA (widżet rozmowy)
   Maskotka w prawym dolnym rogu, panel wysuwany w bok.

   Przyciskiem jest sam dzik. Ikona wiadomości to plakietka doklejona do
   jego rogu, więc w rogu ekranu stoi jeden okrągły element, nie dwa.

   Panel jest JASNY, choć cały serwis jest ciemny. To celowe: okno rozmowy
   ma się odciąć od strony, a nie w nią wtopić. Jasne tło czyta się też
   lepiej przy wpisywaniu danych.
   ========================================================================== */

/* --- róg: dymek i maskotka ----------------------------------------------- */
.dl-wyc-rog{
  position:fixed;right:22px;bottom:22px;z-index:1200;
  display:flex;flex-direction:column;align-items:flex-end;gap:12px;
  transition:opacity .25s,transform .3s var(--t);
}
.dl-wyc-rog.ukryty{opacity:0;pointer-events:none;transform:translateY(16px) scale(.94)}

/* biały dymek z podpowiedzią */
.dl-wyc-zach{
  display:flex;align-items:center;gap:10px;
  width:max-content;max-width:min(292px, calc(100vw - 44px));
  padding:10px 8px 10px 10px;border-radius:16px;background:#fff;
  box-shadow:0 20px 44px -20px rgba(9,10,18,.65), 0 2px 8px rgba(9,10,18,.14);
  animation:dlZachWejscie .38s var(--t) both;
}
@keyframes dlZachWejscie{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.dl-wyc-zach{animation:none}}

.dl-wyc-zach-ic{
  width:34px;height:34px;border-radius:11px;flex:none;
  display:grid;place-items:center;background:var(--brand);color:#fff;
}
.dl-wyc-zach-ic svg{width:18px;height:18px;display:block}

.dl-wyc-zach-txt{
  flex:1;min-width:0;margin:0;padding:0;border:0;background:none;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:600;line-height:1.35;
  color:#12141f;text-align:left;
}
.dl-wyc-zach-txt:hover{color:var(--brand-hover)}

.dl-wyc-zach-x{
  width:24px;height:24px;flex:none;border:0;background:none;cursor:pointer;
  border-radius:7px;display:grid;place-items:center;color:#9aa1b4;
  transition:background-color .2s,color .2s;
}
.dl-wyc-zach-x:hover{background:rgba(9,10,18,.06);color:#12141f}
.dl-wyc-zach-x svg{width:13px;height:13px;display:block}

/* maskotka jako przycisk */
.dl-wyc-tab{
  position:relative;display:block;flex:none;
  width:68px;height:68px;border-radius:50%;
  padding:0;border:0;background:none;cursor:pointer;
  filter:drop-shadow(0 14px 26px rgba(9,10,18,.45));
  transition:transform .25s var(--t);
}
.dl-wyc-tab:hover{transform:translateY(-3px)}
.dl-wyc-tab picture{position:relative;z-index:1;display:block;line-height:0}

.dl-wyc-maskotka{
  width:68px;height:68px;border-radius:50%;display:block;
  background:#fff;border:3px solid #fff;object-fit:cover;
}

/* plakietka wiadomości doklejona do rogu maskotki */
.dl-wyc-znak{
  position:absolute;right:-2px;bottom:-2px;z-index:2;
  width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--brand);color:#fff;
  transition:background-color .2s;
}
.dl-wyc-znak svg{width:16px;height:16px;display:block}
.dl-wyc-tab:hover .dl-wyc-znak{background:var(--brand-hover)}

/* poświata: niewidoczna w spoczynku, pulsuje tylko przy zaczepce */
.dl-wyc-halo{
  position:absolute;inset:-8px;z-index:0;border-radius:50%;pointer-events:none;
  background:rgba(254,157,43,.45);opacity:0;
}
.dl-wyc-tab.zaczepka .dl-wyc-halo{animation:dlWycPuls 2.2s var(--t) infinite}
@keyframes dlWycPuls{
  0%{transform:scale(.9);opacity:.5}
  70%{transform:scale(1.32);opacity:0}
  100%{transform:scale(1.32);opacity:0}
}
@media(prefers-reduced-motion:reduce){.dl-wyc-tab.zaczepka .dl-wyc-halo{animation:none}}

/* na telefonie to samo, tylko ciaśniej */
@media(max-width:700px){
  .dl-wyc-rog{right:14px;bottom:14px;gap:10px}
  .dl-wyc-tab,.dl-wyc-maskotka{width:62px;height:62px}
  .dl-wyc-znak{width:27px;height:27px}
  .dl-wyc-znak svg{width:15px;height:15px}
  .dl-wyc-zach{max-width:calc(100vw - 28px);padding:9px 7px 9px 9px}
  .dl-wyc-zach-txt{font-size:13px}
  .dl-wyc-tab:hover{transform:none}
}

/* --- panel wysuwany ------------------------------------------------------ */
.dl-wyc{
  position:fixed;right:20px;bottom:20px;z-index:1201;
  transform:translateX(calc(100% + 24px));
  width:min(392px, calc(100vw - 40px));max-height:min(640px, calc(100vh - 40px));
  display:flex;flex-direction:column;overflow:hidden;
  border-radius:22px;background:#fff;
  border:1px solid rgba(15,23,42,.1);
  box-shadow:0 34px 80px -22px rgba(15,23,42,.55), 0 0 0 4px rgba(254,157,43,.14);
  transition:transform .36s var(--t);
  will-change:transform;
}
.dl-wyc.open{transform:translateX(0)}

@media(max-width:700px){
  .dl-wyc{
    right:0;bottom:0;left:0;width:100%;height:100dvh;max-height:none;
    border-radius:0;border:0;box-shadow:none;transform:translateY(100%);
  }
  .dl-wyc.open{transform:translateY(0)}
}

/* --- nagłówek ------------------------------------------------------------ */
.dl-wyc-top{
  display:flex;align-items:center;gap:12px;padding:16px;flex:none;
  background:var(--grad);color:#fff;
}
.dl-wyc-avatar{position:relative;width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.24)}
.dl-wyc-avatar img{width:29px;height:29px;object-fit:contain;display:block}
.dl-wyc-avatar i{
  position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;
  background:var(--ok);border:2px solid #fff;
}
.dl-wyc-kto{flex:1;min-width:0}
.dl-wyc-kto b{display:block;font-size:15.5px;font-weight:800;color:#fff;line-height:1.25}
.dl-wyc-kto small{display:block;font-size:11.5px;color:rgba(255,255,255,.85);margin-top:3px;line-height:1.35}
.dl-wyc-x{
  width:34px;height:34px;flex:none;border:0;border-radius:11px;cursor:pointer;
  display:grid;place-items:center;background:rgba(255,255,255,.2);color:#fff;
  transition:background .2s;
}
.dl-wyc-x:hover{background:rgba(255,255,255,.34)}
.dl-wyc-x svg{width:17px;height:17px}

.dl-wyc-postep{height:3px;flex:none;background:var(--line)}
.dl-wyc-postep i{display:block;height:100%;width:0;background:var(--grad);transition:width .45s var(--t)}

/* --- rozmowa ------------------------------------------------------------- */
.dl-wyc-okno{
  flex:1;min-height:230px;overflow-y:auto;padding:18px 16px;
  display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth;
  background:var(--bg-light);
}
@media(max-width:700px){.dl-wyc-okno{min-height:0}}

.dl-wyc-wiad{max-width:86%;display:flex}
.dl-wyc-wiad .dl-wyc-tresc{padding:11px 14px;border-radius:16px;font-size:14px;line-height:1.55}
.dl-wyc-wiad.dzik{align-self:flex-start}
.dl-wyc-wiad.dzik .dl-wyc-tresc{
  background:#fff;border:1px solid var(--line);color:var(--ink);
  border-bottom-left-radius:6px;box-shadow:0 2px 8px rgba(15,23,42,.05);
}
.dl-wyc-wiad.ja{align-self:flex-end}
.dl-wyc-wiad.ja .dl-wyc-tresc{
  background:var(--grad);color:#fff;font-weight:600;border-bottom-right-radius:6px;
  box-shadow:0 4px 12px -4px rgba(254,157,43,.6);
}
.dl-wyc-wiad.pisze .dl-wyc-tresc{display:none}
.dl-wyc-wiad:not(.pisze) .dl-wyc-kropki{display:none}

.dl-wyc-kropki{
  display:inline-flex;gap:4px;padding:14px;border-radius:16px;border-bottom-left-radius:6px;
  background:#fff;border:1px solid var(--line);box-shadow:0 2px 8px rgba(15,23,42,.05);
}
.dl-wyc-kropki i{width:6px;height:6px;border-radius:50%;background:var(--ink-mute);animation:dlWycKropka 1.2s infinite}
.dl-wyc-kropki i:nth-child(2){animation-delay:.18s}
.dl-wyc-kropki i:nth-child(3){animation-delay:.36s}
@keyframes dlWycKropka{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.dl-wyc-kropki i{animation:none;opacity:.6}}

.dl-wyc-ok{
  align-self:center;margin-top:6px;display:inline-flex;align-items:center;gap:8px;
  padding:9px 16px;border-radius:999px;
  background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.32);color:var(--ok-deep);
  font-size:12.5px;font-weight:800;
}
.dl-wyc-ok svg{width:15px;height:15px}

/* --- dolny pasek --------------------------------------------------------- */
.dl-wyc-dol{flex:none;padding:12px 16px 14px;border-top:1px solid var(--line);background:#fff}

.dl-wyc-szybkie{display:flex;flex-wrap:wrap;gap:7px}
.dl-wyc-szybkie:not(:empty){margin-bottom:11px}
.dl-wyc-chip{
  padding:9px 15px;border-radius:999px;cursor:pointer;font-family:inherit;
  background:var(--brand-soft);border:1.5px solid rgba(254,157,43,.35);color:var(--brand);
  font-size:12.5px;font-weight:800;transition:background .2s,transform .2s var(--t),border-color .2s;
}
.dl-wyc-chip:hover{background:var(--brand);border-color:var(--brand);color:#fff;transform:translateY(-1px)}

.dl-wyc-form{display:flex;gap:9px;align-items:flex-end}
.dl-wyc-form.schowany{display:none}
.dl-wyc-pole{flex:1;min-width:0}
.dl-wyc-etykieta{
  display:block;font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-mute);margin-bottom:6px;
}
.dl-wyc-form input{
  width:100%;padding:12px 14px;border-radius:13px;font-family:inherit;font-size:16px;
  background:var(--bg-light);border:1.5px solid var(--line);color:var(--ink);
  transition:border-color .2s,background .2s;
}
.dl-wyc-form input::placeholder{color:var(--ink-mute)}
.dl-wyc-form input:focus{outline:none;border-color:var(--brand);background:#fff}
.dl-wyc-wyslij{
  width:46px;height:46px;flex:none;border:0;border-radius:13px;cursor:pointer;
  display:grid;place-items:center;background:var(--brand);color:#fff;transition:transform .2s var(--t);
}
.dl-wyc-wyslij:hover{background:var(--brand-hover)}
.dl-wyc-wyslij svg{width:19px;height:19px}

.dl-wyc-stopka{margin:11px 0 0;font-size:10.5px;line-height:1.5;color:var(--ink-mute)}
.dl-wyc-stopka a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}

/* Powiadomienie o zgłoszeniach nie może zderzać się z widżetem. */
@media(min-width:701px){.dl-toast{bottom:96px}}
@media(max-width:700px){.dl-toast{bottom:82px}}

/* --- blok danych kontaktowych wypełniany jednym razem --------------------- */
.dl-wyc-karta{
  align-self:stretch;margin-top:4px;padding:16px;border-radius:18px;
  background:#fff;border:1px solid var(--line);box-shadow:0 6px 20px rgba(15,23,42,.07);
}
.dl-wyc-karta.zamkniete{opacity:.6;pointer-events:none}

.dl-wyc-karta-pola{display:grid;grid-template-columns:1fr;gap:13px}
@media(min-width:420px){
  /* Imię i telefon mieszczą się obok siebie, e-mail i region potrzebują
     pełnej szerokości, bo bywają długie i ucinałyby się w połowie. */
  .dl-wyc-karta-pola{grid-template-columns:1fr 1fr}
  .dl-wyc-kp[data-klucz="email"],
  .dl-wyc-kp[data-klucz="region"]{grid-column:1/-1}
}

.dl-wyc-kp{display:block;min-width:0}
.dl-wyc-kp-lab{
  display:block;font-size:12px;font-weight:800;color:var(--ink);margin-bottom:6px;
}
.dl-wyc-kp-lab i{font-style:normal;color:var(--brand)}
.dl-wyc-kp-lab em{font-style:normal;font-weight:600;color:var(--ink-mute);font-size:11px}
.dl-wyc-kp input{
  width:100%;padding:12px 13px;border-radius:12px;font-family:inherit;font-size:16px;
  background:var(--bg-light);border:1.5px solid var(--line);color:var(--ink);
  transition:border-color .2s,background .2s;
}
.dl-wyc-kp input::placeholder{color:var(--ink-mute)}
.dl-wyc-kp input:focus{outline:none;border-color:var(--brand);background:#fff}
.dl-wyc-kp.zle input{border-color:var(--bad);background:rgba(239,68,68,.05)}
.dl-wyc-kp-blad{display:block;font-size:11.5px;font-weight:700;color:var(--bad);margin-top:5px;min-height:0}
.dl-wyc-kp.zle .dl-wyc-kp-blad{min-height:16px}

.dl-wyc-karta-ok{
  width:100%;margin-top:15px;padding:14px 18px;border:0;border-radius:13px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  background:var(--grad);color:#fff;font-family:inherit;font-size:15px;font-weight:800;
  box-shadow:0 10px 24px -10px rgba(254,157,43,.95);transition:transform .2s var(--t);
}
.dl-wyc-karta-ok:hover{background:var(--brand-hover)}
.dl-wyc-karta-ok svg{width:17px;height:17px}

.dl-wyc-karta-zgoda{
  display:flex;align-items:flex-start;gap:9px;margin-top:12px;
  font-size:11.5px;line-height:1.5;color:var(--ink-soft);cursor:pointer;
}
.dl-wyc-karta-zgoda input{
  flex:none;width:18px;height:18px;margin-top:1px;accent-color:var(--brand);cursor:pointer;
}
.dl-wyc-karta-zgoda a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}
.dl-wyc-karta-zgoda.zle{color:var(--bad)}
.dl-wyc-karta-zgoda.zle input{outline:2px solid var(--bad);outline-offset:2px;border-radius:4px}

/* ==========================================================================
   25. TŁO HERO ZE ZDJĘCIEM
   Zamiast dwóch rozmytych pomarańczowych kół, które czytały się jak
   abstrakcyjna grafika z generatora, hero ma warstwę na prawdziwe zdjęcie
   instalacji. Zdjęcie od razu mówi, w jakiej branży działa firma.

   Warstwa jest odporna na brak pliku: dwa gradienty są malowane niezależnie
   od obrazu, więc dopóki nie wgrasz /assets/img/hero.jpg, hero po prostu
   pozostaje ciemne i czyste, bez pustej dziury.

   Zdjęcie prześwituje przez kilka procent i działa jak faktura, a nie jak
   ilustracja. Ma dawać wrażenie, że tło ma głębię, bez odciągania uwagi
   od nagłówka i bez ryzyka, że tekst zrobi się nieczytelny.
   ========================================================================== */
.dl-hero-foto{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(100deg, rgba(14,15,26,.935) 0%, rgba(14,15,26,.915) 45%, rgba(14,15,26,.89) 100%),
    url('/assets/img/hero.jpg');
  background-size:auto, auto, cover;
  background-position:center, center, center right;
  background-repeat:no-repeat;
}
@media(max-width:999px){
  /* Na telefonie kolumna z treścią zajmuje całą szerokość, więc zdjęcie
     musi być przyciemnione równomiernie, a nie tylko po lewej stronie. */
  .dl-hero-foto{
    background-image:
      linear-gradient(180deg, rgba(14,15,26,.92) 0%, rgba(14,15,26,.905) 50%, rgba(14,15,26,.93) 100%),
      url('/assets/img/hero.jpg');
    background-size:auto, cover;
    background-position:center, center;
  }
}

/* ==========================================================================
   26. KARTA OFERTY W HERO
   Cena, dwa przyciski, kontakt do właściciela i odnośnik do realizacji.
   Jasna karta na ciemnym tle: ma być pierwszą rzeczą, na którą pada wzrok
   po nagłówku, i ma dawać trzy różne sposoby kontaktu, bo różni ludzie
   wolą różne. Jeden zadzwoni, drugi napisze, trzeci najpierw poczyta.
   ========================================================================== */
.dl-oferta{
  padding:20px;border-radius:22px;background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 34px 80px -26px rgba(0,0,0,.6);
}

/* --- cena --------------------------------------------------------------- */
.dl-oferta-cena{
  padding:18px 20px;border-radius:16px;margin-bottom:14px;
  background:var(--bg-light);border:1px solid var(--line);
}
.dl-oferta-cena b{
  display:block;font-size:clamp(30px,3.4vw,38px);font-weight:900;color:var(--ink);
  line-height:1;letter-spacing:-.03em;
}
.dl-oferta-cena b em{font-style:normal;font-size:19px;font-weight:800;margin-left:3px;color:var(--ink-soft)}
.dl-oferta-cena span{display:block;font-size:13px;color:var(--ink-soft);margin-top:8px;line-height:1.45}

/* --- przyciski ---------------------------------------------------------- */
.dl-oferta-cta{margin-bottom:9px}
.dl-oferta-drugi{
  display:flex;align-items:center;justify-content:center;
  padding:14px 20px;border-radius:14px;text-decoration:none;
  background:var(--ink);color:#fff;font-size:15px;font-weight:800;
  transition:background .2s,transform .2s var(--t);
}
.dl-oferta-drugi:hover{background:#1e293b}

/* --- osoba do kontaktu -------------------------------------------------- */
.dl-oferta-osoba{
  display:grid;grid-template-columns:auto 1fr;gap:12px 13px;align-items:center;
  margin-top:16px;padding:15px;border-radius:16px;
  background:#fff;border:1px solid var(--line);
  border-top:3px solid transparent;
  background-image:linear-gradient(#fff,#fff),var(--grad);
  background-origin:border-box;background-clip:padding-box,border-box;
}
.dl-oferta-awatar{
  position:relative;width:48px;height:48px;border-radius:50%;flex:none;
  display:grid;place-items:center;background:var(--brand-soft);
}
.dl-oferta-awatar img{width:36px;height:36px;object-fit:contain;display:block}
.dl-oferta-awatar i{
  position:absolute;right:0;top:1px;width:11px;height:11px;border-radius:50%;
  background:var(--ok);border:2px solid #fff;
}
.dl-oferta-kto b{display:block;font-size:15.5px;font-weight:800;color:var(--ink);line-height:1.25}
.dl-oferta-kto small{
  display:block;font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-mute);margin-top:4px;
}
.dl-oferta-akcje{grid-column:1/-1;display:flex;gap:8px}

.dl-oferta-tel,.dl-oferta-napisz{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 14px;border-radius:12px;text-decoration:none;
  font-size:14px;font-weight:800;transition:transform .2s var(--t),background .2s;
}
.dl-oferta-tel svg,.dl-oferta-napisz svg{width:16px;height:16px;flex:none}
.dl-oferta-tel{flex:1;background:var(--brand);color:#fff}
.dl-oferta-tel:hover{background:var(--brand-hover)}
.dl-oferta-napisz{flex:none;background:var(--bg-light);border:1px solid var(--line);color:var(--ink)}
.dl-oferta-napisz:hover{background:#fff;border-color:var(--brand);color:var(--brand)}

/* --- realizacja --------------------------------------------------------- */
.dl-oferta-case{
  display:flex;align-items:center;gap:13px;
  margin-top:16px;padding-top:16px;border-top:1px solid var(--line-2);
  text-decoration:none;
}
.dl-oferta-case-ic{
  width:38px;height:38px;border-radius:50%;flex:none;
  display:grid;place-items:center;background:var(--grad);color:#fff;
  transition:transform .25s var(--t);
}
.dl-oferta-case-ic svg{width:17px;height:17px}
.dl-oferta-case:hover .dl-oferta-case-ic{transform:translateX(3px)}
.dl-oferta-case b{display:block;font-size:14px;font-weight:800;color:var(--ink);line-height:1.3}
.dl-oferta-case small{display:block;font-size:12.5px;color:var(--ink-soft);margin-top:3px}

@media(max-width:400px){
  .dl-oferta{padding:16px}
  .dl-oferta-akcje{flex-direction:column}
  .dl-oferta-napisz{flex:1}
}

/* ==========================================================================
   27. KARTY FAKTÓW W HERO
   Trzy jasne karty jedna pod drugą: etykieta, duża liczba, jedno zdanie.
   Zastąpiły kartę z ceną i kontaktem, która przeniosła się na podstrony
   produktowe, oraz okrągłą plakietkę z rabatem, która robiła zamęt
   w prawym górnym rogu.
   ========================================================================== */
.dl-fakt{
  padding:22px 24px;border-radius:20px;background:#fff;
  border:1px solid rgba(15,23,42,.07);
  box-shadow:0 20px 50px -26px rgba(0,0,0,.6);
}
.dl-fakt + .dl-fakt{margin-top:12px}

/* Lekkie przesunięcie kart względem siebie daje wrażenie ułożonego stosu
   zamiast trzech identycznych prostokątów w linii. */
@media(min-width:1000px){
  .dl-fakt:nth-child(2){margin-left:18px}
  .dl-fakt:nth-child(3){margin-left:36px}
  .dl-fakt:nth-child(4){margin-left:54px}
}

.dl-fakt-lab{
  display:block;font-size:10.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-mute);margin-bottom:10px;
}
.dl-fakt-licz{
  display:block;font-size:clamp(30px,3.6vw,40px);font-weight:900;color:var(--ink);
  line-height:1;letter-spacing:-.035em;
}
.dl-fakt-licz em{font-style:normal;color:var(--brand)}
.dl-fakt p{
  margin:12px 0 0;font-size:13.5px;line-height:1.6;color:var(--ink-soft);
}

@media(max-width:420px){
  .dl-fakt{padding:18px 20px}
  .dl-fakt p{font-size:13px}
}

/* Karta oferty i karta standardu stoją teraz jedna nad drugą w kolumnie
   podstrony produktowej, więc potrzebują odstępu. */
/* Karta oferty i karta standardu stoją w jednej kolumnie siatki.
   Bez tego opakowania druga z nich spadała do nowego wiersza i lądowała
   pod kolumną z tekstem, po lewej stronie. */
.dl-sub-hero-kol{display:flex;flex-direction:column;gap:14px;min-width:0}
@media(min-width:1000px){
  .dl-sub-hero-kol{position:sticky;top:calc(var(--header-h) + 18px)}
}


/* ==========================================================================
   26. PASEK ZGÓD (Google Consent Mode)

   Karta w lewym dolnym rogu, bo prawy zajmuje widżet wyceny. Na telefonie
   oba by na siebie zachodziły, więc dopóki pasek stoi, dzik znika.

   Oba przyciski wyglądają na równorzędne. „Odmawiam” musi być tak samo
   łatwe jak „akceptuję”, inaczej zgoda nie jest dobrowolna w rozumieniu
   RODO. Ukrywanie odmowy pod szarym linkiem to nie spryt, tylko ryzyko.
   ========================================================================== */
.dl-zgody{
  position:fixed;left:22px;bottom:22px;z-index:1300;
  width:min(400px, calc(100vw - 44px));
  padding:20px;border-radius:18px;
  background:#14161f;color:#e9ecf5;
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 30px 70px -24px rgba(0,0,0,.85), 0 2px 10px rgba(0,0,0,.4);
  opacity:0;transform:translateY(14px);
  transition:opacity .3s var(--t),transform .3s var(--t);
}
.dl-zgody.pokaz{opacity:1;transform:none}

.dl-zgody-tyt{
  display:flex;align-items:center;gap:9px;
  font-size:15px;font-weight:800;letter-spacing:-.01em;margin-bottom:9px;
}
.dl-zgody-tyt svg{width:20px;height:20px;flex:none;color:var(--brand)}

.dl-zgody p{
  margin:0 0 15px;font-size:13.5px;line-height:1.62;color:#a9b0c4;
}
.dl-zgody p a{color:#e9ecf5;text-decoration:underline;text-underline-offset:3px}
.dl-zgody p a:hover{color:var(--brand-3)}

.dl-zgody-akcje{display:flex;gap:8px;flex-wrap:wrap}
.dl-zgody-akcje button{
  flex:1 1 140px;
  padding:12px 18px;border-radius:11px;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:800;line-height:1;
  transition:background-color .2s,border-color .2s,color .2s;
}
.dl-zgody-tak{background:var(--brand);color:#fff;border:2px solid var(--brand)}
.dl-zgody-tak:hover{background:var(--brand-hover);border-color:var(--brand-hover)}
.dl-zgody-nie{background:transparent;color:#e9ecf5;border:2px solid rgba(255,255,255,.18)}
.dl-zgody-nie:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.05)}

@media(max-width:700px){
  .dl-zgody{left:14px;right:14px;bottom:14px;width:auto;padding:17px;border-radius:16px}
  .dl-zgody-akcje button{flex:1 1 100%}
  /* Dzik ustępuje miejsca, dopóki człowiek nie zdecyduje. */
  html.dl-zgody-widoczne .dl-wyc-rog{opacity:0;pointer-events:none}
}
@media(prefers-reduced-motion:reduce){
  .dl-zgody{transition:none}
}
