/* ===== header starts here ===== */

/* ============================= */
/* RESET (HEADER ONLY) */
/* ============================= */
.strike-header,
.strike-header * {
    box-sizing: border-box;
}



.strike-cta-nav {
  display: flex;
  align-items: center;
  justify-content: center;

  height: 40px;
  padding: 0 24px;

  background: linear-gradient(90deg, #314158 0%, #1D293D 100%);
  border-radius: 4px;

  font-size: 16px;
  color: #fff;
  text-decoration: none;

  white-space: nowrap;
}


/* =========================
   BASE
========================= */





/* ============================= */
/* 🟢 MOBILE (0–575px) */
/* ============================= */

.strike-header {
    height: 60px;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    position: sticky;
margin-top:0px;
    top: 0;
    z-index: 1000;
}

.strike-container {
    max-width: 1440px;
    margin: 0 auto;
    height: 100%;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* LEFT */
.strike-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* MENU ICON */
.strike-menu-toggle {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* LOGO */
.strike-logo img {
    width: 72px;
    height: 20px;
}

/* NAV hidden */
.strike-nav {
    display: none;
}

/* RIGHT */
.strike-right {
    display: flex;
    align-items: center;
    gap: 12px;
}




/* SEARCH ICON */
.strike-search {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
}

/* Feature Content Section - Mobile First */

.feature-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  padding: 64px 16px;
  gap: 16px;

  width: 100%;
  max-width: 100%;

  background: rgba(239, 239, 239, 0.2);

  position: relative;
  z-index: 7;
}

/* Optional: better spacing control for inner elements */
.feature-content > * {
  width: 100%;
}

/* If you want content centered but text left-aligned */
.feature-content-inner {
  width: 100%;
  max-width: 480px; /* mobile readability */
  margin: 0 auto;
}

/* =========================
   Feature Section (Exact Figma)
========================= */
.blog-title {
  width: 100%;

  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  font-size: 48px;
  line-height: 62px;

  color: #0F172B;

  margin: 0; /* IMPORTANT: remove default h1 margin */
}
.feature-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  padding: 64px 16px;
  gap: 16px;

  width: 100%;
  background: rgba(239, 239, 239, 0.2);

  position: relative;
  z-index: 7;
}

/* Container */
.feature-content-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;

  width: 100%;
  max-width: 358px;
}

/* =========================
   Title (Exact)
========================= */

.feature-section-title {
  width: 100%;

  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-weight: 700;

  font-size: 36px;
  line-height: 45px; /* 125% */

  text-align: center;
  letter-spacing: -0.531px;

  color: #000000;
margin-bottom: 8px;
}

/* =========================
   Subtitle (Exact)
========================= */

.feature-section-subtitle {
  width: 100%;

  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-weight: 400;

  font-size: 18px;
  line-height: 28px; /* 130% */

  text-align: center;
  letter-spacing: -0.712px;

  color: #4A5565;

  margin: 0;
}

/* =========================
   Feature Card (Exact Figma)
========================= */

.feature-card {
  display: flex;
  flex-direction: column;
  align-items: center;

  width: 358px;
  background: #FFFFFF;

  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.05),
              0px 10px 15px rgba(0, 0, 0, 0.1);

  border-radius: 4px;
  overflow: hidden;
}

/* =========================
   Image Section (Top)
========================= */

.feature-card-image {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 100%;
  padding: 24px;

  background: #F3F4F6;
}

.feature-card-image img {
  width: 310px;
  height: 155.21px;
  object-fit: cover;
  border-radius: 4px;
}

/* =========================
   Content Section
========================= */

.feature-card-text {
  display: flex;
  flex-direction: column;
  align-items: center;

  padding: 24px 16px 24px 32px;
  gap: 18px;

  width: 100%;
}

/* Inner wrapper equivalent (Frame 2147225166) */
.feature-card-text > * {
  max-width: 310px;
  width: 100%;
}

/* =========================
   Badge
========================= */

/* =========================
   Feature Badge / Chip
========================= */

/* =========================
   Feature Badge / Chip
========================= */

.feature-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center; /* ensures vertical + horizontal balance */

  gap: 8px;
  padding: 0 16px;
  height: 37px;

  background: #EFF6FF;
  border-radius: 999px;

  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 24px;

  color: #155DFC;

  text-align: center; /* important */
  white-space: nowrap; /* prevents breaking */
}

/* =========================
   SVG Icon (image)
========================= */

.feature-badge img {
  width: 16px;
  height: 16px;

  display: block; /* removes inline gap issue */
  object-fit: contain;
}
/* =========================
   Title
========================= */

.feature-card-text h3 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;

  font-size: 24px;
  line-height: 34px;

  text-align: center;
  color: #000;

  margin: 0;
}

/* =========================
   Description
========================= */

.feature-card-text p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;

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

  text-align: center;
  color: #131725;

  margin: 0;
}

/* =========================
   Points List
========================= */

.feature-points {
  list-style: none;
  padding: 0;
  margin: 0;

  display: flex;
  flex-direction: column;
  gap: 12px;

  align-items: flex-start;
}

/* Each point */
.feature-points li {
  display: flex;
  align-items: center;
  gap: 12px;

  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: #364153;
}

/* =========================
   CTA Link
========================= */

.feature-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;

  text-decoration: none;

  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 24px;

  color: #155DFC;
}

.feature-link .arrow-icon {
  width: 20px;
  height: 20px;
}

/* =========================
   Section Base
========================= */

.feature-steps {
  padding: 40px 16px;
  background: #FFFFFF;
}

.feature-steps-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

/* =========================
   Header
========================= */

.feature-steps-header {
  display: flex;
  flex-direction: column;
  align-items: center;


  text-align: center;
  max-width: 356px;
}

.feature-steps-header h2 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 34px;

  color: #000;
  margin: 0;
}

.feature-steps-header p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;

  color: #4A5565;
  margin: 0;
}

/* =========================
   Steps Grid (Mobile)
========================= */

.feature-steps-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

/* =========================
   Single Step
========================= */

.feature-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;

  text-align: center;
}

/* =========================
   Step Icon (Circle)
========================= */

.step-icon {
  width: 80px;
  height: 80px;

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

  background: linear-gradient(135deg, #EFF6FF 0%, #FAF5FF 100%);
  border-radius: 999px;

  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 48px;

  color: #155DFC;
}

/* =========================
   Step Title
========================= */

.feature-step h3 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;

  color: #000;
  margin: 0;
}

/* =========================
   Step Description
========================= */

.feature-step p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;

  color: #6A7282;
  margin: 0;

  max-width: 320px;
}


/* =========================
   Section
========================= */

.all-features {
  padding: 40px 16px;
  background: #F6F9FB;
}

.all-features-container {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
}

/* HEADER */
.all-features-header {
  text-align: center;
  max-width: 360px;
}

.all-features-header h2 {
  font-size: 28px;
  line-height: 36px;
  margin: 0 0 8px;
}

.all-features-header p {
  font-size: 16px;
  line-height: 24px;
  color: #4A5565;
  margin: 0;
}

/* GRID */
.all-features-grid {
  display: grid;
  grid-template-columns: 1fr; /* ✅ 1 column */
  gap: 24px;
  width: 100%;
}

/* CARD */
/* =========================
   CARD (Mobile Exact)
========================= */

.feature-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;

  width: 100%;
  max-width: 358px;

  background: #fff;
  border-radius: 4px;

  box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1),
              0px 4px 6px -4px rgba(0,0,0,0.1);

  overflow: hidden;
}

/* =========================
   IMAGE WRAP (matches 10px padding)
========================= */

.feature-item-image {
  padding: 10px;
  width: 100%;
}

.feature-item-image img {
  width: 100%;
  height: 150px; /* match figma */
  object-fit: cover;
  border-radius: 2px;
  opacity: 0.9;
}

/* =========================
   CONTENT (CENTERED)
========================= */

.feature-item-content {
  display: flex;
  flex-direction: column;

  padding: 32px;
  gap: 12px;
}

/* TITLE */
.feature-item-content h3 {
  font-size: 16px;
  line-height: 26px;
  font-weight: 700;
  color: #0F172B;
  margin: 0;
}

/* DESCRIPTION */
.feature-item-content p {
  font-size: 14px;
  line-height: 24px;
  color: #45556C;
  margin: 0;
}

/* CTA */
.feature-item-link {
  display: inline-flex;


  gap: 6px;

  font-size: 14px;
  font-weight: 700;
  color: #155DFC;
  text-decoration: none;
}



/* =========================
   SECTION
========================= */

.feature-faq {
  padding: 24px 16px;
  background: #fff;
}

.feature-faq-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* TITLE */
.faq-title {
  font-size: 30px;
  line-height: 36px;
  font-weight: 700;
  color: #101828;
  margin: 0;
}

/* LIST */
.faq-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* ITEM */
.faq-item {
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  padding: 12px 24px;

  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* QUESTION */
.faq-question {
  display: flex;
  justify-content: space-between;
  align-items: center;

  background: none;
  border: none;
  width: 100%;
  padding: 0;

  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
  color: #101828;

  cursor: pointer;
  text-align: left;
}

/* ICON */
.faq-icon {
  width: 24px;
  height: 24px;
  position: relative;
}

.faq-icon::before {
  content: "";
  width: 10px;
  height: 10px;

  border-right: 2px solid #8C8E95;
  border-bottom: 2px solid #8C8E95;

  position: absolute;
  top: 50%;
  left: 50%;

  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform 0.3s ease;
}

/* rotate when active */
.faq-item.active .faq-icon::before {
  transform: translate(-50%, -50%) rotate(-135deg);
}

/* ANSWER */
.faq-answer {
  display: none;
}

.faq-answer p {
  font-size: 16px;
  line-height: 26px;
  color: #4A5565;
  margin: 0;
}

/* SHOW ACTIVE */
.faq-item.active .faq-answer {
  display: block;
}
/* =========================
   SECTION
========================= */

.why-scanners {
  padding: 40px 16px;
  background: #fff;
}

.why-container {
  max-width: 1280px;
  margin: 0 auto;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

/* TITLE */
.why-title {
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  margin: 0;
}

/* =========================
   GRID (DEFAULT = 1 COLUMN)
========================= */

.why-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  width: 100%;
}

/* =========================
   CARD
========================= */

.why-card {
  display: flex;
  gap: 16px;
  align-items: flex-start;

  padding: 24px;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  background: #fff;
}

/* ICON */
.why-icon {
  width: 48px;
  height: 48px;
  border-radius: 4px;

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

.why-icon img {
  width: 24px;
  height: 24px;
}

/* COLORS */
.why-icon.green { background: #DCFCE7; }
.why-icon.blue { background: #DBEAFE; }
.why-icon.purple { background: #F3E8FF; }
.why-icon.orange { background: #FFEDD4; }

/* CONTENT */
.why-content {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.why-content h3 {
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
  margin: 0;
}

.why-content p {
  font-size: 14px;
  line-height: 24px;
  color: #6A7282;
  margin: 0;
}















@media (max-width: 576px) {
.strike-search input {
    display: none;
}

/* LOGIN hidden */
.strike-login {
    display: none;
}


/* CTA */
/* ============================= */
/* SUBSCRIBE BUTTON */
/* ============================= */




/* ============================= */
/* HERO SECTION */
/* ============================= */





}







/* ============================= */
/* 📱 MOBILE LANDSCAPE (≥576px) */
/* ============================= */
@media (min-width: 576px) {

    .strike-header {
        height: 64px;
    }

    .strike-container {
        padding: 0 24px;
    }

    .strike-logo img {
        width: 84px;
        height: 24px;
    }

    
}


/* ============================= */
/* 📲 TABLET PORTRAIT (≥768px) */
/* ============================= */
@media (min-width: 768px) {

    .strike-container {
        padding: 0 24px;
    }

    .strike-left {
        gap: 16px;
    }

    /* menu visible */
    .strike-menu-toggle {
        display: flex;
    }

    /* still hide nav */
    .strike-nav {
        display: none;
    }

    /* search icon size */
    .strike-search svg {
        width: 24px;
        height: 24px;
    }

   


}


/* ============================= */
/* 💻 DESKTOP (≥992px) */
/* ============================= */
@media (min-width: 992px) {

    .strike-container {
        padding: 0 32px;
        max-width: 1320px;
    }

    .strike-left {
        gap: 40px;
    }

    /* hide menu */
    .strike-menu-toggle {
        display: none;
    }

    /* NAV */
    .strike-nav {
        display: block;
margin-top: 7px;
    }

    .strike-nav ul {
        display: flex;
        align-items: center;
        gap: 32px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .strike-nav ul li a {
        font-size: 18px;
        color: #0f172b;
        text-decoration: none;
        white-space: nowrap;
    }

    /* RIGHT SIDE */
    .strike-right {
        gap: 16px;
    }

    /* SEARCH BAR */

/* SEARCH CONTAINER */

.strike-search {
    display: flex;
    align-items: center;
    gap: 8px;

    width: 215px;        /* from figma */
    height: 40px;

    padding: 0 16px;

    background: #F1F5F9;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    margin: 0px;
}


/* SEARCH ICON WRAPPER */

.strike-search svg {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
}


/* SEARCH INPUT */

.strike-search input {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;

    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;

    color: #0F172B;
}

/* PLACEHOLDER */

.strike-search input::placeholder {
    color: rgba(0, 20, 72, 0.3);
}

    /* LOGIN */
    .strike-login {
        display: block;
        font-size: 18px;
        color: #0f172b;
        text-decoration: none;
        white-space: nowrap;
    }

 

   
}

/* ============================= */
/* 🖥 LARGE DESKTOP (≥1200px) */
/* ============================= */
@media (min-width: 1200px) {

    .strike-container {
        max-width: 1320px;
    }

    .strike-nav ul {
        gap: 40px;
    }
/* ===== header ends here ===== */



}

/* ===== header ends here ===== */







/* STAT */
.stat{
display:flex;
flex-direction:column;
align-items:center;
}

/* NUMBER */
.stat .stat-number{
font-size:32px;
font-weight:700;
line-height:40px;
color:#fff;
margin:0;
}

/* LABEL */
.stat p{
font-size:14px;
color:#9CA3AF;
margin-top:6px;
}

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



/* ============================= */
/* 📱 delete later (main.css override) */
/* ============================= */

header {
    position: sticky !important;
    margin-top: unset !important;
}


}




/* ============================= */
/* 🟢 MOBILE (0–575px) */
/* ============================= */


.feature-hero-container {
    display: flex;
    flex-direction: column;
    padding: 32px 16px;
}

/* LEFT */
.feature-hero-left {
    text-align: center;
}

/* TITLE */
.feature-title {
    font-size: 32px;
    line-height: 44px;
    font-weight: 700;
    color: #101828;
}

/* SUBTITLE */
.feature-subtitle {
    font-size: 18px;
    margin-top: 8px;
}

/* DESC */
.feature-description {
    font-size: 16px;
    line-height: 26px;
    margin-top: 12px;
}

/* MOBILE IMAGE */
.feature-hero-image-mobile {
    margin: 20px 0;
}

.feature-hero-image-mobile img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 10px;
}

/* HIDE DESKTOP IMAGE */
.feature-hero-right {
    display: none;
}

/* BUTTONS */
.feature-buttons {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
}

.btn-primary,
.btn-secondary {
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
    border-radius: 6px;
}

.btn-primary {
    background: #2f6fed;
    color: #fff;
}

.btn-secondary {
    border: 1px solid #d0d5dd;
    color: #101828;
}

/* STATS */
/* ============================= */
/* MOBILE STATS (0–575) */
/* ============================= */

.feature-stats {
    display: flex;
    justify-content: space-between;
    align-items: center;

    width: 358px; /* exact figma */
    height: 60px;

    gap: 24px;
    margin: 24px auto 0; /* center horizontally */
}

/* INDIVIDUAL STAT */
.feature-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    height: 60px;
}

/* EACH STAT EXACT WIDTH (VERY IMPORTANT) */
.feature-stat:nth-child(1) {
    width: fit-content;
}

.feature-stat:nth-child(2) {
    width: fit-content;
}

.feature-stat:nth-child(3) {
    width: fit-content;
}

/* NUMBER */
.feature-stat-number {
    font-size: 18px;
    line-height: 28px;
    font-weight: 700;
    color: #101828;
}

/* LABEL */
.feature-stat-label {
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
    color: #B0B2B5;
}



/* ============================= */
/* CAPABILITIES - MOBILE */
/* ============================= */

.feature-capabilities {
    display: flex;
    justify-content: center;
}

.feature-capabilities-container {
    display: flex;
    flex-direction: column;
    align-items: center;

    width: 390px;
    padding: 24px;
    gap: 16px;
}

/* HEADER */
.capabilities-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;

    width: 342px;
}

.capabilities-header h2 {
    font-size: 24px;
    line-height: 34px;
    font-weight: 700;
    text-align: center;
    color: #000;
    margin: 0;
}

.capabilities-header p {
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: #4A5565;
    margin: 0;
}

/* GRID → COLUMN */
.capabilities-grid {
    display: flex;
    flex-direction: column;
    gap: 24px;

    width: 342px;
}

/* CARD */
.capability-card {
    display: flex;
    flex-direction: column;
    align-items: center;

    padding: 32px;
    gap: 6px;

    width: 342px;

    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
}

/* ICON CONTAINER */
.capability-icon {
    width: 48px;
    height: 48px;

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

    background: linear-gradient(180deg, #155DFC 0%, #1252E6 100%);
    border-radius: 4px;
}

/* ICON */
.capability-icon img {
    width: 20px;
    height: 20px;
}

/* CARD TITLE */
.capability-card h3 {
    font-size: 18px;
    line-height: 28px;
    font-weight: 700;
    text-align: center;
    color: #101828;
    margin: 0;
}

/* CARD DESC */
.capability-card p {
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: #4A5565;
    margin: 0;
}





@media (min-width: 1200px) {

    .feature-hero-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
flex-direction: row;
        max-width: 1440px;
        margin: 0 auto;
        padding: 80px 0;
overflow:hidden;
    }

    /* LEFT */


    /* LEFT MAIN CONTAINER */
    .feature-hero-left {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;

    text-align: left;


        width: 576px;
        height: 658px;

        padding: 80px 40px 80px 80px;
        gap: 10px;

        background: #ffffff;
    }

    /* TEXT BLOCK */
    .feature-hero-left > h1,
    .feature-hero-left > h2,
    .feature-hero-left > p {
        width: 449px;
    }

    /* TITLE */
    .feature-title {
        font-size: 47px;
        line-height: 64px;
        font-weight: 600;
        color: #101828;
        margin: 0;
    }

    /* SUBTITLE */
    .feature-subtitle {
        font-size: 22px;
        line-height: 34px;
        font-weight: 700;
        margin: 4px 0 0 0;
    }

    /* DESCRIPTION */
    .feature-description {
        font-size: 18px;
        line-height: 28px;
        margin-top: 12px;
        color: #101828;
    }

    /* BUTTON WRAPPER */
    .feature-buttons {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 16px;

        width: 422.9px;
        padding: 32px 0;
    }

    /* PRIMARY BUTTON */
    .btn-primary {
        width: 181px;
        height: 56px;

        background: #155DFC;
        border-radius: 4px;

        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;

        font-size: 16px;
        font-weight: 700;
        color: #ffffff;
        text-decoration: none;
    }

    /* SECONDARY BUTTON */
    .btn-secondary {
        width: 165px;
        height: 54px;

        background: #ffffff;
        border: 1px solid #E5E7EB;
        border-radius: 4px;

        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;

        font-size: 16px;
        font-weight: 700;
        color: #0F172B;
        text-decoration: none;
    }

    /* STATS WRAPPER */
    .feature-stats {
        display: flex;
        align-items: center;
        gap: 24px;

        width: 422.9px;
        margin-top: 0;
    }

    /* SINGLE STAT */
    .feature-stat {
        display: flex;
        flex-direction: column;
        align-items: flex-start;

        width: 126.97px;
    }

    /* NUMBER */
    .feature-stat-number {
        font-size: 22px;
        line-height: 34px;
        font-weight: 700;
        color: #101828;
    }

    /* LABEL */
    .feature-stat-label {
        font-size: 14px;
        line-height: 24px;
        color: #B0B2B5;
    }


    /* HIDE MOBILE IMAGE */
    .feature-hero-image-mobile {
        display: none;
box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
    }

    /* SHOW DESKTOP IMAGE */


    /* RIGHT WRAPPER */
    .feature-hero-right {
        display: flex;
        justify-content: flex-end;
        width: 897px;
box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
    }

    /* OUTER FRAME (matches Figma) */
.hero-image-frame {
    position: relative;

    width: 864px;
    height: 658px;

    background: linear-gradient(180deg, #1E2939 0%, #101828 100%);
    border-radius: 12px 0 0 12px;

    overflow: hidden; /* important */
}
    /* INNER FRAME */
.hero-image-inner {
    position: absolute;

    top: 12px;
    left: 12px;
    bottom: 12px;

    right: 0; /* ✅ NO padding on right */

    border-radius: 10px 0 0 10px; /* match figma */
    overflow: hidden;
}
    /* IMAGE */
.hero-image-inner img {
    width: 100%;
    height: 100%;
    object-fit: cover;   /* ✅ FIX */
    display: block;
        object-position:left;
}

    /* BOTTOM BAR */
    .hero-image-indicator {
        position: absolute;
        bottom: 8px;
        left: 50%;
        transform: translateX(-50%);

        width: 64px;
        height: 4px;

        background: #364153;
        border-radius: 999px;

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

    /* DOT */
    .hero-image-indicator span {
        width: 6px;
        height: 6px;

        background: #4A5565;
        border-radius: 50%;
    }


    /* BUTTONS */
    .feature-buttons {
        flex-direction: row;
        gap: 16px;
     
        width: 422px;
    }

    /* STATS */
    .feature-stats {
        gap: 32px;
      
        width: 422px;
        justify-content: flex-start;
    }

    .feature-stat {
        text-align: left;
    }

    .feature-stat-number {
        font-size: 22px;
    }


    .feature-capabilities-container {
        max-width: 1440px;   /* ✅ instead of width */
        width: 100%;

        margin: 0 auto;
        padding: 80px;
gap:64px;
    }

     .capabilities-header {
        max-width: 1280px;
        width: 100%;
    }

    .capabilities-header h2 {
        font-size: 36px;
        line-height: 52px;
    }

    .capabilities-header p {
        font-size: 18px;
        line-height: 28px;
    }


   .capabilities-grid {
        display: flex;
        gap: 24px;

        max-width: 1280px;   /* ✅ instead of width */
        width: 100%;
        margin: 0 auto;
        flex-direction: row;
    }


 .capability-card {
    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    align-items: flex-start;

    padding: 32px;
    gap: 6px;

    width: 100%;              /* ✅ instead of 410px */
    max-width: 410px;        /* ✅ keeps figma proportion */
    height: 242px;

    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
flex: 1;
        min-width: 370px;   /* 🔥 FIX */
       
}

   
    .capability-card p {
        text-align: left;
    }


.capability-card h3 {
    font-size: 22px;
    line-height: 34px;
    font-weight: 700;
text-align: left;
    color: #101828;

    width: 100%;   /* ✅ instead of fixed width */
    margin: 0;
}

   .capability-card p {
    font-size: 18px;
    line-height: 28px;
    font-weight: 400;
text-align: left;
    color: #4A5565;

    width: 100%;   /* ✅ prevents overflow */
    margin: 0;
}


.capability-icon {
    width: 48px;
    height: 48px;
flex: none;
    display: flex;
    align-items: center;
    justify-content: center;

    background: linear-gradient(180deg, #155DFC 0%, #1252E6 100%);
    border-radius: 4px;
}

.capability-icon img {
    width: 20px;
    height: 20px;
}
/* ============================= */
/* SECONDARY NAV - DESKTOP */
/* ============================= */



    .feature-secondary-nav {
        box-sizing: border-box;

        display: flex;
        justify-content: center;

        width: 100%;
        padding: 48px 80px!important;

        background: #F9FAFB;
        border-top: 1px solid #E5E7EB;
        border-bottom: 1px solid #E5E7EB;
    }

    .feature-secondary-nav-container {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;

        max-width: 1280px;   /* ✅ instead of width */
        width: 100%;
    }

    /* TITLE */
    .feature-nav-title {
        font-size: 18px;
        line-height: 28px;
        font-weight: 600;
        color: #6A7282;
    }

  

    /* LINKS */
    .feature-nav-links a {
        font-size: 18px;
        line-height: 28px;
        font-weight: 600;

        color: #155DFC;
        text-decoration: none;

        display: inline-flex;
        align-items: center;
    }

    /* DIVIDER */
    .feature-nav-links .divider {
        color: #D1D5DC;
        font-size: 18px;
        line-height: 28px;
    }



    /* SHOW NAV ALWAYS */
    .feature-nav-links {
        display: flex !important;
        flex-direction: row;
        gap: 16px;
        align-items: center;
    }

    /* HIDE EXPAND BAR */
    .feature-nav-toggle {
        display: none;
    }

    /* FORCE DETAILS OPEN VISUALLY */
    .feature-nav-accordion {
        display: block;
    }

    .feature-nav-accordion > nav {
        display: flex !important;
    }

 .feature-nav-accordion {
        display: block;
    }

    /* ALWAYS SHOW NAV */
    .feature-nav-links {
        display: flex !important;
        flex-direction: row;
        gap: 16px;
        align-items: center;
    }

    /* HIDE MOBILE TOGGLE */
    .feature-nav-toggle {
        display: none;
    }


    /* BREAK DETAILS BEHAVIOR */
    .feature-nav-accordion {
        display: block;
    }

    /* CRITICAL FIX */
    .feature-nav-accordion > summary {
        display: none;
    }

    /* FORCE CONTENT VISIBLE */
    .feature-nav-accordion > nav {
        display: flex !important;
        flex-direction: row;
        gap: 16px;
        align-items: center;
    }



}






@media (min-width: 768px) and (max-width: 991px) {

    .feature-buttons {
        flex-direction: column;
        justify-content: center;
        align-items: center;

        width: 896px;
        height: 192px;

        padding: 32px 200px;
        gap: 16px;
    }


    .btn-primary {
        width: 496px;
        height: 56px;

        padding: 16px 24px;
        gap: 6px;

        font-size: 16px;
        font-weight: 700;
        line-height: 24px;
   
}



    .btn-secondary {
        width: 496px;
        height: 54px;

        padding: 16px 24px;
        gap: 6px;

        font-size: 16px;
        font-weight: 700;
        line-height: 22px;
  
}



    .feature-buttons img {
        width: 20px;
        height: 20px;
    }

}


/* ============================= */
/* MOBILE / TABLET */
/* ============================= */

@media (max-width: 991px) {

    /* REMOVE DEFAULT ARROW */
    summary::-webkit-details-marker {
        display: none;
    }

    summary {
        list-style: none;
    }

    .feature-secondary-nav {
        padding: 24px;
        background: #F9FAFB;
        border-top: 1px solid #E5E7EB;
        border-bottom: 1px solid #E5E7EB;
    }

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

        padding: 24px;
        background: #FFFFFF;
        border: 1px solid #E5E7EB;
        border-radius: 4px;

        cursor: pointer;
    }

    .feature-nav-title {
        font-size: 14px;
        font-weight: 700;
        color: #062961;
    }

    .feature-nav-expand {
        display: flex;
        align-items: center;
        gap: 6px;

        font-size: 12px;
        font-weight: 700;
        color: #45556C;
    }

    /* ARROW */
    .arrow {
        width: 6px;
        height: 6px;
        border-right: 2px solid #45556C;
        border-bottom: 2px solid #45556C;
        transform: rotate(45deg);
        transition: 0.3s;
    }

    /* ROTATE ON OPEN */
    .feature-nav-accordion[open] .arrow {
        transform: rotate(-135deg);
    }

    /* HIDDEN CONTENT */
    .feature-nav-links {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding-top: 16px;
    }

    .feature-nav-links .divider {
        display: none; /* ❌ remove | */
    }

    .feature-nav-links a {
        font-size: 14px;
        font-weight: 600;
        color: #155DFC;
        text-decoration: none;
    }


   

    .feature-nav-accordion[open] .feature-nav-links {
        display: flex;
    }

}




/* ============================= */
/* MOBILE (DEFAULT CLOSED) */
/* ============================= */



.feature-nav-accordion[open] .feature-nav-links {
    display: flex;
}


/* ============================= */
/* DESKTOP (FORCE OPEN VISUALLY) */
/* ============================= */

@media (min-width: 992px) {

    /* SHOW NAV ALWAYS */
    .feature-nav-links {
        display: flex !important;
        flex-direction: row;
        gap: 16px;
        align-items: center;
    }

    /* HIDE TOGGLE */
    .feature-nav-toggle {
        display: none;
    }

}



/* =========================
   Tablet + Desktop (from mobile landscape)
========================= */

@media (min-width: 768px) {
.feature-content {
    padding: 64px 40px;
  }

  .feature-content-container {
    gap: 64px; /* MAIN GAP */
  }

  .feature-cards-wrap {
    gap: 64px;
    margin-top: 0;
  }
 

  .feature-content-container {
    max-width: 1280px;
    margin: 0 auto;

  }

.feature-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 0 16px;
  height: 37px;

  width: auto;       /* important */
  flex: none;        /* figma exact */

  background: #EFF6FF;
  border-radius: 999px;

  font-size: 14px;
  font-weight: 600;
  line-height: 24px;

  color: #155DFC;
}

  /* =========================
     Feature Card Layout
  ========================= */

  .feature-card {
    display: flex;
    flex-direction: row;
    align-items: center;

    width: 100%;
    height: auto;

    margin-bottom: 48px;

    background: #F3F4F6;
    border-radius: 4px;

    box-shadow: 0px 4px 6px rgba(0,0,0,0.05),
                0px 10px 15px rgba(0,0,0,0.1);

    overflow: hidden;
  }

  /* =========================
     TEXT SIDE
  ========================= */

  .feature-card-text {
    width: 50%;
    padding: 24px 40px;

    background: #FFFFFF;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }

  .feature-card-text > * {
    max-width: 512px;
    
  }

  .feature-card-text h3,
  .feature-card-text p {
    text-align: left;
  }

  /* =========================
     IMAGE SIDE
  ========================= */

  .feature-card-image {
    width: 50%;

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

    padding: 24px;
  }

  .feature-card-image img {
    width: 100%;
    max-width: 592px;
    height: auto;

    object-fit: cover;
    border-radius: 4px;
  }

  /* =========================
     REVERSE LAYOUT
  ========================= */

  .feature-card.reverse {
    flex-direction: row-reverse;
  }

.feature-link {
  
    justify-content: end;
}


  .feature-steps {
    padding: 64px 80px;
  }

  .feature-steps-container {
    gap: 64px; /* main section gap */
    max-width: 1280px;
    margin: 0 auto;
  }

  /* =========================
     Header
  ========================= */

  .feature-steps-header h2 {
       width: 100%;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 36px;
    line-height: 45px;
    text-align: center;
    letter-spacing: -0.531px;
    color: #000000;
    margin-bottom: 8px;
  }

  .feature-steps-header p {
    font-size: 18px;
    line-height: 28px;
  }

  /* =========================
     Steps Grid (ROW)
  ========================= */

  .feature-steps-grid {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
  }

  /* =========================
     Each Step = 3 Columns
  ========================= */

  .feature-step {
    width: calc(33.33% - 16px);
    max-width: 410px;

    gap: 16px;
  }

  /* =========================
     Title
  ========================= */

  .feature-step h3 {
    font-size: 22px;
    line-height: 34px;
  }

  /* =========================
     Description
  ========================= */

  .feature-step p {
    font-size: 18px;
    line-height: 28px;
    max-width: 410px;
  }
.feature-steps-header {

    max-width: 100%;
}




  .all-features {
    padding: 64px;
  }

  .all-features-container {
    max-width: 896px;
    gap: 40px;
  }

  .all-features-header h2 {
    font-size: 32px;
    line-height: 46px;
     
        font-family: 'Roboto', sans-serif;
        font-weight: 700;
  }

  .all-features-header p {
    font-size: 18px;
    line-height: 28px;
  }

  /* ✅ 2 COLUMN GRID */
  .all-features-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }

 .feature-faq {
    padding: 64px 80px; /* figma exact */
  }

  .feature-faq-container {
    max-width: 1280px;   /* 🔥 IMPORTANT */
    margin: 0 auto;      /* center content */
    
    display: flex;
    flex-direction: column;
    gap: 48px;
  }

  .faq-list {
    gap: 24px;
  }
}

/* =========================
   Desktop (≥1024px)
========================= */

@media (min-width: 1024px) {

  .all-features {
    padding: 64px 80px;
  }

  .all-features-container {
    max-width: 1280px;
    margin: 0 auto;
    gap: 40px;
  }

  /* =========================
     GRID → 4 COLUMNS
  ========================= */

  .all-features-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 🔥 4 columns */
    gap: 24px;
  }

  /* =========================
     CARD
  ========================= */

  .feature-item {
    max-width: 302px;
    width: 100%;
  }

  /* =========================
     IMAGE
  ========================= */

  .feature-item-image {
    padding: 10px;
  }

  .feature-item-image img {
    width: 100%;
    height: 125px; /* exact figma */
    object-fit: cover;
    border-radius: 2px;
  }

  /* =========================
     CONTENT (LEFT ALIGN NOW)
  ========================= */

  .feature-item-content {
    align-items: flex-start;   /* 🔥 change */
    text-align: left;          /* 🔥 change */

    padding: 32px;
    gap: 12px;
  }

  /* TITLE */
  .feature-item-content h3 {
    font-size: 18px;
    line-height: 28px;
  }

  /* DESC */
  .feature-item-content p {
    font-size: 14px;
    line-height: 24px;
min-height: 120px;
  }

  /* CTA */
  .feature-item-link {
    justify-content: flex-start;
  }
.all-features-header {
    text-align: center;
    max-width: 100%;
}
}



/* ===========================
   Testimonials
=========================== */

.feature-testimonials{
    background:#FCFCFC;
    padding:64px;
}

.testimonial-container{
    max-width:1312px;
    margin:0 auto;
}

.testimonial-title{
    margin:0 0 64px;
    text-align:center;
    font-size:32px;
    line-height:46px;
    font-weight:700;
    color:#0F172B;
}

.testimonial-slider{
    overflow:hidden;
}

.testimonial-track{
    display:flex;
    gap:24px;
}

.testimonial-card{
    flex:0 0 calc(33.333% - 16px);
    min-width:358px;
    background:#fff;
    border-radius:4px;
    box-shadow:0 4px 12px rgba(0,0,0,.10);
    padding:24px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.testimonial-user{
    display:flex;
    align-items:center;
    gap:16px;
}

.avatar{
    width:56px;
    height:56px;
    border-radius:50%;
    overflow:hidden;
    flex-shrink:0;
}

.avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.user-info{
    flex:1;
}

.user-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
}

.user-top h3{
    margin:0;
    font-size:18px;
    line-height:28px;
    font-weight:700;
    color:#0F172B;
}

.rating{
    display:flex;
    align-items:center;
    gap:4px;
    font-size:18px;
    font-weight:700;
    color:#0F172B;
    white-space:nowrap;
}

.star-icon{
    width:16px;
    height:16px;
}

.role{
    margin:4px 0 0;
    font-size:14px;
    line-height:24px;
    color:#64748B;
}

/* ===========================
   Video Thumbnail
=========================== */

.testimonial-video{
    position:relative;
    display:block;
    width:100%;
    height:207px;
    overflow:hidden;
    text-decoration:none;
}

.video-thumb{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.play-button{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:64px;
    height:64px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.25s ease;
}

.play-button img{
    width:64px;
    height:64px;
}

.testimonial-video:hover .play-button{
    transform:translate(-50%,-50%) scale(1.08);
}

.meta{
    margin-top:auto;
    font-size:14px;
    line-height:24px;
    color:#94A3B8;
}

/* ===========================
   Slider Dots
=========================== */

.testimonial-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:24px;
}

.dot{
    width:8px;
    height:8px;
    background:#D1D5DC;
    border-radius:999px;
    transition:.3s;
}

.dot.active{
    width:32px;
    background:#155DFC;
}

/* ===========================
   Mobile
=========================== */

@media (max-width:768px){

.feature-testimonials{
    padding:16px 10px;
}

.testimonial-title{
    font-size:24px;
    line-height:34px;
    margin-bottom:16px;
}

.testimonial-slider{
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
}

.testimonial-slider::-webkit-scrollbar{
    display:none;
}

.testimonial-track{
    gap:24px;
}

.testimonial-card{
    flex:0 0 358px;
    min-width:358px;
    padding:24px;
}

.user-top h4{
    font-size:16px;
    line-height:26px;
}

.rating{
    font-size:16px;
}

.role{
    line-height:24px;
}

.testimonial-video{
    height:207px;
}

.meta{
    font-size:14px;
}

.testimonial-dots{
    margin-top:16px;
}

}
.testimonial-video{
    display:block;
    text-decoration:none;
}

.video-placeholder{
    position:relative;
    width:100%;
    height:207px;
    background:#DED2D2;   /* Same as Figma */
    overflow:hidden;
}

.play-button{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:64px;
    height:64px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.25s;
}

.play-button img{
    width:64px;
    height:64px;
}

.testimonial-video:hover .play-button{
    transform:translate(-50%,-50%) scale(1.08);
}
.avatar-placeholder{
    width:56px;
    height:56px;
    border-radius:50%;
    background:#C4C4C4;
    flex-shrink:0;
}

.video-placeholder{
    position:relative;
    width:100%;
    height:207px;
    background:#DED2D2;
    display:flex;
    align-items:center;
    justify-content:center;
}



@media (max-width:768px){

    .video-placeholder{
        height:207px;
    }

}

@media (min-width: 768px) {

  .why-scanners {
    padding: 64px 40px;
  }

  .why-container {
    max-width: 896px; /* figma tablet */
    gap: 32px;
  }

  .why-title {
    font-size: 32px;
  }

}

@media (min-width: 1024px) {

  .why-scanners {
    padding: 64px 80px;
  }

  .why-container {
    max-width: 1280px;
    gap: 64px;
  }

  .why-title {
    font-size: 36px;
  }

  /* 🔥 MAIN CHANGE */
  .why-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
  }

  .why-card {
    padding: 32px;
  }

  .why-content h3 {
    font-size: 22px;
    line-height: 34px;
  }

  .why-content p {
    font-size: 18px;
    line-height: 28px;
  }

}


.why-icon {
  width: 48px;
  height: 48px;

  min-width: 48px;   /* 🔥 IMPORTANT */
  min-height: 48px;  /* 🔥 IMPORTANT */

  flex-shrink: 0;    /* 🔥 CRITICAL FIX */

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

  border-radius: 4px;
}

.why-icon img,
.why-icon svg {
  width: 24px;
  height: 24px;

  object-fit: contain;
}







/* =========================
   SECTION (MOBILE ONLY)
========================= */

.strike-cta {
  padding: 0;
  background: #fff;
}

/* OUTER WRAP */
.cta-container {
  margin: 0 0px;
  padding: 24px;

  display: flex;
  flex-direction: column;
  gap: 40px;

  background: linear-gradient(135deg, #0F172B 0%, #1D293D 50%, #0F172B 100%);
  border-radius: 2px;
}

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

.cta-left {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* BRAND */
.cta-brand {
  display: flex;
  align-items: center;
  gap: 8px;
}

.brand-bar {
  width: 4px;
  height: 32px;
  background: linear-gradient(180deg, #2B7FFF, #AD46FF);
  border-radius: 999px;
}

.cta-brand p {
  font-size: 16px;
  color: #fff;
  margin: 0;
font-weight: 500;
}

/* SUBTITLE */
.cta-subtitle {
  font-size: 14px;
  font-weight: 600;
  color: #51A2FF;
  margin: 0;
}

/* =========================
   IMAGE (IMPORTANT FIX)
========================= */

.cta-image {
  padding: 2px;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
}

.cta-image img {
  width: 100%;
  display: block;
  border-radius: 10px;
}

/* =========================
   FEATURES
========================= */

.cta-features {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.cta-features span {
  display: flex;
  align-items: center;
  gap: 8px;

  font-size: 14px;
  color: #D1D5DC;
}

/* GREEN DOT */
.cta-features i {
  width: 6px;
  height: 6px;
  background: #00C950;
  border-radius: 50%;
}

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

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

  padding: 12px;
  background: #155DFC;
  color: #fff;

  border-radius: 4px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

/* NOTE */
.cta-note {
  text-align: center;
  font-size: 14px;
  color: #99A1AF;
}

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

.cta-right {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.cta-right h2 {
  font-size: 32px;
  line-height: 44px;
  color: #fff;
  margin: 0;
}

.cta-desc {
  font-size: 14px;
  color: #D1D5DC;
  margin: 0;
}

/* =========================
   LIST
========================= */

.cta-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.cta-item {
  display: flex;
  gap: 12px;
}

.cta-item img {
  width: 16px;
  height: 16px;
}

.cta-item strong {
  color: #fff;
  font-size: 14px;
  display: block;
}

.cta-item p {
  font-size: 14px;
  color: #99A1AF;
  margin: 0;
}

/* =========================
   TESTIMONIAL
========================= */

.cta-testimonial {
  padding: 12px 16px;

  background: rgba(255,255,255,0.05);
  border-left: 4px solid rgba(255,255,255,0.2);

  display: flex;
  flex-direction: column;
  gap: 12px;
}

.stars {
  color: #FDC700;
}

.cta-testimonial p {
  font-size: 14px;
  color: #D1D5DC;
  margin: 0;
}

.cta-testimonial span {
  font-size: 12px;
  color: #6A7282;
}

/* =========================
   STATS (2x2 GRID)
========================= */

.cta-stats {
  background: #101828;
  padding: 24px 16px;
}

.cta-stats-inner {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.stat {
  text-align: center;
}

.stat .stat-number{
  font-size: 20px;
  color: #fff;
  margin: 0;
}

.stat p {
  font-size: 14px;
  color: #99A1AF;
  margin: 0;
}



/* =========================
   TABLET + LANDSCAPE (≥768px)
========================= */

@media (min-width: 768px) {

  .strike-cta {
    padding: 40px;
    background: #1B263A;
  }

  .cta-container {
    max-width: 896px;
    margin: 0 auto;

    flex-direction: row;
    gap: 32px;

    padding: 24px;
  }

  .cta-left,
  .cta-right {
    width: 50%;
  }

  .cta-right h2 {
    font-size: 32px;
    line-height: 44px;

  }

.about-text p {
  font-size: 14px;
  line-height: 22px;
max-width: 183px;
}
}

/* =========================
   DESKTOP (≥1024px)
========================= */

@media (min-width: 1024px) {

  .strike-cta {
    padding: 24px 48px;
  }

  .cta-container {
    max-width: 1280px;
    gap: 40px;
  }

  .cta-right h2 {
    font-size: 40px;
    line-height: 56px;
  }

  /* FEATURES INLINE */
  .cta-features {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 24px;
  }

  /* BUTTON CENTERED */
  .cta-btn {
    width: 347px;
    margin: 16px auto 0;
  }

  /* STATS → 4 COLUMN */
  .cta-stats-inner {
    max-width: 1280px;
    margin: 0 auto;
    grid-template-columns: repeat(4, 1fr);
  }

  .stat .stat-number{
    font-size: 28px;
  }

}

/* =========================
   BASE
========================= */

.strike-footer {
    background: white;
   
    border-top: 1px solid #E5E7EB;
}

.footer-container {
max-width: 1440px;
  margin: 0 auto;
  padding: 0 16px;
}

/* =========================
   TOP STRIP
========================= */

/* =========================
   FOOTER TOP STRIP (FIGMA MATCH)
========================= */

.footer-top-strip {
  background: #000; /* matches your footer */
  border-bottom: 1px solid rgba(255,255,255,0.08);

}

.footer-strip-inner {
  display: flex;
  align-items: center;
  gap: 16px;
 padding-top: 5px;
 padding-bottom: 23px;
}




/* ICON BOX */
.sebi-icon {
  width: 45px;
  height: 45px;
  border-radius: 4px;
  background: linear-gradient(135deg, #E17100 0%, #FDC700 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;

  box-shadow: 0px 4px 4px rgba(0,0,0,0.25);
}

/* TEXT BLOCK */
.sebi-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* TITLE */
.sebi-content h4 {
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
  color: #101828;
  margin: 0;
}

/* SUBTITLE */
.sebi-content p {
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  color: #101828;
  margin: 0;
}

/* VERIFIED ROW */
.verified-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

/* REG TEXT */
.verified-row span:first-child {
  font-size: 14px;
  font-weight: 600;
  color: #0B950D;
}

/* DOT */
.verified-dot {
  width: 8px;
  height: 8px;
  background: #0B950D;
  border-radius: 50%;
}

/* VERIFIED TEXT */
.verified-row span:last-child {
  font-size: 14px;
  font-weight: 600;
  color: #0B950D;
}



/* =========================
   COMMON
========================= */

.footer-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* HEADINGS */
.footer-title {
  display: block;
  font-size: 22px;
  line-height: 34px;
  font-weight: 700;
  color: #101828;
  margin: 0;
}

/* LINKS */
.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 10px;
}

.footer-links a {
  font-size: 14px;
  color: #9CA3AF;
  text-decoration: none;
  line-height: 20px;
}

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

/* PREVENT TEXT BREAKING */
.footer-links a,
.footer-col p {
  word-break: keep-all;
}

/* =========================
   ABOUT
========================= */

.footer-logo img {
  height: 28px;
}

.about-text {
  display: flex;
  gap: 10px;
}

.gradient-bar {
    width: 5px;
    background: linear-gradient(180deg, #155DFC, #9810FA);
    border-radius: 999px;
    height: 86px;
}

.about-text p {
  font-size: 14px;
  line-height: 22px;
}

/* SOCIAL */
.footer-heading-blue {
  color: #4285F4;
  font-size: 14px;
}

.social-icons {
  display: flex;
  gap: 10px;
}

.social-icons img {
  width: 20px;
}

/* APP */
.footer-app h5 {
  font-size: 14px;
}

.footer-app-links {
  display: flex;
  gap: 8px;
margin: 12px 0;
}

/* =========================
   CONNECT
========================= */

.connect-col p {
  font-size: 14px;
  line-height: 22px;
  color: #9CA3AF;
  margin: 0;
}

.connect-col a {
  color: #101828;
  text-decoration: none;
}



/* =========================
   TABLET
========================= */

@media (min-width: 768px) {


.footer-strip-inner {


        padding: 24px 48px !important;
   
        height: 112px;
        border-bottom: 1px solid #E5E7EB;
}

}

/* =========================
   DESKTOP (PIXEL PERFECT)
========================= */

@media (min-width: 1024px) {

  .footer-container {
    padding: 0 48px;
  }

 

  /* LOCK POSITIONS (CRITICAL) */

  .about-col {
    grid-column: 1;
    grid-row: 1;
  }

  .company-col {
    grid-column: 2;
    grid-row: 1;
  }

  .product-col {
    grid-column: 3;
    grid-row: 1;
  }

  .learn-col {
    grid-column: 4;
    grid-row: 1;
  }

  .legal-col {
    grid-column: 5;
    grid-row: 1;
  }

  /* CONNECT BELOW COMPANY */
  .connect-col {
    grid-column: 2;
    grid-row: 2;
    margin-top: -8px; /* subtle tighten */
  }

}

/* =========================
   FOOTER FINAL FIX
========================= */

/* =========================
   FOOTER FINAL FIX
========================= */

.strike-footer {
      background: white;
  
}

/* =========================
   MAIN GRID
========================= */
/* =========================
   FOOTER COLORS
========================= */

/* TOP STRIP */
.footer-top-strip {
  background: #ffffff;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

/* MAIN FOOTER */


/* BOTTOM COPYRIGHT */
.footer-bottom {
  background: #ffffff;
  border-top: 1px solid #E5E7EB;
  padding: 16px 0;
  text-align: center;
}

.footer-bottom p {
     font-size: 14px;
    color: #6A7282;
    margin: 0;
}

/* HEADINGS */
.footer-col h5 {
  color: #101828;
  font-weight: 700;
}

/* LINKS */
.footer-links a {
  color: #9CA3AF;
  transition: 0.2s ease;
}

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

/* ABOUT TEXT */
.about-text p {
  color: #9CA3AF;
}

/* CONNECT */
.connect-col p {
  color: #9CA3AF;
}

/* BLUE LABEL */
.footer-heading-blue {
  color: #155DFC;
}

/* VERIFIED GREEN */
.verified-row {
  color: #22C55E;
}

/* ICONS (slight dim like figma) */
.social-icons img {
  opacity: 0.8;
}

.social-icons img:hover {
  opacity: 1;
}






/* =========================
   DEFAULT MOBILE (FORCED FIX)
========================= */

.footer-main {
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;

  grid-template-areas:
    "about about"
    "company connect"
    "product learn"
    "legal legal";
}

/* MAP AREAS */
.about-col { grid-area: about; }
.company-col { grid-area: company; }
.connect-col { grid-area: connect; }
.product-col { grid-area: product; }
.learn-col { grid-area: learn; }
.legal-col { grid-area: legal; }

/* =========================
   FIX MOBILE SINGLE COLUMN BUG
========================= */

@media (max-width: 480px) {
  .footer-main {
    grid-template-columns: repeat(2, 1fr) !important;
  }
.gradient-bar {
    width: 5px;
    background: linear-gradient(180deg, #155DFC, #9810FA);
    border-radius: 999px;
    height: 40px;
}
}

/* =========================
   TABLET
========================= */


/* =========================
   DESKTOP (STRICT FIGMA)
========================= */

@media (min-width: 1024px) {

 

.connect-col {
    margin-top: -239px !important;
}

}

/* =========================
   TEXT FIXES (CRITICAL)
========================= */

.footer-links a {

    color: #101828; 
}

.footer-col p {
  word-break: normal;
color:#101828;
font-size:14px;
}

/* =========================
   CONNECT ALIGNMENT FIX
========================= */

.connect-col {
  margin-top: 0;
}

/* =========================
   GENERAL SPACING FIX
========================= */

.footer-col {
  gap: 24px;
}





/* =========================
   ANALYTICS DROPDOWN
========================= */

.analytics-menu {
  position: relative;
}

.analytics-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
   
  width: 720px;
  background: #fff;

  border-radius: 6px;
  box-shadow: 0px 25px 50px -12px rgba(0,0,0,0.25);

  display: none;
z-index:999;

}

/* SHOW */
.analytics-menu:hover .analytics-dropdown {
  display: block;
}

/* HEADER */
.dropdown-header {
  display: flex;
  justify-content: space-between;
  align-items: center;

  padding: 24px 28px;
  border-bottom: 1px solid #E5E7EB;
}

.dropdown-title {
  display: block;
  font-size: 20px;
  font-weight: 700;
  color: #101828;
  margin: 0;
}

.dropdown-header p {
  font-size: 14px;
  color: #4A5565;
  margin-top: 4px;
}

.all-tools {
  font-size: 15px;
  font-weight: 600;
  color: #155DFC;
  text-decoration: none;
}

/* GRID */
.dropdown-grid {
  display: flex;
  flex-wrap: wrap;
  padding: 16px;
}

/* ITEM */
.dropdown-item {
  width: 50%;
  display: flex;
  align-items: center;
  gap: 14px;

  padding: 12px 16px;
  border-radius: 6px;

  text-decoration: none;
  font-size: 15px;
  color: #1E2939;

  transition: background 0.2s ease;
}

.dropdown-item:hover {
  background: #F9FAFB;
}

/* ICON BOX */
.icon-box {
  width: 40px;
  height: 40px;
  min-width: 40px;

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

  border-radius: 6px;
}

/* ICON IMAGE */
.icon-box img {
  width: 20px;
  height: 20px;
  display: block;
}

/* BACKGROUND COLORS */
.purple { background: #FAF5FF; }
.red { background: #FEF2F2; }
.orange { background: #FFF7ED; }
.blue { background: #EFF6FF; }
.green { background: #F0FDF4; }
.teal { background: #F0FDFA; }
.lightblue { background: #EFF6FF; }
.orange2 { background: #FFF7ED; }
.red2 { background: #FEF2F2; }
.green2 { background: #F0FDF4; }
.yellow { background: #FEFCE8; }
.pink { background: #FDF2F8; }

/* =========================
   MOBILE
========================= */

@media (max-width: 1024px) {

  .analytics-dropdown {
    position: static;
    width: 100%;
    box-shadow: none;
  }

  .dropdown-item {
    width: 100%;
  }

}



/* --- Root Section --- */
/* --- Root Section --- */
/* --- Root Section (Matches Upper Sections Alignment) --- */
/* --- Root Section: Full Width Borders & Background --- */
.feature-secondary-nav {
    width: 100%;
    background: #F9FAFB;
    border-top: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
    padding: 48px 0; /* Vertical spacing per Figma */
}

/* --- Container: Matches Upper Section Alignment --- */
.feature-secondary-nav-container {
    max-width: 1280px; /* Adjust to match your site's grid */
    margin: 0 auto;
    
}

/* --- Desktop Layout (No Box) --- */
.nav-content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

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

.feature-nav-title {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 28px;
    color: #6A7282; /* Muted grey for desktop title */
}

/* --- Expand/Arrow (Hidden on Desktop) --- */
.feature-nav-expand {
    display: none;
    align-items: center;
    gap: 8px;
    color: #111827;
    font-weight: 600;
}

.arrow {
    width: 5px;
    height: 5px;
    border: solid #6A7282;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
}

/* --- Navigation Links --- */
.feature-nav-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.feature-nav-links a {
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: #155DFC;
}

.divider {
    color: #D1D5DC;
    font-weight: 600;
    margin: 0 4px;
}

/* --- RESPONSIVE LOGIC (Mobile/Tablet Boxed) --- */
@media (max-width: 991px) {
    .feature-secondary-nav {
        background: transparent; /* Remove background from full-width section */
        border: none; /* Remove full-width borders */
        padding: 24px 0;
    }

    /* Create the Box only on Mobile */
    .nav-content-wrapper {
        background: #F9FAFB;
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        padding: 16px 20px;
        gap: 0;
    }

    .feature-nav-expand {
        display: flex; /* Show Expand on mobile */
    }

    .feature-nav-title {
        color: #111827; /* Darker title for mobile card */
    }

    /* Hide links by default on mobile */
    .nav-content-wrapper:not(.is-open) .feature-nav-links {
        display: none;
    }

    .nav-content-wrapper.is-open .feature-nav-links {
        margin-top: 16px;
    }

    .nav-content-wrapper.is-open .arrow {
        transform: rotate(-135deg);
    }
    
    .nav-header {
        cursor: pointer;
    }
}

/* --- Desktop Force --- */
@media (min-width: 992px) {
    .feature-nav-links {
        display: flex !important;
    }
}



/* ================= HEADER ================= */

/* =====================================
   HEADER BASE
===================================== */

.strike-header {
  height: 60px;
  background: #fff;
  border-bottom: 1px solid #E5E7EB;
  box-shadow: 0 1px 2px rgba(0,0,0,0.1);
  position: sticky;
  top: 0;
  z-index: 1000;
}

.strike-container {
  max-width: 1440px;
  margin: 0 auto;
  height: 100%;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

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

.strike-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* LOGO */
.strike-logo img {
  width: 84px;
  height: 24px;
}

/* =====================================
   HAMBURGER
===================================== */

.strike-menu-toggle {
  display: flex;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
}

.strike-menu-toggle span {
  width: 20px;
  height: 2px;
  background: #101828;
}

/* =====================================
   NAVIGATION (DESKTOP)
===================================== */

.strike-nav ul {
  display: flex;
  align-items: center;
 
  list-style: none;
  margin: 0;
  padding: 0;
}

.strike-nav li {
  display: flex;
  align-items: center;
  height: 60px;
}

.strike-nav a {
  font-size: 16px;
  color: #0F172B;
  text-decoration: none;
}

/* DROPDOWN */

.has-dropdown {
  position: relative;
}

.dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  padding: 12px;
  border-radius: 6px;
  display: none;
  box-shadow: 0 20px 40px rgba(0,0,0,0.1);
z-index:999;
}

.has-dropdown:hover .dropdown {
  display: block;
}

.dropdown a {
  display: block;
  padding: 6px 0;
}

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

.strike-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* SEARCH */

.strike-search {
  display: flex;
  align-items: center;
  gap: 8px;

  width: 215px;
  height: 40px;

  padding: 0 16px;

  background: #F1F5F9;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
margin:0px;
}

.strike-search input {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  font-size: 16px;
}

/* LOGIN */

.strike-login {
  font-size: 16px;
  color: #0F172B;
  text-decoration: none;
}

/* CTA */

.strike-cta-nav {
  display: flex;
  align-items: center;
  justify-content: center;

  height: 40px;
  padding: 0 24px;

  background: linear-gradient(90deg, #314158 0%, #1D293D 100%);
  border-radius: 4px;

  font-size: 16px;
  color: #fff;
  text-decoration: none;
}

/* =====================================
   MOBILE MENU
===================================== */

.mobile-menu {
  position: fixed;
  top: 60px;
  left: 0;
  width: 100%;
  background: #fff;

  transform: translateY(-100%);
  transition: 0.3s ease;
  z-index: 999;
}

.mobile-menu.active {
  transform: translateY(0);
}

.mobile-menu-inner {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* MOBILE ITEM */

.mobile-item {
  display: flex;
  flex-direction: column;
}

/* LINK */

.mobile-link {
  display: flex;
  justify-content: space-between;
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
}

/* SUBMENU */

.mobile-submenu {
  display: none;
  padding-left: 16px;
  margin-top: 8px;
  gap: 8px;
}

.mobile-item.active .mobile-submenu {
  display: flex;
  flex-direction: column;
}

/* ARROW */

.arrow {
  width: 6px;
  height: 6px;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  transform: rotate(45deg);
  transition: 0.3s;
}

.mobile-item.active .arrow {
  transform: rotate(-135deg);
}

/* =====================================
   MOBILE SEARCH FIX
===================================== */

@media (max-width: 991px) {

  .strike-nav {
    display: none !important;
  }

  .strike-login {
    display: none;
  }

  /* SEARCH ICON MODE */
  .strike-search {
    width: 40px;
    height: 40px;
    padding: 0;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
  }

  .strike-search input {
    display: none;
    position: absolute;
    top: 70px;
    left: 16px;
    right: 16px;

    width: calc(100% - 32px);
    height: 40px;

    background: #F1F5F9;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    padding: 0 12px;
  }

  .strike-search.active input {
    display: block;
  }
}

/* =====================================
   DESKTOP (FIGMA MATCH)
===================================== */

@media (min-width: 992px) {

  .strike-header {
    height: 64px;
  }

  .strike-container {
    padding: 0 32px;
  }

  .strike-left {
    gap: 77px;
  }

  .strike-nav li {
    height: 64px;
  }

  .strike-nav a {
    font-size: 18px;
  }

  .strike-login {
    font-size: 18px;
  }

  .strike-cta-nav {
    width: 176px;
    font-size: 18px;
  }

  .strike-menu-toggle {
    display: none;
  }

  .mobile-menu {
    display: none;
  }
}

.search-icon {
  width: 16px;
  height: 16px;
  display: block;
}




/* MOBILE HIDDEN BY DEFAULT */
.cta-mobile {
  display: none;
}

/* TABLET + MOBILE */
@media (max-width: 991px) {
  .cta-desktop {
    display: none;
  }
  .cta-mobile {
    display: inline;
  }

/* Fix the Hero Image Aspect Ratio to stop Layout Shift */
.strike-hero-lcp {
    width: 100% !important;
    height: auto !important;
  
    display: block;
}
}



html, body {
    overflow-x: hidden;
}


.rating {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.star-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}



/* Default dots */
.testimonial-dots .dot {
  width: 8px;
  height: 8px;
  background: #D1D5DC;
  border-radius: 999px;
  flex-shrink: 0;
}

/* Active dot (long one) */
.testimonial-dots .dot.active {
  width: 32px;
  height: 8px;
  background: #155DFC;
}


/* =========================================
   ABOUT HERO SECTION
   ========================================= */

.about-page .about-hero {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 64px 80px;
    gap: 16px;

    width: 100%;
    min-height: 280px;

    background: #FFFFFF;
    border-bottom: 1px solid #E5E7EB;
}

/* container aligned to figma 1280 */
.about-page .about-hero .about-container {
    max-width: 1280px;
    margin: 0 auto;
    width: 100%;
}

/* TITLE */
.about-page .about-hero-title {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 60px;
    line-height: 78px;
    color: #101828;

    margin: 0;
}

/* SUBTITLE */
.about-page .about-hero-subtitle {
 
    font-size: 48px;
    line-height: 58px;
    color: #292B30;

    margin: 0;
}


@media (max-width: 768px) {

    .about-page .about-hero {
        padding: 16px;              /* exact figma */
        gap: 8px;                   /* exact figma */
        min-height: 164px;

        align-items: center;        /* center container */
        text-align: center;
    }

    .about-page .about-hero .about-container {
        max-width: 358px;           /* figma width */
        width: 100%;
    }

    .about-page .about-hero-title {
        font-size: 36px;
        line-height: 48px;
        text-align: center;
    }

    .about-page .about-hero-subtitle {
        font-size: 32px;
        line-height: 38px;
        text-align: center;
    }

.all-features-grid {
    display: grid;
    grid-template-columns: 1fr 1FR;
    gap: 24px;
    width: 100%;
    grid-auto-flow: row;
}
}


/* =========================================
   ABOUT CONTENT (MOBILE FIRST)
========================================= */

/* =========================================
   ABOUT INTRO SECTION
========================================= */

/* MOBILE FIRST */
.about-page .about-intro {
    display: flex;
    flex-direction: column;

    padding: 16px;
    gap: 24px;

    align-items: center;
    text-align: center;
}

.about-page .about-intro .about-container {
    max-width: 358px;
    width: 100%;
}

.about-page .about-intro p {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #4A5565;

    margin: 0;
}

.about-page .about-intro .about-container {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

@media (min-width: 768px) {

    .about-page .about-intro {
        padding: 32px;
        align-items: center;
        text-align: center;
    }

    .about-page .about-intro .about-container {
        max-width: 720px;
    }

 
    .about-page .about-intro p {
        font-size: 17px;
        line-height: 27px;
    }

    .about-page .about-intro .about-container {
        max-width: 720px;
    }

}

@media (min-width: 1024px) {

    .about-page .about-intro {
        padding: 48px 80px;
        gap: 24px;

        align-items: flex-start;
        text-align: left;
    }

    .about-page .about-intro .about-container {
        max-width: 1280px;
        margin: 0 auto;
    }



    .about-page .about-intro p {
        font-size: 18px;
        line-height: 28px;
    }

    .about-page .about-intro .about-container {
        max-width: 1206px;
    }

}


/* =========================================
   ABOUT STATS (MOBILE FIRST)
========================================= */

.about-page .about-stats {
    padding: 16px;
    border-top: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
}

/* GRID */
.about-page .about-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

/* EACH ITEM */
.about-page .about-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}

/* NUMBER */
.about-page .about-stat h3 {
    margin: 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 34px;
    color: #072999;
}

/* LABEL */
.about-page .about-stat p {
    margin: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    line-height: 24px;
    color: #4A5565;
}


@media (min-width: 768px) {

    .about-page .about-stats {
        padding: 40px 64px;
    }

    .about-page .about-stats-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .about-page .about-stat h3 {
        font-size: 32px;
        line-height: 46px;
    }
}

@media (min-width: 1024px) {

    .about-page .about-stats {
        padding: 48px 80px;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .about-stats-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }

    .about-page .about-stat h3 {
        font-size: 36px;
        line-height: 52px;
    }
}

/* =========================================
   ABOUT VISION (MOBILE FIRST)
========================================= */

.about-page .about-vision {
    padding: 16px;
}

/* CARD */
.about-page .about-vision-card {
    background: #F9FAFB;
    border-radius: 10px;

    display: flex;
    flex-direction: column;
    align-items: center;

    padding: 64px;
    gap: 32px;

    text-align: center;
}

/* TITLE */
.about-page .about-vision-card h2 {
    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 30px;
    color: #101828;
}

/* TEXT */
.about-page .about-vision-text {
    margin: 0;

  font-family: 'RobotoLightAbout', sans-serif;
    font-weight: 300;
    font-size: 32px;
    line-height: 38px;
    color: #101828;

    max-width: 230px; /* figma */
}


@media (min-width: 768px) {

    .about-page .about-vision {
        padding: 24px 32px;
    }

    .about-page .about-vision-card {
        max-width: 780px;
        margin: 0 auto;
    }

    .about-page .about-vision-card h2 {
        font-size: 20px;
        line-height: 30px;
    }

    .about-page .about-vision-text {
        font-size: 32px;
        line-height: 38px;
        max-width: 652px;
    }
}


@media (min-width: 1024px) {

    .about-page .about-vision {
        padding: 48px 80px; /* outer section */
    }

    .about-page .about-vision-card {
        max-width: 1280px;
        margin: 0 auto;

        padding: 64px;
        gap: 32px;

        display: flex;
        flex-direction: column;
        align-items: center;

        background: #F9FAFB;
        border-radius: 10px;
        text-align: center;
    }

    /* TITLE */
    .about-page .about-vision-card h2 {
        font-size: 30px;
        line-height: 44px;
        margin: 0;
font-style: normal;
font-weight: 700;


color: #101828;
    }

    /* BIG TEXT */
    .about-page .about-vision-text {
        font-size: 48px;
        line-height: 58px;
        margin: 0;

        max-width: 1152px;
    }
}

/* =========================================
   ABOUT VALUES (MOBILE FIRST)
========================================= */

.about-page .about-values {
    padding: 16px;
    gap: 24px;
}

.about-page .about-values h2 {
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    margin: 0 0 24px;
}

/* STACKED */
.about-page .about-values-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

/* CARD */
.about-page .about-value {
    border-left: 4px solid #155DFC;
    padding-left: 32px;

    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* TITLE */
.about-page .about-value h4 {
    margin: 0;
    font-size: 18px;
    line-height: 28px;
    font-weight: 700;
    color: #101828;
}

/* TEXT */
.about-page .about-value p {
    margin: 0;
    font-size: 16px;
    line-height: 26px;
    color: #4A5565;
}

@media (min-width: 768px) {

    .about-page .about-values {
        padding: 48px 80px;
    }

    .about-page .about-values h2 {
        font-size: 24px;
        line-height: 36px;
        text-align: left;
    }

    .about-page .about-values-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 48px;
    }

    .about-page .about-value h4 {
        font-size: 20px;
        line-height: 30px;
    }

    .about-page .about-value p {
        font-size: 18px;
        line-height: 28px;
    }
}

@media (min-width: 1024px) {

    .about-page .about-values {
       padding: 48px 0px;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .about-values h2 {
        font-size: 30px;
        line-height: 44px;
font-style: normal;
font-weight: 700;


color: #101828;
    }

    .about-page .about-values-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 48px 48px; /* row + column spacing */
    }

    .about-page .about-value {
        max-width: 616px;
    }

    .about-page .about-value h4 {
        font-size: 22px;
        line-height: 34px;
    }

    .about-page .about-value p {
        font-size: 18px;
        line-height: 28px;
    }
}


/* =========================================
   ABOUT FOUNDER
========================================= */

.about-page .about-founder {
    padding: 16px;
}

/* TITLE */
.about-page .about-founder-title {
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    margin: 0 0 24px;
        font-style: normal;
        font-weight: 700;
        color: #101828;
}

/* CARD */
.about-page .about-founder-card {
    background: #EFF6FF;
    border-radius: 10px;
    padding: 24px;
}

/* STACK */
.about-page .about-founder-top {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

/* IMAGE */
.about-page .about-founder-image img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}

/* CONTENT */
.about-page .about-founder-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-align: center;
}

/* ROLE */
.about-page .about-founder-role {
    font-size: 16px;
    line-height: 26px;
    color: #4A5565;
}

/* NAME */
.about-page .about-founder-name {
    font-size: 36px;
    line-height: 48px;
    font-weight: 300;
    margin: 0;
}

/* DESC */
.about-page .about-founder-desc {
    font-size: 16px;
    line-height: 26px;
    color: #364153;
    margin: 0;
}

/* =========================================
   FOUNDER BOTTOM TEXT
========================================= */

.about-page .about-founder-bottom {
    display: flex;
    flex-direction: column;
    gap: 16px;

    margin-top: 24px;
    text-align: center;
}

.about-page .about-founder-bottom p {
    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #364153;
}
@media (min-width: 768px) {

    .about-page .about-founder {
        padding: 48px 80px;
    }

    .about-page .about-founder-title {
        text-align: left;
        font-size: 24px;
        line-height: 36px;
        font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .about-page .about-founder-card {
        padding: 48px;
    }

    .about-page .about-founder-top {
        flex-direction: row;
        align-items: flex-start;
    }

    .about-page .about-founder-image {
        flex-shrink: 0;
    }

    .about-page .about-founder-image img {
        width: 240px;
        height: 320px;
        object-fit: cover;
    }

    .about-page .about-founder-content {
        text-align: left;
    }

    .about-page .about-founder-name {
        font-size: 48px;
        line-height: 64px;
    }

    .about-page .about-founder-desc {
        font-size: 18px;
        line-height: 28px;
    }

   

    .about-page .about-founder-bottom {
        text-align: left;
        max-width: 780px;
    }

}

@media (min-width: 1024px) {

    .about-page .about-founder {
               padding: 48px 0px;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .about-founder-title {
        font-size: 30px;
        line-height: 44px;
        font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .about-page .about-founder-card {
        padding: 48px;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .about-founder-top {
        gap: 32px;
    }

    .about-page .about-founder-name {
        font-size: 60px;
        line-height: 78px;
    }

    .about-page .about-founder-desc {
        font-size: 18px;
        line-height: 28px;
    }

   

    .about-page .about-founder-bottom {
        max-width: 1280px;
        margin: 32px auto 0; /* center like figma */
    }

    .about-page .about-founder-bottom p {
        font-size: 16px;
        line-height: 26px;
    }

}

/* =========================================
   ABOUT JOURNEY
========================================= */

.about-page .about-journey {
    padding: 16px;
    background: #F9FAFB;
}

/* TITLE */
.about-page .about-journey h2 {
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    margin: 0 0 24px;
 color: #101828;
}

/* TIMELINE */
.about-page .about-timeline {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* ITEM */
.about-page .about-timeline-item {
    display: flex;
    gap: 25px; /* from figma */
}

/* YEAR */
.about-page .about-year {
    font-size: 24px;
    font-weight: 700;
    color: #155DFC;
    min-width: 56px;
}

/* CONTENT */
.about-page .about-timeline-item > div {
    border-left: 2px solid #E5E7EB;
    padding-left: 30px;

    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* TITLE */
.about-page .about-timeline-item h4 {
    margin: 0;
    font-size: 18px;
    line-height: 28px;
    font-weight: 700;
    color: #101828;
}

/* TEXT */
.about-page .about-timeline-item p {
    margin: 0;
    font-size: 16px;
    line-height: 26px;
    color: #4A5565;
}

@media (min-width: 768px) {

    .about-page .about-journey {
        padding: 40px 64px;
    }

    .about-page .about-journey h2 {
        text-align: left;
        font-size: 24px;
        line-height: 36px;
 color: #101828;
    }

    .about-page .about-timeline {
        gap: 32px;
    }

    .about-page .about-timeline-item {
        gap: 64px; /* figma */
    }

    .about-page .about-timeline-item h4 {
        font-size: 20px;
        line-height: 30px;
    }

    .about-page .about-timeline-item p {
        font-size: 18px;
        line-height: 28px;
    }
}

@media (min-width: 1024px) {

    .about-page .about-journey {
               padding: 48px 0px;
      
    }
.about-page .about-container {
              ;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .about-journey h2 {
       font-style: normal;
        font-weight: 700;
        font-size: 30px;
        line-height: 44px;
        color: #101828;
    }

    .about-page .about-timeline {
       
        margin: 0 auto;
        gap: 32px;
    }

    .about-page .about-timeline-item {
        gap: 64px;
    }

    .about-page .about-timeline-item > div {
        max-width: 1086px;
    }

    .about-page .about-timeline-item h4 {
        font-size: 20px;
        line-height: 30px;
    }

    .about-page .about-timeline-item p {
        font-size: 18px;
        line-height: 28px;
    }
}


/* ICON WRAPPER */
.trust-card .icon {
    width: 32px;
    height: 32px;
}

/* IMAGE CONTROL */
.trust-card .icon img,
.badge-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
/* SECTION */
.trust-section {
    padding: 16px;
}

/* CONTAINER */
.trust-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* TITLE */
.trust-section h2 {
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    margin: 0;
        font-style: normal;
        font-weight: 700;
        color: #101828;
}

/* BADGE */
.trust-badge {
    display: flex;
    gap: 12px;
    padding: 24px;

    border: 1px solid #E5E7EB;
    background: rgba(255,255,255,0.8);
    border-radius: 4px;
}

.badge-icon {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg,#E17100,#FDC700);
    border-radius: 4px;

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

.badge-content h4 {
    margin: 0;
    font-size: 16px;
}

.badge-sub {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
}

.badge-verify {
    font-size: 12px;
    color: #0B950D;
}

.dot {
    width: 6px;
    height: 6px;
    background: #0B950D;
    border-radius: 50%;
    display: inline-block;
    margin: 0 6px;
}

/* GRID */
.trust-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

/* CARD */
.trust-card {
    border: 1px solid #E5E7EB;
    padding: 32px;
    border-radius: 4px;
    background: #fff;

    display: flex;
    flex-direction: column;
    gap: 12px;
    text-align: center;
}

.trust-card .icon {
    font-size: 20px;
}

.trust-card h4 {
    font-size: 18px;
    margin: 0;
}

.trust-card p {
    font-size: 16px;
    line-height: 26px;
    color: #4A5565;
    margin: 0;
}

.trust-card span {
    color: #155DFC;
    font-weight: 600;
}

@media (min-width: 768px) {

    .trust-section {
        padding: 24px 32px;
    }

    .trust-section h2 {
        text-align: left;
        font-style: normal;
        font-weight: 700;
        color: #101828;
    }

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

    .trust-card {
        text-align: left;
    }
}

@media (min-width: 1024px) {

    .trust-section {
        padding: 48px 80px;
    }

    .trust-container {
        max-width: 1280px;
        margin: 0 auto;
        gap: 48px;
    }

    .trust-section h2 {
        font-size: 30px;
        line-height: 44px;
        font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .trust-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .trust-card {
        text-align: left;
    }

    .trust-card h4 {
        font-size: 20px;
    }
}


/* =========================================
   CULTURE SECTION
========================================= */

.about-page .about-culture {
    background: #F9FAFB;
    padding: 16px;
}

/* TITLE */
.about-page .about-culture h2 {
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    margin: 0 0 24px;
font-style: normal;
        font-weight: 700;
        color: #101828;
}

/* GRID */
.about-page .culture-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

/* CARD */
.about-page .culture-card {
    border: 1px solid #E5E7EB;
    background: #FFFFFF;
    border-radius: 4px;
    padding: 32px;

    display: flex;
    flex-direction: column;
    gap: 6px;
    text-align: center;
}

/* TITLE */
.about-page .culture-card h4 {
    margin: 0;
    font-size: 18px;
    line-height: 28px;
    font-weight: 700;
    color: #101828;
}

/* TEXT */
.about-page .culture-card p {
    margin: 0;
    font-size: 16px;
    line-height: 26px;
    color: #4A5565;
}

@media (min-width: 768px) {

    .about-page .about-culture {
        padding: 24px 32px;
    }

    .about-page .about-culture h2 {
        text-align: left;
        font-size: 24px;
        line-height: 36px;
font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .about-page .culture-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .about-page .culture-card {
        text-align: left;
    }
}


@media (min-width: 1024px) {

    .about-page .about-culture {
       padding: 48px 0px;
       
    }
 .about-page .about-container {
      
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .culture-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .about-culture h2 {
        font-size: 30px;
        line-height: 44px;
font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .about-page .culture-card h4 {
        font-size: 22px;
        line-height: 34px;
    }

    .about-page .culture-card p {
        font-size: 18px;
        line-height: 28px;
    }
}

/* =========================================
   TEAM SECTION
========================================= */

.about-page .about-team {
    padding: 16px;
}

/* TITLE */
.about-page .about-team h2 {
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    color: #155DFC;
    margin-bottom: 16px;
font-style: normal;
        font-weight: 700;
        color: #101828;
}

/* GRID */
.about-page .team-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

/* CARD */
.about-page .team-card {
    background: #F9FAFB;
    border-radius: 10px;
    padding: 32px;

    display: flex;
    flex-direction: column;
    align-items: center;
    
}

/* AVATAR */
.about-page .team-avatar {
    width: 92px;
    height: 92px;
    background: #C0C9DD;
    border-radius: 50%;

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

    font-size: 24px;
    font-weight: 700;
    color: #FFFFFF;
}

/* NAME */
.about-page .team-card h4 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #155DFC;
    text-align: center;
}

/* ROLE */
.about-page .team-card p {
    margin: 0;
    font-size: 14px;
    color: #4A5565;
    text-align: center;
    line-height: 24px;
}

@media (min-width: 768px) {

    .about-page .about-team {
        padding: 24px 32px;
    }

    .about-page .about-team h2 {
        text-align: left;
font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .about-page .team-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .about-page .team-card h4 {
        font-size: 16px;
    }
}

@media (min-width: 1024px) {

    .about-page .about-team {
               padding: 48px 0px;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .team-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
        max-width: 1280px;
        margin: 0 auto;
    }

    .about-page .about-team h2 {
        font-size: 30px;
        line-height: 44px;
font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .about-page .team-card h4 {
        font-size: 18px;
    }
}


.about-page .about-partners {
    background: #F9FAFB;
    padding: 16px;
}

/* HEADER */
.partners-header {
    text-align: center;
    margin-bottom: 48px;
}
    .partner-content h3 {
       
        margin-bottom: 16px;
    }
.partners-header h2 {
       
        margin-bottom: 16px;
font-style: normal;
        font-weight: 700;
        color: #101828;
    }
.partners-header h2 {
    font-size: 20px;
    color: #155DFC;
font-style: normal;
        font-weight: 700;
        color: #101828;
}

.partners-header p {
    font-size: 16px;
    color: #4A5565;
}

/* PARTNER BOX */
.partner-box {
    display: flex;
    flex-direction: column;
    gap: 16px;

    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 6px;

    padding: 24px;
    margin-bottom: 16px;
}

/* CONTENT */
.partner-content {
    text-align: center;
}

.partner-content h3 {
    font-size: 32px;
    font-weight: 300;
    color: #155DFC;
}

.partner-content p {
    font-size: 16px;
    line-height: 26px;
    color: #4A5565;
}

/* LOGO */
.partner-logo {
    display: flex;
    justify-content: center;
    align-items: center;
}

.partner-logo img {
    min-width: 255px;
    height: auto;
}

/* DARK BG (TradingView) */
.tv-bg {
    background: #121723;
    padding: 16px;
    border-radius: 4px;
}

/* FEATURES */
.partners-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}

/* CARD */
.partners-card {
    background: #fff;
    border: 1px solid #E5E7EB;
    padding: 24px;
    border-radius: 6px;
    text-align: center;
}

.partners-card h4 {
    font-size: 18px;
    color: #155DFC;
    margin-top: 10px;
font-weight: 600;
}

.partners-card p {
    font-size: 16px;
    color: #4A5565;
}

@media (min-width: 768px) {

    .about-page .about-partners {
        padding: 40px 64px;
    }

    .partner-box {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .partner-content {
        text-align: left;
        max-width: 60%;
    }

    .partners-features {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .partners-card {
        text-align: left;
    }
}

@media (min-width: 1024px) {

    .about-page .about-partners {
        padding: 80px 0px;
    }
    .about-page .about-container {
        max-width: 1280px;
margin: 0 auto;
    }

    .partners-header h2 {
        font-size: 30px;
line-height: 44px;
font-style: normal;
        font-weight: 700;
        color: #101828;
    }

    .partners-header p {
        font-size: 18px;
    }

    .partner-box {
        padding: 48px;
        gap: 32px;
    }
.partner-content {
        text-align: left;
        max-width: 959px;
    }

    .partner-content h3 {
        font-size: 48px;
    }

    .partner-content p {
        font-size: 18px;
        max-width: 900px;
    }

    .partners-features {
        max-width: 1280px;
        margin: 0 auto;
    }
}


/* =========================================
   FAQ SECTION
========================================= */

/* =========================================
   FAQ SECTION
========================================= */

.about-page .faq-section {
    padding: 64px 80px;
    background: #FFFFFF;
}

.about-page .faq-container {
    max-width: 1280px;
    margin: 0 auto;
}

/* TITLE */
.about-page .faq-title {
    font-family: 'Roboto', sans-serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 44px;
    color: #101828;
    margin-bottom: 24px;
}

/* LIST */
.about-page .faq-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* =========================================
   FAQ ITEM
========================================= */

.about-page .faq-item {
    display: block; /* 🔥 important fix */
    padding: 12px 24px;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    transition: border 0.2s ease;
}

.about-page .faq-item:hover {
    border-color: #D0D5DD;
}

/* =========================================
   QUESTION
========================================= */

/* remove default arrow */
.about-page .faq-question {
    list-style: none;
}

.about-page .faq-question::-webkit-details-marker {
    display: none;
}

/* layout */
.about-page .faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
}

/* text */
.about-page .faq-question h4 {
    margin: 0;
    flex: 1;

    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 30px;

    color: #101828;
}

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

.about-page .faq-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.about-page .faq-icon::before {
    content: "";
    width: 8px;
    height: 8px;

    border-right: 2px solid #8C8E95;
    border-bottom: 2px solid #8C8E95;

    transform: rotate(45deg);
    transition: transform 0.25s ease;
}

/* rotate when open */
.about-page .faq-item[open] .faq-icon::before {
    transform: rotate(-135deg);
}

/* =========================================
   ANSWER (FIXED VISIBILITY)
========================================= */

.about-page .faq-answer {
    display: none;
    margin-top: 12px;
}

/* show when open */
.about-page .faq-item[open] .faq-answer {
    display: block;
}

/* text */
.about-page .faq-answer p {
    margin: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    line-height: 28px;
    color: #4A5565;
}

/* list */
.about-page .faq-answer ul {
    margin: 0;
    padding-left: 18px;
}

.about-page .faq-answer li {
    margin-bottom: 8px;
    font-size: 18px;
    line-height: 28px;
    color: #4A5565;
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 1024px) {

    .about-page .faq-section {
        padding: 64px;
    }

    .about-page .faq-title {
        font-size: 24px;
        line-height: 36px;
    }

    .about-page .faq-question h4 {
        font-size: 18px;
        line-height: 28px;
    }
}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

    .about-page .faq-section {
        padding: 64px 16px;
    }

    .about-page .faq-title {
        font-size: 22px;
        line-height: 30px;
    }

    .about-page .faq-item {
        padding: 12px 16px;
    }

    .about-page .faq-question h4 {
        font-size: 16px;
        line-height: 26px;
    }

    .about-page .faq-answer p,
    .about-page .faq-answer li {
        font-size: 16px;
        line-height: 26px;
    }
}



/* =========================================
   PLAN PAGE BASE
========================================= */

.plan-page {
    background: #FFFFFF;
}

.plan-container {
    max-width: 1280px;
    margin: 0 auto;
    width: 100%;
}

/* =========================================
   HERO SECTION
========================================= */

.plan-page .plan-hero-search {
    padding: 80px 80px 40px;
}

.plan-page .plan-hero-box {
    background: linear-gradient(135deg, #5C5C5C 0%, #101828 50%, #131725 100%);
    border-radius: 4px;

    padding: 80px 120px;

    display: flex;
    justify-content: center;
}

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

.plan-page .plan-hero-content {
    max-width: 860px;
    width: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;

    text-align: center;
}

.plan-page .plan-hero-content h1 {
    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 48px;
    line-height: 64px;

    color: #FFFFFF;
}

.plan-page .plan-hero-content p {
    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 34px;

    color: #DBEAFE;
}

/* =========================================
   SEARCH BAR
========================================= */

.plan-page .plan-search-bar {
    width: 100%;
}

/* FORM */

.plan-page .plan-search-form {
    position: relative;

    display: flex;
    align-items: center;
    gap: 12px;

    width: 100%;
}

/* INPUT */

.plan-page .plan-search-form input {
    flex: 1;

    height: 62px;
    padding: 0 16px 0 44px;

    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    line-height: 28px;

    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 4px;

    outline: none;
}

/* PLACEHOLDER */

.plan-page .plan-search-form input::placeholder {
    color: rgba(0, 20, 72, 0.3);
}

/* LEFT ICON */

.plan-page .plan-search-icon {
    position: absolute;
    left: 16px;

    width: 16px;
    height: 16px;
}

/* BUTTON */

.plan-page .plan-search-form button {
    width: 62px;
    height: 62px;

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

    background: #155DFC;
    border: none;
    border-radius: 4px;

    cursor: pointer;
    transition: background 0.2s ease;
}

.plan-page .plan-search-form button:hover {
    background: #0F4BD8;
}

/* BUTTON ICON */

.plan-page .plan-search-form button img {
    width: 24px;
    height: 24px;
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 1024px) {

    .plan-page .plan-hero-search {
        padding: 32px 48px;
    }

    .plan-page .plan-hero-box {
        padding: 80px 60px;
    }

    .plan-page .plan-hero-content h1 {
        font-size: 40px;
        line-height: 52px;
    }

    .plan-page .plan-hero-content p {
        font-size: 20px;
        line-height: 30px;
    }

}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

    .plan-page .plan-hero-search {
        padding: 16px;
    }

    .plan-page .plan-hero-box {
        padding: 40px 20px;
    }

    .plan-page .plan-hero-content h1 {
        font-size: 32px;
        line-height: 44px;
    }

    .plan-page .plan-hero-content p {
        font-size: 18px;
        line-height: 28px;
    }

    .plan-page .plan-search-form {
        gap: 8px;
    }

    .plan-page .plan-search-form input {
        height: 60px;
        font-size: 16px;
    }

    .plan-page .plan-search-form button {
        width: 60px;
        height: 60px;
    }

}

/* =========================================
   PRICING SECTION
========================================= */

.pricing-section {
    padding: 60px 20px;
    background: #fff;
}

.plan-container {
    max-width: 1280px;
    margin: 0 auto;
}

/* HEADER */
.pricing-header {
    text-align: center;
    margin-bottom: 48px;
}

.pricing-header h2 {
    font-size: 48px;
    font-weight: 700;
    color: #131725;
    margin-bottom: 12px;
}

.pricing-header p {
   
    margin: 0 auto 24px;
    font-size: 18px;
    color: #41444F;
}

/* TOGGLE */
.pricing-toggle {
    display: inline-flex;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    overflow: hidden;
}

.pricing-toggle button {
    padding: 12px 24px;
    border: none;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
min-width: 183px;
}

.pricing-toggle button.active {
    background: #155DFC;
    color: #fff;
}

/* CARDS */
.pricing-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

/* CARD */
.pricing-card {
    border: 1px solid #E5E7EB;
    border-radius: 6px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
    background: #fff;
}

/* POPULAR */
.pricing-card.popular {
    border: 2px solid #155DFC;
    transform: translateY(-8px);
}

.most-popular {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: #155DFC;
    color: #fff;
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 4px;
}

/* TAGS */
.plan-tag {
    padding: 6px 12px;
    font-size: 13px;
    border-radius: 4px;
    display: inline-block;
    width: fit-content;
    color: #fff;
}

.plan-tag.blue { background: #155DFC; }
.plan-tag.purple { background: #9333EA; }
.plan-tag.indigo { background: #4F46E5; }
.plan-tag.yellow { background: #F59E0B; color:#000; }

/* PRICE */
.price {
    font-size: 40px;
    font-weight: 700;
}

.price span {
    font-size: 16px;
    color: #6A7282;
}

/* BUTTON */
.btn {
    display: block;
    text-align: center;
    background: #155DFC;
    color: #fff;
    padding: 12px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 600;
}

/* LIST */
.pricing-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pricing-card li {
    margin-bottom: 10px;
    padding-left: 22px;
    position: relative;
}

.pricing-card li::before {
    content: "✔";
    position: absolute;
    left: 0;
    color: #22C55E;
}

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

@media (max-width: 600px) {
    .pricing-header h2 {
        font-size: 32px;
    }

    .pricing-cards {
        grid-template-columns: 1fr;
    }
}

.plan-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.plan-features li {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-left: 36px;
    position: relative;
    margin-bottom: 12px;
}

.plan-features li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0px;
    width: 24px;
    height: 24px;
    background-image: url('/wp-content/uploads/2026/icons/check-icon.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.why-cta-btn {
    display: flex;
    align-items: center;
    gap: 8px;
}

.why-cta-btn img {
    width: 24px;
    height: 24px;
    display: block;
}

.plan-features strong {
    font-size: 16px;
    font-weight: 600;
    color: #131725;
}

.plan-features span {
    font-size: 14px;
    color: #6A7282;
}




/* SECTION */
/* WRAPPER */
body { font-family: Roboto, sans-serif; }

.comparison { padding: 40px 80px; }
.header { text-align: center; margin-bottom: 64px; }

.table-wrapper { position: relative; }

/* HIDE SCROLLBAR */
.table-scroll::-webkit-scrollbar { display: none; }
.table-scroll { scrollbar-width: none; -ms-overflow-style: none; }

.comparison-table {
  table-layout: fixed;
  border-collapse: collapse;
   width: 100%;

}

/* WIDTHS */
.feature { width: 196px; min-width: 196px; text-align: left; }
th:not(.feature), td:not(.feature) { width: 140px; min-width: 140px; }

/* CELLS */
td, th {
  height: 56px;
  padding: 16px;
  border-bottom: 1px solid #E5E7EB;
  text-align: center;
}

/* FIX FIRST COLUMN */
.feature {
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 5;
}

/* SECTION */
.section td {
  background: #E9EFFE;
  font-weight: 600;
}
.section .feature {
  background: #E9EFFE;
}

/* HIGHLIGHT */
.highlight { background: #F0F7FF; }

/* ICONS */
.comparison tbody td.check::before {
    content: "";
    display: block;

    width: 16px;
    height: 16px;

    margin: 0 auto;

   background-image: url('https://www.strike.money/wp-content/uploads/2026/icons/check-comparision-icon.svg');
    background-repeat: no-repeat;
    background-position: center;
    
}
.comparison tbody td.cross::before {
    content: "";
    display: block;

    width: 16px;
    height: 16px;

    margin: 0 auto;

    background-image: url('https://www.strike.money/wp-content/uploads/2026/icons/cross-comparision-icon.svg');
    background-repeat: no-repeat;
    background-position: center;
   
}

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

  .comparison { padding: 16px; }

  .table-scroll {
    overflow-x: auto;
    scroll-behavior: smooth;
  }

  .scroll-btn {
    display: flex;
  }
}

/* DESKTOP */
@media (min-width: 769px) {
  .table-scroll { overflow: visible; }
  .scroll-btn { display: none; }

    .capability-card {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 32px;
        gap: 6px;
        width: 100%;
        max-width: 410px;
        height: 242px;
        background: #FFFFFF;
        border: 1px solid #E5E7EB;
        border-radius: 4px;
        flex: 1;
        min-width: 370px;
    }
.capability-card p {
   
    text-align: left;
   
}
}

/* ARROWS */
.scroll-btn {
  position: absolute;
  top: 80px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #155DFC;
  color: #fff;
  border: none;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.scroll-left { left: 210px; display: none; }
.scroll-right { right: 10px; }



@media (max-width: 768px) {

  .comparison-table {
    width: max-content;   /* ✅ ENABLE SCROLL */
  }

}


/* CTA WRAPPER */
.comparison-cta {
  display: flex;
  justify-content: center;
  margin-top: 40px; /* space from table */
}

/* BUTTON */
.comparison-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 12px 24px;
  min-height: 44px;

  background: #155DFC;
  color: #FFFFFF;

  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;

  border-radius: 6px;
  text-decoration: none;

  transition: all 0.2s ease;
}

/* HOVER */
.comparison-btn:hover {
  background: #0F4AE0;
}

/* MOBILE */
@media (max-width: 768px) {
  .comparison-cta {
    margin-top: 32px;
  }

  .comparison-btn {
    width: 100%;
    max-width: 320px;
  }
}


/* SECTION BACKGROUND */
.why-scanners-v2 {
  background: #F1F5F9; /* light blue */
  padding: 64px 0;
}

/* CONTAINER CENTERING */
.why-scanners-v2 .why-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}

/* TITLE */
.why-scanners-v2 .why-title {
  text-align: center;
  margin-bottom: 0px;
}

/* GRID SPACING FIX */
.why-scanners-v2 .why-grid {
  gap: 24px;
}

/* CARD IMPROVEMENT */
.why-scanners-v2 .why-card {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  padding: 20px;
}

/* CTA WRAPPER */
.why-scanners-v2 .why-cta {
  display: flex;
  justify-content: center;
  margin-top: 0px;
}

/* CTA BUTTON */
.why-scanners-v2 .why-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  background: #22C55E;
  color: #FFFFFF;

  padding: 12px 20px;
  border-radius: 6px;
  border: none;

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

  transition: all 0.2s ease;
}


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

  .why-scanners-v2 {
    padding: 48px 0;
  }

  .why-scanners-v2 .why-cta-btn {
    width: 100%;
    max-width: 300px;
    justify-content: center;
  }

}

/* SECTION */
.plan-page-insights {
  padding: 64px 80px;
  background: #FFFFFF;
}

/* CONTAINER */
.plan-page-insights .plan-insights-container {
  max-width: 1280px;
  margin: 0 auto;

  display: flex;
  flex-direction: column;
  gap: 64px;
}

/* HEADER */
.plan-page-insights .plan-insights-header {
  text-align: center;
}

.plan-page-insights h2 {
font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 52px;
  color: #131725;
}

.plan-page-insights p {
 font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 28px;
  color: #41444F;
}

/* IMAGE */
.plan-page-insights .plan-insights-image {
  border-radius: 12px;
  overflow: hidden;

  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.plan-page-insights .plan-insights-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* RATING */
.plan-page-insights .plan-insights-rating {
  text-align: center;
}

.plan-page-insights .rating-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.plan-page-insights .stars {
  color: #FFB800;
  font-size: 20px;
}

.plan-page-insights .rating-text {
  font-size: 18px;
  color: #131725;
}

.plan-page-insights .trusted-text {
  font-size: 14px;
  color: #8C8E95;
  margin-top: 8px;
}

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

  .plan-page-insights {
    padding: 16px;
  }

  .plan-page-insights .plan-insights-container {
    gap: 32px;
  }

  .plan-page-insights h2 {
    font-size: 24px;
    line-height: 34px;
  }

  .plan-page-insights p {
    font-size: 16px;
    line-height: 26px;
  }

  .plan-page-insights .stars {
    font-size: 18px;
  }

  .plan-page-insights .rating-text {
    font-size: 16px;
  }

}


/* SECTION */
.plan-page-cta {
  padding: 64px 80px;
  background: #FFFFFF;
}

/* CONTAINER */
.plan-page-cta .plan-cta-container {
  max-width: 1280px;
  margin: 0 auto;

  display: flex;
  flex-direction: column;
  align-items: center;

  padding: 64px;
  gap: 16px;

  background: linear-gradient(180deg, #2B64F9 0%, #1E4FD8 100%);
  border-radius: 16px;
}

/* TITLE */
.plan-page-cta h2 {
 font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 36px;
  line-height: 52px;
  text-align: center;
  color: #FFFFFF;
}

/* DESCRIPTION */
.plan-page-cta .plan-cta-desc {
  font-size: 18px;
  line-height: 28px;
  color: #DBEAFE;
  text-align: center;
  max-width: 720px;
}

/* BUTTON */
.plan-page-cta .plan-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 12px 18px;
  height: 48px;
  min-width: 244px;

  background: #FFFFFF;
  border: 1px solid #155DFC;
  border-radius: 4px;

  font-size: 16px;
  font-weight: 700;
  color: #155DFC;

  text-decoration: none;
  transition: all 0.2s ease;
}

/* HOVER */
.plan-page-cta .plan-cta-btn:hover {
  background: #F8FAFF;
}

/* FOOT TEXT */
.plan-page-cta .plan-cta-foot {
  font-size: 14px;
  line-height: 24px;
  color: #DBEAFE;
  text-align: center;
}

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

  .plan-page-cta {
    padding: 16px;
  }

  .plan-page-cta .plan-cta-container {
    padding: 48px 16px;
    gap: 21px;
  }

  .plan-page-cta h2 {
    font-size: 24px;
    line-height: 34px;
  }

  .plan-page-cta .plan-cta-desc {
    font-size: 16px;
    line-height: 26px;
  }

  .plan-page-cta .plan-cta-btn {
    width: 100%;
    max-width: 218px;
    font-size: 14px;
  }

}


/* SECTION */
.plan-page-legal {
  padding: 48px 80px;
  background: #FFFFFF;
}

/* CONTAINER */
.plan-page-legal .legal-container {
  max-width: 1280px;
  margin: 0 auto;

  display: flex;
  flex-direction: column;
  gap: 16px; /* 🔥 MAIN spacing from Figma */
}

/* LAST UPDATED TEXT */
.plan-page-legal .legal-updated {
  font-size: 14px;
  color: #6B7280;
}

/* EACH BLOCK */
.plan-page-legal .legal-block {
  display: flex;
  flex-direction: column;
  gap: 12px; /* 🔥 heading → content spacing */
}

/* HEADINGS */
.plan-page-legal h2 {
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  font-size: 38px;
  line-height: 64px;
  color: #4A5565;
  margin: 0;
}

/* PARAGRAPHS */
.plan-page-legal p {
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 28px;
  color: #4A5565;
  margin: 0;
}

/* LIST (REFUND SECTION ETC.) */
.plan-page-legal ol {
  padding-left: 20px;
  margin: 0;

  display: flex;
  flex-direction: column;
  gap: 8px;
}

.plan-page-legal li {font-size: 18px;
    line-height: 30px;
    color: #4a5565;
    margin-bottom: 5px;
    letter-spacing: unset;
}

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

  .plan-page-legal {
    padding: 16px;
  }

  .plan-page-legal .legal-container {
    gap: 32px;
  }

  .plan-page-legal h2 {
    font-size: 24px;
    line-height: 34px;
  }

  .plan-page-legal p,
  .plan-page-legal li {
    font-size: 16px;
    line-height: 26px;
  }

}













.recently-published-section {
  padding: 40px 0;
}

.recently-published-section .rp-container {
  max-width: 1206px;
  margin: auto;
  padding: 0 20px;
}

/* HEADER */
.recently-published-section .rp-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}

.recently-published-section .rp-title {
  display: flex;
  gap: 12px;
  align-items: center;
}

.recently-published-section h2 {
  font-size: 32px;
  font-weight: 700;
}

/* ARROWS */
.recently-published-section .rp-arrows button {
  width: 40px;
  height: 40px;
  border: 1px solid #E5E7EB;
  background: #fff;
  cursor: pointer;
}

/* SLIDER */
.recently-published-section .rp-slider {
  overflow: hidden;
}

.recently-published-section .rp-track {
  display: flex;
  transition: transform 0.45s ease;
  will-change: transform;
}

.recently-published-section .rp-slide {
  min-width: 100%;
}

/* GRID */
.recently-published-section .rp-grid {
  display: flex;
  gap: 24px;
}

/* MAIN CARD */
.recently-published-section .rp-main-card {
  flex: 2;
  border: 1px solid #E5E7EB;
  border-radius: 6px;
  overflow: hidden;
    min-height: 682px;
}
.rp-image {
  display: block; /* 🔥 THIS FIXES YOUR ISSUE */
  width: 100%;
  height: 220px;

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

  border-radius: 0px;
  position: relative;
}

.recently-published-section .rp-thumb {
    display: block; /* 🔥 THIS IS THE FIX */
    width: 100%;
    height: 200px;

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

    position: relative;
}

.recently-published-section .rp-image {
  height: 380px;
  background-size: cover;
  background-position: center;
  position: relative;
}

/* TAG */
.recently-published-section .rp-tag {
  position: absolute;
  top: 20px;
  left: 20px;
  padding: 6px 12px;
  font-size: 14px;
  border-radius: 4px;
}

.recently-published-section .rp-tag.blue {
  background: #155DFC;
  color: #fff;
}

.recently-published-section .rp-tag.light {
  background: #fff;
}

/* CONTENT */
.recently-published-section .rp-content {
  padding: 24px;
}

.recently-published-section .rp-content h3 {
  font-size: 24px;
}

.recently-published-section .rp-meta {
  font-size: 14px;
  color: #6A7282;
  display: flex;
  gap: 8px;
}

/* SIDE */
.recently-published-section .rp-side {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.recently-published-section .rp-card {
  border: 1px solid #E5E7EB;
  border-radius: 6px;
  overflow: hidden;
}

.recently-published-section .rp-thumb {
  height: 200px;
  background-size: cover;
  background-position: center;
  position: relative;
}

/* DOT CONTAINER */
.rp-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
    margin-top: 24px;
}

/* DEFAULT DOT */
.rp-dot {
  width: 8px;
  height: 8px;
  background: #D1D5DC;
  border-radius: 999px;
  transition: all 0.3s ease;
}

/* ACTIVE DOT (PILL) */
.rp-dot.active {
  width: 32px;
  height: 8px;
  background: #155DFC;
}
/* TABLET */
@media (max-width:1024px){
  .recently-published-section .rp-grid { flex-direction: column; }
  .recently-published-section .rp-side { flex-direction: row; }
}

/* MOBILE */
@media (max-width:600px){
  .recently-published-section h2 { font-size: 24px; }
  .recently-published-section .rp-content { text-align: center; }
  .recently-published-section .rp-side { flex-direction: column; }
}





















.rp-main-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;

  display: flex;
  flex-direction: column;
  height: 100%;
}

/* IMAGE */
.rp-main-card .rp-image {
  position: relative;
  width: 100%;
  height: 381px;
  overflow: hidden;
}

.rp-main-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
    object-position: top;
}

/* BADGE */
.rp-main-card .rp-tag {
  position: absolute;
  top: 16px;
  left: 16px;

  background: #2563eb;
  color: #fff;
  padding: 6px 12px;
  font-size: 14px;
  border-radius: 6px;
}

/* CONTENT AREA */
.rp-main-card .rp-content {
  display: flex;
  flex-direction: column;
  flex: 1; /* 🔥 KEY */

  padding: 20px; /* 🔥 visible padding */
}

/* TITLE */
.rp-main-card h3 {
  font-size: 24px;
  line-height: 32px;
  margin: 0 0 10px;
  font-weight: 700;
  color: #1f2937;
}

/* DESCRIPTION (GROWS) */
.rp-main-card p {
  font-size: 18px;
  line-height: 26px;
  color: #4b5563;
  margin: 0 0 16px;

  flex-grow: 1; /* 🔥 THIS PUSHES META DOWN */
}

/* META AT BOTTOM */
.rp-main-card .rp-meta {
  font-size: 14px;
  color: #6b7280;

  display: flex;
  gap: 8px;

  margin-top: auto; /* 🔥 STICKS TO BOTTOM */
}


/* CARD */
.rp-card {
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 6px;
  overflow: hidden;
    min-height: 329px;

  box-shadow: 0px 4px 6px rgba(0,0,0,0.08);
}

/* IMAGE */
.rp-card .rp-thumb {
  position: relative;
  display: block;
  width: 100%;
  height: 200px;
  overflow: hidden;
}

.rp-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
    object-position: top;
}

/* TAG */
.rp-card .rp-tag.light {
  position: absolute;
  top: 12px;
  left: 12px;

  background: #fff;
  color: #101828;

  padding: 6px 12px;
  border-radius: 4px;

  font-size: 14px;
  line-height: 24px;
}

/* CONTENT */
.rp-card-content {
  padding: 16px;
}

/* TITLE */
.rp-card h4 {
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
  color: #101828;

  margin: 0 0 8px;

  /* 2 line clamp (VERY IMPORTANT) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* META */
.rp-card .rp-meta {
  font-size: 14px;
  color: #6A7282;

  display: flex;
  gap: 8px;
}
.all-articles {
  background: #F6F9FB;
  padding: 40px 20px;
}

.aa-container {
  max-width: 1280px;
  margin: auto;
}

/* HEADER */
.aa-header h2 {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 16px;
}

.aa-filters {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.aa-filter {
  padding: 6px 12px;
  border: 1px solid #E5E7EB;
  background: #fff;
  border-radius: 6px;
  cursor: pointer;
}

.aa-filter.active {
  background: #155DFC;
  color: #fff;
}

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

/* Mobile portrait */
@media (max-width: 600px) and (orientation: portrait) {
  .aa-grid {
    grid-template-columns: 1fr;
  }
}

/* Mobile landscape */
@media (max-width: 900px) and (orientation: landscape) {
  .aa-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* CARD */
.aa-card {
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 6px;
  overflow: hidden;

  display: flex;
  flex-direction: column;
  height: 100%;

  box-shadow: 
    0px 4px 6px -4px rgba(0,0,0,0.1),
    0px 10px 15px -3px rgba(0,0,0,0.1);
}

/* IMAGE (CLS FIX) */
.aa-thumb {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
}

.aa-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
object-position: top;
}

/* TAG */
.aa-tag {
  position: absolute;
  top: 12px;
  left: 12px;
color:black;
  background: #fff;
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 14px;
}

/* CONTENT */
/* CONTENT CONTAINER */
.aa-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;

  padding: 16px;
  gap: 16px;

  flex: 1; /* equal height cards */
}

/* INNER STACK */
.aa-content > * {
  width: 100%;
}

/* META ROW */
.aa-meta {
  display: flex;
  align-items: center;
  gap: 8px;

  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  line-height: 24px;
  color: #6A7282;
}

/* TITLE */
.aa-content h3 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
  color: #101828;

  margin: 0;

  /* 2 line clamp (important) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* DESCRIPTION */
.aa-content p {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #4A5565;

  margin: 0;

  flex-grow: 1; /* pushes link to bottom */

  /* optional clamp for clean UI */
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* READ LINK */
.aa-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;

  color: #155DFC;
  text-decoration: none;

  margin-top: auto; /* stick to bottom */
}
/* CTA */
.aa-link {
  margin-top: auto;
  color: #155DFC;
  font-weight: 600;
}

/* LOAD BUTTON */
.aa-load {
  text-align: center;
  margin-top: 24px;
}

#load-more {
  background: #155DFC;
  color: #fff;
  padding: 12px 20px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
}


/* FILTER SECTION (WHITE) */
/* FILTER SECTION (WHITE) */
.aa-filter-section {
  background: #ffffff;
  border-bottom: 1px solid #E5E7EB;
}

/* FILTER INNER */
.aa-filters {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: 16px 0;
}

/* ARTICLES SECTION (GREY) */
.all-articles {
  background: #F6F9FB;
  padding: 40px 0;
}

/* SHARED CONTAINER */
.aa-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
}










/* SECTION */
.tnc-nav {
  background: #F9FAFB;
  border-top: 1px solid #E5E7EB;
  border-bottom: 1px solid #E5E7EB;
  padding: 48px 80px;
}

/* CONTAINER */
.tnc-nav-container {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* HEADER */
.tnc-nav-header {
  display: flex;
  justify-content: space-between;
  align-items: center;

  font-weight: 600;
  font-size: 18px;
  color: #6A7282;
}

/* TOGGLE BUTTON */
.tnc-toggle {
  display: none;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #45556C;
  background: none;
  border: none;
  cursor: pointer;
}

/* LINKS */
.tnc-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.tnc-links a {
  font-size: 18px;
  font-weight: 600;
  color: #155DFC;
  text-decoration: none;
}

.tnc-links span {
  color: #D1D5DC;
}


@media (max-width: 1024px) {

  .tnc-nav {
    padding: 40px 16px 0;
  }

  .tnc-nav-container {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    padding: 16px;
  }

  .tnc-toggle {
    display: flex;
  }

  .tnc-links {
    display: none;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
  }

  .tnc-links.active {
    display: flex;
  }

  .tnc-links span {
    display: none;
  }

}










/* Responsive */

.nxg-image {
  grid-column: 2;
  padding: 0; /* 🔥 important */
}
.nxg-image {
  grid-column: 2;
  grid-row: 1 / span 4;
 
  justify-content: center;
padding: 6px 0px 6px 6px;
    background: linear-gradient(180deg, #1E2939 0%, #101828 100%);
    box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
    border-radius: 12px 0px 0px 12px;
}

.nxg-hero-img {
  width: 100%;
  height: 658px;
  object-fit: cover;
object-position:left;
border-radius: 10px 0px 0px 10px;
 transform: translateZ(0);
    backface-visibility: hidden;

}

.secondarymobile {
display:none;
}
/* Base (Desktop First - matches your current) */
.blog-container {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px;

  max-width: 1440px;
  margin: 0 auto;

  padding: 44px 48px;
  background: #F8FAFC;

  /* Stability */
  box-sizing: border-box;
  width: 100%;
}

.blog-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;

  width: 100%;
  max-width: 888px;

  box-sizing: border-box;
  border-radius: 0;

  /* Prevent flex overflow issues */
  min-width: 0;
  flex-grow: 1;
 flex: 1;
}

/* Base (Desktop: 3 columns) */
.ob-section {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;

  max-width: 1440px;
  margin: 40px auto;
  padding: 0 48px;

  box-sizing: border-box;
}

.footer-main {
 display: grid;
        max-width: 1440px;
       padding: 24px 48px 0px 48px;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
      grid-template-areas:
      "about company product learn legal"
      ". connect . . .";
       ;
    }


.frp-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;

  width: 100%;
  max-width: 1344px; /* desktop */
  margin: 0 auto;

}
.frp-posts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 24px;
}

.frp-card {
    display: flex;
    flex-direction: column;
    width: 100%;

    /* Remove hard constraints */
    /* min-width: 284px; ❌ REMOVE */
    /* max-width: 432px; ❌ REMOVE */

    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    overflow: hidden;

    /* Maintain Figma proportion */
    
}


.frp-title {
    font-family: 'Roboto', sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 34px;
    color: #101828;

    /* Important */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Tablet Landscape (1025px - 1366px) */
@media (max-width: 1366px) {
  .blog-container {
    padding: 44px 48px; /* matches figma */
    max-width: 100%;
  }

 .blog-main {
    max-width: 862px;
    gap: 24px;
  }

.blog-sidebar {
    max-width: 432px;
        display: flex;
        flex-direction: column;
  }

 .ob-section {
    grid-template-columns: repeat(3, 1fr);
    padding: 0 48px;
  }

  .footer-main {
    max-width: 1366px; /* matches figma */
    width: 100%;

    padding: 24px 48px;

    display: grid;
    grid-template-columns: repeat(5, 1fr);

    grid-template-areas:
      "about company product learn legal"
      ". connect . . .";

    gap: 52px;

    box-sizing: border-box;
  }
 .frp-container {
    max-width: 1270px;
  }
}

/* Tablet Portrait (768px - 1024px) */
@media (max-width: 1024px) {
.nxg-image {
  grid-column: 2;
  grid-row: 1 / span 4;
 
  justify-content: center;
padding: 6px 6px 6px 6px;
    background: linear-gradient(180deg, #1E2939 0%, #101828 100%);
    box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
    border-radius: 12px 12px 12px 12px;
}
  .blog-container {
    padding: 44px 48px; /* same as figma */
    gap: 24px;
    flex-direction: column;

  }

  .blog-main {
    max-width: 976px; /* matches figma */
    gap: 32px;
  }


     .blog-sidebar {
        position: relative;
        display: flex;
        max-width: 100%;
        width: 100%;
        padding: 24px 0 0;
        top: unset;
        order: 2;
        flex-direction: row;
        flex-wrap: wrap;
gap: 24px;
   
  }
 .ob-section {
    grid-template-columns: 1fr;
    padding: 0; /* 🔥 remove side padding */
    max-width: 100%; /* ensure full stretch */
  }

.footer-main {
    max-width: 100%;
    width: 100%;

    /* ✅ Apply Figma spacing */
    padding: 24px 32px;

    display: grid;
    grid-template-columns: repeat(5, 1fr);

    grid-template-areas:
      "about company product learn legal"
      ". connect . . .";

    gap: 52px;

    box-sizing: border-box;
  }
 .frp-container {
    max-width: 928px;
  }


.secondarymobile {
display:block;
}


.secondarydesktop {
display:none;
}


.secondarymobile{
    width: 100%;
   
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    margin-bottom: 0px;
    padding: 24px;
    box-sizing: border-box;
}

.strike-tools {
  
     margin-bottom: 0px!important;

}
}

/* Mobile Landscape (481px - 844px approx) */
@media (max-width: 844px) {
  .blog-container {
    padding: 32px;
    gap: 24px;

    /* IMPORTANT: prevents overflow + CLS */
    flex-wrap: wrap;
  }

 .blog-main {
    max-width: 780px;
    gap: 24px;
  }

 .blog-sidebar {
    padding: 0;
    width: 100%;
  }

 .ob-section {
    grid-template-columns: 1fr;
    padding: 0;
  }


  /* =========================
       GRID
    ========================= */
    .frp-posts {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
        margin-top: 24px;
    }

    /* =========================
       CARD
    ========================= */
    .frp-card {
        display: flex;
        flex-direction: column;
        width: 100%;
        min-width: 0;

        background: #FFFFFF;
        border: 1px solid #E5E7EB;
        border-radius: 4px;
        overflow: hidden;
    }

    /* =========================
       IMAGE
    ========================= */
    .frp-img img {
        width: 100%;
        height: auto;
        display: block;
    }

    /* =========================
       CONTENT
    ========================= */
    .frp-content {
        display: flex;
        flex-direction: column;
        padding: 24px;
        gap: 12px;
    }

    /* =========================
       META
    ========================= */
    .frp-meta {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px;
    }

    .frp-tag {
        font-family: 'Roboto', sans-serif;
        font-size: 14px;
        font-weight: 700;
        line-height: 20px;
        color: #101828;
        background: #F3F4F6;
        padding: 3px 8px;
        border-radius: 2px;
    }

    .frp-read {
        display: flex;
        align-items: center;
        gap: 4px;

        font-family: 'Roboto', sans-serif;
        font-size: 14px;
        line-height: 20px;
        color: #6A7282;
    }

    /* =========================
       TITLE (EXACT FIGMA)
    ========================= */
    .frp-title {
        font-family: 'Roboto', sans-serif;
        font-size: 22px;
        font-weight: 700;
        line-height: 34px;
        color: #101828;

        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4; /* EXACT: 136px height */
        overflow: hidden;
    }

    /* =========================
       FOOTER
    ========================= */
    .frp-footer {
        display: flex;
        align-items: center;
        gap: 4px;

        font-family: 'Roboto', sans-serif;
        font-size: 14px;
        line-height: 20px;
        color: #6A7282;

        border-top: 1px solid #F3F4F6;
        padding-top: 6px;
    }

}

/* Mobile Portrait (<= 480px) */
@media (max-width: 480px) {
  .blog-container {
    padding: 24px 16px;
    gap: 24px;

    /* Stack layout for mobile */
    flex-direction: column;
  }
.blog-main {
   
    gap: 32px;
  }

  .blog-sidebar {
   
    width: 100%;
  }

 .ob-section {
    grid-template-columns: 1fr;
    padding: 0px;
  }

 .footer-main {
    width: 100%;
    max-width: 100%;

    padding: 0 16px;

    display: grid;

    /* 🔥 2 column layout */
    grid-template-columns: repeat(2, 1fr);

    grid-template-areas:
      "about about"
      "company company"
      "product learn"
      "legal legal";

    gap: 32px;

    box-sizing: border-box;
  }

.frp-container {
    max-width: 358px;
  }

 .frp-posts {
        grid-template-columns: 1fr;
        gap: 16px;
    }
 .frp-posts {
        grid-template-columns: 1fr;
        gap: 16px;
    }

.frp-title {
        -webkit-line-clamp: 2;
    }

.company-col {
    grid-area: company;
    display: flex;
    flex-direction: row;
}
.col1 {
    min-width: 47%;
}
    .all-features-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
        width: 100%;
        grid-auto-flow: row;
    }


.feature-card {
    display: flex;
    flex-direction: column-reverse;
 
}


.feature-card-text {
  
    padding: 24px 0px 24px 0px;
   
}

.feature-points {
    margin-bottom: 24px;
    list-style: none;
    padding: 0;
    /* margin: 0; */
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
}
}














.breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;

  width: 100%;
  max-width: 886px;
}

/* LINKS */
.breadcrumb a {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 24px;

  color: #2563EB;
  text-decoration: none;
}

/* CURRENT */
.breadcrumb-current {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;

  color: #0F172B;
}

/* ARROW */
.breadcrumb-sep {
  width: 4px;
  height: 8px;
  object-fit: contain;
}




/* AUTHOR */
.blog-author {
  display: flex;
  flex-direction: row;
  gap: 16px;
  padding: 8px 0;
}

.blog-author .author-row {
  display: flex;
  flex-direction: row; /* ✅ stack on desktop */
  gap: 16px;
}

.blog-author .author-block {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* IMAGE (NO CLS) */
.author-block img {
  width: 40px;
  height: 40px;
  border-radius: 50px;
  object-fit: cover;
}

/* TEXT COLUMN */
.author-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* LABEL */
.author-label {
  display: flex;
  align-items: center;
  gap: 8px;

  font-size: 14px;
  line-height: 20px;
  color: #45556C;
}

/* NAME */
.author-name {
  font-size: 18px;
  font-weight: 700;
  color: #0F172B;
  text-decoration: none;
}

/* UPDATED */
.updated-block {
  display: flex;
  align-items: center;
  gap: 8px;

  font-size: 14px;
  color: #45556C;
}

/* IMAGE */
.featured-image {
  width: 100%;
  max-width: 886px;

  aspect-ratio: 886 / 449; /* CRITICAL */
  padding: 10px;

  box-sizing: border-box;
}

/* IMAGE */
.featured-image img {
  width: 100%;
  height: 100%;

  object-fit: cover;
  display: block;
}


/* =========================
   BLOG CONTENT CONTAINER
========================= */
.blog-content {
  width: 100%;
  max-width: 886px;

  display: flex;
  flex-direction: column;
gap:24px;

}

/* =========================
   RESET (CRITICAL)
========================= */
.blog-content * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* =========================
   PARAGRAPH
========================= */
.blog-content p {
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 400;
  color: #314158;
}

/* =========================
   H2 (MAIN HEADING)
========================= */
.blog-content h2 {
  font-family: 'Roboto', sans-serif;
  font-size: 40px;
  line-height: 56px;
  font-weight: 600;
  color: #0F172B;
}

/* =========================
   H3 (SUB HEADING)
========================= */
.blog-content h3 {
  font-family: 'Roboto', sans-serif;
  font-size: 32px;
  line-height: 48px;
  font-weight: 400;
  color: #101828;
}

/* =========================
   SPACING SYSTEM (FIGMA)
========================= */


/* =========================
   LIST
========================= */
/* =========================
   LIST CONTAINER (WP)
========================= */
.blog-content .wp-block-list {
  padding-left: 20px;
  margin: 0;

  display: flex;
  flex-direction: column;
  gap: 12px; /* FIGMA spacing */
}

/* =========================
   LIST ITEMS
========================= */
/* =========================
   FIGMA MATCH LIST
========================= */
.blog-content .wp-block-list {
  list-style: none; /* remove default bullets */
  padding-left: 0;

  display: flex;
  flex-direction: column;
  
}

/* LIST ITEM */
.blog-content .wp-block-list li {
  position: relative;
  padding-left: 18px; /* space for custom dot */

  font-family: 'Roboto', sans-serif;
  font-size: 18px;
 line-height: 1.33; /* FIXED */
  font-weight: 400;
  color: #314158;
}

/* CUSTOM BULLET */
.blog-content .wp-block-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px; /* vertical alignment with text */

  width: 6px;
  height: 6px;

  background-color: #314158; /* figma color */
  border-radius: 50%;
}

/* =========================
   STRONG TEXT (TITLE PART)
========================= */
.blog-content li strong {
  font-weight: 600;
  color: #0F172B;
}

/* =========================
   BULLET STYLE (OPTIONAL PREMIUM)
========================= */
.blog-content li::marker {
  color: #2563EB;
}

/* =========================
   SPACING FIX (IMPORTANT)
========================= */
.blog-content ul {
  margin: 0;
}

/* =========================
   IMAGES INSIDE CONTENT
========================= */
.wp-block-image {
   aspect-ratio: 886 / 442;
  overflow: hidden;
}


.wp-block-image img {
  width: 100%;
  height: 100%!important;
  object-fit: cover; /* better than contain */
    max-width: 886px;
border: 30px solid #FFFFFF;
    border-radius: 2px;
    object-position: bottom;
}

/* MOBILE FIX */
@media (max-width: 768px) {
  .blog-content img {
    border: 12px solid #FFFFFF; /* reduced */
  }
}

/* =========================
   TABLE
========================= */
/* =========================
   TABLE FIX (CORRECT)
========================= */
/* WRAPPER (IMPORTANT) */
.table-wrapper {
  width: 100%;
  overflow-x: auto;
}

/* TABLE */
.custom-table {
  width: 100%;
  min-width: 700px; /* KEY for multi columns */

  border: 1px solid #E5E7EB;
  border-radius: 4px;
  border-collapse: separate;
  border-spacing: 0;
}

/* HEADER */
.custom-table th {
  background: #353535;
  color: #fff;

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

  padding: 10px 16px;
  text-align: left;
  white-space: nowrap;
}

/* CELLS */
.custom-table td {
  font-size: 14px;
  color: #314158;

  padding: 11px 16px;
  border-bottom: 1px solid #E5E7EB;

  white-space: nowrap;
}

/* WRAPPER */
.table-wrapper {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;

  /* hide scrollbar */
  scrollbar-width: none; /* Firefox */
}
.table-wrapper::-webkit-scrollbar {
  display: none; /* Chrome */
}

/* TABLE */
.custom-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 100%;
}

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

  .custom-table {
    width: max-content; /* allow horizontal expansion */
  }

  .custom-table th,
  .custom-table td {
    min-width: 45vw; /* KEY */
    max-width: 45vw;
    white-space: nowrap;
  }

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

  .blog-content h2 {
    font-size: 28px;
    line-height: 40px;
  }

  .blog-content h3 {
    font-size: 24px;
    line-height: 34px;
  }

  .blog-content p,
  .blog-content li {
    font-size: 16px;
    line-height: 22px;
  }

}


/* =========================
   SIDEBAR
========================= */
/* =========================
   SIDEBAR STICKY
========================= */

/* JUMP TO */
/* =========================
   CONTAINER
========================= */
.jump-to {
  width: 100%;
 

  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
margin-bottom: 24px;
    padding: 23px 38px;
  box-sizing: border-box;
}

/* =========================
   HEADER
========================= */
.jump-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* TITLE */
.jump-title {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;

  color: #062961;
}

/* =========================
   BUTTON
========================= */
.jump-toggle {
  display: flex;
  align-items: center;
  gap: 8px;

  padding: 0 12px;
  height: 28px;

  border: none;
  background: transparent;
  cursor: pointer;
}

/* TEXT */
.jump-text {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;

  color: #45556C;
}

/* ARROW */
.jump-arrow {
  transition: transform 0.3s ease;
}

/* =========================
   CONTENT (COLLAPSED)
========================= */
.jump-content {
  display: none; /* only this */
  margin-top: 16px;
}

/* when active */
.jump-to.active .jump-content {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* =========================
   ACTIVE STATE
========================= */
.jump-to.active .jump-content {
  display: flex;
}

.jump-to.active .jump-arrow {
  transform: rotate(180deg);
}

.jump-content {
  margin-top: 10px;
}

/* CLEAN TOC */
.lwptoc {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* MOBILE */
.mobile-toc {
  display: none;
}

@media (max-width: 768px) {

 
  .blog-title {
    font-size: 40px;
    text-align: center;
  }


  .mobile-toc {
    display: block;
  }

.st-badge {
margin:0 auto;
}
}

/* =========================
   MAIN CONTAINER
========================= */
.side-advt {
  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
margin-bottom:0px;
 
  gap: 18px;

  width: 100%; /* responsive instead of fixed 432px */
  max-width: 432px;


  

  border: 1px solid #E5E7EB;
  border-radius: 4px;
}

/* INNER */
.advt-inner {
 padding: 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
    margin-bottom: 24px;
}

/* =========================
   HEADER
========================= */


.advt-header .sidebar-label {
  font-size: 28px;
  font-weight: 700;
  line-height: 42px;
  color: #101828;
  margin: 0;
}

.advt-sub {
  font-size: 16px;
  font-weight: 600;
  color: #155DFC;
  margin: 0;
}

.advt-desc {
  font-size: 16px;
  color: #4A5565;
  margin: 0;
}

/* =========================
   IMAGE (ZERO CLS)
========================= */
.advt-image {
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  overflow: hidden;
}

.advt-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* =========================
   LIST
========================= */
.advt-list {
  list-style: none;
  padding: 0;
  margin: 0;

  display: flex;
  flex-direction: column;
  gap: 10px;
}

.advt-list li {
  display: flex;
  align-items: center;
  gap: 8px;

  font-size: 16px;
  color: #364153;
}

/* CUSTOM ICON */


/* =========================
   BUTTON
========================= */
.advt-btn {
  display: flex;
  justify-content: center;
  align-items: center;

  height: 45px;
  background: #155DFC;
  color: #fff;

  font-size: 16px;
  font-weight: 700;

  border-radius: 4px;
  text-decoration: none;
}

/* =========================
   FOOT TEXT
========================= */
.advt-foot {
  font-size: 14px;
  color: #6A7282;
  text-align: center;
  margin: 0;
}





/* =========================
   CONTAINER
========================= */
.strike-tools {
  width: 100%;
  max-width: 432px;
    margin-bottom: 24px;
  padding: 24px;
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 4px;

  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* =========================
   BADGE
========================= */
.st-badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  background: #DBEAFE;
  color: #1447E6;
max-width: 279px;
  font-size: 14px;
  font-weight: 600;
gap: 8px;
  border-radius: 4px;
}

/* =========================
   HEADER
========================= */
.st-header h3 {
  font-size: 28px;
  font-weight: 700;
  line-height: 42px;
  margin: 0;
}

.st-header p span {
  color: #2563EB;
}

.st-header p {
  font-size: 16px;
  line-height: 22px;
  color: #4A5565;
  margin: 0;
}

/* =========================
   STATS
========================= */
.st-stats {
  display: flex;
  justify-content: space-between;
}

.st-stats div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.st-stats strong {
  font-size: 16px;
  color: #101828;
}

.st-stats span {
  font-size: 16px;
  color: #4A5565;
}

/* =========================
   LIST (SCROLLABLE)
========================= */
.st-list {
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  overflow-y: auto;
}

/* ITEM */
.st-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;

  padding: 10px;
  border-bottom: 1px solid #E5E7EB;
}

.st-item:last-child {
  border-bottom: none;
}

/* CONTENT */
.st-content a {
  font-size: 14px;
  font-weight: 600;
  color: #2563EB;
  text-decoration: underline;
}

.st-content p {
  font-size: 14px;
  color: #4A5565;
  margin: 2px 0 0;
}

/* =========================
   TAGS
========================= */
.st-item .tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 2px 6px;
  height: 22px;

  border-radius: 999px; /* same as figma large value */

  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;

  white-space: nowrap; /* prevent wrapping */
}

/* COLORS */
.st-item .tag-blue {
  background: #DBEAFE;
  color: #1447E6;
}

.st-item .tag-purple {
  background: #F3E8FF;
  color: #8200DB;
}

.st-item .tag-green {
  background: #DCFCE7;
  color: #008236;
}

.st-item .tag-orange {
  background: #FFEDD4;
  color: #CA3500;
}

.st-item .tag-pink {
  background: #FCE7F3;
  color: #C6005C;
}

/* =========================
   FOOTER
========================= */
.st-footer {
  text-align: center;
  font-size: 12px;
 margin-top:-16px;

  background: #F9FAFB;
  padding: 8px;
  border: 1px solid #E5E7EB;
    border-radius: 0px 0px 4px 4px;
    font-weight: 600;
    background: #F9FAFB;
}


.blog-content td, .blog-content th {
    height: 56px;
    font-size: 14px;
   
    height: 20px;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    white-space: unset !important;
    color: #314158;
  
    flex: none;
    order: 0;
    flex-grow: 1;
    padding: 16px;
    border-bottom: 1px solid #E5E7EB;
    text-align: left;
}
.wp-block-table .has-fixed-layout tbody tr:first-child td {
   
    padding: 10px 16px;
    
    color: white;
    text-align: left;
    height: 40px;
    background: #353535!important;
    border-radius: 0px 4px 0px 0px;
}






/* =========================
   CARD
========================= */
.ob-card {
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 2px;
  padding: 16px;
}

/* =========================
   TEXT
========================= */
.ob-title {
  font-size: 16px;
  font-weight: 600;
  color: #101828;
}

.ob-desc {
  font-size: 14px;
  line-height: 20px;
  color: #364153;
}

/* =========================
   TIMELINE
========================= */
/* =========================
   UPDATE HISTORY CARD
========================= */
.ob-history {
  width: 100%;
 

  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 2px;

  padding: 16px;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* =========================
   HEADER
========================= */
.ob-history .ob-title {
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 19px;
  color: #101828;
margin-bottom:0px;
}

.ob-history .ob-desc {
  font-size: 14px;
  line-height: 20px;
  color: #364153;
}

/* =========================
   TIMELINE WRAPPER
========================= */
.ob-timeline {
  position: relative;
  padding-left: 29px; /* from figma */
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* vertical line */
.ob-timeline::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: #E5E7EB;
}

/* =========================
   ITEM
========================= */
.ob-timeline-item {
  position: relative;
}
/* TIMELINE WRAPPER */
.ob-timeline {
  position: relative;
  padding-left: 40px; /* give enough space */
}

/* VERTICAL LINE */
.ob-timeline::before {
  content: "";
  position: absolute;

  left: 21px; /* EXACT FIGMA */
  top: 6px;
  bottom: 6px;

  width: 2px;
  background: #E5E7EB;
}

/* DOT */
.ob-dot {
  position: absolute;

  left: -23px; /* 21 - 6 (perfect center) */
  top: 6px;

  width: 12px;
  height: 12px;

  background: #fff;
  border: 2px solid #101828;
  border-radius: 50%;
}
/* =========================
   CONTENT
========================= */
.ob-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* name + date */
.ob-top {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* NAME */
.ob-top strong {
  font-size: 14px;
  font-weight: 600;
  color: #101828;
}

/* DATE */
.ob-top span {
  font-size: 12px;
  line-height: 14px;
  color: #6A7282;
}

/* DESIGNATION */
.ob-content p {
  font-size: 14px;
  line-height: 14px;
  color: #4A5565;
  margin: 0;
text-transform: lowercase;
}
/* =========================
   AUTHOR TABS
========================= */
/* =========================
   WRAPPER
========================= */
/* =========================
   WRAPPER
========================= */
.ob-ae {
  width: 100%;
 

  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 2px;

  padding: 16px;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* =========================
   TABS
========================= */
.ob-ae-tabs {
  display: flex;
  gap: 16px;
}

.ob-ae-tab {
  flex: 1;
  background: none;
  border: none;
  padding-bottom: 12px;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  text-align: left;
}

.ob-ae-tab.active {
  border-bottom: 2px solid #155DFC;
}

/* =========================
   USER
========================= */
.ob-ae-user {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ob-ae-user img {
  width: 40px;
  height: 40px;
  border-radius: 50px;
  object-fit: cover;
}

/* =========================
   TEXT
========================= */
.ob-ae-meta {
  display: flex;
  flex-direction: column;
}

.ob-ae-label {
  display: flex;
  align-items: center;
  gap: 6px;

  font-size: 12px;
  color: #45556C;
}

.ob-ae-label img {
  width: 12px;
  height: 12px;
}

.ob-ae-name {
  font-size: 10px;
  font-weight: 600;
  color: #0F172B;
}

/* =========================
   CONTENT
========================= */
.ob-ae-content {
  display: none;
}

.ob-ae-content.active {
  display: block;
}

.ob-ae-content p {
  margin: 0;
  font-size: 14px;
  line-height: 21px;
  color: #2E3543;
}

.ob-ae-icon {
  width: 12px !important;
    height: 12px !important;

  display: block;
  flex-shrink: 0;
}

/* =========================
   TAGS
========================= */
.ob-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ob-tags a {
  padding: 6px 16px;
  border: 1px solid #E5E7EB;
  border-radius: 999px;
  font-size: 12px;
  color: #364153;
  text-decoration: none;
}



/* =========================
   WRAPPER
========================= */
.ob-sectors {
  width: 100%;


  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 2px;

  padding: 16px;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* =========================
   HEADER
========================= */
.ob-sectors-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ob-sectors-title {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: #101828;
  margin: 0;
}

.ob-sectors-desc {
  font-size: 12px;
  line-height: 16px;
  color: #4A5565;
  margin: 0;
}

/* =========================
   LIST
========================= */
.ob-sectors-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* =========================
   TAG BUTTON
========================= */
.ob-sector-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 6px 14px;

  border: 1px solid #E5E7EB;
  border-radius: 999px;

  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  color: #364153;

  text-decoration: none;
  white-space: nowrap;

  transition: all 0.2s ease;
}

/* HOVER */
.ob-sector-item:hover {
  background: #F1F5F9;
  border-color: #CBD5E1;
}

/* ACTIVE CLICK */
.ob-sector-item:active {
  transform: scale(0.96);
}





.frp-section {
  padding: 40px 48px;
  background: #F9FAFB;
}

/* HEADER */
.frp-header h2 {
  font-size: 40px;
  font-weight: 600;
}

.frp-header p {
  font-size: 18px;
  color: #4A5565;
}

/* TABS */
.frp-tabs {
  display: flex;
  gap: 12px;
  margin-top: 16px;
  overflow-x: auto;
}

.frp-tabs::-webkit-scrollbar {
  display: none;
}

.frp-tab {
  padding: 8px 16px;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  font-weight: 600;
  color: #4A5565;
  background: none;
  border: none;
}

.frp-tab.active {
  color: #155DFC;
  border-bottom: 2px solid #155DFC;
}



/* =========================
   CARD WRAPPER
========================= */


/* =========================
   IMAGE CONTAINER
========================= */
.frp-img {
  width: 100%;
  height: 206px;
  display: block;
}

.frp-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
object-position: top;
}

/* =========================
   CONTENT WRAPPER
========================= */
.frp-content {
  display: flex;
  flex-direction: column;
  gap: 12px;

  padding: 24px;
}

/* =========================
   META ROW
========================= */
.frp-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

/* CATEGORY TAG */
.frp-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 3px 8px;

  background: #F3F4F6;
  border-radius: 2px;

  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;

  color: #101828;
}

/* READING TIME */
.frp-read {
  display: flex;
  align-items: center;
  gap: 4px;

  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #6A7282;
}

.frp-read img {
  width: 12px;
  height: 12px;
  display: block;
}

/* =========================
   TITLE
========================= */
.frp-title {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 22px;
  line-height: 34px;

  color: #101828;
  margin: 0;
}

.frp-title a {
  color: inherit;
  text-decoration: none;
}

/* =========================
   FOOTER
========================= */
.frp-footer {
  display: flex;
  align-items: center;
  gap: 8px;

  padding-top: 6px;
  border-top: 1px solid #F3F4F6;

  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #6A7282;
}

.frp-read {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  color: #6A7282;
}

.frp-title {
  font-size: 22px;
  font-weight: 700;
}

.frp-footer {
  font-size: 14px;
  color: #6A7282;
  border-top: 1px solid #F3F4F6;
  padding-top: 8px;
}

/* LOAD MORE */
.frp-loadmore-wrap {
  text-align: center;
  margin-top: 24px;
}

.frp-loadmore {
  background: #155DFC;
  color: #fff;
  padding: 16px 24px;
  border-radius: 4px;
  border: none;
  font-weight: 700;
}

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

  .frp-section {
    padding: 16px;
  }

 
  .frp-tabs {
    padding-right: 40px; /* half visible hint */
  }
}


/*author-mobile */

@media (max-width: 768px) {

  /* Main container */
  .blog-author {
    display: flex;
    flex-direction: column;
    padding: 8px 0;
    gap: 16px;
  }

  /* Row (AUTHOR + EDITOR) */
  .blog-author .author-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 24px;
    width: 100%;
  }

  /* Each block */
  .blog-author .author-block {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    min-width: 0; /* prevent overflow */
  }

  /* Image */
  .blog-author .author-block > img {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    flex-shrink: 0;
  }

  /* Meta (text container) */
  .blog-author .author-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    gap: 2px;
  }

  /* Label row */
  .blog-author .author-label {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;

    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #45556C;
  }

  /* Icon */
  .blog-author .author-label img {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
  }

  /* Name */
  .blog-author .author-name {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #0F172B;
    text-decoration: none;

    display: block;
  }

.updated-block {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #45556C;
    text-align: center;
    flex-wrap: nowrap;
    justify-content: center;
}



@media (max-width: 768px) {
  .breadcrumb a,
  .breadcrumb-current {
    max-width: 80px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    vertical-align: bottom;
  }
}

}


.dropdown-icon img {
    vertical-align: middle;
}
div#ez-toc-container ul li a {
    text-decoration: none!important;
    font-family: 'Roboto', sans-serif!important;
    font-weight: 600!important;
    font-size: 18px!important;
    color: #155DFC!important;
    display: block!important;
}

/* WRAPPER (important for boundary) */
.sticky-footer-wrapper {
  position: relative;
}

/* STICKY FOOTER */
.sticky-footer {
  position: sticky;
  bottom: 0; /* 🔥 key */

  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;

  padding: 6px 0;
  height: 60px;

  background: linear-gradient(90deg, #0F172B 0%, #1D293D 50%, #0F172B 100%);
  border-top: 1px solid #E5E7EB;
  z-index: 10;
}

/* TEXT */
.sf-text {
  font-weight: 700;
  font-size: 16px;
  color: #fff;
margin-bottom: 0px;
}

/* BUTTON */
.sf-btn {
  padding: 12px 20px;
  background: linear-gradient(90deg, #FFA15E 0%, #FFE276 100%);
  border-radius: 4px;
  font-weight: 700;
  color: #000;
  text-decoration: none;
}
@media (max-width: 768px) {
  .sticky-footer-wrapper {
    display: none;
  }
}

.sebi-icon {
  width: 40px;
  height: 40px;

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



@media (min-width: 479px) and (max-width: 1023px) {
  .connect-col {
    margin-top: -344px !important;
  }
}

.featured-img {
  width: 100%;
 
  height: auto;
}


aside {
  position: sticky;
  top: 70px; /* adjust based on header */
align-self: flex-start;
}


.single-post {
  overflow-x: visible;
}




/* Wrapper */
.sm-share-card {
  width: 100%;
  max-width: 432px;
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  font-family: Roboto, sans-serif;
}

/* Title */
.sm-share-header {
  padding: 16px 24px 8px;
  font-size: 16px;
  font-weight: 600;
  color: #364153;
}

/* Icons Row */
.sm-share-icons {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 24px 16px;
}

/* Base Icon */
.sm-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  background: #FFFFFF;
  text-decoration: none;
  cursor: pointer;
}

.sm-icon img {
  display: block;
 width: 40px;
  height: 40px;
}

/* Copy button */
.sm-icon-copy {
  background: #2563EB;
}



/* Divider */
.sm-divider {
  width: 1px;
  height: 32px;
  background: #E5E7EB;
}

/* Reddit style */
.sm-icon-reddit {
  background: #FF4500;
  border-radius: 50%;
}



/* Hover */
.sm-icon:hover {
  transform: translateY(-1px);
  transition: 0.2s ease;
}




/* Contact page OUTER WRAPPER */

/* ========================= */
/* GLOBAL */
/* ========================= */

.contact-details {
  display: flex;
  flex-direction: column;
  align-items: center;

  width: 100%;
  padding: 48px 80px;
  gap: 48px;

  font-family: 'Roboto', sans-serif;
  color: #101828;
}

/* ========================= */
/* MAIN CONTAINER */
/* ========================= */

.contact-container {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;

  align-items: stretch; /* equal height */

  gap: 32px;

  width: 100%;
  max-width: 1280px;
}

/* ========================= */
/* LEFT CONTAINER */
/* ========================= */

.contact-left {
  width: 688px;
  min-width: 560px;
  max-width: 100%;

  display: flex;
  flex-direction: column;

  padding: 32px 32px 0;
  gap: 32px;
}

/* HEADING */
.contact-heading {
  margin: 0;

  font-weight: 700;
  font-size: 36px;
  line-height: 52px;
}

/* CONTACT BLOCK */
.contact-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.contact-block p {
  margin: 0;

  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
}

.contact-block a {
  color: #101828;
  text-decoration: none;
}

.contact-sub {
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #4A5565;
}

/* WHATSAPP */
.whatsapp-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 8px 18px;

  border: 1px solid #101828;
  border-radius: 4px;

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

  color: #101828;
  text-decoration: none;
}

/* ========================= */
/* LOCATION */
/* ========================= */

.contact-location {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.contact-location h3 {
  margin: 0;

  font-weight: 700;
  font-size: 30px;
  line-height: 44px;
}

.contact-location p {
  margin: 0;

  font-weight: 400;
  font-size: 14px;
  line-height: 24px;

  color: #4A5565;
}

.contact-location iframe {
  width: 100%;
  height: 209px;
  border: 0;
}

/* ========================= */
/* RIGHT CONTAINER */
/* ========================= */

.contact-right {
  width: 560px;
  max-width: 100%;

  display: flex;
  flex-direction: column;

  padding: 32px;
  gap: 24px;

  background: #F9FAFB;
  border-radius: 10px;
}

/* HEADING */
.form-heading {
  margin: 0;

  font-weight: 700;
  font-size: 30px;
  line-height: 44px;
}

/* ========================= */
/* FORM */
/* ========================= */

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

/* LABEL */
.contact-form label {
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
display:none;
}

/* INPUT */
.contact-form input,
.contact-form textarea {
  width: 100%;

  padding: 12px;

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

  border: 1px solid #E5E7EB;
  border-radius: 4px;

  outline: none;
}

/* PLACEHOLDER */
.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: rgba(0, 20, 72, 0.3);
}

/* TEXTAREA */
.contact-form textarea {
  min-height: 160px;
  resize: vertical;
}

/* BUTTON */
.contact-form button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 16px 24px;

  width: fit-content;

  background: #155DFC;
  color: #FFFFFF;

  border: none;
  border-radius: 4px;

  font-weight: 700;
  font-size: 16px;
  line-height: 24px;

  cursor: pointer;
}

/* NOTE */
.form-note {
  margin: 0;

  font-weight: 400;
  font-size: 14px;
  line-height: 20px;

  color: #4A5565;
}

/* ========================= */
/* TABLET PORTRAIT */
/* ========================= */

@media (max-width: 1024px) {
  .contact-container {
    flex-direction: column;
  }

  .contact-left,
  .contact-right {
    width: 100%;
    min-width: 100%;
  }
}

/* ========================= */
/* MOBILE */
/* ========================= */

@media (max-width: 480px) {

  .contact-details {
    padding: 16px;
    gap: 24px;
  }

  .contact-left {
    padding: 0;
    align-items: center;
    text-align: center;
  }

  .contact-heading {
    font-size: 24px;
    line-height: 34px;
  }

  .contact-block p,
  .contact-sub {
    font-size: 16px;
    line-height: 26px;
  }

  .contact-location h3 {
    font-size: 20px;
    line-height: 30px;
    text-align: center;
  }

  .contact-location p {
    text-align: center;
  }

  .contact-right {
    padding: 16px;
    align-items: center;
  }

  .form-heading {
    font-size: 20px;
    line-height: 30px;
    text-align: center;
  }

  .contact-form button {
    width: 100%;
  }

  .form-note {
    text-align: center;
  }
}



/* ========================= */
/* SECTION WRAPPER */
/* ========================= */

.discover-section {
  display: flex;
  flex-direction: column;
  align-items: center;

  padding: 48px 80px;
  gap: 48px;

  width: 100%;
  font-family: 'Roboto', sans-serif;
}

/* ========================= */
/* TOP BLUE BOX */
/* ========================= */

.discover-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  padding: 64px 0;
  gap: 32px;

  width: 100%;
  max-width: 1280px;

  background: rgba(22, 69, 129, 0.1);
  border-radius: 4px;
}

/* TEXT WRAPPER */
.discover-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;

  max-width: 446px;
  text-align: center;
}

/* HEADING */
.discover-title {
  margin: 0;

  font-weight: 700;
  font-size: 36px;
  line-height: 52px;
  color: #1E1E1E;
}

/* SUBTEXT */
.discover-subtitle {
  margin: 0;

  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #1F1F1F;
}

/* BUTTON */
.discover-btn {
  display: inline-flex;
  align-items: center;
  gap: 11px;

  padding: 12px 24px;

  background: #2F3F55;
  border-radius: 4px;

  color: #fff;
  text-decoration: none;

  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}

/* ========================= */
/* CARDS CONTAINER */
/* ========================= */

.discover-cards {
  display: flex;
  flex-direction: row;
  gap: 64px;

  width: 100%;
  max-width: 1280px;
}

/* CARD */
.discover-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;

  padding: 32px;
  gap: 6px;

  flex: 1;

  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
}

/* ICON */
.discover-card-icon {
  width: 48px;
  height: 48px;
}

/* TITLE */
.discover-card-title {
  margin: 0;

  font-weight: 700;
  font-size: 22px;
  line-height: 34px;

  color: #101828;
}

/* DESCRIPTION */
.discover-card-desc {
  margin: 0;

  font-weight: 400;
  font-size: 18px;
  line-height: 28px;

  color: #4A5565;
}


@media (max-width: 1024px) {

  .discover-section {
    padding: 24px;
    gap: 24px;
  }

  .discover-box {
    padding: 64px 0;
    max-width: 796px;
  }

  .discover-content {
    max-width: 397px;
  }

  .discover-title {
    font-size: 24px;
    line-height: 34px;
  }

  .discover-subtitle {
    font-size: 16px;
    line-height: 26px;
  }

  .discover-cards {
    gap: 32px;
    max-width: 796px;
  }

  .discover-card-title {
    font-size: 18px;
    line-height: 28px;
  }

  .discover-card-desc {
    font-size: 16px;
    line-height: 26px;
  }
}


@media (max-width: 480px) {

  .discover-section {
    padding: 16px;
    gap: 16px;
  }

  .discover-box {
    padding: 48px 0;
  }

  .discover-content {
    max-width: 358px;
  }

  .discover-title {
    font-size: 24px;
    line-height: 34px;
  }

  .discover-subtitle {
    font-size: 16px;
    line-height: 26px;
  }

  /* STACK CARDS */
  .discover-cards {
    flex-direction: column;
    gap: 16px;
  }

  .discover-card {
    align-items: center;
    text-align: center;
  }

  .discover-card-desc {
    text-align: center;
  }
}




/* ========================= */
/* CONTACT CTA SECTION */
/* ========================= */

.contact-cta-section {
  display: flex;
  flex-direction: column;
  align-items: center;

  padding: 48px 80px;
  gap: 48px;

  width: 100%;

  background: #404653;
  font-family: 'Roboto', sans-serif;
  text-align: center;
}

/* ========================= */
/* TITLE */
/* ========================= */

.contact-cta-title {
  margin: 0;
  max-width: 1280px;

  font-weight: 700;
  font-size: 36px;
  line-height: 52px;

  color: #FFFFFF;
}

/* ========================= */
/* SUBTITLE */
/* ========================= */

.contact-cta-subtitle {
  margin: 0;
  max-width: 1280px;

  font-weight: 400;
  font-size: 18px;
  line-height: 28px;

  color: #D1D5DC;
}

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

.contact-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 11px;

  padding: 12px 24px;

  background: #FFFFFF;
  border-radius: 4px;

  text-decoration: none;

  font-weight: 700;
  font-size: 16px;
  line-height: 24px;

  color: #41444F;
}

.contact-cta-btn img {
  display: block;
}


.sebi-content .sebi-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
  color: #101828;
  margin: 0;
}


.col1, .col2 {
    gap: 24px;
    display: flex;
    flex-direction: column;
}


/* ========================= */
/* INNER WRAPPER */
/* ========================= */

.sebi-badge-left {
  display: flex;
  align-items: center;
  gap: 12px;
    flex-wrap: nowrap;
}

/* ========================= */
/* ICON WRAPPER */
/* ========================= */

.sebi-icon {
  width: 48px;
  height: 48px;

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

  background: linear-gradient(135deg, #E17100 0%, #FDC700 100%);
  border-radius: 4px;

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

  flex-shrink: 0;
}

/* ICON INSIDE */
.sebi-icon img,
.sebi-icon svg {
  width: 22px;
  height: 22px;
}

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

.sebi-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
padding-top: 18px;
  gap: 2px;
}

/* ========================= */
/* TITLE */
/* ========================= */

.sebi-title {
  margin: 0;

  font-weight: 700;
  font-size: 18px;
  line-height: 28px;

  color: #101828;
}

/* ========================= */
/* SUBTITLE */
/* ========================= */

.sebi-subtitle {
  margin: 0;

  font-weight: 700;
  font-size: 16px;
  line-height: 22px;

  color: #101828;
}

/* ========================= */
/* VERIFIED ROW */
/* ========================= */

.sebi-verified {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

/* REG TEXT */
.sebi-reg {
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;

  color: #0B950D;
}

/* DOT */
.sebi-dot {
  width: 8px;
  height: 8px;

  background: #0B950D;
  border-radius: 50%;
}

/* STATUS */
.sebi-status {
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;

  color: #0B950D;
}


@media (max-width: 480px) {
  .trust-card {
    align-items: center;
  }
.sebi-status {
    font-weight: 600;
    font-size: 12px;
    line-height: 20px;
    color: #0B950D;
}
.sebi-reg {
    font-weight: 600;
    font-size: 12px;
    line-height: 20px;
    color: #0B950D;
}
.sebi-content p {
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    color: #101828;
    margin: 0;
}
}






/* HERO WRAPPER */
/* ================= HERO WRAPPER ================= */
/* ================= HERO ================= */
.nxg-hero {
     background: #FFFFFF;
    padding: 80px 0px 80px 80px;

}

/* ================= GRID ================= */
.nxg-container {
  max-width: 1440px;
 display: grid;
  grid-template-columns: 494px 1fr; /* match figma */
  max-width: 1440px;
  margin: 0 auto;
}

.nxg-text,
.nxg-buttons,
.nxg-stats {
  grid-column: 1;
}
.nxg-text{
        display: grid;
    grid-column: 1;
    padding: 102px 40px 22px 0px;
    gap: 12px;
}

.nxg-left-wrap {
  padding: 80px 40px 80px 80px;
}

/* RIGHT SIDE IMAGE */

/* ================= TEXT ================= */
.nxg-title {
  grid-column: 1;
  font-size: 48px;
  font-weight: 600;
  line-height: 64px;
  margin: 0;
  color: #101828;
}

.nxg-subtitle {
 grid-column: 1;
    font-size: 22px;
    line-height: 34px;
    margin: 0;
font-weight:500;
}

.nxg-desc {
  grid-column: 1;
  font-size: 18px;
  line-height: 28px;
  margin: 0;
font-size: 18px;
color: #101828;
}

/* ================= IMAGE ================= */


/* ================= BUTTONS ================= */
.nxg-buttons {
  grid-column: 1;
  display: flex;
  gap: 16px;
    padding: 32px 40px 32px 0px;
}

.nxg-btn-primary,
.nxg-btn-secondary {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 16px 24px;
  border-radius: 4px;
  font-weight: 700;
  text-decoration: none;
font-size: 16px;
    line-height: 24px;
}

.nxg-btn-primary {
  background: #155DFC;
  color: #fff;
}

.nxg-btn-secondary {
  background: #fff;
  border: 1px solid #E5E7EB;
  color: #0F172B;
}

/* ================= STATS ================= */
.nxg-stats {
  grid-column: 1;
  display: flex;
  gap: 48px;
    padding: 10px 40px 0px 0px
}

.nxg-stat {
  display: flex;
  flex-direction: column;
}

.nxg-stat-num {
  font-size: 22px;
  font-weight: 700;
}

.nxg-stat-label {
  font-size: 14px;
  color: #B0B2B5;
}



/* Tablet */
@media (max-width: 1024px) {
    .nxg-stat-num {
        font-size: 20px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .nxg-stat-num {
        font-size: 18px;
    }
}
/* ================= TABLET ================= */
@media (max-width: 1024px) {

  .nxg-container {
    grid-template-columns: 1fr;
    text-align: center;
        gap: 36px;
  }
 .nxg-hero {
    padding: 32px 64px;
  }
.nxg-hero-img {
    width: 100%;
    height: auto;
    border-radius: 0px;
    object-fit: cover;
    object-position: left;
}
.nxg-text {
    display: grid;
    grid-column: 1;
    padding: 0px;
    gap: 23px;
}


  .nxg-title,
  .nxg-subtitle,
  .nxg-desc,
  .nxg-buttons,
  .nxg-stats {
    grid-column: 1;
  }

.nxg-title {
  
    font-size: 40px;
   
}

  .nxg-image {
    grid-column: 1;
    grid-row: auto;
  }

     .nxg-buttons {
        flex-direction: column;
        width: 100%;
        padding: 32px 90px;
        gap: 16px;
    }

  .nxg-btn-primary,
  .nxg-btn-secondary {
    width: 100%;
    justify-content: center;
  }

  .nxg-stats {
    justify-content: space-between;
padding: 0px 90px;
  }


}

@media (max-width: 480px) {
.nxg-buttons {
    grid-column: 1;
    display: flex;
    gap: 16px;
    padding: 32px 0px 32px 0px;
}

.nxg-stats {
    grid-column: 1;
    display: flex;
    gap: 48px;
    padding: 0px;
}
}

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

  .nxg-hero {
    padding: 32px 16px;
  }

  .nxg-title {
    font-size: 32px;
    line-height: 44px;
  }
.nxg-text {
    display: grid;
    grid-column: 1;
    padding: 0px;
    gap: 23px;
}

  .nxg-subtitle {
    font-size: 18px;
  }

  .nxg-desc {
    font-size: 16px;
  }

  /* 🔥 ORDER CONTROL */
  .nxg-title { order: 1; }
  .nxg-subtitle { order: 2; }
  .nxg-desc { order: 3; }
  .nxg-image { order: 4; }   /* IMAGE IN MIDDLE */
  .nxg-buttons { order: 5; }
  .nxg-stats { order: 6; }

}
}

/* TEXT GROUP */
.nxg-text {
  grid-column: 1;
  display: flex;
  flex-direction: column;
  gap: 12px; /* from figma */
  max-width: 422px; /* important from figma */
}




.nxg-image {
  position: relative;
  width: 100%;
}

.nxg-image {
  position: relative;
  width: 100%;
  max-width: 897px;   /* 👈 limit width */
  margin-left: auto;  /* 👈 push to right */
}



/* SECTION */
.nx-capabilities {
  padding: 80px;
  background: #fff; /* as per your screen */
}

/* CONTAINER */
.nx-capabilities-container {
  max-width: 1280px;
  margin: 0 auto;
}

/* HEADER */
.nx-capabilities-header {
  text-align: center;
  margin-bottom: 64px;
}

.nx-capabilities-title {
  font-size: 36px;
  line-height: 45px;
  font-weight: 700;
 
  margin-bottom: 8px;
}

.nx-capabilities-subtitle {
     width: 100%;
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    letter-spacing: -0.712px;
    color: #4A5565;
    margin: 0;
}

/* GRID */
.nx-capabilities-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* CARD */
.nx-cap-card {
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 4px;
  padding: 32px;

  display: flex;
  flex-direction: column;
  gap: 12px;

  height: 100%; /* equal height */
}

/* ICON */
.nx-cap-icon {
  width: 48px;
  height: 48px;
  background: linear-gradient(180deg, #155DFC 0%, #1252E6 100%);
  border-radius: 4px;

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

/* TITLE */
.nx-cap-card h3 {
  font-size: 22px;
  line-height: 34px;
  font-weight: 700;
  color: #101828;
  margin: 0;
}

/* TEXT */
.nx-cap-card p {
  font-size: 18px;
  line-height: 28px;
  color: #4A5565;
  margin: 0;
}

@media (max-width: 1024px) {

  .nx-capabilities {
    padding: 80px 64px;
  }

  .nx-capabilities-container {
    max-width: 864px;
  }

  .nx-capabilities-title {
    font-size: 32px;
    line-height: 46px;
  }

  .nx-cap-card h3 {
    font-size: 20px;
    line-height: 30px;
  }
.feature-secondary-nav-container {
  
    padding: 0 15px; /* Alignment gutter */
}
}

@media (max-width: 768px) {

  .nx-capabilities {
    padding: 40px;
  }

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

  .nx-capabilities-title {
    font-size: 24px;
    line-height: 34px;
  }

  .nx-capabilities-subtitle {
    font-size: 16px;
    line-height: 26px;
  }

  .nx-cap-card h3 {
    font-size: 18px;
    line-height: 28px;
  }

  .nx-cap-card p {
    font-size: 16px;
    line-height: 26px;
  }
}

@media (max-width: 480px) {

  .nx-capabilities {
    padding: 24px;
  }

  .nx-capabilities-grid {
    grid-template-columns: 1fr;
  }

  .nx-cap-card {
    align-items: center;
    text-align: center;
  }

  .nx-cap-icon {
    margin-bottom: 8px;
  }

}


.footer-app h5 {
    color: #155DFC;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: 22px !important;
    display: flex;
    align-items: center;
    color: #4285F4 !important;
}

.footer-heading-blue {
    color: #155DFC;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: 22px !important;
    display: flex;
margin-bottom:0px;
    align-items: center;
    color: #4285F4 !important;
}
.connect-details p{
    margin-bottom: 5px;
    line-height: 20px;
}

/* Load More Section */
.aa-load {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 56px 0 0;
}

/* Button */
.aa-load button,
#load-more,
#search-load-more {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 10px;

 
    height: 46px;
    padding: 12px 24px;

    background: #155DFC;
    border: none;
    border-radius: 4px;

    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;
    color: #FFFFFF;

    cursor: pointer;
    transition: background .25s ease, transform .2s ease;
}




.plan-search-wrapper{
    position:relative;
    width:100%;
}

.search-suggestions{
    position:absolute;
    top:100%;
    left:0;
    right:0;

    display:none;

    background:#fff;

    border:1px solid #DCE3EE;
    border-top:none;

    border-radius:0 0 8px 8px;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

    overflow:hidden;

    z-index:999;
}

.search-item{

    display:flex;
    justify-content:space-between;
    align-items:center;
text-align: left;
    padding:16px;

    text-decoration:none;

    color:#111827;

    transition:.2s;

    border-bottom:1px solid #EEF2F7;

}

.search-item:last-child{
    border-bottom:none;
}

.search-item:hover{
    background:#F8FAFC;
}

.search-title{

    flex:1;

    color:#111827;

    font-size:16px;

    font-weight:500;

    line-height:24px;

    padding-right:16px;
}

.search-category{

    background:#F3F4F6;

    color:#374151;

    border-radius:6px;

    padding:6px 12px;

    font-size:13px;

    font-weight:600;

    white-space:nowrap;
}

/* Hover */
.aa-load button:hover,
#load-more:hover,
#search-load-more:hover {
    background: #0f4fd9;
}

/* Click */
.aa-load button:active,
#load-more:active,
#search-load-more:active {
    transform: translateY(1px);
}

/* Focus */
.aa-load button:focus-visible,
#load-more:focus-visible,
#search-load-more:focus-visible {
    outline: 2px solid #155DFC;
    outline-offset: 2px;
}

/* Disabled */
.aa-load button:disabled,
#load-more:disabled,
#search-load-more:disabled {
    opacity: .6;
    cursor: not-allowed;
}

.feature-title{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:16px;
    flex-direction: row;

}

.feature-title-icon{
   
    flex:0 0 32px;

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

}

.feature-title-icon img{
    width:32px;
    height:32px;
    display:block;
}

.feature-title h3{
    margin:0;
    font-family:Roboto,sans-serif;
    font-weight:700;
    font-size:18px;
    line-height:28px;
    color:#0F172B;
}

.feature-item-content p{
    margin-top:0;
}

.team-photo{
    width:72px;
    height:72px;
    margin:0 auto 16px;
    border-radius:50%;
    overflow:hidden;
    background:#D8E2F4;
}

.team-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}


.comparison .header h2 {
  

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 36px;
    line-height: 52px;
    text-align: center;

    color: #131725;
}

.comparison .header p {
   

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    text-align: center;

    color: #41444F;
}
/* =========================================================
   COMPARISON TABLE HEADER ONLY
   ========================================================= */

.comparison thead {
    background: #FFFFFF;
}

.comparison thead tr {
    background: #FFFFFF;
}


/* All header cells */

.comparison thead th {
    position: relative;
    vertical-align: middle;
    text-align: center;

    background: #FFFFFF;
    border: 0;
    border-bottom: 1px solid #D9DEE8;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    color: #131725;
}


/* =========================================================
   FEATURES
   ========================================================= */

.comparison thead .comparison-feature-heading {
    text-align: left;
    vertical-align: middle;
    background: #FFFFFF;
}

.comparison thead .comparison-feature-title {
    display: block;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 24px;

    text-align: left;
    color: #41444F;
}


/* =========================================================
   PLAN HEADINGS
   ========================================================= */

.comparison thead .comparison-plan-pro,
.comparison thead .comparison-plan-pro-plus,
.comparison thead .comparison-plan-elite,
.comparison thead .comparison-plan-research {
    position: relative;

    display: table-cell;
    vertical-align: middle;
    text-align: center;

    background: #FFFFFF;
}


/* =========================================================
   PLAN NAME
   ========================================================= */

.comparison thead .comparison-plan-name {
    display: block;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;

    text-align: center;
    color: #131725;
}


/* =========================================================
   PLAN PRICE
   ========================================================= */

.comparison thead .comparison-plan-price {
    display: block;

    margin-top: 2px;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 20px;

    text-align: center;
    color: #41444F;
}


/* =========================================================
   ELITE HEADER
   ========================================================= */

.comparison thead .comparison-plan-elite {
    background: #ffffff!important;
}


/* =========================================================
   MOST POPULAR
   ========================================================= */

.comparison thead .comparison-popular-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-top: 4px;
    padding: 3px 10px;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 11px;
    line-height: 16px;

    text-align: center;
    white-space: nowrap;

    color: #FFFFFF;
    background: #1683F7;

    border-radius: 4px;
}










/* =========================================================
   COMPARISON TABLE - TBODY
   ========================================================= */

.comparison tbody {
    font-family: 'Roboto', sans-serif;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
}


/* =========================================================
   NORMAL FEATURE ROW
   ========================================================= */

.comparison tbody tr:not(.section) {
    background: #FFFFFF;
}


/* =========================================================
   FEATURE NAME
   ========================================================= */

.comparison tbody td.feature {
    display: table-cell;

    vertical-align: middle;
    text-align: left;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;

    color: #131725;

    background: #FFFFFF;

    border-bottom: 1px solid #E5E7EB;
}


/* =========================================================
   PLAN VALUES
   ========================================================= */

.comparison tbody td:not(.feature):not(.section) {
    display: table-cell;

    vertical-align: middle;
    text-align: center;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 28px;

    color: #131725;

    background: #FFFFFF;

    border-bottom: 1px solid #E5E7EB;
}


/* =========================================================
   ELITE / HIGHLIGHT COLUMN
   ========================================================= */

.comparison tbody td.highlight {
    background: #F0F7FF;
}


/* =========================================================
   SECTION ROW
   ========================================================= */

.comparison tbody tr.section {
    background: #E9EFFE;
}


/* Section feature title */

.comparison tbody tr.section td.feature {
    display: table-cell;

    vertical-align: middle;
    text-align: left;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;

    color: #131725;

    background: #E9EFFE;

    border-top: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
}


/* Section empty cells */

.comparison tbody tr.section td:not(.feature) {
    background: #E9EFFE;

    border-top: 1px solid #E5E7EB;
    border-bottom: 1px solid #E5E7EB;
}


/* =========================================================
   CHECK
   ========================================================= */

.comparison tbody td.check {
    text-align: center;
    vertical-align: middle;

    color: #22C55E;
}


/* =========================================================
   CROSS
   ========================================================= */

.comparison tbody td.cross {
    text-align: center;
    vertical-align: middle;

    color: #99A1AF;
}





/* =========================================================
   STICKY FOOTER CTA STRIP
   ========================================================= */

/* =========================================================
   STICKY FOOTER CTA
   ========================================================= */

.sticky-footer-cta {
    box-sizing: border-box;

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

    padding: 6px 0;
    gap: 16px;

    background: linear-gradient(
        90deg,
        #0F172B 0%,
        #1D293D 50%,
        #0F172B 100%
    );

    border-bottom: 1px solid #E5E7EB;

    font-family: 'Roboto', sans-serif;
}


/* =========================================================
   DESKTOP TEXT
   ========================================================= */

.sticky-footer-cta-text {
    display: flex;
    align-items: center;
    justify-content: center;

    

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;

    text-align: center;
    color: #FFFFFF;

    flex-shrink: 0;
}


/* =========================================================
   DESKTOP BUTTON
   ========================================================= */

.sticky-footer-cta-button {
    box-sizing: border-box;

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

    width: 156px;

    padding: 12px 20px;

    background: linear-gradient(
        90deg,
        #FFA15E 0%,
        #FFE276 100%
    );

    border-radius: 4px;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 22px;

    text-align: center;
    white-space: nowrap;

    color: #000000;
    text-decoration: none;

    flex-shrink: 0;
}


/* =========================================================
   HOVER
   ========================================================= */

.sticky-footer-cta-button:hover {
    color: #000000;
    text-decoration: none;
    opacity: 0.92;
}


/* =========================================================
   MOBILE — EXACT FIGMA STRUCTURE
   ========================================================= */

@media (max-width: 768px) {

    .sticky-footer-cta {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;

        padding: 6px 0;
        gap: 16px;

        min-height: 60px;
    }


    /* Figma: 142px × 40px */

    .sticky-footer-cta-text {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 142px;

        font-family: 'Roboto', sans-serif;
        font-style: normal;
        font-weight: 700;
        font-size: 13px;
        line-height: 20px;

        text-align: center;
        color: #FFFFFF;

        flex: 0 0 142px;
        flex-shrink: 0;
    }


    /* Figma: 142px × 48px */

    .sticky-footer-cta-button {
        box-sizing: border-box;

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

        width: 142px;

        padding: 12px 20px;

        background: linear-gradient(
            90deg,
            #FFA15E 0%,
            #FFE276 100%
        );

        border-radius: 4px;

        font-family: 'Roboto', sans-serif;
        font-style: normal;
        font-weight: 700;
        font-size: 13px;
        line-height: 20px;

        text-align: center;
        white-space: nowrap;

        color: #000000;
        text-decoration: none;

        flex: 0 0 142px;
        flex-shrink: 0;
    }
}







.strike-services-content {
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #4A5565;
    text-align: left;
}

.strike-services-content > p {
    margin: 0 0 24px;
}

.strike-services-content .service-item {
    margin-bottom: 20px;
}

.strike-services-content .service-item strong {
    display: block;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 28px;

    color: #4A5565;

    margin-bottom: 4px;
}

.strike-services-content .service-item p {
    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;

    color: #4A5565;
}


@media (max-width: 768px) {

    .strike-services-content {
        font-size: 16px;
        line-height: 24px;
    }

    .strike-services-content .service-item strong {
        font-size: 16px;
        line-height: 24px;
    }

    .strike-services-content .service-item p {
        font-size: 16px;
        line-height: 24px;
    }

    .strike-services-content > p {
        margin-bottom: 20px;
    }

    .strike-services-content .service-item {
        margin-bottom: 16px;
    }
}


@media (max-width: 768px) {
    .partner-box {
        display: flex;
        flex-direction: column-reverse;
        gap: 16px;
        background: #fff;
        border: 1px solid #E5E7EB;
        border-radius: 6px;
        padding: 24px;
        margin-bottom: 16px;
    }

.contact-cta-title{

font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 34px;
/* or 142% */
text-align: center;

color: #FFFFFF;

}
.contact-cta-subtitle{
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 26px;
/* or 162% */
text-align: center;

color: #D1D5DC;

}
.contact-cta-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 16px;
    gap: 24px;
    width: 100%;
    background: #404653;
    font-family: 'Roboto', sans-serif;
    text-align: center;
}

.contact-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    padding: 12px 24px;
    background: #FFFFFF;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    line-height: 24px;
    color: #41444F;
}

}
/* =========================================================
   CONTACT INFORMATION
   ========================================================= */

.contact-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    font-family: 'Roboto', sans-serif;
}


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

.contact-heading {
    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 36px;
    line-height: 44px;

    color: #101828;
}


/* =========================================================
   CONTACT INFORMATION CONTAINER
   ========================================================= */

.contact-info {
    display: flex;
    flex-direction: column;

    gap: 32px;

    margin-top: 0px;
}


/* =========================================================
   CONTACT BLOCK
   ========================================================= */

.contact-block {
    display: flex;
    align-items: center;

    font-family: 'Roboto', sans-serif;
}


/* =========================================================
   PHONE ROW
   ========================================================= */

.contact-phone {
    display: flex;
    flex-direction: row;
    align-items: center;

    gap: 7px;
}

.contact-phone p {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: 7px;

    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;

    color: #4A5565;
}


/* Call us */

.contact-phone strong {
    font-weight: 700;
    color: #101828;
}


/* Phone number */

.contact-phone a {
    font-weight: 700;
    color: #101828;
    text-decoration: none;
}


/* Timing */

.contact-phone .contact-sub {
    font-weight: 400;
    color: #4A5565;
}


/* =========================================================
   EMAIL ROW
   ========================================================= */

.contact-email {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
}

.contact-email p {
    display: flex;
    align-items: center;

    gap: 9px;

    margin: 0;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;

    color: #101828;
}


/* Email label */

.contact-email strong {
    font-weight: 700;
    color: #101828;
}


/* Email address */

.contact-email p a {
    font-weight: 400;
    color: #101828;
    text-decoration: none;
}


/* =========================================================
   WHATSAPP BUTTON
   ========================================================= */

.whatsapp-btn {
    box-sizing: border-box;

    display: flex;
    flex-direction: row;
    align-items: center;

    padding: 8px 18px;
    gap: 8px;

    width: 203.56px;
    height: 40px;

    background: #FFFFFF;

    border: 1px solid #101828;
    border-radius: 4px;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;

    color: #101828;
    text-decoration: none;

    white-space: nowrap;
}


/* =========================================================
   WHATSAPP ICON
   ========================================================= */

.whatsapp-icon {
    display: block;

    width: 24.56px;
    height: 22.56px;

    flex: 0 0 24.56px;

    background-image: url('https://www.strike.money/wp-content/uploads/2026/icons/contact-whatsapp.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

    border-radius: 2px;
}

@media (max-width: 768px) {

    /* =====================================================
       CONTACT INFORMATION
       ===================================================== */

    .contact-left {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }


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

    .contact-heading {
        text-align: center;

        font-size: 28px;
        line-height: 36px;
    }


    /* =====================================================
       CONTACT INFO
       ===================================================== */

    .contact-info {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        gap: 12px;

        width: 100%;
        margin-top: 12px;
    }


    /* =====================================================
       PHONE
       ===================================================== */

    .contact-phone {
        display: flex;
        justify-content: center;
        align-items: center;

        width: 100%;
    }

    .contact-phone p {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;

        gap: 7px;

        margin: 0;

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

        text-align: center;
    }

    .contact-phone strong {
        font-size: 16px;
        line-height: 26px;
    }

    .contact-phone a {
        font-size: 16px;
        line-height: 26px;
    }

    .contact-phone .contact-sub {
        font-size: 16px;
        line-height: 26px;
    }


    /* =====================================================
       EMAIL
       ===================================================== */

    .contact-email {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        width: 100%;

        gap: 12px;
    }

    .contact-email p {
        display: flex;
        justify-content: center;
        align-items: center;

        gap: 9px;

        margin: 0;

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

        text-align: center;
    }

    .contact-email strong {
        font-size: 16px;
        line-height: 26px;
    }

    .contact-email p a {
        font-size: 16px;
        line-height: 26px;
    }


    /* =====================================================
       WHATSAPP BUTTON
       ===================================================== */

    .whatsapp-btn {
        width: 203.56px;
        height: 40px;

        padding: 8px 18px;
        gap: 8px;

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

        flex-shrink: 0;
    }
}

.send-query-btn {
    box-sizing: border-box;

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

    padding: 16px 24px;
    gap: 6px;

    width: 147px;
    height: 56px;

    background: #155DFC;
    border: none;
    border-radius: 4px;

    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 24px;

    text-align: center;
    color: #FFFFFF;

    cursor: pointer;
}

.send-query-btn span {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 24px;
    color: #FFFFFF;
}

.send-query-icon {
    display: block;

    width: 20px;
    height: 20px;

    flex: 0 0 20px;

    object-fit: contain;
}


@media (max-width: 768px) {

    .home-blog-slider {
        overflow: hidden;
        width: 100%;
    }

    .home-blog-track {
        display: flex;
        flex-wrap: nowrap;
        overflow: visible;
        transform: translateX(0);
        transition: transform 0.35s ease;
        touch-action: pan-y;
        cursor: grab;
        will-change: transform;
    }

    .home-blog-track.is-dragging {
        transition: none;
        cursor: grabbing;
    }

    .home-blog-slide {
        flex: 0 0 100%;
        width: 100%;
    }

    .home-blog-grid {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }
}


.video-placeholder {
    position: relative;
    overflow: hidden;
}

.youtube-thumbnail {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center;
    background: #000;
}

.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

@media (max-width: 768px) {

    .blog-container {
        display: flex;
        flex-direction: column;
    }

    .blog-main {
        order: 1;
    }

    .ob-section {
        order: 2;
        width: 100%;
    }

    .blog-sidebar {
        order: 3;
    }

.advt-header, .st-header{
text-align:center;
}
}
.st-list {
    width: 100%;
    border: 1px solid #E5E7EB;
    border-radius: 0;
    overflow: hidden;
    background: #ffffff;
}

.st-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 60px;
    padding: 10px 12px;
    border-bottom: 1px solid #E5E7EB;
    box-sizing: border-box;
}

.st-item:last-child {
    border-bottom: none;
}

.st-content {
    min-width: 0;
    flex: 1;
}

.st-content a {
    display: inline-block;
    margin-bottom: 4px;
    color: #1468e8;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: underline;
}

.st-content p {
    margin: 0;
    color: #45556c;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.35;
}

/* Common tag */
.st-item .tag {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

/* Analysis - blue */
.tag-blue {
    background: #dceaff;
    color: #1468e8;
}

/* Analytics - purple */
.tag-purple {
    background: #f0e1ff;
    color: #8b2be2;
}

/* Scanning - green */
.tag-green {
    background: #d9f8df;
    color: #008f3c;
}

/* Options - orange */
.tag-orange {
    background: #ffe5d2;
    color: #ed6500;
}

/* Indicators - pink */
.tag-pink {
    background: #fce1ee;
    color: #e22982;
}

/* Scanning - light green */
.tag-light-green {
    background: #d9f8df;
    color: #008f3c;
}

.ez-toc-list
{ 
list-style: none;
}






.sm-share-card {
    width: 100%;
    box-sizing: border-box;
    padding: 16px 24px;
    border: 1px solid #E5E7EB;
    background: #ffffff;
}

.sm-share-header {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 16px;
}

.sm-share-icons {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.sm-icon {
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.sm-icon img {
    display: block;
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.sm-icon-copy {
    cursor: pointer;
}

.sm-primary-button {
    width: 100%;
    margin-top: 16px;
}

.sm-primary-button img {
    display: block;
    width: 100%;
    max-width: 432px;
    height: auto;
    margin: 0 auto;
}
.pricing-toggle button:nth-child(2) span {
    color: #14A800;
}

div#ez-toc-container, .ez-toc-split-section {
    display: none;
    background: #ffffff;
    border: 1px solid #ffffff;
}

.jump-to div#ez-toc-container, .ez-toc-split-section {
    display: block!important;
    background: #ffffff;
    border: 1px solid #ffffff;
}

html {
    scroll-behavior: smooth;
}

.blog-content [id] {
    scroll-margin-top: 120px !important;
}

.blog-content h1,
.blog-content h2,
.blog-content h3,
.blog-content h4,
.blog-content h5,
.blog-content h6 {
    scroll-margin-top: 120px !important;
}

#strike-testimonials .testimonial-slider {
    overflow: hidden;
}

#strike-testimonials .testimonial-track {
    display: flex;
    will-change: transform;
}

#strike-testimonials #strike-testimonial-dots span.dot {
    display: none !important;
}


#strike-testimonials #strike-testimonial-dots span.dot {
    display: none !important;
}


/* =========================================
   STRIKE TESTIMONIAL SLIDER - LOCK CONTROL
   ========================================= */

#strike-testimonials .testimonial-track {
    transform: translate3d(
        var(--strike-testimonial-x, 0px),
        0,
        0
    ) !important;

    transition:
        transform 0.5s ease !important;
}


/* Strike Testimonials - Figma Dots */

#strike-testimonial-dots {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;

    padding: 0;
    gap: 8px;

    width: 64px;
    height: 8px;

    margin: 24px auto 0;
}


/* All dots */
#strike-testimonial-dots .dot {
    flex: none;

    width: 8px;
    height: 8px;

    padding: 0;
    margin: 0;

    border: 0;

    background: #D1D5DC;

    border-radius: 9999999px;

    cursor: pointer;

    box-sizing: border-box;
}


/* Active dot */
#strike-testimonial-dots .dot.active {
    width: 32px;
    height: 8px;

    background: #155DFC;

    border-radius: 9999999px;
}

/* =========================================================
   STRIKE AUTHOR PAGE
   ALL STYLES ARE SCOPED TO .strike-author-page
   ========================================================= */


/* =========================================================
   PAGE BASE
   ========================================================= */

.strike-author-page {
    width: 100%;
    margin: 0;
    padding: 0;

    background: #FFFFFF;

    font-family: 'Roboto', sans-serif;
    color: #101828;
}


/* =========================================================
   COMMON CONTAINER
   ========================================================= */

.strike-author-page .strike-author-page-container {
    width: 100%;
    max-width: 1280px;

    margin-left: auto;
    margin-right: auto;

    padding-left: 16px;
    padding-right: 16px;
}


/* =========================================================
   AUTHOR PROFILE SECTION
   ========================================================= */

.strike-author-page .strike-author-page-profile {
    width: 100%;

    padding-top: 56px;
    padding-bottom: 56px;

    background: #FFFFFF;
}


/* =========================================================
   AUTHOR PROFILE CARD
   ========================================================= */

.strike-author-page .strike-author-page-profile-card {
    width: 100%;

    display: flex;
    align-items: flex-start;

    gap: 40px;

    padding: 40px;

    background: #FFFFFF;

    border: 1px solid #E5E7EB;
    border-radius: 4px;
}


/* =========================================================
   PROFILE IMAGE WRAPPER
   ========================================================= */

.strike-author-page .strike-author-page-image-wrap {
    width: 240px;
    min-width: 240px;

    flex-shrink: 0;
}


/* =========================================================
   PROFILE IMAGE
   ========================================================= */

.strike-author-page .strike-author-page-image {
    display: block;

    width: 240px;
    height: 280px;

    object-fit: cover;

    border-radius: 4px;
}


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

.strike-author-page .strike-author-page-content {
    min-width: 0;
    width: 100%;

    display: flex;
    flex-direction: column;
    align-items: flex-start;

    padding-top: 2px;
}


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

.strike-author-page .strike-author-page-name {
    margin: 0 0 24px 0;
    padding: 0;

    font-family: 'Roboto', sans-serif;

    font-size: 36px;
    line-height: 48px;

    font-weight: 700;

    color: #101828;
}


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

.strike-author-page .strike-author-page-details {
    width: 100%;
    max-width: 820px;

    margin: 0;
    padding: 0;

    font-family: 'Roboto', sans-serif;

    font-size: 18px;
    line-height: 28px;

    font-weight: 400;

    color: #4A5565;
}


/* =========================================================
   AUTHOR DETAILS - GENERAL ELEMENTS
   ========================================================= */

.strike-author-page .strike-author-page-details p {
    margin: 0;

    font-size: 18px;
    line-height: 28px;

    color: #4A5565;
}


.strike-author-page .strike-author-page-details p + p {
    margin-top: 16px;
}


/* =========================================================
   AUTHOR DETAILS - HEADINGS
   ========================================================= */

.strike-author-page .strike-author-page-details h2,
.strike-author-page .strike-author-page-details h3,
.strike-author-page .strike-author-page-details h4 {
    margin-top: 24px;
    margin-bottom: 10px;

    font-family: 'Roboto', sans-serif;

    color: #101828;

    font-weight: 700;
}


.strike-author-page .strike-author-page-details h2 {
    font-size: 24px;
    line-height: 34px;
}


.strike-author-page .strike-author-page-details h3 {
    font-size: 20px;
    line-height: 30px;
}


.strike-author-page .strike-author-page-details h4 {
    font-size: 18px;
    line-height: 28px;
}


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

.strike-author-page .strike-author-page-details > h2:first-child,
.strike-author-page .strike-author-page-details > h3:first-child,
.strike-author-page .strike-author-page-details > h4:first-child {
    margin-top: 0;
}


/* =========================================================
   AUTHOR DETAILS - LISTS
   ========================================================= */

.strike-author-page .strike-author-page-details ul,
.strike-author-page .strike-author-page-details ol {
    margin-top: 0;
    margin-bottom: 16px;

    padding-left: 24px;
}


.strike-author-page .strike-author-page-details li {
    margin-bottom: 6px;

    font-size: 18px;
    line-height: 28px;

    color: #4A5565;
}


/* =========================================================
   AUTHOR DETAILS - STRONG
   ========================================================= */

.strike-author-page .strike-author-page-details strong {
    color: #101828;

    font-weight: 700;
}


/* =========================================================
   AUTHOR DETAILS - LINKS
   ========================================================= */

.strike-author-page .strike-author-page-details a {
    color: #155DFC;

    text-decoration: none;
}


.strike-author-page .strike-author-page-details a:hover {
    text-decoration: underline;
}


/* =========================================================
   SOCIAL MEDIA
   ========================================================= */

.strike-author-page .strike-author-page-social {
    display: flex;
    align-items: center;

    gap: 10px;

    margin-top: 28px;
}


/* =========================================================
   SOCIAL LINK
   ========================================================= */

.strike-author-page .strike-author-page-social-link {
    width: 40px;
    height: 40px;

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

    padding: 0;

    background: #FFFFFF;

    border: 1px solid #E5E7EB;
    border-radius: 4px;

    text-decoration: none;

    transition:
        border-color 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


/* =========================================================
   SOCIAL ICON
   ========================================================= */

.strike-author-page .strike-author-page-social-link img {
    display: block;

    width: 24px;
    height: 24px;

    object-fit: contain;

    margin: 0;
    padding: 0;
}


/* =========================================================
   SOCIAL HOVER
   ========================================================= */

.strike-author-page .strike-author-page-social-link:hover {
    border-color: #155DFC;

    transform: translateY(-1px);

    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}


/* =========================================================
   RELATED ARTICLES SECTION
   ========================================================= */

.strike-author-page .strike-author-page-related {
    width: 100%;

    padding-top: 56px;
    padding-bottom: 80px;

    background: #F9FAFB;

    border-top: 1px solid #E5E7EB;
}


/* =========================================================
   RELATED HEADER
   ========================================================= */

.strike-author-page .strike-author-page-related-header {
    width: 100%;

    margin-bottom: 32px;
}


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

.strike-author-page .strike-author-page-related-header h2 {
    margin: 0;
    padding: 0;

    font-family: 'Roboto', sans-serif;

    font-size: 30px;
    line-height: 42px;

    font-weight: 700;

    color: #101828;
}


/* =========================================================
   RELATED ARTICLES GRID
   ========================================================= */

.strike-author-page .strike-author-page-related-grid {
    width: 100%;

    display: grid;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 24px;
}


/* =========================================================
   ARTICLE CARD
   ========================================================= */

.strike-author-page .strike-author-page-post-card {
    width: 100%;
    min-width: 0;

    background: #FFFFFF;

    border: 1px solid #E5E7EB;
    border-radius: 4px;

    overflow: hidden;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


/* =========================================================
   ARTICLE CARD HOVER
   ========================================================= */

.strike-author-page .strike-author-page-post-card:hover {
    transform: translateY(-2px);

    box-shadow:
        0 4px 6px rgba(0, 0, 0, 0.05),
        0 10px 15px rgba(0, 0, 0, 0.06);
}


/* =========================================================
   ARTICLE LINK
   ========================================================= */

.strike-author-page .strike-author-page-post-link {
    display: flex;
    flex-direction: column;

    width: 100%;
    height: 100%;

    color: inherit;

    text-decoration: none;
}


/* =========================================================
   ARTICLE IMAGE
   ========================================================= */

.strike-author-page .strike-author-page-post-image {
    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background: #F3F4F6;
}


/* =========================================================
   ARTICLE IMAGE IMG
   ========================================================= */

.strike-author-page .strike-author-page-post-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    margin: 0;
    padding: 0;

    transition: transform 0.3s ease;
}


/* =========================================================
   ARTICLE IMAGE HOVER
   ========================================================= */

.strike-author-page
.strike-author-page-post-card:hover
.strike-author-page-post-image img {
    transform: scale(1.02);
}


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

.strike-author-page .strike-author-page-post-content {
    width: 100%;

    min-height: 190px;

    display: flex;
    flex-direction: column;

    padding: 20px;
}


/* =========================================================
   ARTICLE CATEGORY
   ========================================================= */

.strike-author-page .strike-author-page-post-category {
    display: block;

    margin-bottom: 10px;

    font-family: 'Roboto', sans-serif;

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

    font-weight: 600;

    color: #155DFC;
}


/* =========================================================
   ARTICLE TITLE
   ========================================================= */

.strike-author-page .strike-author-page-post-content h3 {
    display: -webkit-box;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;

    overflow: hidden;

    margin: 0;
    padding: 0;

    font-family: 'Roboto', sans-serif;

    font-size: 18px;
    line-height: 28px;

    font-weight: 700;

    color: #101828;
}


/* =========================================================
   READ ARTICLE
   ========================================================= */

.strike-author-page .strike-author-page-post-read {
    display: inline-flex;
    align-items: center;

    margin-top: auto;
    padding-top: 20px;

    font-family: 'Roboto', sans-serif;

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

    font-weight: 700;

    color: #155DFC;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1023px) {


    /* PROFILE */

    .strike-author-page .strike-author-page-profile {
        padding-top: 40px;
        padding-bottom: 40px;
    }


    .strike-author-page .strike-author-page-profile-card {
        gap: 32px;

        padding: 32px;
    }


    /* IMAGE */

    .strike-author-page .strike-author-page-image-wrap {
        width: 200px;
        min-width: 200px;
    }


    .strike-author-page .strike-author-page-image {
        width: 200px;
        height: 240px;
    }


    /* NAME */

    .strike-author-page .strike-author-page-name {
        font-size: 32px;
        line-height: 44px;
    }


    /* DETAILS */

    .strike-author-page .strike-author-page-details,
    .strike-author-page .strike-author-page-details p,
    .strike-author-page .strike-author-page-details li {
        font-size: 17px;
        line-height: 27px;
    }


    /* RELATED */

    .strike-author-page .strike-author-page-related {
        padding-top: 40px;
        padding-bottom: 64px;
    }


    /* TWO COLUMNS */

    .strike-author-page .strike-author-page-related-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {


    /* CONTAINER */

    .strike-author-page
    .strike-author-page-container {
        padding-left: 16px;
        padding-right: 16px;
    }


    /* PROFILE */

    .strike-author-page .strike-author-page-profile {
        padding-top: 32px;
        padding-bottom: 32px;
    }


    /* PROFILE CARD */

    .strike-author-page .strike-author-page-profile-card {
        flex-direction: column;
        align-items: center;

        gap: 24px;

        padding: 24px 20px;

        text-align: center;
    }


    /* IMAGE */

    .strike-author-page .strike-author-page-image-wrap {
        width: 160px;
        min-width: 160px;
    }


    .strike-author-page .strike-author-page-image {
        width: 160px;
        height: 190px;

        margin-left: auto;
        margin-right: auto;
    }


    /* CONTENT */

    .strike-author-page .strike-author-page-content {
        width: 100%;

        align-items: center;

        padding-top: 0;
    }


    /* NAME */

    .strike-author-page .strike-author-page-name {
        width: 100%;

        margin-bottom: 16px;

        font-size: 28px;
        line-height: 38px;

        text-align: center;
    }


    /* DETAILS */

    .strike-author-page .strike-author-page-details {
        width: 100%;

        max-width: 100%;

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

        text-align: left;
    }


    .strike-author-page .strike-author-page-details p {
        font-size: 16px;
        line-height: 26px;
    }


    .strike-author-page .strike-author-page-details li {
        font-size: 16px;
        line-height: 26px;
    }


    .strike-author-page .strike-author-page-details h2 {
        font-size: 22px;
        line-height: 32px;
    }


    .strike-author-page .strike-author-page-details h3 {
        font-size: 19px;
        line-height: 29px;
    }


    .strike-author-page .strike-author-page-details h4 {
        font-size: 17px;
        line-height: 27px;
    }


    /* SOCIAL */

    .strike-author-page .strike-author-page-social {
        justify-content: center;

        margin-top: 24px;
    }


    /* RELATED SECTION */

    .strike-author-page .strike-author-page-related {
        padding-top: 40px;
        padding-bottom: 56px;
    }


    /* RELATED HEADING */

    .strike-author-page .strike-author-page-related-header {
        margin-bottom: 24px;
    }


    .strike-author-page .strike-author-page-related-header h2 {
        font-size: 24px;
        line-height: 34px;
    }


    /* ONE COLUMN */

    .strike-author-page .strike-author-page-related-grid {
        grid-template-columns: 1fr;

        gap: 16px;
    }


    /* POST CONTENT */

    .strike-author-page .strike-author-page-post-content {
        min-height: 0;

        padding: 16px;
    }


    /* POST TITLE */

    .strike-author-page .strike-author-page-post-content h3 {
        font-size: 18px;
        line-height: 28px;
    }


}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {


    .strike-author-page .strike-author-page-profile-card {
        padding: 20px 16px;
    }


    .strike-author-page .strike-author-page-image-wrap {
        width: 140px;
        min-width: 140px;
    }


    .strike-author-page .strike-author-page-image {
        width: 140px;
        height: 170px;
    }


    .strike-author-page .strike-author-page-name {
        font-size: 26px;
        line-height: 36px;
    }


}



/* =========================================
   ELITE COLUMN - FIGMA HIGHLIGHT
   ========================================= */

/* Elite column header */
.comparison thead th:nth-child(4) {
    background-color: #F0F7FF;
}

/* Elite column cells */
.comparison tbody tr:not(.section) td:nth-child(4) {
    background-color: #F0F7FF;
}

/* Keep section/category rows unchanged */
.comparison tbody tr.section td {
    background-color: #E8F0FF;
}

#strike-testimonials .testimonial-avatar {
    width: 56px;
    height: 56px;
    min-width: 56px;
    max-width: 56px;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}


.sticky-signup {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: #fff;
    padding: 10px 16px;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.12);
    text-align: center;
}

.sticky-signup a {
    display: block;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    padding: 12px 20px;
    text-decoration: none;
    border-radius: 6px;
}




.sticky-footer-cta {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 99999;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 6px 0;
    gap: 16px;

   
    font-family: 'Roboto', sans-serif;
}

body {
    padding-bottom: 60px;
}

/* =========================================================
   CATEGORY PAGE FILTER LINKS
   Make category <a> links look exactly like Blog buttons
========================================================= */

.aa-filters .aa-filter {
    text-decoration: none !important;
    color: #000;
}

.aa-filters .aa-filter:hover {
    text-decoration: none !important;
    color: #000;
}

.aa-filters .aa-filter.active {
    text-decoration: none !important;
    color: #fff;
}

.aa-filters .aa-filter.active:hover {
    text-decoration: none !important;
    color: #fff;
}


    .trust-card h4 {
        font-size: 20px;
        font-weight: 700;
        color: #101828;
    }


    .partner-box a {
    color: #4A5565;
    font-weight: 700;
    text-decoration: none;
}

.testimonial-track {
    display: flex;
    flex-wrap: nowrap;
}

.testimonial-card {
    flex: 0 0 auto;
}

.faq-heading {
    margin: 0;
    padding: 0;
    width: 100%;
}

.stat h3 {
color:white;
}

.faq-section .faq-answer {
  display: none;
}

.faq-section .faq-item.active .faq-answer {
  display: block;
}


.st-header .sidebar-label {
  font-size: 28px;
  font-weight: 700;
  line-height: 42px;
  color: #101828;
  margin: 0;
}




@font-face {
    font-family: 'RobotoLightAbout';
    src: url('/wp-content/uploads/2026/fonts/Roboto-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

.about-page .about-hero-subtitle {
    font-family: 'RobotoLightAbout', sans-serif;
    font-weight: 300;
    font-style: normal;
}


.contact-right {
    width: 560px;
    max-width: 100%;
    box-sizing: border-box;
    padding: 32px;
    background: #f9fafb;
    border-radius: 10px;
}

.contact-right .form-heading {
    margin: 0 0 0px;
    font-size: 30px;
    line-height: 44px;
    font-weight: 700;
}

.contact-form .wpcf7-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.contact-form .wpcf7-form > p {
    margin: 0;
    padding: 0;
}

.contact-form label,
.contact-form br {
    display: none;
}

.contact-form .wpcf7-form-control-wrap {
    display: block;
}

.contact-form input {
    width: 100%;
    height: 46px;
    box-sizing: border-box;
    padding: 12px;
}

.contact-form textarea {
    width: 100%;
    height: 160px;
    box-sizing: border-box;
    padding: 12px;
}


@media (max-width: 767px) {
    .connect-details .connect-label,
    .connect-details .connect-value {
        display: block;
    }

    .connect-details .connect-value {
        margin-top: 4px;
    }

    .strike-right .search-icon{
      display:none;
    }

}