/* =========================================================
   TBS AI Video Production Page — Premium Layer
   1. Premium icon tiles ("logo" badges)
   2. Faded floating decor elements
   3. GSAP motion helpers
   4. Mobile / touch hardening
   Prefix: tbs_avp_   Specificity trick: .tbs_avp_wrap.tbs_avp_wrap
   Loaded LAST so it refines every section module.
   ========================================================= */

/* ─────────────────────────────────────────────────────────
   1. ICON TILES — Phosphor duotone (MIT), inline SVG, 2D
   A solid brand-gradient rounded square with a white duotone glyph.
   Low specificity on purpose: the Elementor "Icon Tile" controls win.
   ───────────────────────────────────────────────────────── */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_icon,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_ads_feature_icon,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_pillar_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_callout_icon {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    overflow: hidden;
    color: #ffffff;
    background: linear-gradient(145deg, #22C7CC 0%, #17A5B8 48%, #197095 100%);
    border: 0;
    box-shadow:
        0 12px 24px -10px rgba(25, 112, 149, 0.6),
        inset 0 0 0 1px rgba(255, 255, 255, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.4);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease;
}

/* soft top light */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_icon_box::before,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_icon_box::before,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_icon::before,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_icon_box::before,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_ads_feature_icon::before,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_icon_box::before,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_pillar_icon_box::before,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_callout_icon::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 55%);
}

/* the glyph */
.tbs_avp_wrap.tbs_avp_wrap svg.tbs_avp_ico {
    position: relative;
    z-index: 1;
    display: block;
    width: 28px;
    height: 28px;
    flex: none;
    fill: currentColor;
    stroke: none;
    stroke-width: 0;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_card:hover .tbs_avp_service_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_card:hover .tbs_avp_industry_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_card:hover .tbs_avp_benefit_icon,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_card:hover .tbs_avp_process_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_ads_feature_item:hover .tbs_avp_ads_feature_icon,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_card:hover .tbs_avp_why_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_intro_pillar_card:hover .tbs_avp_pillar_icon_box {
    transform: translateY(-3px);
    box-shadow:
        0 16px 28px -10px rgba(25, 112, 149, 0.7),
        inset 0 0 0 1px rgba(255, 255, 255, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_card:hover .tbs_avp_service_icon_box svg.tbs_avp_ico,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_card:hover .tbs_avp_industry_icon_box svg.tbs_avp_ico,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_card:hover .tbs_avp_benefit_icon svg.tbs_avp_ico,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_card:hover .tbs_avp_process_icon_box svg.tbs_avp_ico,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_ads_feature_item:hover .tbs_avp_ads_feature_icon svg.tbs_avp_ico,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_card:hover .tbs_avp_why_icon_box svg.tbs_avp_ico,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_intro_pillar_card:hover .tbs_avp_pillar_icon_box svg.tbs_avp_ico {
    transform: scale(1.1);
}

/* tighter spots */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_pillar_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_ads_feature_icon {
    width: 50px;
    height: 50px;
    border-radius: 14px;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_callout_icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    color: #3EE0E6;
    background: rgba(62, 224, 230, 0.12);
    box-shadow: inset 0 0 0 1px rgba(62, 224, 230, 0.35);
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_callout_icon::before {
    display: none;
}

/* ─────────────────────────────────────────────────────────
   1b. LAYOUT BALANCE — one rhythm for every card grid
   ───────────────────────────────────────────────────────── */
.tbs_avp_wrap.tbs_avp_wrap {
    --tbs_avp_gap: clamp(18px, 2vw, 26px);
    --tbs_avp_pad: clamp(24px, 2.3vw, 32px);
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_services_bento,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industries_grid,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefits_grid,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_grid,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_grid {
    gap: var(--tbs_avp_gap);
    align-items: stretch;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_card,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_card,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_card,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_card,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_card {
    padding: var(--tbs_avp_pad);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

/* icon row → title: identical distance in every section */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_top_meta,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_top,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_header {
    width: 100%;
    margin-bottom: 22px;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_icon_box,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_icon_box {
    margin-bottom: 22px;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_card_title,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_card_title,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_title,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_title,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_card_title {
    font-size: clamp(17px, 1.35vw, 19.5px);
    line-height: 1.3;
    margin: 0 0 10px;
    text-wrap: balance;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_card_desc,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_card_desc,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_desc,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_desc,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_card_desc {
    font-size: 15px;
    line-height: 1.7;
    margin: 0;
    max-width: none;
    text-wrap: pretty;
    flex-grow: 0;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_card:hover,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_card:hover,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_card:hover,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_card:hover,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_card:hover {
    transform: translateY(-4px);
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_section_subtitle,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_intro_text p {
    text-wrap: pretty;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_section_title {
    text-wrap: balance;
}

/* ─────────────────────────────────────────────────────────
   2. FLOATING DECOR — minimal line-art
   Hairline geometry only: no glow, no blur, no fills. Reads as
   viewfinder / timeline marks that suit a video studio.
   Structure: .tbs_avp_float (GSAP parallax) > .tbs_avp_float_shape (slow drift)
   ───────────────────────────────────────────────────────── */
.tbs_avp_wrap.tbs_avp_wrap {
    --tbs_avp_float_c: #17B0B5;               /* light sections (Elementor control) */
    --tbs_avp_float_c_dark: #5EEAF0;          /* dark sections  (Elementor control) */
    --tbs_avp_float_o: 1;                     /* global intensity multiplier  */
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float {
    position: absolute;
    left: var(--x, 50%);
    top: var(--y, 50%);
    width: var(--s, 80px);
    height: var(--s, 80px);
    z-index: 1;
    pointer-events: none;
    user-select: none;
    will-change: transform;
    opacity: calc(var(--o, 0.5) * var(--tbs_avp_float_o));
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float_shape {
    display: block;
    width: 100%;
    height: 100%;
    color: var(--tbs_avp_float_c);
    animation: tbs_avp_drift calc(var(--dur, 14s) * 0.55) ease-in-out var(--delay, 0s) infinite alternate;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_showcase_section .tbs_avp_float_shape,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_cta_section .tbs_avp_float_shape {
    color: var(--tbs_avp_float_c_dark);
}

@keyframes tbs_avp_drift {
    0%   { transform: translate3d(0, 0, 0) rotate(0deg); }
    50%  { transform: translate3d(22px, -30px, 0) rotate(6deg); }
    100% { transform: translate3d(-18px, -52px, 0) rotate(-5deg); }
}

/* thin ring */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float_ring .tbs_avp_float_shape {
    border-radius: 50%;
    border: 1px solid currentColor;
}

/* viewfinder corner brackets */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float_bracket .tbs_avp_float_shape {
    --l: 18px;
    background:
        linear-gradient(currentColor, currentColor) 0 0 / var(--l) 1px no-repeat,
        linear-gradient(currentColor, currentColor) 0 0 / 1px var(--l) no-repeat,
        linear-gradient(currentColor, currentColor) 100% 0 / var(--l) 1px no-repeat,
        linear-gradient(currentColor, currentColor) 100% 0 / 1px var(--l) no-repeat,
        linear-gradient(currentColor, currentColor) 0 100% / var(--l) 1px no-repeat,
        linear-gradient(currentColor, currentColor) 0 100% / 1px var(--l) no-repeat,
        linear-gradient(currentColor, currentColor) 100% 100% / var(--l) 1px no-repeat,
        linear-gradient(currentColor, currentColor) 100% 100% / 1px var(--l) no-repeat;
}

/* hairline cross */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float_plus .tbs_avp_float_shape {
    background:
        linear-gradient(currentColor, currentColor) center / 100% 1px no-repeat,
        linear-gradient(currentColor, currentColor) center / 1px 100% no-repeat;
}

/* timeline ruler ticks */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float_ruler .tbs_avp_float_shape {
    height: 14px;
    margin-top: calc(var(--s, 80px) / 2 - 7px);
    background:
        linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat,
        repeating-linear-gradient(90deg, currentColor 0 1px, transparent 1px 10px) 0 100% / 100% 50% no-repeat;
}

/* quiet dot grid */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float_dots .tbs_avp_float_shape {
    background-image: radial-gradient(currentColor 1.2px, transparent 1.6px);
    background-size: 16px 16px;
}

/* ─────────────────────────────────────────────────────────
   3. GSAP MOTION HELPERS
   Nothing is hidden in CSS. JS sets the "from" state with
   gsap.from() *after* the wrapper unveils, so a JS failure can
   never leave content invisible. will-change is only applied to
   items that are actually animating.
   ───────────────────────────────────────────────────────── */
.tbs_avp_wrap.tbs_avp_wrap [data-tbs-avp-anim] {
    will-change: transform, opacity;
}

.tbs_avp_wrap.tbs_avp_wrap [data-tbs-avp-anim].tbs_avp_anim_done {
    will-change: auto;
}

/* Magnetic/tilt cards need their own compositing layer on hover only */
.tbs_avp_wrap.tbs_avp_wrap [data-tbs-avp-tilt] {
    transform-style: preserve-3d;
}

/* ─────────────────────────────────────────────────────────
   4. MOBILE / TOUCH HARDENING
   ───────────────────────────────────────────────────────── */
.tbs_avp_wrap.tbs_avp_wrap {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    max-width: 100vw;
    overflow-x: clip;
}

.tbs_avp_wrap.tbs_avp_wrap img,
.tbs_avp_wrap.tbs_avp_wrap video,
.tbs_avp_wrap.tbs_avp_wrap iframe,
.tbs_avp_wrap.tbs_avp_wrap svg {
    max-width: 100%;
}

.tbs_avp_wrap.tbs_avp_wrap h1,
.tbs_avp_wrap.tbs_avp_wrap h2,
.tbs_avp_wrap.tbs_avp_wrap h3,
.tbs_avp_wrap.tbs_avp_wrap p,
.tbs_avp_wrap.tbs_avp_wrap a {
    overflow-wrap: anywhere;
    word-break: normal;
}

/* Grid/flex children may never force the page wider than the viewport */
.tbs_avp_wrap.tbs_avp_wrap [class*="_grid"] > *,
.tbs_avp_wrap.tbs_avp_wrap [class*="_bento"] > *,
.tbs_avp_wrap.tbs_avp_wrap [class*="_layout"] > * {
    min-width: 0;
}

/* Touch devices: no sticky hover lift, keep tap feedback instead */
@media (hover: none) {
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_btn:hover {
        translate: 0 0;
    }
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_btn:active {
        translate: 0 1px;
        filter: brightness(0.96);
    }
}

/* Minimum comfortable tap targets */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_filter_btn,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_faq_toggle,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_modal_close {
    min-height: 44px;
    touch-action: manipulation;
}

@media (max-width: 1024px) {
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float[data-tablet="0"] {
        display: none;
    }
}

@media (max-width: 767px) {
    /* Keep decor, but quieter and smaller so it never competes with copy */
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float {
        opacity: calc(var(--o, 0.5) * var(--tbs_avp_float_o) * 0.6);
        width: calc(var(--s, 80px) * 0.65);
        height: calc(var(--s, 80px) * 0.65);
    }
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float[data-mobile="0"] {
        display: none;
    }

    /* Icon tiles: slightly smaller so card text gets room */
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_service_icon_box,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_icon_box,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_why_icon_box,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_industry_icon_box,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefit_icon {
        width: 52px;
        height: 52px;
        border-radius: 15px;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_section_header {
        margin-bottom: 36px;
        padding: 0 4px;
    }
}

@media (max-width: 480px) {
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_section_title {
        font-size: clamp(26px, 8vw, 32px);
    }
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_title {
        font-size: clamp(30px, 9vw, 38px);
    }
}

/* ─────────────────────────────────────────────────────────
   5. REDUCED MOTION — kill every decorative loop
   ───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_float_shape {
        animation: none;
    }
    .tbs_avp_wrap.tbs_avp_wrap [data-tbs-avp-anim] {
        will-change: auto;
    }
}

/* ─────────────────────────────────────────────────────────
   6. SHOWCASE HOVER GLITCH FIX
   A scaled <img> inside an overflow:hidden box that sits in a card which is
   itself translating on hover makes Chrome/Edge repaint the thumbnail's
   bottom edge unevenly — a flickering 1px white/grey "scanline". Fixes:
   - the <img> was display:inline (baseline gap under it) → block
   - the thumb gets its own compositing + paint-containment layer so the
     scaled image is clipped on the GPU, not re-rasterised each frame
   - the scaled layers are promoted ahead of time (backface-visibility +
     will-change) instead of mid-transition
   ───────────────────────────────────────────────────────── */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_showcase_thumb_wrap {
    isolation: isolate;
    contain: paint;
    transform: translateZ(0);
    border-radius: inherit;
    background-color: #061216;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_showcase_poster,
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_poster_art {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    will-change: transform;
    transform-origin: 50% 50%;
}

/* Scrim extends 1px past the box so no sub-pixel seam can show at the edge */
.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_showcase_thumb_scrim {
    inset: -1px;
}

.tbs_avp_wrap.tbs_avp_wrap .tbs_avp_showcase_card {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_showcase_poster,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_poster_art {
        will-change: auto;
    }
}

/* ─────────────────────────────────────────────────────────
   7. MOBILE — LEFT-ALIGNED TITLES & CAPTIONS (≤767px)
   Loaded last so it wins over each section's centred mobile rules.
   Elementor "Alignment" controls (higher specificity) still override.
   ───────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_content,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_section_header,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_intro_content,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_services_footer_cta,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_footer,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefits_callout,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_cta_card,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_cta_title,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_cta_desc {
        text-align: left;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_section_header,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_process_footer,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_desc,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_ctas,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_trust_bar {
        margin-left: 0;
        margin-right: 0;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_ctas,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_trust_bar,
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_cta_actions {
        justify-content: flex-start;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_benefits_callout {
        align-items: flex-start;
    }
}

/* ─────────────────────────────────────────────────────────
   8. MOBILE HERO — one-line buttons, centred stat tiles
   ───────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    /* Labels stay on ONE line: the type and padding shrink with the screen instead */
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_ctas .tbs_avp_btn {
        flex: 1 1 100%;
        white-space: nowrap;
        font-size: clamp(12px, 3.7vw, 14.5px);
        padding: 14px clamp(12px, 4vw, 20px);
        gap: 6px;
        letter-spacing: -0.01em;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_hero_ctas .tbs_avp_btn_icon {
        flex: none;
        width: 16px;
        height: 16px;
    }

    /* Stat tiles read better centred when stacked */
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_trust_stat {
        width: 100%;
        align-items: center;
        text-align: center;
    }
}

/* ─────────────────────────────────────────────────────────
   9. MOBILE — EVERY BUTTON ON ONE LINE (all sections)
   Type and side padding scale with the screen width so even long labels
   fit; `min-width:0` + `max-width:100%` keep them inside the card.
   ───────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_btn {
        max-width: 100%;
        min-width: 0;
        white-space: nowrap;
        font-size: clamp(12px, 3.7vw, 15px);
        padding: 14px clamp(12px, 4vw, 22px);
        gap: 6px;
        letter-spacing: -0.01em;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_btn .tbs_avp_btn_icon {
        flex: none;
        width: 16px;
        height: 16px;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_cta_actions {
        width: 100%;
        gap: 12px;
    }

    .tbs_avp_wrap.tbs_avp_wrap .tbs_avp_cta_actions .tbs_avp_btn {
        flex: 1 1 100%;
        width: 100%;
    }
}