/* ── VIRTUAL INERTIA SCROLL ── */
html { scroll-behavior: smooth; }
body { overflow: auto; }
#lenis-wrapper {
  position: relative;
  width: 100%; height: auto;
  overflow: visible;
  background:   #ffffff;
}
#lenis-content { min-height: 100%; }
.fade-in-element {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.75s cubic-bezier(.22,1,.36,1), transform 0.75s cubic-bezier(.22,1,.36,1);
}
.fade-in-element.visible { opacity: 1; transform: translateY(0); }




  :root {
    --navy: #0a1628;
    --navy-mid: #0f2040;
    --blue: #1a5fd4;
    --blue-bright: #2563eb;
    --selection-bg: #3f3d99;
    --selection-fg: #ffffff;
    --text-primary: #111827;
    --text-secondary: #6b7280;
    --text-muted: #9ca3af;
    --border: #e5e7eb;
    --border-light: #f3f4f6;
    --bg: #ffffff;
    --bg-subtle: #fafafa;
    --transition: cubic-bezier(0.4, 0, 0.2, 1);
  }

  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  html { scroll-behavior: smooth; }

  body {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    color: var(--text-primary);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }

  ::selection { background: #22197f !important; color: #ffffff !important; }
  ::-moz-selection { background: #22197f !important; color: #ffffff !important; }

  /* ── HERO ── */
  .hero {
    padding: 88px 48px 12px;
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
    gap: 18px 44px;
    align-items: start;
    border-bottom: 0;
  }

  .hero-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 500;
    color: #94a3b8;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 0;
    grid-column: 1 / -1;
  }

  .hero-label::before {
    display: none;
  }

  h1.hero-title {
    font-size: clamp(34px, 4.2vw, 52px);
    font-weight: 600;
    color: var(--text-primary);
    letter-spacing: -0.045em;
    line-height: 0.98;
    max-width: none;
  }

  .hero-title span {
    color: var(--blue);
  }

  .hero-side {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding-top: 4px;
  }

  .hero-sub {
    margin-top: 0;
    font-size: 17px;
    color: var(--text-secondary);
    max-width: 620px;
    line-height: 1.62;
  }

  /* ── FILTER BAR ── */
  .filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    padding: 2px 0 0;
    margin: 0;
    max-width: 620px;
  }

  .filter-chip {
    font-family: 'Inter', sans-serif;
    font-size: 11.5px;
    font-weight: 400;
    color: #64748b;
    background: rgba(255,255,255,0.88);
    border: 1px solid rgba(203, 213, 225, 0.72);
    border-radius: 100px;
    padding: 8px 11px;
    cursor: pointer;
    transition: color 0.2s var(--transition), border-color 0.2s var(--transition), background 0.2s var(--transition), box-shadow 0.2s var(--transition);
    letter-spacing: -0.015em;
    box-shadow: 0 1px 0 rgba(255,255,255,0.9);
    white-space: nowrap;
    flex: 0 0 auto;
  }
  .filter-chip:hover {
    color: var(--text-primary);
    border-color: rgba(37, 99, 235, 0.28);
    background: #f8fbff;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.08);
  }
  .filter-chip.active {
    color: var(--blue);
    border-color: var(--blue);
    background: #f2f7ff;
    font-weight: 500;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.1);
  }

  /* ── TOPIC HUBS – REDESIGNED ── */
  .topic-hubs {
    background: #ffffff;
    position: relative;
    overflow: hidden;
  }

  .topic-hubs::before {
    content: '';
    position: absolute;
    top: -200px;
    right: -100px;
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.04) 0%, transparent 68%);
    pointer-events: none;
  }

  .topic-hubs::after {
    content: '';
    position: absolute;
    bottom: -120px;
    left: 5%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.03) 0%, transparent 70%);
    pointer-events: none;
  }

  .topic-hubs-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 80px 48px 88px;
    position: relative;
    z-index: 1;
  }

  .topic-hubs-header {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.07);
    margin-bottom: 40px;
  }

  .topic-hubs-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
  }

  .topic-hubs-eyebrow-line {
    display: block;
    width: 28px;
    height: 1px;
    background: var(--blue);
  }

  .topic-hubs-kicker {
    display: inline-flex;
    width: fit-content;
    margin-bottom: 0;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--blue);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
  }

  .topic-hubs-header-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.9fr);
    gap: 24px 48px;
    align-items: end;
  }

  .topic-hubs-header h2 {
    font-size: clamp(28px, 3.2vw, 44px);
    line-height: 1.04;
    letter-spacing: -0.04em;
    color: var(--text-primary);
  }

  .topic-hubs-copy {
    max-width: 540px;
    font-size: 15.5px;
    line-height: 1.75;
    color: var(--text-secondary);
    padding-top: 4px;
  }

  .topic-hubs-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    padding-top: 0;
  }

  .topic-hub-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 270px;
    padding: 26px 22px 22px;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #ffffff;
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.05);
    text-decoration: none;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .topic-hub-card::before {
    content: none;
  }

  .topic-hub-card:hover {
    transform: translateY(-5px);
    border-color: rgba(37, 99, 235, 0.22);
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.11);
  }

  .topic-hub-card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 22px;
  }

  .topic-hub-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .topic-hub-icon svg {
    width: 19px;
    height: 19px;
  }

  .topic-hub-card[data-hub="vergleiche"] .topic-hub-icon {
    background: rgba(99, 102, 241, 0.08);
    color: #6366f1;
  }
  .topic-hub-card[data-hub="branchen"] .topic-hub-icon {
    background: rgba(16, 185, 129, 0.08);
    color: #059669;
  }
  .topic-hub-card[data-hub="kosten"] .topic-hub-icon {
    background: rgba(245, 158, 11, 0.09);
    color: #d97706;
  }
  .topic-hub-card[data-hub="workflows"] .topic-hub-icon {
    background: rgba(37, 99, 235, 0.08);
    color: var(--blue);
  }

  .topic-hub-label {
    display: inline-flex;
    width: fit-content;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    background: rgba(15, 23, 42, 0.04);
    color: var(--text-secondary);
  }

  .topic-hub-card[data-hub="vergleiche"] .topic-hub-label {
    background: rgba(99, 102, 241, 0.07);
    color: #6366f1;
  }
  .topic-hub-card[data-hub="branchen"] .topic-hub-label {
    background: rgba(16, 185, 129, 0.07);
    color: #059669;
  }
  .topic-hub-card[data-hub="kosten"] .topic-hub-label {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
  }
  .topic-hub-card[data-hub="workflows"] .topic-hub-label {
    background: rgba(37, 99, 235, 0.07);
    color: var(--blue);
  }

  .topic-hub-card h3 {
    font-size: 16.5px;
    line-height: 1.32;
    letter-spacing: -0.022em;
    color: var(--text-primary);
    margin-bottom: 10px;
    flex: 1;
  }

  .topic-hub-card p {
    font-size: 13.5px;
    line-height: 1.65;
    color: var(--text-secondary);
    margin-bottom: 22px;
  }

  .topic-hub-card-footer {
    margin-top: auto;
    display: flex;
    justify-content: flex-end;
  }

  .topic-hub-arrow {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid rgba(15, 23, 42, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    transition: border-color 0.22s, color 0.22s, transform 0.22s;
    flex-shrink: 0;
  }

  .topic-hub-arrow svg {
    width: 13px;
    height: 13px;
  }

  .topic-hub-card:hover .topic-hub-arrow {
    border-color: var(--blue);
    color: var(--blue);
    transform: translate(2px, -2px);
  }

  /* ── FEATURED POST ── */
  .featured-section {
    padding: 0 48px 112px;
    max-width: 1280px;
    margin: 0 auto;
  }

  .featured-card {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.88fr);
    gap: 48px;
    border-top: 1px solid rgba(37, 99, 235, 0.16);
    border-bottom: 1px solid rgba(226, 232, 240, 0.92);
    border-radius: 0;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.28s var(--transition);
    background: transparent;
    padding: 34px 0 40px;
  }

  .featured-card:hover {
    transform: translateY(-4px);
  }

  .featured-image {
    min-height: 520px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    order: 2;
    border-radius: 24px;
    border: 1px solid rgba(37, 99, 235, 0.07);
    box-shadow: 0 32px 70px rgba(15, 23, 42, 0.06);
    background: #f7fbff;
  }

  .featured-image::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.06), rgba(15,23,42,0.08)),
      radial-gradient(circle at 16% 18%, rgba(255,255,255,0.28), transparent 34%);
    z-index: 1;
  }

  .featured-frame {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid rgba(37, 99, 235, 0.08);
    box-shadow: 0 28px 60px rgba(15, 23, 42, 0.08);
    background: #f4f8ff;
  }

  .featured-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
  }

  .featured-image-grid {
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 40px 40px;
  }

  .featured-image-icon {
    position: relative;
    z-index: 2;
    width: 72px;
    height: 72px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 20px;
    background: rgba(255,255,255,0.08);
    backdrop-filter: blur(12px);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .featured-image-icon svg {
    width: 32px;
    height: 32px;
    color: rgba(255,255,255,0.8);
  }

  .featured-content {
    padding: 18px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 24px;
    position: relative;
    order: 1;
  }

  .featured-content::before {
    display: none;
  }

  .featured-kicker {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--blue);
  }

  .featured-meta-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: -8px;
    color: #64748b;
    font-size: 12px;
    font-weight: 500;
  }

  .featured-meta-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.06);
    border: 1px solid rgba(37, 99, 235, 0.08);
    color: var(--blue);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
  }

  .post-category {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--blue);
  }

  .featured-content h2 {
    font-family: 'Inter', sans-serif;
    font-size: clamp(38px, 4vw, 56px);
    font-weight: 600;
    letter-spacing: -0.065em;
    line-height: 0.96;
    color: var(--text-primary);
    max-width: 10.5ch;
  }

  .featured-content p {
    font-size: 16px;
    line-height: 1.92;
    color: var(--text-secondary);
    max-width: 58ch;
  }

  .post-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    font-size: 12px;
    color: #64748b;
    padding-top: 2px;
  }

  .post-meta .author {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .author-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--navy), var(--blue-bright));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 600;
    color: white;
    flex-shrink: 0;
  }

  .post-meta .dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(100, 116, 139, 0.55);
  }

  .read-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--blue);
    text-decoration: none;
    transition: gap 0.2s;
    width: fit-content;
    padding: 0 0 6px;
    border-bottom: 1px solid rgba(26, 95, 212, 0.18);
    letter-spacing: 0.01em;
  }

  .featured-card:hover .read-more { gap: 12px; }

  .read-more svg {
    width: 14px;
    height: 14px;
    transition: transform 0.2s;
  }
  .featured-card:hover .read-more svg { transform: translateX(2px); }

  /* ── GRID ── */
  .grid-section {
    padding: 10px 48px 96px;
    max-width: 1280px;
    margin: 0 auto;
  }

  .grid-title {
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #64748b;
    white-space: nowrap;
  }

  .blog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 38px 30px;
  }

  .blog-card {
    min-height: 0;
    border-radius: 0;
    overflow: hidden;
    background: transparent;
    border: 0;
    border-top: 1px solid rgba(226, 232, 240, 0.9);
    color: var(--text-primary);
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.25s var(--transition), border-color 0.25s var(--transition);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 26px;
    content-visibility: auto;
    contain-intrinsic-size: 420px;
  }

  .blog-card,
  .blog-card * {
    text-decoration: none !important;
  }

  .blog-card:hover {
    transform: translateY(-5px);
    border-color: rgba(37, 99, 235, 0.22);
  }

  .blog-card-featured {
    grid-column: auto;
  }

  .card-media {
    position: relative;
    height: 236px;
    margin: 0;
    border-radius: 14px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-color: #f8fbff;
    box-shadow: 0 24px 55px rgba(15, 23, 42, 0.05);
  }

  .card-media::before {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px solid rgba(37, 99, 235, 0.22);
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
  }

  .card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: relative;
    z-index: 0;
  }

  .card-media::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.02)),
      radial-gradient(circle at 20% 20%, rgba(255,255,255,0.36), transparent 34%);
    pointer-events: none;
    z-index: 1;
  }

.media-privacy { background-image: linear-gradient(135deg, #eaf3ff 0%, #bcd8ff 46%, #2563eb 100%); }
.media-benefits { background-image: linear-gradient(135deg, #eef4ff 0%, #d7e3ff 46%, #2563eb 100%); }
.media-law { background-image: linear-gradient(135deg, #f7fbff 0%, #d8e7ff 44%, #1d4ed8 100%); }
.media-integrations { background-image: linear-gradient(135deg, #eef5ff 0%, #c8dafd 48%, #345eea 100%); }
  .media-fonio { background-image: linear-gradient(135deg, #eef8ff 0%, #b8ddf8 52%, #0f766e 100%); }
  .media-handwerk { background-image: linear-gradient(135deg, #edf5ff 0%, #b8d1ff 50%, #1d4ed8 100%); }
  .media-voices { background-image: linear-gradient(135deg, #eff4ff 0%, #d3dcff 50%, #5b5bd6 100%); }
  .media-vitas { background-image: linear-gradient(135deg, #eef6ff 0%, #c5d9fb 45%, #2b5cce 100%); }
  .media-praxis { background-image: linear-gradient(135deg, #eefaff 0%, #c8ecf5 48%, #0891b2 100%); }
  .media-hallopetra { background-image: linear-gradient(135deg, #eef4ff 0%, #d6ddff 48%, #4f46e5 100%); }
  .media-alltag { background-image: linear-gradient(135deg, #eef6ff 0%, #d6e5ff 52%, #2563eb 100%); }
  .media-erreichbarkeit { background-image: linear-gradient(135deg, #f3f8ff 0%, #d8e8ff 44%, #2563eb 100%); }

  .card-category {
    display: inline-flex;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.08);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--blue);
  }

  .card-content {
    padding: 28px 0 0;
    display: flex;
    flex-direction: column;
    gap: 22px;
    min-height: 0;
  }

  .blog-card-featured .card-content {
    padding: 28px 0 0;
    max-width: none;
    gap: 22px;
  }

  .card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
  }

  .blog-card h3 {
    font-family: 'Inter', sans-serif;
    font-size: 19px;
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.26;
    color: var(--text-primary);
  }

  .blog-card-featured h3 {
    font-family: 'Inter', sans-serif;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.26;
    letter-spacing: -0.03em;
    max-width: none;
    white-space: normal;
  }

  .blog-card p {
    font-size: 15px;
    line-height: 1.96;
    color: var(--text-secondary);
    flex: 1;
    max-width: 58ch;
  }

  .card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    margin-top: auto;
    padding-top: 2px;
  }

  .card-date {
    font-size: 12px;
    color: #334155;
    letter-spacing: 0.02em;
  }

  .featured-section {
    display: none;
  }

  .card-arrow {
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: 1px solid rgba(37, 99, 235, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s var(--transition);
    background: transparent;
  }

  .blog-card:hover .card-arrow {
    background: var(--blue);
    border-color: var(--blue);
    transform: rotate(-45deg);
  }

  .card-arrow svg {
    width: 12px;
    height: 12px;
    color: var(--text-primary);
    transition: color 0.2s;
  }

  .blog-card:hover .card-arrow svg { color: white; }

  .card-reading {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    color: #1e3a8a;
    text-decoration: none;
    text-transform: uppercase;
    border-bottom: 0;
    padding-bottom: 0;
  }

  /* ── LIST ROW ── */
  .list-section {
    padding: 0 48px 80px;
    max-width: 1280px;
    margin: 0 auto;
  }

  .list-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 8px;
  }

  .post-row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 32px;
    padding: 24px 0;
    border-bottom: 1px solid var(--border-light);
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
  }

  .post-row::before {
    content: '';
    position: absolute;
    left: -16px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--blue);
    transform: scaleY(0);
    transition: transform 0.25s var(--transition);
    border-radius: 2px;
  }

  .pagination-section {
    padding: 0 48px 70px;
    max-width: 1280px;
    margin: 0 auto;
  }

  .pagination-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding-top: 18px;
    border-top: 1px solid rgba(226, 232, 240, 0.92);
  }

  .pagination-status {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #94a3b8;
  }

  .pagination-dots {
    display: inline-flex;
    align-items: center;
    gap: 12px;
  }

  .pagination-dot {
    display: block;
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    border-radius: 999px;
    background: #e5e7eb;
    border: 1px solid #e5e7eb;
    text-decoration: none;
    transition: transform 0.2s var(--transition), background 0.2s var(--transition), border-color 0.2s var(--transition), box-shadow 0.2s var(--transition);
  }

  .pagination-dot:hover {
    transform: scale(1.05);
    background: #dbeafe;
    border-color: rgba(37, 99, 235, 0.3);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.08);
  }

  .pagination-dot.active {
    background: #111827;
    border-color: #111827;
    box-shadow: 0 0 0 4px rgba(17, 24, 39, 0.06);
  }

  .post-row:hover::before { transform: scaleY(1); }

  .post-row:hover { padding-left: 8px; }

  .row-left { display: flex; gap: 20px; align-items: flex-start; }

  .row-num {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-muted);
    padding-top: 3px;
    min-width: 20px;
    font-feature-settings: 'tnum';
  }

  .row-body {}

  .row-cat {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--blue);
    margin-bottom: 4px;
  }

  .post-row h3 {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--text-primary);
    margin-bottom: 4px;
    transition: color 0.2s;
  }
  .post-row:hover h3 { color: var(--navy-mid); }

  .post-row p {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.5;
  }

  .row-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    flex-shrink: 0;
  }

  .row-date { font-size: 12px; color: var(--text-muted); white-space: nowrap; }

  .row-arrow {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s var(--transition);
    opacity: 0;
    transform: translateX(-4px);
  }
  .post-row:hover .row-arrow {
    opacity: 1;
    transform: translateX(0) rotate(-45deg);
    background: var(--navy);
    border-color: var(--navy);
  }
  .row-arrow svg {
    width: 13px;
    height: 13px;
    color: white;
  }

  /* ── NEWSLETTER ── */
  .newsletter-section {
    margin: 0 48px 80px;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 48px;
  }

  .newsletter-card {
    background: var(--navy);
    border-radius: 16px;
    padding: 56px 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
    position: relative;
    overflow: hidden;
  }

  .newsletter-card::before {
    content: '';
    position: absolute;
    top: -80px;
    right: -80px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(37,99,235,0.3) 0%, transparent 70%);
    pointer-events: none;
  }

  .newsletter-text h2 {
    font-size: 24px;
    font-weight: 600;
    color: white;
    letter-spacing: -0.025em;
    margin-bottom: 8px;
  }

  .newsletter-text p {
    font-size: 15px;
    color: rgba(255,255,255,0.55);
    line-height: 1.6;
    max-width: 360px;
  }

  .newsletter-form {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
  }

  .newsletter-input {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    padding: 12px 18px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.08);
    color: white;
    outline: none;
    width: 260px;
    transition: border-color 0.2s, background 0.2s;
  }

  .newsletter-input::placeholder { color: rgba(255,255,255,0.3); }
  .newsletter-input:focus {
    border-color: rgba(255,255,255,0.35);
    background: rgba(255,255,255,0.12);
  }

  .newsletter-btn {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--navy);
    background: white;
    border: none;
    border-radius: 10px;
    padding: 12px 24px;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.2s;
    white-space: nowrap;
  }
  .newsletter-btn:hover { opacity: 0.9; transform: translateY(-1px); }

  /* ── FOOTER ── */
    body {
      font-family: 'Inter', system-ui, sans-serif;
      background: transparent;
      min-height: auto;
      display: block;
    }
  
    footer {
      background: #0a0f1e;
      width: 100%;
      padding: clamp(56px, 7vw, 72px) clamp(24px, 6vw, 80px) 32px;
      position: relative;
      overflow: hidden;
    }
  
    footer::after {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(59,130,246,0.5) 30%, rgba(99,179,255,0.7) 50%, rgba(59,130,246,0.5) 70%, transparent);
    }
  
    .footer-inner {
      max-width: 1400px;
      margin: 0 auto;
    }
  
    .footer-top {
      display: grid;
      grid-template-columns: minmax(280px, 1.2fr) repeat(3, minmax(140px, 1fr));
      gap: clamp(32px, 4vw, 64px);
      padding-bottom: 56px;
      border-bottom: 1px solid rgba(255,255,255,0.07);
    }
  
    /* Logo: white text on same dark bg */
    .logo-wrap {
      margin-bottom: 16px;
    }
  
    .logo-img {
      height: 36px;
      width: auto;
      display: block;
      /* mix-blend-mode: screen makes black bg disappear, white text stays white */
      mix-blend-mode: screen;
    }
  
    .brand-desc {
      font-size: 14px;
      line-height: 1.7;
      color: rgba(255,255,255,0.45);
      margin-bottom: 28px;
      font-weight: 300;
      letter-spacing: 0.01em;
    }
  
    .contact-info {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-bottom: 28px;
    }
  
    .contact-info a {
      font-size: 13.5px;
      color: rgba(255,255,255,0.5);
      text-decoration: none;
      transition: color 0.2s;
    }
  
    .contact-info a:hover { color: rgba(255,255,255,0.85); }
  
    .social-row {
      display: flex;
      gap: 8px;
    }
  
    .social-btn {
      width: 34px;
      height: 34px;
      border-radius: 7px;
      border: 1px solid rgba(255,255,255,0.1);
      background: rgba(255,255,255,0.04);
      display: flex;
      align-items: center;
      justify-content: center;
      text-decoration: none;
      transition: all 0.2s;
    }
  
    .social-btn:hover {
      background: rgba(59,130,246,0.2);
      border-color: rgba(59,130,246,0.4);
      transform: translateY(-1px);
    }
  
    .social-btn svg {
      width: 15px; height: 15px;
      fill: rgba(255,255,255,0.6);
    }
  
    .social-btn:hover svg { fill: rgba(255,255,255,0.9); }
  
    .nav-col h5 {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.11em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.3);
      margin-bottom: 20px;
    }
  
    .nav-col ul {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 11px;
    }
  
    .nav-col ul li {
      display: flex;
      align-items: center;
      gap: 8px;
    }
  
    .nav-col ul li a {
      font-size: 14px;
      font-weight: 400;
      color: rgba(255,255,255,0.55);
      text-decoration: none;
      transition: color 0.18s;
    }
  
    .nav-col ul li a:hover { color: rgba(255,255,255,0.9); }
  
    .badge-hiring {
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      background: #1d4ed8;
      color: #fff;
      padding: 2px 7px;
      border-radius: 4px;
    }
  
    /* Trust bar */
    .trust-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 14px;
      padding: 24px 0;
      border-bottom: 1px solid rgba(255,255,255,0.07);
    }
  
    .avatar-stack {
      display: flex;
      align-items: center;
    }
  
    .avatar {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      border: 2.5px solid #0a0f1e;
      margin-left: -10px;
      overflow: hidden;
      flex-shrink: 0;
      position: relative;
    }
  
    .avatar:first-child { margin-left: 0; }
  
    .avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      /* zoom in to show face: shift upward slightly */
      object-position: center 15%;
      transform: scale(1.4);
      transform-origin: center 25%;
    }
  
    .trust-text {
      display: flex;
      flex-direction: column;
      gap: 3px;
    }
  
    .trust-count {
      font-size: 14px;
      font-weight: 600;
      color: rgba(255,255,255,0.9);
      letter-spacing: -0.02em;
    }
  
    .trust-stars {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 12.5px;
      color: rgba(255,255,255,0.4);
    }
  
    .stars { color: #fbbf24; letter-spacing: 1px; }
  
    .trust-links a {
      color: #60a5fa;
      text-decoration: none;
      font-weight: 500;
      transition: color 0.2s;
    }
  
    .trust-links a:hover { color: #93c5fd; text-decoration: underline; }
  
    /* Bottom */
    .footer-bottom {
      padding-top: 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 16px;
    }
  
    .copyright {
      font-size: 12.5px;
      color: rgba(255,255,255,0.28);
    }
  
    .bottom-links {
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
    }
  
    .bottom-links a {
      font-size: 12.5px;
      color: rgba(255,255,255,0.28);
      text-decoration: none;
      transition: color 0.18s;
    }
  
    .bottom-links a:hover { color: rgba(255,255,255,0.6); }
  
    .compliance-badges {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
    }
  
    .compliance-badge {
      font-size: 11px;
      color: rgba(255,255,255,0.3);
      border: 1px solid rgba(255,255,255,0.1);
      padding: 4px 10px;
      border-radius: 100px;
    }
  /* ── ANIMATIONS ── */
  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
  }

  .fade-up {
    opacity: 0;
    animation: fadeUp 0.5s var(--transition) forwards;
  }

  .fade-up-1 { animation-delay: 0.05s; }
  .fade-up-2 { animation-delay: 0.12s; }
  .fade-up-3 { animation-delay: 0.18s; }
  .fade-up-4 { animation-delay: 0.24s; }
  .fade-up-5 { animation-delay: 0.30s; }
  .fade-up-6 { animation-delay: 0.36s; }

  /* ── RESPONSIVE ── */
  @media (max-width: 1180px) {
    nav {
      padding-top: 12px;
      padding-bottom: 12px;
    }
    .nav-inner {
      flex-wrap: wrap;
      align-items: center;
    }
    .nav-links {
      position: static;
      left: auto;
      transform: none;
      order: 3;
      width: 100%;
      justify-content: center;
      flex-wrap: wrap;
      gap: 10px 22px;
      padding-top: 2px;
    }
    .nav-actions { margin-left: auto; }
    .footer-top {
      grid-template-columns: minmax(280px, 1.2fr) repeat(2, minmax(150px, 1fr));
      gap: 32px 28px;
    }
    .brand-col {
      grid-column: 1 / -1;
      max-width: 560px;
    }
  }

  @media (max-width: 1024px) {
    nav, .hero, .featured-section, .grid-section, .list-section, .pagination-section { padding-left: 24px; padding-right: 24px; }
    .hero {
      grid-template-columns: 1fr;
      gap: 14px;
      padding-bottom: 20px;
    }
    .hero-side {
      gap: 14px;
      padding-top: 0;
      max-width: 720px;
    }
    .hero-sub { max-width: 640px; }
    .filter-bar {
      max-width: 640px;
      gap: 8px;
    }
    .featured-card { grid-template-columns: 1fr; gap: 28px; padding: 28px 0 36px; }
    .featured-image { min-height: 340px; order: 1; }
    .featured-content { padding: 0; gap: 18px; order: 2; }
    .featured-content h2 { max-width: none; font-size: 34px; }
    .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
.blog-card-featured { grid-column: auto; min-height: 0; }
    .blog-card-featured .card-content { max-width: 100%; }
    .newsletter-section { padding: 0 24px; }
    .newsletter-card { flex-direction: column; gap: 32px; padding: 40px; }
    .newsletter-input { width: 220px; }
    footer { padding-left: 24px; padding-right: 24px; }
  }

  @media (max-width: 760px) {
    nav {
      padding-top: 12px;
      padding-bottom: 12px;
    }
    .nav-inner {
      align-items: flex-start;
      gap: 12px 16px;
    }
    .nav-logo img { height: 20px; }
    .nav-actions {
      order: 2;
      width: 100%;
      justify-content: flex-start;
      margin-left: 0;
      gap: 10px;
    }
    .nav-links {
      justify-content: flex-start;
      gap: 8px 16px;
      padding-top: 0;
    }
    .nav-links a { font-size: 13px; }
    .nav-divider { display: none; }
    .btn-ghost,
    .btn-primary {
      font-size: 13px;
      padding: 8px 10px;
    }
    .footer-top {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 28px 20px;
      padding-bottom: 40px;
    }
    .trust-bar {
      padding: 20px 0;
      align-items: flex-start;
      gap: 12px 20px;
    }
    .trust-stars {
      flex-wrap: wrap;
      gap: 8px;
    }
    .footer-bottom {
      flex-direction: column;
      align-items: flex-start;
      gap: 12px;
    }
  }

  @media (max-width: 640px) {
    nav, .hero, .featured-section, .grid-section, .list-section, .pagination-section, footer { padding-left: 20px; padding-right: 20px; }
    .hero {
      padding-top: 140px !important;
      padding-bottom: 18px;
    }
    h1.hero-title {
      font-size: clamp(30px, 10vw, 40px);
      line-height: 1;
    }
    .hero-sub {
      font-size: 15px;
      line-height: 1.56;
    }
    .filter-bar {
      gap: 6px;
      max-width: 100%;
    }
    .filter-chip {
      font-size: 12px;
      padding: 8px 12px;
    }
    .blog-grid { grid-template-columns: 1fr; }
    .card-media { height: 220px; }
    .featured-card { gap: 22px; }
    .featured-image { min-height: 260px; }
    .featured-content h2 { font-size: 30px; line-height: 1.02; }
    .blog-card h3,
    .blog-card-featured h3 { font-size: 20px; line-height: 1.24; white-space: normal; }
    .card-content { min-height: 0; padding-top: 20px; }
    .blog-card-featured { grid-column: auto; }
    .newsletter-form { flex-direction: column; }
    .newsletter-input { width: 100%; }
    .footer-top { grid-template-columns: 1fr; }
    .brand-col { max-width: none; }
    .logo-img { height: 32px; }
    .brand-desc { margin-bottom: 20px; }
    .contact-info { margin-bottom: 20px; }
    .nav-col ul { gap: 10px; }
    .nav-col ul li a,
    .contact-info a { font-size: 13px; }
    .avatar {
      width: 36px;
      height: 36px;
      margin-left: -8px;
    }
    .trust-count { font-size: 13.5px; }
    .trust-stars,
    .copyright,
    .bottom-links a { font-size: 12px; }
    .bottom-links { gap: 10px 16px; }
    .compliance-badges { gap: 8px; }
    .compliance-badge { font-size: 10.5px; }
  }

  @media (max-width: 460px) {
    nav, .hero, .featured-section, .grid-section, .list-section, .pagination-section, footer { padding-left: 16px; padding-right: 16px; }
    .nav-links { gap: 8px 14px; }
    .nav-links a,
    .btn-ghost,
    .btn-primary { font-size: 12.5px; }
    .btn-ghost,
    .btn-primary { padding: 7px 9px; }
    .filter-bar { gap: 6px; }
    .pagination-wrap {
      flex-direction: column;
      gap: 12px;
    }
  }



/* ══ TELFO NAV + FOOTER (from telfo-hero__.html) ══ */
/* ═══ NAV ═══ */
nav { position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:0 48px; height:62px; background:rgba(255,255,255,0.96); backdrop-filter:blur(10px); border-bottom:1px solid rgba(14,0,72,0.06); }
.nav-logo img { height:24px; width:auto; object-fit:contain; display:block; }
.nav-links { display:flex; gap:32px; list-style:none; }
.nav-links a { font-size:13px; font-weight:300; color:rgba(14,0,72,0.5); text-decoration:none; letter-spacing:-0.01em; transition:color .18s; }
.nav-links a:hover { color:#0E0048; }
.nav-right { display:flex; align-items:center; gap:2px; }
.nav-sep { color:#ddd; margin:0 8px; }
.nav-link-btn { background:none; border:none; font-family:'Inter',sans-serif; font-size:13px; font-weight:300; color:rgba(14,0,72,0.5); cursor:pointer; padding:7px 10px; border-radius:7px; transition:background .15s,color .15s; white-space:nowrap; }
.nav-link-btn:hover { background:rgba(14,0,72,0.04); color:#0E0048; }
.nav-cta { background:none; border:none; font-family:'Inter',sans-serif; font-size:13px; font-weight:500; color:#0D2FAA; cursor:pointer; padding:7px 10px; border-radius:7px; transition:background .15s; white-space:nowrap; }
.nav-cta:hover { background:rgba(13,47,170,0.06); }
.nav-hamburger { display:none; background:none; border:none; cursor:pointer; padding:8px; flex-direction:column; gap:5px; z-index:101; }
.nav-hamburger span { display:block; width:24px; height:1.5px; background:#0E0048; border-radius:2px; transition:transform .3s,opacity .3s; transform-origin:center; }
.nav-hamburger.is-open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-hamburger.is-open span:nth-child(2) { opacity:0; }
.nav-hamburger.is-open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
.mobile-menu { display:none; position:fixed; top:64px; left:0; right:0; background:#fff; border-bottom:1px solid rgba(14,0,72,0.08); z-index:99; flex-direction:column; padding:8px 24px 20px; box-shadow:0 8px 28px rgba(14,0,72,0.10); transform:translateY(-12px); opacity:0; transition:transform .3s cubic-bezier(0.4,0,0.2,1),opacity .25s ease; pointer-events:none; }
.mobile-menu.is-open { display:flex !important; transform:translateY(0); opacity:1; pointer-events:all; }
.mobile-menu a { font-size:15px; font-weight:300; color:#0E0048; text-decoration:none; padding:13px 4px; border-bottom:1px solid rgba(14,0,72,0.05); display:block; }
.mobile-menu .m-cta { margin-top:12px; background:linear-gradient(135deg,#0E0048,#09227C); color:#fff; border:none; border-radius:10px; padding:14px 20px; font-family:'Inter',sans-serif; font-size:14px; font-weight:500; cursor:pointer; width:100%; }

}
.vc-play-icon svg { width:11px; height:12px; margin-left:1px; }
.vc-dots { display:flex; gap:5px; align-items:center; flex-wrap:wrap; }
.vc-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(255,255,255,0.35);
  transition: background .3s, transform .3s;
  flex-shrink: 0;
}
.vc-dot.active { background: #fff; transform: scale(1.4); }

/* ═══ TABLET ═══ */
@media (min-width: 769px) and (max-width: 1024px) {
  nav { padding:0 24px; height:44px; }
  .nav-logo img { height:19px; }
  .nav-links { gap:16px; }
  .hero { padding-top:44px; }
}

/* ═══ MOBILE ═══ */
@media (max-width: 768px) {
  nav { padding:0 20px; height:40px; }
  .nav-logo img { height:18px; }
  .nav-links, .nav-right { display:none; }
  .nav-hamburger { display:flex; }
  .mobile-menu { display:flex; top:40px; }
  .hero-content { padding:52px 20px 0; }
  .hero h1 { font-size:clamp(34px,10vw,50px); }
  .trust-bar { gap:12px; }
  .trust-divider { display:none; }
  .call-btn { padding:15px 36px; font-size:12px; }
  .phone-input-row { flex-direction:column; }
  .phone-submit { width:100%; text-align:center; }
  .visualizer-wrap { height:50%; }
  .bar-seg { height:10px; }
  .bar-col { gap:10px; }
  .visualizer { gap:7px; padding:0 3px; }
  .logos-label { margin: 0 20px 10px; font-size: 10px; letter-spacing: .16em; }
  .logo-item { width:clamp(176px, 48vw, 224px); height:126px; padding:0; }
  .logo-item img { width:100%; max-width:none; max-height:none; height:100%; object-fit:cover; }
  .vg-header { padding:0 24px 36px; flex-direction:column; gap:14px; }
  .vg-header-left, .vg-header-right { width:100%; max-width:100%; }
  .vg-header h2 { font-size:clamp(28px,8vw,40px); }
  .vg-track { padding:0 0 0 24px; gap:14px; }
  .vc-card { width:320px; height:460px; }
  .logos-section { padding: 14px 0 22px; margin-bottom: 28px; }
  .keywords-strip { margin-top: 0; padding: 4px 0; }
  .keywords-track { gap: 20px; padding: 0 18px; }
  .keyword-item { padding-left: 10px; }
  .keyword-item::before { width: 4px; height: 4px; }
  .keyword-item h3 { font-size: 9px; letter-spacing: .12em; }
  .testimonial-section { padding: 20px 20px 10px; }
  .testimonial-card { min-height: 0; }
  .testimonial-card::after { left: 16px; right: 16px; bottom: 6px; height: 10px; }
  .testimonial-content {
    margin: 14px 12px 16px 12px;
    padding: 16px 14px 14px;
    border-radius: 10px;
  }
  .testimonial-content::after { width: 140px; height: 62px; right: 4px; }
  .testimonial-quote-mark { font-size: 40px; margin-bottom: 8px; }
  .testimonial-quote { font-size: 21px; line-height: 1.25; }
  .testimonial-meta { margin-top: 16px; padding-top: 12px; }
  .testimonial-name { font-size: 27px; }
  .testimonial-role { font-size: 17px; }
  .testimonial-image-wrap {
    position: relative;
    width: 100%;
    height: 182px;
    justify-content: center;
  }
  .testimonial-image { width: 168px; height: auto; object-fit: contain; object-position: center bottom; }
  .vg-section { padding: 6px 0 0; }
  .vg-track-outer { padding-bottom: 12px; }
}


/* ================================
   Telfo Testimonial (Jablonski)
   Strong scoped isolation
   Prefix: telfoTesti_
   ================================ */

.telfoTesti_wrap{
  /* Section positioning */
  width: min(1160px, calc(100% - 64px));
  margin: 70px auto 90px auto;
  padding: 0;
  position: relative;
}

/* Strong scoped reset inside section */
.telfoTesti_wrap, .telfoTesti_wrap *{
  box-sizing: border-box;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif !important;
}
.telfoTesti_wrap p{ margin: 0 !important; }
.telfoTesti_wrap img{ max-width: none !important; }

.telfoTesti_inner{
  border-radius: 18px;
  padding: 26px;
  background:
    radial-gradient(1200px 380px at 35% 55%, rgba(47,107,255,.08), transparent 55%),
    radial-gradient(900px 420px at 85% 70%, rgba(47,107,255,.10), transparent 60%),
    linear-gradient(180deg, #fbfcff 0%, #f2f5ff 100%);
  box-shadow: 0 18px 55px rgba(17,26,58,.12);
  border: 1px solid rgba(17,26,58,.06);
  position: relative;
  overflow: hidden;

  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 22px;
  align-items: center;
  min-height: 280px;
}

.telfoTesti_inner::after{
  content:"";
  position:absolute;
  inset:-40px;
  background: radial-gradient(900px 320px at 50% 50%, transparent 55%, rgba(17,26,58,.04) 100%);
  pointer-events:none;
  opacity:.35;
}

/* LEFT portrait pane: should not become a huge square */
.telfoTesti_photoPane{
  height: 240px;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  background: rgba(255,255,255,.35);
  border: 1px solid rgba(17,26,58,.06);
  box-shadow: 0 10px 26px rgba(17,26,58,.10);
}

.telfoTesti_photoPane::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(280px 220px at 30% 20%, rgba(255,255,255,.65), transparent 55%),
    linear-gradient(90deg, rgba(47,107,255,.10), transparent 55%);
  pointer-events:none;
  opacity:.55;
}

.telfoTesti_photo{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 20%;
  display:block;
  transform: translateY(6px);
  filter: saturate(1.02) contrast(1.02);
}

/* RIGHT side */
.telfoTesti_right{
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
}

/* background accents */
.telfoTesti_accent{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.8;
  z-index: 1;
}

.telfoTesti_wave{
  position:absolute;
  right:-140px;
  bottom:-70px;
  width:560px;
  height:290px;
  background:
    radial-gradient(closest-side at 20% 50%, rgba(47,107,255,.18), transparent 70%),
    radial-gradient(closest-side at 55% 70%, rgba(47,107,255,.12), transparent 72%),
    radial-gradient(closest-side at 85% 45%, rgba(47,107,255,.10), transparent 75%);
  filter: blur(2px);
  transform: rotate(-6deg);
}

.telfoTesti_dots{
  position:absolute;
  right:48px;
  bottom:34px;
  width:240px;
  height:120px;
  background:
    radial-gradient(circle at 10px 110px, rgba(47,107,255,.22) 0 2px, transparent 3px),
    radial-gradient(circle at 26px 100px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 42px 92px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 58px 84px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 74px 76px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 90px 68px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 106px 60px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 122px 52px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 138px 44px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 154px 38px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 170px 32px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 186px 28px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 202px 24px, rgba(47,107,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 218px 22px, rgba(47,107,255,.18) 0 2px, transparent 3px);
  opacity:.85;
  filter: blur(.15px);
}

/* GLASS card */
.telfoTesti_card{
  position:relative;
  z-index: 2;
  width: min(760px, 100%);
  margin-left: -52px;   /* key: overlap like the reference */
  padding: 26px 28px 22px 28px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.62));
  border: 1px solid rgba(17,26,58,.10);
  box-shadow: 0 18px 45px rgba(17,26,58,.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow:hidden;
}

.telfoTesti_card::before{
  content:"";
  position:absolute;
  inset:-1px;
  background:
    radial-gradient(520px 200px at 30% 10%, rgba(47,107,255,.12), transparent 60%),
    radial-gradient(380px 180px at 85% 35%, rgba(47,107,255,.08), transparent 65%);
  opacity:.65;
  pointer-events:none;
}

.telfoTesti_quoteIcon{
  position:absolute;
  top:20px;
  left:22px;
  width:34px;
  height:34px;
  opacity:.95;
  z-index:2;
}

.telfoTesti_content{
  position:relative;
  z-index:2;
  padding-left:46px;
}

.telfoTesti_text{
  font-size: 20px;
  line-height: 1.45;
  color: rgba(17,26,58,.92);
  margin: 0 0 16px 0 !important;
  letter-spacing: -0.12px;
}

.telfoTesti_text strong{
  font-weight: 700;
  color: rgba(17,26,58,.98);
}

.telfoTesti_divider{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(17,26,58,.12), transparent);
  margin: 16px 0 14px;
}

.telfoTesti_name{
  font-weight: 700;
  font-size: 16px;
  letter-spacing: -0.1px;
  color: rgba(17,26,58,.96);
}

.telfoTesti_role{
  margin-top: 3px !important;
  font-size: 13px;
  color: rgba(107,114,128,.95);
  font-weight: 500;
}

/* Responsive */
@media (max-width: 900px){
  .telfoTesti_wrap{
    width: calc(100% - 32px);
    margin: 54px auto 80px auto;
  }
  .telfoTesti_inner{
    grid-template-columns: 1fr;
    min-height: unset;
    gap: 14px;
    padding: 18px;
  }
  .telfoTesti_photoPane{
    height: 260px;
  }
  .telfoTesti_card{
    margin-left: 0;
    width: 100%;
  }
  .telfoTesti_dots{
    right: 16px;
    bottom: 18px;
    transform: scale(.9);
  }
  .telfoTesti_wave{
    right: -180px;
  }
}



.tf-site-footer {
    background: #0a0f1e;
    width: 100%;
    padding: 64px 80px calc(24px + env(safe-area-inset-bottom, 0px));
    position: relative;
    overflow: hidden;
    margin-top: -3px;
    margin-bottom: 0;
  }
.tf-site-footer::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -14px;
    height: 24px;
    background: #0a0f1e;
    pointer-events: none;
    z-index: 2;
  }
.tf-site-footer::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 6px;
    background: #0a0f1e;
    pointer-events: none;
    z-index: 2;
  }

  .tf-footer-inner {
    max-width: 1400px;
    margin: 0 auto;
  }

  .tf-footer-top {
    display: grid;
    grid-template-columns: 320px 1fr 1fr 1fr;
    gap: 64px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
  }

  /* Logo: white text on same dark bg */
  .tf-footer-logo-wrap {
    margin-bottom: 16px;
  }

  .tf-footer-logo-img {
    height: 38px;
    width: auto;
    display: block;
    filter: brightness(0) invert(1);
    opacity: 0.9;
  }

  .tf-footer-brand-desc {
    font-size: 14px;
    line-height: 1.7;
    color: rgba(255,255,255,0.75);
    margin-bottom: 28px;
    font-weight: 300;
    letter-spacing: 0.01em;
  }

  .tf-footer-contact-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 28px;
  }

  .tf-footer-contact-info a {
    font-size: 13.5px;
    color: rgba(255,255,255,0.78);
    text-decoration: none;
    transition: color 0.2s;
  }

  .tf-footer-contact-info a:hover { color: rgba(255,255,255,0.85); }

  .tf-footer-social-row {
    display: flex;
    gap: 8px;
  }

  .tf-footer-social-btn {
    width: 34px;
    height: 34px;
    border-radius: 7px;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.2s;
  }

  .tf-footer-social-btn:hover {
    background: rgba(59,130,246,0.2);
    border-color: rgba(59,130,246,0.4);
    transform: translateY(-1px);
  }

  .tf-footer-social-btn svg {
    width: 15px; height: 15px;
    fill: rgba(255,255,255,0.6);
  }

  .tf-footer-social-btn:hover svg { fill: rgba(255,255,255,0.9); }

  .tf-footer-nav-col h5 {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.65);
    margin-bottom: 20px;
  }

  .tf-footer-nav-col ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 11px;
  }

  .tf-footer-nav-col ul li {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .tf-footer-nav-col ul li a {
    font-size: 14px;
    font-weight: 400;
    color: rgba(255,255,255,0.82);
    text-decoration: none;
    transition: color 0.18s;
  }

  .tf-footer-nav-col ul li a:hover { color: rgba(255,255,255,0.9); }

  .tf-footer-badge-hiring {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: #1d4ed8;
    color: #fff;
    padding: 2px 7px;
    border-radius: 4px;
  }

  /* Trust bar */
  .tf-footer-trust-bar {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 24px 0;
    border-bottom: 1px solid rgba(255,255,255,0.07);
  }

  .tf-footer-avatar-stack {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
  }

  .tf-footer-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 2.5px solid #0a0f1e;
    margin-left: -10px;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
  }

  .tf-footer-avatar:first-child { margin-left: 0; }

  .tf-footer-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    /* zoom in to show face: shift upward slightly */
    object-position: center 15%;
    transform: scale(1.4);
    transform-origin: center 25%;
  }

  .tf-footer-trust-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }

  .tf-footer-trust-count {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255,255,255,0.9);
    letter-spacing: -0.02em;
  }

  .tf-footer-trust-stars {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    color: rgba(255,255,255,0.7);
  }

  .tf-footer-stars { color: #fbbf24; letter-spacing: 1px; }

  .tf-footer-trust-links a {
    color: #60a5fa;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
  }

  .tf-footer-trust-links a:hover { color: #93c5fd; text-decoration: underline; }

  /* Bottom */
  .tf-footer-bottom {
    padding-top: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
  }

  .tf-footer-copyright {
    font-size: 12.5px;
    color: rgba(255,255,255,0.55);
  }

  .tf-footer-bottom-links {
    display: flex;
    gap: 20px;
  }

  .tf-footer-bottom-links a {
    font-size: 12.5px;
    color: rgba(255,255,255,0.55);
    text-decoration: none;
    transition: color 0.18s;
  }

  .tf-footer-bottom-links a:hover { color: rgba(255,255,255,0.6); }

  .tf-footer-compliance-badges {
    display: flex;
    gap: 10px;
  }

  .tf-footer-compliance-badge {
    font-size: 11px;
    color: rgba(255,255,255,0.6);
    border: 1px solid rgba(255,255,255,0.2);
    padding: 4px 10px;
    border-radius: 100px;
  }

  /* ═══ FOOTER TABLET ═══ */
  @media (min-width: 769px) and (max-width: 1024px) {
    .tf-site-footer { padding: 48px 40px calc(24px + env(safe-area-inset-bottom, 0px)); }
    .tf-footer-top { grid-template-columns: 1fr 1fr; gap: 40px; }
  }

  /* ═══ FOOTER MOBILE ═══ */
  @media (max-width: 768px) {
    .tf-site-footer { padding: 40px 20px calc(24px + env(safe-area-inset-bottom, 0px)); }
    .tf-footer-top { grid-template-columns: 1fr; gap: 32px; }
    .tf-footer-trust-bar { flex-wrap: wrap; }
    .tf-footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
    .tf-footer-bottom-links { flex-wrap: wrap; gap: 12px; }
    .tf-footer-compliance-badges { flex-wrap: wrap; }
  }

:root {
  --telfo-blog-content-max: 1280px;
  --telfo-blog-gutter: clamp(20px, 3vw, 36px);
}

.tf-footer-inner {
  width: min(var(--telfo-blog-content-max), calc(100% - (var(--telfo-blog-gutter) * 2)));
  margin-left: auto;
  margin-right: auto;
}

/* Final surface override: keep the blog intro fully white during virtual
   scrolling instead of revealing the dark canvas underneath. */
html,
body,
#lenis-wrapper,
#lenis-content {
  background: #ffffff !important;
}

body {
  display: block !important;
  min-height: auto !important;
  padding: 0 !important;
}

html,
body,
#lenis-wrapper,
#lenis-content {
  background: #ffffff !important;
}

body {
  display: block !important;
  min-height: auto !important;
  padding: 0 !important;
}



/* ══ NAV CSS (telfo-hero__.html) ══ */
/* ═══ NAV ═══ */
nav { position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:0 48px; height:62px; background:rgba(255,255,255,0.96); backdrop-filter:blur(10px); border-bottom:1px solid rgba(14,0,72,0.06); }
.nav-logo img { height:24px; width:auto; object-fit:contain; display:block; }
.nav-links { display:flex; gap:32px; list-style:none; }
.nav-links a { font-size:13px; font-weight:300; color:rgba(14,0,72,0.5); text-decoration:none; letter-spacing:-0.01em; transition:color .18s; }
.nav-links a:hover { color:#0E0048; }
.nav-right { display:flex; align-items:center; gap:2px; }
.nav-sep { color:#ddd; margin:0 8px; }
.nav-link-btn { background:none; border:none; font-family:'Inter',sans-serif; font-size:13px; font-weight:300; color:rgba(14,0,72,0.5); cursor:pointer; padding:7px 10px; border-radius:7px; transition:background .15s,color .15s; white-space:nowrap; }
.nav-link-btn:hover { background:rgba(14,0,72,0.04); color:#0E0048; }
.nav-cta { background:none; border:none; font-family:'Inter',sans-serif; font-size:13px; font-weight:500; color:#0D2FAA; cursor:pointer; padding:7px 10px; border-radius:7px; transition:background .15s; white-space:nowrap; }
.nav-cta:hover { background:rgba(13,47,170,0.06); }
.nav-hamburger { display:none; background:none; border:none; cursor:pointer; padding:8px; flex-direction:column; gap:5px; z-index:101; }
.nav-hamburger span { display:block; width:24px; height:1.5px; background:#0E0048; border-radius:2px; transition:transform .3s,opacity .3s; transform-origin:center; }
.nav-hamburger.is-open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-hamburger.is-open span:nth-child(2) { opacity:0; }
.nav-hamburger.is-open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
.mobile-menu { display:none; position:fixed; top:64px; left:0; right:0; background:#fff; border-bottom:1px solid rgba(14,0,72,0.08); z-index:99; flex-direction:column; padding:8px 24px 20px; box-shadow:0 8px 28px rgba(14,0,72,0.10); transform:translateY(-12px); opacity:0; transition:transform .3s cubic-bezier(0.4,0,0.2,1),opacity .25s ease; pointer-events:none; }
.mobile-menu.is-open { display:flex !important; transform:translateY(0); opacity:1; pointer-events:all; }
.mobile-menu a { font-size:15px; font-weight:300; color:#0E0048; text-decoration:none; padding:13px 4px; border-bottom:1px solid rgba(14,0,72,0.05); display:block; }
.mobile-menu .m-cta { margin-top:12px; background:linear-gradient(135deg,#0E0048,#09227C); color:#fff; border:none; border-radius:10px; padding:14px 20px; font-family:'Inter',sans-serif; font-size:14px; font-weight:500; cursor:pointer; width:100%; }


  @media (max-width: 1024px) {
    nav { padding: 0 24px; }
    .topic-hubs-header-content { grid-template-columns: 1fr; }
    .topic-hubs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 768px) {
    nav { padding: 0 20px; height: 56px; }
    .nav-logo img { height: 20px; }
    .nav-links, .nav-right { display: none; }
    .nav-hamburger { display: flex; }
    .mobile-menu { top: 56px; }
    .topic-hubs-inner { padding: 48px 20px 56px; }
    .topic-hubs-grid { grid-template-columns: 1fr; gap: 10px; }
    .topic-hub-card { min-height: 0; padding: 22px 18px 18px; }
  }



/* ══ FOOTER CSS (telfo-hero__.html) ══ */
.tf-site-footer {
    background: #0a0f1e;
    width: 100%;
    padding: 64px 80px calc(24px + env(safe-area-inset-bottom, 0px));
    position: relative;
    overflow: hidden;
    margin-top: -3px;
    margin-bottom: 0;
  }
.tf-site-footer::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -14px;
    height: 24px;
    background: #0a0f1e;
    pointer-events: none;
    z-index: 2;
  }
.tf-site-footer::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 6px;
    background: #0a0f1e;
    pointer-events: none;
    z-index: 2;
  }

  .tf-footer-inner {
    max-width: 1400px;
    margin: 0 auto;
  }

  .tf-footer-top {
    display: grid;
    grid-template-columns: 320px 1fr 1fr 1fr;
    gap: 64px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
  }

  /* Logo: white text on same dark bg */
  .tf-footer-logo-wrap {
    margin-bottom: 16px;
  }

  .tf-footer-logo-img {
    height: 38px;
    width: auto;
    display: block;
    filter: brightness(0) invert(1);
    opacity: 0.9;
  }

  .tf-footer-brand-desc {
    font-size: 14px;
    line-height: 1.7;
    color: rgba(255,255,255,0.75);
    margin-bottom: 28px;
    font-weight: 300;
    letter-spacing: 0.01em;
  }

  .tf-footer-contact-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 28px;
  }

  .tf-footer-contact-info a {
    font-size: 13.5px;
    color: rgba(255,255,255,0.78);
    text-decoration: none;
    transition: color 0.2s;
  }

  .tf-footer-contact-info a:hover { color: rgba(255,255,255,0.85); }

  .tf-footer-social-row {
    display: flex;
    gap: 8px;
  }

  .tf-footer-social-btn {
    width: 34px;
    height: 34px;
    border-radius: 7px;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.2s;
  }

  .tf-footer-social-btn:hover {
    background: rgba(59,130,246,0.2);
    border-color: rgba(59,130,246,0.4);
    transform: translateY(-1px);
  }

  .tf-footer-social-btn svg {
    width: 15px; height: 15px;
    fill: rgba(255,255,255,0.6);
  }

  .tf-footer-social-btn:hover svg { fill: rgba(255,255,255,0.9); }

  .tf-footer-nav-col h5 {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.65);
    margin-bottom: 20px;
  }

  .tf-footer-nav-col ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 11px;
  }

  .tf-footer-nav-col ul li {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .tf-footer-nav-col ul li a {
    font-size: 14px;
    font-weight: 400;
    color: rgba(255,255,255,0.82);
    text-decoration: none;
    transition: color 0.18s;
  }

  .tf-footer-nav-col ul li a:hover { color: rgba(255,255,255,0.9); }

  .tf-footer-badge-hiring {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: #1d4ed8;
    color: #fff;
    padding: 2px 7px;
    border-radius: 4px;
  }

  /* Trust bar */
  .tf-footer-trust-bar {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 24px 0;
    border-bottom: 1px solid rgba(255,255,255,0.07);
  }

  .tf-footer-avatar-stack {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
  }

  .tf-footer-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 2.5px solid #0a0f1e;
    margin-left: -10px;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
  }

  .tf-footer-avatar:first-child { margin-left: 0; }

  .tf-footer-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    /* zoom in to show face: shift upward slightly */
    object-position: center 15%;
    transform: scale(1.4);
    transform-origin: center 25%;
  }

  .tf-footer-trust-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }

  .tf-footer-trust-count {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255,255,255,0.9);
    letter-spacing: -0.02em;
  }

  .tf-footer-trust-stars {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    color: rgba(255,255,255,0.7);
  }

  .tf-footer-stars { color: #fbbf24; letter-spacing: 1px; }

  .tf-footer-trust-links a {
    color: #60a5fa;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
  }

  .tf-footer-trust-links a:hover { color: #93c5fd; text-decoration: underline; }

  /* Bottom */
  .tf-footer-bottom {
    padding-top: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
  }

  .tf-footer-copyright {
    font-size: 12.5px;
    color: rgba(255,255,255,0.55);
  }

  .tf-footer-bottom-links {
    display: flex;
    gap: 20px;
  }

  .tf-footer-bottom-links a {
    font-size: 12.5px;
    color: rgba(255,255,255,0.55);
    text-decoration: none;
    transition: color 0.18s;
  }

  .tf-footer-bottom-links a:hover { color: rgba(255,255,255,0.6); }

  .tf-footer-compliance-badges {
    display: flex;
    gap: 10px;
  }

  .tf-footer-compliance-badge {
    font-size: 11px;
    color: rgba(255,255,255,0.6);
    border: 1px solid rgba(255,255,255,0.2);
    padding: 4px 10px;
    border-radius: 100px;
  }

  /* ═══ FOOTER TABLET ═══ */
  @media (min-width: 769px) and (max-width: 1024px) {
    .tf-site-footer { padding: 48px 40px calc(24px + env(safe-area-inset-bottom, 0px)); }
    .tf-footer-top { grid-template-columns: 1fr 1fr; gap: 40px; }
  }

  /* ═══ FOOTER MOBILE ═══ */
  @media (max-width: 768px) {
    .tf-site-footer { padding: 40px 20px calc(24px + env(safe-area-inset-bottom, 0px)); }
    .tf-footer-top { grid-template-columns: 1fr; gap: 32px; }
    .tf-footer-trust-bar { flex-wrap: wrap; }
    .tf-footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
    .tf-footer-bottom-links { flex-wrap: wrap; gap: 12px; }
    .tf-footer-compliance-badges { flex-wrap: wrap; }
  }