@media (max-width:620px){
  :root{--m-gutter:20px;--m-section:56px;--m-header:64px;--m-head-gap:28px;--m-beige:#f2eae0;--m-line:#ebe3d9;--m-divider:rgba(7,29,59,.09);--m-text:rgba(7,29,59,.8);--m-text-soft:rgba(7,29,59,.72);--m-text-dark:rgba(255,255,255,.88);--m-card-shadow:0 6px 20px rgba(7,29,59,.06);--m-radius:16px}

  body:not(.home) .container,.site-footer>.container,.site-header>.container,.home-wrap,body:not(.home) .hero-grid{width:calc(100% - 2 * var(--m-gutter))}

  .home .site-header,body:not(.home) .site-header{height:var(--m-header)}
  body:has(.hero.photo-hero){--header-h:var(--m-header)}
  .home .nav,body:not(.home) .nav{position:static}
  .site-header .logo-mark{width:112px}
  .home .nav-toggle,body:not(.home) .nav-toggle{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:10px;font-size:22px;line-height:1}
  .home .links,body:not(.home) .links{top:var(--m-header);left:0;right:0;max-height:calc(100vh - var(--m-header));max-height:calc(100dvh - var(--m-header));overflow-y:auto;overscroll-behavior:contain;padding:6px var(--m-gutter) 22px;border-top:1px solid rgba(255,255,255,.12);border-radius:0 0 18px 18px}
  .home .links>a,.home .links>a:nth-child(n),body:not(.home) .links>a{padding:15px 2px;font-size:16px}
  .nav-group-toggle{padding:15px 2px;font-size:16px}
  .nav-dropdown{padding:0 0 12px 14px}
  .nav-dropdown a{padding:10px 2px;font-size:15px}
  #formularz,.anchor{scroll-margin-top:var(--m-header)}

  #main-content>:is(.section,.offer-block,.about-home,.home-benefits,.home-offer){padding-top:var(--m-section);padding-bottom:var(--m-section)}
  #main-content>.home-numbers{padding-top:40px;padding-bottom:40px}
  #main-content :is(.home-offer,.flavors,.quality,.venues,.product-forms,.visibility,.contact-team){background:var(--m-beige)}
  #main-content :is(.offer-block,.offer-areas){border-bottom:0}
  #main-content .offer-area:nth-of-type(odd){background:var(--m-beige)}

  #main-content .eyebrow{display:block;margin:0 0 10px;font-size:12px;line-height:1.4;font-weight:800;letter-spacing:.14em}
  #main-content section h2{margin:0;font-size:26px;line-height:1.2;letter-spacing:-.01em;text-wrap:balance}
  #main-content section h3{margin:0;font-size:17px;line-height:1.3;font-weight:700}
  #main-content .why-kosmos-copy .why-kosmos-claim{margin:20px 0 0;font-size:18px;line-height:1.4}

  #main-content :is(.section-head p,.about-grid>div>p,.why-kosmos-copy>p:not(.why-kosmos-claim),.about-story .grid-2>div>p,.responsibility-copy>p,.equipment-copy>p,.why-mobile-copy>p,.products-copy>p,.offer-area-copy>p,.starter-copy>p){max-width:none;margin:12px 0 0;font-size:16px;line-height:1.6;color:var(--m-text);text-align:left}
  #main-content :is(.hero .lead,.cta .lead,.contact-form-intro>p){max-width:none;margin:12px 0 0;font-size:16px;line-height:1.6}
  #main-content :is(.hero .lead,.cta .lead,.contact-form-intro>p){color:var(--m-text-dark)}
  body:is(.page-mobilne,.page-akcesoria) #main-content .hero .lead{color:var(--m-text)}
  #main-content :is(.card,.image-card,.why-point,.why-worth-list li,.partnership-list li,.why-mobile-list li,.format-card,.launch-body,.offer-cards article) p{margin:6px 0 0;font-size:15px;line-height:1.55;color:var(--m-text-soft);text-align:left}
  #main-content :is(.starter-note,.section-note){max-width:none;margin:16px 0 0;font-size:14px;line-height:1.55;color:var(--m-text-soft);text-align:left}

  #main-content :is(.section-head,.section-head.center,.section-head.wide,.offer-head,.launch-head){max-width:none;margin:0 0 var(--m-head-gap);text-align:left}
  #main-content .container>.section-head:last-child{margin-bottom:0}
  #main-content :is(.center,.home-benefits,.why-works-copy,.section.navy .section-head){text-align:left}
  #main-content #proces .section-head,#main-content #proces .section-head p{text-align:center}
  #main-content :is(.why-worth-copy,.partnership-copy)>:is(.eyebrow,h2){text-align:left}
  #main-content .why-worth h2{width:auto;margin-inline:0}
  body.page-stacjonarne #main-content .why-worth h2:after{display:none}

  #main-content .btn{width:100%;min-height:48px;padding:12px 20px;font-size:14px}
  #main-content :is(.hero .btn,.about-grid .btn,.equipment-copy .btn){margin-top:24px}

  #main-content :is(.card,.image-card,.format-card,.offer-cards article){border:1px solid var(--m-line);border-radius:var(--m-radius);background:#fff;box-shadow:var(--m-card-shadow)}
  #main-content .card{padding:20px}
  #main-content :is(.image-card,.card.image-card){padding:0;overflow:hidden}
  #main-content .image-card img{aspect-ratio:16/10}
  #main-content .image-card>div{padding:16px 18px 18px}

  #main-content :is(.offer-cards,.flavors .grid,.venues .image-card-grid,.product-forms .image-card-grid,.places .image-card-grid,.format-grid,.products-cards){display:flex;flex-wrap:nowrap;gap:14px;width:auto;max-width:none;margin:0 calc(-1 * var(--m-gutter)) -16px;padding:4px var(--m-gutter) 16px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--m-gutter);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  #main-content :is(.offer-cards,.flavors .grid,.venues .image-card-grid,.product-forms .image-card-grid,.places .image-card-grid,.format-grid,.products-cards)::-webkit-scrollbar{display:none}
  #main-content :is(.offer-cards,.flavors .grid,.venues .image-card-grid,.product-forms .image-card-grid,.places .image-card-grid,.format-grid,.products-cards)>*{flex:0 0 min(80%,300px);min-width:0;margin:0;scroll-snap-align:start}
  #main-content .home-offer .offer-cards{width:100%;margin:0 0 -16px}

  #main-content :is(.why-kosmos .why-points,.why-worth-list,.partnership-list,.why-mobile-list,.contact-help .grid,.contact-team .grid,.why-works .why-points,.launch-timeline,.steps){display:block;max-width:none;margin:0;padding:4px 18px;list-style:none;background:#fff;border:1px solid var(--m-line);border-radius:var(--m-radius);box-shadow:var(--m-card-shadow)}
  #main-content :is(.why-kosmos .why-points,.why-worth-list,.partnership-list,.why-mobile-list){margin-top:var(--m-head-gap)}
  #main-content :is(.why-kosmos .why-point,.why-worth-list li,.partnership-list li,.why-mobile-list li,.contact-help-card,.contact-dept,.why-works .why-point,.launch-timeline li,.steps .step){margin:0;padding:16px 0;min-height:0;background:none;border:0;border-radius:0;box-shadow:none;text-align:left}
  #main-content :is(.why-kosmos .why-point,.why-worth-list li,.partnership-list li,.why-mobile-list li,.contact-help-card,.contact-dept,.why-works .why-point,.launch-timeline li,.steps .step)+*{border-top:1px solid var(--m-divider)}
  #main-content :is(.why-kosmos .why-point,.why-worth-list li,.partnership-list li,.why-mobile-list li,.contact-help-card,.why-works .why-point){display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto;grid-row:auto;column-gap:14px;row-gap:0;align-items:start;align-content:start}
  #main-content :is(.why-kosmos .why-point,.why-worth-list li,.partnership-list li,.why-mobile-list li,.contact-help-card,.why-works .why-point)>:first-child{grid-row:1/span 2;grid-column:1;display:block;width:30px;height:30px;margin:0;padding:0;background:none;border-radius:0;color:var(--navy)}
  #main-content :is(.why-kosmos .why-point,.contact-help-card,.why-works .why-point) .icon :is(svg,img){display:block;width:30px;height:30px;margin:0}
  #main-content :is(.why-kosmos .why-point,.why-worth-list li,.partnership-list li,.why-mobile-list li,.contact-help-card,.why-works .why-point)>h3{grid-column:2;margin:0;font-size:17px;line-height:1.3;text-wrap:pretty}
  #main-content :is(.why-kosmos .why-point,.why-worth-list li,.partnership-list li,.why-mobile-list li,.contact-help-card)>p{grid-column:2;margin:4px 0 0}
  #main-content .why-works .why-point>h3{align-self:center}
  #main-content .launch-body{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:14px;align-items:start}
  #main-content .launch-body .offer-benefit-icon{width:30px;height:30px;color:var(--navy)}
  #main-content .launch-body h3{margin:0;font-size:17px;line-height:1.3;font-weight:700}
  #main-content .launch-body p{margin-top:4px}

  #main-content .contact-dept .icon{display:none}
  #main-content .contact-dept{display:flex;flex-direction:column;align-items:flex-start}
  #main-content .contact-dept h3{font-size:17px;line-height:1.3}
  #main-content .contact-dept p.contact-dept-role{margin:2px 0 0;font-size:14px;line-height:1.45}
  #main-content .contact-dept a.contact-dept-phone{gap:10px;margin-top:8px;padding:0;font-size:16px;line-height:1.4}
  #main-content .contact-dept-phone svg{width:18px;height:18px}

  #main-content .steps .step.has-image{display:flex;flex-direction:column;align-items:center;text-align:center}
  #main-content .steps .step.has-image img{width:80px;height:80px}
  #main-content .steps .step.has-image:before{margin:8px 0 4px;font-size:13px}
  #main-content .steps .step.has-image span{font-size:17px;line-height:1.3;font-weight:700}

  #main-content .cta{gap:24px;align-items:stretch}
  #main-content .cta h2{margin:0}

  #main-content .hero.photo-hero{padding-top:calc(32px + var(--header-h))}
  #main-content .hero h1{font-size:34px;line-height:1.12;letter-spacing:-.02em}
  #main-content .photo-hero-img{margin-top:28px}
  #main-content .hero h1:after{top:-30px}
  #main-content .contact-hero-visual img{width:auto;max-width:100%;max-height:260px;margin:0 auto}

  #main-content .home-hero{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(5,auto);height:auto;min-height:0}
  #main-content .hero-title{grid-row:1;grid-column:1;position:relative;z-index:5;top:auto;left:auto;transform:none;width:auto;padding:28px var(--m-gutter) 0}
  #main-content .hero-title h1{max-width:360px;margin:0 auto;font-size:28px;line-height:1.2;letter-spacing:-.01em;text-wrap:balance}
  #main-content .hero-title h1 br{display:none}
  #main-content .hero-title p{max-width:330px;margin:12px auto 0;font-size:15px;line-height:1.55}
  #main-content .hero-half{height:auto;min-height:0;padding:0}
  #main-content .hero-stable{grid-row:1/5;grid-column:1;display:grid;grid-template-rows:subgrid;grid-template-columns:minmax(0,1fr)}
  #main-content .hero-stable>.hero-copy{grid-row:2}
  #main-content .hero-stable>img{grid-row:3}
  #main-content .hero-stable>.hero-points{grid-row:4}
  #main-content .hero-season{grid-row:5;grid-column:1;display:flex;flex-direction:column}
  #main-content :is(.hero-copy,.hero-copy.right){position:relative;z-index:4;top:auto;left:auto;right:auto;transform:none;translate:none;width:auto;max-width:none;margin:0;padding:28px var(--m-gutter) 0;container-type:normal;text-align:center}
  #main-content .hero-copy>span{display:block;font-size:13px;letter-spacing:.06em}
  #main-content .hero-copy h2{margin:4px 0 0;font-size:34px;line-height:1.05;letter-spacing:0}
  #main-content .hero-copy p{max-width:320px;margin:12px auto 0;font-size:15px;line-height:1.5}
  #main-content .hero-copy .btn{width:auto;min-width:190px;margin-top:20px}
  #main-content .hero-season .hero-copy :is(span,h2,p){text-shadow:0 0 12px rgba(252,232,238,.9),0 0 3px rgba(252,232,238,.8)}
  #main-content .hero-half>img{position:relative;z-index:2;top:auto;left:auto;right:auto;bottom:auto;transform:none;translate:none;justify-self:center;align-self:center;width:auto;max-width:calc(100% - 2 * var(--m-gutter));margin:20px auto 0;object-fit:contain}
  #main-content .hero-stable>img{height:230px}
  #main-content .hero-season>img{height:200px}
  #main-content .hero-points{position:relative;z-index:4;top:auto;left:auto;right:auto;bottom:auto;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:20px 12px 28px}
  #main-content .hero-points b{min-height:0;font-size:12px;line-height:1.35}

  #main-content .about-grid{gap:28px}
  #main-content .about-photo{width:100%;max-width:none;height:220px;margin:0;border-radius:var(--m-radius);box-shadow:none}

  #main-content .number-grid{gap:24px 8px}
  #main-content .number-grid>:last-child:nth-child(odd){grid-column:1/-1}
  @media (min-width:360px){
    #main-content .number-grid:has(>:nth-child(5):last-child){grid-template-columns:repeat(6,minmax(0,1fr))}
    #main-content .number-grid:has(>:nth-child(5):last-child)>*{grid-column:span 2}
    #main-content .number-grid:has(>:nth-child(5):last-child)>:nth-child(4){grid-column:2/span 2}
  }
  #main-content .number-grid strong{font-size:32px;line-height:1.1}
  #main-content .number-grid span{display:block;margin-top:6px;font-size:13px;line-height:1.35}

  #main-content .benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px;margin-top:var(--m-head-gap)}
  #main-content .benefit-grid :is(.benefit-icon,svg){width:40px;height:40px;margin:0 0 10px}
  #main-content .benefit-grid>div{text-align:center}
  #main-content .benefit-grid span{font-size:13px;line-height:1.45;font-weight:600}

  #main-content .home-offer .offer-head{margin:0 auto var(--m-head-gap)}
  #main-content .offer-cards article>img{aspect-ratio:16/10}
  #main-content .offer-cards article>div{padding:16px 18px 18px}
  #main-content .offer-cards p{margin-bottom:18px}
  #main-content .offer-cards .btn{margin-top:auto}

  #main-content .contact-form-grid{row-gap:28px}

  #main-content .about-story .grid-2{row-gap:28px}
  #main-content .about-story .story-photo{max-width:none;height:220px;border-radius:var(--m-radius)}
  #main-content .responsibility-grid{row-gap:28px}
  #main-content .responsibility-photo{height:220px;border-radius:var(--m-radius)}
  #main-content .flavors .card{overflow:hidden}
  #main-content .flavors .card .photo-placeholder{height:170px;min-height:170px;margin:-20px -20px 16px;border-radius:0}
  #main-content .quality .grid{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:10px;max-width:none;margin:0}
  #main-content .quality .card{display:flex;align-items:center;justify-content:center;width:145px;min-width:0;min-height:0;padding:20px}
  #main-content .quality .card h3{font-size:14px;line-height:1.3;text-align:center}
  #main-content .video.js-video{border-radius:var(--m-radius)}

  #main-content .equipment-grid{row-gap:28px}

  #main-content .format-card{grid-template-columns:minmax(0,1fr);align-content:start;row-gap:14px;padding:20px}
  #main-content .format-card-visual img{max-height:150px;margin:0 auto}
  #main-content .formats-more{margin-top:24px}
  #main-content .products-grid{row-gap:var(--m-head-gap)}

  #main-content .offer-areas{padding-bottom:40px}

  #main-content .starter-grid{row-gap:var(--m-head-gap)}
  #main-content .starter-visual{margin:24px 0 0}
  #main-content :is(.starter-items,.visibility-items){grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  #main-content :is(.starter-items .starter-item,.visibility-items .visibility-item){justify-content:flex-start;min-height:0;padding:12px 12px 14px;text-align:left}
  #main-content :is(.starter-item-img,.visibility-item-img){height:110px;margin:0 0 12px;padding:8px}
  #main-content :is(.starter-items,.visibility-items) h3{font-size:15px;line-height:1.35;text-wrap:balance}
  #main-content .starter-items h3 small{font-size:13px}
  #main-content .why-works-grid{row-gap:var(--m-head-gap)}

  #main-content .contact-form .form-field{gap:6px;padding-bottom:18px}
  #main-content .contact-form .field-error{position:static;margin:2px 0 0}
  #main-content .contact-form .field-error[hidden]{display:none}
  #main-content .contact-form textarea{min-height:120px}
  #main-content .contact-form .btn[type="submit"]{justify-self:stretch;margin-top:8px}
  #main-content .contact-form .form-actions{flex-direction:column;align-items:stretch;margin-top:8px}
  #main-content .contact-form .form-actions .btn[type="submit"]{margin-top:0}

  body .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px;padding:44px 0 32px}
  .footer-brand,.footer-contact{grid-column:1/-1}
  .footer-brand p{max-width:none;margin-top:14px;font-size:15px;line-height:1.6}
  .footer-col b{margin-bottom:10px;font-size:15px}
  body .footer-grid .footer-col a{margin:0 0 8px;font-size:15px;line-height:1.5}
  .footer-social{margin-top:8px}
  body .copyright{gap:8px;padding:18px 0 24px}
}

@media (max-width:620px){
  @supports not (grid-template-rows:subgrid){
    #main-content .hero-title{background:var(--navy)}
    #main-content .hero-stable{grid-row:2/5;display:flex;flex-direction:column}
  }
}