/* ==========================================================================
   Elementor homepage — adapts the brand look to Elementor's native widget DOM.
   The homepage is built with native Elementor widgets (no shortcodes); this
   sheet restyles those widgets to match the live Progression Search design.
   Loaded on the front page only (see functions.php).
   ========================================================================== */

/* Full-bleed sections (hero + feature bands): kill Elementor's default padding */
.ps-el-full > .elementor-container { max-width: 100% !important; }
.ps-el-full .elementor-widget:not(:last-child) { margin-bottom: 0; }

/* Boxed content sections use the brand 1200px container */
.ps-el-infobar > .elementor-container,
.ps-el-staff > .elementor-container,
.ps-el-tband > .elementor-container,
.ps-el-jobs > .elementor-container { max-width: 1200px; }

/* --------------------------------------------------------------- HERO slider
   Match the live site: every banner slide is shown IN FULL, never cropped, at
   its native aspect ratio. The box height is sized to the tallest slide
   (saas_new 1229x654 -> 1.879, the same 673px display height as live) so both
   dao (1366x654) and saas display whole. The banner art sits on a white field,
   so object-fit:contain letterboxes invisibly against the white box. Heights are
   forced with !important to beat Swiper's inline styles. */
.ps-hero-mc .elementor-image-carousel-wrapper,
.ps-hero-mc .swiper,
.ps-hero-mc .swiper-container { width: 100%; aspect-ratio: 1229 / 654; height: auto !important; max-height: none; overflow: hidden; background: #fff; padding: 0 !important; }
.ps-hero-mc .swiper-wrapper { height: 100% !important; padding: 0 !important; }
.ps-hero-mc .swiper-slide { height: 100% !important; display: block; background: #fff; }
.ps-hero-mc .swiper-slide figure,
.ps-hero-mc .swiper-slide-inner { margin: 0; width: 100%; height: 100% !important; background: #fff; }
.ps-hero-mc .swiper-slide img,
.ps-hero-mc img.swiper-slide-image {
    width: 100% !important; height: 100% !important; object-fit: contain; object-position: center; display: block;
}
/* orange ring pagination dots (match the hand-built hero) */
.ps-hero-mc .swiper-pagination,
.ps-hero-mc .elementor-swiper .swiper-pagination { bottom: 16px; position: absolute; }
.ps-hero-mc .swiper-pagination-bullet {
    width: 22px; height: 22px; background: transparent; opacity: 1; position: relative; margin: 0 3px;
}
.ps-hero-mc .swiper-pagination-bullet::after {
    content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
    width: 11px; height: 11px; border-radius: 50%; border: 2px solid var(--ps-color-primary); box-sizing: border-box;
}
.ps-hero-mc .swiper-pagination-bullet-active::after { background: var(--ps-color-primary); }
.ps-hero-mc .elementor-swiper-button { display: none; }   /* dots only, like the live hero */

/* --------------------------------------------------------------- INFO BAR */
.ps-el-infobar { background: #6d7c82; }
.ps-el-infobar > .elementor-container { color: #fff; }
.ps-el-infocol .elementor-heading-title {
    color: #fff !important; text-transform: uppercase; letter-spacing: 1px; font-size: 1rem;
    border-bottom: 2px solid var(--ps-color-accent-bright); display: inline-block;
    padding-bottom: 4px; margin: 0 0 1rem; font-family: var(--ps-font-heading); font-weight: 600;
}
.ps-el-infocol .elementor-widget-text-editor { color: #fff; font-weight: 600; }
.ps-el-infocol .ps-fact { font-weight: 400; }
.ps-el-infocol .ps-fact strong { color: var(--ps-color-accent-bright); }
/* tidy columns: heading + body stacked at the top, button centred + pinned to the bottom.
   Symmetric padding keeps the centred button truly centred within each column. */
.ps-el-infobar .elementor-column > .elementor-widget-wrap {
    display: flex; flex-direction: column; flex-wrap: nowrap; height: 100%; padding: 0 2.6rem !important; text-align: left;
}
.ps-el-infocol .elementor-widget-heading,
.ps-el-infocol .elementor-widget-text-editor { flex: 0 0 auto; }
.ps-el-infocol .elementor-widget-button { margin-top: auto; flex: 0 0 auto; }
.ps-el-infobar .elementor-button {
    background-color: var(--ps-color-primary) !important; color: #fff !important; font-family: var(--ps-font-heading);
    font-weight: 600; text-transform: uppercase; letter-spacing: .5px; border-radius: 3px;
    padding: .5rem 1.1rem; font-size: .78rem;
}
.ps-el-infobar .elementor-button:hover { background-color: var(--ps-color-primary-dark) !important; }
@media (min-width: 800px) {
    .ps-el-infobar .elementor-column:not(:first-child) > .elementor-widget-wrap {
        border-left: 1px solid rgba(255,255,255,.25);
    }
}

/* --------------------------------------------------------------- FEATURE BANDS */
.ps-el-bandimg .elementor-widget-container { line-height: 0; }
.ps-el-bandimg img { width: 100%; height: auto; display: block; }

/* --------------------------------------------------------------- SECTION HEADINGS */
.ps-section-title .elementor-heading-title { text-transform: uppercase; letter-spacing: 1px; color: var(--ps-color-secondary) !important; }
.ps-section-title.elementor-widget-heading { text-align: center; margin-bottom: .35rem; }
.ps-section-title.elementor-widget-heading .elementor-heading-title::after,
.ps-section-title .elementor-heading-title { position: relative; }
.ps-section-title.elementor-widget-heading::after {
    content: ""; display: block; width: 64px; height: 3px; background: var(--ps-color-accent-bright); margin: .6rem auto 1rem;
}
.ps-section-lead .elementor-widget-container {
    text-align: center; color: var(--ps-color-muted); max-width: 760px; margin: 0 auto 1rem;
}

/* --------------------------------------------------------------- STAFF (Loop Carousel) */
.ps-staff-card-tpl { text-align: center; }
.ps-staff-card-tpl .ps-staff-photo img { width: 100%; aspect-ratio: 1/1; object-fit: cover; display: block; }
.ps-staff-card-tpl .ps-staff-name .elementor-heading-title {
    font-family: var(--ps-font-heading); color: var(--ps-color-secondary); font-size: 1.15rem; margin: 1rem 0 .15rem;
}
.ps-staff-card-tpl .ps-staff-role .elementor-heading-title {
    color: var(--ps-color-primary); font-weight: 600; font-size: .9rem; text-transform: uppercase; letter-spacing: .5px; margin: 0 0 .6rem;
}
.ps-staff-card-tpl .ps-staff-quote { font-style: italic; color: var(--ps-color-muted); font-size: .82rem; line-height: 1.5; margin: .3rem .4rem 1rem; }
/* pin the social row to the bottom of each equal-height card */
.ps-staff-card-tpl > .elementor-widget-wrap { display: flex; flex-direction: column; height: 100%; }
.ps-staff-card-tpl .ps-staff-social-w { margin-top: auto; }
.ps-staff-card-tpl .ps-staff-social { display: flex; justify-content: center; gap: .6rem; margin: .6rem 0 .2rem; }
.ps-staff-card-tpl .ps-staff-social a { color: var(--ps-color-secondary); display: inline-flex; padding: 4px; }
.ps-staff-card-tpl .ps-staff-social a:hover { color: var(--ps-color-primary); }
/* staff carousel arrows — orange round, like the hand-built carousel */
.ps-staff-lc .elementor-swiper-button,
.ps-tband-lc .elementor-swiper-button {
    color: #fff; background: var(--ps-color-primary); width: 40px; height: 40px; border-radius: 50%;
}
.ps-staff-lc .elementor-swiper-button:hover,
.ps-tband-lc .elementor-swiper-button:hover { background: var(--ps-color-primary-dark); }

/* --------------------------------------------------------------- TESTIMONIAL BAND (orange) */
.ps-el-tband { background: var(--ps-color-primary); }
.ps-band-title.elementor-widget-heading .elementor-heading-title { color: #fff !important; text-transform: uppercase; letter-spacing: 1px; }
.ps-band-title.elementor-widget-heading { text-align: center; margin-bottom: 1.5rem; }
.ps-tband-card-tpl { text-align: center; max-width: 820px; margin: 0 auto; min-height: 200px; }
.ps-tband-card-tpl .ps-tband-quote {
    font-size: 1.05rem; font-style: italic; line-height: 1.6; color: #fff; margin: 0 0 1.6rem;
}
.ps-tband-card-tpl .ps-tband-quote::before { content: "\201C"; }
.ps-tband-card-tpl .ps-tband-quote::after { content: "\201D"; }
/* block widget-wrap so name + company sit inline on one centred line */
.ps-tband-card-tpl > .elementor-widget-wrap { display: block !important; text-align: center; }
.ps-tband-card-tpl .ps-tband-attr { display: inline-block; width: auto; vertical-align: baseline; margin: 0; }
.ps-tband-card-tpl .ps-tband-name { margin-right: .3em; }
.ps-tband-card-tpl .ps-tband-attr .elementor-heading-title {
    display: inline; color: #fff; font-family: var(--ps-font-heading); font-weight: 600; font-size: .95rem; font-style: normal; text-transform: uppercase;
}
.ps-tband-lc .swiper-pagination-bullet { background: #fff; }
.ps-band-readmore-btn { text-align: center; margin-top: 2rem; }
.ps-band-readmore-btn .elementor-button {
    background: transparent !important; border: 2px solid #fff; color: #fff !important; font-family: var(--ps-font-heading);
    font-weight: 600; text-transform: uppercase; letter-spacing: .5px; padding: .5rem 1.25rem; font-size: .75rem; border-radius: var(--ps-radius);
}
.ps-band-readmore-btn .elementor-button:hover { background: #fff !important; color: var(--ps-color-primary) !important; }

/* --------------------------------------------------------------- JOBS LISTING */
.ps-el-jobs { background: var(--ps-color-bg-alt); }
.ps-job-card-el > .elementor-widget-wrap,
.ps-job-card-el.elementor-column .elementor-widget-wrap {
    position: relative; background: #6d7c82; color: #fff; padding: 1.5rem 1.35rem 2.8rem; overflow: hidden; min-height: 150px;
}
.ps-job-card-el .elementor-widget-wrap::after {
    content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0;
    border-top: 30px solid var(--ps-color-accent-bright); border-left: 30px solid transparent;
}
.ps-job-card-el.is-presales .elementor-widget-wrap::after { border-top-color: #d24b8a; }
/* category label colour-coded per category (matches the corner tag / live site) */
.ps-job-cat, .ps-job-cat * { font-size: .68rem; text-transform: uppercase; letter-spacing: .5px; color: var(--ps-color-primary) !important; font-weight: 700; }
.ps-job-card-el.is-presales .ps-job-cat, .ps-job-card-el.is-presales .ps-job-cat * { color: #e368a6 !important; }
.ps-job-cat { margin-bottom: .35rem; }
.ps-job-card-el .ps-job-title .elementor-heading-title { color: #fff; font-size: 1.02rem; margin: 0 0 .45rem; line-height: 1.3; }
.ps-job-loc, .ps-job-loc * { font-size: .84rem; color: #fff !important; }
.ps-job-more { position: absolute !important; bottom: .8rem; right: 1.2rem; left: auto !important; width: auto !important; z-index: 3; text-align: right; }
.ps-job-more .elementor-button {
    background: transparent !important; color: #fff !important; padding: 0; font-weight: 600; font-size: .8rem; border-radius: 0; letter-spacing: 0; text-transform: none; font-family: var(--ps-font-body);
}
.ps-job-more .elementor-button:hover { color: #fff !important; text-decoration: underline; }

/* jobs "View all roles" + generic section button */
.ps-el-jobs .ps-el-cta > .elementor-button,
.ps-el-cta > .elementor-widget-container .elementor-button,
.ps-el-cta.elementor-widget-button .elementor-button {
    background-color: var(--ps-color-primary) !important; color: #fff !important; font-family: var(--ps-font-heading);
    font-weight: 600; text-transform: uppercase; letter-spacing: .5px; padding: .8rem 1.8rem; border-radius: var(--ps-radius);
}
.ps-el-cta .elementor-button:hover { background-color: var(--ps-color-primary-dark) !important; }
/* jobs "View all roles" centred under the grid */
.ps-el-jobs > .elementor-container > .elementor-column > .elementor-widget-wrap > .ps-el-cta.elementor-widget-button { text-align: center; margin-top: 1.5rem; }

/* ==========================================================================
   OPERATOR FEEDBACK ROUND 2 — homepage
   ========================================================================== */

/* 1. Staff carousel: fixed-height quote so every card is identical and the social
      icons land on one baseline; push the prev/next arrows off the cards. */
.ps-staff-card-tpl .ps-staff-quote {
    display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical;
    overflow: hidden; min-height: 3.9em;
}
.ps-staff-lc .swiper-wrapper { align-items: stretch; }
.ps-staff-lc .swiper-slide { height: auto; }
@media (min-width: 800px) {
    .ps-staff-lc .elementor-swiper-button-prev { left: -50px !important; }
    .ps-staff-lc .elementor-swiper-button-next { right: -50px !important; }
}

/* 2. Testimonials: full text, all centred (no clamp). */
.ps-el-tband { padding-top: 48px !important; padding-bottom: 48px !important; }
.ps-tband-card-tpl { min-height: 0; }
.ps-tband-card-tpl .ps-tband-quote {
    max-width: 860px; margin-left: auto; margin-right: auto; text-align: center;
}

/* 3. Jobs listing: bigger cards + more gap between boxes. */
.ps-el-jobs .elementor-inner-section .elementor-column { padding: 9px 14px; }
.ps-job-card-el > .elementor-widget-wrap,
.ps-job-card-el.elementor-column .elementor-widget-wrap { min-height: 205px; padding: 1.9rem 1.6rem 3rem; }

/* --------------------------------------------------------------- INFO BAR sizing (operator 2026-07-14) */
.ps-el-infocol .elementor-heading-title { font-size: 1.5rem !important; }
.ps-el-infocol .elementor-widget-text-editor,
.ps-el-infocol .ps-fact { font-size: 1.15rem; line-height: 1.6; }
.ps-el-infobar .elementor-button { padding: .85rem 1.9rem; font-size: .95rem; }