/* vietnamese */
@font-face {
  font-family: 'Merienda';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/merienda/v19/gNMHW3x8Qoy5_mf8uWMKMIqK_Q.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Merienda';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/merienda/v19/gNMHW3x8Qoy5_mf8uWMLMIqK_Q.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Merienda';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/merienda/v19/gNMHW3x8Qoy5_mf8uWMFMIo.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Fonts */
:root {
  --default-font: "Merienda", sans-serif;
}

/* Global Colors */
:root {
  /* Background Color - This color is applied to the background of the entire website as well as individual sections. */
  --background-color: #ffffff;

  /* Default Color - This is the default color used for the majority of the text content. */
  --default-color: #212529;

  /* Heading Color - This color is used for titles, headings and secondary elements. */
  --heading-color: #000;

  /* Accent Color - This is the main accent color that represents your brand on the website. It's used for buttons, links, and other elements that need to stand out. */
  --accent-color: #e9e9e9;

  /* Contrast Color - This is a color used for text when the background color is one of the heading, accent, or default colors. Its purpose is to ensure proper contrast and readability when placed over these more dominant colors. */
  --contrast-color: #ffffff;
}

/* Nav Menu Colors */
:root {
  /* Nav Color - This is the default color of the main navmenu links. */
  --nav-color: #3a3939;

  /* Nav Hover Color - This color is applied to main navmenu links when they are hovered over. */
  --nav-hover-color: #e84545;

  /* Nav Dropdown Background Color - This color is used as the background for dropdown boxes that appear when hovering over primary navigation items. */
  --nav-dropdown-background-color: #ffffff;

  /* Nav Dropdown Color - This color is used for navigation links of the dropdown items in the navigation menu. */
  --nav-dropdown-color: #3a3939;

  /* Nav Dropdown Hover Color - Similar to --nav-hover-color, this color is applied to dropdown navigation links when they are hovered over. */
  --nav-dropdown-hover-color: #e84545;
}

/* Smooth scroll */
:root {
  scroll-behavior: smooth;
}

/* width */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}
/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}
/* Handle */
::-webkit-scrollbar-thumb {
  background: #82bbf0;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #2f8ee6;
}

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
html, body {
  font-display:swap!important;
  max-width: 100%!important;
  overflow-x: hidden!important;
  padding-right:0!important;
}

body {
  color: var(--default-color);
  background-color: var(--background-color);
  font-family: var(--default-font);
}

a {
  color: var(--accent-color);
  text-decoration: none;
  transition: 0.3s;
}

a:hover {
  color: color-mix(in srgb, var(--accent-color), transparent 25%);
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--heading-color);
}

/*--------------------------------------------------------------
# Global Header
--------------------------------------------------------------*/
.header {
  color: var(--default-color);
  background-color: var(--background-color);
  padding: 16px 0;
  -webkit-transition: all 0.5s ease, top 0.5s ease-in-out;
  -moz-transition: all 0.5s ease, top 0.5s ease-in-out;
  -o-transition: all 0.5s ease, top 0.5s ease-in-out;
  transition: all 0.5s ease, top 0.5s ease-in-out;
  z-index: 997;
  border:none;
  outline:none;
}
.header .topbar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 40px;
  background-image:linear-gradient(rgba(28,1,1,0.1),rgba(28,1,1,0.1)),url('../img/topbar-img-desktop.jpg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.header .header-container {
  margin-top:40px!important;
}
@media only screen and (max-width: 677px) {
  .header .header-container {
    margin-top:28px!important;
  }
  .header .topbar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 28px;
    background-image:linear-gradient(rgba(28,1,1,0.1),rgba(28,1,1,0.1)),url('../img/topbar-img-mobile.jpg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
  }
}
.header .logo {
  line-height: 1;
}

.header .logo img {
  max-height: 70px;
  margin-left: 10px;
}

.header .logo h1 {
  font-size: 24px;
  margin: 0;
  font-weight: 600;
  color: var(--heading-color);
}

.header .logo span {
  color: var(--accent-color);
  font-size: 24px;
  font-weight: 600;
  padding-left: 3px;
}

.header .btn-getstarted,
.header .btn-getstarted:focus {
  color: #1c0101;
  background: #82bbf0;
  background-image:var(--bs-gradient)!important;
  font-weight: 700;
  font-size:16px!important;
  margin: 0 15px 0 0;
  padding: 10px 16px;
  border-radius: 15px;
  transition: 0.3s;
}

.header .btn-getstarted:hover,
.header .btn-getstarted:focus:hover {
  background: #fff;
}

@media only screen and (max-width: 1399px) {
  .header .logo img {
    max-height:60px!important;
    margin-left:6px!important;
  }
  .header .logo {
    order: 1;
  }

  .header .btn-getstarted,
  .header .btn-getstarted:focus {
    order: 2;
    font-size:13px!important;
    padding: 9px 14px!important;
  }

  .header .navmenu {
    order: 3;
  }
}

.scrolled .header {
  box-shadow: 0 0 30px 10px rgba(0, 0, 0, 0.1);
}

.scrolled .header::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

/* Index Page Header
------------------------------*/
.index-page .header {
  --background-color: rgba(255, 255, 255, 0);
  --heading-color: #ffffff;
  --nav-color: rgba(255, 255, 255, 0.65);
  --nav-hover-color: #ffffff;
}

/* Index Page Header on Scroll
------------------------------*/
.index-page.scrolled .header {
  --background-color: rgba(28, 1, 1, 0.65);
  --heading-color: #000;
  --nav-color: rgba(255,255,255,0.5);
  --nav-hover-color: #e84545;
  /* backdrop-filter: blur(6px)!important;
  -webkit-backdrop-filter: blur(6px)!important */
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Navmenu - Desktop */
@media only screen and (min-width: 1400px) {
  .navmenu {
    padding: 0;
  }

  .navmenu ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
  }

  .navmenu li {
    position: relative;
  }

  .navmenu a,
  .navmenu a:focus,
  .navmenu a i,
  .navmenu a:focus i {
    color: var(--nav-color);
    padding: 18px 15px;
    font-size: 24px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    white-space: nowrap;
    margin-right:.5rem!important;
    transition: 0.3s;
  }

  .navmenu li:last-child a {
    padding-right: 0;
  }

  .navmenu li:hover>a,
  .navmenu a:hover>i,
  .navmenu .active,
  .navmenu .active>i,
  .navmenu .active:focus,
  .navmenu .active:focus>i {
    color:#fff;
  }

  .navmenu .dropdown ul {
    margin: 0;
    padding: 10px 0;
    background: var(--nav-dropdown-background-color);
    display: block;
    position: absolute;
    visibility: hidden;
    left: 14px;
    top: 130%;
    opacity: 0;
    transition: 0.3s;
    border-radius: 4px;
    z-index: 99;
    box-shadow: 0px 0px 30px color-mix(in srgb, var(--default-color), transparent 85%);
  }

  .navmenu .dropdown ul li {
    min-width: 200px;
  }

  .navmenu .dropdown ul a {
    padding: 10px 20px;
    font-size: 15px;
    text-transform: none;
    color: var(--nav-dropdown-color);
  }

  .navmenu .dropdown ul a i {
    font-size: 12px;
  }

  .navmenu .dropdown ul a:hover,
  .navmenu .dropdown ul .active:hover,
  .navmenu .dropdown ul li:hover>a {
    color: var(--nav-dropdown-hover-color);
  }

  .navmenu .dropdown:hover>ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }

  .navmenu .dropdown .dropdown ul {
    top: 0;
    left: -90%;
    visibility: hidden;
  }

  .navmenu .dropdown .dropdown:hover>ul {
    opacity: 1;
    top: 0;
    left: -100%;
    visibility: visible;
  }
  .navmenu ul li div {
    display: none;
  }

  .mobile-nav-toggle {
    display:none!important;
  }
}

/* Navmenu - Mobile */
@media only screen and (max-width: 1399px) {
  .mobile-nav-toggle {
    color: #fff;
    font-size: 32px;
    line-height: 0;
    margin-right: 2px;
    cursor: pointer;
  }

  .navmenu {
    padding: 0;
    z-index: 9997;
  }

  .navmenu ul {
    display: none;
    position: absolute;
    list-style: none;
    /* inset: 60px 20px 20px 20px;
    padding: 10px 0; */
    inset: 0;
    padding: 0;
    margin: 0;
    border-radius: none;
    /* background:linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url('../img/welcome-bg.jpg'); */
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    background-color:rgba(28,1,1,0.15);
    background-size: cover;
    overflow-y: auto;
    transition: 0.3s;
    z-index: 9998;
    box-shadow: 0px 0px 30px color-mix(in srgb, var(--default-color), transparent 90%);
    border: none;
  }
  .navmenu ul li div {
    display: block;
  }
  .navmenu ul li div img {
    max-width: 260px;
  }

  .navmenu a,
  .navmenu a:focus {
    color: rgba(255,255,255,0.4);
    padding: 12px 20px;
    font-size: 30px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: left;
    white-space: nowrap;
    -webkit-transition-property: none;
    -moz-transition-property: none;
    -o-transition-property: none;
    transition-property: none;
  }

  .navmenu a i,
  .navmenu a:focus i {
    font-size: 18px;
    line-height: 0;
    margin-left: 5px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0;
    margin-right:1.25rem!important;
    -webkit-transition-property: none;
    -moz-transition-property: none;
    -o-transition-property: none;
    transition-property: none;

    pointer-events:none!important;
  }

  .navmenu a i:hover,
  .navmenu a:focus i:hover {
    background-color: var(--accent-color);
  }

  .navmenu a:hover,
  .navmenu .active,
  .navmenu .active:focus {
    color: #82bbf0;
    text-decoration:underline!important;
    text-underline-offset:6px!important;
  }

  .navmenu .active i,
  .navmenu .active:focus i {
    background-color: #82bbf0;
    border-radius: 50%!important;
    color: #1c0101;
  }

  .mobile-nav-active {
    overflow: hidden;
  }

  .mobile-nav-active .mobile-nav-toggle {
    color: #fff;
    position: absolute;
    font-size: 32px;
    top: 22px;
    right: 20px;
    margin-right: 0;
    z-index: 9999;
  }

  .mobile-nav-active .navmenu {
    position: fixed;
    overflow: hidden;
    inset: 0;
    background: rgba(33, 37, 41, 0.9);
    transition: 0.3s;
  }

  .mobile-nav-active .navmenu>ul {
    display: block;
  }

  /* .language-switcher {
    margin-right: 12px;
  } */
}

/*--------------------------------------------------------------
# Global Footer
--------------------------------------------------------------*/
.footer {
  color: var(--default-color);
  background-color: #fff;
  font-size: 14px;
  padding-bottom: 84px;
  position: relative;
}
@media only screen and (min-width: 576px) {
  .footer .footer-top {
    padding-top: 50px;
    padding-bottom: 40px;
    padding-left: 16px;
    padding-right: 16px;
    background-size: cover;
    border-radius: 0;
  }
}
@media only screen and (max-width: 991px) {
  .footer .footer-top {
    background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)), url(../img/footer-bg-v2-mobile.jpg) no-repeat center center;
  }
}
@media only screen and (min-width: 992px) {
  .footer .footer-top {
    padding-top: 50px;
    padding-bottom: 40px;
    padding-left: 30px;
    padding-right: 30px;
    background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)), url(../img/footer-bg-v2.jpg) no-repeat center center;
    background-size: cover;
  }
}

.footer .footer-about .logo {
  margin-bottom: 25px;
}

.footer .footer-about .logo img {
  max-height: 104px;
  margin-right: 6px;
}

.footer .footer-about .logo span {
  color: var(--heading-color);
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 1px;
}

.footer .footer-about p {
  font-size: 14px;
  color: #fff;
}

.footer .social-links a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--accent-color), transparent 50%);
  font-size: 16px;
  color: rgba(255,255,255,0.9);
  margin-right: 10px;
  transition: 0.3s;
}

.footer .social-links a:hover {
  color: var(--accent-color);
  border-color: var(--accent-color);
}

.footer .social-links span {
  font-size: 12px!important;
}

.footer h4 {
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding-bottom: 12px;
  color: var(--accent-color);
}

.footer .footer-links {
  margin-bottom: 30px;
}

.footer .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer .footer-links ul i {
  padding-right: 2px;
  font-size: 12px;
  line-height: 0;
}

.footer .footer-links ul li {
  padding: 10px 0;
  display: flex;
  align-items: center;
}

.footer .footer-links ul li:first-child {
  padding-top: 0;
}

.footer .footer-links ul a {
  color: rgba(255,255,255,0.85);
  display: inline-block;
  line-height: 1;
}

.footer .footer-links ul a:hover {
  color: var(--accent-color);
}

.footer .footer-contact p {
  margin-bottom: 5px;
}

.footer .footer-contact p a {
  color: #fff!important;
}

.footer .copyright {
  padding-top: 25px;
  padding-bottom: 25px;
  background: color-mix(in srgb, #1c0101, transparent 94%);
}
@media only screen and (min-width: 992px) {
  .footer .copyright {
    padding-top: 25px;
    padding-bottom: 25px;
    background: color-mix(in srgb, #1c0101, transparent 94%);
    border-radius: 0;
  }
}

.footer .copyright p {
  margin-bottom: 0;
}

.footer .copyright span {
  color: #1c0101!important;
}

/*--------------------------------------------------------------
# Scroll Top Button
--------------------------------------------------------------*/
.wroc-do-gory {
  z-index: 996;
  position: fixed;
  right: 30px;
  bottom: 30px;
  border-radius: 15px;
  border: none;
  width: 75px;
  height: 75px;
  outline: none;
  background: none;
  background-image:url('../img/pizza-slice.png');
  background-size: cover;
  opacity:0;
  transition: opacity 0.3s;
}

.is_showing {
  display: block;
  opacity:1;
}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/*--------------------------------------------------------------
# Global Page Titles & Breadcrumbs
--------------------------------------------------------------*/
.page-title {
  color: var(--default-color);
  background-color: var(--background-color);
  position: relative;
}

.page-title .heading {
  padding: 80px 0;
  border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
}

.page-title .heading h1 {
  font-size: 38px;
  font-weight: 700;
}

.page-title nav {
  background-color: color-mix(in srgb, var(--default-color), transparent 95%);
  padding: 20px 0;
}

.page-title nav ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.page-title nav ol li+li {
  padding-left: 10px;
}

.page-title nav ol li+li::before {
  content: "/";
  display: inline-block;
  padding-right: 10px;
  color: color-mix(in srgb, var(--default-color), transparent 70%);
}

/*--------------------------------------------------------------
# Global Sections
--------------------------------------------------------------*/
section,
.section {
  color: var(--default-color);
  background-color: var(--background-color);
  padding: 60px 0;
  scroll-margin-top: 98px;
  overflow: clip;
}

@media only screen and (max-width: 1399px) {
  section,
  .section {
    scroll-margin-top: 64px;
  }
}

/*--------------------------------------------------------------
# Global Section Titles
--------------------------------------------------------------*/
.section-title {
  text-align: center;
  padding-bottom: 60px;
  position: relative;
}

.section-title h2 {
  font-size: 32px;
  font-weight: 700;
  position: relative;
  color:#82bbf0!important;
}


/* .section-title h2:before,
.section-title h2:after {
  content: "";
  width: 50px;
  height: 2px;
  background: var(--accent-color);
  display: inline-block;
} */

.section-title h2:before {
  margin: 0 15px 10px 0;
}

.section-title h2:after {
  margin: 0 0 10px 15px;
}

.section-title p {
  margin-bottom: 0;
  line-height: 1.35!important;
  font-weight: 500!important;
  color:#1c0101!important;
}

/*--------------------------------------------------------------
# Fullscreen Hero Section
--------------------------------------------------------------*/
.sekcja-startowa {
  height: 100svh;
  background-color:#1c0101;
  /* background: url("../img/hero-bg.jpg") no-repeat 100% 65%;
  background-size: cover; */
}

/* @media (min-width: 569px) {
  .sekcja-startowa:before {
    height: 100vh;
    content: "";
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    position: absolute;
    inset: 0;
  }
} */

@media only screen and (max-width: 568px) {
  .sekcja-startowa {
    /* background: linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.25)), url('../img/mobile-bg.jpg') no-repeat center center; */
    background-color: #1c0101;
    background-size: cover;
  }
}

@media only screen and (min-width: 1280px) {
  .sekcja-startowa .container p {
    text-align: justify;
  }
  .cta .content h3 {
    text-align: justify;
  }
  .features .tab-pane h4 {
    text-align: justify;
  }
}

.sekcja-startowa-button {
  display: block;
  min-width: 100%;
  width: 100%;
  /* background: rgba(255,255,255,0.8);
  background-image:var(--bs-gradient)!important; */
  background: #fff;
  border: none;
  outline: none;
  border-top-left-radius: 40%!important;
  border-top-right-radius: 40%!important;
  /* border-radius: 5px;
  min-width: 140px; */
}
.sekcja-startowa-button i {
  /* font-size: 24px!important; */
  /* font-size: 1.7em; */
  font-size: 1.5em!important;
  vertical-align: middle!important;
  color: #1c0101;
}

/*--------------------------------------------------------------
# Features Section
--------------------------------------------------------------*/
.features .features-item {
  color: color-mix(in srgb, var(--default-color), transparent 20%);
}

.features .features-item+.features-item {
  margin-top: 100px;
}

@media only screen and (max-width: 768px) {
  .features .features-item+.features-item {
    margin-top: 40px;
  }
}

.features .features-item h3 {
  font-weight: 700;
  color:#000!important;
}

.features .features-item .btn-get-started {
  background-color: var(--accent-color);
  color: var(--contrast-color);
  padding: 8px 30px 10px 30px;
  border-radius: 4px;
}

.features .features-item .btn-get-started:hover {
  background-color: color-mix(in srgb, var(--accent-color), transparent 10%);
}

.features .features-item ul {
  list-style: none;
  padding: 0;
}

.features .features-item ul li {
  padding-bottom: 10px;
  display: flex;
  align-items: flex-start;
}

.features .features-item ul li:last-child {
  padding-bottom: 0;
}

.features .features-item i {
  font-size:38px!important;
  color:darkgreen!important;
}

.features .features-item h4 {
  font-size:16px!important;
  color:#000!important;
}

.features .features-item img {
  border: none;
  box-shadow: 0 15px 30px -10px color-mix(in srgb, var(--default-color), transparent 75%);
}

.features .features-item .features-img-bg {
  position: relative;
  min-height: 500px;
}

@media only screen and (max-width: 640px) {
  .features .features-item .features-img-bg {
    min-height: 300px;
  }
}

.features .features-item .features-img-bg img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*--------------------------------------------------------------
# Services Section
--------------------------------------------------------------*/
.services {
  --background-color: #f4f4f4;
}

.services .service-item {
  box-shadow: 0px 5px 90px 0px color-mix(in srgb, var(--default-color), transparent 90%);
  padding: 50px 30px;
  transition: all ease-in-out 0.4s;
  background-color: var(--contrast-color);
  height: 100%;
}

.services .service-item .icon {
  margin-bottom: 10px;
}

.services .service-item .icon i {
  color: #1c0101;
  font-size: 36px;
  transition: 0.3s;
}

.services .service-item h3 {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 20px;
  color: #1c0101;
  transition: ease-in-out 0.3s;
}

.services .service-item p {
  line-height: 24px;
  font-size: 14px;
  margin-bottom: 0;
  color:#000!important
}

/*--------------------------------------------------------------
# Call To Action Section
--------------------------------------------------------------*/
.call-to-action {
  --background-color: #000000;
  --default-color: #ffffff;
  --contrast-color: #F5F5DC;
  padding: 60px 0;
  position: relative;
  clip-path: inset(0);
}

.call-to-action img {
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.call-to-action:before {
  content: "";
  background: color-mix(in srgb, var(--background-color), transparent 30%);
  position: absolute;
  inset: 0;
  z-index: 2;
}

.call-to-action .container {
  position: relative;
  z-index: 3;
}

.call-to-action h3 {
  font-size: 28px;
  font-weight: 700;
  color: var(--default-color);
}

.call-to-action p {
  color: var(--default-color);
}

.call-to-action .cta-btn {
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 30px;
  border-radius: 15px;
  transition: 0.5s;
  margin: 10px;
  color: #1c0101;
  background: #82bbf0;
  background-image:var(--bs-gradient)!important;
}

.call-to-action .cta-btn:hover {
  background: #fff;
}

.call-to-action .cta-btn-container a i {
  font-size: 28px!important;
}

/*--------------------------------------------------------------
# Contact Section
--------------------------------------------------------------*/
.contact .info-item {
  background: color-mix(in srgb, #1c0101, transparent 94%);
  padding: 30px;
  border-radius: 15px!important;
}

.contact .info-item i {
  font-size: 38px;
  line-height: 0;
  color: #82bbf0;
}

.contact .info-item h3 {
  font-size: 20px;
  font-weight: 700;
  margin: 20px 0 10px 0;
  color:#82bbf0!important
}

.contact .info-item p {
  padding: 0;
  line-height: 24px;
  font-size: 14px;
  margin-bottom: 0;
  color:#1c0101!important;
}

.contact .info-item p a {
  color:#1c0101!important;
  font-weight: 500!important
}

.contact .map iframe {
  border:0px!important;
  border-radius: 15px!important;
  width: 100%;
  height: 430px;
}

hr.custom {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

.home-motto-container{
    position: absolute;
    bottom: -50px;
}
.home-motto{
    width: 100%;
    color: #ffffff;
    background: none;
    /* background: transparent linear-gradient(0deg, #2B2B2B00 0%, #FFFFFF 0%, #F9F9F9F3 0%, #71717100 76%, #80808000 100%) 0% 0% no-repeat;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px); */
    padding-top: 40px;
    padding-bottom: 40px;
}

.sekcja-startowa .play-button {
  height:90px;
  position:absolute;
  top: calc(50% - 45px);
  right:0;
  border-radius:0!important;
  z-index: 1;
  padding:0 0 0 2px!important;
}

.home-motto .landing-page-img {
  max-height:130px;
  width:auto;
}
.home-motto .bigger{
    font-size: 68px;    /* 48px */
    font-weight: 700;
    line-height: 1.1!important;
    color: #fff;
}
.home-motto .smaller{
    font-size: 18px;     /* 30px */
    font-weight: 600;
    color: rgba(211,211,211,1);
    line-height: 1.55!important
}
.home-motto .button{
    border-radius: 14px;     /* 25px */
    font-size: 20px;     /* 28px */
    border: 0;
    background-color: var(--purpleColor);
    color: #ffffff;
}
/* CONTINUE*/

.home-motto .bigger{
    font-size: 68px;    /* 48px */
    line-height: 1.1!important;
}

.home-motto .smaller{
    font-size: 18px;     /* 30px */
}

.home-motto .button{
    border-radius: 25px;     /* 25px */
    font-size: 28px;     /* 28px */
}
/* MOBILE PHONES */
@media only screen and (max-width: 767px) {
    .home-motto-container{
      position: absolute;
      bottom: -50px;
    }
    .home-motto{
        width: 100%;
        padding-top: 18px;
        padding-bottom: 18px;
    }
    .home-motto .landing-page-img {
      max-height:80px;
      width:auto;
    }
    .home-motto .bigger{
        font-size:34px;
        color: #fff;
        font-weight:700!important;
        /* line-height: 1.2!important; */
        /* line-height: 1.55!important; */
        line-height: 1.35!important;
    }
    .home-motto .smaller{
        font-size: 18px;
        color: rgba(211,211,211,1);
    }

    .landing-about-container {
      border-radius: 15px!important;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1399px) {
    .home-motto-container{
      position: absolute!important;
      bottom: -50px!important;
    }
    .home-motto{
        width: 100%!important;
    }
    .home-motto .landing-page-img {
      max-height:110px;
      width:auto;
    }
}

.nobr { white-space:nowrap!important; }

.background-triangles{
    background: transparent url('../img/background-triangles.webp') 0% 0% repeat padding-box;
}

hr.custom-section-divider {
    border: 0!important;
    height: 1px!important;
    background: #000!important;
    background-image: linear-gradient(to right, #ccc, #000, #ccc)!important
}


.video-container {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100svh;
  overflow: hidden;
}
.video-container video {
  /* Make video to at least 100% wide and tall */
  min-width: 100%;
  min-height: 100%;
  /* Setting width & height to auto prevents the browser from stretching or squishing the video */
  width: auto;
  height: auto;
  /* Center the video */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}


.topbar-image-desktop {
  display:block;
}
.topbar-image-mobile {
  display:none;
}
@media only screen and (max-width: 678px) {
  .topbar-image-desktop {
    display:none;
  }
  .topbar-image-mobile {
    display:block;
  }
}

.background-pizzas{
    background: linear-gradient(rgba(245,245,220,0.9),rgba(245,245,220,0.9)),url('../img/pizzas-contact-bg.jpg') 0% 0% repeat padding-box;
}

.background-pizzas-landing-page-button{
    background: linear-gradient(rgba(245,245,220,0.8),rgba(245,245,220,0.8)),url('../img/welcome-button-bg.jpg') center center no-repeat padding-box;
    background-size: cover!important;
}

/*--------------------------------------------------------------
# Menu Section
--------------------------------------------------------------*/
.menu {
  background-color: color-mix(in srgb, var(--background-color) 90%, white 5%);
}

.menu .menu-filters {
  padding: 20px 0 10px 0!important;
  margin: 0 auto;
  list-style: none;
  text-align: center;
  border-radius: 15px;
  border: none;
  user-select: none!important;
}

.menu .menu-filters li {
  color: #1c0101;
  margin-bottom: 8px;
  cursor: pointer;
  display: inline-block;
  padding: 8px 12px 10px 12px;
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
  transition: none;
  border-radius: 15px;
}

.menu .menu-filters li:hover,
.menu .menu-filters li.filter-active {
  color: #fff;
  background: linear-gradient(rgba(28, 1, 1, 1), rgba(130, 187, 240, 1));
}

.menu .menu-filters li:last-child {
  margin-right: 0;
}

.menu .menu-item {
  margin-top: 50px;
  position: relative;
}

.menu .menu-img {
  width: 80px;
  border-radius: 50%;
  float: left;
  border: 8px solid color-mix(in srgb, var(--default-color), transparent 90%);
}

.menu .menu-content {
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  position: relative;
  align-items: flex-start;
}

.menu .menu-content::after {
  content: "......................................................................" "...................................................................." "....................................................................";
  position: absolute;
  left: 20px;
  right: 0;
  top: -4px;
  z-index: 1;
  color: color-mix(in srgb, var(--default-color), transparent 60%);
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

/* Domyślny styl dla WSZYSTKICH linków (krótkich) */
.menu .menu-content a {
  color: #82bbf0;
  background: var(--background-color);
  padding-right: 10px;
  position: relative;
  z-index: 3;
  font-weight: 700;
  transition: 0.3s;
  margin-right: 15px;
}

.menu .menu-content > span {
  background: var(--background-color);
  color: #82bbf0;
  position: relative;
  z-index: 3;
  padding: 0 10px;
  font-weight: 600;
  white-space: nowrap;
}

.menu .menu-ingredients {
  font-style: italic;
  font-size: 14px;
  color: #1c0101;
}

/* =================================================================== */
/* === STYLE TYLKO DLA ROZWIJANYCH ELEMENTÓW (.is-collapsible) === */
/* =================================================================== */

.menu .menu-item.is-collapsible .menu-content a {
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  flex: 1;
  background: var(--background-color);
  padding-right: 8px;
}

.menu .menu-item.is-collapsible .menu-title-text,
.menu .menu-item.is-collapsible .expand-text,
.menu .menu-item.is-collapsible .expand-icon-wrapper {
  background: transparent;
}

.menu .menu-item.is-collapsible .menu-title-text {
  flex-grow: 1;
  display: inline-block;
}

.menu .menu-item.is-collapsible .collapsible-part {
  display: none;
}

.menu .menu-item.is-collapsible .expand-text {
  font-size: 12px;
  font-style: italic;
  color: #999;
  white-space: nowrap;
  padding: 2px 0;
  margin-left: 10px;
}

.menu .menu-item.is-collapsible .expand-icon-wrapper {
  padding: 2px;
  margin-left: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.menu .menu-item.is-collapsible .expand-icon {
  font-style: normal;
  font-weight: bold;
  color: #cda45e;
  transition: transform 0.4s ease;
  font-size: 20px;
  line-height: 1;
  display: block;
}

/* --- Stan po rozwinięciu --- */

.menu .menu-item.is-collapsible.expanded .collapsible-part {
  display: inline;
}

.menu .menu-item.is-collapsible.expanded .expand-icon {
  transform: rotate(45deg);
}

.menu .menu-item.is-collapsible.expanded .expand-text {
  display: none;
}


/* --- Pozostałe style --- */
.language-switcher-container {
  user-select:none!important;
}
.language-switcher {
  padding: 4px;
  border: 1px solid #1c0101;
  display: inline-block;
  font-weight: bold;
  border-radius: 15px;
  background-color: #fff;
  margin-right: 6px;
}

.language-switcher span {
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  margin: 0;
  background-color: #ffffff;
  color: #1c0101;
  border-radius: 15px;
}

.language-switcher .active {
  background: linear-gradient(rgba(28, 1, 1, 1), rgba(130, 187, 240, 1));
  color: #fff;
}

.language-switcher .language-pl.active {
  padding-left: 10px;
}

.language-switcher .language-en.active {
  padding-right: 10px;
}

@media only screen and (max-width: 1399px) {
  .language-switcher {
    padding: 4px;
    border: 1px solid #1c0101;
    display: inline-block;
    /* font-family: sans-serif; */
    font-weight: bold;
    border-radius: 15px;
    background-color: #fff;
    margin-right: 18px;
  }

  .language-switcher span {
    display: inline-block;
    padding-left: 6px;
    padding-right: 6px;
    margin: 0;
    background-color: #ffffff;
    color: #1c0101;
    border-radius: 15px;
  }
  .language-switcher .language-pl.active {
    padding-left: 6px;
  }

  .language-switcher .language-en.active {
    padding-right: 6px;
  }
}

.sticky-call {
	background-color: #fff;
	border-radius: 15px;
	bottom: 30px;
	box-shadow: 0 2px 6px 0 rgba(28, 1, 1, 0.4);
	color: #82bbf0!important;
	/* font-size: 1.375rem; */
  font-size: 1.75rem;
  left: 42px;
	height: 3.75rem;
  width: 3.75rem;
	position: fixed;
  opacity:0;
  transition: opacity 0.3s;
	z-index: 9999!important;
}
.sticky-call.active {
  display: block;
  opacity:1;
}

@media only screen and (min-width:1200px) {
	.sticky-call:hover {
		color:#1c0101!important;
	}
}

.sticky-call>i {
	-webkit-animation: phone-ringing 2.2s ease-in-out infinite!important;
	animation: phone-ringing 2.2s ease-in-out infinite!important;
	-webkit-animation-delay: 2s;
	animation-delay: 2s;
	transition: all .3s ease-out 0s;
}

@-webkit-keyframes phone-ringing {
	0% {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
		transform: rotate(0) scale(1) skew(1deg)
	}

	5% {
		-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
		transform: rotate(-25deg) scale(1) skew(1deg)
	}

	10% {
		-webkit-transform: rotate(25deg) scale(1) skew(1deg);
		transform: rotate(25deg) scale(1) skew(1deg)
	}

	15% {
		-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
		transform: rotate(-25deg) scale(1) skew(1deg)
	}

	20% {
		-webkit-transform: rotate(25deg) scale(1) skew(1deg);
		transform: rotate(25deg) scale(1) skew(1deg)
	}

	25% {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
		transform: rotate(0) scale(1) skew(1deg)
	}

	to {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
		transform: rotate(0) scale(1) skew(1deg)
	}
}

@keyframes phone-ringing {
	0% {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
		transform: rotate(0) scale(1) skew(1deg)
	}

	5% {
		-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
		transform: rotate(-25deg) scale(1) skew(1deg)
	}

	10% {
		-webkit-transform: rotate(25deg) scale(1) skew(1deg);
		transform: rotate(25deg) scale(1) skew(1deg)
	}

	15% {
		-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
		transform: rotate(-25deg) scale(1) skew(1deg)
	}

	20% {
		-webkit-transform: rotate(25deg) scale(1) skew(1deg);
		transform: rotate(25deg) scale(1) skew(1deg)
	}

	25% {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
		transform: rotate(0) scale(1) skew(1deg)
	}

	to {
		-webkit-transform: rotate(0) scale(1) skew(1deg);
		transform: rotate(0) scale(1) skew(1deg)
	}
}

.swal-customized {
  width:100%!important;
  height:auto!important;
  background-image:linear-gradient(rgba(255,255,255,0.9),rgba(255,255,255,0.9)),url('../img/welcome-bg.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.swal2-show {
  animation: swal2-show 0.5s!important;
}

.custom-close {
  color: #1c0101!important;
}

.swal2-dashed-icon-border {
  border:2px dashed #1c0101!important;
  padding:10px!important;
}

@media only screen and (max-width: 767px) {
  .swal2-popup {
    font-size: 0.85em!important;
  }
}
@media only screen and (min-width: 768px) {
  .swal2-popup {
    font-size: 1em!important;
  }
}

.swal2-container.swal2-backdrop-show { background: rgba(28,1,1,.4)!important; }

.symbols-section-divider {
  width: 100%;
  height: 62px;
  background-image:linear-gradient(rgba(28,1,1,0.1),rgba(28,1,1,0.1)),url('../img/topbar-img-desktop-v2.jpg');
  background-repeat: repeat-x;
}

.symbols-gallery-divider {
  width: 100%;
  height: 62px;
  background-image:linear-gradient(rgba(28,1,1,0.1),rgba(28,1,1,0.1)),url('../img/symbols-gallery-divider.jpg');
  background-repeat: repeat-x;
}

/*--------------------------------------------------------------
# Gallery Section
--------------------------------------------------------------*/
.gallery {
  overflow: hidden;
}

.gallery .swiper-wrapper {
  height: auto;
}

.gallery .swiper-pagination {
  margin-top: 22px;
  position: relative;
}

.gallery .swiper-pagination .swiper-pagination-bullet {
  background-color: color-mix(in srgb, #1c0101, transparent 70%);
  border: 0;
  width: 18px;
  height: 18px;
  opacity: 1;
}

.gallery .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #82bbf0;
  opacity: 1;
}

.gallery .swiper-slide-active {
  text-align: center;
}

@media (min-width: 992px) {
  .gallery .swiper-wrapper {
    padding: 40px 0;
  }

  .gallery .swiper-slide-active {
    background: #fff;
    border: 6px solid #82bbf0;
    z-index: 1;
    transform: scale(1.2);
    transition: none;
  }
}

#cc-main{
		--cc-font-family: 'Merienda', sans-serif;
    --cc-btn-primary-bg:#82bbf0;
    --cc-btn-primary-border-color:#82bbf0;
    --cc-btn-border-radius:33px;
    --cc-toggle-on-bg:#82bbf0
}
/* #cc-main,#cc-main .pm{
    --cc-modal-transition-duration:0!important
} */
#cc-main .cm{
    background:rgba(255,255,255,.7)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    backdrop-filter:blur(8px)!important;
    --cc-modal-transition-duration:0.7s!important
}
button[data-cc=show-preferencesModal]:focus,button[data-cc=show-preferencesModal]:hover{
    background-color:transparent!important;
    border-color:#f8f9fa!important;
    color:#fff!important;
    outline:0!important;
    box-shadow:none!important
}


/* =================================================================== */
/* === STYLE DLA INTELIGENTNEGO ROZWIJANIA POZYCJI W MENU (FINAL) ==== */
/* =================================================================== */

/* Styl dla kontenera linku, gdy staje się on interaktywnym przyciskiem */
.menu .menu-item.is-collapsible .menu-content a {
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  flex: 1;
  background: var(--background-color);
  padding-right: 8px;
}

/* Główne elementy wewnątrz linku nie mają własnego tła */
.menu .menu-item.is-collapsible .menu-title-text,
.menu .menu-item.is-collapsible .expand-text,
.menu .menu-item.is-collapsible .expand-icon-wrapper {
  background: transparent;
}

/* Kontener na tekst nazwy dania - rośnie, by zająć dostępną przestrzeń */
.menu .menu-item.is-collapsible .menu-title-text {
  flex-grow: 1;
  display: inline; /* Zmienione na inline, by tekst się płynnie układał */
}

/* Widok skrócony (z wielokropkiem) - domyślnie widoczny */
.menu .menu-item.is-collapsible .truncated-view {
  display: inline;
}

/* Widok pełny - domyślnie ukryty */
.menu .menu-item.is-collapsible .full-view {
  display: none;
}

/* Tekst "rozwiń pozycję" */
.menu .menu-item.is-collapsible .expand-text {
  font-size: 12px;
  font-style: italic;
  color: #888;
  white-space: nowrap;
  padding: 2px 0;
  margin-left: 10px;
  transition: opacity 0.3s ease;
}

/* Wrapper na ikonę "+" */
.menu .menu-item.is-collapsible .expand-icon-wrapper {
  padding: 2px;
  margin-left: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Ikona "+" */
.menu .menu-item.is-collapsible .expand-icon {
  font-style: normal;
  font-weight: bold;
  color: #82bbf0;
  transition: transform 0.4s ease;
  font-size: 20px;
  line-height: 1;
  display: block;
}

/* =================================================================== */
/* === OSTATECZNA POPRAWKA DLA MENU - WERSJA FINALNA              ==== */
/* =================================================================== */

.menu .menu-content a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.menu .menu-item.is-collapsible .menu-content a {
  text-overflow: clip;
}

.menu .menu-item.is-collapsible .menu-title-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.menu .menu-item.is-collapsible .expand-control {
  flex-shrink: 0;
  padding-left: 10px;
  font-size: 12px;
  font-style: italic;
  color: #888;
  cursor: pointer;
}

.menu .menu-item.is-collapsible .expand-control .expand-icon {
  font-style: normal;
  font-weight: bold;
  color: #82bbf0;
  transition: transform 0.4s ease;
  font-size: 16px;
  display: inline-block;
  vertical-align: middle;
}

.menu .menu-item.is-collapsible.expanded .menu-content a,
.menu .menu-item.is-collapsible.expanded .menu-title-text {
  white-space: normal;
  overflow: visible;
}

.menu-item.is-collapsible.expanded .expand-icon {
  transform: rotate(45deg);
}

/* === DODANA REGUŁA === */
.menu .menu-item.is-collapsible {
  cursor: pointer;
}
