/* =========================================================
   TBS Local SEO Page — Widget Styles
   Brand colors: #17B0B5 (medium cyan) / #197095 (dark cyan)
   ========================================================= */

.tbs-lseo-wrap.tbs-lseo-wrap {
    overflow: hidden;
    font-family: 'Poppins', sans-serif;
}

.tbs-lseo-wrap.tbs-lseo-wrap * {
    box-sizing: border-box;
}

/* ── SCROLL-REVEAL ANIMATION BASELINE ────────────────────── */
/* Opacity/transform intentionally carry no !important — GSAP drives the
   actual animation via inline styles (tbs-local-seo-page-script.js) and
   would be paralyzed if the stylesheet fought it with !important. These
   rules only set the pre-animation "hidden" starting point so there's no
   flash of fully-visible content before GSAP/ScrollTrigger takes over. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-reveal.tbs-lseo-reveal {
    opacity: 0;
    transform: translateY(32px);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-reveal-scale.tbs-lseo-reveal-scale {
    opacity: 0;
    transform: scale(0.92);
}

/* Editor exemption: never leave content invisible while building the page
   in Elementor, regardless of whether GSAP has run yet. */
body.elementor-editor-active .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-reveal.tbs-lseo-reveal,
body.elementor-editor-active .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-reveal-scale.tbs-lseo-reveal-scale {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-reveal.tbs-lseo-reveal,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-reveal-scale.tbs-lseo-reveal-scale {
        opacity: 1;
        transform: none;
    }
}

/* ── BUTTON — SHORT MOBILE TEXT ──────────────────────────── */
/* Some button labels ("Explore All Optimization Features", "Grow Your
   Business in Bangladesh", ...) are fine at desktop widths but wrap to two
   lines once a button shrinks to fit a phone. Every such button renders
   both a full-length span and a short mobile-only span (see each button's
   "Button Text (Mobile)" control); only one is ever visible per
   breakpoint, swapped in the 767px media query below. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-btn-text-short {
    display: none;
}

/* ── HERO ───────────────────────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero {
    position: relative;
    overflow: hidden;
    padding: 100px 40px;
    background-color: #F2FAFB;
    background-repeat: no-repeat;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-inner {
    position: relative;
    z-index: 1;
    display: flex;
    /* stretch (the flex default) instead of center — makes the media column
       match the text column's height dynamically, whatever the copy length. */
    align-items: stretch;
    gap: 56px;
    max-width: 1180px;
    /* Needed so this still spans the full section width once the "Section
       Height" control turns .tbs-lseo-hero itself into a flex container to
       vertically center this — without it, a flex item shrink-to-fits by
       default instead of filling its row, squeezing the two-column layout
       inside down to whatever the content happens to need. Harmless when
       .tbs-lseo-hero stays a normal block (the default, unsized case). */
    width: 100%;
    margin: 0 auto;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-media {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 45%;
    max-width: 45%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-text {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-heading {
    margin: 0 0 20px;
    font-size: 44px;
    line-height: 1.18;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-subheading {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-subheading p {
    margin: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-subheading strong {
    font-weight: 700;
    color: #0E2A33;
}

/* ── BUTTON ──────────────────────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-btn {
    display: inline-block;
    margin-top: 32px;
    padding: 16px 40px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

/* ── DECORATIVE GLOW BLOBS ───────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    z-index: 0;
    pointer-events: none;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-glow-1 {
    width: 340px;
    height: 340px;
    top: -120px;
    right: -80px;
    background: radial-gradient(circle, rgba(23, 176, 181, 0.35), rgba(23, 176, 181, 0) 70%);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-glow-2 {
    width: 300px;
    height: 300px;
    bottom: -100px;
    left: -80px;
    background: radial-gradient(circle, rgba(25, 112, 149, 0.30), rgba(25, 112, 149, 0) 70%);
}

/* ── DECORATIVE GROWTH CHART ────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-chart {
    --tbs-lseo-chart-color-1: #17B0B5;
    --tbs-lseo-chart-color-2: #197095;
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-chart svg {
    /* Both dimensions are bound to the (now dynamically matched) column
       height/width; preserveAspectRatio="xMidYMax meet" on the <svg> itself
       scales the chart proportionally to fit without distortion. */
    width: 100%;
    height: 100%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-grad-stop-1 {
    stop-color: var(--tbs-lseo-chart-color-1);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-grad-stop-2 {
    stop-color: var(--tbs-lseo-chart-color-2);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-line {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bar {
    /* Height/transform is driven per-frame by tbs-local-seo-page-script.js
       (a small requestAnimationFrame loop), not a CSS animation — this keeps
       the trend line's points in perfect sync with the bars every frame,
       and avoids the CSS-animation-vs-page-load stutter on first paint. */
    transform-box: fill-box;
    transform-origin: bottom center;
}

/* Data-point dots at each bar/line junction. Position (cx/cy) is updated
   every frame by the same JS loop that moves the bars and line, so the
   dots travel with them; the pulse itself is a separate CSS `transform`
   animation (scale/opacity), which never conflicts with JS since JS only
   ever touches the cx/cy attributes, not transform. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot {
    fill: #ffffff;
    stroke: var(--tbs-lseo-chart-color-2);
    stroke-width: 2;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse {
    fill: var(--tbs-lseo-chart-color-1);
    opacity: 0.55;
    transform-box: fill-box;
    transform-origin: center;
    animation-name: tbs-lseo-dot-pulse;
    animation-duration: 2.6s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse-1 { animation-delay: 0s; }
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse-2 { animation-delay: 0.3s; }
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse-3 { animation-delay: 0.6s; }
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse-4 { animation-delay: 0.9s; }
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse-5 { animation-delay: 1.2s; }
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse-6 { animation-delay: 1.5s; }

@keyframes tbs-lseo-dot-pulse {
    0%   { transform: scale(0.5); opacity: 0.6; }
    100% { transform: scale(2.4); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-chart-dot-pulse {
        animation: none;
        opacity: 0;
    }
}

/* ── HIDDEN BUSINESS SECTION ─────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden {
    position: relative;
    background-color: #ffffff;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-inner {
    display: flex;
    align-items: center;
    gap: 56px;
    max-width: 1180px;
    margin: 0 auto;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-text {
    flex: 0 0 65%;
    max-width: 65%;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-media {
    flex: 0 0 35%;
    max-width: 35%;
    overflow: hidden;
    border-radius: 24px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-heading {
    margin: 0 0 20px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-body {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-body p {
    margin: 0 0 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-body p:last-child {
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-body strong {
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-btn {
    display: inline-block;
    margin-top: 28px;
    padding: 15px 36px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 5;
    /* object-fit intentionally not set here — see the matching note on
       .tbs-lseo-faq-img: owned entirely by the "Image Fit" control. */
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-placeholder {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 5;
    width: 100%;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-pin-icon {
    position: relative;
    z-index: 1;
    width: 25%;
    height: auto;
    filter: drop-shadow(0 8px 14px rgba(10, 45, 58, 0.35));
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-ping {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 90px;
    height: 90px;
    margin: -45px 0 0 -45px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.45);
    animation: tbs-lseo-ping 3s ease-out infinite;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-ping-2 {
    animation-delay: 1.5s;
}

@keyframes tbs-lseo-ping {
    0%   { transform: scale(0.4); opacity: 0.7; }
    100% { transform: scale(2.6); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-ping {
        animation: none;
        opacity: 0;
    }
}

/* ── SERVICES SECTION ────────────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services {
    position: relative;
    background-color: #F2FAFB;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-inner {
    max-width: 1180px;
    margin: 0 auto;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-heading {
    margin: 0 0 20px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-intro {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-intro p {
    margin: 0 0 16px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-intro p:last-child {
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-intro strong {
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-list {
    list-style: none;
    margin: 32px 0 0;
    padding: 0;
    /* Masonry-style 2-column layout via CSS multi-column: items flow down
       column 1 then column 2 and pack against uneven card heights, with no
       JS needed. Reflows to a single column at the mobile breakpoint below.
       column-gap itself is intentionally NOT set here — see the note on
       .tbs-lseo-services-item below; it's owned by the "Space Between
       Features" control, same as that control's margin-bottom output. */
    column-count: 2;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
    /* background-color, border-radius, padding, box-shadow, and
       margin-bottom are intentionally NOT set here — the "Feature Card"
       and "Space Between Features" style controls always emit their own
       default values at this exact selector's specificity, so a static
       fallback here would tie with them and the winner would depend on
       unpredictable stylesheet load order instead of the chosen value. */
    /* Only box-shadow transitions here — this element also carries
       .tbs-lseo-reveal, whose GSAP tween owns opacity/transform. A
       stylesheet rule fighting GSAP for either would lose (GSAP's inline
       style always wins), so the hover state below stays clear of them. */
    transition: box-shadow 0.25s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-item:hover {
    box-shadow: 0 18px 36px rgba(14, 42, 51, 0.14);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-item:last-child {
    /* Multi-column layout can't rely on flex `gap` (no row after the last
       item to absorb), so margin-bottom drives spacing instead — zero it
       on the last item so the button below isn't pushed down twice. */
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-icon {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    box-shadow: 0 8px 16px rgba(23, 112, 149, 0.25);
    /* Safety net: whatever size the icon glyph/svg wants to render at
       natively, it can never visually spill outside the icon box. */
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-icon img {
    width: 55%;
    height: 55%;
    object-fit: contain;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-icon i,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-icon svg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42%;
    height: 42%;
    max-width: 26px;
    max-height: 26px;
    line-height: 1;
    color: inherit;
    fill: currentColor;
    text-align: center;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-icon i:before {
    font-size: 20px;
    line-height: 1;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-text {
    padding-top: 2px;
    font-size: 17px;
    line-height: 1.7;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-title {
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-btn {
    display: block;
    width: fit-content;
    margin: 36px auto 0;
    padding: 15px 36px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

/* ── BANGLADESH & DHAKA SECTION ──────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd {
    position: relative;
    background-color: #ffffff;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-inner {
    display: flex;
    align-items: center;
    gap: 56px;
    max-width: 1180px;
    margin: 0 auto;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-media {
    position: relative;
    flex: 0 0 42%;
    max-width: 42%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-text {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 5;
    /* object-fit and border-radius intentionally not set here — see the
       matching note on .tbs-lseo-faq-img: both owned entirely by the
       "Image Fit" / "Corner Radius" controls. */
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-placeholder {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 5;
    width: 100%;
    border-radius: 24px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-map-lines {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-pin-icon {
    position: relative;
    z-index: 1;
    width: 22%;
    height: auto;
    filter: drop-shadow(0 8px 14px rgba(10, 45, 58, 0.35));
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-ping {
    position: absolute;
    top: 53%;
    left: 50%;
    width: 76px;
    height: 76px;
    margin: -38px 0 0 -38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.45);
    animation: tbs-lseo-ping 3s ease-out infinite;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-ping-2 {
    animation-delay: 1.5s;
}

@media (prefers-reduced-motion: reduce) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-ping {
        animation: none;
        opacity: 0;
    }
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-badge {
    position: absolute;
    left: 20px;
    bottom: -18px;
    display: inline-block;
    max-width: calc(100% - 40px);
    padding: 10px 18px;
    border-radius: 999px;
    background-color: #ffffff;
    color: #0E2A33;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 10px 24px rgba(14, 42, 51, 0.18);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-heading {
    margin: 0 0 20px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-intro,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-body {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-body p {
    margin: 0 0 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-body p:last-child {
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-intro strong,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-body strong {
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-divider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 40px 0;
    border-top: 1px solid rgba(14, 42, 51, 0.12);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-divider-icon {
    position: relative;
    top: -19px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    box-shadow: 0 6px 14px rgba(23, 112, 149, 0.3);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-divider-icon svg {
    width: 42%;
    height: 42%;
    max-width: 16px;
    max-height: 16px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-btn {
    display: inline-block;
    margin-top: 36px;
    padding: 15px 36px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

/* ── WHY CHOOSE US SECTION ───────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why {
    position: relative;
    background-color: #F2FAFB;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-inner {
    display: flex;
    align-items: center;
    gap: 56px;
    max-width: 1180px;
    margin: 0 auto;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-text {
    flex: 0 0 58%;
    max-width: 58%;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-media {
    position: relative;
    flex: 0 0 42%;
    max-width: 42%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-heading {
    margin: 0 0 20px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-intro,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-list-intro {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-intro p,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-list-intro p {
    margin: 0 0 16px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-list-intro p {
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-intro strong,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-list-intro strong {
    font-weight: 700;
    color: #0E2A33;
}

/* Numbered "timeline" list — a different layout language than the Services
   section's icon-box grid: a connecting line runs behind the number badges
   down the left edge, linking each reason to the next. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-list {
    list-style: none;
    margin: 24px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 26px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-item {
    --tbs-lseo-why-connector: rgba(23, 112, 149, 0.2);
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-item:not(:last-child)::before {
    content: '';
    position: absolute;
    top: 36px;
    left: 17px;
    width: 2px;
    bottom: -26px;
    background-color: var(--tbs-lseo-why-connector);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-num {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    box-shadow: 0 6px 14px rgba(23, 112, 149, 0.28);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-content {
    padding-top: 6px;
    font-size: 16px;
    line-height: 1.7;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-title {
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-btn {
    display: inline-block;
    margin-top: 32px;
    padding: 15px 36px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 5;
    /* object-fit and border-radius intentionally not set here — see the
       matching note on .tbs-lseo-faq-img: both owned entirely by the
       "Image Fit" / "Corner Radius" controls. */
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-placeholder {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 5;
    width: 100%;
    border-radius: 24px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-shield-icon {
    position: relative;
    z-index: 1;
    width: 26%;
    height: auto;
    filter: drop-shadow(0 8px 14px rgba(10, 45, 58, 0.35));
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.5);
    animation: tbs-lseo-ping 3s ease-out infinite;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-ring-2 {
    animation-delay: 1.5s;
}

@media (prefers-reduced-motion: reduce) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-ring {
        animation: none;
        opacity: 0;
    }
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-badge {
    position: absolute;
    left: 20px;
    bottom: -18px;
    display: inline-block;
    max-width: calc(100% - 40px);
    padding: 10px 18px;
    border-radius: 999px;
    background-color: #ffffff;
    color: #0E2A33;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 10px 24px rgba(14, 42, 51, 0.18);
}

/* ── VALUE PROPOSITION SECTION ───────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value {
    position: relative;
    background-color: #ffffff;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-inner {
    max-width: 1180px;
    margin: 0 auto;
    text-align: center;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-heading {
    margin: 0 0 20px;
    font-size: 36px;
    line-height: 1.25;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-problem {
    font-size: 17px;
    line-height: 1.75;
    color: #5B6472;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-problem p {
    margin: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-problem strong {
    font-weight: 700;
    color: #0E2A33;
}

/* The "solution" content sits in a highlighted card, visually separating
   the problem statement above from the resolution below — a different
   compositional idea than the split image/text or icon-grid sections. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card {
    position: relative;
    margin-top: 36px;
    padding: 44px;
    border-radius: 20px;
    background-color: #F2FAFB;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-icon {
    position: absolute;
    top: -22px;
    left: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    box-shadow: 0 8px 18px rgba(23, 112, 149, 0.3);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-icon svg {
    width: 44%;
    height: 44%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-body {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-body p {
    margin: 0 0 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-body p:last-child {
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-body strong {
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-btn {
    display: inline-block;
    margin-top: 36px;
    padding: 15px 36px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

/* ── SMALL BUSINESS TABLE SECTION ────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table {
    position: relative;
    background-color: #F2FAFB;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-inner {
    max-width: 1180px;
    margin: 0 auto;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-heading {
    margin: 0 0 20px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-intro,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-list-intro,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-outro {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-intro p,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-list-intro p,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-outro p {
    margin: 0 0 16px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-list-intro p {
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-intro strong,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-list-intro strong,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-outro strong {
    font-weight: 700;
    color: #0E2A33;
}

/* A genuine <table> for the tabular SEO/accessibility win, dressed up as a
   rounded, shadowed "card" with a gradient header — a stylized table rather
   than a bare browser-default grid. Horizontally scrollable on narrow
   screens instead of forcing the columns to squeeze or wrap awkwardly. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-wrap {
    margin: 32px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 18px;
    box-shadow: 0 16px 40px rgba(14, 42, 51, 0.1);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid {
    width: 100%;
    min-width: 620px;
    border-collapse: separate;
    border-spacing: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid thead th {
    padding: 20px 24px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid thead th:first-child {
    border-top-left-radius: 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid thead th:last-child {
    border-top-right-radius: 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid tbody tr {
    background-color: #ffffff;
    transition: background-color 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid tbody tr:nth-child(even) {
    background-color: #F8FCFD;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid tbody tr:hover {
    background-color: #EAF7F8;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid tbody tr:last-child td:first-child {
    border-bottom-left-radius: 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid tbody tr:last-child td:last-child {
    border-bottom-right-radius: 18px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-grid td {
    padding: 18px 24px;
    border-top: 1px solid rgba(14, 42, 51, 0.06);
    font-size: 15px;
    line-height: 1.6;
    color: #41485A;
    vertical-align: middle;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-niche {
    display: flex;
    align-items: center;
    gap: 12px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-row-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-row-icon i,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-row-icon svg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46%;
    height: 46%;
    max-width: 16px;
    max-height: 16px;
    color: inherit;
    fill: currentColor;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-row-icon i:before {
    font-size: 14px;
    line-height: 1;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-niche-label {
    font-weight: 700;
    color: #0E2A33;
    white-space: nowrap;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-btn {
    display: inline-block;
    margin-top: 12px;
    padding: 15px 36px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

/* Mobile-only stand-in for the table: a stack of native <details> cards
   instead of a horizontally-scrolling grid — hidden above the mobile
   breakpoint (see the 767px media query below, where this swaps places
   with .tbs-lseo-table-wrap). */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-cards {
    display: none;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card {
    border-radius: 14px;
    background-color: #ffffff;
    box-shadow: 0 6px 18px rgba(14, 42, 51, 0.06);
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    cursor: pointer;
    list-style: none;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-toggle::-webkit-details-marker {
    display: none;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-icon {
    position: relative;
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    transition: transform 0.25s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-icon::before,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: #ffffff;
    transform: translate(-50%, -50%);
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-icon::before {
    width: 10px;
    height: 2px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-icon::after {
    width: 2px;
    height: 10px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card[open] .tbs-lseo-table-card-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
    opacity: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-panel {
    margin: 0;
    padding: 0 18px 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-field {
    padding-top: 12px;
    border-top: 1px solid rgba(14, 42, 51, 0.08);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-field dt {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #7C8794;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-field dd {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: #41485A;
}

/* ── TESTIMONIALS SECTION ────────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials {
    position: relative;
    background-color: #ffffff;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-inner {
    display: flex;
    align-items: center;
    gap: 56px;
    max-width: 1180px;
    margin: 0 auto;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-text {
    flex: 0 0 58%;
    max-width: 58%;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-media {
    position: relative;
    flex: 0 0 42%;
    max-width: 42%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-heading {
    margin: 0 0 20px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-intro {
    font-size: 17px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-intro p {
    margin: 0;
}

/* A column stack rather than a wrapping row now that the section is split
   into text/image sides — add more entries in the repeater later and they
   simply stack, no markup changes needed. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-grid {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin: 32px 0 0;
    list-style: none;
    padding: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-card {
    position: relative;
    margin: 0;
    padding: 40px 40px 36px;
    border-radius: 20px;
    background-color: #F2FAFB;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-quote-mark {
    display: block;
    margin-bottom: 4px;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 64px;
    line-height: 1;
    font-weight: 700;
    color: #17B0B5;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-text {
    margin: 0 0 24px;
    font-size: 18px;
    font-style: italic;
    line-height: 1.7;
    color: #2C3745;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-attribution {
    display: block;
    font-style: normal;
    font-size: 15px;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-attribution::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 2px;
    margin-right: 10px;
    vertical-align: middle;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-btn {
    display: inline-block;
    margin-top: 40px;
    padding: 15px 36px;
    border-radius: 10px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(23, 112, 149, 0.28);
    transition: background-image 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-btn:focus-visible {
    background-image: linear-gradient(135deg, #197095, #17B0B5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(23, 112, 149, 0.36);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 5;
    /* object-fit and border-radius intentionally not set here — see the
       matching note on .tbs-lseo-faq-img: both now come entirely from the
       "Image Fit" / "Corner Radius" Elementor controls, so there's no
       equal-specificity tie between this stylesheet and the generated
       per-instance CSS for a user's chosen value to lose. */
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-placeholder {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 5;
    width: 100%;
    border-radius: 24px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-bubble-icon {
    position: relative;
    z-index: 1;
    width: 26%;
    height: auto;
    filter: drop-shadow(0 8px 14px rgba(10, 45, 58, 0.35));
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.5);
    animation: tbs-lseo-ping 3s ease-out infinite;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-ring-2 {
    animation-delay: 1.5s;
}

@media (prefers-reduced-motion: reduce) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-ring {
        animation: none;
        opacity: 0;
    }
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-badge {
    position: absolute;
    left: 20px;
    bottom: -18px;
    display: inline-block;
    max-width: calc(100% - 40px);
    padding: 10px 18px;
    border-radius: 999px;
    background-color: #ffffff;
    color: #0E2A33;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 10px 24px rgba(14, 42, 51, 0.18);
}

/* ── FAQ SECTION ──────────────────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq {
    position: relative;
    background-color: #F2FAFB;
    padding: 90px 40px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-inner {
    display: flex;
    align-items: flex-start;
    gap: 56px;
    max-width: 1180px;
    margin: 0 auto;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-media {
    position: relative;
    flex: 0 0 38%;
    max-width: 38%;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-text {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-heading {
    margin: 0 0 28px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Native <details>/<summary> — a fully accessible, keyboard-operable
   accordion that works even with JS disabled, since the browser owns the
   open/close state; no custom JS toggle logic needed. */
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-item {
    border-radius: 14px;
    background-color: #ffffff;
    box-shadow: 0 6px 18px rgba(14, 42, 51, 0.06);
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 26px;
    cursor: pointer;
    list-style: none;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-question::-webkit-details-marker {
    display: none;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-question-text {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.5;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-icon {
    --tbs-lseo-faq-icon-color: #ffffff;
    position: relative;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    transition: transform 0.25s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-icon::before,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: var(--tbs-lseo-faq-icon-color);
    transform: translate(-50%, -50%);
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-icon::before {
    width: 12px;
    height: 2px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-icon::after {
    width: 2px;
    height: 12px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-item[open] .tbs-lseo-faq-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
    opacity: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-answer {
    padding: 0 26px 24px;
    font-size: 16px;
    line-height: 1.75;
    color: #41485A;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-answer p {
    margin: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-answer strong {
    font-weight: 700;
    color: #0E2A33;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 5;
    /* object-fit and border-radius are intentionally NOT set here — both
       are now owned entirely by the "Image Fit" and "Corner Radius"
       Elementor controls (tbs-local-seo-page-widget.php), which always
       emit a value (including their defaults, cover/24px). Setting them
       here too would tie on specificity with the Elementor-generated
       selector (both are boosted to the same 0,3,0 via the class-
       duplication bulletproofing), leaving the winner decided by
       unpredictable stylesheet load order instead of the actual value
       chosen in the editor — which is exactly the bug this fixes. */
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-placeholder {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 5;
    width: 100%;
    border-radius: 24px;
    background-image: linear-gradient(135deg, #17B0B5, #197095);
    overflow: hidden;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-mark-icon {
    position: relative;
    z-index: 1;
    width: 26%;
    height: auto;
    filter: drop-shadow(0 8px 14px rgba(10, 45, 58, 0.35));
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.5);
    animation: tbs-lseo-ping 3s ease-out infinite;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-ring-2 {
    animation-delay: 1.5s;
}

@media (prefers-reduced-motion: reduce) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-ring {
        animation: none;
        opacity: 0;
    }
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-badge {
    position: absolute;
    left: 20px;
    bottom: -18px;
    display: inline-block;
    max-width: calc(100% - 40px);
    padding: 10px 18px;
    border-radius: 999px;
    background-color: #ffffff;
    color: #0E2A33;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 10px 24px rgba(14, 42, 51, 0.18);
}

/* ── FINAL CTA SECTION ───────────────────────────────────── */

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta {
    position: relative;
    overflow: hidden;
    padding: 96px 40px;
    background-image: linear-gradient(125deg, #17B0B5, #197095);
    text-align: center;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0) 70%);
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-glow-1 {
    width: 340px;
    height: 340px;
    top: -120px;
    left: -80px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-glow-2 {
    width: 300px;
    height: 300px;
    bottom: -100px;
    right: -80px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-inner {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-heading {
    margin: 0 0 20px;
    font-size: 40px;
    line-height: 1.22;
    font-weight: 700;
    color: #ffffff;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-text {
    font-size: 17px;
    line-height: 1.75;
    /* color intentionally NOT set here — owned entirely by the "Text Color"
       Elementor control (cta_text_color), which always emits its own
       default (rgba(255,255,255,0.92), matching what used to be hardcoded
       here). A static value at this same specificity would tie with the
       control's generated CSS, and the winner would depend on unpredictable
       stylesheet load order instead of the value actually chosen. */
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-text p {
    margin: 0 0 16px;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-text:last-of-type p {
    margin-bottom: 0;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-text strong {
    font-weight: 700;
    color: #ffffff;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-btn {
    display: inline-block;
    margin-top: 36px;
    padding: 17px 40px;
    border-radius: 10px;
    background-color: #ffffff;
    color: #197095;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 14px 30px rgba(10, 45, 58, 0.25);
    transition: background-color 0.25s ease, color 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-btn:hover,
.tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-btn:focus-visible {
    background-color: #0E2A33;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(10, 45, 58, 0.35);
}

/* ── RESPONSIVE ──────────────────────────────────────────── */

@media (max-width: 1024px) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero {
        padding: 72px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-inner {
        gap: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-heading {
        font-size: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-subheading {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-inner {
        gap: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-heading {
        font-size: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-heading {
        font-size: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-inner {
        gap: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-heading {
        font-size: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-inner {
        gap: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-heading {
        font-size: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-heading {
        font-size: 30px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card {
        padding: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-heading {
        font-size: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-inner {
        gap: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-heading {
        font-size: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq {
        padding: 64px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-inner {
        gap: 36px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-heading {
        font-size: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta {
        padding: 72px 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-heading {
        font-size: 34px;
    }
}

@media (max-width: 767px) {
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-btn-text-full {
        display: none;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-btn-text-short {
        display: inline;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero {
        padding: 56px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-inner {
        flex-direction: column;
        gap: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-media,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-text {
        flex-basis: 100%;
        max-width: 100%;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-media {
        max-width: 340px;
        margin: 0 auto;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-text {
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-heading {
        font-size: 28px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-subheading {
        text-align: left;
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-glow {
        filter: blur(50px);
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-glow-1 { width: 220px; height: 220px; }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hero-glow-2 { width: 200px; height: 200px; }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 28px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-text,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-media {
        flex-basis: 100%;
        max-width: 100%;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-heading {
        font-size: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-body {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-img {
        /* Desktop locks a 4:5 box so cover/contain can crop consistently;
           on mobile that forced height pillarboxes square source images
           and reads as "not full width". Let the image's own ratio drive
           its height instead so it always fills the column's full width. */
        width: 100%;
        height: auto;
        aspect-ratio: auto;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-hidden-placeholder {
        aspect-ratio: 16 / 10;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-heading {
        font-size: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-intro {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-list {
        column-count: 1;
        margin-top: 24px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
        /* padding is owned by the "Card Padding" control's mobile default;
           border-radius by "Card Corner Radius"; column-gap/margin-bottom
           by "Space Between Features" — see the base-rule notes above. */
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-icon {
        width: 44px;
        height: 44px;
        font-size: 18px;
        border-radius: 12px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-feature-text {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-services-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 40px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-media,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-text {
        flex-basis: 100%;
        max-width: 100%;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-img {
        width: 100%;
        height: auto;
        aspect-ratio: auto;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-placeholder {
        aspect-ratio: 16 / 10;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-heading {
        font-size: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-intro,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-body {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-divider {
        margin: 32px 0;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-bd-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 40px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-text,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-media {
        flex-basis: 100%;
        max-width: 100%;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-media {
        /* Markup order is text-then-media (desktop reads left-to-right that
           way); on mobile the image should lead, so pull it ahead visually
           without touching the DOM order that desktop relies on. */
        order: -1;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-heading {
        font-size: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-intro,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-list-intro {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-list {
        gap: 20px;
        margin-top: 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-item:not(:last-child)::before {
        bottom: -20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-content {
        font-size: 15px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-img {
        width: 100%;
        height: auto;
        aspect-ratio: auto;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-why-placeholder {
        aspect-ratio: 16 / 10;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-heading {
        font-size: 25px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-problem {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card {
        margin-top: 28px;
        padding: 24px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-icon {
        top: -20px;
        left: 24px;
        width: 40px;
        height: 40px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-card-body {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-value-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-heading {
        font-size: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-intro,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-list-intro,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-outro {
        font-size: 16px;
    }
    /* Swap the horizontally-scrolling table for the stacked accordion
       cards — no scroll-x needed to reach the hidden columns on a phone. */
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-wrap {
        display: none;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-cards {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin: 24px 0;
    }
    /* The card header has real room to grow vertically (unlike a table
       cell), so let long niche names wrap to two lines instead of
       overflowing under the toggle icon. min-width: 0 is required on every
       flex ancestor in the chain for that wrapping to actually take effect. */
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-toggle {
        align-items: flex-start;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-niche {
        min-width: 0;
        flex: 1 1 auto;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-niche-label {
        white-space: normal;
        word-break: break-word;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-card-icon {
        margin-top: 4px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-table-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-text,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-media {
        flex-basis: 100%;
        max-width: 100%;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-media {
        /* Markup order is text-then-media; pull the image ahead visually
           on mobile without disturbing the desktop DOM order. */
        order: -1;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-heading {
        font-size: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-intro {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-grid {
        margin-top: 24px;
        gap: 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-card {
        padding: 32px 26px 28px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-quote-mark {
        font-size: 52px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonial-text {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-btn {
        display: block;
        width: 100%;
        text-align: center;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-img {
        width: 100%;
        height: auto;
        aspect-ratio: auto;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-testimonials-placeholder {
        aspect-ratio: 16 / 10;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq {
        padding: 48px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 32px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-media,
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-text {
        flex-basis: 100%;
        max-width: 100%;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-img {
        width: 100%;
        height: auto;
        aspect-ratio: auto;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-placeholder {
        aspect-ratio: 16 / 10;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-heading {
        font-size: 26px;
        margin-bottom: 24px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-list {
        gap: 12px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-question {
        padding: 18px 20px;
        gap: 14px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-question-text {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-icon {
        width: 26px;
        height: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-faq-answer {
        padding: 0 20px 20px;
        font-size: 15px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta {
        padding: 56px 20px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-glow {
        filter: blur(50px);
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-glow-1 { width: 220px; height: 220px; }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-glow-2 { width: 200px; height: 200px; }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-heading {
        font-size: 26px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-text {
        font-size: 16px;
    }
    .tbs-lseo-wrap.tbs-lseo-wrap .tbs-lseo-cta-btn {
        display: block;
        width: 100%;
        text-align: center;
        margin-top: 28px;
    }
}