
:root{--red:#df0017;--dark:#101922;--text:#18212b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);font-family:Arial,Helvetica,sans-serif}a{text-decoration:none;color:inherit}.wrap{max-width:1480px;margin:0 auto;padding:0 55px}.wide-wrap{max-width:1600px;margin:0 auto;padding:0 38px}.header{background:#fff;position:relative;z-index:20}.nav{height:102px;display:flex;justify-content:space-between;align-items:center}.logo{display:block;width:420px;max-width:45vw}.links{display:flex;align-items:center;gap:64px;height:100%;font-size:17px}.links a{height:100%;display:flex;align-items:center;position:relative}.links a.active:after{content:'';position:absolute;bottom:19px;left:12px;right:12px;height:4px;background:var(--red)}.links a:hover{color:var(--red)}.menu-btn{display:none}.home-hero{min-height:calc(100vh - 102px);position:relative;overflow:hidden;background:#111820;color:white}.home-photo{position:absolute;inset:0 0 0 30%;background-image:url('/assets/hero-approved.jpg');background-size:cover;background-position:center}.home-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,12,19,.99) 0%,rgba(5,13,20,.96) 26%,rgba(7,14,22,.72) 42%,rgba(7,14,22,.13) 70%,rgba(5,11,18,.06) 100%)}.home-content{position:relative;z-index:1;padding-top:65px;padding-bottom:50px}.hero-kicker{font-size:16px;letter-spacing:4px;margin-bottom:18px}.home-content h1{font-size:clamp(58px,5.8vw,100px);line-height:.99;letter-spacing:-3px;margin:0 0 25px;font-weight:800}.red-dot{color:var(--red)}.home-content p{font-size:20px;line-height:1.38;max-width:520px;margin:0 0 34px;color:#e8e8eb}.features{display:grid;grid-template-columns:repeat(4,1fr);width:min(760px,100%);margin-bottom:30px}.feature{padding:0 17px 0 0;margin-right:20px;border-right:1px solid #ffffff70;display:flex;flex-direction:column;min-height:112px}.feature:last-child{border:0}.feature-icon{font-size:34px;height:43px;line-height:1}.feature-rule,.benefit-rule{height:3px;width:48px;background:var(--red);display:block;margin:7px 0 10px}.feature strong{font-size:15px;font-weight:500;white-space:nowrap}.feature small{font-size:13px;margin-top:7px;line-height:1.25;color:#e5e5e5}.hero-actions{display:flex;gap:20px;flex-wrap:wrap}.button{min-height:62px;display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:14px 28px;border-radius:5px;font-size:16px;font-weight:700}.primary{background:var(--red);color:#fff;min-width:260px}.outline{border:2px solid white;color:white;min-width:280px}.button:hover{filter:brightness(.9)}.offer-banner{position:relative;min-height:365px;background:#f3f4f5;overflow:hidden}.offer-banner:before{content:'';position:absolute;inset:0 0 0 40%;background:url('/assets/oferta-hero.jpg') center/cover no-repeat}.offer-banner:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,#fff 26%,rgba(255,255,255,.96) 35%,rgba(255,255,255,.68) 48%,transparent 75%)}.offer-intro{position:relative;z-index:1;padding-top:32px;padding-bottom:28px}.offer-label,.services-label{font-size:17px;letter-spacing:3px;font-weight:600}.offer-label:before,.services-label:before{content:'';display:inline-block;width:30px;height:2px;background:var(--red);vertical-align:middle;margin-right:14px}.offer-intro h1{font-size:clamp(36px,4.3vw,64px);line-height:1.02;letter-spacing:-1.8px;margin:12px 0;font-weight:800}.offer-intro p{font-size:21px;line-height:1.35;color:#4f5864;margin:0}.offer-benefits{display:flex;gap:32px;margin-top:26px}.offer-benefit{display:flex;flex-direction:column;font-size:13px;line-height:1.25;min-width:125px}.benefit-icon{font-size:31px;height:36px}.benefit-rule{margin:4px 0 9px;width:31px;height:2px}.services-section{padding:16px 0 13px;background:#f6f6f6}.services-label{margin:0 0 16px}.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px}.service{display:grid;grid-template-columns:43% 57%;background:#fff;min-height:214px;overflow:hidden}.service>img{width:100%;height:100%;min-height:214px;object-fit:cover}.service-text{position:relative;padding:17px 17px 28px 20px}.service-heading{display:flex;align-items:center;gap:15px}.service-icon{font-size:31px;min-width:38px;line-height:1}.service h3{font-size:15px;line-height:1.17;margin:0;font-weight:800}.service-rule{display:block;background:var(--red);height:2px;width:34px;margin:11px 0 12px}.service p{font-size:14px;line-height:1.33;color:#4e5661;margin:0}.service-arrow{position:absolute;right:14px;bottom:5px;color:var(--red);font-size:27px}.offer-cta{background:linear-gradient(100deg,#950315,#c4091d,#970415);text-align:center;padding:22px 12px;color:white}.offer-cta a{display:inline-flex;align-items:center;gap:28px;font-size:23px;font-weight:700}.offer-cta a span{font-size:35px;font-weight:400}.footer{padding:14px;background:#0c1118;color:#d1d1d1;text-align:center;font-size:12px}@media(max-width:1100px){.wrap{padding:0 32px}.wide-wrap{padding:0 20px}.home-content h1{font-size:70px}.home-photo{left:25%}.service{grid-template-columns:1fr}.service>img{height:170px;min-height:0}.service-text{min-height:230px}.services-grid{gap:15px}.offer-intro h1{font-size:48px}}@media(max-width:700px){.wrap{padding:0 22px}.nav{height:75px}.logo{width:270px;max-width:70vw}.menu-btn{display:block;font-size:26px;background:white;border:1px solid #ddd;padding:4px 10px}.links{display:none;position:absolute;top:75px;left:0;right:0;background:white;height:auto;padding:12px 22px;gap:0;flex-direction:column;align-items:stretch;box-shadow:0 8px 18px #0002}.links.open{display:flex}.links a{height:50px}.links a.active:after{bottom:2px;left:0;right:auto;width:70px;height:2px}.home-hero{min-height:calc(100vh - 75px)}.home-photo{inset:0;background-position:60% center}.home-shade{background:linear-gradient(90deg,rgba(4,12,19,.94),rgba(4,12,19,.72)),linear-gradient(0deg,rgba(4,12,19,.5),transparent)}.home-content{padding-top:45px;padding-bottom:40px}.hero-kicker{font-size:11px;letter-spacing:2px}.home-content h1{font-size:clamp(48px,11vw,72px);letter-spacing:-1px}.home-content p{font-size:16px}.features{grid-template-columns:repeat(2,1fr);gap:22px 8px}.feature{margin-right:5px;min-height:110px}.feature:nth-child(2){border:0}.feature strong{font-size:13px}.feature small{font-size:12px}.hero-actions{gap:12px}.button{width:100%;min-width:0;min-height:52px}.offer-banner:before{inset:0;opacity:.2}.offer-banner:after{background:rgba(255,255,255,.79)}.offer-intro{padding-top:32px}.offer-intro h1{font-size:clamp(32px,7vw,46px);letter-spacing:-1px}.offer-intro h1 br{display:none}.offer-intro p{font-size:16px}.offer-intro p br{display:none}.offer-benefits{display:grid;grid-template-columns:repeat(2,1fr);gap:17px;margin-top:25px}.services-grid{grid-template-columns:1fr}.service{grid-template-columns:40% 60%;min-height:205px}.service>img{height:100%;min-height:205px}.service-text{min-height:205px;padding:14px 14px 28px}.service-icon{font-size:23px;min-width:24px}.service-heading{gap:8px}.service h3{font-size:13px}.service p{font-size:12px}.offer-cta a{font-size:17px;gap:14px}}@media(max-width:370px){.service{grid-template-columns:1fr}.service>img{height:180px;min-height:0}.service-text{min-height:180px}}
/* Korekta strony głównej — proporcje zatwierdzonej wizualizacji */
@media (min-width: 701px) {
  .home-hero { min-height: 0; height: calc(100svh - 102px); min-height: 610px; }
  .home-photo { inset: 0 0 0 29%; background-position: center center; }
  .home-shade { background: linear-gradient(90deg,rgba(4,12,19,.99) 0%,rgba(4,12,19,.97) 25%,rgba(4,12,19,.76) 36%,rgba(4,12,19,.23) 56%,rgba(4,12,19,.02) 83%); }
  .home-content { height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 22px; padding-bottom: 22px; }
  .hero-kicker { font-size: clamp(12px,1vw,16px); letter-spacing: 3.1px; margin-bottom: 12px; }
  .home-content h1 { font-size: clamp(58px,5.15vw,86px); line-height: .98; letter-spacing: -2px; margin-bottom: 18px; }
  .home-content p { font-size: clamp(16px,1.18vw,19px); line-height: 1.32; max-width: 485px; margin-bottom: 23px; }
  .features { width: min(680px,100%); margin-bottom: 23px; }
  .feature { min-height: 95px; margin-right: 12px; padding-right: 12px; }
  .feature-icon { height: 37px; font-size: 31px; }
  .feature-rule { margin: 4px 0 8px; }
  .feature strong { font-size: 14px; }
  .feature small { font-size: 12px; margin-top: 5px; }
  .button { min-height: 56px; }
  .primary { min-width: 230px; }
  .outline { min-width: 255px; }
}
@media (min-width: 701px) and (max-height: 850px) {
  .home-hero { min-height: 0; height: calc(100svh - 102px); }
  .home-content { padding-top: 14px; padding-bottom: 14px; }
  .hero-kicker { margin-bottom: 9px; }
  .home-content h1 { font-size: clamp(52px,4.65vw,76px); margin-bottom: 13px; }
  .home-content p { font-size: 16px; line-height: 1.27; max-width: 470px; margin-bottom: 17px; }
  .features { margin-bottom: 16px; }
  .feature { min-height: 86px; }
  .feature-icon { font-size: 28px; height: 32px; }
  .feature-rule { margin: 3px 0 6px; }
  .feature small { margin-top: 4px; }
  .button { min-height: 50px; padding: 10px 22px; }
}
@media (min-width: 701px) and (max-height: 650px) {
  .home-hero { height: auto; min-height: 550px; }
}

/* MALHAR: płynne przenikanie zdjęcia w ciemne tło bez pionowego odcięcia.
   Zachowujemy dotychczasowy kadr, wielkość nagłówka i pozycje przycisków. */
.home-photo {
  -webkit-mask-image: linear-gradient(to right, transparent 0%, transparent 3%, rgba(0,0,0,.12) 12%, rgba(0,0,0,.45) 24%, rgba(0,0,0,.8) 38%, #000 57%);
  mask-image: linear-gradient(to right, transparent 0%, transparent 3%, rgba(0,0,0,.12) 12%, rgba(0,0,0,.45) 24%, rgba(0,0,0,.8) 38%, #000 57%);
}
.feature-icon svg { width: 34px; height: 34px; display: block; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 701px) {
  .home-photo { left: 0; background-size: auto 100%; background-repeat: no-repeat; background-position: right center; }
  .home-shade { background: linear-gradient(90deg,rgba(4,12,19,.98) 0%,rgba(4,12,19,.95) 24%,rgba(4,12,19,.55) 40%,rgba(4,12,19,.12) 64%,rgba(4,12,19,.02) 100%); }
}
@media (max-width: 700px) {
  .home-photo { -webkit-mask-image: none; mask-image: none; }
  .feature-icon svg { width: 30px; height: 30px; }
}

/* Przywrócony, zatwierdzony kadr HERO: całe zdjęcie po prawej, bez powiększania.
   Zostawiamy bez zmian układ i ofertę. */
/* MALHAR — zgodność zatwierdzonej strony głównej z podstroną Oferta */
.links .btn{height:auto;min-height:42px;background:#df0017;color:#fff;padding:10px 16px;border-radius:4px;font-weight:700}
.links .btn:hover{color:#fff;background:#b50015}
.hero.offer-hero{background:linear-gradient(115deg,#101b27,#263543);color:#fff;overflow:hidden}
.offer-hero .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;min-height:340px;align-items:center}
.offer-hero .hero-copy{padding:45px 35px 45px 0}
.offer-hero .eyebrow{text-transform:uppercase;letter-spacing:3px;color:#e2a8af;font-size:13px;font-weight:700}
.offer-hero h1{font-size:clamp(40px,5vw,64px);line-height:1.08;margin:18px 0}
.offer-hero p{font-size:18px;max-width:600px;color:#e1e6ea;line-height:1.55}
.offer-hero .hero-photo{height:100%;min-height:340px;position:relative}
.offer-hero .hero-photo img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.offer-hero .hero-photo:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#182430 0%,transparent 28%);z-index:1}
.section.soft{padding:65px 0;background:#f6f7f8}
.section .eyebrow.center{text-align:center;text-transform:uppercase;letter-spacing:3px;color:#b3192d;font-size:13px;font-weight:700}
.section h2{text-align:center;font-size:clamp(32px,4vw,48px);line-height:1.15;margin:10px 0}
.section-lead{text-align:center;color:#54616f;font-size:18px;max-width:850px;margin:0 auto 38px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}
.tile{border:1px solid #e6e8ea;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 8px 26px #101b2710;display:flex;flex-direction:column}
.tile img{width:100%;height:235px;object-fit:contain;object-position:center;display:block;background:#eef0f2}
.tile-body{padding:23px 23px 28px;flex:1}
.tile h3{font-size:21px;line-height:1.24;margin:0 0 16px;color:#101b27}
.tile .accent{height:4px;width:48px;background:#d91d30;margin:0 0 15px}
.tile p{margin:0;color:#4b5967;font-size:15px;line-height:1.55}
.info{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:28px auto 0}
.info span{background:#fff;border:1px solid #e1e5e8;padding:10px 16px;border-radius:8px;font-weight:700;font-size:14px}
.band{background:#101b27;color:#fff;padding:40px 0}
.band .wrap{display:flex;justify-content:space-between;align-items:center;gap:25px}
.band h2{margin:0;font-size:30px}.band p{margin:5px 0 0;color:#d5dde4}
.band .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#df0017;color:#fff;padding:15px 26px;border-radius:6px;font-weight:700}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.offer-hero .hero-grid{grid-template-columns:1fr}.offer-hero .hero-copy{padding:45px 0}.offer-hero .hero-photo{height:260px;min-height:260px}.band .wrap{flex-direction:column;align-items:flex-start}}
@media(max-width:620px){.grid{grid-template-columns:1fr}.tile img{height:230px}.section.soft{padding:45px 0}.offer-hero h1{font-size:40px}.offer-hero p{font-size:16px}.links .btn{width:100%}}


/* MALHAR | 02.11.2026 | Korekta trzech elementów bez zmiany reszty strony */
/* 1. HERO: zachowujemy dotychczasowy rozmiar zdjęcia (auto 100%),
   a przenikanie zaczynamy przy faktycznej lewej krawędzi fotografii.
   Gdy zdjęcie ma pozycję "right center", początek obrazu wypada ok. 53% szerokości HERO. */
@media (min-width: 701px) {
  .home-hero { background-color: #041019; }
  .home-photo {
    inset: 0;
    background-size: auto 100%;
    background-position: right center;
    background-repeat: no-repeat;
    -webkit-mask-image: linear-gradient(to right,
      transparent 0%,
      transparent 49%,
      rgba(0,0,0,.04) 54%,
      rgba(0,0,0,.26) 61%,
      rgba(0,0,0,.65) 70%,
      rgba(0,0,0,.92) 80%,
      #000 88%);
    mask-image: linear-gradient(to right,
      transparent 0%,
      transparent 49%,
      rgba(0,0,0,.04) 54%,
      rgba(0,0,0,.26) 61%,
      rgba(0,0,0,.65) 70%,
      rgba(0,0,0,.92) 80%,
      #000 88%);
  }
}
/* 2. Oferta: każdy kafelek ma zdjęcie o identycznych wymiarach.
   object-fit:cover wypełnia cały kadr, przycinając tylko nadmiar po bokach lub u góry/dołu. */
.tile img {
  display: block;
  width: 100%;
  height: 250px;
  object-fit: cover;
  object-position: center center;
}
@media (max-width: 620px) {
  .tile img { height: 220px; }
}

/* Kontakt — niezależny od ustawień protokołu mailto w przeglądarce */
.contact-main{background:#f5f6f7;min-height:calc(100vh - 165px);padding:72px 0 85px;color:#101b27}
.contact-card{max-width:850px;margin:0 auto;padding:54px 58px 48px;background:#fff;border:1px solid #e1e5e9;border-radius:10px;box-shadow:0 12px 35px #101b2710}
.contact-kicker{color:#bd1225;font-size:14px;letter-spacing:3px;font-weight:700}
.contact-card h1{font-size:clamp(36px,4vw,58px);line-height:1.06;margin:18px 0 20px}
.contact-lead{font-size:19px;line-height:1.5;max-width:650px;color:#445362;margin:0 0 34px}
.contact-address-label{font-size:13px;letter-spacing:1px;text-transform:uppercase;color:#687481;margin:0 0 5px;font-weight:700}
.contact-address{font-size:clamp(18px,2.7vw,26px);font-weight:700;overflow-wrap:anywhere;margin:0 0 28px}
.contact-actions{display:flex;gap:14px;flex-wrap:wrap}
.contact-action{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:54px;padding:14px 20px;border-radius:5px;font-weight:700;text-decoration:none}
.contact-action-primary{background:#df0017;color:white}
.contact-action-primary:hover{background:#b80016;color:#fff}
.contact-action-outline{border:2px solid #101b27;background:#fff;color:#101b27}
.contact-action-outline:hover{background:#f5f6f7}
.contact-hint{color:#53616f;line-height:1.55;font-size:14px;margin:26px 0 28px}
.contact-back{color:#b30b20;font-weight:700}
@media(max-width:700px){.contact-main{padding:24px 0 48px}.contact-card{padding:31px 23px 34px}.contact-lead{font-size:16px}.contact-actions{flex-direction:column}.contact-action{width:100%}}
