/* ========================================================= Capabilities Section — layout only (typography comes from base.css / common.css) ========================================================= */
.capabilities-section{background-color:var(--color-white);}
.capabilities-section .capabilities-section-wrapper{gap:10px;padding-block:var(--section-padding);text-align:center;}
/* each accent word carries its column's colour as an inline custom property,so the heading needs no classes of its own */
.capabilities-section .capabilities-section-wrapper h2 span{color:var(--accent);}
/* ---------- Surface ---------- */
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface{align-items:flex-start;/* Figma lets each column hug its own list */
 width:100%;padding-top:8px;border-radius:var(--radius-lg);box-shadow:inset 0 0 0 1px var(--color-border);/* Figma draws the stroke inside */
 text-align:left;}
/* ---------- Column ---------- */
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col-dev{--cap-color:var(--color-teal-700);--cap-bg-color:#0d708b4f;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col-sec{--cap-color:var(--color-navy-700);--cap-bg-color:#16324b47;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col-ops{--cap-color:var(--color-green-600);--cap-bg-color:#12a15029;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col{flex:1 1 0;min-width:0;gap:14px;padding:32px 30px;}
/* the rules between the columns — Ops ends the row,so it carries none */
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col-dev,.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col-sec{border-right:1px solid var(--color-border);}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col .capabilities-section-col-head{gap:12px;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col .capabilities-section-col-head .capabilities-section-col-tile{flex-shrink:0;width:42px;height:42px;background-color:var(--color-ink-25);border-radius:var(--radius-sm);}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col .capabilities-section-col-head .capabilities-section-col-tile img{width:22px;height:22px;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col .capabilities-section-col-head h3{color:var(--cap-color);}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col .capabilities-section-col-blurb p{font-size:var(--font-size-blurb);line-height:var(--line-height-blurb);color:var(--color-slate-500);}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col .capabilities-section-list{display:flex;flex-direction:column;gap:14px;--check-color:var(--cap-color);--cap-background-color:var();}
/* ---------- Large Desktop / Laptop ---------- */
@media (max-width:1199px){.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col{padding:28px 24px;}
}
/* ---------- Tablet ---------- */
@media (max-width:991px){.capabilities-section .capabilities-section-wrapper{text-align:left;align-items:flex-start;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col{padding:24px 18px;}
}
/* ---------- Mobile ---------- */
@media (max-width:767px){/* three lists side by side leave too little measure,so they stack and the rules move from between the columns to underneath them */
 .capabilities-section .capabilities-section-wrapper .capabilities-section-surface{flex-direction:column;align-items:stretch;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col{flex:0 0 auto;width:100%;padding:24px 22px;}
.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col-dev,.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col-sec{border-right:0;border-bottom:1px solid var(--color-border);}
}
/* ---------- Small Mobile ---------- */
@media (max-width:575px){.capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col{padding:22px 18px;}
}
/* ---------- Mobile Slider Overrides ---------- */
.capabilities-mobile-pagination{display:none;}
@media (max-width:991px){.capabilities-section-slider-wrapper{position:relative;width:100%;max-width:100vw;overflow:hidden;/* Prevent horizontal scrollbar during swipe */
}
/* Override the surface container to act as a proper Swiper track */
 .capabilities-section .capabilities-section-wrapper .capabilities-section-surface.swiper-wrapper{flex-direction:row;flex-wrap:nowrap;background-color:transparent;box-shadow:none;/* Remove whole-container border */
 gap:0;align-items:stretch;}
/* Make each column look like a discrete card */
 .capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col.swiper-slide{height:auto;flex-shrink:0;flex-basis:auto !important;border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-white);box-shadow:var(--shadow-md);/* Optional drop shadow */
}
/* Hide the internal dividers */
 .capabilities-section .capabilities-section-divider{display:none !important;}
/* Hide the column icon tile */
 .capabilities-section .capabilities-section-wrapper .capabilities-section-surface .capabilities-section-col .capabilities-section-col-head .capabilities-section-col-tile{display:none !important;}
.capabilities-mobile-pagination{display:block;position:relative;width:100%;text-align:center;margin-top:14px;}
}