/*
 Theme Name:   ACM Child
 Theme URI:    https://www.acmbearings.co.uk
 Description:  Child theme for ACM Bearings (HEF parent theme)
 Author:       Ascend Marketing
 Template:     hef
 Version:      1.0.0
*/

/* ===========================
   ACM Bearings – Base & Brand
   =========================== */
:root{
  --hef-blue:#0097DB;
  --hef-blue-dark:#004A99;
  --hef-grey:#87867C;
  --text:#1b1b1b;
  --muted:#6b7075;
  --bg:#ffffff;
  --bg-soft:#f6f8fa;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
img{max-width:100%;height:auto;display:block}

/* Headings use Rajdhani if enqueued in functions.php */
h1,h2,h3,h4,.btn{font-family:'Rajdhani',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
h1{font-weight:700;letter-spacing:.2px;margin:.2em 0 .35em}
h2{font-weight:700;margin:0 0 .6em}
h3{font-weight:600;margin:.4em 0}

.container{max-width:1200px;margin:0 auto;padding:0 20px}

/* Buttons */
.btn{
  display:inline-block; text-decoration:none; border-radius:10rem;
  padding:.8rem 1.35rem; font-weight:600; transition:all .2s ease;
  border:2px solid transparent
}
.btn-primary{background:var(--hef-blue); color:#fff}
.btn-primary:hover{background:var(--hef-blue-dark)}
.btn-secondary{background:transparent; color:var(--hef-blue); border-color:var(--hef-blue)}
.btn-secondary:hover{color:#fff; background:var(--hef-blue-dark); border-color:var(--hef-blue-dark)}
.btn-tertiary{color:var(--text); border-color:var(--hef-grey)}
.btn-tertiary:hover{background:var(--hef-grey); color:#fff}

/* ===========================
   HERO (Header banner)
   =========================== */
.home-hero{position:relative; overflow:hidden; background:#0a0f1a}
.home-hero .hero-grid{
  display:grid; grid-template-columns:1.15fr .85fr; gap:32px; align-items:center;
  min-height:560px;  /* <- desktop banner height (matches your ref) */
  padding:56px 0;
}
.home-hero .hero-media{
  position:relative; height:100%;
}
.home-hero .hero-media img{
  width:100%; height:100%; object-fit:cover; border-radius:12px;
}
.home-hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.35) 35%,rgba(0,0,0,0) 65%);
  pointer-events:none;
}
.home-hero .hero-copy{position:relative; z-index:1; color:#fff; max-width:660px}
.home-hero .overt{color:#d7eafe; text-transform:uppercase; letter-spacing:.12em; font-weight:600; margin:0 0 .5rem}
.home-hero h1{color:#fff; font-size:clamp(28px,4vw,48px); line-height:1.1}
.home-hero .sub{color:#e9eef4; font-size:1.1rem; margin:.75rem 0 1.25rem}
.home-hero .cta-row{display:flex; gap:14px; flex-wrap:wrap}

.reassurance{
  display:flex; gap:12px; flex-wrap:wrap; margin-top:18px; padding:0; list-style:none
}
.reassurance li{display:flex; gap:8px; align-items:center; color:#f0f4f7; font-weight:600}
.reassurance img{width:22px; height:22px; object-fit:contain}

/* ===========================
   Section blocks
   =========================== */
section{padding:56px 0}
.home-why{background:var(--bg)}
.pillars-grid{display:grid; gap:20px; grid-template-columns:repeat(4,1fr)}
.pillar{background:var(--bg-soft); padding:22px; border-radius:12px}
.pillar h3{margin:.25rem 0 .35rem}
.pillar p{color:var(--muted); margin:0}

.home-products .card-grid{display:grid; gap:20px; grid-template-columns:repeat(3,1fr)}
.home-products .card{
  display:block; background:#fff; border:1px solid #e7e9ed; border-radius:12px; overflow:hidden;
  box-shadow:0 1px 2px rgba(0,0,0,.04)
}
.home-products .card img{aspect-ratio:3/2; object-fit:cover}
.home-products .card h3{padding:14px 16px 0}
.home-products .card p{padding:6px 16px 16px; color:var(--muted); margin:0}
.home-products .card:hover{box-shadow:0 6px 18px rgba(0,0,0,.08); transform:translateY(-2px)}

.home-markets .intro{max-width:820px; color:var(--muted)}
.home-markets .tile-grid{display:grid; gap:18px; grid-template-columns:repeat(4,1fr)}
.home-markets .tile{
  display:flex; align-items:center; gap:12px;
  background:#fff; border:1px solid #e7e9ed; border-radius:12px; padding:14px 16px; color:var(--text); text-decoration:none
}
.home-markets .tile:hover{border-color:var(--hef-blue); box-shadow:0 4px 14px rgba(0,151,219,.15)}
.home-markets .tile img{width:32px; height:32px; object-fit:contain}

.home-services .services-list{display:grid; gap:18px; grid-template-columns:repeat(2,1fr)}
.home-services .service-item{background:var(--bg-soft); border-radius:12px; padding:18px}
.home-services .service-item h3{margin:0 0 .25rem}
.home-services .service-item p{color:var(--muted); margin:0 0 .5rem}
.home-services .service-item .link{color:var(--hef-blue); font-weight:600; text-decoration:none}

.home-proof .proof-bullets{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; padding:0; list-style:none}
.home-proof .logo-row{display:flex; gap:22px; flex-wrap:wrap; align-items:center; margin-top:14px}
.home-proof .logo img{height:44px; width:auto; filter:grayscale(100%) contrast(1.1)}
.home-proof .logo:hover img{filter:none}

.home-testimonials .quotes{display:grid; gap:18px; grid-template-columns:repeat(3,1fr)}
.home-testimonials blockquote{background:#fff; border:1px solid #e7e9ed; border-radius:12px; padding:18px; margin:0}
.home-testimonials cite{display:block; margin-top:.5rem; color:var(--muted); font-style:normal}

.home-news .news-cards{display:grid; gap:18px; grid-template-columns:repeat(3,1fr)}
.home-news .news-card{background:#fff; border:1px solid #e7e9ed; border-radius:12px; padding:18px}
.home-news .meta{color:var(--muted); font-size:.9rem; margin:.2rem 0 .6rem}

.home-final-cta{background:var(--bg-soft); text-align:center; padding:64px 0}
.home-final-cta h2{margin:0 0 1rem}
.home-final-cta .cta-row{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}

/* ===========================
   Responsive
   =========================== */
@media (max-width:1080px){
  .home-hero .hero-grid{grid-template-columns:1fr; min-height:480px}
  .home-hero::before{background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.2) 55%,rgba(0,0,0,0) 100%)}
  .home-hero .hero-media{order:-1; height:260px; margin-bottom:10px}
  .pillars-grid{grid-template-columns:repeat(2,1fr)}
  .home-markets .tile-grid{grid-template-columns:repeat(2,1fr)}
  .home-services .services-list{grid-template-columns:1fr}
  .home-proof .proof-bullets{grid-template-columns:1fr}
  .home-products .card-grid,
  .home-testimonials .quotes,
  .home-news .news-cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .home-products .card-grid,
  .home-markets .tile-grid,
  .home-testimonials .quotes,
  .home-news .news-cards{grid-template-columns:1fr}
}
/* ================================
   ACM – NEW HOMEPAGE SECTIONS
   Materials Spotlight, Markets Grid, Resources Teaser
   (scoped styles; safe to paste at end of file)
   ================================ */

/* ---- Shared tokens (uses your existing palette if present) ---- */
:root{
  --hef-blue:#0097DB;
  --hef-blue-dark:#004A99;
  --text:#1b1b1b;
  --muted:#6b7075;
  --bg:#ffffff;
  --bg-soft:#f6f8fa;
  --card-border:#e7e9ed;
  --shadow:0 1px 2px rgba(0,0,0,.04);
  --shadow-hover:0 6px 18px rgba(0,0,0,.08);
}

/* Utility: consistent grid container for these blocks */
.home-materials .card-grid,
.home-resources .card-grid,
.home-markets .tile-grid{
  display:grid; gap:20px;
}

/* Headings/intro text in these sections */
.home-materials h2,
.home-markets h2,
.home-resources h2{
  margin:0 0 .5rem; font-weight:700;
  font-family:'Rajdhani',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
.home-materials .intro,
.home-markets .intro,
.home-resources .intro{
  color:var(--muted); margin:0 0 1.1rem; max-width:820px;
}

/* ================================
   MATERIALS SPOTLIGHT
   ================================ */
.home-materials{ padding:56px 0; background:var(--bg) }

/* grid = 3-up desktop, 2-up tablet, 1-up mobile */
.home-materials .materials-cards{
  grid-template-columns:repeat(3, minmax(0,1fr));
}

.home-materials .card{
  background:#fff; border:1px solid var(--card-border); border-radius:12px;
  overflow:hidden; box-shadow:var(--shadow); transition:transform .15s ease, box-shadow .15s ease;
  display:flex; flex-direction:column;
}
.home-materials .card:hover{ transform:translateY(-2px); box-shadow:var(--shadow-hover) }

.home-materials .card img{
  width:100%; aspect-ratio:3/2; object-fit:cover; display:block;
}
.home-materials .card h3{
  margin:14px 16px 6px; font-weight:700; font-size:1.1rem;
}
.home-materials .card .badges{
  display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0 16px 8px;
}
.home-materials .card .badges li{
  font-size:.85rem; font-weight:600; color:var(--hef-blue-dark);
  background:rgba(0,151,219,.08); border:1px solid rgba(0,151,219,.25);
  padding:4px 8px; border-radius:999px;
}
.home-materials .card p{
  color:var(--muted); margin:0 16px 12px;
}
.home-materials .card .more{
  margin:0 16px 16px; align-self:flex-start;
  text-decoration:none; font-weight:600; color:var(--hef-blue);
}
.home-materials .card .more:hover{ color:var(--hef-blue-dark) }

.home-materials .cta-row{
  margin-top:18px;
}
.home-materials .btn.btn-secondary{
  color:var(--hef-blue); border-color:var(--hef-blue); background:transparent;
}
.home-materials .btn.btn-secondary:hover{
  color:#fff; background:var(--hef-blue-dark); border-color:var(--hef-blue-dark);
}

/* ================================
   MARKETS GRID
   ================================ */
.home-markets{ padding:56px 0; background:var(--bg-soft) }

.home-markets .tile-grid{
  grid-template-columns:repeat(4, minmax(0,1fr));
}

.home-markets .tile{
  display:flex; align-items:center; gap:12px;
  background:#fff; border:1px solid var(--card-border); border-radius:12px;
  padding:14px 16px; text-decoration:none; color:var(--text);
  box-shadow:var(--shadow); transition:box-shadow .15s ease, border-color .15s ease, transform .15s ease;
}
.home-markets .tile:hover{
  border-color:var(--hef-blue); box-shadow:0 6px 20px rgba(0,151,219,.15); transform:translateY(-2px);
}
.home-markets .tile img{
  width:40px; height:40px; object-fit:cover; border-radius:8px;
}
.home-markets .tile span{
  font-weight:600;
}

/* ================================
   RESOURCES TEASER
   ================================ */
.home-resources{ padding:56px 0; background:var(--bg) }

.home-resources .resources-cards{
  grid-template-columns:repeat(3, minmax(0,1fr));
}

.home-resources .card.resource{
  display:flex; flex-direction:column; gap:8px;
  background:#fff; border:1px solid var(--card-border); border-radius:12px;
  padding:16px; text-decoration:none; color:var(--text);
  box-shadow:var(--shadow); transition:box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
.home-resources .card.resource:hover{
  border-color:var(--hef-blue); box-shadow:var(--shadow-hover); transform:translateY(-2px);
}
.home-resources .card.resource img{
  width:40px; height:40px; object-fit:contain;
}
.home-resources .card.resource h3{
  margin:2px 0 2px; font-weight:700; font-size:1.05rem;
}
.home-resources .card.resource p{
  margin:0; color:var(--muted);
}

/* ================================
   Accessibility: focus states
   ================================ */
.home-markets .tile:focus,
.home-resources .card.resource:focus,
.home-materials .card .more:focus{
  outline:3px solid rgba(0,151,219,.5);
  outline-offset:2px;
}

/* ================================
   Responsive
   ================================ */
@media (max-width:1080px){
  .home-materials .materials-cards{ grid-template-columns:repeat(2, minmax(0,1fr)) }
  .home-markets .tile-grid{ grid-template-columns:repeat(2, minmax(0,1fr)) }
  .home-resources .resources-cards{ grid-template-columns:repeat(2, minmax(0,1fr)) }
}
@media (max-width:640px){
  .home-materials .materials-cards,
  .home-markets .tile-grid,
  .home-resources .resources-cards{ grid-template-columns:1fr }
}
/* ===== MATERIALS SPOTLIGHT – HARD OVERRIDE ===== */
section.home-materials .card-grid,
section.home-materials .materials-cards{ 
  display:grid !important; 
  grid-template-columns:repeat(3, minmax(0,1fr)) !important; 
  gap:20px !important;
}

section.home-materials .card{
  background:#fff; border:1px solid #e7e9ed; border-radius:12px;
  overflow:hidden; box-shadow:0 1px 2px rgba(0,0,0,.04);
  transition:transform .15s ease, box-shadow .15s ease;
  display:flex; flex-direction:column;
}

section.home-materials .card img{
  width:100% !important; height:auto;
  aspect-ratio:3/2; object-fit:cover; display:block;
}

section.home-materials .card h3{ margin:14px 16px 6px; font-weight:700; font-size:1.1rem; }
section.home-materials .card p{ margin:0 16px 12px; color:#6b7075; }
section.home-materials .card .more{ margin:0 16px 16px; color:#0097DB; text-decoration:none; font-weight:600; }
section.home-materials .card .more:hover{ color:#004A99; }

section.home-materials .badges{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0 16px 8px; }
section.home-materials .badges li{
  font-size:.85rem; font-weight:600; color:#004A99;
  background:rgba(0,151,219,.08); border:1px solid rgba(0,151,219,.25);
  padding:4px 8px; border-radius:999px;
}

@media (max-width:1080px){
  section.home-materials .materials-cards{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width:640px){
  section.home-materials .materials-cards{ grid-template-columns:1fr !important; }
} 

/* Markets grid */
.home-markets{ padding:56px 0; }
.home-markets .intro{ color:#6b7075; max-width:820px; }
.home-markets .markets-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
}
.home-markets .market-card{
  background:#fff; border:1px solid #e7e9ed; border-radius:12px;
  overflow:hidden; box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.home-markets .market-card .thumb{
  position:relative; width:100%; aspect-ratio:1/1; /* square */
  background:#f3f5f7;
}
.home-markets .market-card .thumb img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block;
}
.home-markets .market-card h3{
  margin:12px 14px 14px; font-size:1rem; font-weight:700;
}
.home-markets .card-link{ display:block; color:inherit; text-decoration:none; }
.home-markets .card-link:hover h3{ color:#004A99; }

@media (max-width:1080px){ .home-markets .markets-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:760px){ .home-markets .markets-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .home-markets .markets-grid{ grid-template-columns:1fr; } }

.home-news{ padding:56px 0; }
.home-news .intro{ color:#6b7075; max-width:820px; }
.home-news .news-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.home-news .news-card{ background:#fff; border:1px solid #e7e9ed; border-radius:12px; overflow:hidden; box-shadow:0 1px 2px rgba(0,0,0,.04); }
.home-news .card-link{ display:block; color:inherit; text-decoration:none; }
.home-news .thumb{ position:relative; width:100%; aspect-ratio:16/9; background:#f3f5f7; }
.home-news .thumb img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.home-news .content{ padding:14px; }
.home-news h3{ margin:0 0 6px; font-weight:700; line-height: 1.4em; }
.home-news .meta{ margin:0 0 8px; color:#7a7f85; font-size:.9rem; }
.home-news .excerpt{ margin:0 0 10px; color:#4b5055; }
.home-news .cta{ color:#004A99; font-weight:700; }
@media (max-width:980px){ .home-news .news-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .home-news .news-grid{ grid-template-columns:1fr; } }

.home-testimonials{ padding:56px 0; background:#fff; }
.home-testimonials .intro{ color:#6b7075; max-width:820px; }
.home-testimonials .testimonials-grid{
  display:grid; gap:20px; grid-template-columns:repeat(3, minmax(0,1fr));
}
.home-testimonials .testimonial{
  background:#fff; border:1px solid #e7e9ed; border-radius:12px;
  box-shadow:0 1px 2px rgba(0,0,0,.04); padding:18px; display:flex; flex-direction:column; gap:14px;
}
.home-testimonials .quote{ font-size:1.02rem; line-height:1.5; }
.home-testimonials .meta{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.home-testimonials .who strong{ display:block; font-weight:700; }
.home-testimonials .who .role{ color:#6b7075; font-size:.92rem; }
.home-testimonials .logo img{ max-height:32px; width:auto; display:block; opacity:.9; }
@media (max-width:980px){ .home-testimonials .testimonials-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .home-testimonials .testimonials-grid{ grid-template-columns:1fr; } }

.home-testimonials{ padding:56px 0; background:#fff; }
.home-testimonials .testimonials-grid{
  display:grid; gap:20px; grid-template-columns:repeat(3, minmax(0,1fr));
}
.home-testimonials .testimonial{
  background:#fff; border:1px solid #e7e9ed; border-radius:12px;
  box-shadow:0 1px 2px rgba(0,0,0,.04); padding:18px; display:flex; flex-direction:column; gap:14px;
}
.home-testimonials .quote{ font-size:1.02rem; line-height:1.5; }
.home-testimonials .meta{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.home-testimonials .who strong{ display:block; font-weight:700; }
.home-testimonials .who .role{ color:#6b7075; font-size:.92rem; }
@media (max-width:980px){ .home-testimonials .testimonials-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .home-testimonials .testimonials-grid{ grid-template-columns:1fr; } }
.home-final-cta{ padding:56px 0; background:#0c1420; color:#fff; text-align:center; }
.home-final-cta .final-cta__title{ margin:0 0 18px; }
.home-final-cta .final-cta__buttons{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.home-final-cta .btn{ padding:.7rem 1.1rem; border-radius:999px; border:1px solid transparent; }
.home-final-cta .btn-primary{ background:#004A99; color:#fff; }
.home-final-cta .btn-secondary{ background:transparent; border-color:#7aa6d9; color:#7aa6d9; }
.home-final-cta .btn-ghost{ background:transparent; border-color:#ffffff33; color:#fff; }
/* CTA Buttons */
.cta-buttons{ padding:24px 0; }
.cta-buttons__title{ margin:0 0 10px; font-size:1.125rem; color:#1b2330; }
.cta-buttons__row{ display:flex; flex-wrap:wrap; gap:12px; }
.cta-buttons.is-center .cta-buttons__row{ justify-content:center; }
.cta-buttons.is-left   .cta-buttons__row{ justify-content:flex-start; }
.cta-buttons.is-right  .cta-buttons__row{ justify-content:flex-end; }

/* Button skins – reuse your site’s styles if you already have them */
.btn{ display:inline-block; padding:.7rem 1.05rem; border-radius:999px; font-weight:700; line-height:1; text-decoration:none; border:1px solid transparent; }
.btn-primary{ background:#004A99; color:#fff; }
.btn-primary:hover{ filter:brightness(1.05); }
.btn-secondary{ background:transparent; color:#004A99; border-color:#004A99; }
.btn-secondary:hover{ background:#004A99; color:#fff; }
.btn-ghost{ background:transparent; color:#1b2330; border-color:#d6dbe3; }
.btn-ghost:hover{ background:#eef2f7; }

/* Primary button (on brand) */
.btn {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  border-radius: 999px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid transparent;
  transition: all 0.2s ease;
  font-size: 1rem;
  text-align: center;
}

.btn-primary {
  background-color: #004A99; /* HEF Blue */
  color: #fff;
  border-color: #004A99;
}

.btn-primary:hover {
  background-color: #e0e0e0; /* Grey hover */
  color: #004A99;           /* Switch text to brand blue */
  border-color: #d6d6d6;
}

/* ========== Materials Spotlight (carousel) ========== */
.materials-spotlight {
  padding-inline: 32px;         /* soft gutters */
  margin-block: 32px 48px;
}

.materials-spotlight .ms-outer {
  max-width: 1400px;            /* wide, not full-bleed */
  margin-inline: auto;
}

.materials-spotlight .ms-head {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 16px;
  margin-bottom: 16px;
}

.materials-spotlight .ms-title {
  font-size: clamp(26px, 2.6vw, 34px);
  line-height: 1.2;
  margin: 0;
}

.materials-spotlight .ms-intro {
  grid-column: 1 / -1;
  margin: 6px 0 10px;
  color: #64748b;
}

.materials-spotlight .ms-arrows {
  display: flex;
  gap: 8px;
}

.materials-spotlight .ms-arrows button {
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #0b66a3;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.materials-spotlight .ms-arrows button:hover {
  background: #f1f5f9;
}

/* viewport + track */
.materials-spotlight .ms-viewport {
  overflow: hidden;
}

.materials-spotlight .ms-track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 6px; /* keeps box-shadow visible */
}

/* cards */
.materials-spotlight .ms-card {
  flex: 0 0 calc(25% - 18px);  /* 4-up desktop */
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 1px 0 rgba(2,6,23,.04);
  scroll-snap-align: start;
}

@media (max-width: 1100px) {
  .materials-spotlight .ms-card { flex-basis: calc(33.333% - 16px); }
}
@media (max-width: 820px) {
  .materials-spotlight .ms-card { flex-basis: calc(50% - 12px); }
}
@media (max-width: 560px) {
  .materials-spotlight .ms-card { flex-basis: 100%; }
}

.materials-spotlight .ms-image {
  display: block;
  aspect-ratio: 16 / 9;
  background: #f8fafc;
}
.materials-spotlight .ms-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.materials-spotlight .ms-copy {
  padding: 18px 18px 20px;
}

.materials-spotlight .ms-card-title {
  font-size: 26px !important;   /* your requested size */
  color: #0097DB;               /* brand blue */
  line-height: 1.25;
  margin: 0 0 10px;
}

.materials-spotlight .ms-excerpt { margin: 0 0 14px; }

.materials-spotlight .btn-link {
  color: #0b66a3;
  text-decoration: none;
  font-weight: 600;
}
.materials-spotlight .btn-link:hover { text-decoration: underline; }

/* CTA button row */
.materials-spotlight .ms-cta-row {
  display: flex;
  justify-content: center;
  margin-top: 18px;
}
.materials-spotlight .btn.btn-primary {
  background: #0b66a3;
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 12px 22px;
  font-weight: 700;
}
.materials-spotlight .btn.btn-primary:hover {
  background: #094f80;
}

.acm-footer { background:#0c1420; color:#e7eef7; }
.acm-footer a { color:#a9c7ff; text-decoration:none; }
.acm-footer a:hover { color:#fff; }

.acm-footer .container { max-width:1200px; margin:0 auto; padding:0 20px; }

.acm-footer__top {
  display:grid; gap:28px; padding:36px 0 24px;
  grid-template-columns: 1.2fr 1fr 1fr;
}
.acm-footer__logo { max-height:40px; width:auto; display:block; margin-bottom:12px; }
.acm-footer__blurb { margin:.4rem 0 0; color:#cfe0ff; }

.acm-footer__contact h4,
.acm-footer__partners h4 { margin:0 0 .5rem; color:#8fbaff; font-weight:700; }

.acm-footer__contact .address { margin:.2rem 0 .6rem; color:#c0c7d4; }
.acm-footer__contact .contact-list { list-style:none; padding:0; margin:0; display:grid; gap:6px; }
.acm-footer__contact .contact-list a { color:#cfe0ff; }
.acm-footer__contact .contact-list a:hover { color:#fff; }

.acm-footer__partners .logos { display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.acm-footer__partners .logos img { height:32px; width:auto; opacity:.9; filter:grayscale(100%); }
.acm-footer__partners .logos img:hover { opacity:1; filter:none; }

.acm-footer__legal {
  border-top:1px solid #22314b; padding:14px 0 18px;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px;
}
.acm-footer__legal .left { font-size:.95rem; color:#b7c5db; }
.acm-footer__legal .mid a { margin:0 6px; }
.acm-footer__legal .mid .sep { opacity:.5; margin:0 6px; }
.acm-footer__legal .right { text-align:right; color:#9fb2d3; }

/* Responsive */
@media (max-width:900px){
  .acm-footer__top{ grid-template-columns:1fr; }
  .acm-footer__legal{ grid-template-columns:1fr; text-align:center; }
  .acm-footer__legal .right{ text-align:center; }
}

/* ===== Footer (4 columns) ===== */
.site-footer{
  background:#0c1420;
  color:#cfe3f6;
  padding:64px 0 28px;
}
.site-footer .footer-inner{ margin:0 auto; }

.site-footer .footer-top{
  display:grid;
  grid-template-columns: 1.1fr 1fr 1fr 1fr; /* brand | contact | quick | legal */
  gap:28px;
  align-items:start;
  margin-bottom:28px;
}

.site-footer .footer-col{ min-width:0 }
.site-footer .footer-heading{
  margin:0 0 .6rem;
  font:700 1.05rem/1.2 'Rajdhani',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:#e5f1ff;
  letter-spacing:.2px;
}
.site-footer .footer-subheading{
  margin:.75rem 0 .4rem;
  font:700 .95rem/1.2 'Rajdhani',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:#9ecbf2;
}

.site-footer .footer-logo{ max-width:150px; height:auto; margin:0 0 .75rem }
.site-footer .footer-blurb{ margin:.25rem 0 0; color:#9fb6c9 }

.site-footer .footer-nav{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:.45rem;
}
.site-footer a{ color:#cfe3f6; text-decoration:none; transition:.2s color ease; }
.site-footer a:hover{ color:#76c3f1; }
.site-footer .footer-address{ white-space:pre-line; margin:.25rem 0 .25rem; color:#cfe3f6 }

/* Partners strip */
.footer-partners .partners-logos{
  display:flex; gap:14px; align-items:center; flex-wrap:wrap;
  list-style:none; margin:.25rem 0 0; padding:0;
}
.footer-partners .partners-logos img{
  height:28px; width:auto; display:block;
  filter:grayscale(100%) contrast(1.05) brightness(.96);
  opacity:.9; transition:.2s ease filter, .2s ease opacity;
}
.footer-partners .partners-logos img:hover{
  filter:none; opacity:1;
}

.site-footer .footer-bottom{
  display:flex; justify-content:space-between; gap:16px;
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:14px; margin-top:10px;
  font-size:.95rem;
  color:#91a9bb;
}

/* Responsive */
@media (max-width: 1080px){
  .site-footer .footer-top{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px){
  .site-footer{ padding:48px 0 22px }
  .site-footer .footer-top{ grid-template-columns: 1fr; gap:22px }
  .site-footer .footer-bottom{ flex-direction:column; gap:8px }
}

/* === Footer polish === */

/* 1) Nudge headings up (cols 2–4) to align with logo top */
.site-footer .footer-col:not(.footer-brand) .footer-heading{
  margin-top:-10px; /* tweak -8 to -12 if needed */
}

/* Reset on small screens so nothing overlaps */
@media (max-width:640px){
  .site-footer .footer-col:not(.footer-brand) .footer-heading{ margin-top:0; }
}

/* 2) Column 1 spacing (logo, blurb, partners) */
.site-footer .footer-brand .footer-logo{ margin:0 0 12px; }
.site-footer .footer-brand .footer-blurb{
  margin:10px 0 14px;
  line-height:1.55;
}
.site-footer .footer-partners{ margin-top:14px; }
.site-footer .footer-partners .partners-logos{ gap:16px; margin-top:8px; }

/* 3) Contact block: tighter address lines + spacing before phone/email/LinkedIn */
.site-footer .footer-contact .footer-address{
  line-height:1.35;            /* tighter between address lines */
  margin:2px 0 12px;           /* small gap before phone/email */
}

/* Space between each subsequent contact item */
.site-footer .footer-contact p{ margin:0; }
.site-footer .footer-contact p + p{ margin-top:8px; }

/* 4) Brand styling for contact links */
.site-footer .footer-contact .footer-link{
  color:var(--hef-blue);
  font-weight:700;
  text-decoration:none;
}
.site-footer .footer-contact .footer-link:hover{ color:#76c3f1; }
/* Tighter spacing between address lines (<br>) */
.site-footer .footer-contact .footer-address{
  line-height:1.4;   /* tighten space between lines */
  margin:0 0 14px;   /* add gap after address before phone/email */
}

/* Phone, email, LinkedIn links in blue + bold */
.site-footer .footer-contact .footer-link{
  display:block;     /* stack neatly */
  margin:6px 0;
  color:var(--hef-blue);
  font-weight:700;
  text-decoration:none;
}
.site-footer .footer-contact .footer-link:hover{
  color:#76c3f1;
}
/* Mobile footer tweaks */
@media (max-width: 768px) {
  .site-footer .footer-columns {
    text-align: center;         /* centre text inside columns */
    grid-template-columns: 1fr; /* stack columns into one */
    gap: 28px;                  /* space between stacks */
  }

  .site-footer .footer-columns > div {
    margin: 0 auto;             /* centre child blocks */
  }

  .site-footer .footer-contact .footer-link {
    justify-content: center;    /* keep links aligned if flexed */
  }
}



/* ——— Flexible sections base ——— */
.page .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.sec { padding: 48px 0; }
.sec > h2 { margin: 0 0 12px; font-weight: 700; }
.sec .intro { color:#6b7075; margin: 0 0 18px; }

/* Hero */
.hero-banner{ position:relative; background:#0c1420; color:#fff; background-size:cover; background-position:center; }
.hero-banner .hero-overlay{ position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.45),rgba(0,0,0,.2)); }
.hero-banner .inner{ position:relative; z-index:1; max-width: 1100px; margin:0 auto; padding: 56px 20px; }
.hero-banner.is-center .inner{ text-align:center; }
.hero-banner.is-right  .inner{ text-align:right; }

/* Text + Media */
.text-media .tm-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:28px; align-items:center; }
.text-media.is-flip .tm-grid{ grid-template-columns: .9fr 1.1fr; }
.text-media .tm-media img{ width:100%; height:auto; border-radius:12px; }

/* Features Grid */
.features-grid .grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.features-grid .feature{ background:#fff; border:1px solid #e7e9ed; border-radius:12px; padding:16px; }
.features-grid .feature-ic{ width:40px; height:40px; object-fit:contain; }

/* CTA Band */
.cta-band{ background:#0c1420; color:#fff; }
.cta-band .cta-inner{ max-width:900px; margin:0 auto; text-align:center; }
.cta-row{ display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-top:10px; }

/* Materials Table */
.spec-table{ width:100%; border-collapse:separate; border-spacing:0; }
.spec-table th, .spec-table td{ padding:12px 14px; border-bottom:1px solid #e7e9ed; }
.spec-table th{ width:34%; text-align:left; color:#334155; }

/* Resources */
.res-ul{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.res-link{ color:#004A99; font-weight:700; text-decoration:none; }
.res-link:hover{ text-decoration:underline; }

/* Testimonials */
.t-grid{ display:grid; gap:18px; grid-template-columns:repeat(3,1fr); }
.t-card{ background:#fff; border:1px solid #e7e9ed; border-radius:12px; padding:18px; }
.t-meta{ display:block; margin-top:.5rem; color:#6b7075; }

/* Markets Grid */
.m-grid{ display:grid; gap:16px; grid-template-columns:repeat(4,1fr); }
.m-card{ display:flex; align-items:center; gap:12px; padding:14px 16px; border:1px solid #e7e9ed; border-radius:12px; background:#fff; text-decoration:none; color:inherit; }
.m-card:hover{ border-color:#0097DB; box-shadow:0 6px 20px rgba(0,151,219,.12); }
.m-ic{ width:40px; height:40px; object-fit:cover; border-radius:8px; }

/* Gallery */
.g-grid{ display:grid; gap:10px; grid-template-columns:repeat(3,1fr); }
.g-item img{ width:100%; height:auto; border-radius:10px; }

/* Logos row */
.logos{ display:flex; gap:20px; flex-wrap:wrap; align-items:center; }
.logos .logo img{ height:40px; width:auto; filter:grayscale(100%) contrast(1.1); opacity:.9; }
.logos .logo:hover img{ filter:none; opacity:1; }

/* Video */
.video-wrap{ position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:12px; }
.video-wrap iframe{ position:absolute; inset:0; width:100%; height:100%; }

/* Accordion */
.acc-item{ border:1px solid #e7e9ed; border-radius:10px; padding:12px 14px; background:#fff; }
.acc-item + .acc-item{ margin-top:8px; }
.acc-q{ cursor:pointer; font-weight:700; }
.acc-a{ margin-top:10px; }

/* Responsive */
@media (max-width:1080px){
  .text-media .tm-grid{ grid-template-columns:1fr; }
  .features-grid .grid{ grid-template-columns:repeat(2,1fr); }
  .t-grid{ grid-template-columns:repeat(2,1fr); }
  .m-grid{ grid-template-columns:repeat(2,1fr); }
  .g-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .features-grid .grid,
  .t-grid, .m-grid, .g-grid{ grid-template-columns:1fr; }
}

/* --- Full-bleed background utilities --- */
.acm-section{position:relative}
.acm-section > .wrap{
  max-width:1200px;        /* match your site container */
  margin:0 auto;
  padding:0 20px;
  position:relative;
  z-index:1;               /* sit above the background */
}

/* Make the section's background stretch full viewport width */
.acm-section.bleed::before{
  content:"";
  position:absolute;
  inset:0;                 /* top/right/bottom/left: 0 */
  z-index:0;
  background:var(--bleed, #f6f8fa); /* default soft grey */
}

/* Quick brand colour helpers for the bleed background */
.acm-section.bg-soft  { --bleed:#f6f8fa; }  /* light grey */
.acm-section.bg-tint  { --bleed:#e9f5fc; }  /* pale ACM blue tint */
.acm-section.bg-navy  { --bleed:#0c1420; color:#fff; } /* dark band */
.acm-section.bg-white { --bleed:#fff; }

/* Optional: tighten spacing so the hero & next band meet nicely */
.acm-section{padding:56px 0}
.acm-section.compact{padding:38px 0}

/* Buttons/links remain readable on dark bands */
.acm-section.bg-navy a{color:#9fd4ff}
.acm-section.bg-navy a.btn,
.acm-section.bg-navy .btn{color:#fff}

/* Layout primitives */
.container{
  width: min(1200px, 92vw);
  margin-inline: auto;
}

/* Section shell */
.acm-section{
  position: relative;
  padding: clamp(32px, 5vw, 72px) 0;
}

/* Optional padding helpers (if you use the ACF 'pad' idea) */
.pad-none{ padding-block: 0 }
.pad-sm  { padding-block: 28px }
.pad-md  { padding-block: 48px }
.pad-lg  { padding-block: 72px }

/* Brand backgrounds (use by adding bg-brand / bg-soft / bg-dark on the section) */
.bg-brand{ background:#0c1420; color:#fff }
.bg-soft { background:#f5f8fb }
.bg-dark { background:#0a0f1a; color:#fff }

/* Headings inside dark blocks – keep links readable */
.bg-brand a, .bg-dark a{ color:#9bd3ff }
.bg-brand a:hover, .bg-dark a:hover{ color:#fff }

/* === ACM Reasons (Options: acm_reason) === */
.acm-reasons { 
  padding: 56px 0; 
  background: #f6f8fa; 
}
.acm-reasons .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

.acm-reasons__title {
  text-align: center;
  margin: 0 0 28px;
  font-family: 'Rajdhani', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 2.2vw, 32px);
  color: #0097DB;
}

.acm-reasons__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(220px, 1fr));
  gap: 20px;
}
@media (max-width: 1080px) {
  .acm-reasons__grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
}
@media (max-width: 640px) {
  .acm-reasons__grid { grid-template-columns: 1fr; }
}

.acm-reasons__item {
  background: #fff;
  border: 1px solid #e7e9ed;
  border-radius: 12px;
  padding: 18px;
  text-align: center;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

.acm-reasons__icon {
  width: 72px; height: 72px; object-fit: contain; margin: 4px auto 10px;
  display: block;
}

.acm-reasons__item-title {
  color: #0097DB;
  font-weight: 700;
  margin: 6px 0 8px;
  font-size: 20px;
}

.acm-reasons__item-desc {
  color: #556;
  margin: 0;
  line-height: 1.5;
  font-size: 15px;
}

/* Downloads (resources) */
.downloads.section-pad { padding: 48px 0; }
.downloads .section-title { margin: 0 0 6px; }
.downloads .section-intro { color: #64748b; margin: 0 0 16px; }

.downloads__grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (min-width: 640px) {
  .downloads__grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (min-width: 900px) {
  .downloads__grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
}
@media (min-width: 1200px) {
  .downloads__grid { grid-template-columns: repeat(5, minmax(0,1fr)); }
}

.dl-card {
  background: #fff;
  border: 1px solid #e7e9ed;
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.dl-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
  border-color: #dbe2ea;
}

.dl-card__link {
  display: grid;
  grid-template-rows: auto 1fr;
  color: inherit;
  text-decoration: none;
  height: 100%;
}

.dl-card__media {
  background: #f5f8fb;
  display: grid;
  place-items: center;
  aspect-ratio: 1/1; /* square icon style */
}
.dl-card__media img {
  width: 60%;
  height: 60%;
  object-fit: contain;
  display:block;
  margin: auto;
}
.dl-card__icon {
  width: 40px; height: 40px;
  color: #0097DB; opacity: .9;
}

.dl-card__body { 
  padding: 10px; 
  display:flex; 
  flex-direction:column; 
  gap:6px; 
}

.dl-card__title {
  margin: 0;
  font-weight: 700;
  color: #0b66a3;
  font-size: 0.9rem;
  line-height: 1.25;
}

.dl-card__meta {
  display:flex;
  gap:6px;
  align-items:center;
  font-size:.75rem;
  color:#637082;
}
.badge {
  display:inline-block;
  padding:1px 6px;
  border-radius:999px;
  background: rgba(0,151,219,.12);
  color:#0b66a3;
  font-weight:700;
  border:1px solid rgba(0,151,219,.25);
  font-size:.7rem;
}
.filesize { opacity:.9; }

.dl-card__desc {
  margin:0;
  color:#525a66;
  font-size: 0.8rem;
  line-height: 1.4;
}

.dl-card__cta {
  margin-top:auto;
  font-weight:700;
  color:#0b66a3;
  font-size: 0.85rem;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.dl-card__cta::after {
  content:"↘";
  font-size:1em;
  transform: translateY(1px);
}