html {
  scroll-behavior: smooth;
}
.MyLPs {
  background-color: #eee6d3;
  color: #2d2c42;
  overflow-x: hidden;
}
.MyLPs .container {
  padding-inline: 15px;
}
.MyLPs .row {
  display: flex;
  flex-wrap: wrap;
}
.MyLPs img {
  width: auto;
  max-width: 100%;
}
.MyLPs .btnCommon {
  max-width: 250px;
  width: 100%;
  padding: 1em 0.7em;
  font-size: 1.125rem;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.15);
}
.MyLPs .linkStretched {
  position: absolute !important;
  inset: 0;
}
.MyLPs h1 {
  font-size: clamp(1.5625rem, calc(0.9553rem + 1.6867vw), 2rem);
}
.MyLPs h2 {
  font-size: clamp(1.5rem, calc(-0.2349rem + 4.8193vw), 2.75rem);
  font-weight: 600;
  margin-block: 1.5rem;
  line-height: 1.2;
  text-wrap: balance;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}
.MyLPs h3 {
  font-size: clamp(1.5rem, calc(0.5458rem + 2.6506vw), 2.1875rem);
}
.MyLPs p {
  font-size: clamp(1.125rem, calc(0.778rem + 0.9639vw), 1.375rem);
}
.MyLPs .f26 {
  font-size: clamp(1.25rem, calc(0.125rem + 3.125vw), 1.625rem);
  line-height: 1.4;
}
.MyLPs .f22 {
  font-size: clamp(1.25rem, calc(0.875rem + 1.0417vw), 1.375rem);
  line-height: 1.4;
}
.MyLPs .f34 {
  font-size: 2.125rem;
  line-height: 1.2;
}
.section1 {
  background: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section1bg.png') center bottom repeat-x, #eee6d3 url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section1.jpg') center bottom no-repeat;
  background-size: auto, cover;
  height: 42rem;
  display: flex;
  align-items: end;
  justify-content: center;
  padding-bottom: 7.5rem;
  position: relative;
}
.wave-frame {
  position: relative;
}
.wave-frame::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  min-width: 36rem;
  height: 9.375rem;
  background: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/wave-shape.png') center bottom repeat-x;
  background-size: auto;
}
.nav {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  max-width: 60rem;
  margin-inline: auto;
}
.nav a {
  place-content: center;
  display: block;
  border-radius: 4px;
  background-color: white;
  padding: 0.5em;
  color: #2b2c40;
  font-weight: 500;
  font-size: 1rem;
}
.nav a:hover {
  background-color: #ffc539;
}
.section2 {
  background-color: #ffd87d;
  padding-block: 3rem;
}
.section2_outer {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.section2_outer .title {
  font-size: 1.5rem;
  font-weight: 700;
  transition: 0.2s;
}
.section2_inner > div {
  border: solid 3px white;
  padding: 2rem;
  border-radius: 2rem;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: end;
  transition: 0.2s;
}
.section2_inner > div img {
  position: absolute;
  object-fit: cover;
  object-position: center;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  transition: 0.2s;
}
.section2_inner > div:hover {
  border: solid 3px yellow;
}
.section2_inner > div:hover img {
  opacity: 0.8;
  filter: blur(1px);
}
.section2_inner > div:hover .title {
  transform: translateY(-10px);
}
.section2_inner.left {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.section2_inner.left > div:not(:nth-child(3)) {
  border-top-right-radius: 0;
}
.section2_inner.left > div:not(:nth-child(3)) img {
  border-radius: 2rem;
  border-top-right-radius: 0;
}
.section2_inner.left > div:nth-child(3) {
  border-top-left-radius: 0;
  height: 12.8rem;
}
.section2_inner.left > div:nth-child(3) img {
  border-radius: 2rem;
  border-top-left-radius: 0;
}
.section2_inner.left > div:nth-child(2) .title,
.section2_inner.left > div:nth-child(3) .title,
.section2_inner.left > div:nth-child(4) .title {
  font-size: 1.125rem;
}
.section2_inner.left > div:first-child,
.section2_inner.left > div:last-child {
  grid-column: span 3;
  height: 14rem;
}
.section2_inner.right {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.section2_inner.right > div:first-child,
.section2_inner.right > div:nth-child(2) {
  border-top-left-radius: 0;
}
.section2_inner.right > div:first-child img,
.section2_inner.right > div:nth-child(2) img {
  border-radius: 2rem;
  border-top-left-radius: 0;
}
.section2_inner.right > div:nth-child(2) {
  height: 25rem;
}
.section2_inner.right > div:last-child {
  border-top-right-radius: 0;
  height: 17rem;
}
.section2_inner.right > div:last-child img {
  border-radius: 2rem;
  border-top-right-radius: 0;
}
.section2_inner.right > div:first-child {
  grid-row: span 2;
}
.section3 {
  background: #c25680 url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section3.jpg') center top no-repeat;
  padding-block: 8rem 4rem;
}
.pillsCarousel {
  margin-inline: auto;
}
.pillsCarousel .item {
  --icon-width: 3.125rem;
  background-color: white;
  height: 22rem;
  border-radius: 10rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  font-size: 1.25rem;
  font-weight: 600;
  text-align: center;
  position: relative;
}
.pillsCarousel .item:hover {
  --icon-width: 2.5rem;
}
.pillsCarousel .item:hover .poster {
  height: 58%;
}
.pillsCarousel .item .poster {
  background-color: red;
  height: 65%;
  overflow: hidden;
  position: relative;
  transition: 0.2s;
}
.pillsCarousel .item .poster img {
  position: absolute;
  object-fit: cover;
  object-position: center;
  inset: 0;
  width: 100%;
  height: 100%;
}
.pillsCarousel .item .desc {
  padding: 1.8rem 2rem;
  position: relative;
  transition: 0.2s;
}
.pillsCarousel .item .desc img {
  width: var(--icon-width);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: calc(var(--icon-width) / -2);
  transition: 0.2s;
}
.section4 {
  background: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section4.jpg') center top no-repeat;
  background-size: auto;
  padding-block: 3rem;
}
.section4carousel_wrapper {
  max-width: 820px;
  width: 100%;
  margin: 0 auto;
}
.section4carousel .item {
  background-color: white;
  border-radius: 15px;
  overflow: hidden;
}
.section4carousel .item .add-to-wishlist {
  background-color: #abcadb;
  padding: 10px;
  color: #2d2c42;
  font-weight: 700;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.section4carousel .item .add-to-wishlist .favorite {
  height: 20px;
  width: 21px;
  margin-left: 7px;
  transition: all linear 0.1s;
}
.section4carousel .item .add-to-wishlist .favorite svg {
  height: 20px;
  width: 21px;
  fill: #4960f2;
}
.section4carousel .item .add-to-wishlist .favorite:hover {
  opacity: 0.5;
}
.section4carousel .item .content {
  padding: 15px 25px 25px 25px;
  position: relative;
}
.section4carousel .item .content:hover .btnCommon {
  opacity: 0.8;
}
.section4carousel .item .content:hover img {
  transform: scale(0.96);
}
.section4carousel .item .title {
  font-size: 18px;
  font-weight: 700;
  color: #2d2c42;
  height: 50px;
  overflow: hidden;
}
.section4carousel .item .img-wrapper {
  max-width: 300px;
  width: 100%;
  aspect-ratio: 1/1;
  margin-block: 5px;
}
.section4carousel .item .img-wrapper img {
  width: 100%;
  max-width: 100%;
  transition: all linear 0.1s;
}
.section4carousel .item .price {
  font-size: 28px;
  font-weight: 800;
  color: #2d2c42;
}
.section4carousel .item .btnCommon {
  transition: all linear 0.1s;
  font-size: 16px;
  font-weight: 700 !important;
}
.section4carousel .owl-item {
  transition: all linear 0.1s;
}
.section4carousel .owl-item:not(.owl-item.active.center) {
  transform: scale(0.95);
}
.section4carousel .owl-nav {
  position: absolute;
  width: 100%;
  top: 45%;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
}
.section4carousel .owl-nav button {
  background-color: #4960f2 !important;
  height: 50px !important;
  width: 50px !important;
  border-radius: 50% !important;
  position: relative;
}
.section4carousel .owl-nav button span {
  display: none;
}
.section4carousel .owl-nav button.owl-prev {
  left: -26px;
}
.section4carousel .owl-nav button.owl-next {
  right: -26px;
}
.section4carousel .owl-nav button::after {
  content: '';
  height: 30px !important;
  width: 30px !important;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/left-arrow.svg');
  background-repeat: no-repeat;
  background-position: -2px center;
  background-size: 18px;
  /*filter: invert(1);*/
}
.section4carousel .owl-nav button.owl-prev:after {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/left-arrow.svg');
  background-size: 18px;
}
.section4carousel .owl-nav button.owl-next:after {
  transform: translate(-50%, -50%) scale(-1);
}
.section4carousel .owl-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 25px !important;
}
.section4carousel .owl-dots .owl-dot span {
  background-color: #921729;
}
.section4carousel .owl-dots .owl-dot.active span {
  background-color: #db3533;
  width: 14px;
  height: 14px;
  -webkit-box-shadow: 0px 2px 13px -1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 2px 13px -1px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 2px 13px -1px rgba(0, 0, 0, 0.5);
}
.section4carousel .owl-stage-outer {
  z-index: 3;
}
.section5grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 1200px;
  margin-inline: auto;
}
.section5grid > div {
  background-color: #ffc146;
  padding: 2rem;
  border-radius: 1.4rem;
  position: relative;
}
.section5grid > div a {
  color: white;
  font-size: 1.5rem;
  font-weight: 600;
  display: flex;
  gap: 1rem;
  align-items: center;
  transition: 0.3s;
}
.section5grid > div .poster {
  height: 20rem;
  border-radius: 1.4rem;
  margin-bottom: 1rem;
  position: relative;
  overflow: hidden;
}
.section5grid > div .poster img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: 0.3s;
}
.section5grid > div:hover a {
  padding-left: 0.5rem;
}
.section5grid > div:hover .poster img {
  transform: scale(1.1);
}
.section5grid > div:hover .link_arrow {
  transform: translateX(0.5rem);
}
.link_arrow {
  width: 2rem;
  aspect-ratio: 1;
  background-color: white;
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/right-arrow.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 50%;
  border-radius: 50%;
  display: block;
  transition: 0.3s;
  flex-shrink: 0;
}
.section6 {
  background: #298358 url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section6.jpg') center bottom no-repeat;
  padding-block: 3rem 9rem;
}
.section7 {
  background: #EEE6D3;
  background: linear-gradient(180deg, #eee6d3 0%, #ecdac7 15%, #cf4538 15%, #cf4538 100%);
  padding-bottom: 9rem;
  position: relative;
}
.section7::before {
  content: '';
  position: absolute;
  inset: auto 0 0 0;
  height: 7rem;
  background: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section7bg.jpg') center bottom no-repeat;
  background-size: auto;
}
.section7grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.section7grid > div {
  background-color: black;
  height: 32rem;
  border-radius: 50rem;
  overflow: hidden;
  position: relative;
  transition: 0.3s;
  box-shadow: 0 0 15px 3px rgba(0, 0, 0, 0.1);
}
.section7grid > div .poster {
  position: relative;
  height: 20rem;
}
.section7grid > div .poster img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom;
  transition: 0.3s;
}
.section7grid > div .desc {
  position: relative;
  isolation: isolate;
  text-align: center;
  font-weight: 600;
  font-size: 1.5rem;
  color: white;
}
.section7grid > div .desc img {
  margin-inline: auto;
  margin-bottom: 0.8rem;
}
.section7grid > div .desc svg {
  width: 130%;
  position: absolute;
  top: -4rem;
  left: -2rem;
  right: 0;
  z-index: -1;
  transition: 0.3s;
}
.section7grid > div:hover .poster img {
  transform: scale(1.1);
}
.section7grid > div:hover .desc svg {
  top: -5rem;
  transform: scale(1.1);
}
.section7grid > div:nth-child(odd) {
  border-top-left-radius: 0;
}
.section7grid > div:nth-child(even) {
  border-top-right-radius: 0;
}
.section7grid > div:first-child {
  background-color: #abcadb;
}
.section7grid > div:first-child svg {
  fill: #abcadb;
}
.section7grid > div:nth-child(2) {
  background-color: #feb5c0;
}
.section7grid > div:nth-child(2) svg {
  fill: #feb5c0;
}
.section7grid > div:nth-child(3) {
  background-color: #9f80e7;
}
.section7grid > div:nth-child(3) svg {
  fill: #9f80e7;
}
.section7grid > div:nth-child(4) {
  background-color: #ffc439;
}
.section7grid > div:nth-child(4) svg {
  fill: #ffc439;
}
.section7grid > div:nth-child(5) {
  background-color: #298358;
}
.section7grid > div:nth-child(5) svg {
  fill: #298358;
}
.section7grid > div:nth-child(6) {
  background-color: #c25680;
}
.section7grid > div:nth-child(6) svg {
  fill: #c25680;
}
.section8grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 2rem;
}
.section8grid > div {
  border-radius: 2rem;
  border-bottom-right-radius: 0;
  aspect-ratio: 1;
  font-size: 1.5rem;
  font-weight: 600;
  padding: 1rem;
  text-align: center;
  position: relative;
  --circle-width: 10rem;
  isolation: isolate;
  overflow: hidden;
}
.section8grid > div::before {
  content: '';
  position: absolute;
  background-color: #eee6d3;
  width: var(--circle-width);
  aspect-ratio: 1;
  bottom: calc(var(--circle-width) / -2);
  right: calc(var(--circle-width) / -2);
  border-radius: 50%;
  transition: 0.3s;
  z-index: -1;
}
.section8grid > div img {
  margin-inline: auto;
  margin-top: 1rem;
  transition: 0.3s;
}
.section8grid > div .link_arrow {
  background-color: #ffc439;
  position: absolute;
  right: 0.5rem;
  bottom: 0.5rem;
  width: 2.5rem;
}
.section8grid > div:hover {
  --circle-width: 18rem;
}
.section8grid > div:hover .link_arrow {
  transform: rotate(45deg);
  width: 4.5rem;
}
.section8grid > div:hover img {
  transform: scale(0.9);
}
.section8grid > div:first-child {
  background-color: #ffd87d;
}
.section8grid > div:nth-child(2) {
  background-color: #abcadb;
}
.section8grid > div:nth-child(3) {
  background-color: #feb5c0;
}
.section8grid > div:nth-child(4) {
  background-color: #cf4538;
}
.section9 {
  background: #ffd87d url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section9bg.jpg') center top no-repeat;
  background-size: auto;
  margin-top: 4rem;
  padding-block: 9rem 3rem;
}
.section9grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: center;
}
.section9grid > div {
  font-size: 1.5rem;
  text-align: center;
  font-weight: 600;
  position: relative;
}
.section9grid > div .poster {
  aspect-ratio: 1;
  margin-bottom: 0.5rem;
  place-items: center;
  text-align: center;
  display: flex;
  justify-content: center;
  transition: 0.3s;
}
.section9grid > div .poster img {
  max-width: 12rem;
}
.section9grid > div:nth-child(2) .poster {
  clip-path: ellipse(99% 97% at 99% 97%);
  background-color: #abcadb;
  border-radius: 0;
}
.section9grid > div:nth-child(2):hover .poster {
  clip-path: none;
  border-radius: 50% 0 50% 50%;
}
.section9grid > div:nth-child(3) .poster {
  border-radius: 50%;
  border-radius: 0 0 50% 50%;
  background-color: #feb5c0;
}
.section9grid > div:nth-child(3):hover .poster {
  border-radius: 50%;
}
.section9grid > div:nth-child(4) .poster {
  border-radius: 50%;
  background-color: #cf4538;
}
.section9grid > div:nth-child(4):hover .poster {
  border-radius: 50% 50% 0 0;
}
.section9grid > div:nth-child(5) .poster {
  border-radius: 50%;
  border-bottom-left-radius: 0;
  background-color: #abcadb;
}
.section9grid > div:nth-child(5):hover .poster {
  border-radius: 0 50% 50% 50%;
}
@media (min-width: 1200px) {
  .fixed_container {
    flex-basis: 1300px;
    max-width: 1300px;
    /*width:100%;*/
  }
}
@media (max-width: 1200px) {
  .section1 {
    background-size: 140%, cover;
  }
  .section2_inner.left > div:nth-child(2),
  .section2_inner.left > div:nth-child(3),
  .section2_inner.left > div:nth-child(4) {
    padding: 1.5rem;
  }
  .pillsCarousel .item .desc {
    padding: 1.8rem 1rem;
  }
  .section7::before {
    background-size: 140%;
  }
  .section8grid > div {
    aspect-ratio: unset;
  }
  .section8grid > div img {
    max-width: 69%;
  }
  .section9 {
    padding-block: 6rem 3rem;
    background-size: 140%;
  }
  .section9grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .section9grid > div:first-child {
    grid-column: span 4;
  }
}
@media (max-width: 991px) {
  .section1 {
    height: 35rem;
    padding-bottom: 7rem;
  }
  .section2_outer {
    grid-template-columns: 1fr;
    max-width: 48rem;
    width: 100%;
    margin-inline: auto;
  }
  .section2_inner.right {
    order: 1;
  }
  .section2_inner.left {
    order: 2;
  }
  .section3 {
    background-size: 140%;
    padding-block: 5rem 4rem;
  }
  .section3 .container,
  .section3 .flexCol_12 {
    padding-inline: 0;
  }
  .pillsCarousel .owl-stage-outer {
    padding-left: 1rem;
  }
  .pillsCarousel .item {
    height: 18rem;
    width: 12rem;
    font-size: 1rem;
  }
  .pillsCarousel .item .desc {
    padding: 1.8rem 1rem;
  }
  .section6 {
    background-size: 120%;
    padding-block: 3rem 5rem;
  }
  .section7grid {
    gap: 1rem;
  }
  .section8grid {
    max-width: 40rem;
    margin-inline: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .section8grid > div {
    aspect-ratio: 1;
  }
  .section9grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 40rem;
    margin-inline: auto;
  }
  .section9grid > div:first-child {
    grid-column: span 2;
  }
}
@media (max-width: 768px) {
  .section1 {
    height: 38rem;
  }
  .nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.6rem;
  }
  .nav a {
    padding: 1em 0.5em;
  }
  .pillsCarousel .item {
    --icon-width: 2rem;
    height: 16rem;
    width: 10rem;
    font-size: 1rem;
  }
  .section4 {
    background: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section4m.jpg') center top no-repeat;
    background-size: cover;
    padding-block: 3rem;
    text-align: center;
  }
  .section4carousel {
    margin-top: 1rem;
  }
  .section5grid {
    gap: 0.8rem;
    margin-top: 0.5rem;
  }
  .section5grid > div a {
    align-items: start;
  }
  .section7 {
    background: linear-gradient(180deg, #eee6d3 0%, #ecdac7 8%, #cf4538 8%, #cf4538 100%);
    padding-bottom: 5rem;
  }
  .section7::before {
    background-size: 140%;
  }
  .section7grid {
    max-width: 36rem;
    margin-inline: auto;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .section7grid > div {
    height: 28rem;
  }
  .section7grid > div .poster {
    height: 22rem;
  }
  .section7grid > div .poster img {
    object-position: top;
  }
  .section7grid > div .desc {
    padding-inline: 2rem;
  }
  .section7grid > div .desc img {
    max-width: 70%;
    margin-top: -3rem;
    margin-bottom: 0;
  }
}
@media (max-width: 600px) {
  .MyLPs h2 span:first-child,
  .MyLPs h2 span:last-child {
    width: 2.2rem;
    flex-shrink: 0;
  }
}
@media (max-width: 576px) {
  .MyLPs .btnCommon {
    padding: 1em 0.7em;
    font-size: 1rem;
  }
  .section1 {
    background: url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section1bg.png') center bottom repeat-x, #eee6d3 url('https://support3.you.gr/you/redesign/landing_pages/2026_Summer_landing/section1m.jpg') center bottom no-repeat;
    background-size: 140%, cover;
    height: 33rem;
    padding-bottom: 4.5rem;
  }
  .section1 .summer-logo {
    max-width: 20rem;
    width: 100%;
    margin-bottom: -1.4rem;
  }
  .nav a {
    padding: 0.7em 0.4em;
    font-size: 0.875rem;
    height: 3.5rem;
  }
  .section2_outer {
    gap: 0.6rem;
  }
  .section2_outer .title {
    font-size: 1.25rem;
  }
  .section2_inner > div {
    padding: 1.5rem;
  }
  .section2_inner.left {
    gap: 0.6rem;
  }
  .section2_inner.left > div:first-child,
  .section2_inner.left > div:last-child {
    height: 10rem;
  }
  .section2_inner.left > div:nth-child(2),
  .section2_inner.left > div:nth-child(3),
  .section2_inner.left > div:nth-child(4) {
    height: 10rem;
  }
  .section2_inner.left > div:nth-child(2) .title,
  .section2_inner.left > div:nth-child(3) .title,
  .section2_inner.left > div:nth-child(4) .title {
    font-size: 1rem;
  }
  .section2_inner.right {
    gap: 0.6rem;
  }
  .section2_inner.right > div:nth-child(2) {
    height: 17rem;
  }
  .section2_inner.right > div:nth-child(3) {
    height: 12rem;
  }
  .section3 {
    background-size: 200%;
  }
  .pillsCarousel .item {
    font-size: 0.875rem;
  }
  .section4 {
    padding-block: 1rem 3rem;
  }
  .section4 .item .add-to-wishlist {
    text-align: left;
  }
  .section4 .item .title {
    height: 47px;
  }
  .section4 .container,
  .section4 .flexCol_12 {
    padding-inline: 0;
  }
  .section4carousel .item .btnCommon {
    font-size: 0.875rem;
  }
  .section5grid {
    gap: 0.5rem;
    margin-top: 0.5rem;
  }
  .section5grid > div {
    padding: 1.5rem 1rem;
    border-radius: 1rem;
  }
  .section5grid > div a {
    font-size: 1.125rem;
    justify-content: space-between;
  }
  .section5grid > div .poster {
    height: 15rem;
    border-radius: 1rem;
  }
  .section7grid {
    max-width: 36rem;
    margin-inline: auto;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .section7grid > div {
    height: 25rem;
    border-radius: 6rem;
  }
  .section7grid > div .poster {
    height: 60%;
  }
  .section7grid > div .poster img {
    object-position: top;
  }
  .section7grid > div .desc {
    padding-inline: 2.5rem;
    font-size: 1.125rem;
    padding-top: 1rem;
  }
  .section7grid > div .desc img {
    max-width: 10rem;
    width: 100%;
    margin-top: 0;
    margin-bottom: 0.5rem;
  }
  .section7grid > div .desc svg {
    top: -30px;
  }
  .section8grid > div {
    aspect-ratio: 1;
    font-size: 1.125rem;
    --circle-width: 8rem;
    overflow: visible;
  }
  .section8grid > div .link_arrow {
    right: 0;
    bottom: 0;
  }
  .section9 {
    margin-top: 3rem;
  }
}
@media (max-width: 480px) {
  .section2_inner.left > div:nth-child(2),
  .section2_inner.left > div:nth-child(3),
  .section2_inner.left > div:nth-child(4) {
    padding: 1.5rem 1rem;
  }
  .section2_inner.left > div:nth-child(2) .title,
  .section2_inner.left > div:nth-child(3) .title,
  .section2_inner.left > div:nth-child(4) .title {
    font-size: 0.875rem;
  }
  .section7grid > div {
    height: 22rem;
    border-radius: 4rem;
  }
  .section7grid > div .poster {
    height: 60%;
  }
  .section7grid > div .desc {
    padding-inline: 1.5rem;
    padding-top: 0;
  }
  .section8grid {
    gap: 0.8rem;
  }
  .section8grid > div {
    padding-inline: 0.5rem;
    font-size: 1rem;
    --circle-width: 6rem;
  }
  .section8grid > div .link_arrow {
    width: 1.8rem;
  }
  .section9 {
    padding-block: 3rem;
  }
  .section9grid {
    gap: 2rem;
  }
  .section9grid > div {
    font-size: 1rem;
  }
  .section9grid > div .poster img {
    width: 65%;
    margin-inline: auto;
  }
}
@media (max-width: 380px) {
  .section2_inner.left > div:nth-child(2),
  .section2_inner.left > div:nth-child(3),
  .section2_inner.left > div:nth-child(4) {
    padding: 1.2rem 0.5rem;
    text-align: center;
  }
  .section2_inner.left > div:nth-child(2) .title,
  .section2_inner.left > div:nth-child(3) .title,
  .section2_inner.left > div:nth-child(4) .title {
    font-size: 0.8rem;
  }
}