h1 {
  font-size: clamp(2.5rem, 5vw, 5.75rem);
}

.bnr-container {
  overflow: hidden;
}

.bnr-cards-container .bnr-card {
  align-items: flex-start;
  gap: 1.25rem;
}

.bnr-image img {
  transform: none;
  height: auto;
  aspect-ratio: 191 / 73;
}

#main-title-slider .splide__slide {
  transition: all 500ms ease;
  display: flex;
  justify-content: center;
  align-items: center;
}

#main-title-slider .splide__slide.is-prev {
  opacity: 0;
}

/* Why PlanoHero section */

.why-planohero-section {
  margin-bottom: 260px;
}

.why-planohero-section .section-text {
  text-align: left;
  margin-bottom: 2.5rem;
}

.slider-nav .splide__list {
  justify-content: space-between;
}

.slider-with-navigation .splide__slide:first-child .slider-image {
  display: flex;
  justify-content: center;
}

.slider-with-navigation .splide__slide:first-child .slider-image img {
  width: 300px;
}

.slider-with-navigation .splide__slide:last-child .slider-image img {
  position: absolute;
  bottom: 0;
  width: 28vw;
  max-width: 470px;
}

/* Common problems */

.slider-page-indicator {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  margin-top: 1.75rem;
}

.slider-page-indicator .line {
  height: 1px;
  background-color: var(--primary-color-0);
  width: 20px;
  transition: width 300ms ease;
  margin-bottom: 4px;
}

/* PlanoHero demo */

.ph-demo-section .inner {
  background: linear-gradient(
    111.57deg,
    rgba(0, 0, 0, 0.8) 9.89%,
    rgba(255, 132, 63, 0.7) 82.8%
  );

  border-radius: 10px;
  padding: 4.375rem 3.375rem;

  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4vw;
}

.ph-demo-section .section-content {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ph-demo-section .section-content h2 {
  margin-bottom: var(--font-size-lg-1);
}

.ph-demo-section .section-content .primary-btn {
  margin-top: 2.5rem;
}

.ph-demo-section .section-content .demo-notes {
  margin-top: 3rem;
  gap: 2.5rem;
  font-size: 0.875rem;
}

.ph-demo-section .section-content .description {
  font-size: var(--font-size-sm-1);
  color: var(--grayscale-color-3);
}

.ph-demo-section .section-image {
  flex-grow: 1;
  width: 50%;
}

.ph-demo-section .section-image img {
  width: 100%;
  aspect-ratio: 1.34; /* For layout shift optimization */
}

/* How it works */

.how-it-works-video-section {
  position: relative;
}

.how-it-works-video-section .inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8vw;
}

.how-it-works-video-section .inner > * {
  width: 50%;
}

.how-it-works-video-section .section-content {
  flex-grow: 1;
}

.how-it-works-video-section .section-text {
  text-align: left;
  flex-shrink: 1;
}

.how-it-works-video-section h2 {
  margin-bottom: 1.25rem;
}

.how-it-works-video-section .first-gradient {
  right: 0;
  bottom: -25%;
  left: unset;
  width: 45vw;
}

/* Powered-by-ai */

.powered-by-ai {
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
  max-width: fit-content;
  margin: 0 auto;
  margin-bottom: 1rem;
  border-radius: 100px;
  padding: 0.625rem 0.875rem;
  position: relative;
}

.powered-by-ai::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 100px;
  background: linear-gradient(
    155.41deg,
    #957a6a 2%,
    rgba(255, 110, 26, 0.45) 50.36%,
    #ffe9dc 101.1%
  );
  z-index: -1;
  padding: 2px;
  -webkit-mask: linear-gradient(white 0 0) content-box,
    linear-gradient(white 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.powered-by-ai img {
  width: 20px;
  height: 20px;
}

.powered-by-ai span {
  font-size: 12px;
  color: var(--primary-color-0);
}

/* New Main page */

body {
  background-color: var(--border-orange-3);
}

/* Reused components */


/* Banner section */

.banner {
  padding-top: 12rem;
  padding-bottom: 7rem;
}

.banner .container {
  display: flex;
  gap: 2rem;
  position: relative;
}

.banner-main-text {
  width: 100%;
  max-width: 788px;
  border-radius: 50px;
  padding: 3.875rem 3.75rem;
  background: var(--grayscale-color-1);
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border-orange-1);
}

.banner-main-text-span {
  display: block;
  color: var(--typography-gray);
  font-weight: 500;
  text-transform: uppercase;
  font-size: clamp(0.75rem, 0.659rem + 0.3883vw, 1.125rem);
  margin-bottom: 2rem;
}

.banner-title {
  font-weight: 400;
  font-size: clamp(2.25rem, 1.5825rem + 2.8479vw, 5rem);
  margin-bottom: 1.125rem;
  color: var(--typography-black-1);
  line-height: 100%;
}

.banner-title:lang(en) {
  margin-bottom: 0.75rem;
}

.banner-description {
  font-size: clamp(1rem, 0.9697rem + 0.1294vw, 1.125rem);
  margin-bottom: 2.625rem;
  color: var(--typography-black-2);
  max-width: 490px;
}

.banner-title span {
  font-style: italic;
}

.mobile-title {
  display: none;
}

.buttons-container {
  display: flex;
  align-items: center;
  margin-top: auto;
  gap: 1.312rem;
  z-index: 5;
  width: fit-content;
}

.video-container {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
}

.banner .bnr-video {
  width: 100%;
  object-fit: cover;
  object-position: center center;
  height: calc(100vh + 90px);
}

.bnr-video-preview img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center center;
  border-radius: 50px;
}

.video-container::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: #000000;
  backdrop-filter: blur(5px);
  position: absolute;
  opacity: 0.8;
  top: 0;
  left: 0;
}

.video-container::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 27%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
  backdrop-filter: blur(3px);
}

.bnr-video-btn {
  width: 100%;
  max-width: 788px;
  padding: 0;
  border-radius: 50px;
  position: relative;
}

.bnr-video-play {
  position: absolute;
  bottom: 30px;
  left: 43px;
  z-index: 2;
  width: 4.5rem;
  height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #9E9E9E99;
  border-radius: 50%;
}

.bnr-video-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
  border-radius: 50px;
}

.btn:focus,
.btn:focus:not(:focus-visible) {
  outline: none;
}

.bnr-video-btn:hover {
  color: var(--primary-orange);
}

.second-btn {
  background: var(--border-orange-4);
  color: var(--primary-orange);
}

.partner {
  position: absolute;
  bottom: 43px;
  right: 65px;
  z-index: 2;
  padding: 15px 17px;
  background: var(--grayscale-color-1);
  border-radius: 50px;
  font-size: clamp(0.75rem, 0.6893rem + 0.2589vw, 1rem);
  font-weight: 500;
  color: var(--grayscale-color-10);
  text-decoration: none;
  transition: all .3s ease;
  z-index: 10;
}

/* Wizora block section */

.wizora-block-section {
  padding-bottom: 6.125rem;
}

.wizora-block-section .container {
  display: flex;
  gap: 2rem;
}

.wizora-content-title {
  background: var(--grayscale-color-1);
  border-radius: 50px;
  border: 1px solid var(--border-orange-1);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.wizora-block-section .section-title {
  margin-bottom: 0.75rem;
}

.wizora-block-section .section-description {
  margin-bottom: 3rem;
}

.wizora-block-section .second-btn {
  width: fit-content;
  margin-right: auto;
  min-width: 200px;
}

.wizora-block-video-wrapper {
  position: relative;
  width: 100%;
}

.wizora-block-img {
  width: 100%;
  height: 100%;
  overflow: auto;
  border-radius: 50px;
}

.wizora-video-btn {
  position: absolute;
  bottom: 71px;
  left: 50%;
  transform: translate(-50%);
  border: 1px solid var(--border-orange-2);
  padding: 1.125rem;
  box-shadow: 7px 7px 39px 0px #0000001A;
  backdrop-filter: blur(0px);
  background: var(--grayscale-color-1);
  border-radius: 25px;
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
  max-width: 425px;
  justify-content: center;
  color: var(--typography-black-1);
  font-weight: 500;
  font-size: clamp(1rem, 0.9393rem + 0.2589vw, 1.25rem);
  transition: all .3s ease;
}

.wizora-video-btn:hover {
  background: var(--border-orange-1);
}

#wizora-video-modal .modal-dialog {
  max-width: 1300px;
}

#wizora-video-modal .modal-body {
  aspect-ratio: 561 / 315;
  padding: 0;
}

#wizora-video-modal .modal-content {
  overflow: hidden;
  border-radius: 1.25rem;
}

#wizora-video-modal .btn-close {
  padding-right: 1rem;
  background: transparent
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z' fill='white'/%3E%3C/svg%3E")
    center / 1em auto no-repeat;
  position: absolute;
  z-index: 2;
  right: 0.5rem;
  top: 0.7rem;
}

#wizora-video-modal .modal-header h3 {
  margin: 0;
  color: var(--grayscale-color-10);
}

#wizora-video-modal .modal-body > iframe {
  width: 100%;
  height: 100%;
}

#wizora-video-modal lite-youtube {
  height: calc(100% + 1px);
}

/* Webinar block section */

.webinar-block-section {
  padding-bottom: 6.125rem;
}

.webinar-block-section .container {
  display: flex;
  gap: 2rem;
}

.webinar-content-title {
  padding: 3.75rem 2rem;
  background: var(--grayscale-color-1);
  border-radius: 50px;
  border: 1px solid var(--border-orange-1);
  width: 100%;
  display: flex;
  flex-direction: column;
}

.webinar-content-title h2 {
  color: var(--typography-black-1);
  margin-bottom: 0.75rem;
  font-size: clamp(1.75rem, 1.3859rem + 1.5534vw, 3.25rem);
  font-weight: 400;
  max-width: 565px;
}

.webinar-content-title p {
  color: var(--typography-black-2);
  margin-bottom: 3rem;
  font-size: clamp(1rem, 0.909rem + 0.3883vw, 1.375rem);
  max-width: 625px;
}

.webinar-content-title span {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: clamp(0.75rem, 0.659rem + 0.3883vw, 1.125rem);
  color: var(--primary-orange);
  margin-bottom: 3rem;
  text-transform: uppercase;
}

.webinar-content-title .second-btn {
  max-width: 220px;
  margin-top: auto;
}

.webinar-content-date {
  display: flex;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.webinar-content-date p {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #4C4C4C;
  font-size: clamp(0.875rem, 0.8447rem + 0.1294vw, 1rem);
  margin-bottom: 0;
}

.webinar-content-title span img,
.webinar-content-date img {
  width: 100%;
  max-width: 18px;
}

.webinar-content-img {
  width: 100%;
  background: var(--grayscale-color-1);
  border-radius: 50px;
  border: 1px solid var(--border-orange-1);
  position: relative;
  overflow: hidden;
}

.webinar-content-speakers {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 2.5rem 1.5rem;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  background: var(--grayscale-color-1);
  width: 100%;
  border-radius: 0 0 50px 50px;
}

.webinar-content-speakers-item h3 {
  font-size: clamp(1.125rem, 1.0643rem + 0.2589vw, 1.375rem);  
  text-align: center;
  color: var(--typography-black-1);
}

.webinar-content-speakers-item p {
  font-size: clamp(0.875rem, 0.8143rem + 0.2589vw, 1.125rem);
  text-align: center;
  color: #4C4C4C;
}

.webinar-block-img {
  width: 100%;
  overflow: auto;
}

.webinar-block-img.mob {
  display: none;
}


/* Everything section */

.everything {
  background: var(--grayscale-color-1);
  padding: 6.125rem 0;
  border-radius: 3.125rem;
  border: 1px solid var(--border-orange-1);
  margin-bottom: 6.25rem;
  position: relative;
  z-index: 5;
}

.everything .container {
  display: flex;
}

.everything-title {
  font-weight: 400;
  font-size: clamp(1.375rem, 0.9806rem + 1.6828vw, 3rem);
  text-align: center;
  color: var(--typography-black-1);
  max-width: 1100px;
  margin: 0 auto;
}

.everything-title img {
  width: 100%;
  max-width: 133px;
  height: 44px;
}

.everything-title span {
  font-style: italic;
}

/* Retailers slider section */

.retailers-slider {
  padding-bottom: 6.125rem;
}

.retailers-slider .section-title {
  margin-bottom: 2rem;
  text-align: center;
  font-size: clamp(1.125rem, 1.034rem + 0.3883vw, 1.5rem);
}

.retailers-slider .splide__list {
  display: flex;
  align-items: center;
  gap: 5rem;
}

.retailers-slider .splide__slide {
  margin: 0 !important;
}

.retailers-slider .splide__slide img {
  width: 100%;
  max-width: 150px;
}

/* Merchandising platform section */

.merchandising-platform-section {
  background: var(--grayscale-color-1);
  padding: 6.25rem 0 9rem;
  border: 1px solid var(--border-orange-1);
  border-radius: 50px;
}

.merchandising-platform-section .section-text {
  margin-bottom: 3.75rem;
}

.merchandising-platform-section .splide__arrows.custom-arrows {
  left: 50%;
  transform: translate(-50%);
  bottom: -5rem;
}

.merchandising-platform-section .splide__slide img {
  border-radius: 25px;
  margin-bottom: 1.75rem;
  overflow: auto;
  width: 100%;
}

.merchandising-platform-section .splide__slide h3 {
  font-size: clamp(1.3125rem, 1.2063rem + 0.4531vw, 1.75rem);
  font-weight: 500;
  color: var(--typography-black-1);
  margin-bottom: 0.5rem;
}

.merchandising-platform-section .splide__slide p {
  font-size: 1rem;
  color: var(--typography-black-2);
  margin-bottom: 1.5rem;
}

.merchandising-platform-section .splide__slide a { 
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--primary-orange);
  transition: all 0.3s ease ;
  height: 100%;
}

.merchandising-platform-section .splide__slide svg {
  transform: rotate(45deg);
  fill: var(--primary-orange);
  transition: all 0.3s ease;
}

.merchandising-platform-section .splide__slide a:hover svg {
  transform: rotate(0deg);
}

.merchandising-platform-section .splide__slide .read-more {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: auto;
}

.section-description-en {
  display: none;
}
.section-description-en:lang(en) {
  display: block;
  margin-top: 1rem;
}

/* Retail technology section */

.retail-technology {
  padding: 10rem 0;
}

.retail-technology .section-title {
  text-align: center;
  margin-bottom: 3.75rem;
}

.retail-technology-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  width: 100%;
  max-width: 1350px;
  margin: 0 auto;
}

.retail-technology-column {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  width: 100%;
  max-width: 410px;
}

.retail-technology-card {
  background: var(--grayscale-color-1);
  border-radius: 25px;
  padding: 20px;
  height: 315px;
}

.retail-technology-card img {
  margin-bottom: 3.625rem;
}

.retail-technology-card h3 {
  font-size: clamp(1.3125rem, 1.267rem + 0.1942vw, 1.5rem);
  font-weight: 500;
  color: var(--typography-black-1);
  margin-bottom: 0.75rem;
}

.retail-technology-card p {
  font-size: 1rem;
  color: var(--typography-black-2);
}

.retail-technology-center img {
  overflow: auto;
  width: 100%;
  border-radius: 25px;
}

/* Retailer block */

.retailer {
  padding: 3.75rem 0;
  margin-bottom: 3.5rem;
}

.retailer-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.875rem;
}

.retailer-content img {
  width: 100%;
  max-width: 789px;
  overflow: auto;
}

.retailer-content-text {
  width: 100%;
  max-width: 789px;
}

.retailer-content-text p {
  font-size: clamp(0.875rem, 0.8143rem + 0.2589vw, 1.125rem);
  color: var(--primary-brown);
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}

.retailer-content-text .section-title {
  margin-bottom: 2rem;
}

/* Free trial section */

.free-trial {
  padding: 3.75rem 0;
  margin-bottom: 3.5rem;
}

.free-trial-content {
  display: flex;
  justify-content: space-between;
  gap: 1.875rem;
}

.free-trial-content-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  max-width: 789px;
  border: 1px solid var(--border-orange-1);
  padding: 2rem;
  border-radius: 3.125rem;
  background: var(--grayscale-color-1);
}

.free-trial-content .planogram-img {
  width: 100%;
  max-width: 789px;
  overflow: auto;
}

.free-trial-content-text-description {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}

.free-trial-date {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.free-trial-date img {
  width: 100%;
  max-width: 1.125rem;
}

.free-trial-date span {
  font-style: italic;
  font-size: clamp(0.875rem, 0.8447rem + 0.1294vw, 1rem);
  color: var(--typography-black-2);
}

.free-trial .section-title {
  max-width: 600px;
  margin-bottom: 0.75rem;
}

.free-trial-content-text p {
  font-size: clamp(1.125rem, 1.0947rem + 0.1294vw, 1.25rem);
  color: var(--typography-black-2);
  margin-bottom: 3rem;
  max-width: 642px;
}

/* Main Feedbacks section */

.main-clients-feedbacks {
  padding: 3.75rem 0;
  margin: 0;
  width: 100%;
  max-width: none;
  background: var(--grayscale-color-1);
  border: 1px solid var(--border-orange-1);
  border-radius: 50px;
  margin-bottom: 3.5rem;
}

.main-clients-feedbacks .section-txt {
  margin-bottom: 2.437rem;
}

.main-clients-feedbacks .section-txt h2 {
  margin-bottom: 0.75rem;
}

.main-clients-feedbacks .section-txt p {
  max-width: 879px;
}

.main-clients-feedbacks .feedbacks-carousel .splide__track {
  padding: 0 !important;
}

.splide__arrows.custom-arrows .splide__arrow {
  transition: all 0.1s ease;
  background: var(--grayscale-color-1);
}

.main-clients-feedbacks .feedback-card {
  background-color: var(--border-orange-3);
  border: 1px solid var(--border-orange-2);
}

.main-clients-feedbacks .feedback-card > div:first-child p {
  font-size: clamp(0.875rem, 0.8143rem + 0.2589vw, 1.125rem);
  color: var(--typography-black-2);
}

.main-clients-feedbacks .feedback-card .responder-info span {
  font-weight: 500;
  font-size: clamp(0.875rem, 0.8447rem + 0.1294vw, 1rem);
  color: var(--typography-black-1);
}

.main-clients-feedbacks .feedback-card .responder-info p {
  color: var(--descriptive-color-2);
  font-size: 0.75rem;
}

.main-clients-feedbacks .feedbacks-carousel .splide__pagination {
  display: none;
}

.main-clients-feedbacks .responder-info a {
  display: flex;
  align-items: center;
  font-size: clamp(0.875rem, 0.8447rem + 0.1294vw, 1rem);
  margin-bottom: 1rem;
  text-decoration: none;
  gap: 0.5rem;
  transition: all 0.3s ease;
}

.main-clients-feedbacks .responder-info svg {
  fill: var(--primary-orange);
  transition: all 0.3s ease;
}

.main-clients-feedbacks .responder-info a:hover svg {
  fill: var(--primary-color-1);
  transform: rotate(-45deg);
}

/* Merchandising-hero section */

.merchandising-hero {
  padding: 3.75rem 0;
  background-color: var(--grayscale-color-1);
  border: 1px solid var(--border-orange-1);
  border-radius: 50px;
  margin-bottom: 3.5rem;
}

.merchandising-hero-text {
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: space-between;
  margin-bottom: 3.75rem;
}

.merchandising-hero-text h2 {
  width: 100%;
  max-width: 750px;
}

.merchandising-hero-text p {
  width: 100%;
  max-width: 682px;
}

.flex-column {
  display: flex;
  flex-direction: row !important;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem;
  border: 1px solid var(--border-orange-2);
  border-radius: 1.5rem;
  width: fit-content;
  margin-bottom: 3.75rem;
}

.nav-pills .nav-link.active {
  background-color: var(--border-orange-4);
  border-radius: 0.875rem;
  outline: none;
  color: var(--primary-orange) !important;
}

.btn:focus,
.btn:focus:not(:focus-visible) {
  outline-offset: 0px;
}

.nav-pills .nav-link {
  font-size: 1rem;
  color: var(--typography-black-2) !important;
}

.nav-pills .mobile-text {
  display: none;
}

.nav-link:hover,
.nav-link.active:hover {
  color: var(--primary-orange) !important;
}

.main-accordion .accordion-button {
  padding: 0;
  padding-bottom: 1.375rem;
  font-size: clamp(1.3125rem, 1.1456rem + 0.712vw, 2rem);
  color: var(--typography-black-1);
  position: relative;
  display: flex;
  align-items: center;
}

.main-accordion .accordion-button .accordion-icon {
  width: 100%;
  max-width: 26px;
  margin-right: 0.5rem;
  opacity: 0;
  overflow: hidden;
  max-height: 0;
  width: 0;
  transition: all 0.3s ease;
}

.main-accordion .accordion-item {
  border: none;
  border-bottom: 1px solid var(--border-orange-2);
  margin-bottom: 3.75rem;
}

.main-accordion .accordion-item:last-child {
  margin-bottom: 0;
}

.main-accordion .accordion-button:focus {
  border-color: var(--grayscale-color-1);
  box-shadow: none;
}

.accordion-button,
.main-accordion .accordion-button:not(.collapsed) {
  color: var(--typography-black-1);
  background-color: var(--grayscale-color-1);
  box-shadow: none;
}

.main-accordion .accordion-body {
  padding: 0;
  padding-bottom: 1.375rem;
  display: flex;
  gap: 1.437rem;
  justify-content: space-between;
}

.main-accordion .accordion-body p {
  color: var(--typography-black-2);
  max-width: 803px;
  font-size: clamp(1rem, 0.9697rem + 0.1294vw, 1.125rem);
}

.main-accordion .accordion-body .tab-content-buttons {
  display: flex;
  align-items: center;
  gap: 1.375rem;
  margin-top: auto;
}

.main-accordion .accordion-button::before {
  content: "";
  display: block;
  width: 24px;
  height: 2px;
  background-color: var(--grayscale-color-6);
  position: absolute;
  right: 0;
  top: 10px;
}
.main-accordion .accordion-button::after {
  content: "";
  display: block;
  width: 2px;
  height: 24px;
  background-color: var(--grayscale-color-6);
  position: absolute;
  right: 11px;
  top: 0;
}

.main-accordion .accordion-button:not(.collapsed)::after {
  background-image: none;
  transform: rotate(90deg);
  background-color: var(--primary-orange);
}

.main-accordion .accordion-button:not(.collapsed) .accordion-icon {
  width: 100%;
  max-width: 26px;
  margin-right: 0.5rem;
  opacity: 1;
  overflow: visible;
  max-height: 100px;
  width: 100%;
}

.main-accordion .accordion-button:not(.collapsed)::before {
  background-color: var(--primary-orange);
}

.nav-link-nowrap {
  white-space: inherit !important;
}

.nav {
  flex-wrap: nowrap;
}

/* Media Queries */

@media (max-width: 1200px) {
  .bnr-cards-container .bnr-card {
    flex: 1 1 0;
  }

  .automation-process-card img {
    width: 100%;
    object-fit: contain;
  }

  .problems-container {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(5, 1fr);
    gap: 1.25rem;
  }

  .slider-with-navigation .splide__slide:last-child .slider-image img {
    width: 330px;
    right: 2.5rem;
  }

  .ph-demo-section .inner {
    flex-direction: column;
    padding: 2.5rem;
  }

  .ph-demo-section .section-content {
    width: 100%;
  }

  .ph-demo-section .section-image {
    width: 90%;
  }
}

@media (max-width: 992px) {
  .slider-with-navigation .splide__slide:last-child .slider-image img {
    transform: translateX(-50%);
    left: 50%;
    height: auto;
  }

  .slider-with-navigation .splide__slide .slider-image img {
    height: 100%;
  }

  .how-it-works-video-section .inner {
    flex-direction: column;
    gap: 1.75rem;
  }

  .how-it-works-video-section .inner > * {
    width: 100%;
  }

  .how-it-works-video-section .section-text {
    text-align: center;
  }

  .how-it-works-video-section .first-gradient {
    right: 8%;
    bottom: -15%;
    left: unset;
    width: 70vw;
  }

  /* New Main Page */

  .banner {
    padding-top: 10.5rem;
  }

  .banner .container {
    height: fit-content;
  }

  .banner-title br {
    display: none;
  }

  .bnr-video-btn {
    max-width: none;
  }

  .banner-main-text {
    max-width: none;
  }

  .banner .container {
    flex-direction: column;
  }

  .bnr-video-btn::before {
    height: calc(100% - 6px);
  }

  /* Everything section */

  .everything-title img {
    max-width: 70px;
  }

  /* Webinar block section */

  .webinar-block-section .container {
    flex-direction: column;
  }

  .webinar-content-title br {
    display: none;
  }

  .wizora-block-section .container {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .bnr-container {
    gap: 15vw;
  }

  .desktop-title {
    display: none;
  }

  .mobile-title {
    display: block;
  }

  .bnr-image img {
    transform: scale(1.3);
    height: auto;
  }

  .problems-container {
    display: flex;
  }

  .ph-demo-section .inner {
    padding: 1.25rem;
    gap: 2.125rem;
  }

  .ph-demo-section .section-image {
    width: 100%;
  }

  .ph-demo-section .section-content .primary-btn {
    margin-top: 1.75rem;
  }

  .ph-demo-section .section-content .demo-notes {
    gap: 1.125rem;
    margin-top: 1.75rem;
  }

  .why-planohero-section {
    margin-bottom: 6.25rem;
  }

  /* Powered-by-ai */

  .powered-by-ai {
    padding: 0.5rem 0.75rem;
  }

  /* New Main Page */

  .banner {
    padding-bottom: 6.25rem;
  }

  .banner-main-text {
    padding: 2rem 0.875rem;
  }

  .banner-title {
    text-align: center;
  }

  .banner-main-text-span {
    text-align: center;
    margin-bottom: 1.5rem;
  }
  
  .banner-description {
    margin: 0 auto;
    margin-bottom: 1.5rem;
    text-align: center;
  }

  .buttons-container {
    align-items: baseline;
    flex-direction: column;
    gap: 0.75rem;
    margin: 0 auto;
  }

  .bnr-video-play {
    width: 48px;
    height: 48px;
    bottom: 28px;
    left: 17px;
  }

  .bnr-video-play img {
    max-width: 1rem !important;
  }


  .partner {
    padding: 10px 8px;
    right: 37px;
    bottom: 59px;
  }

  .partner img {
    max-width: 23px;
  }

  /* Everything section */

  .everything {
    padding: 2.375rem 0;
    margin-bottom: 3.75rem;
  }

  .everything-title img {
    display: none;
  }

  /* Retail technology section */

  .retail-technology {
    padding: 3.75rem 0;
  }

  .retail-technology .section-title {
    margin-bottom: 1.25rem;
  }

  .retail-technology-wrapper {
    flex-direction: column;
  }

  .retail-technology-card img {
    margin-bottom: 1.5rem;
  }
  
  .retail-technology-card {
    height: auto;
  }

  /* Retailers slider section */

  .retailers-slider {
    padding-bottom: 2.375rem;
  }

  .retailers-slider .section-title {
    margin-bottom: 2rem;
  }

  .retailers-slider .splide__list {
    gap: 3.75rem;
  }

  .retailers-slider .splide__slide img {
    max-width: 100px;
  }

  /* Wizora block section */

  .wizora-block-section {
    padding-bottom: 3.125rem;
  }

  .wizora-block-section .container {
    flex-direction: column;
    gap: 1rem;
  }

  .wizora-content-title {
    padding: 2rem 0.875rem;
    text-align: center;
  }

  .wizora-block-section .section-title {
    margin-bottom: 0.75rem;
  }

  .wizora-block-section .section-description {
    margin-bottom: 1.5rem;
  }

  .wizora-block-section .second-btn {
    width: 100%;
  }

  .wizora-video-btn {
    max-width: 340px;
    bottom: 20px;
    padding: 0.875rem;
    gap: 0.875rem;
  }

  .wizora-video-btn img {
    max-width: 38px;
  }

  /* Webinar block section */

  .webinar-block-section {
    padding-bottom: 3.125rem;
  }

  .webinar-block-section .container {
    flex-direction: column;
    gap: 1rem;
  }

  .webinar-content-title {
    padding: 2rem;
  }

  .webinar-content-title span {
    margin-bottom: 0.875rem;
  }

  .webinar-content-title p {
    margin-bottom: 2rem;
  }

  .webinar-content-date {
    flex-direction: column;
    gap: 0.75rem;
  }

  .webinar-content-date p {
    margin: 0;
  }

  .webinar-content-title .second-btn {
    max-width: none;
  }

  .webinar-content-speakers {
    padding: 1.25rem 1.125rem;
  }

  .webinar-block-img {
    display: none;
  }

  .webinar-block-img.mob {
    display: block;
  }

  /* Retailer block */

  .retailer {
    padding: 2.375rem 0;
    margin-bottom: 2.375rem;
  }

  .retailer-content {
    flex-direction: column;
  }

  .retailer-content img {
    margin: 0 auto;
  }

  .retailer-content-text p {
    margin-bottom: 0.5rem;
  }

  .retailer-content-text .section-title {
    margin-bottom: 1.75rem;
  }

  /* Merchandising platform section */

  .merchandising-platform-section {
    padding-top: 1.25rem;
    padding-bottom: 6.25rem;
  }

  .merchandising-platform-section .section-text {
    margin-bottom: 1.25rem;
  }

  .merchandising-platform-section .splide__arrows.custom-arrows {
    bottom: -4.5rem;
  }

  .merchandising-platform-section .splide__slide img {
    margin-bottom: 1.25rem;
  }

  .merchandising-platform-section .splide__slide h3 {
    margin-bottom: 0.5rem;
  }

  /* Free trial section */

  .free-trial {
    padding: 2.375rem 0;
    margin-bottom: 2.375rem;
  }

  .free-trial-content-text {
    padding: 2rem 0.875rem;
  }

  .free-trial-content {
    flex-direction: column;
    gap: 1rem;
  }

  .free-trial-content .planogram-img {
    margin: 0 auto;
  }

  .free-trial-content-text p {
    margin-bottom: 2rem;
  }

  /* Footer section */

  .footer-description-container {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 1rem;
  }

  .footer-description-container .links {
    justify-content: center;
    gap: 1.375rem;
  }

  /* Main Feedbacks section */

  .main-clients-feedbacks {
    margin-bottom: 2.375rem;
    padding-bottom: 6.937rem;
  }

  .main-clients-feedbacks .feedbacks-carousel .splide__arrows {
    display: flex !important;
    bottom: -78px !important;
    left: 50% !important;
    transform: translate(-50%) !important;
    width: auto !important;
  }

  /* Merchandising-hero section */

  .merchandising-hero {
    padding: 2.375rem 0;
    margin-bottom: 2.375rem;
  }

  .nav-pills .nav-link {
    width: 100%;
  }

  .merchandising-hero-text {
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 2rem;
  }

  .main-accordion .accordion-button {
    padding-bottom: 0.75rem;
    padding-right: 1.25rem;
  }

  .main-accordion .accordion-body {
    flex-direction: column;
  }

  .main-accordion .accordion-body .tab-content-buttons {
    flex-direction: column;
    margin-left: auto;
    gap: 0.75rem;
  }

  .main-accordion .accordion-item {
    margin-bottom: 2rem;
  }

  .main-accordion .accordion-button::before {
    width: 16px;
    height: 2px;
    top: 6px;
  }
  .main-accordion .accordion-button::after {
    width: 2px;
    height: 15px;
    right: 7px;
  }

  .nav-pills .mobile-text {
    display: block;
    white-space: nowrap;
  }

  .nav-pills .desktop-text {
    display: none;
    flex-wrap: nowrap;
  }

  .nav-pills {
    overflow: auto;
    width: 100%;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .nav-pills::-webkit-scrollbar {
    display: none;
  }

  .header .navbar-expand-xxl .navbar-nav {
    overflow: auto;
  }

  .bnr-video-btn {
    margin-bottom: 24px;
  }
}

@media (max-width: 576px) {
  .slider-with-navigation .splide__slide:last-child .slider-image img {
    width: 90%;
  }

  .slider-with-navigation .splide__slide:first-child .slider-image {
    max-height: 70vw;
  }

  .bnr-cards-container .bnr-card {
    min-width: calc(50% - 1.25rem);
  }

  /* New Main Page */
}