body{
  font-family: 'Apercu';
  background:#fff;
  margin:0;
}
  
    :root {
      --brand:#7b4bff;
      --brand-2:#00a2ff;
      --ink:#0b1020;
      --muted:#667085;
      --bg:#f8f9fb;
    }
    html, body {scroll-behavior:smooth;}
    body {
      color:var(--ink); 
      /* font-family:'Inter', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, 'Helvetica Neue', Arial, sans-serif; */
    }
    h1,h2,h3,h4,h5{
      /* font-family:'Poppins','Inter',system-ui,sans-serif;  */
      letter-spacing:-.2px
    }
    /* .lead{font-weight:500} */

    /* HERO */
    /* .hero {
      background: radial-gradient(80% 80% at 90% 10%, rgba(123,75,255,.15), transparent 70%),
                  radial-gradient(60% 60% at 0% 60%, rgba(0,162,255,.15), transparent 70%),
                  var(--bg);
    } */
    .badge-soft {
      background: rgba(123,75,255,.08);
      color: var(--brand);
      border: 1px solid rgba(123,75,255,.25);
    }

    /* SECTION UTILS */
    .section {
      padding: 5rem 0;
    }
    .section-sm {padding: 2.5rem 0;}

    /* MULTI-ITEM SMART CAROUSEL */
    .smart-carousel .carousel-item { transition: transform .6s ease; }
    .smart-carousel .item-card {
      border-radius: .75rem; border:1px solid #e9ecef; background:#fff;
      display:flex; align-items:center; justify-content:center; height:84px; padding:1rem;
    }
    .logo-img { max-height: 40px; width:auto; filter: grayscale(1); opacity:.9; }
    .smart-carousel .carousel-control-prev, .smart-carousel .carousel-control-next {
      width: 3rem; height: 3rem; top: 50%; transform: translateY(-50%);
      background: #fff; border-radius: 50%; border:1px solid #e5e7eb; opacity:.85;
    }
    .smart-carousel .carousel-indicators [data-bs-target]{ background-color:#adb5bd; height:6px; width:6px; border-radius:50%; }

    /* TESTIMONIALS */
    .quote-card {background:#fff; border:1px solid #eef0f3; border-radius:1rem; padding:1.25rem; height:100%;}
    .quote-card p{color:#334155}

    /* METRICS */
    .metric {border-radius:1rem; background:#fff; border:1px solid #eef0f3; padding:1rem}
    .metric h3 {color:var(--brand);}

    /* CARDS – HANDLES */
    .handle-card{border:1px solid #edf1f5; border-radius:1rem; overflow:hidden; background:#fff; transition:transform .2s}
    .handle-card:hover{transform:translateY(-4px)}
    .handle-media{height:120px; object-fit:cover;}

    /* FLIP-FLOP (flip card) */
    .flip { perspective: 1200px; }
    .flip-inner { position: relative; width:100%; height:100%; transform-style:preserve-3d; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
    .flip.is-flipped .flip-inner{ transform: rotateY(180deg); }
    .flip-face { position:absolute; inset:0; backface-visibility: hidden; border:1px solid #eceff3; border-radius:1rem; overflow:hidden; background:#fff; }
    .flip-back { transform: rotateY(180deg); }
    .flip .media { height:220px; background:#000; }
    .flip .p-24{ padding:1.25rem; }
    .flip .tag { display:inline-block; font-size:.75rem; padding:.25rem .5rem; border-radius:999px; background:rgba(0,0,0,.05); }

    /* FOOTER */
    .footer {font-size:.925rem; color:#5f6b7a}

    /* HELPERS */
    .shadow-soft { box-shadow: 0 10px 30px rgba(2,8,23, .06); }

    .nav-link {
      color: #000;
      font-size: 16px;      
    }

    .nav-link {
      color: #000;
      font-family: 'Apercu'; /* Or fallback fonts 'Apercu', sans-serif */
      font-weight: 500; /* 500 = Medium weight */
      font-style: normal; /* Figma "Medium" maps to weight, not style */
      font-size: 16px;
      line-height: 1; /* 100% = 1 */
      letter-spacing: 0; /* 0% means no extra tracking */
      text-align: center;
      vertical-align: middle; /* Works for inline/inline-block elements */
    }

    .lead {
      color: #000;
      font-family: 'Apercu'; /* Load via @font-face or font service , sans-serif*/
      font-weight: 400;                 /* Regular */
      font-style: normal;               /* "Regular" in Figma = normal */
      font-size: 20px;
      line-height: 100%;                /* or simply line-height: 1; */
      letter-spacing: 0;                /* 0% = normal */
      vertical-align: middle;           /* Only affects inline/inline-block/table-cell */
    }    


    .navbar  .navbar-nav .nav-item {
      padding: 0 5px !important;
    }

    footer ul.list-unstyled.small li .text-muted {
      color: #000 !important;
    }

    
  
  
    :root{
      --brand:#0ea5e9;
      --accent:#0b84f5;
      --muted:#f6f7f9;
    }
    body { 
      /* font-family: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; color:#222;  */
    }
    /* HERO */
    .hero { position: relative; overflow: hidden; padding: 10px 0 0 0; }
    .hero-shape {
      position:absolute;
      right:-8%;
      top:-10%;
      width:60%;
      height:120%;
      background: linear-gradient(180deg, rgba(14,165,233,0.12), rgba(11,141,248,0.06));
      border-radius: 55% 0 55% 0;
      z-index:0;
      pointer-events:none;
    }
    .hero-content{ z-index:2; }
    .brand-highlight {
      display:inline-block;
      padding-right:.6rem;
      background: linear-gradient(90deg,#fff 0,#fff calc(100% - 8px), rgba(14,165,233,0.15) calc(100% - 8px), rgba(14,165,233,0.28));
    }
    /* .lead { color:#6b7280; font-size:1rem; } */
    /* Logos */
    .logo-grid img {
      max-height:48px; object-fit:contain; background:#fff; padding:6px; border-radius:8px;
      box-shadow:0 6px 18px rgba(15,23,42,0.04);
    }
    /* Testimonials */
    .testimonial-card { background:#F6FFF9; border-radius:12px; padding:1.25rem; box-shadow:0 12px 30px rgba(10,10,10,0.04); }
    .testimonial-card .avatar { width:48px; height:48px; object-fit:cover; border-radius:50%; }
    /* Stats bubbles */
    .stat-bubble { width:120px; height:120px; display:flex; align-items:center; justify-content:center; border-radius:18px; color:#fff; font-weight:800; box-shadow:0 8px 28px rgba(2,6,23,0.06); font-size:1.25rem; }
    /* Engage cards */
    .engage-card img { height:220px; object-fit:cover; border-top-left-radius:12px; border-top-right-radius:12px; }
    footer .social a { color:#6b7280; margin-right:.6rem; font-size:1.05rem; }

    @media (max-width: 767px){
      .hero-shape { display:none; }
      .logo-grid img{ max-height:40px; }
      .engage-card img { height:150px; }
    }

    /* 
    .hero.section {
      
    } 
    */
   
  
  
    .logo-box {
      /* background: #fff; */
      /* border-radius: 12px; */
      /* padding: 20px; */
      /* display: flex;
      justify-content: center;
      align-items: center; */
      /* height: 100px;
      min-width: 120px; */
      /* box-shadow: 0 2px 6px rgba(0,0,0,0.08); */
      transition: all 0.3s ease;
    }
    .logo-box:hover {
      box-shadow: 0 0 0px rgba(0, 123, 255, 0.6);
      transform: translateY(-5px);
    }
    .logo-box img {
      max-width: 100%;
      /* max-height: 60px; */
      object-fit: contain;
      cursor: pointer;
    }
    .logo-row {
      display: flex;
      justify-content: space-evenly; /* <-- Equal spacing */
      gap: 20px;
      flex-wrap: nowrap; /* Prevent wrapping so it stays like screenshot */
      /* margin-bottom: 25px; */
    }
    @media (max-width: 768px) {
      .logo-row {
        flex-wrap: wrap; /* On smaller screens allow wrapping */
      }
    }
  

  
    .ads-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }
    @media (min-width: 992px) {
      .ads-grid .ad:nth-child(2),
      .ads-grid .ad:nth-child(5) { margin-top: 28px; }
    }
    @media (max-width: 991.98px) {
      .ads-grid { grid-template-columns: repeat(2, 1fr); }
      .ads-grid .ad { margin-top: 0 !important; }
    }
    @media (max-width: 575.98px) {
      .ads-grid { grid-template-columns: 1fr; }
    }

    .ad {
      position: relative;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
    }

    .ad img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: opacity 1.2s ease-in-out; /* ✅ smooth fade */
    }

    .ad.fade-out img {
      opacity: 0;
    }
  

  
    .cards-wrapper {
      display: flex;
      justify-content: center;
      align-items: flex-start;
      flex-wrap: wrap;
    }

    .travel-card {
      border-radius: 20px;
      overflow: hidden;
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
      background: #fff;
      /* margin: 0 -30px;  */
      /* overlap */
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      position: relative;
      aspect-ratio: 3 / 4; /* keep equal proportions instead of fixed px */
      /* width: 100%; */
      padding: 20px;
    }

    @media (max-width: 768px) {
      .travel-card {
        /* margin: 0 auto 20px auto;  */
        /* stack on small screens */
      }
    }

    .travel-card img {
      width: 100%;
      height: 100%;
      /* object-fit: cover; */
      /* transform: rotate(90deg);  */
      /* rotate 90° clockwise */
      transform-origin: center center;
      border-radius: 20px;
    }

    .travel-card:hover {
      transform: translateY(-8px);
      z-index: 2;
      box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25);
    }

    .travel-caption {
      margin-top: 12px;
      font-family: "Brush Script MT", cursive;
      font-size: 1.4rem;
      text-align: center;
    }

    @media (min-width: 576px) {
      /* Vertical stagger */
      .travel-card-offset-1 { margin-top: 0px; }
      .travel-card-offset-2 { margin-top: 40px; }
      .travel-card-offset-3 { margin-top: 80px; }

      .mlm40 { margin-left: -20px; } /* extra left margin for middle card */

      .mb50 {
        margin-bottom: 50px;
      }
      
      .mb100 {
        margin-bottom: 100px;
      }

      .mt100 {
        margin-top: 100px;
      }      

    }




  

  

    .btn-primary, .bg-primary {
        background-color: #0195F7 !important;
        --bs-btn-border-color: #0195F7 !important;
        border-radius: 30px !important;
    }

    .br20 {
      border-radius: 20px;
    }
    .grayBC {
      background-color: #EFF1F3 !important;
      --bs-btn-border-color: #0195F7 !important;
      /* border-radius: 30px !important;       */
    }
    .h-auto{
      height: auto !important;
    }
  

  
    .testimonial-card {
      border-radius: 15px;
      padding: 25px;
      /* box-shadow: 0 6px 16px rgba(0,0,0,0.1); */
      box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.12);

      position: relative;
      min-height: 230px;
      max-height: 230px;
      overflow: hidden;
    }  

    @media (max-width: 1024px) {
        .testimonial-card {
          min-height: 255px;
          max-height: 255px;          
        }
    }    

    .testimonial-quote {
      font-size: 2rem;
      color: rgba(0,0,0,0.5);
      /* position: absolute;
      top: 15px;
      left: 20px; */
      padding: 0 10px 0 0;
    }

    .testimonial-text {
      /* margin-top: 40px; */
      font-size: 1rem;
      line-height: 1.5;
      color: #333;
    }

    .testimonial-footer {
      display: flex;
      align-items: center;
      margin-top: 20px;
    }

    .testimonial-footer img.profile {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      margin-right: 15px;
      object-fit: cover;
    }

    .testimonial-footer h5 {
      margin: 0;
      font-weight: bold;
    }

    .testimonial-footer p {
      margin: 0;
      font-size: 0.9rem;
      /* color: #666; */
    }

    .testimonial-footer img.company-logo {
      margin-left: auto;
      max-height: 50px;
    }

    .bg-light-green {
      background-color: #9dd3ff;
    }

    /* overlap effect */
    .carousel-item .row {
      position: relative;
    }

    @media (min-width: 576px) {
        .carousel-item .col-md-9:last-child {
          /* margin-left: -250px !important;
          z-index: 2 !important;
          padding-top: 180px !important; */
          margin-top: -20px !important;
        }
    }  

    @media (max-width: 576px) {
        .carousel-item .col-md-9:last-child {
            margin-top: 20px !important;
        }
    }
    
    .carousel-item .testimonial-text {
      font-family: 'Apercu'; /* Make sure Apercu is loaded , sans-serif */
      font-weight: 300;                 /* Light */
      font-style: normal;               /* "Light" is weight, not style */
      font-size: 16px;
      line-height: 100%;                /* better written as line-height: 1; */
      letter-spacing: 0;                /* 0% = normal */
      vertical-align: middle;           /* works in inline/inline-block/table-cell */

    }

   

  
    :root{
      --cardW: 360px;              /* base card width (desktop) */
      --radius: 22px;
      --frame: #ffffff;
      --shadow: 0 24px 70px rgba(15,23,42,.18);
      --badge: #1890ff;
    }
    .partners-section{ padding: clamp(36px,6vw,84px) 0; color:#0f172a; }

    /* ===== Left stack layout (matched to jpack) ===== */
    .stack-wrap{ position: relative; height: 520px; }
    .card-polaroid{
      position:absolute; margin:0; padding:0; border:0; background:transparent;
      width: var(--cardW); filter: drop-shadow(var(--shadow));
      transform-style: preserve-3d; will-change: transform;
      opacity:0; transform: translateY(24px) scale(.98);  /* for reveal */
    }
    .card-polaroid .card-frame{
      position:relative; background:var(--frame); border-radius: calc(var(--radius) + 8px);
      padding:14px; overflow:hidden;
    }
    .card-polaroid img{
      width:100%; height: calc(var(--cardW) * 1.25);
      object-fit: cover; border-radius: var(--radius); display:block;
      transform: translateZ(0);
    }
    .card-polaroid figcaption{
      /* font-family: "Caveat", system-ui, sans-serif; */
      font-size: 28px; color:#0f172a; margin-top: 12px; margin-left: 10px;
    }

    /* positions like the screenshot (center on top) */
    .c1{ left:-26px; top:36px;   z-index:1; }
    .c2{ left:120px; top:-12px;  z-index:3; }  /* center/top */
    .c3{ left:286px; top:52px;   z-index:2; }

    /* ===== trending micro-interactions ===== */

    /* 1) Subtle float on idle */
    @keyframes floaty{ 0%{transform:translateY(0)} 50%{transform:translateY(-8px)} 100%{transform:translateY(0)} }
    .card-polaroid.float{ animation: floaty 7s ease-in-out infinite; }

    /* 2) Shine sweep on hover */
    .card-polaroid .card-frame::before{
      content:""; position:absolute; inset:-120% -60%;
      background: linear-gradient(120deg, transparent 45%, rgba(255,255,255,.45) 50%, transparent 55%);
      transform: translateX(-60%) skewX(-15deg);
      transition: transform .9s ease;
      pointer-events:none;
    }
    .card-polaroid:hover .card-frame::before{ transform: translateX(170%) skewX(-15deg); }

    /* 3) Tilt on hover (JS sets CSS vars) */
    .card-polaroid{ transform: perspective(1000px) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateZ(0); }

    /* 4) Staggered scroll-reveal */
    .sr.revealed{ opacity:1; transform: none; transition: opacity .6s ease, transform .6s ease; }
    .c1.sr.revealed{ transition-delay: .05s; }
    .c2.sr.revealed{ transition-delay: .18s; }
    .c3.sr.revealed{ transition-delay: .31s; }

    /* ===== Right copy ===== */
    .badge-chip{
      display:inline-block; background:var(--badge); color:#fff; font-weight:700;
      padding:10px 16px; border-radius:8px; letter-spacing:.4px; margin-bottom:18px;
    }
    .hero{ font-weight:800; line-height:1.08; font-size: clamp(30px,4.6vw,58px); }
    .hero .br{ display:block; }
    .sub{ color:#475569; font-size: clamp(15px,1.25vw,18px); max-width: 60ch; }

    /* ===== Responsive ===== */
    @media (max-width:1200px){
      :root{ --cardW: 320px; }
      .c3{ left:260px; }
    }
    @media (max-width:992px){
      :root{ --cardW: 300px; }
      .stack-wrap{ height: 480px; }
      .c1{ left:-18px } .c2{ left:100px } .c3{ left:236px }
    }
    @media (max-width:768px){
      .stack-wrap{ height: 460px; margin: 0 auto 22px; }
      .c1{ left:-10px } .c2{ left:78px } .c3{ left:198px }
    }
    @media (max-width:576px){
      :root{ --cardW: 78vw; }
      .stack-wrap{ height: calc(78vw * 1.45); }
      .c1{ left:-6vw; top:18px } .c2{ left:8vw; top:-8px } .c3{ left:26vw; top:30px }
    }
  

  

    /* Fancy CTA button */
    .btn-play {
      --btnh: 56px;
      display:inline-grid; place-items:center;
      gap:12px; grid-auto-flow:column;
      padding: 0 22px; height: var(--btnh);
      background: linear-gradient(135deg, #0ea5e9 0%, #22d3ee 100%);
      color:#0b1220; font-weight:800; letter-spacing:.3px;
      border-radius: 999px; text-decoration:none;
      position: relative; border:0; box-shadow: 0 12px 40px rgba(0,212,255,.28);
      transition: transform .15s ease, box-shadow .2s ease;
    }
    .btn-play:hover { transform: translateY(-1px); box-shadow: 0 18px 54px rgba(0,212,255,.35); }
    .btn-play:active { transform: translateY(0); }
    .btn-ring::before, .btn-ring::after {
      content:""; position:absolute; inset:-14px; border-radius:999px; border:2px solid var(--ring);
      animation: ring 2.1s ease-out infinite; pointer-events:none;
    }
    .btn-ring::after { animation-delay: .8s; opacity:.6; }
    @keyframes ring { from{transform:scale(.85); opacity:.9} to{transform:scale(1.2); opacity:0} }

    .play-icon {
      width: 14px; height: 0; border-left: 18px solid #0b1220;
      border-top: 12px solid transparent; border-bottom: 12px solid transparent; margin-left: 2px;
      filter: drop-shadow(0 1px 0 rgba(0,0,0,.15));
    }

    /* Video card preview */
    .video-card {
      position: relative; border-radius: 16px; overflow: hidden;
      box-shadow: 0 20px 70px rgba(0,0,0,.45);
    }
    .video-thumb { aspect-ratio: 16/9; width:100%; background:#000 center/cover no-repeat; display:block; }
    .glow { position:absolute; inset:-30%; background: radial-gradient(40% 40% at 50% 50%, rgba(0,212,255,.15), transparent 60%); mix-blend-mode: screen; pointer-events:none; }

    /* Modal styling */
    .modal-content { background:#0b1220; border:0; border-radius: 16px; overflow:hidden; }
    .modal-header { border:0; color:#e5edf7; }
    .modal-body { padding: 0; }
    .btn-close.btn-close-white { filter: invert(1); }
    .fallback {
      position:absolute; inset:0; display:none;
      align-items:center; justify-content:center; flex-direction:column;
      background: #0b1220; color:#e5edf7; text-align:center; padding: 24px;
    }
    .fallback.show { display:flex; }

    body {
      /* font-family: 'Apercu', sans-serif; */
      color: #000;
    }

    ul.list-unstyled.small li a {
      /* font-family: 'Apercu'; */
      font-weight: 400;
      font-style: normal; /* instead of 'Regular' */
      font-size: 16px;
      line-height: 35px; /* spacing between lines */
      letter-spacing: 0;
      vertical-align: middle;
    }

    @media (max-width: 576px) {
        .ftr1 {
          text-align: center;
          padding-bottom: 20px;
        }
    }

    @media (max-width: 992px) {
        .top3PARTNERSHIPS{
          display: block;
        }
        .bottom3PARTNERSHIPS{
          display: none;
        }
    }    
    @media (min-width: 992px) {
        .top3PARTNERSHIPS{
          display: none;
        }
        .bottom3PARTNERSHIPS{
          display: block;
        }
    }


  

  
    /* Default close icon hidden */
    .navbar-toggler .close-icon {
      display: none;
      font-size: 2rem;
      line-height: 1;
    }

    /* When navbar is collapsed (hamburger visible) */
    .navbar-toggler.collapsed .navbar-toggler-icon {
      display: inline-block;
    }
    .navbar-toggler.collapsed .close-icon {
      display: none;
    }  

    /* When navbar is expanded (close icon visible) */
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon {
      display: none;
    }
    .navbar-toggler:not(.collapsed) .close-icon {
      display: inline-block;
      width: 30px;
      height: 30px;      
    }

  
  .owl-carousel .item {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }

  .owl-carousel .item img {
    max-width: 100%;
    max-height: 100%;
    width: auto; /* natural aspect ratio */
    height: auto;
    object-fit: cover;
    border-radius: 12px;
    display: block;
  }  

  .owl-nav button.owl-prev,
  .owl-nav button.owl-next {
    background: #007bff;
    color: #fff;
    border-radius: 50%;
    padding: 10px 15px;
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
  }
  .owl-nav button.owl-prev { left: -25px; }
  .owl-nav button.owl-next { right: -25px; }
  .owl-nav button:hover { background: #0056b3; }

  .owl-carousel .owl-item:nth-child(odd) .item {
    padding-top: 20px;
  }

  .owl-carousel .owl-item .item .text-center {
    justify-content: center; 
    display: flex ;
    /* padding: 10px; */
  }

  .owl-carousel .owl-item .item {
    /* padding: 10px; */
  }

  .owl-carousel .owl-item {
    /* padding:  0 10px; */
  }


  .brand-hero{
    position:relative;
    width:min(600px, 90vw);
    aspect-ratio: 1 / 1;  /* keeps layout stable, adjust if needed */
    margin:auto;
    isolation:isolate;     /* keep z-index stacking clean */
  }

  /* Background swell (behind the girl) */

  .bg-swell-border {
    position: absolute;
    left: 5%;        /* slightly more margin than bg-swell */
    right: 5%;
    bottom: 0;
    height: 80%;     /* slightly taller than bg-swell */

    background: transparent;
    border: 1px solid #BFE5FF; /* border color matches bg-swell */
    border-radius: 100px;
    opacity: 1;
    z-index: -1; /* keep behind bg-swell */
  }

  .bg-swell {
    position: absolute;
    left: 8%;
    right: 8%;
    bottom: 0;
    height: 75%;

    /* background: #BFE5FF; */
    border-radius: 100px;
    /* box-shadow: 0 14px 40px rgba(2, 8, 23, 0.08); */
    transform: scale(.75);
    opacity: 0;
    z-index: 0;
  }  

  /* Girl “reveal from background” */
  .girl{
    position:absolute; inset:0;
    width:100%; height:100%; object-fit:contain;
    z-index:1;
    /* start fully hidden inside a tiny circle, then expand */
    clip-path: circle(0% at 55% 60%);
    filter: saturate(.9) contrast(.98) blur(1px);
    transform: translateZ(0) scale(.985);
    opacity:0;
  }

  /* Logos */
  .logo{
    position:absolute; 
    width:165px; 
    height:auto; 
    object-fit:contain;
    /* background:#0b1320;  */
    /* dark chip like your mock */
    border-radius:22px; 
    /* padding:14px;
    box-shadow:0 14px 40px rgba(2,8,23,.18); */
    opacity:0; 
    transform: translateY(8px) scale(.92);
    z-index:2;
  }
  /* Position to match your image (tweak as needed) */
  .l1{ top:20%;   left:-1%;  }
  .l2{ bottom:6%; left:-8%; }
  .l3{ top:15%;  right:1%; }

  /* ==== ANIMATIONS (triggered when .is-ready is added) ==== */

  .brand-hero.is-ready .bg-swell {
  animation: swellIn .3s cubic-bezier(.2,.7,.2,1) forwards;
  animation-delay: 0s;
}

.brand-hero.is-ready .girl {
  animation:
    girlReveal .4s cubic-bezier(.22,.61,.36,1) 0s forwards,
    girlCrisp   .3s ease .4s forwards; /* remove blur & settle */
}

.brand-hero.is-ready .l1 { 
  animation: logoIn .25s cubic-bezier(.2,.7,.2,1) .3s forwards; 
}
.brand-hero.is-ready .l2 { 
  animation: logoIn .25s cubic-bezier(.2,.7,.2,1) .45s forwards; 
}
.brand-hero.is-ready .l3 { 
  animation: logoIn .25s cubic-bezier(.2,.7,.2,1) .6s forwards; 
}

  @keyframes swellIn{
    0%   { transform: scale(.75); opacity:0; }
    100% { transform: scale(1);   opacity:1; }
  }
  /* Circle grows from center of girl to reveal her */
  @keyframes girlReveal{
    0%   { clip-path: circle(0%   at 55% 60%); opacity:0; transform: translateZ(0) scale(.985); }
    60%  { clip-path: circle(72%  at 55% 60%); opacity:1; }
    100% { clip-path: circle(140% at 55% 60%); opacity:1; transform: translateZ(0) scale(1); }
  }
  /* After reveal, remove blur for a crisp finish */
  @keyframes girlCrisp{
    from { filter: saturate(.9) contrast(.98) blur(1px); }
    to   { filter: none; }
  }
  @keyframes logoIn{
    0%   { opacity:0; transform: translateY(8px) scale(.92); }
    100% { opacity:1; transform: translateY(0)   scale(1); }
  }

  /* Small screens: scale logos down a bit */
  @media (max-width: 520px){
    .logo{ width:108px; height:108px; padding:10px; border-radius:18px; }
  }


/******new css for explurger website********/  
.google_play1,
.apple_store1 {
  max-width:100px; max-height:33px;
}

.t1
{
  font-family: Apercu;
  font-weight: 700;
  font-style: Bold;
  font-size: 87px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  vertical-align: middle;

}
.t2  
{
  font-family: Apercu;
  font-weight: 700;
  font-style: Bold;
  font-size: 50px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  vertical-align: middle;

}

.t3
{
  font-family: Apercu;
  font-weight: 700;
  font-style: Bold;
  font-size: 50px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  text-align: center;
  vertical-align: middle;

}

.btns
{
  font-family: Apercu;
  font-weight: 400;
  font-style: Regular;
  font-size: 17px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  vertical-align: middle;
  color: #000 !important;

}
.btns {
  border-radius: 50px !important;
  width: 100% !important;
  border: 0px !important;
}
.bg1{background: #FFD5D8 !important;}
.bg2{background: #FDEBCF !important;}
.bg3{background: #FDF5D1 !important;}
.bg4{background: #FFFED0 !important;}
.bg5{background: #F1FBD8 !important;}
.bg6{background: #D7FBED !important;}
.bg7{background: #D3FFFF !important;}
.bg8{background: #D6E1FB !important;}
.bg9{background: #E4D5F9 !important;}
.bg10{background: #EDD5FB !important;}
.bg11{background: #E9EDF0 !important;}
.bg12{background: #F3F0E7 !important;}

.ft-txt1
{
  font-family: Apercu;
  font-weight: 400;
  font-style: Regular;
  font-size: 16px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  vertical-align: middle;

}

.float-right {
  float: right;
}

.sub-txt2{
  font-family: Apercu;
  font-weight: 400;
  font-style: Regular;
  font-size: 20px;
  leading-trim: NONE;
  line-height: 28px;
  letter-spacing: 0%;
  vertical-align: middle;

}

.sub-txt3{
  font-family: Apercu;
  font-weight: 500;
  font-style: Medium;
  font-size: 20px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  vertical-align: middle;


}


.sub-txt4{
  font-family: Apercu;
  font-weight: 700;
  font-style: Bold;
  font-size: 40px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  vertical-align: middle;

}

.blog-records
.blog-card-title {
    color: #000;
    font-family: Apercu;
    font-size: 18px;
    font-weight: 700;
    line-height: 22.41px;
    text-align: left;
}
.blog-records
.blog-title-elipsis {
    -webkit-line-clamp: 2;
    line-clamp: 2;
}
.blog-records
.blog-title-elipsis, 
.blog-records
.blog-text-elipsis {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 4;
    -webkit-box-orient: vertical;
}
.blog-records
.m10z {
    margin: 25px 0;
    font-size: 18px;
    font-weight: 700;
}
.blog-records
.card-title {
    margin-bottom: var(--bs-card-title-spacer-y);
    color: var(--bs-card-title-color);
}
.blog-records
.blog-title-min-height {
    min-height: 95px;
}

.blog-records a, .blog-records a:focus, .blog-records a:hover, .blog-records a:visited {
    text-decoration: none;
    color: #000;
}

.carousel-indicators [data-bs-target] {
    border-top: none;
    border-bottom: none;
    width: 10px;
    height: 10px;
    border-radius: 10px !important;
  background-color: #0d6efd;
}