@media (max-width: 1499px) and (min-width: 1300px) {
    
.dibdsa img {
     
    left: 30%;
    top: 21%;
}
.dibdsa1 img {
     
    right: 30%;
    top: 21%;
}
.heri-bg img {
    margin-top: -204px;
}
.didd { 
    margin-top: -266px;
}
.phaze-right { 
    padding: 23px;
    margin-left: 10px;
}


.phaze-left {
    padding: 33px 22px 0; 
    margin-right: 10px;
}

.hp-content h2 {
    font-size: 38px;
    
}

/* hair-assess.html polaroid stack (110% zoom range) */
.phaze-images {
    min-height: 420px;
}

.phaze-images .polaroid {
    width: 220px;
    padding: 9px 9px 40px 9px;
}

.phaze-images .img-1.img-11 {
    top: 18px;
    left: 30px;
    transform: rotate(12deg);
    z-index: 1;
}

.phaze-images .img-2.img-22 {
    top: 86px;
    right: 18px;
    transform: rotate(-10deg);
    z-index: 2;
}

.phaze-images .img-3.img-33 {
    bottom: 125px;
    left: 118px;
    transform: rotate(-4deg);
    z-index: 3;
}

/* science.html (110% zoom range) */
.sscien {
    font-size: 38px;
    margin-bottom: 42px;
}

.scinevd h2 {
    font-size: 36px;
}

.science-content p {
    font-size: 16px;
    line-height: 1.55;
}

.ingredient-grid {
    gap: 18px;
}

.ingredient-card h4 {
    font-size: 17px;
}

.ingredient-card p {
    font-size: 15px;
}

.card-tilt-1,
.card-tilt-2,
.card-tilt-3,
.card-tilt-4 {
    transform-origin: center;
}

.heading3 .hl-heading {
    font-size: 35px;
}

.natre,
.bota,
.oilds,
.antii {
    margin-left: 0;
}

.bota,
.antii {
    margin-top: 20px;
}

.oilds,
.antii {
    margin-right: 0 !important;
}

.card-tilt-1 {
    transform: rotate(3deg) translateY(-14px) translateX(0);
}

.card-tilt-2 {
    transform: rotate(3deg) translateY(6px) translateX(4px);
}

.card-tilt-3 {
    transform: rotate(3deg) translateY(-14px) translateX(-26px);
}

.card-tilt-4 {
    transform: rotate(3deg) translateY(8px) translateX(-22px);
}

.natre {
    transform: rotate(-6deg);
}

.bota {
    transform: rotate(6deg);
    margin-top: 36px;
}

.oilds {
    transform: rotate(6deg);
}

.antii {
    transform: rotate(-6deg);
    margin-top: 36px;
}

.reguster h2 {
    font-size: 36px;
}

.reguster p {
    font-size: 24px;
}

.certigifcs {
    transform: translate(0, 20px);
}

/* science certificate cards */
.about5 .about5-images .cert-card {
    min-height: 330px;
}

.about5 .about5-images .cert-card > img {
    min-height: 330px;
    object-fit: cover;
}

.about5 .about5-images .cert-overlay {
    padding: 20px 16px;
}

.about5 .about5-images .cert-overlay img.cert-icon {
           max-width: 90px;
        margin-bottom: 20px;
}

.about5 .about5-images .cert-overlay h4 {
    font-size: 15px;
    line-height: 1.28;
    margin-bottom: 8px;
}

.about5 .about5-images .cert-overlay p {
    font-size: 13px;
    line-height: 1.35;
}

.about5 .about5-images .cert-overlay h4,
.about5 .about5-images .cert-overlay p {
    overflow-wrap: anywhere;
}
.choose2-single-apps .apps-info p { 
    font-size: 13px; 
}
.insights-text h2 {
    font-size: 34px;
    
}

.philosophy-box-content { 
    max-width: 100%;
}


.philosophy-box-content p {
    
    font-size: 15px;
   
}

.philosophy-promise-item { 
    padding: 15px 0px 22px;
    
}

.faq-container {
    max-width: 1100px; 
 
}

.iv-footer-content { 
            font-size: 11px;
     
}











}











/* =================================================
   DESKTOP TIGHT (125% zoom range)
================================================= */
@media (max-width: 1299px) and (min-width: 1150px) {
   
.heri-bg img {
    margin-top: -186px;
}
.philosophy-box-content p { 
    font-size: 15px; 
}

.philosophy-promise-item { 
    padding: 15px 0px 22px;
    
}
.choose2-single-apps .nocomp p {
   
    font-size: 13px;
    
}
.philosophy-box-content { 
    max-width: 100%;
}
.insights-visual {  
    left: 600px;
}
.insights-text h2 {
    font-size: 34px; 
}
.choose2-single-apps .apps-info p 
 { 
    font-size: 14px;
   
}
.dibdsa img { 
    left: 28%;
    top: 22%;
}
.dibdsa1 img { 
    right: 28%;
    top: 22%;
}

.faq-container {
    max-width: 1100px; 
}
.hero2-floating-cards {  
    right: 19%;
    top: 47%;
    
}
.hero2-floating-cards-right {  
    left: 19%;
    top: 47%;
    
}
.hero2-extra-text { 
          left: 32%;
        top: 47%;
    
}
.hero2-extra-text2 { 
    right: 17%;
    top: 36%;
    
}
.iv-footer-content { 
    font-size: 10px;
     
}

/* hair-assess.html polaroid stack (125% zoom range) */
.phaze-images {
    min-height: 365px;
}

.phaze-images .polaroid {
    width: 240px;
    padding: 8px 8px 34px 8px;
}

.phaze-images .img-1.img-11 {
    top: 10px;
    left: 18px;
    transform: rotate(10deg);
    z-index: 1;
}

.phaze-images .img-2.img-22 {
    top: 70px;
    right: 8px;
    transform: rotate(-9deg);
    z-index: 2;
}

.phaze-images .img-3.img-33 {
           bottom: 104px;
    left: 92px;
    transform: rotate(-4deg);
    z-index: 3;
}

/* science.html (125% zoom range) */
.sscien {
    font-size: 34px;
    margin-bottom: 30px;
    text-align: left;
}

.scinevd h2 {
    font-size: 31px;
    line-height: 1.35;
}

.science-content p {
    font-size: 16px;
    line-height: 1.55;
}

.science-content span {
    font-size: 19px;
}

.ingredient-grid {
    gap: 14px;
}

.ingredient-card {
    padding: 8px;
}

.ingredient-card h4 {
    font-size: 16px;
}

.ingredient-card p {
    font-size: 14px;
    line-height: 1.45;
}

.card-tilt-1,
.card-tilt-2,
.card-tilt-3,
.card-tilt-4 {
    transform-origin: center;
}

.heading3 .hl-heading {
    font-size: 30px;
    line-height: 1.3;
}

.natre,
.bota,
.oilds,
.antii {
    margin-left: 0;
}

.bota,
.antii {
    margin-top: 20px;
}

.oilds,
.antii {
    margin-right: 0 !important;
}

.card-tilt-1 {
    transform: rotate(2deg) translateY(-8px) translateX(0);
}

.card-tilt-2 {
    transform: rotate(2deg) translateY(4px) translateX(2px);
}

.card-tilt-3 {
    transform: rotate(2deg) translateY(-8px) translateX(-14px);
}

.card-tilt-4 {
    transform: rotate(2deg) translateY(4px) translateX(-12px);
}

.natre {
    transform: rotate(-4deg);
}

.bota {
    transform: rotate(4deg);
    margin-top: 28px;
}

.oilds {
    transform: rotate(4deg);
}

.antii {
    transform: rotate(-4deg);
    margin-top: 28px;
}

.scinece p {
    font-size: 16px;
}

.info-title {
    font-size: 18px;
}

.info-title img {
    width: 42px;
    height: 42px;
}

.certigifcs {
    transform: translate(0, 0);
}

.reguster h2 {
    font-size: 32px;
}

.reguster p {
    font-size: 21px;
}

.details-list-item ul li {
    font-size: 15px;
}

/* science certificate cards */
.about5 .about5-images .cert-card {
    min-height: 320px;
}

.about5 .about5-images .cert-card > img {
    min-height: 320px;
    object-fit: cover;
}

.about5 .about5-images .cert-overlay {
    padding: 16px 12px;
}

.about5 .about5-images .cert-overlay img.cert-icon {
           max-width: 100px;
        margin-bottom: 15px;
}

.about5 .about5-images .cert-overlay h4 {
    font-size: 14px;
    line-height: 1.24;
           margin-bottom: 20px;
}

.about5 .about5-images .cert-overlay p {
    font-size: 12px;
    line-height: 1.3;
}

.about5 .about5-images .cert-overlay h4,
.about5 .about5-images .cert-overlay p {
    overflow-wrap: anywhere;
}











    
}


@media (max-width: 767px) { 

    .heri-bg img {
        display: none;
    }
 
.dibdsa img { 
    left: 16%;
    top: 17%;
     z-index: 3;
}
.dibdsa1 img { 
    right: 16%;
    top: 17%;
     z-index: 3;
}

.hero2-floating-cards {
    position: absolute;
    right: 45%;
    top: 24%;  
}

.hero2-floating-cards-right {
    position: absolute;
    left: 45%;
    top: 24%;  
}

.hero2-float-card { 
    width: 206px;  
}

.didd {
   display: none;
}
 
.hero2-extra-text {
    position: static;
    left: auto;
    top: auto;
    max-width: 100%;
    margin: 24px auto 0;
    padding: 0 16px;
    text-align: center;
}
.hero2-extra-text p {
    font-size: 15px;
    line-height: 1.65;
    margin-bottom: 18px;
}
.hero2-extra-text2 {
    position: absolute;
    right: 7%;
    top: 70%;  
}
.uvhair-section { 
    padding-top:0px ;
    padding-bottom: 0px; 
}

.uvhair-title .split-line {
    display: inline !important;
} 

/* keep "You protect your face every morning." on one line (remove forced <br>) */
h2.uvhair-title + br + p.uvhair-intro br {
    display: none;
}
/* text-anime split-line wrapper should not force new lines on mobile */
.uvhair-section .uvhair-content p.uvhair-intro .split-line {
    display: inline !important;
}
 .uvhair-intro {  
    font-size: 20px;
    line-height: 1.4;
}
.uvhair-card {
    position: relative;
}

.botanical .dual-action-pair img { 
    max-width: 190px; 
}
 .botanical { 
    top: 28px;
    left: 2px;
}
.uvhair-p1 {
    top: 0px;
    left: 0px;
    transform: rotate(0deg);
    z-index: 1;
}
 
.uvhair-p2 {
    top: -68px;
    right: 0px;
    transform: rotate(0deg);
    z-index: 2;
}
 
    .uvhair-p3 {
        bottom: 140px;
        left: 0px;
        transform: rotate(0deg);
        z-index: 3;
    }

.uvhair-p4 {
    bottom: 214px;
    right: 0px;
    transform: rotate(0deg);
    z-index: 4;
}
.phaze-title {
    font-size: 28px;
}
.ourday::before { 
    height: 50px;
     
}
.uvhair-content  {
    padding: 5px;
}

 .restotre .col-lg-3,
 .restotre .col-lg-6
 {
  padding-right: 15px;
    padding-left: 15px;
 }

.phaze-right { 
    gap: 15px;
    padding: 12px;
}

.phaze-right p {
    font-size: 16px;
    
}
.phaze-icon {
    width: 88px;
    height: 88px; 
}
.phaze-right h4 {
    font-size: 22px; 
}
 
.phaze-left img {
    width: 40%;
    display: block;
    margin-top: -45px;
    margin-left: 171px;
}


.main-heading4 {
    padding-right: 0px;
    padding-top: 30px;
}


    .main-heading4 h1 {
        font-size: 27px; 
    }

.hero444-flex {
    display: flex; 
    justify-content: center;
    
    
}
.hero555-image { 
    width: 350px; 
}

.uvhair-desc {
    font-size: 17px; 
    margin-top: 0px;
    
}
.phaze-titleee {
    font-size: 31px; 
}

.phaze-box { 
    border-radius: 68px;
       padding: 40px 25px 40px 25px;
    
}

.polaroid {
    position: relative; 
    width: 290px;
}


.img-1 {
    top: 50px;
    left: 31px;
    transform: rotate(13deg);
    z-index: 1;
}

.img-2 {
    top: 52px;
    right: -28px;
    transform: rotate(-12deg);
    z-index: 2;
}
.img-3 {
    bottom: -58px;
    left: 25px;
    transform: rotate(13deg);
    z-index: 3;
}
    .phaze-images { 
    margin-bottom: 100px;
    margin-top: 32px;
}
.hp-content h2 {
    font-size: 27px; 
    margin-bottom: 30px;
    margin-top: 38px;
}

.choose3-main-images {
   height: 180px;
        top: -21px;
        width: 100%;
        max-width: 320px;
        left: 50px;
    margin: 0 auto;
}
 

.choose3-main-images .image {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: 6px;
    height: 100%;
    justify-content: center;
}

.choose3-main-images .choose3-product {
    max-width: 100%;
    max-height: 238px;
    margin: 0 auto;
}

.choose3-main-images .choose3-product-berry {
    transform: translateY(6px);
}

.choose3-main-images .choose3-product-aqua {
    transform: translateY(0);
}

.product-img img { 
    margin-left: 0px;
}
 
    .float-card {
        position: absolute; 
    }

    .l1 {
    top: 97px;
    left: 24px;
}
.l2 {
    top: 113px;
    left: 21px;
}

.r1 {
    top: 240px;
    right: 168px;
}
.r2 {
    top: 315px;
    right: 188px;
}
    .r3 {
        top: 438px;
        right: 151px;
    }
.iv-footer-content {
    flex-direction: column;
    gap: 8px;
    font-size: 16px;
    align-items: start;
  }

  .iv-divider {
    display: none;
  }
.vl-footer-contact2 .single-contact-item .text a { 
    padding-left: 0px; 
}
.vl-footer-contact2 .single-contact-item {
     
    padding: 7px 0px;
}
.vl-footer-widget-white h4 { 
    padding-bottom: 10px;
}
.vl-header-area2 {
        top: 0px;
    }
    .vl-logo {
        margin-left: 20px;
    }


    /* GRID → SINGLE COLUMN */
  .pin-board-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "card1"
      "card2"
      "card3"
      "card4"
      "card5";
    gap: 60px;
    padding: 20px 0;
  }

  /* RESET CENTER CARD */
  .center-card {
    grid-column: auto;
    margin-top: 0;
  }

  /* REMOVE ALL SCATTERED TRANSFORMS */
  .card-1,
  .card-2,
  .card-3,
  .card-4,
  .card-5 {
    transform: none;
  }

  /* CARD SIZE */
  .pin-card {
    width: 100%;
    max-width: 100%;
           padding: 50px 0px 0px;
  }

  /* PIN SIZE + POSITION */
  .pin {
    top: -22px;
  }

  .pin img {
    width: 48px;
  }

  /* INNER CARD STACK */
  .pin-inner {
    flex-direction: column;
    align-items: flex-start;
    min-height: auto;
    padding: 20px;
  }

  /* TEXT */
  .pin-text {
   max-width: 203px;
        margin-left: 13px;
  }

  .pin-text h4 {
    font-size: 20px;
  }

  .pin-text p {
    font-size: 14px;
  }

  /* IMAGE → MOVE BELOW TEXT */
  .pin-bg-img {
    position: relative;
    width: 100%;
            max-width: 350px;
        margin-top: -195px;
    right: auto;
    top: auto;
  }

 .faq-tabs {
    position: relative;
    top: auto;
  }

.faq-section { 
    padding: 80px 20px;
}

.faq-container {
  grid-template-columns: 1fr;
  gap: 24px;
}

.faq-question,
.faq-answer {
  text-align: left;
  font-size: 17px;
}

.sscien {
    font-size: 39px; 
    margin-bottom: 0px;
    text-align: left;   
}

.scinevd h2 {
    font-size: 36px; 
}
.scinevd  span{
       margin-bottom: 25px; 
}


.card-tilt-1 {
    transform: rotate(0deg) translateY(14px) translateX(0px);
}
.card-tilt-2 {
    transform: rotate(0deg) translateY(14px) translateX(0px);
}
.card-tilt-3 {
    transform: rotate(0deg) translateY(14px) translateX(0px);
}
.card-tilt-4 {
    transform: rotate(0deg) translateY(14px) translateX(0px);
}

.heading3 .hl-heading {
    font-size: 31px; 
}

 .natre {
    margin-left: 0;
    transform: rotate(0deg);
}
.bota {
    margin-left: 0px;
    transform: rotate(0deg);
    margin-top: 20px;
}

.scinece p {
 
    font-size: 17px;
    
    font-weight: 450;
}

.info-title { 
    font-size: 20px;
}


.info-title img {
    width: 50px;
    height: 50px;  
}
.oilds {
    margin-left: 0px;
    transform: rotate(0deg);
}
.antii {
    margin-left: 0px;
    transform: rotate(0deg);
    margin-top: 20px;
}
 
.certigifcs {
    transform: translate(0px, 0px);
}
.whoss {
    font-size: 39px;
    text-align: left;
}


.sapce {
    height: auto;
}


.heading2 .scinec {     
    margin-top: 16px;
}

.choose2-single-apps {
    
    margin-left: 0px;
}
.syats img {
    width: 76px;
}

.choose2-single-apps .apps-info p {  
    font-size: 21px;
    
}

.uvhair-title {
    font-size: 27px;
    margin-top: 7px;
}

.transfrmati {
        padding: 2px 0 60px;
        margin-top: -100px;
}
.beery img {
    width: auto;  
}
.rec38::before { 
    height: 42px; 
    left: -50px;
    right: -220px;
    top: 50%;
}


.product-img-one img {
    max-width: 96%; 
    margin-top: 20px;
}
.white-heading p { 
    font-size: 19px; 
}

.vl-offcanvas-menu ul li a {
    padding: 13px 7px; 
}


}

/* Legal and reference pages */
.policy-page {
  overflow-x: hidden;
}

.policy-page .policy-shell,
.policy-page .policy-card,
.policy-page .policy-content {
  min-width: 0;
}

.policy-page .policy-content p,
.policy-page .policy-content li,
.policy-page .policy-content a,
.policy-page .policy-content h2,
.policy-page .policy-content h3 {
  overflow-wrap: anywhere;
  word-break: normal;
}

.policy-page .policy-content ul,
.policy-page .policy-content ol {
  list-style-position: outside !important;
}

.policy-page .policy-content ul {
  list-style: none !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
}

.policy-page .policy-content ol {
  counter-reset: policy-reference;
  list-style: none !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
}

.policy-page .policy-content li {
  display: list-item !important;
}

.policy-page .policy-content ol > li {
  counter-increment: policy-reference;
  display: block !important;
  position: relative;
  padding-left: 34px;
}

.policy-page .policy-content ul > li {
  display: block !important;
  position: relative;
  padding-left: 24px;
}

.policy-page .policy-content ul > li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.78em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #5b536f;
}

.policy-page .policy-content ol > li::before {
  content: counter(policy-reference) ".";
  position: absolute;
  left: 0;
  top: 0;
  min-width: 24px;
  color: #5b536f;
  font-weight: 700;
  text-align: right;
}

.policy-page .policy-content li::marker {
  color: #5b536f;
  font-weight: 700;
}

@media (max-width: 991px) {
  .policy-page .policy-hero {
    padding: 120px 0 56px !important;
  }

  .policy-page .policy-shell {
    max-width: 100% !important;
  }

  .policy-page .policy-card {
    padding: 34px 26px !important;
    border-radius: 22px !important;
  }

  .policy-page .policy-title {
    font-size: 34px !important;
    line-height: 1.12 !important;
  }

  .policy-page .policy-content h2 {
    font-size: 23px !important;
    line-height: 1.28 !important;
  }
}

@media (max-width: 767px) {
  .policy-page .container {
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .policy-page .policy-hero {
    padding: 1200px 0 42px !important;
  }

  .policy-page .policy-card {
    padding: 26px 18px !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(46, 32, 77, 0.08) !important;
  }

  .policy-page .policy-title {
    font-size: 30px !important;
    line-height: 1.15 !important;
  }

  .policy-page .policy-intro,
  .policy-page .policy-content p,
  .policy-page .policy-content li {
    font-size: 15px !important;
    line-height: 1.72 !important;
  }

  .policy-page .policy-content h2 {
    margin-top: 28px !important;
    font-size: 21px !important;
    line-height: 1.3 !important;
  }

  .policy-page .policy-content h3 {
    margin-top: 22px !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
  }

  .policy-page .policy-content ul,
  .policy-page .policy-content ol {
    margin-left: 0 !important;
  }

  .policy-page .policy-content ul {
    padding-left: 0 !important;
  }

  .policy-page .policy-content ol {
    padding-left: 0 !important;
  }

  .policy-page .policy-content ol > li {
    padding-left: 32px;
  }

  .policy-page .policy-content ul > li {
    padding-left: 24px;
  }

  .policy-page footer .row {
    row-gap: 8px;
  }

  .policy-page footer [class*="col-"] {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
  }

  .policy-page footer .vl-footer-widget-white,
  .policy-page footer .vl-footer-widget-white2,
  .policy-page footer .vl-footer-contact2 {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 28px !important;
  }

  .policy-page footer br {
    display: none;
  }

  .policy-page .iv-footer-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 10px;
    line-height: 1.5;
    text-align: center;
  }

  .policy-page .iv-footer-content .iv-divider {
    display: none;
  }
}

@media (max-width: 420px) {
  .policy-page .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .policy-page .policy-card {
    padding: 22px 14px !important;
    border-radius: 16px !important;
  }

  .policy-page .policy-content ul {
    padding-left: 0 !important;
  }

  .policy-page .policy-content ol {
    padding-left: 0 !important;
  }

  .policy-page .policy-content ol > li {
    padding-left: 30px;
  }

  .policy-page .policy-content ul > li {
    padding-left: 22px;
  }

  .policy-page .policy-title {
    font-size: 26px !important;
  }

  .policy-page .policy-content h2 {
    font-size: 19px !important;
  }
}
























 
