/* =========================================================
   AXELNET – UI STYLES (TT5 + Elementor)
   - modularnie, bez dublowania
   - zachowuje zachowanie "starej wersji"
   ========================================================= */

/* =========================
   TOKENS
========================= */
:root{
  --ax-bg: #FFFFFF;
  --ax-text: #0B1220;
  --ax-muted: #5B6475;
  --ax-border: rgba(230,232,238,.92);

  --ax-blue: rgba(37,99,235,1);
  --ax-cyan: rgba(34,211,238,1);

  --ax-card-radius: 22px;
  --ax-pill-radius: 999px;

  --ax-shadow-sm: 0 10px 22px rgba(11,18,32,.04);
  --ax-shadow-md: 0 14px 34px rgba(11,18,32,.06);
  --ax-shadow-lg: 0 20px 54px rgba(11,18,32,.085);

  /* glow inset: desktop “rozlany”, mobile dociągnięty do rogów */
  --ax-glow-inset: -120px;
  --ax-glow-blur: 16px;

  /* ABOUT MEDIA – pozycja gradientu + maska siatki (DESKTOP) */
  --ax-about-g1-pos: 86% 18%;   /* cyan – górny prawy */
  --ax-about-g2-pos: 16% 88%;   /* blue – dolny lewy */
  --ax-about-grid-mask: 54% 42%;/* gdzie “siedzi” siatka optycznie */
}

/* =========================
   GLOBAL
========================= */
.wp-block-post-title{ display:none; }

/* =========================
   HEADER (TT5)
========================= */
:is(.wp-site-blocks > header, header.wp-block-template-part){
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;

  background: rgba(255,255,255,.78) !important;
  backdrop-filter: saturate(140%) blur(14px) !important;
  -webkit-backdrop-filter: saturate(140%) blur(14px) !important;

  border-bottom: 1px solid rgba(230,232,238,.85) !important;
}

/* menu links */
:is(.wp-site-blocks > header, header.wp-block-template-part) .wp-block-navigation-item__content{
  color: var(--ax-muted) !important;
  font-weight: 500 !important;
  font-size: 15px !important;

  padding: 10px 10px !important;
  border-radius: 12px !important;

  text-decoration: none !important;
  transition: background .2s ease, color .2s ease !important;
}

:is(.wp-site-blocks > header, header.wp-block-template-part) .wp-block-navigation-item__content:hover{
  background: rgba(37,99,235,.08) !important;
  color: var(--ax-text) !important;
}

/* active */
:is(.wp-site-blocks > header, header.wp-block-template-part) :is(.current-menu-item > a, .current_page_item > a){
  background: rgba(37,99,235,.10) !important;
  color: var(--ax-text) !important;
  text-decoration: none !important;
}

/* header button (base CTA) */
:is(.wp-site-blocks > header, header.wp-block-template-part) .wp-block-button__link{
  border-radius: var(--ax-pill-radius) !important;
  padding: 12px 18px !important;

  background: var(--ax-text) !important;
  color: #fff !important;

  font-weight: 600 !important;
  font-size: 15px !important;

  box-shadow: 0 14px 30px rgba(11,18,32,.12) !important;
  transition: transform .15s ease, background .2s ease !important;
}

:is(.wp-site-blocks > header, header.wp-block-template-part) .wp-block-button__link:hover{
  transform: translateY(-1px) !important;
  background: #111a2a !important;
}

/* thin “fiber” line under header */
:is(.wp-site-blocks > header, header.wp-block-template-part)::after{
  content:"";
  display:block;
  height: 2px;
  background: linear-gradient(90deg,
    rgba(37,99,235,0),
    rgba(37,99,235,.35),
    rgba(34,211,238,.35),
    rgba(37,99,235,.35),
    rgba(37,99,235,0)
  );
  opacity: .7;
}

/* header CTA (cta-menu) – premium minimalist override */
header.wp-block-template-part .cta-menu .wp-block-button__link{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 10px 14px !important;
  border-radius: var(--ax-pill-radius) !important;

  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: -0.01em !important;

  color: var(--ax-text) !important;
  text-decoration: none !important;

  background: rgba(255,255,255,.62) !important;
  border: 1px solid rgba(230,232,238,.95) !important;

  box-shadow:
    0 10px 26px rgba(11,18,32,.06),
    inset 0 1px 0 rgba(255,255,255,.85) !important;

  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}

header.wp-block-template-part .cta-menu .wp-block-button__link:hover{
  background: rgba(255,255,255,.80) !important;
  border-color: rgba(37,99,235,.18) !important;

  box-shadow:
    0 14px 38px rgba(11,18,32,.08),
    0 0 0 4px rgba(37,99,235,.08),
    inset 0 1px 0 rgba(255,255,255,.90) !important;
}

header.wp-block-template-part .cta-menu .wp-block-button__link:focus-visible{
  outline: none !important;
  box-shadow:
    0 0 0 4px rgba(37,99,235,.14),
    0 14px 38px rgba(11,18,32,.08),
    inset 0 1px 0 rgba(255,255,255,.90) !important;
}

/* =========================
   HERO (Elementor) – glow + światłowody + hero-box
========================= */
.ax-hero{
  position: relative !important;
  overflow: hidden !important;
  background-color: var(--ax-bg) !important;

  background-image:
    linear-gradient(to bottom, rgba(247,248,250,0) 68%, var(--ax-bg) 100%),
    radial-gradient(720px 420px at 18% 22%, rgba(37,99,235,.10), transparent 62%),
    radial-gradient(680px 380px at 82% 30%, rgba(34,211,238,.08), transparent 65%),
    radial-gradient(820px 460px at 50% 92%, rgba(37,99,235,.06), transparent 70%) !important;

  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-position: center !important;
}

.ax-hero::after{ content: none !important; }

.ax-hero > .elementor-background-overlay{
  background: transparent !important;
  opacity: 0 !important;
}

/* krytyczne dla “fiber” w HTML widget */
.ax-hero .elementor-widget-html,
.ax-hero .elementor-widget-html .elementor-widget-container{
  position: static !important;
}

.ax-hero .elementor-container,
.ax-hero .elementor-column,
.ax-hero .elementor-widget-wrap{
  overflow: visible !important;
}

/* fiber layer */
.ax-hero .ax-fiber-wrap{
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;

  -webkit-mask-image:
    radial-gradient(circle at 50% 42%, transparent 0 40%, black 64%),
    linear-gradient(to bottom, black 0 82%, transparent 100%) !important;
  mask-image:
    radial-gradient(circle at 50% 42%, transparent 0 40%, black 64%),
    linear-gradient(to bottom, black 0 82%, transparent 100%) !important;
}

.ax-hero .ax-fiber{
  width: 100% !important;
  height: 100% !important;
  display: block !important;

  opacity: .74 !important;
  filter: blur(.35px) saturate(1.02);
}

/* content above fibers */
.ax-hero > .elementor-container{
  position: relative !important;
  z-index: 3 !important;
}

.ax-hero .hero-box{
  position: relative !important;
  z-index: 4 !important;

  background: rgba(255,255,255,.82) !important;
  backdrop-filter: saturate(140%) blur(14px) !important;
  -webkit-backdrop-filter: saturate(140%) blur(14px) !important;

  border: 1px solid rgba(230,232,238,.9) !important;
  border-radius: var(--ax-card-radius) !important;
  box-shadow: 0 16px 40px rgba(11,18,32,.06) !important;

  padding: clamp(18px, 2.6vw, 28px) !important;
}

.ax-hero .hero-box .elementor-widget-wrap{
  position: relative !important;
  z-index: 4 !important;
}

/* =========================
   TYPEWRITER
========================= */
.ax-typewrap{
  position: relative !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;

  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(230,232,238,.9) !important;
  box-shadow: 0 12px 28px rgba(11,18,32,.06) !important;

  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size: 20px !important;
  line-height: 1.5 !important;
  color: var(--ax-muted) !important;

  max-width: 62ch !important;
  min-height: calc(1.5em * 3) !important;
  overflow: hidden !important;
}

.ax-typewrap::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  pointer-events:none;

  background:
    radial-gradient(520px 140px at 18% 0%, rgba(37,99,235,.12), transparent 58%),
    radial-gradient(420px 120px at 88% 40%, rgba(34,211,238,.10), transparent 60%);
}

.ax-cursor{ display:none !important; }

.ax-typed{
  display: inline !important;
  position: relative !important;
}

.ax-typed::after{
  content:"|" !important;
  display:inline-block !important;
  margin-left: 2px !important;
  color: #2563EB !important;
  font-weight: 700 !important;
  animation: axBlink 1s steps(1) infinite !important;
}

@keyframes axBlink{ 50%{ opacity:0 } }

@keyframes axIn{
  from{ opacity:0; transform: translateY(6px); }
  to{ opacity:1; transform: translateY(0); }
}
.ax-typewrap{ animation: axIn .35s ease-out both !important; }

/* =========================
   OFFERS – equal height + card
   Wymaga klasy: ax-offers-row na wrapperze 3 kolumn
========================= */
.ax-offers-row{ align-items: stretch !important; }

.ax-offers-row :is(.elementor-container, .e-con-inner){ align-items: stretch !important; }
.ax-offers-row :is(.elementor-column, .e-con){ display: flex !important; }

.ax-offers-row :is(.elementor-widget-wrap, .e-con-inner){
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
}

.ax-offers-row .elementor-widget-html,
.ax-offers-row .elementor-widget-html .elementor-widget-container{
  flex: 1 !important;
  display: flex !important;
}

.ax-offer-card{
  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--ax-card-radius) !important;

  padding: 22px !important;
  background: #fff !important;
  border: 1px solid var(--ax-border) !important;

  box-shadow: var(--ax-shadow-md) !important;
  transition: box-shadow .22s ease, border-color .22s ease !important;

  height: 100% !important;
  flex: 1 !important;

  display: flex !important;
  flex-direction: column !important;
}

.ax-offer-card::before{
  content:"";
  position:absolute;
  inset: var(--ax-glow-inset);
  pointer-events:none;

  background:
    radial-gradient(520px 320px at 85% 35%, rgba(37,99,235,.12), transparent 64%),
    radial-gradient(520px 320px at 15% 10%, rgba(34,211,238,.09), transparent 66%);

  filter: blur(var(--ax-glow-blur));
  opacity: .75;
}

.ax-offer-card > *{ position: relative !important; z-index: 1 !important; }

.ax-offer-card:hover{
  box-shadow: var(--ax-shadow-lg) !important;
  border-color: rgba(37,99,235,.22) !important;
}

/* typography */
.ax-offer-title{
  margin: 0 0 10px !important;
  color: var(--ax-text) !important;
  font-weight: 750 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  font-size: 21px !important;
}

.ax-offer-title .ax-caps{
  display:inline-block !important;
  margin-bottom: 6px !important;
  font-size: 12px !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
  color: rgba(91,100,117,.85) !important;
}

.ax-offer-lead{
  margin: 0 0 12px !important;
  color: var(--ax-muted) !important;
  font-size: 15.5px !important;
  line-height: 1.6 !important;
}

.ax-offer-divider{
  height: 1px !important;
  background: rgba(230,232,238,.92) !important;
  margin: 12px 0 !important;
}

.ax-offer-label{
  margin: 0 0 8px !important;
  font-size: 12px !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
  color: rgba(91,100,117,.85) !important;
}

.ax-offer-item{
  margin: 0 !important;
  color: var(--ax-muted) !important;
  font-size: 15.5px !important;
  line-height: 1.6 !important;
}
.ax-offer-item + .ax-offer-item{ margin-top: 7px !important; }

/* CTA row */
.ax-offer-ctaRow{
  margin-top: auto !important;
  padding-top: 18px !important;
}

.ax-offer-cta{
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;

  padding: 10px 14px !important;
  border-radius: var(--ax-pill-radius) !important;

  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: -0.01em !important;

  color: var(--ax-text) !important;
  text-decoration: none !important;

  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(230,232,238,.95) !important;

  box-shadow:
    0 10px 26px rgba(11,18,32,.06),
    inset 0 1px 0 rgba(255,255,255,.80) !important;

  transition: box-shadow .2s ease, border-color .2s ease, background .2s ease !important;
}

.ax-offer-cta:hover{
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(37,99,235,.18) !important;

  box-shadow:
    0 14px 38px rgba(11,18,32,.08),
    inset 0 1px 0 rgba(255,255,255,.86) !important;
}

.ax-offer-cta span{
  font-weight: 800 !important;
  opacity: .9 !important;
  transition: transform .15s ease, opacity .2s ease !important;
}
.ax-offer-cta:hover span{ transform: translateX(2px) !important; opacity: 1 !important; }

/* =========================
   ABOUT – text card
   Klasa: ax-about-card
========================= */
:is(.ax-about-card, .elementor-widget.ax-about-card > .elementor-widget-container){
  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--ax-card-radius) !important;

  padding: 22px !important;
  background: #fff !important;
  border: 1px solid var(--ax-border) !important;

  box-shadow: var(--ax-shadow-md) !important;
  transition: box-shadow .22s ease, border-color .22s ease !important;
}

:is(.ax-about-card, .elementor-widget.ax-about-card > .elementor-widget-container)::before{
  content:"";
  position:absolute;
  inset: var(--ax-glow-inset);
  pointer-events:none;

  background:
    radial-gradient(560px 340px at 78% 22%, rgba(34,211,238,.10), transparent 64%),
    radial-gradient(520px 320px at 22% 78%, rgba(37,99,235,.11), transparent 66%),
    radial-gradient(420px 260px at 50% 8%, rgba(37,99,235,.06), transparent 62%);

  filter: blur(var(--ax-glow-blur));
  opacity: .75;
}

:is(.ax-about-card, .elementor-widget.ax-about-card > .elementor-widget-container) > *{
  position: relative !important;
  z-index: 1 !important;
}

:is(.ax-about-card, .elementor-widget.ax-about-card > .elementor-widget-container):hover{
  box-shadow: var(--ax-shadow-lg) !important;
  border-color: rgba(37,99,235,.22) !important;
}

/* =========================
   CONTACT – bottom gradient only
   Klasa: ax-contact
========================= */
.ax-contact{
  position: relative !important;
  overflow: hidden !important;
  background: transparent !important;
  isolation: isolate !important;
}

.ax-contact > .elementor-background-overlay{
  background: transparent !important;
  opacity: 0 !important;
}

.ax-contact::before{
  content:"" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;

  background-image:
    radial-gradient(900px 520px at 22% 115%, rgba(34,211,238,.14), transparent 64%),
    radial-gradient(980px 560px at 86% 112%, rgba(37,99,235,.14), transparent 66%),
    linear-gradient(to bottom,
      rgba(247,248,250,0) 0%,
      rgba(247,248,250,0) 58%,
      rgba(247,248,250,.55) 78%,
      rgba(247,248,250,.92) 100%
    ) !important;

  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-position: center !important;
}

.ax-contact > *{ position: relative !important; z-index: 1 !important; }

/* contact left */
.ax-contact-left{ position: relative; max-width: 560px; }

.ax-contact-title{
  margin: 0 0 10px;
  color: var(--ax-text);
  font-weight: 780;
  letter-spacing: -0.02em;
  line-height: 1.1;
  font-size: 34px;
}

.ax-contact-sub{
  margin: 0 0 18px;
  color: var(--ax-muted);
  font-size: 15.5px;
  line-height: 1.65;
}

.ax-contact-items{ display: grid; gap: 14px; }

.ax-contact-item{
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 10px 0;
}

.ax-contact-ico{
  width: 54px;
  height: 54px;
  flex: 0 0 54px;

  display: grid;
  place-items: center;

  border-radius: 16px;
  border: 1px solid var(--ax-border);
  background: rgba(255,255,255,.58);

  box-shadow:
    0 12px 26px rgba(11,18,32,.06),
    inset 0 1px 0 rgba(255,255,255,.85);
}

.ax-contact-ico svg{
  width: 26px;
  height: 26px;
  color: rgba(11,18,32,.70);
  transform: translateY(1px);
}

.ax-contact-meta{ display: grid; gap: 3px; }

.ax-contact-label{
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  font-weight: 800;
  color: rgba(91,100,117,.85);
}

.ax-contact-value{
  color: var(--ax-muted);
  font-size: 15.5px;
  line-height: 1.55;
  text-decoration: none;
}
.ax-contact-value:hover{ color: var(--ax-text); }

.ax-contact-divider{
  height: 1px;
  margin: 18px 0 16px;
  background: linear-gradient(90deg,
    rgba(230,232,238,0),
    rgba(230,232,238,.95),
    rgba(230,232,238,0)
  );
}

.ax-contact-teamTitle{
  margin: 0 0 12px;
  color: var(--ax-text);
  font-weight: 760;
  letter-spacing: -0.02em;
  line-height: 1.2;
  font-size: 26px;
}

/* team */
.ax-team-min{ display: grid; gap: 10px; margin-top: 10px; }

.ax-team-row{
  display: grid;
  grid-template-columns: minmax(160px, 1.2fr) minmax(210px, 1.7fr) minmax(110px, .85fr);
  align-items: center;
  gap: 12px;

  padding: 11px 14px;
  border-radius: 16px;

  background: rgba(255,255,255,.62);
  border: 1px solid var(--ax-border);

  box-shadow: var(--ax-shadow-sm);
}

.ax-team-name{
  color: var(--ax-text);
  font-weight: 680;
  letter-spacing: -0.01em;
  font-size: 14px;

  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ax-team-mail,
.ax-team-tel{
  font-size: 13px;
  font-weight: 600;
  color: rgba(91,100,117,.92);
  text-decoration: none;

  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ax-team-mail{ max-width: 34ch; }
.ax-team-tel{ text-align: right; }

.ax-team-mail:hover,
.ax-team-tel:hover{ color: var(--ax-text); }

/* =========================
   Polityka Prywatności – link
========================= */
.pp a{
  text-decoration: none !important;
  color: #fff !important;
  transition: opacity .2s ease !important;
}
.pp a:hover,
.pp a:focus-visible{
  opacity: .85 !important;
  text-decoration: none !important;
}

/* =========================
   Logo headings (gradient text)
   Klasa: ax-accent-logo
========================= */
.elementor-widget-heading,
.elementor-widget-heading .elementor-widget-container,
.elementor-widget-heading .elementor-heading-title{
  overflow: visible !important;
}

.ax-accent-logo,
.ax-accent-logo .elementor-heading-title{
  display: inline-block !important;
  position: relative !important;

  background-image: linear-gradient(90deg,
    #084EB6 0%,
    #074AAB 50%,
    #06429B 100%
  ) !important;

  background-size: 100% 100% !important;
  background-position: 50% 50% !important;

  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;

  /* żeby wyglądało “logo-like” bez rozjaśniania */
  filter: saturate(1.08) contrast(1.02) !important;

  background-size: 150% 100% !important;
  background-position: 0% 50% !important;

  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;

  line-height: 1.25 !important;
  padding-bottom: .18em !important;

  text-shadow:
    0 1px 0 rgba(255,255,255,.22),
    0 6px 14px rgba(6,43,79,.14) !important;
}

@supports not (-webkit-background-clip: text){
  .ax-accent-logo,
  .ax-accent-logo .elementor-heading-title{
    background: none !important;
    color: #0858B8 !important;
    text-shadow: none !important;
  }
}

/* =========================
   WPForms – (premium / Apple-clean)
========================= */
.elementor-widget-wpforms .wpforms-container{ margin: 0 !important; }
.elementor-widget-wpforms .wpforms-field{ margin: 0 0 14px !important; }

.elementor-widget-wpforms .wpforms-field-label{
  display: inline-block !important;
  margin: 0 0 8px !important;

  font-size: 12px !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;

  color: rgba(91,100,117,.85) !important;
}

.elementor-widget-wpforms .wpforms-required-label{
  color: rgba(8,88,184,.95) !important;
}

.elementor-widget-wpforms :is(input[type="text"], input[type="email"], input[type="tel"], textarea){
  width: 100% !important;

  border-radius: 16px !important;
  border: 1px solid var(--ax-border) !important;
  background: rgba(255,255,255,.72) !important;

  padding: 13px 14px !important;

  font-size: 15.5px !important;
  line-height: 1.45 !important;
  color: var(--ax-text) !important;

  box-shadow:
    0 12px 28px rgba(11,18,32,.06),
    inset 0 1px 0 rgba(255,255,255,.85) !important;

  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
  outline: none !important;
}

.elementor-widget-wpforms :is(input, textarea)::placeholder{
  color: rgba(91,100,117,.70) !important;
}

.elementor-widget-wpforms textarea{
  min-height: 140px !important;
  resize: vertical !important;
}

.elementor-widget-wpforms :is(input[type="text"], input[type="email"], input[type="tel"], textarea):hover{
  background: rgba(255,255,255,.82) !important;
  border-color: rgba(8,88,184,.20) !important;
}

.elementor-widget-wpforms :is(input[type="text"], input[type="email"], input[type="tel"], textarea):focus{
  border-color: rgba(8,88,184,.30) !important;
  box-shadow:
    0 0 0 4px rgba(8,88,184,.10),
    0 14px 34px rgba(11,18,32,.08),
    inset 0 1px 0 rgba(255,255,255,.90) !important;
}

.elementor-widget-wpforms .wpforms-error{
  margin-top: 8px !important;
  font-size: 13px !important;
  color: #B42318 !important;
}

.elementor-widget-wpforms .wpforms-field.wpforms-has-error :is(input, textarea){
  border-color: rgba(180,35,24,.35) !important;
  box-shadow:
    0 0 0 4px rgba(180,35,24,.10),
    0 14px 34px rgba(11,18,32,.06),
    inset 0 1px 0 rgba(255,255,255,.88) !important;
}

.elementor-widget-wpforms .wpforms-submit-container{ margin-top: 16px !important; }

.elementor-widget-wpforms button.wpforms-submit{
  width: 100% !important;

  border-radius: var(--ax-pill-radius) !important;
  padding: 12px 16px !important;

  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: -0.01em !important;

  color: var(--ax-text) !important;
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(230,232,238,.95) !important;

  box-shadow:
    0 10px 26px rgba(11,18,32,.06),
    inset 0 1px 0 rgba(255,255,255,.86) !important;

  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .15s ease !important;
}

.elementor-widget-wpforms button.wpforms-submit:hover{
  background: rgba(255,255,255,.88) !important;
  border-color: rgba(8,88,184,.18) !important;

  box-shadow:
    0 14px 38px rgba(11,18,32,.08),
    0 0 0 4px rgba(8,88,184,.08),
    inset 0 1px 0 rgba(255,255,255,.90) !important;

  transform: translateY(-1px) !important;
}

.elementor-widget-wpforms button.wpforms-submit:focus-visible{
  outline: none !important;
  box-shadow:
    0 0 0 4px rgba(8,88,184,.14),
    0 14px 38px rgba(11,18,32,.08),
    inset 0 1px 0 rgba(255,255,255,.90) !important;
}

.elementor-widget-wpforms .wpforms-submit-spinner{
  margin-left: 10px !important;
  opacity: .85 !important;
}

/* WPForms – privacy consent (final, bez konfliktów) */
.elementor-widget-wpforms .wpforms-field-checkbox > .wpforms-field-label{ display: none !important; }
.elementor-widget-wpforms .wpforms-field.wpforms-field-checkbox{ margin: 6px 0 10px !important; }
.elementor-widget-wpforms .wpforms-field-checkbox ul{
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.elementor-widget-wpforms .wpforms-field-checkbox li{
  margin: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
}
.elementor-widget-wpforms .wpforms-field-checkbox input[type="checkbox"]{
  margin: 2px 0 0 !important;
  width: 16px !important;
  height: 16px !important;
  accent-color: #0858B8 !important;
}
.elementor-widget-wpforms .wpforms-field-checkbox .wpforms-field-label-inline{
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  color: rgba(91,100,117,.92) !important;
}
.elementor-widget-wpforms .wpforms-field-checkbox .wpforms-field-label-inline a{
  color: var(--ax-text) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(11,18,32,.18) !important;
}
.elementor-widget-wpforms .wpforms-field-checkbox .wpforms-field-label-inline a:hover{
  border-bottom-color: rgba(8,88,184,.45) !important;
}

/* =========================
   Inline fiber separator
========================= */
.ax-inline-fiber-sep{
  display: block !important;
  width: 100% !important;
  padding: 18px 0 !important;
  margin: 6px 0 10px !important;
  background: transparent !important;
}
.ax-inline-fiber-sep__svg{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  overflow: visible !important;
}
@media (prefers-reduced-motion: reduce){
  .ax-inline-fiber-sep__svg circle animateMotion{ display:none !important; }
}

/* =========================================================
   RESPONSIVE (<= 782px)
========================= */
@media (max-width: 782px){

  :root{
    --ax-glow-inset: 0;
    --ax-glow-blur: 22px;

    /* ABOUT MEDIA – mobile: bardziej minimalistycznie */
    --ax-about-g1-pos: 78% 28%;
    --ax-about-g2-pos: 22% 82%;
    --ax-about-grid-mask: 52% 46%;
  }

  /* hide WP nav hamburger */
  header.wp-block-template-part :is(
    .wp-block-navigation__responsive-container-open,
    .wp-block-navigation__responsive-container-close,
    .wp-block-navigation__responsive-container
  ){
    display: none !important;
  }

  /* keep desktop-like links */
  header.wp-block-template-part .wp-block-navigation__container{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 14px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  /* typewriter stable height */
  .ax-typewrap{
    font-size: 16px !important;
    line-height: 1.55 !important;

    display: flex !important;
    align-items: flex-start !important;

    min-height: calc(1.55em * 5) !important;
    max-height: calc(1.55em * 5) !important;
    overflow: hidden !important;
  }

  .ax-typed{
    display: block !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    hyphens: auto !important;
  }

  /* contact gradient a bit higher */
  .ax-contact::before{
    background-image:
      radial-gradient(760px 440px at 24% 118%, rgba(34,211,238,.12), transparent 64%),
      radial-gradient(820px 480px at 84% 116%, rgba(37,99,235,.12), transparent 66%),
      linear-gradient(to bottom,
        rgba(247,248,250,0) 0%,
        rgba(247,248,250,0) 52%,
        rgba(247,248,250,.55) 76%,
        rgba(247,248,250,.92) 100%
      ) !important;
  }

  /* about media spacing */
  :is(.ax-about-media, .elementor-widget.ax-about-media > .elementor-widget-container){
    padding: 18px !important;
    border-radius: 18px !important;
  }

  /* about media minimalist glow */
  :is(.ax-about-media, .elementor-widget.ax-about-media > .elementor-widget-container)::before{
    background:
      radial-gradient(560px 340px at var(--ax-about-g1-pos), rgba(34,211,238,.08), transparent 66%),
      radial-gradient(600px 420px at var(--ax-about-g2-pos), rgba(37,99,235,.085), transparent 68%) !important;

    filter: blur(18px) !important;
    opacity: .65 !important;
    background-size: 112% 112% !important;
  }

  :is(.ax-about-media, .elementor-widget.ax-about-media > .elementor-widget-container)::after{
    opacity: .04 !important;
    -webkit-mask-image: radial-gradient(circle at var(--ax-about-grid-mask), black 0 50%, transparent 80%) !important;
    mask-image: radial-gradient(circle at var(--ax-about-grid-mask), black 0 50%, transparent 80%) !important;
  }

  :is(.ax-about-media, .elementor-widget.ax-about-media > .elementor-widget-container) img{
    max-width: 88% !important;
  }

  /* team mobile stack */
  .ax-contact-title{ font-size: 30px; }
  .ax-contact-sub{ font-size: 15px; }
  .ax-contact-item{ gap: 14px; }
  .ax-contact-ico{
    width: 48px;
    height: 48px;
    flex-basis: 48px;
    border-radius: 14px;
  }
  .ax-contact-ico svg{ width: 24px; height: 24px; }
  .ax-contact-teamTitle{ font-size: 22px; }

  .ax-team-row{
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 12px 12px;
    border-radius: 14px;
  }
  .ax-team-mail,
  .ax-team-tel{ font-size: 13px; }
  .ax-team-tel{ text-align: left; }
  .ax-team-mail{ max-width: 100%; }

  /* wpforms mobile shadow/corners (Safari friendly) */
  .elementor-widget-wpforms,
  .elementor-widget-wpforms .elementor-widget-container,
  .elementor-widget-wpforms .wpforms-container,
  .elementor-widget-wpforms form.wpforms-form{
    overflow: visible !important;
  }

  .elementor-widget-wpforms :is(input[type="text"], input[type="email"], input[type="tel"], textarea){
    border-radius: 14px !important;
    background-clip: padding-box !important;

    box-shadow:
      0 10px 22px rgba(11,18,32,.05),
      inset 0 1px 0 rgba(255,255,255,.86) !important;

    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
    will-change: box-shadow !important;
  }

  .elementor-widget-wpforms :is(input[type="text"], input[type="email"], input[type="tel"], textarea):focus{
    box-shadow:
      0 0 0 4px rgba(8,88,184,.10),
      0 12px 26px rgba(11,18,32,.06),
      inset 0 1px 0 rgba(255,255,255,.90) !important;
  }

  .elementor-widget-wpforms button.wpforms-submit{
    background-clip: padding-box !important;
    box-shadow:
      0 10px 22px rgba(11,18,32,.05),
      inset 0 1px 0 rgba(255,255,255,.86) !important;

    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
  }

  .elementor-widget-wpforms button.wpforms-submit:hover{
    box-shadow:
      0 14px 30px rgba(11,18,32,.07),
      0 0 0 4px rgba(8,88,184,.08),
      inset 0 1px 0 rgba(255,255,255,.90) !important;
  }

  .elementor-widget-wpforms .wpforms-field{ overflow: visible !important; }

  /* inline fiber sep mobile */
  .ax-inline-fiber-sep{ padding: 12px 0 !important; }
}

/* HERO fiber – mobile fix (<=782px) */
@media (max-width: 782px){

  .ax-hero{
    --ax-fiber-scale: 1.12;
    --ax-fiber-y: -6%;
  }

  .ax-hero .ax-fiber-wrap{
    /* na mobile hero bywa wysokie, więc fiber nie może lecieć do samego dołu */
    -webkit-mask-image:
      radial-gradient(circle at 50% 34%, transparent 0 46%, black 74%),
      linear-gradient(to bottom, black 0 60%, transparent 86%) !important;
    mask-image:
      radial-gradient(circle at 50% 34%, transparent 0 46%, black 74%),
      linear-gradient(to bottom, black 0 60%, transparent 86%) !important;

    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;

    /* opcjonalnie: twardy limit wysokości warstwy (mniej “rozciągania” na długich hero) */
    height: min(520px, 60vh) !important;
    bottom: auto !important;
  }

  .ax-hero .ax-fiber{
    width: 125% !important;
    height: 100% !important;
    max-width: none !important;

    transform: translateY(var(--ax-fiber-y)) scale(var(--ax-fiber-scale)) !important;
    transform-origin: 50% 18% !important;

    opacity: .58 !important;
  }
}

/* =========================================================
   HERO separator: zakrzywienie w dół + światłowód + narastające zgrubienie
   Divider widget class: ax-hero-sep
   ========================================================= */

.ax-hero-sep{ margin: 14px 0 0 !important; }
.ax-hero-sep .elementor-divider{ padding: 0 !important; }

.ax-hero-sep .elementor-divider-separator{
  border: 0 !important;
  background: none !important;
  position: relative !important;
  width: 100% !important;
  height: 30px !important;              /* miejsce na “V” */
  overflow: visible !important;
}

.ax-hero-sep .elementor-divider-separator::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;

  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201000%2060%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22base%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.18%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.55%22/%3E%3Cstop%20offset%3D%220.65%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.55%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22mid%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.22%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.40%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.35%22/%3E%3Cstop%20offset%3D%220.60%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.70%22/%3E%3Cstop%20offset%3D%220.78%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.20%22/%3E%3Cstop%20offset%3D%220.92%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22peak%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.32%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.46%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.35%22/%3E%3Cstop%20offset%3D%220.60%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.95%22/%3E%3Cstop%20offset%3D%220.66%22%20stop-color%3D%22%2322D3EE%22%20stop-opacity%3D%220.22%22/%3E%3Cstop%20offset%3D%220.78%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.18%22/%3E%3Cstop%20offset%3D%220.90%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22glow%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.50%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.18%22/%3E%3Cstop%20offset%3D%220.74%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22core%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.56%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.64%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220.55%22/%3E%3Cstop%20offset%3D%220.68%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220.12%22/%3E%3Cstop%20offset%3D%220.80%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolyline%20points%3D%220%2C26%20650%2C40%201000%2C26%22%20fill%3D%22none%22%20stroke%3D%22url(%23glow)%22%20stroke-width%3D%2214%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.85%22/%3E%3Cpolyline%20points%3D%220%2C26%20650%2C40%201000%2C26%22%20fill%3D%22none%22%20stroke%3D%22url(%23base)%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3Cpolyline%20points%3D%220%2C26%20650%2C40%201000%2C26%22%20fill%3D%22none%22%20stroke%3D%22url(%23mid)%22%20stroke-width%3D%225.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.85%22/%3E%3Cpolyline%20points%3D%220%2C26%20650%2C40%201000%2C26%22%20fill%3D%22none%22%20stroke%3D%22url(%23peak)%22%20stroke-width%3D%229.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.78%22/%3E%3Cpolyline%20points%3D%220%2C26%20650%2C40%201000%2C26%22%20fill%3D%22none%22%20stroke%3D%22url(%23core)%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.95%22/%3E%3C/svg%3E") center/100% 100% no-repeat !important;
}

/* MOBILE: mniej wysokie V + cieńsze stroke, żeby nie było przesady */
@media (max-width: 782px){
  .ax-hero-sep{ margin: 10px 0 0 !important; }

  .ax-hero-sep .elementor-divider-separator{
    height: 22px !important;
  }

  .ax-hero-sep .elementor-divider-separator::before{
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201000%2060%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22base%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.18%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.55%22/%3E%3Cstop%20offset%3D%220.65%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.55%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22mid%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.26%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.44%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.45%22/%3E%3Cstop%20offset%3D%220.62%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.70%22/%3E%3Cstop%20offset%3D%220.84%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22peak%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.38%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.52%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.95%22/%3E%3Cstop%20offset%3D%220.70%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22glow%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.58%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220.16%22/%3E%3Cstop%20offset%3D%220.78%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230B60E6%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3ClinearGradient%20id%3D%22core%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%220.62%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220.45%22/%3E%3Cstop%20offset%3D%220.70%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolyline%20points%3D%220%2C24%20620%2C36%201000%2C24%22%20fill%3D%22none%22%20stroke%3D%22url(%23glow)%22%20stroke-width%3D%2211%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.85%22/%3E%3Cpolyline%20points%3D%220%2C24%20620%2C36%201000%2C24%22%20fill%3D%22none%22%20stroke%3D%22url(%23base)%22%20stroke-width%3D%222.0%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3Cpolyline%20points%3D%220%2C24%20620%2C36%201000%2C24%22%20fill%3D%22none%22%20stroke%3D%22url(%23mid)%22%20stroke-width%3D%224.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.85%22/%3E%3Cpolyline%20points%3D%220%2C24%20620%2C36%201000%2C24%22%20fill%3D%22none%22%20stroke%3D%22url(%23peak)%22%20stroke-width%3D%227.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.75%22/%3E%3Cpolyline%20points%3D%220%2C24%20620%2C36%201000%2C24%22%20fill%3D%22none%22%20stroke%3D%22url(%23core)%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.95%22/%3E%3C/svg%3E") center/100% 100% no-repeat !important;
  }
}

/* =========================
   OFFERS – FINAL (mniejszy gap, grafika nadal duża, CTA na grafice)
========================= */

/* obrazki + kadr */
.ax-offer--gpon{
  --ax-offer-img: url("https://axelnet.pl/wp-content/uploads/2026/02/ax-offer-gpon.webp");
  --ax-offer-img-y: 40%;
}
.ax-offer--smallworld{
  --ax-offer-img: url("https://axelnet.pl/wp-content/uploads/2026/02/ax-offer-smallworld.webp");
  --ax-offer-img-y: 40%;
}
.ax-offer--infra{
  --ax-offer-img: url("https://axelnet.pl/wp-content/uploads/2026/02/ax-offer-infra.webp");
  --ax-offer-img-y: 40%;
}

/* divider równo */
.ax-offer-title{ min-height: 82px !important; }
.ax-offer-lead{  min-height: 76px !important; }

.ax-offer-card{
  --ax-offer-pad: 22px;

  --ax-offer-imgH: 210px;     /* wysokość samej grafiki */
  --ax-offer-reserve: 195px;  /* TO JEST GAP: zmniejszaj to */

  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;

  padding: var(--ax-offer-pad) !important;
  padding-bottom: calc(var(--ax-offer-pad) + var(--ax-offer-reserve)) !important;
}

.ax-offer-card > *{ position: relative !important; z-index: 2 !important; }
.ax-offer-card::before{ z-index: 0 !important; } /* glow zostaje pod spodem */

.ax-offer-card::after{
  content:"" !important;
  position:absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: var(--ax-offer-imgH) !important;

  pointer-events:none !important;
  z-index: 1 !important;

  background-image:
    /* krótki fade od góry (żeby nie robił “pustki”) */
    linear-gradient(to bottom,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,.72) 6%,
      rgba(255,255,255,0) 12%
    ),
    /* delikatny dół */
    linear-gradient(to top,
      rgba(255,255,255,.35) 0%,
      rgba(255,255,255,0) 20%
    ),
    var(--ax-offer-img);

  background-repeat: no-repeat !important;
  background-size: 100% 100%, 100% 100%, cover !important;
  background-position: center, center, center var(--ax-offer-img-y, 45%) !important;

  filter: none !important;
}

/* CTA na grafice */
.ax-offer-ctaRow{
  position: absolute !important;
  left: var(--ax-offer-pad) !important;
  right: var(--ax-offer-pad) !important;
  bottom: calc(var(--ax-offer-pad) + 10px) !important;

  margin-top: 0 !important;
  padding-top: 0 !important;
  z-index: 3 !important;
}

.ax-offer-cta{
  background: rgba(255,255,255,.80) !important;
  backdrop-filter: saturate(140%) blur(10px) !important;
  -webkit-backdrop-filter: saturate(140%) blur(10px) !important;
}

/* MOBILE */
@media (max-width: 782px){
  .ax-offer-card{
    --ax-offer-imgH: 180px;
    --ax-offer-reserve: 165px;
  }
  .ax-offer-card::after{
    background-position: center, center, center 46% !important;
  }
  .ax-offer-ctaRow{
    bottom: calc(var(--ax-offer-pad) + 8px) !important;
  }
}
