/* RESET */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:"Inter", sans-serif;
  color:#0c1323;
  background:#fff;
  overflow-x:hidden;
}

img{max-width:100%; display:block;}
a{text-decoration:none; color:inherit;}


/* =========================
   NAVBAR
========================= */
.navbar{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  z-index:1000;
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.06);
  padding:14px 0;
}

.container{
  width:86%;
  margin:auto;
}

.nav-content{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.logo img{
  height:42px;
}

.nav-links{
  display:flex;
  gap:28px;
  list-style:none;
}

.nav-links a{
  font-weight:600;
  padding:6px 10px;
  border-radius:10px;
  transition:.25s;
}

.nav-links a:hover,
.nav-links .active{
  background:#9A0059;
  color:#fff;
}

.menu-btn{
  display:none;
  font-size:30px;
  font-weight:900;
  cursor:pointer;
}
@media(max-width:820px){

  .menu-btn{display:block;}

  .nav-links{
    position:absolute;
    top:100%;right:0;width:100%;
    flex-direction:column;
    background:#fff;
    padding:18px 0;
    text-align:center;
    gap:14px;
    opacity:0;
    pointer-events:none;
    transform:translateY(-10px);
    transition:.25s;
  }

  .nav-links.show{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
  }

  .left-img,.right-img{display:none;}

  .hero{
    height:auto;
    padding:120px 0 80px;
  }

  .title{font-size:40px;}
  .store-btns img{height:95px;}

  .works-wrap{
    grid-template-columns:1fr;
    gap:40px;
  }

  .works-title{font-size:40px;}
  .works-visuals{display:none;}

  .stats-grid{
    grid-template-columns:1fr;
    gap:40px;
  }
}

/* ==========================
   SAFETY PAGE HERO
========================== */

.safety-hero{
  position: relative;
  padding: 140px 6% 140px;
  text-align: center;
  height: 100vh;
  overflow: hidden;
}

.safety-content{
  max-width: 820px;
  margin: auto;
  margin-top: 120px;
  z-index: 3;
  position: relative;
}

.safety-content h2{
  font-size: 56px;
  color: #0B1220;
  margin-bottom: 14px;
}

.safety-content p{
  font-size: 20px;
  color: #374151;
  line-height: 1.6;
  margin-bottom: 30px;
}

.safety-btn{
  display: inline-block;
  background: #b5006a;
  color: #fff;
  padding: 14px 28px;
  font-weight: 700;
  border-radius: 12px;
  transition: .25s;
}

.safety-btn:hover{
  transform: translateY(-2px);
}


/* CHARACTER IMAGES */

.safety-img{
  position: absolute;
  bottom: 0;
  height: 70%;
  object-fit: contain;
  z-index: 1;
}

.safety-img.left{
  left: 0;
}

.safety-img.right{
  right: 0;
}


/* RESPONSIVE */
@media(max-width: 900px){

  .safety-img{
    opacity:.15;
    height: 60%;
  }

  .safety-content h2{
    font-size: 40px;
  }

  .safety-content p{
    font-size: 16px;
  }
}
/* ==========================
   SAFETY PAGE HERO
========================== */

.safety-hero{
  position: relative;
  padding: 140px 6% 140px;
  text-align: center;
  height: 100vh;
  overflow: hidden;
}

/* CONTENT */
.safety-content{
  max-width: 820px;
  margin: 120px auto 0;
  z-index: 3;
  position: relative;
}

.safety-content h2{
  
  font-size: 56px;
  color: #0B1220;
  margin-bottom: 14px;
}

.safety-content p{
  font-size: 20px;
  color: #374151;
  line-height: 1.6;
  margin-bottom: 30px;
}

.safety-btn{
  display: inline-block;
  background: #b5006a;
  color: #fff;
  padding: 14px 28px;
  font-weight: 700;
  border-radius: 12px;
  transition: .25s;
}

.safety-btn:hover{
  transform: translateY(-2px);
}

/* CHARACTERS */
.safety-img{
  position: absolute;
  bottom: 0;
  height: 70%;
  object-fit: contain;
  z-index: 1;
}

.safety-img.left{ left: 0; }
.safety-img.right{ right: 0; }

/* ==========================
   RESPONSIVE
========================== */

/* Tablets */
@media(max-width: 1024px){
  .safety-content h2{
    font-size: 44px;
  }
}

/* Mid tablets / fold phones */
@media(max-width: 900px){

  .safety-img{
    opacity: .15;
    height: 55%;
  }

  .safety-content h2{
    font-size: 36px;
  }

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

/* Phones — HIDE IMAGES COMPLETELY */
@media(max-width: 640px){

  .safety-img{
    display: none;
  }

  .safety-hero{
    height: auto;
    padding: 130px 6% 80px;
  }

  .safety-content{
    margin-top: 40px;
  }

  .safety-content h2{
    font-size: 28px;
  }

  .safety-content p{
    font-size: 14px;
  }
}
.verify-section{
  padding: 90px 6%;
}

.verify-wrap{
  max-width: 900px;
  margin: auto;
  text-align: center;
}

/* TEXT ONLY */
.verify-text{
  max-width: 680px;
  margin: auto;
}

.verify-badge{

  color: #0c1323;
  font-size: 34px;
  margin-bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.verify-badge i{
  color: #9A0059;
  font-size: 30px;
}

.verify-heading{

  font-size: 28px;
  margin-bottom: 12px;
  color: #0c1323;
}

.verify-desc{
  font-size: 17px;
  line-height: 1.7;
  color: #333;
  margin-bottom: 20px;
}

.verify-list{
  list-style: none;
  padding: 0;
}

.verify-list li{
  font-size: 17px;
  margin: 10px 0;
  position: relative;
  padding-left: 22px;
}

.verify-list li::before{
  content: "➤";
  position: absolute;
  left: 0;
  color: #9A0059;
}

/* SAFE BLOCK — TEXT ONLY */
.safe-block{
  padding: 90px 6%;
}

.safe-text{
  max-width: 900px;
  margin: auto;
}

.safe-text h4{
  margin: 10px 0 10px;
}

.safe-list{
  list-style: none;
  padding: 0;
}

.safe-list li{
  margin: 8px 0;
}

  /* WRAPPER */
.safe-block{
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: center;
  gap: 60px;
  padding: 110px 6%;
  background: #FFF7E9;
}

.verify-section{
  padding: 90px 6%;
  text-align: center;
}

/* Head section */
.verify-badge{

  font-size: 34px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #0c1323;
}

.verify-badge i{
  color: #9A0059;
}

.verify-heading{

  font-size: 28px;
  margin: 10px 0;
  color: #0c1323;
}

.verify-desc{
  max-width: 720px;
  margin: auto;
  color: #444;
  line-height: 1.7;
}

/* CARD GRID */
.verify-cards{
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

/* CARD STYLE */
.verify-card{
  background: #fff;
  border-radius: 22px;
  padding: 22px 22px 26px;
  text-align: left;
  box-shadow: 0 30px 70px rgba(0,0,0,.08);
  transition: .25s ease;
}

.verify-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 45px 90px rgba(0,0,0,.12);
}

/* CARD TITLE */
.verify-card h4{
  margin-bottom: 10px;
  font-size: 18px;
  color: #0c1323;
}

/* LIST */
.verify-card ul{
  padding-left: 18px;
}

.verify-card li{
  margin: 8px 0;
}

/* RESPONSIVE */
@media (max-width: 950px){
  .verify-cards{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px){
  .verify-cards{
    grid-template-columns: 1fr;
  }
}
/* CARD ICON */
.verify-icon{
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: #fdf1f8;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}

.verify-icon i{
  color: #9A0059;
  font-size: 22px;
}
/* SECTION */
.verify-section{
  padding: 90px 6%;
  text-align: center;
}

/* HEADER */
.verify-badge{

  font-size: 34px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #0c1323;
}

.verify-badge i{
  color: #9A0059;
}

.verify-heading{

  font-size: 28px;
  margin: 10px 0;
  color: #0c1323;
}

.verify-desc{
  max-width: 720px;
  margin: auto;
  color: #444;
  line-height: 1.7;
}

/* GRID */
.verify-cards{
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

/* CARD */
.verify-card{
  background: #fff;
  border-radius: 22px;
  padding: 22px 22px 26px;
  text-align: left;
  box-shadow: 0 30px 70px rgba(0,0,0,.08);
  transition: .25s ease;
}

.verify-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 45px 90px rgba(0,0,0,.12);
}

/* ICON */
.verify-icon{
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: #fdf1f8;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}

.verify-icon i{
  color: #9A0059;
  font-size: 22px;
}

/* LIST */
.verify-card ul{
  padding-left: 18px;
}

.verify-card li{
  margin: 8px 0;
}

/* ==========================
        RESPONSIVE
========================== */

/* Large tablets / small laptops */
@media (max-width: 1024px){
  .verify-section{
    padding: 75px 5%;
  }

  .verify-cards{
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Tablets portrait */
@media (max-width: 820px){
  .verify-heading{ font-size: 24px; }
  .verify-badge{ font-size: 30px; }
}

/* Big phones / small tablets */
@media (max-width: 650px){
  .verify-cards{
    grid-template-columns: 1fr;
  }

  .verify-card{
    padding: 20px 18px;
  }
}

/* Small phones */
@media (max-width: 430px){
  .verify-section{
    padding: 60px 4%;
  }

  .verify-heading{ font-size: 20px; }
  .verify-badge{ font-size: 26px; }
}


/* IMAGE */
.safe-img img{
  max-width: 430px;
  width: 100%;
  border-radius: 22px;
  box-shadow: 0 25px 45px rgba(0,0,0,.15);
}

/* TEXT */
.safe-text h4{
  font-size: 22px;
  margin: 10px 0 10px;
  color: #0B1220;
}

.safe-text p{
  font-size: 17px;
  line-height: 1.7;
  color: #333;
  margin-bottom: 16px;
}

.safe-list{
  list-style: none;
  margin-top: 10px;
}

.safe-list li{
  margin: 8px 0;
  font-size: 16px;
}

.safe-list i{
  color: #ffb703;
  margin-right: 8px;
}

/* place image LEFT */
.safe-left{
  grid-template-columns: 1fr 1.2fr;
}

/* -------------------
   RESPONSIVE
-------------------*/

@media(max-width: 900px){

  .safe-block,
  .safe-left{
    grid-template-columns: 1fr;
    text-align: center;
  }

  .safe-img{
    order: -1;
  }

  .safe-img img{
    max-width: 340px;
    margin: auto;
  }
}

@media(max-width: 480px){

  .safe-text p{
    font-size: 15px;
  }

  .safe-list li{
    font-size: 14px;
  }
}