/* ---------- HERO (HOME) — REFRESH (PURPLE / PREMIUM) ---------- */
.hero{ padding: 22px 0 12px; }

.heroCard{
  position: relative;
  border-radius: 34px;
  overflow: hidden;
  background: #0b1220;
  min-height: 440px;

  border: 1px solid rgba(17,12,26,.12);
  box-shadow:
    0 34px 96px rgba(24, 12, 40, .16),
    0 0 0 1px rgba(90,46,145,.10);

  transform: translateZ(0);
}

/* media */
.heroMedia{ position:absolute; inset:0; }
.heroMedia img{
  width:100%;
  height:100%;
  object-fit: cover;

  transform: scale(1.04);
  filter: contrast(1.06) saturate(1.06) brightness(.95);
}

/* shade: purple bloom + readable left */
.heroShade{
  position:absolute; inset:0;
  background:
    radial-gradient(980px 560px at 14% 26%, rgba(123,67,196,.52), rgba(123,67,196,0) 62%),
    radial-gradient(760px 460px at 70% 18%, rgba(47,209,255,.12), rgba(47,209,255,0) 60%),
    linear-gradient(90deg,
      rgba(10,8,20,.76) 0%,
      rgba(10,8,20,.46) 42%,
      rgba(10,8,20,.18) 62%,
      rgba(10,8,20,0) 78%),
    linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.60) 100%);
}

.heroContent{
  position:relative;
  z-index:2;
  padding: 54px 54px 60px;
  max-width: 820px;
}

/* kicker -> pill */
.heroKicker{
  display:inline-flex;
  align-items:center;
  gap:10px;

  padding: 8px 12px;
  border-radius: 999px;

  font-weight: 950;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: 11px;

  color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
}

.heroTitle{
  margin: 14px 0 10px;
  font-size: clamp(32px, 3.7vw, 58px);
  line-height: 1.02;
  letter-spacing: -.04em;
  font-weight: 950;
  color:#fff;

  text-shadow: 0 18px 46px rgba(0,0,0,.32);
}

.heroSub{
  margin: 0;
  color: rgba(255,255,255,.84);
  max-width: 72ch;
  line-height: 1.75;
  font-size: 15.8px;
}

.heroCtas{
  margin-top: 18px;
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* buttons (global .btn is ok, but improved for hero usage) */
.btn{
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:10px;

  height: 46px;
  padding: 0 18px;
  border-radius: 999px;

  font-weight: 950;
  letter-spacing: .01em;

  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: #fff;

  transition: transform var(--t), background var(--t), border-color var(--t), box-shadow var(--t), filter var(--t);
  backdrop-filter: blur(10px);
}

.btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.26);
  box-shadow: 0 18px 46px rgba(0,0,0,.26);
}

.btn--primary{
  background: rgba(255,255,255,.96);
  color: rgba(15,11,28,.94);
  border-color: rgba(255,255,255,.34);
  box-shadow: 0 18px 46px rgba(0,0,0,.26);
}
.btn--primary:hover{
  background:#fff;
  border-color: rgba(90,46,145,.18);
  filter: saturate(1.02);
}

.btn--ghost{
  background: rgba(255,255,255,.10);
  color:#fff;
}
.btn--ghost:hover{
  background: rgba(255,255,255,.14);
}

/* play button */
.heroPlay{
  position:absolute;
  left: 54px;
  bottom: 22px;
  z-index: 2;

  display:inline-flex;
  align-items:center;
  gap: 10px;

  text-decoration:none;
  color: rgba(255,255,255,.92);

  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);

  padding: 10px 12px;
  border-radius: 999px;

  backdrop-filter: blur(10px);
  box-shadow: 0 18px 46px rgba(0,0,0,.26);

  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}

.heroPlay:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.14);
}

.playIcon{
  width: 30px; height: 30px;
  border-radius: 999px;

  background: rgba(255,255,255,.96);
  border: 1px solid rgba(90,46,145,.18);

  position: relative;
}

.playIcon::after{
  content:"";
  position:absolute;
  left: 12px;
  top: 9px;
  width: 0; height: 0;

  border-left: 10px solid rgba(90,46,145,.98);
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
}

.playText{
  font-weight: 950;
  font-size: 13.5px;
  letter-spacing: -.01em;
}

/* responsive */
@media (max-width: 980px){
  .heroCard{ min-height: 520px; border-radius: 28px; }
  .heroContent{ padding: 40px 22px 22px; max-width: 92%; }
  .heroPlay{ left: 22px; }
  .heroShade{
    background:
      radial-gradient(900px 520px at 50% 14%, rgba(123,67,196,.40), rgba(123,67,196,0) 60%),
      linear-gradient(180deg,
        rgba(10,8,20,.76) 0%,
        rgba(10,8,20,.46) 52%,
        rgba(10,8,20,.10) 84%,
        rgba(10,8,20,0) 96%);
  }
}

/* =========================================================
   HOW TO GET — ARRIVAL & TRANSPORT (ARTICLE)
   Same purple premium system as Visa & Permissions page
   Works with your existing HTML classnames in this section.
   Brand purple: #5a2e91 | Serious tone
   ========================================================= */

/* -----------------------------------
   ARTICLE WRAP
----------------------------------- */
.article#how-to-get{
  padding: 26px 0 10px;
  position: relative;
}

.article#how-to-get::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(900px 560px at 12% 0%, rgba(90,46,145,.08), transparent 60%),
    radial-gradient(720px 520px at 88% 18%, rgba(123,67,196,.06), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(90,46,145,.02) 100%);
  opacity:.95;
}
.article#how-to-get > .container{ position:relative; z-index:1; }

/* -----------------------------------
   INTRO (vpHead-like)
----------------------------------- */
.article#how-to-get .articleHead{
  max-width: 980px;
  display:grid;
  gap: 8px;
  padding: 12px 0 18px;
}

.article#how-to-get .articleTitle{
  margin:0;
  font-size: 22px;
  line-height: 1.18;
  letter-spacing: -.02em;
  color: rgba(15,11,28,.96);
  font-weight: 950;
}
.article#how-to-get .articleTitle::after{
  content:"";
  display:block;
  width: 54px;
  height: 3px;
  border-radius: 999px;
  margin-top: 10px;
  background: linear-gradient(90deg, #5a2e91, rgba(123,67,196,.55));
  opacity:.95;
}

.article#how-to-get .articleLead{
  margin:0;
  color: rgba(15,11,28,.70);
  line-height: 1.75;
  max-width: 78ch;
  font-size: 15.2px;
}

/* =========================================================
   ARRIVAL OPTIONS (CARDS) — image + body cards
   (Your markup has .placeCard__img in this page)
========================================================= */
.article#how-to-get .cards{
  padding: 22px 0 10px;
  border-top: 1px solid rgba(17,12,26,.08);
  position: relative;
}

.article#how-to-get .cardsHead{
  display:grid;
  gap: 8px;
  max-width: 980px;
  margin-bottom: 14px;
}

.article#how-to-get .cardsTitle{
  margin:0;
  font-size: 22px;
  font-weight: 950;
  letter-spacing: -.02em;
  color: rgba(15,11,28,.96);
}
.article#how-to-get .cardsTitle::after{
  content:"";
  display:block;
  width: 54px;
  height: 3px;
  border-radius: 999px;
  margin-top: 10px;
  background: linear-gradient(90deg, #5a2e91, rgba(123,67,196,.55));
}
.article#how-to-get .cardsSub{
  margin:0;
  color: rgba(15,11,28,.70);
  line-height: 1.75;
  font-size: 15.2px;
}

.article#how-to-get .cardGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}

/* clickable card */
.article#how-to-get a.placeCard{
  text-decoration:none;
  color: inherit;
}

.article#how-to-get .placeCard{
  position: relative;
  display:grid;
  grid-template-rows: 210px 1fr;
  border-radius: 22px;
  overflow:hidden;

  border: 1px solid rgba(17,12,26,.10);
  background:
    radial-gradient(520px 240px at 18% 0%, rgba(123,67,196,.06), rgba(123,67,196,0) 58%),
    rgba(255,255,255,.90);

  backdrop-filter: blur(14px);
  box-shadow: 0 18px 60px rgba(24,12,40,.10);

  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
  transform: translateZ(0);
}

.article#how-to-get .placeCard:hover{
  transform: translateY(-3px);
  box-shadow: 0 28px 92px rgba(24,12,40,.14);
  border-color: rgba(90,46,145,.18);
  filter: saturate(1.03);
}

/* image */
.article#how-to-get .placeCard__img{
  position:relative;
  overflow:hidden;
  background:#0b1220;
}
.article#how-to-get .placeCard__img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.03);
  filter: saturate(1.06) contrast(1.06);
  transition: transform .35s ease, filter .35s ease;
}
.article#how-to-get .placeCard:hover .placeCard__img img{
  transform: scale(1.08);
  filter: saturate(1.12) contrast(1.08);
}

/* overlay */
.article#how-to-get .placeCard__img::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(820px 460px at 18% 18%, rgba(123,67,196,.18), rgba(123,67,196,0) 62%),
    linear-gradient(180deg, rgba(15,11,28,.06) 55%, rgba(15,11,28,.28) 100%);
}

/* body */
.article#how-to-get .placeCard__b{
  padding: 16px 16px 18px;
  display:flex;
  flex-direction:column;
  gap: 8px;
}

.article#how-to-get .placeCard__k{
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(90,46,145,.92);
  font-weight: 950;
}

.article#how-to-get .placeCard__t{
  margin:0;
  font-weight: 950;
  font-size: 16.2px;
  letter-spacing: -.02em;
  line-height: 1.2;
  color: rgba(15,11,28,.96);
}

.article#how-to-get .placeCard__d{
  margin:0;
  color: rgba(15,11,28,.72);
  line-height: 1.7;
  font-size: 14.3px;
}

.article#how-to-get .placeCard__cta{
  margin-top: auto;
  font-weight: 950;
  display:inline-flex;
  align-items:center;
  gap: 10px;

  color: rgba(90,46,145,.98);
  width: fit-content;
  padding: 9px 12px;
  border-radius: 999px;

  background: rgba(90,46,145,.10);
  border: 1px solid rgba(90,46,145,.16);

  transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.article#how-to-get .placeCard:hover .placeCard__cta{
  transform: translateY(-1px);
  background: rgba(90,46,145,.14);
  border-color: rgba(90,46,145,.22);
  box-shadow: 0 16px 52px rgba(24,12,40,.10);
}

/* =========================================================
   DETAIL BLOCKS (text + aside) — same as serious blocks
========================================================= */
.article#how-to-get .block{
  position: relative;
  padding: 22px 0;
}
.article#how-to-get .block + .block{
  border-top: 1px solid rgba(17,12,26,.08);
}

.article#how-to-get .blockRow{
  display:grid;
  grid-template-columns: 1.35fr .65fr;
  gap: 18px;
  align-items:start;
}
.article#how-to-get .blockRow--reverse{
  grid-template-columns: .65fr 1.35fr;
}
.article#how-to-get .blockRow--reverse .blockText{ order:2; }
.article#how-to-get .blockRow--reverse .blockAside{ order:1; }

.article#how-to-get .blockH{
  margin:0;
  font-size: 16.2px;
  line-height: 1.2;
  letter-spacing: -.01em;
  color: rgba(15,11,28,.96);
  font-weight: 950;
}
.article#how-to-get .blockH::after{
  content:"";
  display:block;
  width: 54px;
  height: 3px;
  border-radius: 999px;
  margin-top: 10px;
  background: linear-gradient(90deg, #5a2e91, rgba(123,67,196,.55));
  opacity:.95;
}

.article#how-to-get .blockP{
  margin: 10px 0 0;
  color: rgba(15,11,28,.72);
  line-height: 1.85;
  font-size: 14.8px;
  max-width: 78ch;
}

/* miniGrid (flights) — vpCard micro-cards */
.article#how-to-get .miniGrid{
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}
.article#how-to-get .miniCard{
  border-radius: 18px;
  padding: 12px;
  background:
    radial-gradient(520px 240px at 18% 0%, rgba(123,67,196,.06), rgba(123,67,196,0) 58%),
    rgba(255,255,255,.90);
  border: 1px solid rgba(17,12,26,.10);
  backdrop-filter: blur(12px);
  box-shadow: 0 14px 44px rgba(24,12,40,.07);
}
.article#how-to-get .miniCard__k{
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(90,46,145,.92);
  font-weight: 950;
}
.article#how-to-get .miniCard__t{
  margin-top: 6px;
  font-weight: 950;
  font-size: 14.8px;
  letter-spacing: -.01em;
  color: rgba(15,11,28,.96);
}
.article#how-to-get .miniCard__p{
  margin: 6px 0 0;
  color: rgba(15,11,28,.72);
  line-height: 1.65;
  font-size: 13.8px;
}

/* bulletCols (vip) */
.article#how-to-get .bulletCols{
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}

.article#how-to-get .bulletCol{
  border-radius: 22px;
  border: 1px solid rgba(17,12,26,.10);
  background:
    radial-gradient(520px 240px at 18% 0%, rgba(90,46,145,.04), rgba(90,46,145,0) 58%),
    rgba(255,255,255,.90);
  backdrop-filter: blur(14px);
  box-shadow: 0 18px 60px rgba(24,12,40,.10);
  padding: 14px;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.article#how-to-get .bulletCol:hover{
  transform: translateY(-2px);
  border-color: rgba(90,46,145,.18);
  box-shadow: 0 26px 84px rgba(24,12,40,.12);
}

.article#how-to-get .bulletH{
  margin:0;
  font-size: 14.8px;
  font-weight: 950;
  letter-spacing: -.01em;
  color: rgba(15,11,28,.96);
}
.article#how-to-get .bulletList{
  margin: 10px 0 0;
  padding-left: 18px;
  color: rgba(15,11,28,.74);
  line-height: 1.8;
  font-size: 14.2px;
}

/* featureList (around) — your markup has feat__ul here */
.article#how-to-get .featureList{
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
.article#how-to-get .feat{
  border-radius: 22px;
  border: 1px solid rgba(17,12,26,.10);
  background:
    radial-gradient(520px 240px at 18% 0%, rgba(123,67,196,.06), rgba(123,67,196,0) 58%),
    rgba(255,255,255,.90);
  padding: 14px;
  backdrop-filter: blur(14px);
  box-shadow: 0 18px 60px rgba(24,12,40,.10);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.article#how-to-get .feat:hover{
  transform: translateY(-2px);
  box-shadow: 0 26px 84px rgba(24,12,40,.12);
  border-color: rgba(90,46,145,.18);
}
.article#how-to-get .feat__t{
  margin:0;
  font-size: 14.8px;
  font-weight: 950;
  letter-spacing: -.01em;
  color: rgba(15,11,28,.96);
}
.article#how-to-get .feat__ul{
  margin: 10px 0 0;
  padding-left: 18px;
  color: rgba(15,11,28,.74);
  line-height: 1.8;
  font-size: 14.2px;
}

/* twoUp (rental) */
.article#how-to-get .twoUp{
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
.article#how-to-get .twoUp__card{
  border-radius: 22px;
  border: 1px solid rgba(17,12,26,.10);
  background:
    radial-gradient(520px 240px at 18% 0%, rgba(90,46,145,.04), rgba(90,46,145,0) 58%),
    rgba(255,255,255,.90);
  backdrop-filter: blur(14px);
  box-shadow: 0 18px 60px rgba(24,12,40,.10);
  padding: 14px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.article#how-to-get .twoUp__card:hover{
  transform: translateY(-2px);
  box-shadow: 0 26px 84px rgba(24,12,40,.12);
  border-color: rgba(90,46,145,.18);
}
.article#how-to-get .twoUp__t{
  margin:0;
  font-size: 14.8px;
  font-weight: 950;
  letter-spacing: -.01em;
  color: rgba(15,11,28,.96);
}
.article#how-to-get .twoUp__ul{
  margin: 10px 0 0;
  padding-left: 18px;
  color: rgba(15,11,28,.74);
  line-height: 1.8;
  font-size: 14.2px;
}

/* tagRow (rail) */
.article#how-to-get .tagRow{
  margin-top: 12px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}
.article#how-to-get .tag{
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(90,46,145,.16);
  background: rgba(90,46,145,.08);
  font-weight: 900;
  color: rgba(90,46,145,.98);
  font-size: 12.8px;
  letter-spacing: .02em;
}

/* note (shared) */
.article#how-to-get .note{
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(90,46,145,.16);
  background: rgba(90,46,145,.06);
  color: rgba(15,11,28,.76);
  line-height: 1.75;
}

/* ---------------------------------------------------------
   ASIDE (shared)
--------------------------------------------------------- */
.article#how-to-get .blockAside{
  display:grid;
  gap: 12px;
}

.article#how-to-get .asideMedia{
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.10);
  background:#0b1220;
  box-shadow: 0 30px 90px rgba(24,12,40,.18);
  position:relative;
}
.article#how-to-get .asideMedia::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(820px 460px at 18% 18%, rgba(123,67,196,.18), rgba(123,67,196,0) 62%),
    linear-gradient(180deg, rgba(15,11,28,.06) 55%, rgba(15,11,28,.28) 100%);
}
.article#how-to-get .asideMedia img{
  width:100%;
  height: 250px;
  object-fit: cover;
  display:block;
  transform: scale(1.02);
  filter: saturate(1.05) contrast(1.05);
}

.article#how-to-get .asideCallout{
  border-radius: 22px;
  border: 1px solid rgba(17,12,26,.10);
  background:
    radial-gradient(520px 240px at 18% 0%, rgba(123,67,196,.05), rgba(123,67,196,0) 58%),
    rgba(255,255,255,.88);
  padding: 16px;
  backdrop-filter: blur(14px);
  box-shadow: 0 18px 60px rgba(24,12,40,.10);
}

.article#how-to-get .asideCallout__k{
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(90,46,145,.92);
  font-weight: 950;
}
.article#how-to-get .asideCallout__t{
  margin-top: 6px;
  font-weight: 950;
  font-size: 15.8px;
  letter-spacing: -.01em;
  color: rgba(15,11,28,.96);
}
.article#how-to-get .asideCallout__p{
  margin: 8px 0 0;
  color: rgba(15,11,28,.72);
  line-height: 1.7;
  font-size: 14.2px;
}
.article#how-to-get .asideLink{
  margin-top: 10px;
  display:inline-flex;
  align-items:center;
  gap: 10px;
  text-decoration:none;
  font-weight: 950;
  color: rgba(90,46,145,.98);
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(90,46,145,.10);
  border: 1px solid rgba(90,46,145,.16);
  transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.article#how-to-get .asideLink:hover{
  transform: translateY(-1px);
  background: rgba(90,46,145,.14);
  border-color: rgba(90,46,145,.22);
  box-shadow: 0 16px 52px rgba(24,12,40,.10);
}

/* =========================================================
   PREP TIPS (infoGrid/infoCard) + CTA VARIANTS
========================================================= */
.article#how-to-get .infoGrid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}

/* linkable info cards */
.article#how-to-get a.infoCard{
  text-decoration:none;
  color: inherit;
}

.article#how-to-get .infoCard{
  border-radius: 22px;
  border: 1px solid rgba(17,12,26,.10);
  background:
    radial-gradient(520px 240px at 18% 0%, rgba(90,46,145,.04), rgba(90,46,145,0) 58%),
    rgba(255,255,255,.90);
  backdrop-filter: blur(14px);
  box-shadow: 0 18px 60px rgba(24,12,40,.10);
  padding: 14px 16px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.article#how-to-get .infoCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 26px 84px rgba(24,12,40,.12);
  border-color: rgba(90,46,145,.18);
}

.article#how-to-get .infoCard__t{
  font-weight: 950;
  font-size: 15.2px;
  letter-spacing: -.01em;
  color: rgba(15,11,28,.96);
}

.article#how-to-get .infoCard__d{
  margin-top: 8px;
  color: rgba(15,11,28,.72);
  line-height: 1.75;
  font-size: 14.4px;
}

/* CTA chip inside info cards (you added infoCard__cta) */
.article#how-to-get .infoCard__cta{
  margin-top: 12px;
  font-weight: 950;
  display:inline-flex;
  align-items:center;
  gap: 10px;

  color: rgba(90,46,145,.98);
  width: fit-content;
  padding: 9px 12px;
  border-radius: 999px;

  background: rgba(90,46,145,.10);
  border: 1px solid rgba(90,46,145,.16);

  transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.article#how-to-get .infoCard:hover .infoCard__cta{
  transform: translateY(-1px);
  background: rgba(90,46,145,.14);
  border-color: rgba(90,46,145,.22);
  box-shadow: 0 16px 52px rgba(24,12,40,.10);
}

/* =========================================================
   END CTA (endCta/linkBtn) — align to vpEnd style
========================================================= */
.article#how-to-get .endCta{
  padding: 22px 0 0;
}

.article#how-to-get .endCta__card{
  border-radius: 26px;
  border: 1px solid rgba(17,12,26,.10);
  background:
    radial-gradient(900px 320px at 18% 0%, rgba(123,67,196,.06), rgba(123,67,196,0) 60%),
    radial-gradient(820px 320px at 88% 30%, rgba(90,46,145,.10), rgba(90,46,145,0) 60%),
    rgba(255,255,255,.86);
  backdrop-filter: blur(14px);
  box-shadow: 0 22px 70px rgba(24,12,40,.10);
  padding: 18px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 14px;
}

.article#how-to-get .endCta__text h3{
  margin:0;
  font-size: 18.5px;
  font-weight: 950;
  letter-spacing: -.02em;
  color: rgba(15,11,28,.96);
}
.article#how-to-get .endCta__text p{
  margin: 8px 0 0;
  color: rgba(15,11,28,.72);
  line-height: 1.75;
  max-width: 70ch;
  font-size: 14.8px;
}
.article#how-to-get .endCta__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* link buttons */
.article#how-to-get .linkBtn{
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;

  border: 1px solid rgba(17,12,26,.10);
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(10px);

  font-weight: 950;
  color: rgba(15,11,28,.92);
  box-shadow: 0 12px 40px rgba(24,12,40,.08);

  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.article#how-to-get .linkBtn:hover{
  transform: translateY(-1px);
  border-color: rgba(90,46,145,.18);
  background: rgba(90,46,145,.06);
  box-shadow: 0 18px 54px rgba(24,12,40,.10);
}

/* purple primary */
.article#how-to-get .linkBtn--primary{
  background: linear-gradient(135deg, #5a2e91, #3b1b6a 58%, #24123f 100%);
  border-color: rgba(90,46,145,.28);
  color:#fff;
  box-shadow: 0 18px 60px rgba(24,12,40,.16);
}
.article#how-to-get .linkBtn--primary:hover{
  background: linear-gradient(135deg, #6a35a9, #421e79 58%, #24123f 100%);
  border-color: rgba(90,46,145,.34);
}

/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width: 1100px){
  .article#how-to-get .cardGrid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .article#how-to-get .blockRow{ grid-template-columns: 1fr; }
  .article#how-to-get .blockRow--reverse{ grid-template-columns: 1fr; }
  .article#how-to-get .blockRow--reverse .blockText{ order: 1; }
  .article#how-to-get .blockRow--reverse .blockAside{ order: 2; }
}

@media (max-width: 980px){
  .article#how-to-get .cardGrid{ grid-template-columns: 1fr; }
  .article#how-to-get .miniGrid{ grid-template-columns: 1fr; }
  .article#how-to-get .bulletCols{ grid-template-columns: 1fr; }
  .article#how-to-get .featureList{ grid-template-columns: 1fr; }
  .article#how-to-get .twoUp{ grid-template-columns: 1fr; }
  .article#how-to-get .infoGrid{ grid-template-columns: 1fr; }
  .article#how-to-get .asideMedia img{ height: 240px; }
}

@media (max-width: 680px){
  .article#how-to-get .endCta__card{ flex-direction: column; align-items: flex-start; }
}