/* Force boxed containers' inner to fill the box so % widths work predictably. */
.e-con.e-con-boxed > .e-con-inner {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: auto !important;
}

/* Elementor editor / preview: force fade-up elements to be visible — the IntersectionObserver
   that adds .visible on the front end does not fire inside the editor iframe, which made the
   page appear blank in the editor even though the widgets exist. */
body.elementor-editor-active .fade-up,
body.elementor-editor-preview .fade-up,
html.elementor-editor-active .fade-up,
.elementor-editor-active .fade-up {
    opacity: 1 !important;
    transform: none !important;
}

/* Width classes for containers */
.e-con.w-100 { width: 100%; flex-basis: 100%; }
.e-con.w-55 { width: 55%; flex-basis: 55%; }
.e-con.w-50 { width: calc(50% - 24px); flex-basis: calc(50% - 24px); }
.e-con.w-45 { width: 45%; flex-basis: 45%; }
.e-con.w-40 { width: 40%; flex-basis: 40%; }
.e-con.w-32 { width: calc(33% - 16px); flex-basis: calc(33% - 16px); }
.e-con.w-31 { width: calc(33% - 20px); flex-basis: calc(33% - 20px); }
.e-con.w-30 { width: 30%; flex-basis: 30%; }
.e-con.w-18 { width: calc(18% - 10px); flex-basis: calc(18% - 10px); }
.e-con.w-8 { width: 8%; flex-basis: 8%; }
.e-con.w-6 { width: 6%; flex-basis: 6%; flex-shrink: 0; }
.e-con.w-44 { width: 44%; flex-basis: 44%; }
.e-con.w-60 { width: 60%; flex-basis: 60%; }
.e-con.w-35 { width: 35%; flex-basis: 35%; }

@media (max-width: 767px) {
    .e-con.w-50, .e-con.w-55, .e-con.w-45, .e-con.w-40, .e-con.w-35, .e-con.w-32, .e-con.w-31, .e-con.w-30, .e-con.w-18, .e-con.w-60 {
        width: 100%; flex-basis: 100%;
    }
}

/*
 * Shim CSS: Elementor wraps every widget in .elementor-widget and containers in .e-con.
 * The original main.css was authored for plain <section>/<div> structure, so we need to
 * (a) make Elementor's `.e-con` stop forcing flex when the original class sets its own display, and
 * (b) strip Elementor's default widget padding/margins so the authored card spacing is authoritative.
 */

/* ----- Widget wrappers: zero out default widget spacing ----- */
.elementor-element .elementor-widget-container {
    padding: 0 !important;
}
.elementor-widget:not(:last-child) {
    margin-bottom: 0;
}
/* In a flex-column container every widget should occupy full width. */
.e-con[class*="flex-direction: column"] > .elementor-widget,
.e-con.e-flex > .e-con-inner > .elementor-widget,
.e-con > .e-con-inner > .elementor-widget {
    width: 100%;
}

/* Default: widgets should not collapse narrower than their container. */
.elementor-widget.elementor-widget-heading,
.elementor-widget.elementor-widget-text-editor,
.elementor-widget.elementor-widget-icon-list,
.elementor-widget.elementor-widget-posts,
.elementor-widget.elementor-widget-icon-box {
    width: 100%;
}

/* Buttons/icons should be intrinsic width (don't fill container). */
.elementor-widget.elementor-widget-button,
.elementor-widget.elementor-widget-icon,
.elementor-widget.elementor-widget-image {
    width: auto;
}

/* Step number heading: small inline width next to content */
.plan-step .step-number.elementor-widget-heading { width: auto; flex: 0 0 auto; }
.plan-step .step-content.e-con { flex: 1 1 auto; min-width: 0; }

/* Stakes VS text: compact */
.stakes-divider .stakes-vs { width: auto; }
/* Hero proof avatars: each avatar is intrinsic width, not full flex */
.proof-avatars .avatar.elementor-widget-heading { width: auto; flex: 0 0 auto; }

/* Heading widget — let authored h*-class rules apply. */
.elementor-widget-heading .elementor-heading-title {
    margin: 0;
    color: inherit;
    font: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
}

/* Text editor — let original body-copy rules through. */
.elementor-widget-text-editor .elementor-widget-container,
.elementor-widget-text-editor p {
    color: inherit;
    font: inherit;
    line-height: inherit;
}

/* Button widget — neutralise Elementor's own button styling so our .btn classes win. */
.elementor-widget-button .elementor-button {
    background: none;
    color: inherit;
    padding: 0;
    border: 0;
    border-radius: 0;
    font: inherit;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
}

/* Icon widget — inherit styling from parent card class. */
.elementor-widget-icon .elementor-icon {
    color: inherit;
    background: transparent;
    padding: 0;
    font-size: inherit;
    width: auto;
    height: auto;
}
.elementor-widget-icon .elementor-icon svg,
.elementor-widget-icon .elementor-icon i {
    color: inherit;
    width: 1em;
    height: 1em;
}

/* ---------------------------------------------------------
 * Layout classes: undo Elementor's .e-con default flex so the
 * original main.css (grid/flex) rules take effect.
 * -------------------------------------------------------- */

.e-con.hero > .e-con-inner,
.e-con.problem-section > .e-con-inner,
.e-con.guide-section > .e-con-inner,
.e-con.plan-section > .e-con-inner,
.e-con.services-section > .e-con-inner,
.e-con.stakes-section > .e-con-inner,
.e-con.cta-section > .e-con-inner,
.e-con.blog-header > .e-con-inner,
.e-con.blog-listing > .e-con-inner,
.e-con.single-content > .e-con-inner,
.e-con.single-post > .e-con-inner,
.e-con.site-header > .e-con-inner,
.e-con.site-footer > .e-con-inner {
    padding: 0;
    max-width: none;
    width: 100%;
    display: block;
}

/* Section-header alignment (used across sections) */
.e-con.section-header { text-align: center; }

/* Neutralise main.css legacy layout rules that collide with Elementor's .e-con structure.
   The old `.container` was a direct-child inside .hero/.guide/etc. with its own grid — our
   Elementor .container is a flex container now, so wipe those out. */
.e-con.hero .e-con.container,
.e-con.guide-section .e-con.container,
.e-con.stakes-section .e-con.container,
.e-con.problem-section .e-con.container,
.e-con.services-section .e-con.container,
.e-con.plan-section .e-con.container,
.e-con.cta-section .e-con.container,
.e-con.blog-header .e-con.container,
.e-con.blog-listing .e-con.container,
.e-con.site-header .e-con.container,
.e-con.site-footer .e-con.container,
.e-con.single-post-header .e-con.container,
.e-con.single-content .e-con.container,
.e-con.single-footer .e-con.container {
    display: flex !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    min-height: 0 !important;
}
/* Boxed inner fills the box */
.e-con.e-con-boxed > .e-con-inner {
    width: 100% !important;
    max-width: 100% !important;
}

/* Neutralise any main.css grid/flex on the class names we reuse — let Elementor's
   container flex settings drive layout. */
.e-con.hero-content, .e-con.hero-visual, .e-con.hero-card, .e-con.hero-actions, .e-con.hero-proof, .e-con.proof-avatars,
.e-con.problem-grid, .e-con.problem-card,
.e-con.guide-grid, .e-con.guide-content, .e-con.guide-visual, .e-con.authority-stats, .e-con.stat, .e-con.empathy-cards, .e-con.empathy-card,
.e-con.plan-steps, .e-con.plan-step, .e-con.step-content,
.e-con.services-grid, .e-con.service-card,
.e-con.stakes-grid, .e-con.stakes-card, .e-con.stakes-divider,
.e-con.cta-content, .e-con.cta-actions, .e-con.cta-text-col, .e-con.cta-book-col,
.e-con.section-header,
.e-con.breadcrumbs,
.e-con.footer-grid, .e-con.footer-brand, .e-con.footer-links, .e-con.footer-contact, .e-con.footer-bottom,
.e-con.site-nav, .e-con.single-cta {
    display: flex !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
}

/* Mobile: stack the homepage CTA columns so "Have 15 minutes?" drops below
   "Start Growing?" instead of sitting alongside it. The Elementor template
   has these as a row at desktop (.cta-text-col w-60 + .cta-book-col w-40);
   we override flex-direction and force each column to full width. */
@media (max-width: 768px) {
    .e-con.cta-content {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 32px;
    }
    .e-con.cta-text-col,
    .e-con.cta-book-col {
        width: 100% !important;
        flex-basis: auto !important;
        max-width: 100% !important;
    }

    /* Stakes section: stack the two-card comparison (Without / VS / With
       Clicktuitive) vertically on mobile. DOM order is already failure → VS
       → success, so flex-direction: column gives the requested order. We
       also re-show the VS divider — main.css:1909 hides it at this breakpoint,
       but the stacked layout needs it between the cards. */
    .e-con.stakes-grid {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important;
    }
    .e-con.stakes-card,
    .e-con.stakes-divider {
        width: 100% !important;
        flex-basis: auto !important;
        max-width: 100% !important;
    }
    .e-con.stakes-divider {
        display: flex !important;          /* override main.css `display: none` */
        padding: 12px 0 !important;
        align-items: center !important;
        justify-content: center !important;
    }
    .stakes-divider .elementor-heading-title {
        margin: 0 auto;
    }

    /* Guide section: text-on-left + empathy-icons-on-right at desktop
       (.guide-content w-55 + .guide-visual w-40). On mobile, stack vertically:
       text/stats first, empathy cards below. Also stack the 3 authority-stats
       and pad the section a bit so it breathes. */
    .e-con.guide-grid {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 32px !important;
    }
    .e-con.guide-content,
    .e-con.guide-visual {
        width: 100% !important;
        flex-basis: auto !important;
        max-width: 100% !important;
    }
    .e-con.authority-stats {
        flex-direction: column !important;
        gap: 16px !important;
        align-items: stretch !important;
    }
    .e-con.authority-stats .e-con.stat {
        width: 100% !important;
        flex-basis: auto !important;
    }
    /* Empathy cards inside .guide-visual are already w-100 — they stack inside
       a flex-direction: column parent, so no extra rule needed. */
}

/* Let Elementor handle all container display via native flex settings. */

/* Plan step number */
.plan-step .step-number .elementor-heading-title {
    font-size: 3.5rem;
    font-weight: 800;
    color: var(--color-orange, #e8751a);
    line-height: 1;
}

/* Empathy card icon */
.empathy-card .empathy-icon .elementor-icon {
    color: var(--color-orange, #e8751a);
    font-size: 1.5rem;
    background: rgba(232, 117, 26, 0.12);
    width: 2.5rem; height: 2.5rem;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
}
.problem-card .problem-icon .elementor-icon,
.service-card .service-icon .elementor-icon {
    color: var(--color-orange, #e8751a);
    font-size: 2rem;
    background: rgba(232, 117, 26, 0.12);
    width: 3.5rem; height: 3.5rem;
    border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center;
}

/* Avatar circles */
.proof-avatars .avatar .elementor-heading-title {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2.25rem; height: 2.25rem;
    border-radius: 50%;
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    margin-left: -0.5rem;
    border: 2px solid #fff;
}
.proof-avatars .avatar-orange .elementor-heading-title { background: #e8751a; }
.proof-avatars .avatar-black  .elementor-heading-title { background: #222; }
.proof-avatars .avatar-accent .elementor-heading-title { background: #f59e42; }
.proof-avatars .avatar-dark   .elementor-heading-title { background: #444; }

/* Metric cards */
.metric-card .elementor-icon-box-wrapper {
    display: grid !important;
    grid-template-columns: 48px 1fr;
    gap: 1rem;
    align-items: center;
    text-align: left !important;
}
.metric-card .elementor-icon-box-icon { margin: 0 !important; }
.metric-card .elementor-icon-box-title { font-size: 1.5rem !important; font-weight: 800; margin: 0 !important; }
.metric-card .elementor-icon-box-description { font-size: 0.875rem !important; color: var(--color-text-muted, #555); margin: 0 !important; }
.metric-card .elementor-icon {
    background: rgba(232,117,26,0.12);
    color: #e8751a;
    border-radius: 8px;
    width: 48px; height: 48px;
    display: inline-flex !important;
    align-items: center; justify-content: center;
    font-size: 1.25rem !important;
}

/* Stakes lists use Elementor's icon list. Give them proper icon coloring. */
.stakes-failure .elementor-icon-list-icon { color: #dc2626; }
.stakes-success .elementor-icon-list-icon { color: #16a34a; }
.elementor-widget-icon-list .elementor-icon-list-item {
    margin-bottom: 0.75rem !important;
}

/* Stakes VS divider */
.stakes-divider .elementor-heading-title {
    font-size: 1.5rem; font-weight: 800; letter-spacing: 0.1em;
    color: var(--color-text-muted, #555);
    background: #fff; border: 1px solid var(--color-border, #e5e5e5);
    width: 3rem; height: 3rem;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
}

/* (Legacy dark footer rules removed — see white-footer block below.) */

/* ---------- HEADER ---------- */
.site-header .elementor-widget-image img { max-height: 40px !important; width: auto !important; display: block; }
.site-header .elementor-widget-image { width: auto !important; flex: 0 0 auto; }

/* Nav menu: force single row */
.site-header .site-nav .elementor-widget-nav-menu { width: auto !important; flex: 0 1 auto; }
.site-header .elementor-nav-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.site-header .elementor-nav-menu li { list-style: none; }
.site-header .elementor-nav-menu a,
.site-header .elementor-nav-menu .elementor-item {
    color: var(--color-text, #222) !important;
    font-weight: 500;
    padding: 0.5rem 1rem !important;
    text-decoration: none;
    white-space: nowrap;
    background: transparent !important;
    border-bottom: none !important;
}
.site-header .elementor-nav-menu a:hover,
.site-header .elementor-nav-menu .elementor-item:hover,
.site-header .elementor-nav-menu .elementor-item.elementor-item-active {
    color: var(--color-orange, #e8751a) !important;
}

/* Get Started nav CTA (pill button) */
.site-header .nav-cta.elementor-widget-button .elementor-button,
.site-header .elementor-widget-button.nav-cta .elementor-button {
    background: var(--color-orange, #e8751a) !important;
    color: #fff !important;
    padding: 0.625rem 1.5rem !important;
    border-radius: 999px !important;
    font-weight: 600 !important;
    white-space: nowrap;
}
.site-header .nav-cta.elementor-widget-button .elementor-button:hover {
    background: var(--color-orange-dark, #cf6510) !important;
}

/* Desktop layout: logo left | nav centered | CTA right.
   The Elementor header template nests the nav + CTA inside .site-header-actions,
   so we promote those children to direct grid items via display:contents. */
@media (min-width: 1025px) {
    .e-con.site-header .e-con.container {
        display: grid !important;
        grid-template-columns: 1fr auto 1fr;
        align-items: center;
        gap: 24px;
        justify-content: stretch !important;
    }
    .e-con.site-header .e-con.container > .e-con-inner {
        display: contents !important;
    }
    .site-header .site-logo,
    .site-header .logo-img {
        grid-column: 1;
        justify-self: start;
    }
    .site-header .site-header-actions {
        display: contents !important;
    }
    .site-header #site-nav,
    .site-header .site-nav {
        grid-column: 2;
        justify-self: center;
    }
    .site-header .nav-cta {
        grid-column: 3;
        justify-self: end;
    }
}

/* Tablet + mobile: drop the "Get Started" CTA so the burger has room. */
@media (max-width: 1024px) {
    .site-header .nav-cta {
        display: none !important;
    }

    /* With the CTA hidden, the .site-header-actions / .site-nav / .nav-list
       parents collapse to the burger's width (~33px). The dropdown is a
       child of .nav-list, so its `right: 0` resolves against that 33px box
       and renders as a sliver at the right edge. Pull the dropdown out of
       the cascade with position:fixed so it spans the viewport. */
    .site-header .elementor-nav-menu--dropdown.elementor-nav-menu__container {
        position: fixed !important;
        top: 70px !important;          /* approx. unscrolled site-header height */
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        max-height: calc(100vh - 70px) !important;
        margin: 0 !important;
        padding: 8px 0 !important;
        background: #fff !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
        border-top: 1px solid var(--color-border, #e5e5e5) !important;
        overflow-y: auto !important;
        z-index: 999;
    }
    .site-header .elementor-nav-menu--dropdown[aria-hidden="true"] {
        display: none !important;
    }
    .site-header .elementor-nav-menu--dropdown .elementor-nav-menu {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .site-header .elementor-nav-menu--dropdown .elementor-nav-menu li {
        list-style: none;
        width: 100%;
    }
    .site-header .elementor-nav-menu--dropdown .elementor-item {
        padding: 16px 24px !important;
        text-align: left !important;
        white-space: normal !important;
        font-size: 1.05rem !important;
        display: block !important;
        border-bottom: 1px solid var(--color-border, #e5e5e5);
    }
    .site-header .elementor-nav-menu--dropdown .elementor-nav-menu li:last-child .elementor-item {
        border-bottom: none;
    }
}

/* Mobile: neutralise the legacy off-canvas .site-nav rule from main.css that
   was written for the pre-Elementor markup. In the Elementor build the burger
   toggle lives INSIDE .site-nav, so pushing the container off-screen also hid
   the burger. The Elementor nav-menu widget handles its own dropdown panel,
   so .site-nav just needs to sit in the normal flow. */
@media (max-width: 768px) {
    .e-con.site-nav {
        position: static !important;
        top: auto !important;
        right: auto !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        background: transparent !important;
        border: 0 !important;
        padding: 0 !important;
        transition: none !important;
        z-index: auto !important;
    }
}

/* ---------- FOOTER (white bg, orange logo) ---------- */
.site-footer { color: var(--color-text, #222); }
.site-footer a { color: var(--color-text-muted, #555); text-decoration: none; }
.site-footer a:hover { color: var(--color-orange, #e8751a); }

.site-footer .elementor-widget-image img {
    max-height: 40px !important;
    width: auto !important;
    display: block;
}
.site-footer .elementor-widget-image { width: auto !important; }

.site-footer h4.elementor-heading-title {
    color: var(--color-text, #222) !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    margin-bottom: 0.5rem !important;
}

.site-footer .footer-tagline,
.site-footer .footer-col-list p,
.site-footer .footer-col-list {
    color: var(--color-text-muted, #555) !important;
}
.site-footer .footer-col-list ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.site-footer .footer-col-list li {
    list-style: none !important;
    color: var(--color-text-muted, #555) !important;
}
.site-footer .footer-col-list li a {
    color: var(--color-text-muted, #555) !important;
}
.site-footer .footer-col-list li a:hover {
    color: var(--color-orange, #e8751a) !important;
}
.site-footer .footer-bottom p {
    color: var(--color-text-light, #888) !important;
    font-size: 0.875rem;
    margin: 0;
    text-align: center;
}
.site-footer .footer-bottom {
    border-top: 1px solid var(--color-border, #e5e5e5);
    padding-top: 1.5rem !important;
}

/* Posts widget (Elementor Pro) on archive — re-apply blog-card look. */
.elementor-widget-posts .elementor-post {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    border: 1px solid var(--color-border, #e5e5e5);
    transition: transform 0.2s, box-shadow 0.2s;
}
.elementor-widget-posts .elementor-post:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.08);
}
.elementor-widget-posts .elementor-post__title a { color: var(--color-black, #111); }
.elementor-widget-posts .elementor-post__read-more { color: var(--color-orange, #e8751a); font-weight: 600; }

/* Single post header */
.single-post .single-title .elementor-heading-title { font-size: 2.5rem; font-weight: 800; line-height: 1.15; }
.single-post .single-date { color: var(--color-text-muted, #555); font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.05em; }

/* Section titles + eyebrows */
.section-label .elementor-heading-title {
    color: var(--color-orange, #e8751a);
    font-weight: 600;
    font-size: 0.875rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.section-title .elementor-heading-title {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;
}
.hero-title .elementor-heading-title {
    font-size: 4rem;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.03em;
    color: #111;
}
.hero-eyebrow .elementor-heading-title {
    color: var(--color-orange, #e8751a);
    font-weight: 600;
    font-size: 0.875rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.hero-subtitle { max-width: 520px; }
.hero-subtitle p { font-size: 1.1rem; color: var(--color-text-muted, #555); line-height: 1.6; }
.text-gradient { background: linear-gradient(90deg, #e8751a, #f5952e); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* Stat */
.stat .stat-number .elementor-heading-title { font-size: 1.75rem; font-weight: 800; color: var(--color-orange, #e8751a); }
.stat .stat-label .elementor-heading-title { font-size: 0.875rem; color: var(--color-text-muted, #555); }

/* Problem type label */
.problem-type .elementor-heading-title { font-size: 0.75rem; color: var(--color-text-muted, #555); letter-spacing: 0.08em; text-transform: uppercase; }

/* Cards visual: subtle border + padding */
.problem-card, .service-card, .empathy-card {
    background: #fff;
    border: 1px solid var(--color-border, #e5e5e5);
    border-radius: 12px;
}
.hero-card {
    background: #fff;
    border: 1px solid var(--color-border, #e5e5e5);
    border-radius: 16px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.05);
    max-width: 420px;
    width: 100%;
}
.stakes-card {
    background: #fff;
    border-radius: 16px;
    border: 1px solid var(--color-border, #e5e5e5);
}
.stakes-failure { border-top: 4px solid #dc2626; }
.stakes-success { border-top: 4px solid #16a34a; }
.stakes-label .elementor-heading-title { font-size: 1rem; font-weight: 700; margin-bottom: 1rem !important; text-transform: uppercase; letter-spacing: 0.05em; }

/* Blog header */
.blog-header-title .elementor-heading-title { font-size: 3rem; font-weight: 800; letter-spacing: -0.02em; }
.blog-header-subtitle .elementor-heading-title { font-size: 1.1rem; color: var(--color-text-muted, #555); margin-top: 0.5rem; }

/* ---------- /services (editorial list redesign) ---------- */
.idx-hero {
    background: #fff;
    position: relative;
    overflow: hidden;
}
.idx-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 50% 0%, rgba(232,117,26,0.08) 0%, rgba(232,117,26,0) 60%);
    pointer-events: none;
}
.e-con.idx-hero-inner {
    width: 100% !important;
    max-width: 920px;
    text-align: center;
    position: relative;
    z-index: 1;
    margin: 0 auto;
    align-items: center !important;
}
.idx-eyebrow .elementor-heading-title {
    color: var(--color-orange, #e8751a);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.idx-title .elementor-heading-title {
    font-size: clamp(2.5rem, 5vw, 4rem);
    line-height: 1.05;
    letter-spacing: -0.02em;
    font-weight: 800;
    color: var(--color-black, #111);
    white-space: pre-line;
    text-align: center;
    max-width: 760px;
}
.idx-intro p {
    color: var(--color-text-muted, #555);
    font-size: 1.1rem;
    line-height: 1.65;
    max-width: 620px;
    margin: 0 auto;
}

/* List */
.e-con.idx-list-section {
    width: 100%;
}
.e-con.idx-list {
    width: 100% !important;
    max-width: 920px;
    margin: 0 auto;
    border-top: 1px solid var(--color-border, #e5e5e5);
}

.e-con.idx-row {
    width: 100% !important;
    border-bottom: 1px solid var(--color-border, #e5e5e5);
    cursor: pointer;
    transition: background 0.2s, padding 0.2s;
    position: relative;
}
.e-con.idx-row:hover {
    background: rgba(232, 117, 26, 0.035);
}
.e-con.idx-row.is-recommended {
    background: linear-gradient(90deg, rgba(232,117,26,0.04) 0%, rgba(232,117,26,0) 70%);
}
.e-con.idx-row.is-recommended:hover {
    background: linear-gradient(90deg, rgba(232,117,26,0.07) 0%, rgba(232,117,26,0) 70%);
}

.e-con.idx-row-numcol {
    width: 96px !important;
    flex-basis: 96px !important;
    flex: 0 0 96px;
}
.idx-row-num .elementor-heading-title {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
    color: var(--color-black, #111);
    letter-spacing: -0.02em;
}
.idx-row-icon .elementor-icon {
    color: var(--color-text-muted, #888);
    background: transparent;
    width: auto; height: auto;
    padding: 0;
    font-size: 1rem;
}
.idx-row-icon .elementor-icon svg {
    width: 18px; height: 18px; fill: currentColor;
}
.e-con.idx-row:hover .idx-row-icon .elementor-icon {
    color: var(--color-orange, #e8751a);
}

.e-con.idx-row-content {
    flex: 1 1 auto;
    width: auto !important;
    flex-basis: auto !important;
    min-width: 0;
}
.idx-row-eyebrow .elementor-heading-title {
    color: var(--color-orange, #e8751a);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin-bottom: 2px;
}
.idx-row-title .elementor-heading-title {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--color-black, #111);
    line-height: 1.15;
    letter-spacing: -0.015em;
    margin-bottom: 2px;
}
.idx-row-text p {
    color: var(--color-text-muted, #555);
    font-size: 1rem;
    line-height: 1.5;
    margin: 0;
    max-width: 580px;
}

.idx-row-badge .elementor-heading-title {
    display: inline-block;
    background: var(--color-orange, #e8751a);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 6px;
}

.e-con.idx-row-arrowcol {
    width: 56px !important;
    flex-basis: 56px !important;
    flex: 0 0 56px;
    align-self: center;
}
.idx-row-arrow .elementor-icon {
    color: var(--color-text-muted, #999);
    background: transparent;
    width: auto; height: auto;
    padding: 0;
    transition: transform 0.25s, color 0.2s;
}
.idx-row-arrow .elementor-icon svg {
    width: 22px; height: 22px; fill: currentColor;
}
.e-con.idx-row:hover .idx-row-arrow .elementor-icon {
    color: var(--color-orange, #e8751a);
    transform: translateX(8px);
}

/* Stats strip — dark band */
.e-con.idx-stats-section {
    width: 100%;
    color: rgba(255,255,255,0.92);
}
.e-con.idx-stats {
    width: 100% !important;
    max-width: 920px;
    margin: 0 auto;
}
.e-con.idx-stat {
    flex: 1 1 auto;
    width: auto !important;
    flex-basis: auto !important;
}
.idx-stat-num .elementor-heading-title {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--color-orange-light, #f5a04f);
    line-height: 1;
}
.idx-stat-label .elementor-heading-title {
    color: rgba(255,255,255,0.6);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.04em;
}

/* Bottom CTA */
.e-con.idx-cta-section { width: 100%; }
.e-con.idx-cta-inner {
    width: 100% !important;
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    align-items: center !important;
}
.idx-cta-title .elementor-heading-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--color-black, #111);
    line-height: 1.1;
}
.idx-cta-text p {
    color: var(--color-text-muted, #555);
    font-size: 1.05rem;
    line-height: 1.6;
    margin: 0;
}
.idx-cta-btn .elementor-button {
    margin-top: 8px;
}

/* Mobile */
@media (max-width: 767px) {
    .e-con.idx-hero { padding: 80px 0 56px !important; }
    .e-con.idx-row { flex-direction: column !important; gap: 16px !important; padding: 24px 16px !important; }
    .e-con.idx-row-numcol { flex: 0 0 auto !important; width: auto !important; flex-basis: auto !important; }
    .e-con.idx-row-arrowcol { display: none !important; }
    .e-con.idx-stats { flex-direction: column !important; gap: 28px !important; align-items: flex-start !important; }
}

/* ---------- Service detail template (svc-*) ---------- */

/* Shared section internals */
.e-con.svc-section-inner {
    width: 100% !important;
    max-width: 1080px;
    margin: 0 auto;
}
.svc-eyebrow-small .elementor-heading-title,
.svc-eyebrow .elementor-heading-title {
    color: var(--color-orange, #e8751a);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.svc-section-title .elementor-heading-title {
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 800;
    color: var(--color-black, #111);
    line-height: 1.1;
    letter-spacing: -0.015em;
    text-align: center;
    max-width: 760px;
}
.svc-section-intro p {
    color: var(--color-text-muted, #555);
    font-size: 1.05rem;
    line-height: 1.65;
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
}

/* HERO */
.e-con.svc-hero {
    background: #fff;
    position: relative;
    overflow: hidden;
}
.e-con.svc-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 85% 10%, rgba(232,117,26,0.10) 0%, rgba(232,117,26,0) 50%);
    pointer-events: none;
}
.e-con.svc-hero-inner {
    width: 100% !important;
    max-width: 980px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
.svc-breadcrumb .elementor-heading-title {
    color: var(--color-text-muted, #888);
    font-size: 0.82rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    margin-bottom: 12px;
}
.svc-title .elementor-heading-title {
    font-size: clamp(2.25rem, 5vw, 3.75rem);
    line-height: 1.05;
    letter-spacing: -0.02em;
    font-weight: 800;
    color: var(--color-black, #111);
    max-width: 880px;
}
.svc-lead p {
    color: var(--color-text-muted, #444);
    font-size: 1.15rem;
    line-height: 1.65;
    max-width: 720px;
    margin: 0;
}
.e-con.svc-hero-actions { margin-top: 12px; width: auto !important; flex-basis: auto !important; }

/* PAIN */
.e-con.svc-pain-grid {
    width: 100% !important;
    margin-top: 8px;
}
.e-con.svc-pain-card {
    flex: 1 1 280px;
    width: auto !important;
    flex-basis: 280px !important;
    background: #fff;
    border: 1px solid var(--color-border, #e5e5e5);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.03);
    transition: var(--transition);
}
.e-con.svc-pain-card:hover {
    transform: translateY(-2px);
    border-color: rgba(232,117,26,0.3);
    box-shadow: 0 8px 22px rgba(0,0,0,0.06);
}
.svc-pain-label .elementor-heading-title {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--color-black, #111);
    letter-spacing: -0.01em;
}
.svc-pain-text p {
    color: var(--color-text-muted, #555);
    font-size: 0.95rem;
    line-height: 1.55;
    margin: 0;
}

/* WHAT WE DO — capability grid (3-up) */
.e-con.svc-cap-grid {
    width: 100% !important;
    margin-top: 8px;
}
.e-con.svc-cap-card {
    flex: 1 1 calc(33.333% - 14px);
    width: auto !important;
    flex-basis: calc(33.333% - 14px) !important;
    max-width: calc(33.333% - 14px);
    background: #fff;
    border: 1px solid var(--color-border, #e5e5e5);
    border-radius: 14px;
    transition: var(--transition);
}
.e-con.svc-cap-card:hover {
    border-color: rgba(232,117,26,0.35);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.06);
}
.svc-cap-icon .elementor-icon {
    width: 44px; height: 44px;
    background: rgba(232,117,26,0.1);
    color: var(--color-orange, #e8751a);
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.svc-cap-icon .elementor-icon svg { width: 20px; height: 20px; fill: currentColor; }
.svc-cap-title .elementor-heading-title {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--color-black, #111);
    margin-top: 2px;
}
.svc-cap-text p {
    color: var(--color-text-muted, #555);
    font-size: 0.94rem;
    line-height: 1.6;
    margin: 0;
}

/* PROCESS */
.e-con.svc-process-inner { max-width: 880px; }
.e-con.svc-steps {
    width: 100% !important;
    margin-top: 4px;
    border-top: 1px solid var(--color-border, #e5e5e5);
}
.e-con.svc-step {
    width: 100% !important;
    border-bottom: 1px solid var(--color-border, #e5e5e5);
}
.e-con.svc-step-numwrap {
    width: 84px !important;
    flex-basis: 84px !important;
    flex: 0 0 84px;
}
.svc-step-num .elementor-heading-title {
    font-family: var(--font-heading);
    font-size: 1.7rem;
    font-weight: 800;
    color: var(--color-orange, #e8751a);
    letter-spacing: -0.02em;
    line-height: 1;
}
.e-con.svc-step-content {
    flex: 1 1 auto;
    width: auto !important;
    flex-basis: auto !important;
    min-width: 0;
}
.svc-step-title .elementor-heading-title {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--color-black, #111);
    letter-spacing: -0.015em;
}
.svc-step-text p {
    color: var(--color-text-muted, #555);
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
    max-width: 640px;
}

/* FAQ */
.e-con.svc-faq-section .svc-section-inner { max-width: 760px; }
.e-con.svc-faq-list {
    width: 100% !important;
    margin-top: 8px;
    border-top: 1px solid var(--color-border, #e5e5e5);
}
.e-con.svc-faq-item {
    width: 100% !important;
    border-bottom: 1px solid var(--color-border, #e5e5e5);
}
.svc-faq-q .elementor-heading-title {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--color-black, #111);
    letter-spacing: -0.01em;
}
.svc-faq-a p {
    color: var(--color-text-muted, #555);
    font-size: 0.98rem;
    line-height: 1.65;
    margin: 0;
}

/* BOTTOM CTA */
.e-con.svc-cta-inner {
    width: 100% !important;
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    align-items: center !important;
    color: rgba(255,255,255,0.9);
}
.svc-cta-title .elementor-heading-title {
    font-size: clamp(2rem, 4vw, 2.75rem);
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.015em;
    line-height: 1.1;
}
.svc-cta-text p {
    color: rgba(255,255,255,0.7);
    font-size: 1.05rem;
    line-height: 1.6;
    margin: 0;
}
.svc-cta-btn .elementor-button { margin-top: 8px; }

/* Mobile */
@media (max-width: 900px) {
    .e-con.svc-cap-card {
        flex-basis: calc(50% - 10px) !important;
        max-width: calc(50% - 10px);
    }
}
@media (max-width: 600px) {
    .e-con.svc-hero { padding: 80px 0 56px !important; }
    .e-con.svc-hero-actions { flex-direction: column !important; align-items: stretch !important; gap: 10px !important; }
    .e-con.svc-pain-card { flex-basis: 100% !important; }
    .e-con.svc-cap-card { flex-basis: 100% !important; max-width: 100%; }
    .e-con.svc-step { flex-direction: column !important; gap: 4px !important; padding: 24px 0 !important; }
    .e-con.svc-step-numwrap { flex: 0 0 auto !important; width: auto !important; flex-basis: auto !important; }
}