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

html, body{
  margin:0;
  padding:0;
}

body{
  font-family:'Inter', sans-serif;
}

/* ================= CONTAINER ================= */
.container{
  width:90%;
  max-width:1200px;
  margin:auto;
}

/* ================= HERO ================= */
/* ================= HERO ================= */
.hero{
  position:relative;

  min-height:100vh;

  padding:80px 0 120px;

  color:#fff;

  display:flex;
  flex-direction:column;
  justify-content:flex-start;

  padding-top:15px;

  background:
    linear-gradient(
      90deg,
      rgba(4,10,20,0.92) 25%,
      rgba(4,10,20,0.72) 55%,
      rgba(4,10,20,0.35) 100%
    ),
    url('https://images.unsplash.com/photo-1520607162513-77705c0f0d4a?q=80&w=1920&auto=format&fit=crop');

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  overflow:hidden;
}

.logo img{
  height:80px;
  object-fit:contain;
}

@media(max-width:768px){
  .logo img{
    height:80px;
  }
}

/* ================= HEADER ================= */
.hero-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 0;
}

/* LOGO */
.logo{
  line-height:1;
}

.logo h2{
  font-size:22px;
  font-weight:700;
  letter-spacing:1px;
}

.logo p{
  font-size:12px;
  color:#D42716;
}

/* MENU */
.menu{
  display:flex;
  gap:25px;
}

.menu a{
  color:#fff;
  text-decoration:none;
  font-size:14px;
  transition:0.3s;
}

.menu a:hover{
  color:#D42716;
}

/* MENU TOGGLE */
.menu-toggle{
  display:none;
  font-size:26px;
  color:#fff;
  cursor:pointer;
}

/* CLOSE BUTTON */
.close-btn{
  display:none;
}

/* RIGHT */
.header-right{
  text-align:right;
}

.header-right p{
  font-size:11px;
  color:#ccc;
}

.header-right h3{
  color:#D42716;
  font-size:20px;
}

/* ================= CONTENT ================= */
.hero-content{
  margin-top:10px;
  max-width:600px;
}

.tag{
  color:#D42716;
  font-size:13px;
  margin-bottom:15px;
}

.hero h1{
  font-size:54px;
  font-weight:700;
  line-height:1.2;
}

.hero span{
  color:#D42716;
}

.desc{
  margin:20px 0;
  color:#ddd;
  line-height:1.6;
}

/* FEATURES */
.features{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
  margin-bottom:25px;
}

/* BUTTONS */
.hero-btns{
  display:flex;
  gap:15px;
}

.btn-call{
  background:#D42716;
  color:#fff;
  padding:15px 22px;
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
}

.btn-wa{
  border:2px solid #25D366;
  color:#25D366;
  padding:15px 22px;
  border-radius:6px;
  text-decoration:none;
}

/* PRIVACY */
.privacy{
  margin-top:10px;
  font-size:12px;
  color:#aaa;
}

/* ================= TRUST BAR ================= */
.trust-bar{
  width:80%;
  background:#fff;
  margin:-30px auto 0; /* CENTER FIX */
  padding:25px 0;
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,0.1);
  position:relative;
  z-index:5;
}

/* FULL WIDTH FIX */
.trust-bar .container{
  width:100%;
  max-width:100%;
  padding:0 20px;
}

/* GRID */
.trust-flex{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  align-items:center;
  text-align:center;
}

/* ITEM */
.trust-item{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  position:relative;
  padding:10px 15px;
}

/* ICON */
.trust-item .icon{
  font-size:26px;
  color:#D42716;
}

/* TEXT */
.trust-item h3{
  font-size:18px;
  color:#000;
}

.trust-item p{
  font-size:13px;
  color:#666;
}

/* DIVIDER */
.trust-item:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  width:1px;
  height:40px;
  background:#ddd;
}

/* ================= OVERLAY ================= */
.overlay{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.6);
  opacity:0;
  visibility:hidden;
  transition:0.3s;
  z-index:998;
}

.overlay.active{
  opacity:1;
  visibility:visible;
}

/* ================= MOBILE ================= */
@media(max-width:768px){

  .hero{
    padding:15px 15px 20px;
  }

  .hero-header{
    padding:10px 0;
  }

  .logo h2{
    font-size:18px;
  }

  /* MENU BUTTON */
  .menu-toggle{
    display:block;
  }

  /* MOBILE MENU */
  .menu{
    position:fixed;
    top:0;
    right:-100%;
    width:260px;
    height:100%;
    background:#0B0F1A;
    flex-direction:column;
    padding:60px 20px;
    transition:0.3s;
    z-index:999;
  }

  .menu.active{
    right:0;
  }

  .menu a{
    margin:15px 0;
    font-size:16px;
  }

  /* CLOSE BUTTON */
  .close-btn{
    display:block;
    position:absolute;
    top:15px;
    right:20px;
    font-size:22px;
    color:#fff;
    cursor:pointer;
  }

  /* CONTENT */
  .hero-content{
    margin-top:5px;
  }

  .hero h1{
    font-size:26px;
  }

  .desc{
    font-size:14px;
  }

  .features{
    grid-template-columns:1fr;
  }

  .hero-btns{
     display:inline-flex;
   align-items:center;
   justify-content:center;
   text-decoration:none;
   -webkit-tap-highlight-color: transparent;
   touch-action: manipulation;
  }

  .btn-call,
  .btn-wa{
    width:100%;
    text-align:center;
  }

  .header-right{
    display:none;
  }

  /* TRUST BAR */
  .trust-bar{
    margin-top:0;
    border-radius:0;
  }

  .trust-flex{
    grid-template-columns:1fr 1fr;
    gap:15px;
  }

  .trust-item{
    flex-direction:column;
  }

  .trust-item::after{
    display:none;
  }
}

/* ================= STICKY CTA ================= */
.mobile-cta{
  display:none;
}

@media(max-width:768px){
  .mobile-cta{
    display:flex;
    position:fixed;
    bottom:0;
    width:100%;
    z-index:999;
  }

  .mobile-cta a{
    flex:1;
    padding:15px;
    text-align:center;
    text-decoration:none;
    font-weight:600;
  }

  .call-btn{
    background:#D42716;
    color:#fff;
  }

  .wa-btn{
    background:#25D366;
    color:#fff;
  }
}

    @media(max-width:768px){
  .trust-bar{
    width:95%;
    margin:-40px auto 0;
    border-radius:10px;
  }
}



    /* ================= SERVICES SECTION ================= */
.services{
  padding:80px 0;
  background:#f9f9f9;
}

/* ================= HEADING ================= */
.section-head{
  text-align:center;
  margin-bottom:40px;
}

.section-head .sub{
  color:#D42716;
  font-size:13px;
  font-weight:500;
  margin-bottom:10px;
  letter-spacing:1px;
}

.section-head h2{
  font-size:32px;
  color:#111;
  font-weight:700;
}

/* ================= GRID ================= */
.service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:25px;
}

/* ================= CARD ================= */
.service-card{
  background:#fff;
  padding:25px;
  border-radius:12px;
  text-align:center;
  border:1px solid #eee;
  transition:all 0.3s ease;
  position:relative;
  overflow:hidden;
}

/* TOP HIGHLIGHT LINE */
.service-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:3px;
  background:#D42716;
  transform:scaleX(0);
  transform-origin:left;
  transition:0.3s;
}

/* HOVER EFFECT */
.service-card:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 30px rgba(0,0,0,0.12);
}

.service-card:hover::before{
  transform:scaleX(1);
}

/* ================= ICON ================= */
.service-card .icon{
  font-size:36px;
  margin-bottom:15px;
  color:#D42716;
}

/* ================= TITLE ================= */
.service-card h3{
  font-size:18px;
  font-weight:600;
  margin-bottom:10px;
  color:#111;
}

/* ================= DESCRIPTION ================= */
.service-card p{
  font-size:14px;
  color:#666;
  line-height:1.6;
}

/* ================= CTA BUTTON ================= */
.card-btn{
  display:inline-flex;
  margin-top:15px;
  padding:10px 18px;
  background:#D42716;
  color:#fff;
  font-size:13px;
  font-weight:600;
  border-radius:6px;
  text-decoration:none;
  transition:0.3s;
  align-items:center;
   justify-content:center;
   text-decoration:none;
   -webkit-tap-highlight-color: transparent;
   touch-action: manipulation;
}

/* BUTTON HOVER */
.card-btn:hover{
  background:#000;
  color:#D42716;
}

/* OPTIONAL WHATSAPP BUTTON */
.card-btn.wa{
  background:#25D366;
  color:#fff;
  margin-left:8px;
}

.card-btn.wa:hover{
  background:#1da851;
  color:#fff;
}

/* ================= MOBILE ================= */
@media(max-width:768px){

  .services{
    padding:50px 15px;
  }

  .section-head h2{
    font-size:24px;
  }

  .service-grid{
    grid-template-columns:1fr;
    gap:20px;
  }

  .service-card{
    padding:20px;
  }

  .card-btn{
    width:100%;
    text-align:center;
  }

}


    /* ================= WHY US ================= */
.why-us{
  padding:80px 0 40px;
  background:#fff;
}

/* FLEX */
.why-flex{
  display:flex;
  align-items:center;
  gap:60px;
}

/* LEFT */
.why-content{
  flex:1;
}

/* SUB */
.why-content .sub{
  color:#D42716;
  font-size:13px;
  margin-bottom:10px;
}

/* HEADING */
.why-content h2{
  font-size:34px;
  margin-bottom:15px;
  color:#111;
}

.why-content h2 span{
  color:#D42716;
}

/* DESCRIPTION */
.why-desc{
  font-size:15px;
  color:#555;
  margin-bottom:20px;
  line-height:1.6;
}

/* POINTS */
.why-points{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:25px;
}

.why-item{
  font-size:15px;
  color:#333;
}

/* CTA */
.why-cta{
  gap:10px;
     display:inline-flex;
   align-items:center;
   justify-content:center;
   text-decoration:none;
   -webkit-tap-highlight-color: transparent;
   touch-action: manipulation;
}

.why-btn{
  background:#D42716;
  color:#fff;
  padding:14px 20px;
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
  transition:0.3s;
}

.why-btn:hover{
  background:#000;
  color:#D42716;
}

.why-wa{
  background:#25D366;
  color:#fff;
  padding:14px 20px;
  border-radius:6px;
  text-decoration:none;
}

/* NOTE */
.why-note{
  font-size:13px;
  color:#666;
}

/* IMAGE */
.why-image{
  flex:1;
}

.why-image img{
  width:100%;
  border-radius:12px;
  object-fit:cover;
  box-shadow:0 15px 40px rgba(0,0,0,0.15);
}

/* ================= MOBILE ================= */
@media(max-width:768px){

  .why-flex{
    flex-direction:column;
  }

  .why-us{
    padding:50px 15px;
  }

  .why-content h2{
    font-size:24px;
  }

  .why-cta{
    flex-direction:column;
  }

  .why-btn,
  .why-wa{
    width:100%;
    text-align:center;
  }

}

    /* ================= CTA BANNER ================= */
.cta-banner{
 padding:25px 0;
  margin-top:-50px; /* adjust as per design */
}

/* BOX */
.cta-flex{
  background:linear-gradient(135deg, #020b18, #0b1c33);
  border-radius:12px;
  padding:30px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

/* LEFT */
.cta-left{
  display:flex;
  align-items:center;
  gap:20px;
  color:#fff;
}

/* ICON */
.cta-icon{
  font-size:30px;
  color:#D42716;
  border:2px solid #D42716;
  border-radius:50%;
  padding:12px;
}

/* TEXT */
.cta-left h2{
  font-size:24px;
}

.cta-left h2 span{
  color:#D42716;
}

/* POINTS */
.cta-points{
  margin-top:10px;
  display:flex;
  gap:20px;
  font-size:13px;
  color:#ccc;
}

/* RIGHT */
.cta-right{
  display:flex;
  display:flex;
   flex-direction:column;
   align-items:center;
   justify-content:center;
   text-decoration:none;
   -webkit-tap-highlight-color: transparent;
   touch-action: manipulation;
  gap:10px;
}

/* CALL BUTTON */
.cta-call{
  background:#D42716;
  color:#fff;
  padding:14px 22px;
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
  text-align:center;
}

/* WHATSAPP */
.cta-wa{
  border:2px solid #25D366;
  color:#25D366;
  padding:12px 20px;
  border-radius:6px;
  text-decoration:none;
  text-align:center;
}

/* ================= MOBILE ================= */
@media(max-width:768px){

  .cta-flex{
    flex-direction:column;
    text-align:center;
  }

  .cta-left{
    flex-direction:column;
  }

  .cta-points{
    flex-direction:column;
    gap:5px;
  }

  .cta-right{
    width:100%;
  }

  .cta-call,
  .cta-wa{
    width:100%;
  }

}




    /* ================= TESTIMONIAL SECTION ================= */
/* ================= TESTIMONIAL SECTION ================= */
.testimonials{
  padding:80px 0;
  background:#f9f9f9;
  overflow:hidden;
}

/* HEADING */
.section-head{
  text-align:center;
  margin-bottom:40px;
}

.section-head .sub{
  color:#D42716;
  font-size:13px;
  margin-bottom:10px;
}

.section-head h2{
  font-size:32px;
  color:#111;
}

/* ================= SLIDER ================= */
/* ================= TESTIMONIAL SECTION ================= */
.testimonials{
  padding:80px 0;
  background:#f9f9f9;
  overflow:visible; /* IMPORTANT: allow arrows outside */
}

/* HEADING */
.section-head{
  text-align:center;
  margin-bottom:40px;
}

.section-head .sub{
  color:#D42716;
  font-size:13px;
  margin-bottom:10px;
}

.section-head h2{
  font-size:32px;
  color:#111;
}

/* ================= SLIDER ================= */
.testimonial-slider{
  position:relative;
  overflow:visible; /* IMPORTANT FIX */
}

/* ================= TRACK (DESKTOP GRID) ================= */
.testimonial-track{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:25px;
}

/* ================= CARD ================= */
.testimonial-card{
  background:#fff;
  padding:22px;
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
  transition:0.3s;
}

.testimonial-card:hover{
  transform:translateY(-5px);
}

/* STARS */
.stars{
  color:#D42716;
  font-size:14px;
  margin-bottom:10px;
}

/* TEXT */
.testimonial-card p{
  font-size:14px;
  color:#555;
  line-height:1.6;
}

/* CLIENT */
.client{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:15px;
}

.client img{
  width:42px;
  height:42px;
  border-radius:50%;
  object-fit:cover;
}

.client h4{
  font-size:14px;
}

.client span{
  font-size:12px;
  color:#888;
}

/* ================= ARROWS (DEFAULT HIDDEN) ================= */
.slider-btn{
  display:none;
}

/* ================= MOBILE SLIDER ================= */
@media(max-width:768px){

  /* SLIDER */
  .testimonial-slider{
    position:relative;
    overflow:visible;
  }

  /* TRACK -> FLEX */
  .testimonial-track{
    display:flex;
    transition:0.4s ease;
  }

  /* CARD WIDTH FIX (NO PEEK ISSUE) */
  .testimonial-card{
    min-width:100%;
    flex:0 0 100%;
  }

  /* ================= ARROWS ================= */
  .slider-btn{
    display:flex !important;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:32px;
    height:32px;
    border-radius:50%;
    background:#D42716;
    color:#000;
    border:none;
    font-size:18px;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:20;
  }

  /* OUTSIDE POSITION */
  .prev{
    left:-30px;
  }

  .next{
    right:-30px;
  }

  /* HOVER EFFECT */
  .slider-btn:hover{
    background:#000;
    color:#D42716;
  }

}

    /* ================= LEAD FORM ================= */
.lead-form{
  padding:90px 0;
  background:#0b1320;
  color:#fff;
}

.lead-flex{
  display:flex;
  gap:50px;
  align-items:center;
}

.lead-content{
  flex:1;
}

.lead-content .sub{
  color:#D42716;
  font-size:13px;
  margin-bottom:10px;
}

.lead-content h2{
  font-size:34px;
}

.lead-content span{
  color:#D42716;
}

.lead-desc{
  margin:15px 0;
  color:#ccc;
}

.lead-points{
  list-style:none;
  margin-bottom:20px;
}

.lead-points li{
  margin-bottom:8px;
}

/* CTA */
.lead-cta{
  display:flex;
  gap:10px;
}

.lead-call{
  background:#D42716;
  color:#fff;
  padding:12px 20px;
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
}

.lead-wa{
  background:#25D366;
  color:#fff;
  padding:12px 20px;
  border-radius:6px;
  text-decoration:none;
}

/* ================= FORM ================= */
.form-box{
  flex:1;
  background:#fff;
  color:#000;
  padding:30px;
  border-radius:12px;
}

.form-box form{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.form-box input,
.form-box select,
.form-box textarea{
  padding:12px;
  border:1px solid #ddd;
  border-radius:6px;
}

.form-box button{
  background:#D42716;
  border:none;
  padding:14px;
  font-weight:600;
  border-radius:6px;
  cursor:pointer;
}

.form-note{
  margin-top:10px;
  font-size:12px;
  color:#666;
}

/* ================= FLOATING BUTTONS ================= */
.floating-buttons{
  position:fixed;
  right:15px;
  bottom:80px;
  display:flex;
  flex-direction:column;
  gap:10px;
  z-index:999;

}
.floating-buttons a{
   display:flex;
   align-items:center;
   justify-content:center;
   text-decoration:none;
   -webkit-tap-highlight-color: transparent;
   touch-action: manipulation;
}

/* ================= FLOATING BUTTONS ================= */
/* ================= FLOATING BUTTONS ================= */
.float-call,
.float-wa{
  width:50px;
  height:50px;

  border-radius:50%;

  display:flex;
  align-items:center;
  justify-content:center;

  color:#fff !important;

  font-size:18px;

  text-decoration:none;
}

/* CALL */
.float-call{
  background:#D42716;
}

/* WHATSAPP */
.float-wa{
  background:#25D366;
}

/* ================= MOBILE ================= */
@media(max-width:768px){

  .lead-flex{
    flex-direction:column;
  }

  .lead-form{
    padding:50px 15px;
  }

  .lead-content h2{
    font-size:24px;
  }

  .lead-cta a{
   display:inline-flex;
   align-items:center;
   justify-content:center;
   text-decoration:none;
   -webkit-tap-highlight-color: transparent;
   touch-action: manipulation;
}

  .lead-call,
  .lead-wa{
    width:100%;
    text-align:center;
  }

}

    /* ================= FOOTER ================= */
.footer{
  background:linear-gradient(135deg,#020b18,#0b1c33);
  color:#fff;
  padding:60px 0 20px;
}

/* GRID */
.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1.5fr 1.5fr;
  gap:40px;
}

/* LOGO */
.footer-logo h2{
  font-size:22px;
}

.footer-logo span{
  font-size:12px;
  color:#D42716;
}

/* TEXT */
.footer-col p{
  font-size:14px;
  color:#ccc;
  margin:10px 0;
}

/* HEADINGS */
.footer-col h4{
  margin-bottom:15px;
  color:#D42716;
}

/* LIST */
.footer-col ul{
  list-style:none;
}

.footer-col ul li{
  margin-bottom:8px;
  font-size:14px;
  color:#ccc;
}

/* LINKS */
.footer-col ul li a{
  color:#ccc;
  text-decoration:none;
  transition:0.3s;
}

.footer-col ul li a:hover{
  color:#D42716;
}

/* SOCIAL */
.footer-social{
  margin-top:10px;
}

.footer-social a{
  margin-right:10px;
  font-size:18px;
  text-decoration:none;
}

/* WHATSAPP BUTTON */
.footer-wa{
  display:inline-block;
  margin-top:10px;
  background:#25D366;
  color:#fff;
  padding:10px 16px;
  border-radius:6px;
  text-decoration:none;
  font-size:14px;
}

/* ================= BOTTOM ================= */
.footer-bottom{
  border-top:1px solid rgba(255,255,255,0.1);
  margin-top:30px;
  padding-top:15px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:13px;
}

.footer-links a{
  color:#ccc;
  margin-left:15px;
  text-decoration:none;
}

.footer-links a:hover{
  color:#D42716;
}

/* ================= MOBILE ================= */
@media(max-width:768px){

  .footer-grid{
    grid-template-columns:1fr;
  }

  .footer-bottom{
    flex-direction:column;
    gap:10px;
    text-align:center;
  }

}


    .logo img{
  height:82px;
  width:auto;
  object-fit:contain;

  filter:
    drop-shadow(0 2px 8px rgba(0,0,0,0.25));

  transition:0.3s;
}

/* HOVER */
.logo img:hover{
  transform:scale(1.02);
}

/* MOBILE */
@media(max-width:768px){

  .logo img{
    height:68px;
  }

}

    /* ================= HOME ABOUT ================= */
.home-about{
  padding:30px 0;
  background:#ffffff;
}

/* FLEX */
.home-about-flex{
  display:flex;
  align-items:center;
  gap:80px;
}

/* ================= IMAGE ================= */
.home-about-image{
  flex:1;
  position:relative;
}

.home-about-image img{
  width:100%;
  height:620px;
  object-fit:cover;

  border-radius:20px;

  box-shadow:0 20px 60px rgba(0,0,0,0.12);
}

/* EXPERIENCE BOX */
.about-exp-box{
  position:absolute;
  left:30px;
  bottom:30px;

  background:#fff;

  padding:24px 30px;

  border-radius:16px;

  box-shadow:0 15px 40px rgba(0,0,0,0.12);

  border-left:4px solid #D42716;
}

.about-exp-box h3{
  font-size:42px;
  color:#D42716;
  margin-bottom:5px;
  line-height:1;
}

.about-exp-box p{
  font-size:14px;
  color:#555;
  line-height:1.7;
}

/* ================= CONTENT ================= */
.home-about-content{
  flex:1;
}

/* SUB */
.home-about-content .sub{
  color:#D42716;
  font-size:13px;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:16px;
  font-weight:600;
}

/* HEADING */
.home-about-content h2{
  font-size:46px;
  line-height:1.3;
  color:#111827;
  margin-bottom:24px;
}

/* DESC */
.about-desc{
  font-size:15px;
  line-height:1.9;
  color:#667085;
  margin-bottom:35px;
}

/* POINTS */
.about-points{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
  margin-bottom:35px;
}

/* ITEM */
.about-point{
  background:#f8f8f8;

  padding:18px 20px;

  border-radius:12px;

  font-size:14px;
  font-weight:500;
  color:#111827;

  border:1px solid #ececec;

  transition:0.35s;
}

/* HOVER */
.about-point:hover{
  transform:translateY(-5px);
  box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

/* BUTTON WRAP */
.about-btn-wrap{
  text-decoration:none;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   -webkit-tap-highlight-color: transparent;
   touch-action: manipulation;
   column-gap:16px;
}

/* BUTTON */
.about-btn{
  background:#D42716;
  color:#fff;

  height:52px;
  padding:0 28px;

  border-radius:10px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  text-decoration:none;

  font-size:14px;
  font-weight:600;

  transition:0.35s;
}

.about-btn:hover{
  background:#111827;
}

/* CALL */
.about-call{
  background:#111827;
  color:#fff;

  height:52px;
  padding:0 26px;

  border-radius:10px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  text-decoration:none;

  font-size:14px;
  font-weight:600;

  transition:0.35s;
}

.about-call:hover{
  background:#D42716;
}

/* ================= MOBILE ================= */
@media(max-width:768px){

  .home-about{
    padding:60px 15px;
  }

  .home-about-flex{
    flex-direction:column;
    gap:40px;
  }

  .home-about-image img{
    height:420px;
  }

  .about-exp-box{
    left:20px;
    bottom:20px;

    padding:18px 22px;
  }

  .about-exp-box h3{
    font-size:32px;
  }

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

  .about-desc{
    font-size:14px;
  }

  .about-points{
    grid-template-columns:1fr;
    gap:14px;
  }

  .about-btn-wrap{
    flex-direction:column;
    align-items:flex-start;
    width:100%;
  }

  .about-btn,
  .about-call{
    width:100%;
  }

}