.banner--section {
    position: sticky;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 1;
    transform-origin: center center;
    overflow: hidden;
    will-change: transform;
}


.banner--bg-image.banner--bg-mobile{
  display: none;
}


/* Background container */

.banner--bg {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    z-index: 0;
}


/* Picture must fill container */

.banner--bg picture {
    display: block;

    width: 100%;
    height: 100%;
}


/* Background image */

.banner--bg-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;
}

.banner--info {
    position: absolute;
    bottom: 50px;
    left: 50px;
    background: rgb(255 255 255 / 10%);
    /* backdrop-filter: blur(74.0999984741211px); */
    -webkit-backdrop-filter: blur(74.0999984741211px);
    backdrop-filter: blur(74.0999984741211px);
    padding: 40px 30px;
    max-width: 650px;
    width: 100%;
    text-align: center;
}

.banner--info .qoute--img {
    filter: brightness(0) invert(1);
    width: 30px;
    margin: 0 auto;
    margin-bottom: 20px;
}

.banner--info .qoute--text {
    color: var(--white);
    font-size: 28px;
    line-height: 1.2;
    margin-bottom: 0px;
    text-align: left;
}

.banner--info .banner--about--author {
    margin-top: 30px;
    color: var(--white);
    text-align: left;
}

.banner--info .banner--about--author h2 {
    font-size: 24px;
    font-family: 'LT Superior Serif';
    font-weight: 400;
    margin-bottom: 0px;
}

.banner--info .banner--about--author p {
    font-size: 14px;
    margin-bottom: 0px;
}

.banner--info .banner--about--author .banner--about--socials {
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.banner--info .banner--about--author .banner--about--socials a {
    text-decoration: none;
}

.banner--info .banner--about--author .banner--about--socials a img {
    filter: brightness(0) invert(1);
    width: 23px;
}


.top--article {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

.latest--article {
  padding-left: 50px !important;
}

.latest--article .article--item {
  display: block;
  background: var(--white);
  max-width: 345px;
  width: 100%;
  padding: 15px;
}

.latest--article .article--item .article--thum img {
  width: 100%;
}

.latest--article .article--item {
  display: block;
  max-width: 346px;
  max-height: 306px;
  width: 100%;
  background: #ffffff;
  padding: 14px;
  text-decoration: none;
  color: #111111;
  box-sizing: border-box;
  margin-bottom: 64px;
}

.latest--article .article--item .article--thum {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.latest--article .article--item .article--thum img.youtube--play {
    height: 70px;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 70px;
    transform: translate(-50%, -50%);
}

.latest--article .article--item .article--thum img {
  display: block;
  width: 100%;
  height: 184px;
  object-fit: cover;
}

.latest--article .article--item .article--content {
  padding-top: 22px;
}

.latest--article .article--item .article--heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

.latest--article .article--item .article--heading h2 {
  font-family: "LT Superior Serif", serif;
  margin: 0;
  font-size: 20px;
  line-height: 1.2;
  font-weight: 400;
  /* text-transform: uppercase; */
}

.latest--article .article--item .arrow--btn {
  width: 16px;
  height: 16px;
  flex: 0 0 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  gap: 0;
  padding: 0;
}

.latest--article .article--item .arrow--btn::after {
  display: none;
}

.latest--article .article--item .arrow--btn img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.latest--article .article--item .article--para {
  margin-top: 10px;
}

.latest--article .article--item .article--para p {
  margin: 0;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  /* font-size: 14px; */
  line-height: 1.25;
  font-weight: 400;
  color: #111111;
}

.latest--article .article--item .article--thum img {
  transition: transform 0.4s ease;
}

.latest--article .article--item:hover .article--thum img {
  transform: scale(1.02);
}
.latest--article .article--item:hover .article--thum img.youtube--play{
  transform: translate(-50%, -50%) scale(1) !important;
}
/* =====================================
   ABOUT SECTION
===================================== */

.about--section {
  padding-top: 70px;
  position: relative;
  width: 100%;

  /* min-height: 835px; */
  overflow: hidden;
}
/* ABOUT */

.about--bg {
    position: relative;
    left: 0;
    /* top: 100px; */
    /* padding-top: 70px; */
    width: 100%;
    height: 100%;
    z-index: 0;
}

.about--bg img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    /* Important: show more of bottom/people */
    object-position: center bottom;
}
.about--section .custom--container {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: none;
  padding: 0;
      z-index: 1;
}

.about--section:before {
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(
    360deg,
    rgba(232, 240, 237, 0) 53.71%,
    #ffffff 97.43%
  );
      z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
}

/* =====================================
   TEXT BLOCK
===================================== */

.about--content {
  position: absolute;

  /* Position from your reference */
  top: 70px;
  right: 65px;
  width: 100%;
  max-width: 670px;
  color: #111;
  z-index: 9999999;
}

.about--quote {
  position: relative;
}

.about--quote .quote--icon {
  position: absolute;
  top: -17px;
  left: -17px;
}

.about--quote p {
  font-family: "Inter", sans-serif;
  margin: 0;
  font-size: 24px;
  font-weight: 400;
  color: var(--black);
  line-height: 1.2;
}

/* =====================================
   AUTHOR
===================================== */

.about--author {
  margin-top: 44px;
}

.about--author h2 {
  font-family: LT Superior Serif;
  font-size: 24px;
  line-height: 1;
  font-weight: 400;
  color: #000000;
}

.about--author > p {
  font-family: LT Superior Serif;
  margin-top: 5px;
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
  color: #000000;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.about--socials a {
  text-decoration: none;
}

.gradieant--bg {
    background: linear-gradient(180deg, #e8f0ed -10.96%, #f9e7d6 74.46%);
    position: relative;
    z-index: 1;
}

.spotlight--section {
  width: 100%;
  /* background: #f3f2ed; */
  /* background: linear-gradient(180deg, #e8f0ed -10.96%, #f9e7d6 74.46%); */
      z-index: 3;
    position: relative;
}

.spotlight--section .custom--container {
  width: calc(100% - 76px);
  max-width: none;
  margin: 0 auto;
}

/* Heading */

.spotlight--heading {
  margin-bottom: 22px;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding-right: 50px;
}

.spotlight--heading h2 {
  font-family: LT Superior Serif;
  margin: 0;
  font-size: 36px;
  line-height: 1.1;
  font-weight: 400;

  color: #111111;
}

.slide--left--right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.slide--left--right img {
    width: 30px;
    height: 30px;
    cursor: pointer;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.spotlight--grid {
  display: grid;
  /* grid-template-columns: repeat(3, 1fr); */
  grid-template-columns: 1.2fr 1fr;
  grid-template-rows: minmax(477px, 540px);
  gap: 14px;
}

.spotlight--card {
    color: #111111;
    text-decoration: none;
    height: auto;
    flex-direction: row;
}

.description--content {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 10px;
}

.spotlight--image {
  width: 100%;
  height: 240px;

  overflow: hidden;
}

.spotlight--image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.spotlight--card:hover .spotlight--image img {
  transform: scale(1.04);
}

.spotlight--content--area {
    padding: 20px 15px;
}

.spotlight--meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  /* margin-top: 26px; */
  font-size: 14px;
  font-weight: 400;

  color: var(--black);
}

.spotlight--meta span:last-child {
  white-space: nowrap;
}

.spotlight--card h3 {
  font-family: LT Superior Serif;

  margin-top: 20px;
  font-size: 20px;
  font-weight: 400;
  color: #111111;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  /* height: calc(1.2 * 20px * 2);
  line-height: 1.2; */
}

.spotlight--card > p {
  margin-top: 7px;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 400;
  color: #222222;

  /* Maximum two lines */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;

  overflow: hidden;
  margin-bottom: 0;
}

.featured--article .spotlight--card {
    height: 100%;
    position: relative;
}

.featured--article .spotlight--card .spotlight--content--area {
    position: absolute;
    bottom: 0px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
    padding: 20px;
    color: var(--white);
}

.featured--article .spotlight--card .spotlight--image {
    height: 100%;
}

.featured--article .spotlight--card .spotlight--content--area .spotlight--meta, .featured--article .spotlight--card .spotlight--content--area h3 {
    color: var(--white);
}
.featured--article .spotlight--card .spotlight--content--area h3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.featured--article .spotlight--card .spotlight--image .youtube--play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 65px;
    height: auto;
}

.side--articles .spotlight--card .spotlight--image {
    height: 170px;
    max-width: 230px;
    width: 100%;
    position: relative;
}

.side--articles .spotlight--card .spotlight--content--area {
    flex: 1;
}

.side--articles .spotlight--card .spotlight--content--area h3 {
    margin-top: 10px;
    font-size: 20px;
}

.side--articles {
    display: flex;
    flex-direction: column;
    row-gap: 15px;
}

.side--articles .spotlight--card .spotlight--content--area .description--content p, .side--articles .spotlight--card .spotlight--content--area .description--content {
    margin-bottom: 0px;
}

.side--articles .spotlight--card .spotlight--image .arrow--btn {
    position: absolute;
    bottom: 15px;
    right: 15px;
    display: block;
    padding: 0;
}

.side--articles .spotlight--card .spotlight--image .arrow--btn img {
    filter: brightness(0) invert(1);
}

/* =========================================
   FOSSIL FREE SECTION
========================================= */
/* .fossil--section--mobile{
  display: none;
} */
.fossil--section {
  position: relative;
  width: 100%;
  padding: 0px 0 130px;
  overflow: hidden;

  background: #f9e7d6;
  height: 100vh;
  z-index: 3;
}

.pin-spacer:has(.fossil--section) {
  background: #f9e7d6;
}

.fossil--section .custom--container {
  width: calc(100% - 76px);
  max-width: none;
  margin: 0 auto;
}

/* =========================================
   MAIN LAYOUT
========================================= */

.fossil--slide {
  position: relative;

  display: grid;

  /*
        Left blank space
        Main image
        Right text
    */
  grid-template-columns: 5% 55% 32%;

  column-gap: 4%;

  align-items: center;
  height: fit-content;

  min-height: 430px;
  width: calc(100% - 76px);
    max-width: none;
    margin: 0 auto;
    padding: 0 15px;
    padding-top: 80px;
}

/* =========================================
   HEADING
========================================= */

.fossil--heading {
  position: absolute;
  font-family: LT Superior Serif;

  top: 30px;
  left: 15px;

  z-index: 2;

  width: 410px;
}

.fossil--heading h2 {
  margin: 0;

  font-size: 36px;
  line-height: 40px;
  font-weight: 400;

  color: #111111;
}

/* =========================================
   IMAGE
========================================= */
.fossil--image:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(
    180deg,
    #f9e7d6 0%,
    rgba(249, 231, 214, 0) 45.53%
  );
  z-index: 1;
}

.fossil--image {
  position: relative;
  grid-column: 2;

  width: 100%;
  height: 514px;

  overflow: hidden;
}

.fossil--image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
}

/* =========================================
   RIGHT CONTENT
========================================= */

.fossil--content {
  grid-column: 3;

  width: 100%;
}

.fossil--content > p {
  margin: 0;
  font-size: 15px;
  color: var(--black);
}

/* =========================================
   READ MORE
========================================= */

.fossil--read {
  margin-top: 18px;
  color: var(--black);
  text-decoration: none;
}

.fossil--arrow {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 12px;
  height: 12px;
}

.fossil--arrow img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: contain;
}

.fossil--read:hover .fossil--arrow {
  transform: translate(3px, -3px);
}

.fossil--arrow {
  transition: transform 0.3s ease;
}

/* New Design */
.fossil--section--mobile {
    padding-left: 50px;
    padding-bottom: 70px;
}

.fossil--section--mobile .fossil--swiper .swiper-wrapper {
    align-items: stretch;
}

.fossil--section--mobile .fossil--swiper .swiper-slide {
    height: auto;
    display: flex;
    transition: 0.3s;
}

.f--slide--inner {
    display: flex;
    transition: 0.3s;
}

.fossil--section--mobile .fossil--swiper .swiper-slide .f--slide--inner {
    transform: scale(0.9);
    opacity: 0.3;
}

.fossil--section--mobile .fossil--swiper .swiper-slide.swiper-slide-active .f--slide--inner {
    transform: scale(1.05);
    opacity: 1;
}

.f--slide--inner .f-slide--content {
    
    flex: 1;
    width: 100%;
    background: #FFFFFF80;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 50px;
    min-height: 455px;
}

.f--slide--inner .f-slide--thum {
    max-width: 545px;
}

.f--slide--inner .f-slide--thum .fossil--main-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.f--slide--inner .f-slide--content h2 {
    font-size: 30px;
    font-family: 'LT Superior Serif';
    font-weight: 400;
    margin-bottom: 20px;
}

.f--slide--inner .f-slide--content .arrow--btn {
    margin-top: 14px;
}

.fossil--section--mobile .swiper-pagination {
        position: relative;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding-top: 70px;
    gap: 5px;
}

.fossil--section--mobile .swiper-pagination .swiper-pagination-bullet {
    width: 17px;
    height: 2px;
    border-radius: 0px;
    background: #0000004D;
    margin: 0px !important;
    opacity: 1;
    transition: 0.3s;
}

.fossil--section--mobile .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
	background: var(--black);
	width:43px;
}
/* New Design end */

/* =========================================
   NURTURING THE NEXT GENERATION
========================================= */

.nurturing--section {
  position: relative;
  width: 100%;
  background: #ffffff;
  overflow: hidden;
  background: linear-gradient(180deg, #E8F0ED 0%, #F9E7D6 74.05%, #F8FFFC 100%);
  padding-top: 150px;
  padding-bottom: 0px;
  z-index: 2;
}
.nurturing--section::before {
  content: "";
  position: absolute;
  top: 110px;
  left: 70px;
  width: 100%;
  max-width: 235px;
  height: 171px;
  background-image: url("../images/icons/quote.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.nurturing--section::after {
  content: "";

  position: absolute;

  top: 170px;
  right: -35px;

  width: 100%;
  transform: rotate(-35deg) translateX(35px);
  max-width: 457px;
  height: 562px;
  background-image: url("../images/home/flower.png");
  background-repeat: no-repeat;
  background-position: top right;
  background-size: contain;
  opacity: 0.1;
  pointer-events: none;
  transform: rotate(-35deg);
}
.nurturing--section .custom--container {
  width: calc(100% - 100px);
  max-width: none;
  margin: 0 auto;
   position: relative;
  z-index: 1;
}

.nurturing--quote {
  max-width: 1133px;
  width: 100%;
  margin: 0 auto;
}

.nurturing--quote p {
  color: #b5b5b5;
  text-align: center;
  font-size: 30px;
  line-height: 1.3;
}

/* =========================================
   MAIN CONTENT
========================================= */

.nurturing--main {
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 52% 42%;
  column-gap: 6%;
  padding-top: 0px;
  padding-left: 50px;
  padding-right: 50px;
}
.nurturing--mobile{
  display: none;
}

/* =========================================
   LEFT SIDE
========================================= */

.nurturing--left {
  position: relative;
}

/* Heading */

.nurturing--heading {
  position: relative;
  z-index: 2;

  margin-bottom: 8px;
}

.nurturing--heading h2 {
  margin: 0;
  font-family: LT Superior Serif;

  font-size: 36px;
  /* line-height: 47px; */
  font-weight: 400;

  color: #111111;
}

.nurturing--heading h2 span {
  display: block;
  /* margin-top: 5px;
  font-size: 38px;
  line-height:1.5;

  font-weight: 400; */
}

/* =========================================
   IMAGE
========================================= */
.sticky--top--nurturing {
    position: absolute;
    width: 100%;
    top: 0;
        z-index: 1;
}

.nurturing--main--bg {
    position: relative;
    margin-top: 150px;
}
.nurturing--image {
  width: 100%;
  /* height: 431px;

  overflow: hidden; */
  padding-top: 50px;
}

.nurturing--image img {
  /* display: block; */

  width: 100%;
  /* height: 100%;

  object-fit: cover; */
}

/* =========================================
   RIGHT CONTENT
========================================= */

.nurturing--content {
  padding-bottom: 65px;
}

.nurturing--content > p {
  margin: 0;
  /* font-size: 18px; */

  color: var(--black);
}

/* =========================================
   KNOW MORE
========================================= */

.nurturing--link {
  display: inline-flex;
  align-items: center;

  gap: 22px;

  margin-top: 25px;
  padding-bottom: 6px;

  border-bottom: 1px solid #111111;

  color: #111111;

  font-size: 14px;
  line-height: 16px;

  font-weight: 400;

  text-decoration: none;
}

.nurturing--arrow {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 14px;
  height: 14px;

  transition: transform 0.3s ease;
}

.nurturing--arrow img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: contain;
}

.nurturing--link:hover .nurturing--arrow {
  transform: translateX(4px);
}
/* =========================================
   ASK SUMANT SECTION
========================================= */

.ask--section {
  position: relative;

  width: 100%;
  min-height: 640px;
  background-image: url('../images/home/ask-sumant.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  overflow: hidden;
  padding-left: 130px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 1;
}

/* =========================================
   CONTENT
========================================= */

.ask--content {
  color: #ffffff;
}

/* Heading */

.ask--content h2 {
  margin: 0;
  font-family: LT Superior Serif;
  font-size: 40px;
  line-height: 40px;
  font-weight: 400;

  color: #ffffff;
}

/* Description */

.ask--content > p {
  margin: 15px 0 0;
  font-family: "Inter", sans-serif;
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;

  color: #ffffff;
}

/* =========================================
   SEARCH BOX
========================================= */

.ask--search {
  display: flex;
  align-items: center;

  width: 100%;
  max-width: 500px;
  height: 72px;

  margin-top: 38px;
  padding: 5px 15px 5px 6px;

  box-sizing: border-box;

  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 40px;

  background: rgba(255, 255, 255, 0.72);

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.ask--input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font: inherit;
  color: var(--black);
  margin-left: 2px;
  padding-left: 10px;
}

.ask--input::placeholder {
  color: var(--white);
  opacity: 1;
}

/* =========================================
   COLORFUL ICON
========================================= */

.ask--search-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  flex: 0 0 60px;

  width: 60px;
  height: 60px;

  border-radius: 50%;

  background: #ffffff;
}

.ask--search-icon img {
  display: block;

  width: 34px;
  height: 34px;

  object-fit: contain;
}

/* =========================================
   PLACEHOLDER TEXT
========================================= */

.ask--placeholder {
  flex: 1;

  padding-left: 15px;

  font-size: 14px;
  line-height: 1;

  font-weight: 400;

  color: #666666;
}

/* =========================================
   ARROW BUTTON
========================================= */

.ask--submit {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 40px;
  height: 40px;

  padding: 0;

  border: 0;

  background: transparent;

  cursor: pointer;
}

.ask--submit img {
  display: block;

  width: 20px;
  height: 20px;

  object-fit: contain;
}

/* Hover */

.ask--submit {
  transition: transform 0.3s ease;
}

.ask--submit:hover {
  transform: translateX(4px);
}

/* =========================================
   MOBILE RESPONSIVE STYLES
========================================= */

@media (max-width: 1280px) {
  .banner--info {
	    max-width: 465px;
	    padding: 30px 25px;
	}
	
	.banner--info .qoute--text {
	    font-size: 20px;
	}
	
	.banner--info .banner--about--author h2 {
	    font-size: 20px;
	}
	
	.banner--info .banner--about--author p {
	    font-size: 12px;
	}
  .latest--article .article--item {
      max-width: 300px;
      margin-bottom: 30px;
  }

  .latest--article .article--item .article--thum img {
      height: 122px;
      object-position:top;
  }

  .latest--article .article--item .article--thum img.youtube--play {
      width: 50px;
      height: 50px;
  }
  .spotlight--grid{
    grid-template-rows: 477px;
  }
  .side--articles .spotlight--card .spotlight--image {
      height: 150px;
  }

  .side--articles .spotlight--card {
      align-items: center;
  }

  .side--articles .spotlight--card .spotlight--content--area {
      padding: 5px 10px;
  }

  .side--articles {
      row-gap: 13px;
  }
}
@media (max-width: 1024px) {
  .banner--info {
      max-width: 500px;
      padding: 20px 20px;
  }

  .banner--info .qoute--text {
      font-size: 22px;
  }
  .about--content {
    top: 50px;
    max-width: 470px;
  }
  .about--bg{
    top: 20px;
  }

  .about--quote p {
    font-size: 16px;
  }

  .about--author h2 {
    font-size: 30px;
  }

  .about--author {
    margin-top: 32px;
  }

  .about--author > p {
    font-size: 14px;
  }

  .spotlight--image {
    height: 180px;
  }

  .nurturing--section::before {
    max-width: 180px;
  }

  .nurturing--quote p {
    font-size: 32px;
  }

  .ask--section {
    padding-left: 80px;
    background-size: contain;
    min-height: 453px;
  }

  .ask--content h2 {
    font-size: 32px;
  }

  .ask--content > p {
    font-size: 16px;
  }

  .ask--search {
    max-width: 400px;
  }
}

@media (max-width: 991px) {
  .f--slide--inner .f-slide--thum {
      max-width: 400px;
  }

  .f--slide--inner .f-slide--content {
      padding: 40px;
  }
}
@media (max-width: 768px) {
  /* Banner Section */
   .banner--section {
    position: sticky !important;
    top: 0 !important;

    height: 100svh;
    min-height: 100svh;

    z-index: 1;

    overflow: hidden;
  }
     .about--section {
        position: relative;
        z-index: auto;
        margin-top: 0;
    }

    .top--article {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        padding: 0 15px;
    }
  .top--article {
    padding: 0px 15px;
}
    .latest--article {
        padding-left: 0px !important;
    }
  .latest--article .article--item {
    max-width: 100%;
    margin-bottom: 40px;
    padding: 12px;
  }

  .banner--info {
      max-width: calc(100% - 30px);
      left: 15px;
      bottom: 20px;
      padding: 20px 15px;
  }

  .banner--info .qoute--img {
      width: 20px;
      margin-bottom: 10px;
  }

  .banner--info .qoute--text, .banner--info .banner--about--author h2 {
      font-size: 15px;
  }

  .banner--info .banner--about--author p {
      font-size: 11px;
  }

  .banner--info .banner--about--author {
      margin-top: 15px;
  }
  .banner--info .banner--about--author .banner--about--socials {
      margin-top: 5px;
  }

  /* About Section */
  .about--section {
    min-height: 100vh;
    padding-top: 20px;
  }

  .about--content {
    position: relative;
    top: 0;
    max-width: 100%;
    right: 0;
    padding: 35px;
  }

  .about--quote p {
    font-size: 15px;
  }

  .about--author h2 {
    font-size: 22px;
    line-height: 7px;
  }
  .about--author > p {
    font-size: 12px;
  }

  /* Spotlight Section */

  .spotlight--heading {
      padding-right: 0;
  }
  .slide--left--right img {
      width: 25px;
  }

  .slide--left--right {
      gap: 10px;
  }
  .spotlight--heading h2 {
    font-size: 22px;
  }
  .spotlight--section .custom--container {
    width: 100%;
  }

  .spotlight--grid {
    grid-template-columns: repeat(1, 1fr);
    gap: 12px;
    grid-template-rows: auto;
  }

  .featured--article .spotlight--card {
      min-height: 250px;
  }

  .featured--article .spotlight--card .spotlight--image .youtube--play {
      width: 50px;
  }

  .spotlight--image {
    height: 200px;
  }
  .spotlight--card {
    background: rgb(255 255 255 / 68%);
    /* padding: 15px; */
  }

  .spotlight--card > p {
    font-size: 14px;
    line-height: 20px;
  }

  .featured--article .spotlight--card .spotlight--content--area h3 {
      margin-top: 10px;
      margin-bottom: 0px;
  }

  .featured--article .spotlight--card .spotlight--content--area {
      padding: 15px;
  }

  .featured--article .spotlight--card .spotlight--content--area h3 {
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }

  .side--articles .spotlight--card .spotlight--image {
      width: 120px;
      aspect-ratio: 1 / 1;
      height: 130px;
  }

  .side--articles .spotlight--meta {
      font-size: 10px;
      gap: 5px;
  }

  .side--articles .spotlight--card .spotlight--content--area {
      padding: 8px 10px;
  }

  .side--articles .spotlight--card .spotlight--content--area h3 {
      font-size: 16px;
  }

  .side--articles .spotlight--card .spotlight--content--area .description--content {
      font-size: 12px;
  }

  .side--articles .spotlight--card {
      align-items: center;
  }

  .side--articles .spotlight--card .spotlight--image .arrow--btn img {
      width: 15px;
  }

  .side--articles .spotlight--card .spotlight--image .arrow--btn {
      bottom: 10px;
      right: 10px;
  }

  /* Fossil Free Section */

  .fossil--section {
    padding: 30px 0 50px;
  }
  .fossil--section--desktop{
    display: none;
  }
  .fossil--section--mobile{
    display: block;
  }
  .fossil--section--mobile {
      padding: 0px 15px;
      padding-bottom: 30px;
  }
  .fossil--section--mobile .fossil--swiper .swiper-slide.swiper-slide-active .f--slide--inner, .fossil--section--mobile .fossil--swiper .swiper-slide .f--slide--inner {
      transform: scale(1);
  }
  .fossil--section--mobile .swiper-pagination, .nurturing--mobile .swiper-pagination{
        position: relative;
    top: 0;
    bottom: 0;
    margin: 0;
    padding-top: 40px;
  }
  .fossil--section--mobile .swiper-pagination-bullet-active, .nurturing--mobile .swiper-pagination-bullet-active{
    background: var(--black);
  }

  .fossil--section .custom--container {
    width: 100%;
  }

  .fossil--slide {
    grid-template-columns: 1fr;
    column-gap: 0;
    min-height: auto;
  }

  .fossil--heading {
    position: relative;
    top: 0;
    width: 100%;
    margin-bottom: 0px;
    z-index: 1;
    left: 0;
  }

  .fossil--heading h2 {
    font-size: 22px;
    line-height: 1.2;
  }

  .fossil--image {
    grid-column: auto;
    height: 210px;
    margin-bottom: 15px;
  }

  .fossil--content {
    grid-column: auto;
  }
  .fossil--content > p {
    font-size: 14px;
  }

  .fossil--section--mobile .fossil--swiper .swiper-slide .f--slide--inner {
      flex-direction: column;
  }

  .f--slide--inner .f-slide--content {
      padding: 20px;
      min-height: auto;
      display: block;
  }

  .f--slide--inner .f-slide--thum {
      max-width: 100%;
      min-height: 300px;
  }

  .f--slide--inner .f-slide--content h2 {
      font-size: 22px;
      margin-bottom: 10px;
  }

  .spotlight--section {
      padding-bottom: 40px;
      padding-top: 30px;
  }

  /* Nurturing Section */
  .nurturing--main--bg {
      margin-top: 40px;
  }

  .sticky--top--nurturing {
      position: relative;
  }
  .nurturing--section {
      padding-top: 40px;
      padding-bottom: 0px;
  }
  .nurturing--section .custom--container {
    width: 100%;
  }
  .nurturing--quote p {
    font-size: 18px;
  }
  /* .nurturing--section {
    padding-bottom: 0px;
  } */
  .nurturing--section::before {
    top: 30px;
    left: 20px;
    max-width: 69px;
    height: 50px;
  }

  .nurturing--main {
    width: 100%;
    display: block;
    padding-top: 0;
        padding-right: 15px;
        padding-left: 15px;
  }
  .nurturing--desktop{
    display: none;
  }
  .nurturing--mobile{
    display: block;
  }

  .nurturing--heading h2 {
    font-size: 28px;
    line-height: 1;
  }
/* 
  .nurturing--heading h2 span {
    font-size: 22px;
  } */

  .nurturing--image {
    padding-top: 0;
  }

  .nurturing--content {
    padding-bottom: 0px;
  }

  .nurturing--content > p {
    font-size: 15px;
  }

  /* Ask Section */
  .ask--section {
    min-height: auto;
    padding: 50px 15px;
    background-size: cover;
    background-image: url('../images/home/ai-conviction-mobile.webp');
  }

  .ask--content {
    position: relative;
    top: 0;
    max-width: 65%;
  }

  .ask--content h2 {
font-size: 22px;
    line-height: 1.2;
  }

  .ask--content > p {
    font-size: 12px;
    line-height: 1.3;
  }

  .ask--search {
    width: 100%;
    height: auto;
    padding: 8px 5px;
    max-width: fit-content;
    margin-top: 15px;
  }
  .ask--search-icon {
   width: 20px;
        height: 20px;
        flex: none;
}

.ask--search-icon img {
            width: 12px;
        object-fit: contain;
}

.ask--input {
    font-size: 10px;
}
.ask--submit{
  height: auto;
}
.about--bg{
  position: absolute;
  top: 150px;
}
.banner--bg-image{
  display: none;
}
.banner--bg-image.banner--bg-mobile{
  display: block;
}
  .nurturing--section::after {
      top: 100px;
      right: -90px;
      max-width: 250px;
  }
  .latest--article .article--item .article--thum img {
      height: 150px;
  }

  .latest--article .article--item {
      max-width: 300px;
      margin: 0 auto;
      margin-bottom: 20px;
  }

  .latest--article .article--item .article--thum img.youtube--play {
      height: 50px;
      width: 50px;
  }
}