/**
Theme Name: Miles IT 2026 Theme
Author: Sharon Parker
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: miles-it-2026-theme
Template: astra
*/
/* CSS by Piyush Start */
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400&family=Titillium+Web:wght@400;600;700&display=swap');
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Titillium+Web:wght@400;600;700&display=swap");


/* HubSpot */
.hbspt-form form input[type="checkbox"] {
	margin-right: 0.5rem;
}
.hs-form-checkbox, fieldset ul li, .hs_error_rollup ul li {
	list-style-type: none;
	width: 100% !important;
}
.hbspt-form form .hs-submit{
	margin-top: 1.5rem;
}

/* Start Contact Page Form / HubSpot */
fieldset>.hs_company .hs-input, fieldset>.hs_message .hs-input, fieldset>.hs_phone input.hs-input, fieldset>.hs_email .hs-input {
	width: 100% !important;
}
form.hs-form-private fieldset>div{
	margin-bottom:10px;
}
fieldset>.hs_interest label span{
	text-transform: capitalize;
}
fieldset>.hs_interest div.input ul li {
	border: 1px solid #f0f5fa;
	border-radius: 4px;
	padding: 6px 14px;
}
fieldset>.hs_interest div.input ul {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
fieldset>[class^="hs_"] ul, .hs_error_rollup ul{
	margin:0;
	padding:0;
}
fieldset>[class^="hs_"]>div.input{
	margin-top:2px;
	margin-right:0px;
}
fieldset>[class^="hs_"] ul li label.hs-error-msg, span.hs-form-required, .hs_error_rollup ul li label{
	color: red;
	margin:0;
}
fieldset .hs_phone select, fieldset>.hs_gclid, fieldset>.hs_last_keywords, fieldset>.hs_cookie_utm_term, fieldset>[class^="hs_utm_"], fieldset>.hs_referral_email, fieldset>.hs_msclkid {
	display: none;
}
form[id^="hsForm_"] fieldset{
	max-width:100%;
}
div.hs_submit input.hs-button {
	width: 100%;
  	border-radius: 8px;
}
/* End Contact Page Form / HubSpot */

/* Main Footer */
/* .ast-builder-grid-row-5-equal .ast-builder-grid-row {
	grid-template-columns: repeat(5, 1fr);
}
 */
.widget_custom_html {
	display: flex;
	justify-content: center;
	margin: 0 10px;
}
div.footer-description{
	margin-top: 14px;
}
div.footer-social-icons img{
	width: 24px;
	height: auto;
	margin: 0 4px;
}
div.footer-list-header{
	margin-bottom: 14px;
}
ul.footer-list{
	margin-bottom: 18px;
}

/* Above header, Top header, Secondary menu */
.ast-above-header-bar .ast-builder-grid-row.ast-grid-center-col-layout-only .ast-grid-section-center{
    flex-grow: inherit;
}
.ast-header-break-point .main-navigation ul .menu-item .menu-link{
	padding: 0 1em;
}

/* Menu buttons ask Milo.  */

.header-contact-btn{
	padding: 8px 16px;
	border-radius: 7px;
	width: 112px;
	font-size: 1rem;
}
.ast-mobile-header-content .ast-header-html-1,
.ast-header-html-1 .ast-builder-html-element{
	display: flex;
	gap: 14px;
	justify-content:center;
}
.ask-milo-btn-wrap,
.ask-milo-btn {
	cursor: pointer;
	line-height: normal;
}
.ghost-ask-milo-cta,
.filled-ask-milo-cta {
	width: clamp(110px, 10vw, 125px);
	transition: opacity 0.15s ease;
}
.filled-ask-milo-cta,
.ask-milo-btn:hover .ghost-ask-milo-cta {
	display:none;
}
.ask-milo-btn:hover .filled-ask-milo-cta {
	display:block;
}

/* Search Full Screen */
.ast-search-box.full-screen .ast-search-wrapper {
    top: 30%;
}


@media screen and (min-width: 922px) and (max-width: 1190px) {
	.ast-desktop .ast-primary-header-bar.main-header-bar{
		padding:0 2%;
	}
	.ast-logo-title-inline .site-logo-img{
		padding: 0;
	}
	header .custom-logo-link img,
	.ast-sticky-main-shrink #masthead .ast-sticky-shrunk .site-logo-img img{
		width: clamp(140px, 15vw, 192px);
	}
	.site-header-section>* {
    	padding: 0 7px;
	}
	.ast-icon.icon-arrow svg {
		margin-left: 7px;
	}
	.header-contact-btn{
		font-size: 0.9rem;
		padding: 7px 10px;
		border-radius: 7px;
		width: 92px;
		
	}
}
@media screen and (min-width: 922px) and (max-width: 1000px) {
	.ast-builder-menu-1 .menu-item > .menu-link{
		padding: 0 7px;
	}
	.ast-builder-menu-1 .menu-item > .menu-link .menu-text {
		font-size: 14px;
	}
}

.single.single-brand .ast-article-single figure,
.single.single-brand .ast-article-single img:not(figure img) {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}


/* CSS by Piyush End */


.footer-phone-btn a {
	padding:14px;
}

/* copyright */
.ast-footer-button-1{
	width: auto !important;
	min-width: 230px;
}

/*  Footer widget*/
.ast-builder-footer-grid-columns 
.site-footer-section:nth-child(2) 
aside.footer-widget-area-inner {
  margin-left:46px;
}

.site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row {
    max-width: 100% ;
}
.ast-footer-button-1[data-section*="section-fb-button-"] .ast-builder-button-wrap .ast-custom-button {
    margin-left: 0px;
}
@media only screen and (max-width: 800px) {
	div.footer-social-icons img {
    width: 16px;
    height: auto;
    margin: 0 2px;
}
  .ast-builder-footer-grid-columns 
  .site-footer-section:nth-child(2) 
  aside.footer-widget-area-inner {
    margin-left: 10px !important;
  }
	.widget_custom_html {
    justify-content: flex-start;
}
	div.footer-description p {
    font-size: 12px;
}
	.footer-phone-btn a {
    padding: 9px;
}
	li.footer-list-item {
    font-size: 12px;
}
	.ast-footer-copyright p {
    text-align: center !important;
}
	.ast-footer-button-1[data-section*="section-fb-button-"] .ast-builder-button-wrap .ast-custom-button {
    margin-left: 0px;
}
}
@media only screen and (max-width: 460px) {
  .ast-builder-footer-grid-columns 
  .site-footer-section:nth-child(2) 
  aside.footer-widget-area-inner {
    margin-left: 0px !important;
  }
	.footer-phone-btn {
	margin-bottom: 8px !important;
    margin-top: 21px !important;
	}
}
.single-genially .entry-meta,
.single-genially .ast-author-details,
.single-genially .posted-on,
.single-genially .post-author {
    display: none;
}


.single-landing_page .entry-meta,
.single-landing_page .ast-author-details,
.single-landing_page .posted-on,
.single-landing_page .post-author {
    display: none;
}

@media (max-width: 781px) {
  .mobile-center .wp-block-buttons {
    justify-content: center;
  }
  .mobile-center h2.wp-block-heading {
    text-align: center;
  }
  .mobile-center > .wp-block-heading + p {
    text-align: center;
  }
}

.ask-milo-cta {
  display: inline-flex;
  align-items: center;
  line-height: 0;
}
.ask-milo-cta svg {
  width: 128px;
  height: auto;
  display: block;
}
.ask-milo-cta:hover svg,
.ask-milo-cta:focus-visible svg {
  opacity: 0.85;
  transition: opacity 0.15s ease;
}
.ask-milo-cta:focus-visible {
  outline: 2px solid #4568DC;
  outline-offset: 2px;
}

.ast-header-html .ask-milo-cta,
.ast-builder-html-element p {
  margin: 0;
}
.ast-header-html-1 .ast-builder-html-element,
.ast-header-html-1 .ast-builder-html-element p {
  display: flex;
  align-items: center;
  height: 100%;
}

/* ═══════════════════════════════════════════════════════════════════════
   Miles IT — FAQ Accordion (Clean Cards)
   Paste into:  Appearance → Customize → Additional CSS
   (or your child theme's stylesheet).

   This is the only custom CSS the redesign needs. Everything else —
   card surface, 1px border, 14px radius, padding, gaps, heading size —
   is set with native block attributes in accordion-blocks.html.

   Two things WordPress does NOT expose as block attributes, handled here:
     1. The open-state look (blue border + soft shadow)
     2. Replacing the default ▸ triangle with a + / − indicator
   ═══════════════════════════════════════════════════════════════════════ */

/* --- Card: smooth open/close + open-state highlight ----------------------- */
.miles-faq .wp-block-cover.miles-faq__item {
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.miles-faq .wp-block-cover.miles-faq__item:has(details[open]) {
  border-color: #004AA0 !important;                 /* blue border when open */
  box-shadow: 0 10px 25px -6px rgba(0, 74, 160, 0.18);
}

/* --- Summary row: question left, indicator right; hide native triangle ---- */
.miles-faq details > summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  cursor: pointer;
}
.miles-faq details > summary::-webkit-details-marker { display: none; }
.miles-faq details > summary::marker { content: ""; }

/* --- + / − indicator, drawn from two bars (no image/icon font) ------------ */
/* Two background layers (vertical + horizontal bar = plus). The vertical bar's
   height is animated to 0 via background-size, which IS animatable — so it
   morphs smoothly from + to − on the frontend. */
.miles-faq details > summary::after {
  content: "";
  flex: none;
  width: 22px;
  height: 22px;
  background-image:
    linear-gradient(#004AA0, #004AA0),   /* vertical bar */
    linear-gradient(#004AA0, #004AA0);   /* horizontal bar */
  background-position: center, center;
  background-repeat: no-repeat;
  background-size: 2.5px 100%, 100% 2.5px;
  transition: background-size 0.3s ease, transform 0.3s ease;
}
.miles-faq details[open] > summary::after {
  /* collapse the vertical bar to height 0 → minus, with a quarter spin */
  background-size: 2.5px 0, 100% 2.5px;
  transform: rotate(180deg);
}

/* --- Optional: prevent the sideways jump from the scrollbar appearing ----- */
/* html { scrollbar-gutter: stable; } */

@media (prefers-reduced-motion: reduce) {
  .miles-faq .wp-block-cover.miles-faq__item,
  .miles-faq details > summary::after { transition: none; }
}

/* ── CLS fix v2: metric-matched fallback fonts ───────────────────────
   Fallbacks sized to match Titillium Web and Lato so the swap from
   fallback → web font produces no layout shift.

   ★ INTERIM LOCATION — this block is slated to move to the child theme
   stylesheet (astra-child/style.css). When a dev completes that SFTP
   transfer, DELETE this block from Additional CSS the same day so two
   copies never run together.

   v2 (Jul 10, 2026): override values regenerated from actual font
   metric tables (@capsizecss/metrics) instead of the June estimates.
   The Lato size-adjust correction (98% → 97.69%) is the one that
   matters for paragraph-heavy templates: horizontal width controls
   line wrapping, which Astra's explicit line-heights don't neutralize.
   Also added local("Liberation Sans") as a second source — PSI's
   Linux test environment may lack Arial; Liberation Sans is
   metric-compatible with Arial, so the same overrides apply.

   DEPENDENCY NOTE: These values are tuned to Titillium Web (headings)
   and Lato (body) relative to an Arial-class local fallback. If either
   font is changed in Astra's typography settings, regenerate these
   (or remove the block). */

/* Fallback for Titillium Web (headings) */
@font-face {
  font-family: "Titillium Web Fallback";
  src: local("Arial"), local("Liberation Sans");
  size-adjust: 94.44%;
  ascent-override: 119.97%;
  descent-override: 41.09%;
  line-gap-override: 0%;
}

/* Fallback for Lato (body) */
@font-face {
  font-family: "Lato Fallback";
  src: local("Arial"), local("Liberation Sans");
  size-adjust: 97.69%;
  ascent-override: 101.03%;
  descent-override: 21.80%;
  line-gap-override: 0%;
}

/* Insert the fallbacks ahead of the system generics in Astra's stacks */
body,
button,
input,
select,
textarea,
.ast-button,
.ast-custom-button {
  font-family: "Lato", "Lato Fallback", sans-serif;
}

h1, h2, h3, h4, h5, h6,
.entry-content :where(h1, h2, h3, h4, h5, h6),
.site-title,
.site-title a {
  font-family: "Titillium Web", "Titillium Web Fallback", sans-serif;
}

@media (max-width: 781px) {
    /* Container governs all native blocks inside it */
    .mobile-center,
    .mobile-center :where(.wp-block-heading, p, .wp-block-buttons) {
        text-align: center;
    }
    .mobile-center .wp-block-buttons {
        justify-content: center;
    }

    /* Custom HTML opts out — its content is hand-managed */
    .mobile-center .wp-block-html,
    .mobile-center .wp-block-html * {
        text-align: revert;
    }
}


/* Case study  */

header.entry-header {
    display: none;
}

.ast-single-post.ast-page-builder-template .site-main > article, .ast-page-builder-template .post-navigation {
	padding:0px !important;
	
}

.single-case-study .ast-article-single figure,
.single-case-study .ast-article-single img:not(figure img) {
    box-shadow: none;
}

/* Kill the gap between full-bleed sections */
.single-case-study .entry-content[data-ast-blocks-layout] > * {
    margin-bottom: 0;
}

/* Remove Astra's default 3em padding on top-level sections */
.single-case-study .entry-content > .wp-block-cover,
.single-case-study .entry-content > .wp-block-group,
.single-case-study .entry-content > .wp-block-columns {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════════════════
   CAROUSEL BLOCK PLUGIN (cb-carousel-v2 / Swiper-based)
   ───────────────────────────────────────────────────────────────────
   All rules below apply ONLY to carousels built with the Carousel
   Block plugin. Every selector is scoped under .wp-block-cb-carousel-v2,
   the wrapper class the plugin stamps on every carousel it renders —
   sitewide, any instance, current or future. Cannot affect anything
   else (static Columns card rows have their own card-row CSS).

   REQUIRED SLIDE STRUCTURE (build standard):
     Slide → Stack (card: bg/border/padding, vertical flex,
                    Space Between) → [ content Stack, Buttons ]
   Card styling lives on the outer Stack, NOT on a Columns wrapper.
   Do NOT set Minimum Height on either Stack — with stretched slides,
   min-height:100% starves the buttons of room and (combined with
   WP's global flex-wrap:wrap) wraps them sideways out of the card.

   Card style note: carousel cards use a 1px border, NO box-shadow.
   If a shadow is ever reintroduced, Swiper's overflow:hidden will
   clip it — the padding/negative-margin fix must be restored
   (see decision log).
   ═══════════════════════════════════════════════════════════════════ */

/* 1. EQUAL-HEIGHT SLIDES
      Two conditions must both hold for slides to stretch to the
      tallest sibling: the wrapper must align-items:stretch, and
      slide height must be auto (Swiper's height:100% resolves
      against an indefinite wrapper height and shrink-wraps instead).
      !important guards against the plugin stylesheet winning the
      cascade on either property. */
.wp-block-cb-carousel-v2 .swiper-wrapper {
    align-items: stretch;
}
.wp-block-cb-carousel-v2 .swiper-slide {
    height: auto !important;
    display: flex;
}

/* 2. CARD FILLS SLIDE
      The card Stack grows to the slide's full stretched height.
      display/flex-direction restated deliberately (generated
      per-container CSS has proven unreliable — do not remove as
      "redundant"). flex-wrap:nowrap overrides WP's global
      .is-layout-flex { flex-wrap:wrap }, which in a COLUMN container
      wraps overflowing children into a new column to the RIGHT —
      the "escaped pill" bug. Never allow wrap inside the card. */
.wp-block-cb-carousel-v2 .swiper-slide > .wp-block-group {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

/* 3. CTA PINNED TO CARD BOTTOM
      Backstop for the Stack's Space Between setting.
      margin-top:auto pins the buttons regardless. */
.wp-block-cb-carousel-v2 .swiper-slide > .wp-block-group > .wp-block-buttons {
    margin-top: auto;
    padding-top: var(--wp--preset--spacing--20);
}

/* 4. SEPARATOR WIDTH FIX
      Astra styles <hr> with `margin: 20px auto`. In a flex column,
      auto side-margins block cross-axis stretch, collapsing the empty
      <hr> to zero width (invisible line). Zero the side margins so
      the separator fills the card. */
.wp-block-cb-carousel-v2 .swiper-slide .wp-block-group .wp-block-separator {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

/* 5. HIDE PREV/NEXT ARROWS ON MOBILE
      Below the 1-slide breakpoint, swipe + pagination bullets are
      the interaction; arrows are redundant and crowd the layout. */
@media (max-width: 767.98px) {
    .wp-block-cb-carousel-v2 .cb-button-prev,
    .wp-block-cb-carousel-v2 .cb-button-next {
        display: none;
    }
}

/* ─────────────────── END CAROUSEL BLOCK PLUGIN ─────────────────── */

}
@media (max-width: 768px) {
  .site-footer .ast-builder-grid-row {
    grid-template-columns: 100%;
  }
}

.ast-container {
    max-width: 100% !important;
    padding: 0;
}

.entry-content[data-ast-blocks-layout] > * {
    max-width: 100% !important;
    margin-left: auto;
    margin-right: auto;
}

/* ── card-row.align-rows: sync title / image / text rows across
   sibling cards using CSS grid + subgrid. The title row grows to
   the tallest heading in the row, so images start on the same line.
   Scope: Columns blocks carrying BOTH classes card-row + align-rows
   (currently only the 12-beliefs pattern). Requires exactly 3 direct
   children per column — wrap multiple paragraphs in a Group.
   Desktop only; below 782px, mobile stacking reverts to default.
   Editor shows ragged titles — front-end only, expected.
   ★ INTERIM: move to astra-child/style.css at next SFTP session. */
@media (min-width: 782px) {
    .wp-block-columns.card-row.align-rows {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 1fr;
        grid-template-rows: auto auto 1fr;
        row-gap: 0;
    }
    .card-row.align-rows > .wp-block-column {
        display: grid;
        grid-template-rows: subgrid;
        grid-row: span 3;
    }
    /* Constrained layout's auto side-margins make grid items
       shrink-wrap + center; full width restores left alignment */
    .card-row.align-rows > .wp-block-column > * {
        width: 100%;
    }
}

/* Csae Studies Section */
#miles-case-studies {
  --miles-black: #161E2E;
  --miles-dark-blue: #002C68;
  --miles-blue: #004AA0;
  --miles-blue-120: #00316B;
  --miles-light-blue-75: #CEE4FF;
  --miles-gray: #515252;
  --miles-light-gray: #DBDBDB;
  --miles-black-90: #3D4451;
  --miles-black-70: #8A8E97;
  --miles-black-20: #EFF0F1;
  --mcs-bg: #FAFBFD;
  --font-heading: "Titillium Web", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-body: "Lato", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  font-family: var(--font-body);
  color: var(--miles-black);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

#miles-case-studies, #miles-case-studies *, #miles-case-studies *::before, #miles-case-studies *::after { box-sizing: border-box; }
#miles-case-studies a { text-decoration: none; }
#miles-case-studies :focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(0,74,160,0.25); border-radius: 4px; }

/* ---- hero ---- */
#miles-case-studies .mcs-hero { background: linear-gradient(180deg, #FFFFFF 0%, var(--miles-light-blue-75) 100%); }
#miles-case-studies .mcs-hero-inner { max-width: 1280px; margin: 0 auto; text-align: center; padding: 64px 24px 58px; }
#miles-case-studies .mcs-hero-title { font-family: var(--font-heading); font-weight: 700; font-size: clamp(38px, 6vw, 56px); letter-spacing: 0.02em; color: var(--miles-blue); margin: 0; line-height: 1.05; }
#miles-case-studies .mcs-hero-sub { font-family: var(--font-body); font-size: clamp(15px, 2.2vw, 18px); color: var(--miles-gray); margin: 16px auto 0; max-width: 560px; line-height: 1.55; }
@media (max-width: 640px) { #miles-case-studies .mcs-hero-inner { padding: 44px 20px 36px; } }

/* ---- main band ---- */
#miles-case-studies .mcs-main { background: var(--mcs-bg); padding: 36px 0 56px; }
#miles-case-studies .mcs-container { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
@media (max-width: 640px) { #miles-case-studies .mcs-container { padding: 0 16px; } #miles-case-studies .mcs-main { padding: 24px 0 40px; } }

/* ---- filter pills ---- */
#miles-case-studies .mcs-filters { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-bottom: 36px; }
#miles-case-studies .mcs-pill { font-family: var(--font-heading); font-weight: 700; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; background: #FFFFFF; color: var(--miles-black); border: 1px solid var(--miles-light-gray); padding: 8px 20px; border-radius: 100px; transition: color .12s, border-color .12s; }
#miles-case-studies .mcs-pill:hover { border-color: var(--miles-blue); color: var(--miles-blue); }
#miles-case-studies .mcs-pill--on { background: var(--miles-blue); color: #FFFFFF; border-color: var(--miles-blue); padding: 9px 20px; }
#miles-case-studies .mcs-pill--on:hover { color: #FFFFFF; border-color: var(--miles-blue); }
@media (max-width: 640px) { #miles-case-studies .mcs-filters { gap: 8px; margin-bottom: 28px; } #miles-case-studies .mcs-pill { font-size: 12px; padding: 7px 16px; } #miles-case-studies .mcs-pill--on { padding: 8px 16px; } }

/* ---- card grid ---- */
#miles-case-studies .mcs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 980px) { #miles-case-studies .mcs-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { #miles-case-studies .mcs-grid { grid-template-columns: 1fr; gap: 20px; } }

/* ---- card ---- */
#miles-case-studies .mcs-card { background: #FFFFFF; border: 1px solid var(--miles-light-gray); border-radius: 10px; box-shadow: 0 2px 4px -2px rgba(0,0,0,0.10), 0 4px 6px -1px rgba(0,0,0,0.10); overflow: hidden; display: flex; flex-direction: column; }
#miles-case-studies .mcs-card-art { height: 160px; background: var(--miles-black-20); display: flex; align-items: center; justify-content: center; overflow: hidden; }
#miles-case-studies .mcs-card-mono { font-family: var(--font-heading); font-weight: 700; font-size: 72px; color: var(--miles-black-90); letter-spacing: 0.02em; line-height: 1; }
#miles-case-studies .mcs-card-body { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
#miles-case-studies .mcs-chip { align-self: flex-start; font-family: var(--font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--miles-black-90); background: var(--miles-black-20); padding: 4px 9px; border-radius: 4px; }
#miles-case-studies .mcs-card-title { font-family: var(--font-heading); font-weight: 700; font-size: 20px; letter-spacing: 0.01em; color: var(--miles-black); margin: 0; line-height: 1.25; }
#miles-case-studies .mcs-card-desc { font-family: var(--font-body); font-size: 14.5px; color: var(--miles-gray); margin: 0; line-height: 1.55; flex: 1; }
@media (max-width: 640px) {
  #miles-case-studies .mcs-card-art { height: 120px; }
  #miles-case-studies .mcs-card-mono { font-size: 52px; }
  #miles-case-studies .mcs-card-body { padding: 18px 18px 20px; gap: 10px; }
  #miles-case-studies .mcs-card-title { font-size: 19px; }
  #miles-case-studies .mcs-card-desc { font-size: 14px; }
}

/* ---- CTA button (brand morph on hover) ---- */
#miles-case-studies .mcs-btn { display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-weight: 700; font-size: 15px; background: var(--miles-dark-blue); color: #FFFFFF; padding: 11px 22px; border-radius: 6px; margin-top: 6px; transition: background .2s, color .2s, border-radius .2s, transform .2s; transform: scale(1); }
#miles-case-studies .mcs-btn:hover { background: var(--miles-black); color: #FFFFFF; border-radius: 100px; transform: scale(1.03); }
#miles-case-studies .mcs-btn:active { transform: scale(0.99); }
@media (max-width: 640px) { #miles-case-studies .mcs-btn { padding: 12px 22px; } }

/* ---- pagination ---- */
#miles-case-studies .mcs-pagination { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 44px 0 4px; }
#miles-case-studies .mcs-page { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 6px; background: #FFFFFF; border: 1px solid var(--miles-light-gray); color: var(--miles-black); font-family: var(--font-heading); font-weight: 700; font-size: 15px; transition: color .12s, border-color .12s; }
#miles-case-studies .mcs-page:hover { border-color: var(--miles-blue); color: var(--miles-blue); }
#miles-case-studies .mcs-page--on { background: var(--miles-blue); color: #FFFFFF; border-color: var(--miles-blue); }
#miles-case-studies .mcs-page--on:hover { color: #FFFFFF; border-color: var(--miles-blue); }
#miles-case-studies .mcs-dots { font-family: var(--font-body); color: var(--miles-black-70); font-size: 15px; padding: 0 4px; }
#miles-case-studies .mcs-next { display: flex; align-items: center; font-family: var(--font-heading); font-weight: 700; font-size: 15px; color: var(--miles-blue); padding: 0 10px; }
#miles-case-studies .mcs-next:hover { color: var(--miles-blue-120); text-decoration: underline; }
@media (max-width: 640px) { #miles-case-studies .mcs-pagination { padding: 32px 0 0; } #miles-case-studies .mcs-page { width: 40px; height: 40px; } }

/* Menu Striven */
.striven-menu-icon {
    padding: 40px 0px;
    justify-content: center;
    display: grid;
    position: relative;
    width: 100%;
    margin: 18px 0px;
}
.striven-menu-icon img {
    width: 100%;
    margin: 0 auto;
    max-height: 8vh;
    height: auto;
}
@media only screen and (max-width: 2860px) {
.striven-menu-icon.mob-none {
    display: grid !important;
}
	.striven-mob-menu-icon.desk-none {
	display:none !important;
}
}
@media only screen and (max-width: 860px) {
.striven-menu-icon.mob-none {
    display: none !important;
}
	.striven-mob-menu-icon.desk-none {
	display:block !important;
}
	.striven-mob-menu-icon {
    padding: 0px 40px;
	margin: 0px 0px;
}
	.ast-header-break-point .main-navigation ul .menu-item .menu-link {
    padding: 0 9px;
}
}
											
.striven-menu-icon a {
    margin-top: 20px;
}
li#menu-item-9160,
li#menu-item-8692 {
    background-color: #F0F5FA;
}
.ast-desktop .ast-mega-menu-enabled .astra-megamenu-li.megamenu-active .astra-megamenu>.menu-item, .ast-desktop .ast-mega-menu-enabled .astra-megamenu-li:not([data-megamenu-trigger=click]):hover .astra-megamenu>.menu-item {
    font-size: 14px;
}
.ast-desktop .ast-mega-menu-enabled .ast-hide-menu-item+.ast-mm-custom-content {
    text-align: center;
    margin-top: .9em;
}
a.button.button-primary:hover {
color: #ffffff;
    background-color: #161e2e;
    border-color: #161e2e;	
	
}
.ast-footer-copyright a {
    color: #fff;
}