.bg-glow{
  position: fixed;
  pointer-events: none;
  inset: auto auto 10% -10%;
  width: 45vw;
  height: 45vw;
  filter: blur(100px);
  opacity: .22;
  z-index: -1;
  border-radius: 999px;
}
.bg-glow-a{ background: conic-gradient(from 180deg at 50% 50%, #4f46e5, #22c55e, transparent); left: -12vw; bottom: -8vw; }
.bg-glow-b{ background: radial-gradient(closest-side, #eab308, transparent 70%); right: -15vw; bottom: -10vw; }
.main-content{background:#010014;}
/* Layout */
.containerblog{
    max-width:2000px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10%;
    padding-right: 10%;
}

/* --- Hero --------------------------------------------------------------- */
.hero-header{
  padding: clamp(48px, 8vw, 96px) 0 24px;
  text-align: center;
  display: flex;
padding: var(--spacing-9xl, 96px) 0 var(--spacing-11xl, 160px) 0;
flex-direction: column;
align-items: center;
gap: var(--spacing-7xl, 64px);
align-self: stretch;background: #070D1B;

}

.eyebrow{
  display: inline-block;
  font-weight: 600;
  color:#CECFD2;
  font-size: .82rem;
  margin-bottom: 10px;
}

.hero-title{
  margin: 0 0 10px 0;
  font-weight: 800;
  line-height: 1.1;
  font-size: clamp(28px, 4.2vw, 44px);
}

.hero-title .accent{color: #FFC750;}

.hero-subtitle{color: var(--Colors-Text-text-tertiary_on-brand, #94969C);text-align: center;font-family: Outfit;font-size: 16px;
    font-style: normal;font-weight: 400;line-height: 30px;}

/* Subscribe form */
.subscribe{
  margin-top: 28px;
}

.input-group{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px;
}
.input-group input{
  width: min(58vw, 360px);
  min-width: 220px;
  outline: none;
  color: var(--text);
  padding: 12px 16px;
  font-size: 0.98rem;
  border-radius: var(--radius-md, 16px);
    border: 1px solid var(--Colors-Border-border-primary, #333741);
    background: var(--Colors-Background-bg-primary, #0C111D);
    box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
}

.input-group input::placeholder{ color: #74829c; }

.btn-primary{
  border: none;
  padding: 12px 18px;
  border-radius: 999px;
  background: var(--primary);
  color: white;
  font-weight: 600;
  cursor: pointer;
  transition: transform .06s ease, background .15s ease;
  border-radius: var(--radius-md, 16px);
    border: 1px solid var(--Component-colors-Components-Buttons-Primary-button-primary-border, #1958C6);
    background: #0045FF;
    box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
}
.btn-primary:hover{ background: var(--primary-600); }
.btn-primary:active{ transform: translateY(1px); }
.btn-primary:focus-visible{
  outline: 3px solid var(--focus);
  outline-offset: 2px;
  border-radius: 999px;
}

.privacy{
color: var(--Colors-Text-text-tertiary_on-brand, #94969C);
font-family: Outfit;font-size: 14px;line-height: 20px; /* 142.857% */
}
.privacy a{ color: var(--Colors-Text-text-tertiary_on-brand, #94969C); text-underline-offset: 2px; }

.featured-card{
  margin-top: calc(var(--pull-up) * -1);
  position: relative;     /* ensures it paints above the hero */
  z-index: 2;
  top:-100px;
}

/* keep your existing styles; just repeating key ones here */
.image-wrap{
  border-radius: 24px;
  overflow: hidden;
}

.image-wrap img{
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  /* optional: nudge which part stays visible */
  object-position: 66% 32%;  /* adjust as needed */
      border-radius: var(--radius-2xl, 32px);
    height: 450PX;
}

.corner-link{
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: rgba(15,23,42,.75);
  border: 1px solid rgba(255,255,255,.08);
  font-size: 18px;
  line-height: 1;
}

.card-body{
  padding: 18px 2px 0;
}

.byline{
  color: var(--muted);
  font-size: .95rem;
  margin: 0 0 6px 0;
}
.byline .author{ color: #cbd5e1; font-weight: 600; }
.byline .dot{ margin: 0 .5ch; opacity: .7; }

.post-title{display: flex;
  margin: 0 0 8px 0;
  font-size: clamp(22px, 3vw, 28px);
  line-height: 1.25;
  font-weight: 800;
  justify-content: space-between;
    align-items: center;
  
}

.excerpt{
  color: var(--muted);
  margin: 0 0 14px 0;
}

/* Tags */
.tags{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.tags a{
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: .85rem;
  text-decoration: none;

}

/* Footer (optional) */
.footer{
  color: #7b8aa5;
  font-size: .9rem;
  padding-bottom: 48px;
  margin-top: 24px;
}

/* Accessibility helpers */
.sr-only{
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden;
  clip: rect(1px,1px,1px,1px);
  white-space: nowrap;
}
/* --- Posts grid --------------------------------------------------------- */
.posts { margin-top: 32px; }

.posts-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 28px;
}

/* base card */
.post-card{
  background: transparent;
  color: var(--text);
}

/* small = quarter width; wide = half width */
.post-card.small{ grid-column: span 3; }
.post-card.wide { grid-column: span 6; }

.thumb{
  position: relative;
  display: block;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: #0a1227;
  box-shadow: var(--shadow-lg);
}
.thumb img{
  width: 100%;
  display: block;
  aspect-ratio: 16/10;              /* smaller cards a bit squarer */
  object-fit: cover;
  object-position: 50% 50%;
}
.post-card.wide .thumb img{
  aspect-ratio: 16/9;               /* wide cards */
}

.link-corner{
  position: absolute;
  right: 10px; top: 10px;
  width: 32px; height: 32px;
  display: grid; place-items: center;
  border-radius: 999px;
  background: rgba(15,23,42,.75);
  border: 1px solid rgba(255,255,255,.08);
  font-size: 16px;
}
.link-co{ 
  width: 32px; height: 32px;
  font-size: 16px;
}
.meta{ padding: 12px 4px 0; }
.byline{ color: var(--muted); font-size: .9rem; margin: 0 0 6px; }
.byline .author{ color: #cbd5e1; font-weight: 600; }
.byline .dot{ margin: 0 .5ch; opacity: .65; }

.title{
  display: flex;
  margin: 0 0 6px;
  font-size: clamp(16px, 1.6vw, 20px);
  font-weight: 800;
  line-height: 1.3;
  overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}
.title a{ color: inherit; text-decoration: none; font-size:17px; }
.title a:hover{  color: #0045FF;transition: all 0.3s ease;}

.excerpt{ color: var(--muted); font-size: .95rem; color: var(--colors-text-text-tertiary-600, #94969C);
text-overflow: ellipsis; overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* Limits the text to a maximum of 2 lines */
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;}

/* reuse tag style with slight tweaks for small cards */
.post-card .tags{ gap: 8px; }
.post-card .tags a{
  font-size: .82rem;
  padding: 6px 12px;
}

/* --- Pagination --------------------------------------------------------- */
.pager{
  padding-bottom: 20PX;
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  gap: 10px;
}

.pager a{ color: #c5d7ff; text-decoration: none; }
.pager a:hover{ text-decoration: underline; }

.pager-pages{
  list-style: none;
  display: flex;
  gap: 10px;
  padding: 0;
  margin: 0;
  align-items: center;
}
.page{
  display: grid;
  place-items: center;
  width: 36px; height: 36px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.03);
}
.page.current{
  background: rgba(37,99,235,.18);
  border-color: rgba(37,99,235,.35);
  color: #e8efff;
  font-weight: 700;
}

.pager .dots{ padding: 0 4px; }
.blog-content table {
    width: 93% !important;
    border-collapse: separate !important;
    border-radius: 10px; /* Rounded corners for the table */
}

/* Styling for table rows and cells */
.blog-content table th,
.blog-content table td {
    border: 0.6px solid #ffffff; /* White border for cells */
    padding: 15px; /* Inner cell padding */
    color: #ffffff; /* Text color */
    font-size: 16px;
    text-align: left;
    border-radius: 5px; /* Rounded corners for cells */
}
.pager-moblie{display: none;  }
/* Table header styling */
.blog-content table th {
    font-weight: bold;
    text-transform: uppercase;
}
.policy-container{
      max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10%;
    padding-right: 10%;
      color:var(--text);
    }

    /* Tabs on top */
    .policy-tabs{
      display:flex; gap:10px; align-items:center; flex-wrap:wrap;padding:14px 16px; background:#0C111D; border-bottom:1px solid var(--line);
      position:sticky; top:64px; z-index:5;    justify-content: center;max-width: 2000px;margin-left: auto;margin-right: auto;padding-left: 10%;padding-right: 10%;
    }
    .policy-hero{ text-align:center; padding:44px 0 28px; }
    .policy-date{ color:var(--muted); font-size:.9rem; margin:0 0 8px; }
    .policy-title{ margin:0 0 12px; font-size: clamp(28px, 3.5vw, 44px); font-weight:800; letter-spacing:.2px; }
    .policy-intro{ margin:0 auto; color:var(--muted); max-width:860px; line-height:1.7; }

    /* Body */
    .policy-body{display: flex;flex-direction: column; margin: 28px auto 0;line-height:1.85; color:#D6DCF2;}
    .policy-body h2, .policy-body h3{color:var(--text); margin:28px 0 10px; font-weight:800;}
    .policy-body p{ margin:10px 0; color:#C9D2EA; }
    .policy-body ul{ margin:10px 0 14px 1.2rem; color:#C9D2EA; }
    .policy-body strong{ color:#F2F6FF; }
    .policy-body hr{ border:0; height:1px; background:var(--line); margin:18px 0; }
    .policy-body a{ color:var(--accent); text-decoration:underline; text-underline-offset:2px; }
    .policy-body blockquote{ margin:16px 0; padding:12px 14px; border-left:3px solid var(--accent); background:#0b1733; border-radius:6px; }
.contact-cta{padding: 28px 0;}
.cta-card{
  position: relative;
  min-height: 190px;
  background: var(--card);
  border: 1px solid var(--line);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;gap: 20px;padding: 28px 28px 28px 42px;background-image: url("/assets/images/backgrounds/contactt.png");
padding-left: 10%;
    padding-right: 10%;
    background-size: cover;
}


/* text */
.cta-text{ position:relative; z-index:1; }
.cta-text h3{
  margin:0 0 8px;
  font-size: clamp(22px, 3vw, 34px);
  font-weight: 800;
  letter-spacing:.2px;
  color:#fff;               /* subtle, like screenshot */
  text-shadow: 0 1px 0 rgba(255,255,255,.02);
}
.cta-text h3 span{ color:#fff; } /* same tone as heading */
.cta-text p{
  margin:0; color:var(--text); opacity:.85;
  max-width: 640px;
}

/* button */
.cta-btn{
  position:relative; z-index:1;
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; padding:0 20px;
 color: var(--colors-text-text-primary-900, #F5F5F6);
 font-weight:700; text-decoration:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),0 6px 18px rgba(255,199,80,.25);
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
  border-radius: 27px;
  border: 1px solid #A47B24;
  background: #FFC750;

/* Shadows/shadow-xs */
box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
}
.cta-btn:hover{
  filter: brightness(1.07);
  transform: translateY(-1px);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.45),
    0 10px 24px rgba(255,199,80,.28);
}
:root{
  --bg:#0a0f1f;
  --panel:#0b0f1e;
  --text:#eef1ff;
  --muted:#9aa6bf;
  --line:rgba(255,255,255,.08);
  --chip:#151a2a;
  --chip-active:#f6c24a;
}

/* Hero */
.help-hero{
  background: linear-gradient(180deg,#121826 0%, #0b0f1e 100%);
  border-bottom:1px solid var(--line);
}
.help-hero__inner{
max-width:1100px; margin:0 auto; padding:56px 20px 60px;color:var(--text);    max-width: 2300px;margin-left: auto;margin-right: auto;padding-left: 10%;padding-right: 10%;background: #0C111D;}
.help-hero .title{
  margin:0 0 10px; font-size: clamp(28px, 5vw, 48px); font-weight:800; letter-spacing:.2px;
}
.help-hero .sub{ color:#94969C; max-width:720px; margin:0; }

/* Two-column layout */
.faq-wrap{ background:#010014;;max-width:2300px;margin-left: auto;margin-right: auto;padding-left: 10%;padding-right: 10%; }
.faq-container{ color:var(--text);display:grid; grid-template-columns: 1fr 1.4fr; gap:48px;padding-bottom: 10%;padding: 35px 0px;}
.faq-left .left-title{ font-size:28px; margin:6px 0 8px; font-weight:800; }
.faq-left .left-sub{ color:#94969C; max-width:560px; }
.faq-left .left-sub a{ color:#7cb7ff; }

/* Chips */
.chips{ list-style:none; margin:22px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px; }
.chip{ display: flex;
padding: var(--spacing-lg, 12px) 18px;
justify-content: center;
align-items: center;
gap: var(--spacing-sm, 6px);
align-self: stretch;border-radius: var(--radius-md, 16px);
border: 1px solid var(--Component-colors-Components-Buttons-Secondary-button-secondary-border, #333741);
background: var(--Component-colors-Components-Buttons-Secondary-button-secondary-bg, #161B26);
box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);color:#fff;font-family: Outfit;

}
.chip:hover{ filter:brightness(1.08); }
.chip.active{ background:var(--chip-active); color:#141821; border-color:transparent; }

/* Accordion */
.accordion{ display:flex; flex-direction:column; gap:10px; }

.acc-head{
  width:100%; text-align:left; background:transparent; border:0; color:var(--text);
  padding:16px 18px; display:flex; align-items:center; justify-content:space-between; cursor:pointer;
  font-weight:700;
}
.acc-q{ padding-right:18px;color: var(--colors-text-text-primary-900, #F5F5F6);

/* Text lg/Medium */
font-family: Outfit;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 28px; /* 155.556% */ }
.acc-icon{
  width:28px; height:28px; border-radius:999px; border:1px solid var(--line);
  display:grid; place-items:center; color:#cbd6ff;
}
.icon-minus{ display:none; }
.acc-item.open .icon-plus{ display:none; }
.acc-item.open .icon-minus{ display:block; }

.acc-body{
  display:none; padding:0 18px 16px;  line-height:1.75;color: var(--colors-text-text-tertiary-600, #94969C);
  font-family: Outfit;font-size: 16px;font-style: normal;font-weight: 400;line-height: 24px; /* 150% */}
.acc-item.open .acc-body{ display:block; }
.acc-body h2{color: var(--colors-text-text-tertiary-600, #94969C)!important; }
.contact-block{ padding: 64px 0 48px; background: #010014;max-width: 2300px;
    margin-left: auto;
    margin-right: auto;     padding-left: 10%;
    padding-right: 10%; }
.cb-container{     max-width: 2300px;
    margin-left: auto;
    margin-right: auto;     padding-left: 10%;
    padding-right: 10%;margin: 0 auto; padding: 0 24px; color: var(--text); }

/* Headings */
.cb-eyebrow{ color:#CECFD2; margin:0 0 6px; font-size:.95rem; }
.cb-title{ margin:0 0 10px; font-size: clamp(28px, 4.5vw, 48px); font-weight:800; letter-spacing:.2px; }
.cb-sub{ margin:0 0 28px; color:#94969C; }

/* Grid */
.cb-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

/* Card */
.cb-card{
  position:relative;display:flex;gap:16px;
  align-items:flex-start;padding:28px;
  text-decoration:none;color:inherit;min-height: 200px;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;border-radius: 16px;background: #070D1B;}
.cb-card:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 10px 30px rgba(0,0,0,.28) inset, 0 8px 24px rgba(0,0,0,.18);
}

/* Icon */
.cb-icon{
  width:44px; height:44px; border-radius: var(--radius-lg, 20px);background: #0045FF;
display:grid; place-items:center;color:#fff; flex:0 0 44px;
}

/* Body */
.cb-body{ display:flex; flex-direction:column; gap:6px; }
.cb-card-title{ font-size:18px; margin:0; font-weight:700; color:var(--text); }
.cb-card-sub{ margin:0; color:var(--muted); }
.cb-email{
  margin-top:14px;
  font-weight:700;
  color:#e8edff;
  word-break: break-all;
}
/* --- Layout: center and size like the mock --- */
.login-section{
  background:#010014;              /* page bg */
  color:#eaf0ff;
  padding:60px 0 80px;
}

.login-section .row{               /* stack title + form vertically */
  flex-direction:column;
  align-items:center;
  gap:24px;
}

.login-form-container form{
  max-width:640px;                 /* <<< main form width */
  margin:0 auto;
}

/* --- Headings --- */
.brand-title{
  margin:0 0 8px;
  text-align:center;
  font-weight:800;
  font-size:clamp(24px,4vw,32px);
}
.brand-description{
  margin:0 auto 6px;
  text-align:center;
  color:var(--colors-text-text-tertiary-600, #94969C);
  max-width:700px;
}

/* --- Labels --- */
.form-label{
  display:block;
  margin:14px 0 8px;

  font-size:12px;color: var(--colors-text-text-secondary-700, #CECFD2);

/* Text sm/Medium */
font-family: Outfit;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 20px; /* 142.857% */
}

/* --- Unified field style (inputs/select/textarea/file) --- */
.form-control,
select.form-control,
textarea.form-control,
input[type="file"].form-control{
border-radius: var(--radius-md, 16px);
border: 1px solid var(--Colors-Border-border-primary, #333741);
background: var(--Colors-Background-bg-primary, #0C111D);

/* Shadows/shadow-xs */
box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  color:#eaf0ff;
  padding:10px 14px;
  outline:none;
  transition:border-color .15s, box-shadow .15s, background .15s;
}

.form-control::placeholder{ color:#aab4cf; opacity:.85; }

.form-control:focus,
select.form-control:focus,
textarea.form-control:focus,
input[type="file"].form-control:focus{
  border-color:#0045FF;
  background:#101a33;
  box-shadow:0 0 0 3px rgba(37,99,255,.25);
}

/* Select: custom arrow & padding */
select.form-control{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%23aab4cf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:36px;
}

/* Textarea height & look */
textarea.form-control{
  min-height:180px;
  resize:vertical;
}

/* File input: better spacing */
input[type="file"].form-control{
  padding:8px 10px;
  height:auto;
}
.mission{
  padding: 56px 0 64px;
}
.mission-wrap{
    max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10%;
    padding-right: 10%;
}

/* Head area */
.mission-head{
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 48px;
  align-items: center;
  margin-bottom: 36px;
}
.mission-title{
  margin: 0;
  font-weight: 800;
  line-height: 1.2;
  font-size: 48px;
  letter-spacing: .2px;
}
.mission-title .accent{ color: #FFC750; }

.mission-right .lead{margin: 0;opacity: .8;color: var(--colors-text-text-tertiary-600, #94969C);font-family: Outfit;font-size: 20px;font-style: normal;font-weight: 400;line-height: 30px;
}

/* Stats bar */
.mission-stats{
  margin-top: 28px;
  background: var(--panel);
     border-radius: var(--radius-2xl, 32px);
    background: #070D1B;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding: 36px 28px;
}
.stat{
  text-align: center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.story{
  padding: 56px 0 48px;
}
.story-wrap{
    max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
     padding-left: 10%;
    padding-right: 10%;
}

/* Header */
.story-eyebrow{
  margin:0 0 6px;
  color:var(--muted);
  font-size:.95rem;
}
.story-title{
  margin:0 0 10px;
  font-weight:800;
  font-size:clamp(28px, 4.6vw, 38px);
  letter-spacing:.2px;
}
.story-sub{
  margin:0 0 28px;
  color:#94969C;
  font-size:1.05rem;
}

/* Body */
.story-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
}
.story-col p{
  line-height:1.9;
  color:#94969C;
  margin: 0 0 16px;
}
.careers{ padding: 56px 0; }
.careers__wrap{
    max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
     padding-left: 10%;
    padding-right: 10%;

  display:grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 56px;
}

/* Left column */
.careers__title{
  margin:0 0 10px; font-weight:800; font-size: clamp(26px, 4.5vw, 40px);
}
.careers__sub{ color:var(--muted); line-height:1.9; margin:0; }

/* Right column list */
.careers__list{ border-top:1px solid var(--line); }
.job{
  padding: 22px 0;
  border-bottom:1px solid var(--line);
}
.job__head{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.job__role{ margin:0; font-size:18px; font-weight:800; }
.job__desc{ color: var(--colors-text-text-tertiary-600, #94969C);font-family: Outfit;font-size: 16px;font-style: normal;font-weight: 400;line-height: 24px; }
/* Meta */
.job__meta{
  list-style:none; padding:0; margin:0; display:flex; gap:28px; color:#c8d0ee;margin-top: 10px;
}
.meta-item{ display:flex; align-items:center; gap:8px; font-weight:600; color: #94969C;}
.meta-item svg{
  width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2;
}

/* Pills */
.tag{display: flex ;align-items: center;
  --c: var(--blue);
  color:#0b0f1e; background:var(--c);
  padding:4px 10px; border-radius:999px; font-weight:800; font-size:12px;gap: 6px;
 
}
.tag--blue   { border-radius: var(--radius-full, 9999px);border: 1px solid var(--Component-colors-Utility-Blue-utility-blue-200, #1849A9);background: var(--Component-colors-Utility-Blue-utility-blue-50, #102A56); color:#84CAFF;}
.tag--purple { border-radius: var(--radius-full, 9999px);border: 1px solid var(--Component-colors-Utility-Pink-utility-pink-200, #9E165F);background: var(--Component-colors-Utility-Pink-utility-pink-50, #4E0D30);color:#FAA7E0; }
.tag--green  { border-radius: var(--radius-full, 9999px);border: 1px solid var(--Component-colors-Utility-Success-utility-success-200, #085D3A);background: var(--Component-colors-Utility-Success-utility-success-50, #053321);color:#75E0A7; }
.tag--slate  { border-radius: var(--radius-full, 9999px);border: 1px solid var(--Component-colors-Utility-Indigo-utility-indigo-200, #2D31A6);background: var(--Component-colors-Utility-Indigo-utility-indigo-50, #1F235B);  color:#A4BCFD; }
.tag--orange { border-radius: var(--radius-full, 9999px);border: 1px solid var(--Component-colors-Utility-Orange-utility-orange-200, #932F19);background: var(--Component-colors-Utility-Orange-utility-orange-50, #511C10); color: #F7B27A;}
.guide-section{
  padding:72px 16px 56px;
}

.guide-section .container{
  max-width: 980px;
  margin: 0 auto;
}

.guide-section h1{
  margin:0 0 8px;
  font-weight:800;
  letter-spacing:.2px;
  line-height:1.15;
  color:var(--text);
  font-size: 34px; /* overridden by your inline 25px; you can remove inline style */
}

.guide-section .subhead{
  color:var(--muted);
  margin-bottom:28px;
  font-size:14px;
}

/* Search */
.search-bara{
  display:flex;
  justify-content:center;
  margin: 8px 0 28px;
}
.search-box{
  position:relative;
  width:100%;
  max-width:720px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:999px;
  box-shadow: var(--shadow);
}
.search-box input{
  width:100%;
  padding:14px 44px 14px 44px;
  background:transparent;
  border:0;
  color:var(--text);
  outline:none;
  font-size:14px;
}
.search-box .search-icon{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:var(--muted);
  pointer-events:none;
}
.search-box:focus-within{
  border-color: rgba(255,177,1,.45);
  box-shadow: 0 0 0 4px rgba(255,177,1,.08), var(--shadow);
}

/* List */
.list-group-modern{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap:14px;
}
@media (max-width: 820px){
  .list-group-modern{ grid-template-columns: 1fr; }
}

.list-item{
    transition: transform .15s 
ease, border-color .15s 
ease, box-shadow .2s 
ease;
    border-radius: 16px;
    background: #0C111D;
    flex-direction: column;
    align-items: center;
    display: flex;
    padding-top: 12px;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    flex-shrink: 0;
    align-self: stretch;
}

.list-item:hover{
  transform: translateY(-2px);
  border-color: rgba(255,177,1,.35);
  box-shadow: 0 10px 28px rgba(0,0,0,.45), 0 0 0 3px rgba(255,177,1,.06);
}
.list-link{    color: #94969C;
    text-align: center;
    font-family: Outfit;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    padding: 14px 21px;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    align-self: stretch;
    background: rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(5.050000190734863px);}
.list-link:hover{ color:#fff; }

.list-item .tag{
  margin-left:auto;
  font-size:12px;
  color:var(--muted);
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  padding:6px 10px;
  border-radius:999px;
}.hero-activation{
  color:var(--text);
  padding:12px 16px 28px; /* top spacing similar to screenshot */
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.rowwa{display: flex;gap: 35px;}
.hero-wrap{
  width:100%;
  max-width: 980px;
  margin:0 auto;
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}
.guide-details-section{max-width: 2300px;margin-left: auto;margin-right: auto;padding-left: 10%;padding-right: 10%;}
/* ====== Breadcrumb ====== */
.breadcrumb{
  background:transparent;
  padding:0;
  margin-bottom:18px;display: flex;align-items: center;gap: 20PX;
}
.breadcrumb .breadcrumb-item,
.breadcrumb .breadcrumb-item a{
  color:var(--muted) !important;
  font-size:12px;
}
.breadcrumb .breadcrumb-item + .breadcrumb-item::before{
  color:var(--muted);
  content:"/";             /* slim divider */
}

/* ====== Title ====== */
.guide-content-wrapper h1{
  text-align:center;
  font-size: clamp(26px, 3.4vw, 40px) !important;
  font-weight:800;
  letter-spacing:.2px;
  margin: 8px 0 24px;
  color:#fff !important;
}

/* ====== Article content ====== */
.guide-content{
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  border:1px solid var(--border);
  border-radius:18px;
  padding:22px 24px;
  box-shadow: var(--shadow);
  color:var(--text) !important;
}
.guide-content h2, .guide-content h3{
  margin-top:16px;
  color:#fff;
  font-weight:700;
}
.guide-content p{
  color:var(--text);
  opacity:.95;
  line-height:1.65;
}
.guide-content ul, .guide-content ol{
  padding-left:1.2rem;
}
.guide-content img{
  width:100%;
  height:auto;
  border-radius:14px;
  border:1px solid var(--border);
  box-shadow: var(--shadow);
  margin:14px 0;
}

/* ====== Right sidebar ====== */
.related-topics-wrapper{
display: flex;
width: 437px;
padding: 8px 21px;
flex-direction: column;
align-items: flex-start;
gap: 24px;border-radius: 24px;
border: 1px solid #282C6E;
background: #070D1B;
}

.related-topics{
  position:sticky;
  top:24px;
}

.related-title{
  font-size:16px;
  font-weight:800;
  margin:4px 0 10px;
  color:#fff;
  display:flex;
  align-items:center;
  gap:10px;
}
.related-title::after{
  content:"";
  flex:1 1 auto;
  height:2px;
  background:linear-gradient(90deg, var(--accent), transparent 60%);
  border-radius:2px;
  opacity:.6;
}

/* List container */
.related-topics-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  background:transparent;
  border:0;
  padding:0;
}

/* Each pill row */
.related-topics-list .list-group-item{
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid var(--border);
  border-radius:32px;
  color:var(--text);
  transition: transform .15s ease, border-color .15s ease, box-shadow .2s ease, background .2s ease;
  flex-direction: column;border: 1px solid #001D51;
}
.related-topics-list .list-group-item:hover{
  transform: translateY(-2px);
  border-color: rgba(255,177,1,.32);
  box-shadow: var(--shadow);
}

/* Icon next to each row */
.platform-icon{
  width:104px;
  height:104px;
  flex:0 0 34px;
  border-radius:10px;
  object-fit:cover;
  border:1px solid var(--border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

/* Link text inside pill */
.related-topic-link{
  color:var(--text);
  font-weight:600;
  text-decoration:none;
  line-height:1.3;display: flex;
padding: 14px 14px 21px 14px;
flex-direction: column;
align-items: flex-start;
gap: var(--spacing-3xl, 24px);
align-self: stretch;border-radius: 0 0 32px 32px;
border: 1px solid #001D51;
background: rgba(0, 4, 33, 0.19);
backdrop-filter: blur(8.949999809265137px);
}
.related-topic-link:hover{ color:#fff; }

/* ====== Product highlight card ====== */
.product-highlight{
  border:1px solid var(--border);
  border-radius:16px;
  padding:14px 16px 18px;
  margin-top:18px;
  box-shadow: var(--shadow);
  text-align:center;
}
.product-highlight .related-title{
  margin-bottom:10px;
}
.related-prodcut-image{
  width:100%;
  max-width: 240px;
  height:auto;
  border-radius:14px;
  border:1px solid var(--border);
  box-shadow: var(--shadow);
}

/* ====== Layout spacing tweaks ====== */
.guide-layout{
  row-gap: 28px;
}

/* ====== Responsive ====== */
@media (max-width: 991px){
  .related-topics{ position:static; }
}
@media (max-width: 576px){
  .guide-content{
    padding:18px;
  }
  .related-topics-list .list-group-item{
    padding:11px 12px;
  }
}
/* Small label above title */
.hero-kicker{
  display:inline-block;
  font-size:12px;
  font-weight:700;
  text-transform: none; /* shown mixed case in screenshot */
  letter-spacing:.02em;
  color:#dcdce6;
  opacity:.85;
  margin-bottom:18px;
}

/* Big white line */
.hero-title{
  font-size: clamp(28px, 4.2vw, 44px);
  line-height:1.15;
  font-weight:800;
  letter-spacing:.2px;
  margin:0 0 8px 0;
  color:#ffffff;
}

/* Orange line, slightly larger and bolder */
.hero-highlight{
  margin:0 0 12px 0;
  line-height:1;
}
.hero-highlight span{
  display:inline-block;
color: var(--colors-text-text-warning-primary-600, #FDB022);
font-family: Outfit;
font-size: 48px;
font-style: normal;
font-weight: 600;
line-height: 60px;
letter-spacing: -0.96px;
}

/* Gray subtitle under orange line */
.hero-subtitle{
  margin: 8px 0 6px 0;
  font-size: clamp(12px, 1.5vw, 14px);
  color:var(--muted);
}

/* Utility for tiny caption under H1 if you add it */
.kicker{
  display:block; text-transform:uppercase; font-weight:700; letter-spacing:.12em;
  font-size:12px; color:var(--accent); margin-bottom:8px;
}
/* Responsive */
@media (max-width: 960px){
  .careers__wrap{ grid-template-columns: 1fr; gap:28px; }
}
/* Bullets */
.story-list{
  margin: 0 0 16px 1.25rem;
  padding: 0;
  color:#94969C;
  line-height:1.9;
}
.story-list li{
  margin: 0 0 10px;
  list-style: disc;
}
.cases{ padding: 56px 0 72px; }
.cases__wrap{     max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
      padding-left: 10%;
    padding-right: 10%;}
.cases__head h2{
  margin:0 0 8px; font-size: clamp(26px, 4.6vw, 44px); font-weight: 800;
}
.cases__head p{ margin:0 0 18px; color: var(--muted); }

/* Slider wrapper so we can position controls inside */
.cases__slider{ position:relative; }

/* Card */
.case-card{
  position:relative;
  min-height: 480px;
  border-radius: var(--card-radius);
  padding: 28px;
  color:#fff;
  border:1px solid var(--line);
  display:flex; flex-direction:column;
  box-shadow: inset 0 12px 40px rgba(0,0,0,.18);
}
.bg-blue   { background: var(--blue); }
.bg-green  { background: var(--green); }
.bg-sky    { background: var(--sky); }
.bg-indigo { background: var(--indigo); }
.bg-pink   { background: var(--pink); }

.case-logo{
  display:flex; align-items:center; gap:12px;
  font-weight:800; letter-spacing:.2px;
  font-size: 22px;
}
.case-logo__icon{
  display:grid; place-items:center;
  width:34px; height:34px; border-radius:10px;
  background: rgba(255,255,255,.18);
}
.case-logo__name{ color:#fff; }

/* Inset quote panel */
.case-quote{
  margin-top:auto;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.25);
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(255,255,255,.18), rgba(255,255,255,.06) 50%, transparent 70%),
    linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.35));
  padding: 22px 22px;
  color:#f5f8ff;
}
.case-quote h3{ margin:0 0 8px; font-size: 22px; font-weight:800; }
.case-quote p{ margin:0 0 14px; line-height:1.7; }
.case-link{
  color:#fff; font-weight:700; text-decoration:none;
  display:inline-flex; align-items:center; gap:8px;
}
.case-link:hover{ text-decoration:underline; }

/* Nav buttons */
.case-controls{
  display:flex; gap:14px;
  position:absolute; left:0; bottom:-70px; z-index:2;
}
.case-btn{
  width:44px; height:44px; border-radius:999px;
  display:grid; place-items:center;
  color:#dfe6ff; background:#0f1428; border:1px solid var(--line);
  box-shadow: 0 2px 10px rgba(0,0,0,.3);
  transition:.15s ease;
}
.case-btn:hover{ filter:brightness(1.08); transform:translateY(-1px); }

/* Swiper tweaks */
.case-swiper{ padding: 8px 6px 26px; }
.swiper-slide{ height: auto; }     /* allow card to size itself */

@media (max-width: 640px){
  .case-controls{ position: static; margin-top: 12px; }
}
/* Bottom divider */
.story-divider{
  margin: 36px 0 0;
  border: 0;
  height: 1px;
  background: var(--line);
}

/* Responsive */
@media (max-width: 900px){
  .story-grid{ grid-template-columns: 1fr; gap: 28px; }
}
.stat-num{
  font-weight: 800;
  font-size: clamp(28px, 4vw, 60px);
}
.stat-label{
  color: var(--muted);
  font-weight: 600;
}

/* Responsive */
@media (max-width: 900px){
  .mission-head{ grid-template-columns: 1fr; gap: 22px; }
  .mission-stats{ grid-template-columns: 1fr; row-gap: 18px; }
}
/* Submit button (full width blue pill) */
.btn.btn-primary.w-100{
  width:100%;
  height:48px;
  border-radius:14px;
  border:0;
  margin-top:14px;
  font-weight:700;
border-radius: var(--radius-md, 16px);
border: 1px solid #0045FF;
background: #0045FF;

/* Shadows/shadow-xs */
box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
}
.btn.btn-primary.w-100:hover{ filter:brightness(1.05); }
.btn.btn-primary.w-100:active{ transform:translateY(1px); }
.login-section .col-lg-6,
.login-section .col-lg-5,
.login-section .col-md-8{
  flex: 0 1 var(--form-max);           /* desired content width */
  width: 100%;                         /* fill available space */
  max-width: var(--form-max);
  margin-inline: auto;                 /* center */
}

/* make the form fill the wrapper (not a small max-width) */
.login-form-container,
.login-form-container form{margin-inline: auto;
}

/* ensure every field spans full width */
.form-control,
select.form-control,
textarea.form-control,
input[type="file"].form-control{
  width: 100%;
  box-sizing: border-box;color: var(--Colors-Text-text-placeholder, #85888E);
;
}

/* optionally widen the whole container a bit so the header breathes */
.login-section .container{ max-width: calc(var(--form-max) + 160px); }
/* Optional: two-column grid utility (use when you split Name into First/Last) */
.form-grid-2{
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
@media (max-width:640px){ .form-grid-2{ grid-template-columns:1fr; } }

/* Responsive */
@media (max-width: 900px){
  .cb-grid{ grid-template-columns: 1fr; }
}
/* Mobile */
@media (max-width:900px){
  .faq-container{ grid-template-columns:1fr; gap:28px; }
}

/* responsive: stack on small screens */
@media (max-width: 720px){
  .cb-card{   padding: 18px; min-height: auto;align-items: center;}
  .contact-block{padding: 35px 0 0px;}
  .login-section .row{padding:24px;}
  .cta-card{
    flex-direction: column;
    align-items: flex-start;
    padding: 22px;
    gap: 14px;
  }
  .cta-btn{ width: 100%; justify-content:center; }
}
    /* Mobile spacing */
    @media (max-width:640px){
      .policy-hero{ padding:28px 0 18px; }
    }
/* Mobile View Fix */
@media (max-width: 768px) {
  .faq-left .left-sub{font-size:14px;}
  .help-hero__inner{padding: 15px 40px 15px;}
  .acc-q{ font-size: 16px; }
  .faq-container{padding: 15px 0px;}
  .chips{    display: flex;gap: 10px;flex-wrap: wrap;justify-content: center;}
  .faq-container{ display: flex;flex-direction: column;}
  .policy-body{line-height:1.2;}
        .policy-tabs{ top:56px;display: flex;flex-direction: column;align-items: stretch;padding: 5px 10px;padding-left: 5%;gap:5px;padding-right: 5%; }
.policy-body p {font-size: 14px;}
  .blog-content table {width: 100% !important;border-spacing: 10px 5px;}
.pager-moblie{display: flex;padding: var(--spacing-md, 8px);justify-content: center;align-items: center;gap: var(--spacing-md, 8px);border-radius: var(--radius-md, 16px);
border: 1px solid var(--Component-colors-Components-Buttons-Secondary-button-secondary-border, #333741);
background: var(--Component-colors-Components-Buttons-Secondary-button-secondary-bg, #161B26);box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);}
    .blog-content table th,
    .blog-content table td {
        font-size: 14px; /* Reduce font size */
        padding: 10px; /* Reduce padding */
    }

    .blog-content table tr {
        flex-wrap: wrap !important;
        justify-content: space-between;
    }

    .blog-content table td,
    .blog-content table th {
        width: 48%; /* Ensure both columns fit side by side */
        box-sizing: border-box;
    }

    .blog-content table tbody tr {
        margin-bottom: 10px; /* Add space between rows */
        border: 1px solid #ffffff; /* Add border to visually separate rows */
        border-radius: 10px;
        overflow: hidden;
    }

    /* Center align content */
    .blog-content table th,
    .blog-content table td {
        text-align: center;
    }
}


    /* Main Blog Container */
    .blog-show-container {
        color: #e0e0e0;
    }

    /* Blog Title */
    .blog-title {
      color: var(--colors-text-text-primary-900, #F5F5F6);
      font-family: Outfit;
      font-size: 48px;
      font-weight: 600;
      letter-spacing: -0.96px;
        font-size: 1.7rem;
        text-align: center;

    }

    /* Blog Image */
    .blog-image {
        border-radius: 16px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
        max-height: 400px;
        width: 100%;
        object-fit: cover;
        margin-bottom: 20px;

    }

    /* Blog Content */
    .blog-content {
        font-size: 1rem;
        line-height: 1.6;
        padding: 20px;
        border-radius: 8px;
    }
  /* Related Topics Styling */
  .related-topics, .sidebar-related {
        margin-top: 30px;
    }
    
    .related-list {
        list-style: none;
        padding: 0;
    }
    .related-item {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
        padding: 10px;
        border-radius: 8px;
    }
    .related-item img.related-thumb {
        width: 50px;
        height: 50px;
        object-fit: cover;
        border-radius: 5px;
        margin-right: 10px;
    }
    .related-item span {
        color: #e0e0e0;
        font-size: 1rem;
        font-weight: 500;
    }
    .related-item a {
        display: flex;
        align-items: center;
        color: inherit;
        text-decoration: none;
    }
    .related-item a:hover span {
        color: #ffb200;
    }
    .settings-bar{
      position:sticky;
      top:0;
      width:100%;
      background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,0)) , var(--nav-bg);
      border-bottom:1px solid rgba(255,255,255,.04);
      padding:16px 24px;
    }

    /* Tabs */
    .tabs{
      display:flex;
      gap:8px;
      align-items:center;
      list-style:none;
      margin:0;
      padding:0;
      overflow-x:auto;
      scrollbar-width:none;
    }
    .tabs::-webkit-scrollbar{display:none}

    .tab{
      position:relative;
    }

    .tab a{
      --pad-x:14px;
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:10px var(--pad-x);
      border-radius:999px;
      color:var(--muted);
      text-decoration:none;
      white-space:nowrap;
      transition:background-color .2s ease, color .2s ease, box-shadow .2s ease, transform .08s ease;
    }
    .tab a:hover{ background:var(--hover-bg); color:var(--text); }

    /* Active pill */
    .tab a[aria-current="page"]{
      color:var(--text);
      background:var(--active-bg);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.06) inset,
        0 8px 24px -12px rgba(115,129,255,.35);
    }

    /* Notification badge */
    .badge{
      min-width:18px;
      height:18px;
      padding:0 6px;
      border-radius:999px;
      background:linear-gradient(180deg, #cfd6ff, #9aaaff);
      color:#0b0f2a;
      font-weight:700;
      font-size:11px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      line-height:1;
      box-shadow:0 2px 10px rgba(115,129,255,.45);
    }

    /* Keyboard focus */
    .tab a:focus-visible{
      outline:none;
      box-shadow:
        0 0 0 2px var(--ring),
        0 0 0 1px rgba(255,255,255,.08) inset;
      background:var(--active-bg);
      color:var(--text);
    }

    /* Optional: compact on very small screens */
    @media (max-width:420px){
      .tab a{ padding:8px 12px; }
    }
    /* Mobile adjustments */
    @media (max-width: 768px) {
        .blog-title {
            font-size: 1.5rem;
        }
        .blog-content {
            font-size: 0.9rem;
        }
        .blog-image {
            max-height: 250px;
        }
    }
    .last-updated-section {
        font-size: 0.9rem;
        color: #aaa;
    }
    .last-updated-section hr {
        border-top: 1px solid #ddd;
        margin: 20px 0;
    }
    .last-updated-section p {
        margin: 0;
    }
    .published-date {
        font-size: 0.9rem;
        color: #aaa;
        margin-bottom: 10px;
    }
    html, body { 
    height: auto !important; /* Allow dynamic height */
    overflow-x: hidden; /* Prevent horizontal scrolling */
    display: block; /* Ensure proper flow */
}
.row {
    display: flex;
    flex-wrap: wrap; /* Allow children to wrap */
    height: auto !important; /* Ensure height adjusts dynamically */
    align-items: stretch; /* Stretch children to fill height */
}
.blog-card {
    height: auto !important;
    overflow: hidden; /* Prevent content overflow */
}
.bread-crumbb{display: flex;
    padding: var(--spacing-9xl, 56px) 0;
    flex-direction: column;
    align-items: center;
    align-self: stretch;}

.blog-card-img {
    width: 100%;
    height: 200px; /* Consistent height for all images */
    object-fit: cover; /* Prevent stretching */
}
.sticky-product-box {
    position: sticky;
    top: 120px; /* Increase this if your header is taller */
    z-index: 10; /* Lower than navbar */
}
.related-title {
        font-weight: bold;
       color: var(--colors-text-text-primary-900, #F5F5F6)!important;
        border-bottom: 2px solid #FFC750;
        padding-bottom: 8px;
        margin-bottom: 20px;

    }
    .top-title{display: flex;flex-direction: column;align-items: center;padding: 60PX;gap:10px;}
    
/* Section header + controls */
.blog-slider{ --gap:22px; --card-h:180px; color:#e7ecff; margin-bottom:20px; }
.blog-slider-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:14px; }
.related-title{ margin:0 0 .8rem; font-weight:800; letter-spacing:.2px; }
.related-sub{ margin:0; color:#9aa3b2; font-size:.95rem; }

.blog-slider-controls{ display:flex; gap:28px; }
.blog-slider-controls[hidden]{ display:none !important; }
.nav-btn{
  width:36px!important; height:36px!important; border-radius:999px; border:0; cursor:pointer;
  background:#11142a; color:#cfd6ff; font-size:18px!important; line-height:1; display:grid; place-items:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.nav-btn:hover{ filter:brightness(1.15); }
.swiper-button-next:after, .swiper-button-prev:after{font-size:18px!important;}
.swiper-button-next, .swiper-button-prev{position: relative!important;}
/* Track (horizontal scroll) */
.blog-track{
  list-style:none; margin:0; padding:0;
  display:flex; gap:var(--gap);
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:1px;
  -webkit-overflow-scrolling:touch;
}
.blog-track:focus{ outline:none; }
.blog-track::-webkit-scrollbar{ height:10px }
.blog-track::-webkit-scrollbar-thumb{ background:#0f1230; border-radius:10px }

/* 4 visible on desktop, 2 on tablet, 1 on mobile */

.policy-tab{
  display:inline-flex; align-items:center;
  padding:8px 14px;
  border-radius: var(--radius-sm, 12px);
  color:#A8B1C7; text-decoration:none;
  transition:.15s ease;
}

/* ACTIVE state (two ways to detect it) */
.policy-tab.is-active,
.policy-tab[aria-current="page"],
.navbar-nav .nav-link.active {            /* fallback if you use .nav-link */
  background:#0045FF !important;          /* ensure it wins over theme */
  color:#fff !important;
  border-radius: var(--radius-sm, 12px);
}

/* Card visuals */
.card-media{ display:block; border-radius:18px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.card-media img{ width:100%; height:var(--card-h); object-fit:cover; display:block; transition:transform .35s ease; border-radius:18px; }
.card-blog:hover .card-media img{ transform:scale(1.04); }

.card-meta{ margin-top:10px; color:#9aa3b2; font-size:.8rem; }
.meta-dot{ margin:0 .5ch; }
.title-arrow{ opacity:.65; transition:transform .2s, opacity .2s; }
.card-blog:hover .title-arrow{ transform:translate(2px,-2px); opacity:1; }

.swiper{ overflow:hidden; }
.swiper-wrapper{ align-items:stretch;     height: auto!important;}


/* The slide is the sizing unit; card fills it */
.swiper-slide{
  height:auto;
  display:flex;           /* so child can stretch */
}
.card-blog{
  width:100%;             /* fill slide width */
  height:100%;
  display:flex;
  flex-direction:column;
}

/* keep your existing visuals */
.card-media{ display:block; border-radius:18px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.card-media img{ width:100%; height:180px; object-fit:cover; display:block; transition:transform .35s ease; border-radius:18px; }
.card-meta{ margin-top:10px; color:#9aa3b2; font-size:.8rem; }
.meta-dot{ margin:0 .5ch; }
.card-title{ margin:.35rem 0 0; font-size:1.05rem; line-height:1.35; display:flex; align-items:center; gap:6px; }
.card-title a{ color:#f2f5ff; text-decoration:none; }
.card-title a:hover{ text-decoration:underline; }
.title-arrow{ opacity:.65; transition:transform .2s, opacity .2s; }
.card-blog:hover .title-arrow{ transform:translate(2px,-2px); opacity:1; }
.card-excerpt{ margin:.35rem 0 .6rem; color:#9aa3b2; font-size:.9rem; }


@media (max-width: 1100px){
  .post-card.small{ grid-column: span 6; }
  .post-card.wide { grid-column: span 12; }
}
@media (max-width: 768px){
  .pager-next , .pager-prev{display: none;}
  .btn-primary{white-space: nowrap;}
  .containerblog{padding-left: 5%;padding-right: 5%;}
  .hero-header{padding: var(--spacing-9xl, 20px) 0 var(--spacing-11xl, 75px) 0;}}

@media (max-width: 640px){
  .featured-card{        top: -60px;}
  .image-wrap img{    height: 350PX;}
  .posts-grid{ gap: 20px; }
  .post-card.small, .post-card.wide { grid-column: span 12; }
  .page{ width: 32px; height: 32px; }
  .pager{ justify-content: space-around; row-gap: 12px; }
}

/* Responsiveness */
@media (max-width: 520px){
  .input-group{
    width: 100%;
  }
  .input-group input{ width: 100%; }
}