/*
Theme Name: SIND v4
Theme URI: https://sind.ltd
Description: Custom theme for Silverstone Industrial (SIND) — Direction C "Minimal Warm" design system. Replaces Amwerk + Bold Page Builder.
Author: SIND
Version: 0.1.0
License: Private
Text Domain: sind-v4
*/

/* ============================================================
   Self-hosted Manrope (variable, latin subset) — removes the
   Google Fonts round-trip. `font-display: optional` means the
   font is used if ready before first paint and never swaps in
   afterwards, so the fallback→webfont swap can't reflow layout
   (the 24 KB file loads well within the block window locally).
   ============================================================ */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: optional;
  src: url('fonts/manrope-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   Design tokens — Direction C: Minimal Warm
   ============================================================ */
:root {
  --blue: #0090c8;
  --blue-dark: #0079aa;
  --blue-soft: #e3f4fb;
  --bg: #faf9f7;
  --card: #ffffff;
  --ink: #1b232c;
  --mut: #5d6b78;
  --line: #e9e5de;
  --green: #25d366;
  --radius: 14px;
  --pad-s: 16px;
  --pad-m: 24px;
  --pad-l: 32px;
  --shadow-sm: 0 2px 8px rgba(27, 35, 44, .06);
  --shadow-md: 0 14px 40px rgba(27, 35, 44, .08);
  --font: 'Manrope', 'Segoe UI', Arial, Helvetica, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.65;
  font-size: 16.5px;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
a:hover { color: var(--blue); }
button { font-family: inherit; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; }

h1, h2, h3, h4 { line-height: 1.18; letter-spacing: -.015em; }
h1 { font-size: clamp(30px, 3.6vw, 46px); font-weight: 800; }
h2 { font-size: clamp(24px, 2.6vw, 34px); font-weight: 800; }
h3 { font-size: 19px; font-weight: 700; }

.sind-eyebrow {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--blue);
}

/* Buttons */
.sind-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-weight: 700;
  font-size: 15.5px;
  padding: 15px 30px;
  border-radius: 999px;
  cursor: pointer;
  transition: .2s;
  border: none;
  line-height: 1.2;
}
.sind-btn svg { width: 18px; height: 18px; flex: 0 0 18px; }
.sind-btn--primary { background: var(--ink); color: #fff; }
.sind-btn--primary:hover { background: var(--blue); color: #fff; }
.sind-btn--blue { background: var(--blue); color: #fff; }
.sind-btn--blue:hover { background: var(--blue-dark); color: #fff; }
.sind-btn--soft { background: var(--blue-soft); color: var(--blue); }
.sind-btn--soft:hover { background: #d2ecf7; color: var(--blue-dark); }
.sind-btn--ghost { background: transparent; color: var(--blue); border: 2px solid var(--blue); }
.sind-btn--ghost:hover { background: var(--blue-soft); color: var(--blue-dark); }
.sind-btn--sm { padding: 11px 22px; font-size: 14.5px; }

/* ============================================================
   Header
   ============================================================ */
.sind-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(250, 249, 247, .88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.sind-hd {
  display: flex;
  align-items: center;
  gap: 26px;
  height: 72px;
}
.sind-logo { display: inline-flex; align-items: center; flex: 0 0 auto; }
/* Header logo matches the footer logo height (36px) for a consistent mark. */
.sind-logo img { height: 36px; width: auto; }

.sind-nav { display: flex; gap: 4px; margin-left: 6px; }
.sind-nav a {
  font-size: 15px;
  font-weight: 600;
  color: var(--mut);
  padding: 8px 14px;
  border-radius: 999px;
  transition: .15s;
  white-space: nowrap;
}
.sind-nav a:hover { color: var(--ink); background: #f0ede7; }
.sind-nav li.current-menu-item > a,
.sind-nav li.current_page_item > a,
.sind-nav li.current-menu-ancestor > a,
.sind-nav a[aria-current="page"] { color: var(--ink); background: #f0ede7; }
.sind-nav ul { list-style: none; display: flex; gap: 4px; }
.sind-nav li { position: relative; }
.sind-nav li.menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 7px; height: 7px;
  margin-left: 7px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
}
.sind-nav .sub-menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 236px;
  flex-direction: column;
  gap: 2px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 8px;
  box-shadow: 0 16px 38px rgba(23, 32, 46, .14);
  z-index: 60;
}
.sind-nav li:hover > .sub-menu,
.sind-nav li:focus-within > .sub-menu { display: flex; }
.sind-nav .sub-menu a {
  display: block;
  padding: 9px 14px;
  font-size: 14.5px;
  font-weight: 600;
  white-space: nowrap;
  border-radius: 9px;
}
.sind-nav .sub-menu li.menu-item-has-children > a::after { display: none; }

.sind-hd-spacer { flex: 1; }
.sind-icon-btn {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: none;
  background: #f0ede7;
  border-radius: 50%;
  color: var(--ink);
  cursor: pointer;
  font-size: 16px;
  flex: 0 0 auto;
}
.sind-icon-btn:hover { background: var(--blue-soft); color: var(--blue); }
.sind-icon-btn svg { width: 18px; height: 18px; }

.sind-burger {
  display: none;
  width: 44px;
  height: 44px;
  border: none;
  background: #f0ede7;
  border-radius: 50%;
  cursor: pointer;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.sind-burger span { display: block; width: 18px; height: 2px; background: var(--ink); border-radius: 2px; transition: .2s; }
.sind-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.sind-burger.is-open span:nth-child(2) { opacity: 0; }
.sind-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.sind-mnav {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 90;
  border-top: 1px solid var(--line);
  background: var(--bg);
  box-shadow: 0 12px 24px rgba(16, 24, 32, .08);
  padding: 12px 32px 20px;
}
.sind-mnav.is-open { display: block; }
html.sind-lock, html.sind-lock body { overflow: hidden; }
.sind-mnav a {
  display: block;
  padding: 12px 8px;
  font-weight: 700;
  font-size: 17px;
  border-bottom: 1px solid var(--line);
}
.sind-mnav a:last-child { border-bottom: none; }
.sind-mnav .sind-btn { margin-top: 14px; width: 100%; }
.sind-mnav ul { list-style: none; margin: 0; padding: 0; }
.sind-mnav li.menu-item-has-children > a::after {
  content: "";
  float: right;
  width: 8px; height: 8px;
  margin-top: 7px;
  border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor;
  transform: rotate(45deg);
  transition: transform .2s;
}
.sind-mnav li.open.menu-item-has-children > a::after { transform: rotate(225deg); }
.sind-mnav .sub-menu { display: none; padding: 0 0 0 16px; }
.sind-mnav .sub-menu a { font-size: 15px; font-weight: 600; color: var(--mut); }
.sind-mnav li.open > .sub-menu { display: block; }

@media (max-width: 1000px) {
  .sind-nav { display: none; }
  .sind-burger { display: flex; }
  .sind-hd .sind-btn--header-cta { display: none; }
}

/* Header CTA must never wrap to two lines (it did at 1024). */
.sind-btn--header-cta { white-space: nowrap; }
/* 1001-1100: the translated nav labels + CTA are longer than the English ones,
   so tighten the pill spacing here to keep the header on one line. */
@media (min-width: 1001px) and (max-width: 1100px) {
  .sind-hd { gap: 12px; }
  .sind-nav { gap: 0; }
  .sind-nav a { padding: 8px 9px; }
}
@media (max-width: 768px) {
  .sind-hd { height: 60px; gap: 14px; }
}

/* Product pages carry their own Get a Quote in the PDP CTA row, so the header
   CTA would just be the same button twice. */
body.single-product .sind-hd .sind-btn--header-cta { display: none; }

/* ============================================================
   Footer
   ============================================================ */
.sind-footer {
  background: var(--ink);
  color: #98a5b1;
  padding: 70px 0 0;
  font-size: 14.5px;
  margin-top: 92px;
}
.sind-ft-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 40px;
}
.sind-ft-grid h4 {
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: 18px;
}
.sind-ft-grid img.sind-ft-logo { height: 36px; width: auto; margin-bottom: 16px; }
.sind-ft-grid ul { list-style: none; display: grid; gap: 10px; }
.sind-ft-grid a:hover { color: #7fd4f5; }
/* The bottom bar reuses the link grid's tracks so the tagline's left edge lines
   up with the "Services & Support" column; the legal line spans the first two
   tracks, the tagline the last two (so it stays on one line at desktop widths). */
.sind-ft-bot {
  border-top: 1px solid rgba(255, 255, 255, .12);
  margin-top: 50px;
  padding: 22px 0;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  column-gap: 40px;
  row-gap: 16px;
  align-items: center;
  font-size: 13px;
}
/* Copyright and Privacy Policy sit together on the left; both inherit the
   footer's 13px / #98a5b1 so the link is not visually distinct from the
   copyright text (hover still uses the standard link blue). */
.sind-ft-legal { grid-column: 1 / 3; display: inline-flex; align-items: center; flex-wrap: wrap; gap: 18px; }
.sind-ft-tag { grid-column: 3 / 5; }
@media (max-width: 1000px) { .sind-ft-grid, .sind-ft-bot { grid-template-columns: 1fr 1fr; } .sind-ft-tag { grid-column: auto; } }
@media (max-width: 640px) { .sind-ft-grid, .sind-ft-bot { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  /* R10 E10 (2026-10-06): ≥44px tap targets for the breadcrumb and footer links.
     2026-10-07: the first pass missed the legal row (Privacy Policy link +
     Cookie settings button), which measured 21px — cover it too. */
  .sind-ft-grid a,
  .sind-ft-legal a,
  .sind-ft-legal button { display: inline-block; padding: 14px 0; }
  .sind-breadcrumb a { display: inline-block; padding: 14px 0; }
}

/* ------------------------------------------------------------
   Mobile-only folds (R10 E3)
   Heavy secondary blocks (footer link groups, Related Products)
   ship with the `open` attribute so desktop keeps the full footer
   and no-JS visitors lose nothing. On phones a small script
   (footer.php) collapses them so the page opens short; tapping a
   heading reveals the block in place.
   ------------------------------------------------------------ */
.sind-m-fold > summary { position: relative; list-style: none; cursor: pointer; padding-right: 34px; }
.sind-m-fold > summary::-webkit-details-marker { display: none; }
.sind-m-fold > summary::after {
  content: '+';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  color: var(--blue);
}
.sind-m-fold[open] > summary::after { content: '\2212'; }
@media (min-width: 769px) {
  /* Desktop: the fold chrome disappears and the block is always expanded.
     The [open] qualifier is needed so this beats .sind-m-fold[open] > summary::after. */
  .sind-m-fold > summary { pointer-events: none; cursor: default; padding-right: 0; }
  .sind-m-fold > summary::after,
  .sind-m-fold[open] > summary::after { content: none; }
  .sind-ft-fold--sub { margin-top: 24px; }
}
@media (max-width: 768px) {
  .sind-ft-fold > summary { padding: 16px 34px 16px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); }
  .sind-ft-fold > summary h4 { margin-bottom: 0; }
  .sind-ft-fold[open] > summary { margin-bottom: 14px; }
  .sind-related-fold > summary { padding: 12px 34px 12px 0; border-bottom: 1px solid #e5e9ef; }
  .sind-related-fold > summary .sind-related-title { margin-bottom: 0; }
  .sind-related-fold[open] > summary { margin-bottom: 24px; }
}

/* ============================================================
   Generic page / entry content
   ============================================================ */
.sind-page { padding-top: 56px; padding-bottom: 20px; min-height: 50vh; }
.woocommerce-breadcrumb {
  font-size: 13.5px;
  font-weight: 600;
  color: #b8b2a8;
  margin-bottom: 18px;
}
.woocommerce-breadcrumb a { color: var(--mut); font-weight: 600; text-decoration: none; }
.woocommerce-breadcrumb a:hover { color: var(--blue); }

.sind-breadcrumb {  font-size: 13.5px;
  color: var(--mut);
  margin-bottom: 22px;
  font-weight: 600;
}
.sind-breadcrumb a { color: var(--mut); }
.sind-breadcrumb a:hover { color: var(--blue); }
.sind-breadcrumb .sep { margin: 0 8px; color: #b8b2a8; }
/* Breadcrumb rendered outside a hero (case studies, pages without hero meta). */
.sind-bc-standalone { padding-top: 32px; }

.entry-content { font-size: 16.5px; max-width: 680px; }
.entry-content > * { margin-bottom: 1.1em; }
.entry-content h2 { margin-top: 1.6em; }
.entry-content h3 { margin-top: 1.4em; }
.entry-content ul, .entry-content ol { padding-left: 1.4em; }
.entry-content blockquote {
  font-size: 22px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: -.01em;
  border-left: 4px solid var(--blue);
  padding-left: 20px;
  margin: 1.4em 0;
}
.entry-content a { color: var(--blue); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.entry-content img { border-radius: 12px; }
.entry-content table {
  width: 100%;
  border-collapse: collapse;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  font-size: 15px;
}
.entry-content th, .entry-content td {
  padding: 13px 18px;
  text-align: left;
  border-bottom: 1px solid var(--line);
}
.entry-content thead th, .entry-content th {
  background: var(--blue-soft);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ink);
}
.entry-content tr:last-child th, .entry-content tr:last-child td { border-bottom: none; }

/* Mobile tables: keep the table layout, but force every table to the container
   width and wrap cell text — no horizontal scroll, column headers preserved.
   Uses bare selectors so no table can be missed. */
@media (max-width: 640px) {
  table { table-layout: fixed; width: 100%; max-width: 100%; }
  th, td { overflow-wrap: break-word; word-break: normal; }
  .entry-content table, .sind-product table, .sind-case-page table,
  .sind-pg table, .sind-post-body table,
  .sind-gen-table, .sind-product__comparison-table,
  .sind-product__industry-table, .sind-product__maintenance-table { font-size: 14.5px; }
  /* Generator product content ships its own scroll-based table style (inline
     <style id="sind-gen-desc-styles">, !important). Override it on mobile so
     those spec tables wrap instead of scrolling sideways. */
  body .sind-gen-table {
    display: table !important; table-layout: fixed !important;
    width: 100% !important; max-width: 100% !important; overflow-x: visible !important;
  }
  body .sind-gen-table th, body .sind-gen-table td { white-space: normal !important; }

  /* R10 E5 (2026-10-06): a fixed-layout table shreds its headers mid-word as
     soon as there are more than a couple of columns at phone widths — the
     five-column /industries-served/ comparison rendered "IND/UST/RY". So every
     content table stacks into labelled rows (the pattern the PDP tables already
     used): words wrap at spaces and nothing overflows sideways. Column context
     survives as data-label, injected by the footer script in functions.php. */
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) {
    display: block; width: 100%; border: none; background: transparent;
    border-radius: 0; overflow: visible;
  }
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) thead { display: none; }
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) tbody { display: block; }
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) tr {
    display: block; border: 1px solid var(--line); border-radius: var(--radius);
    background: var(--card); padding: 12px 14px; margin-bottom: 12px;
  }
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) tr:last-child { margin-bottom: 0; }
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) th,
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) td {
    display: block; width: 100%; text-align: left; border-bottom: none;
    padding: 4px 0; word-break: normal; overflow-wrap: break-word;
    white-space: normal;
  }
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) th {
    background: none; font-weight: 800; font-size: 11px; letter-spacing: .06em;
    text-transform: uppercase; color: var(--mut); padding-top: 8px;
  }
  :is(.entry-content, .sind-case-page, .sind-pg, .sind-post-body) table:not(.sind-gen-table) td[data-label]::before {
    content: attr(data-label); display: block; font-weight: 800; font-size: 11px;
    letter-spacing: .06em; text-transform: uppercase; color: var(--mut);
    margin-bottom: 2px;
  }
}

/* Single post */
.sind-post-head { max-width: 760px; margin: 0 auto 34px; }
.sind-post-meta { color: var(--mut); font-size: 14px; font-weight: 600; margin-top: 14px; }
.sind-post-body { max-width: 680px; margin: 0 auto; }

/* E-E-A-T: author box + sources (single posts) */
.sind-author-box {
  margin-top: 34px;
  padding: var(--pad-m);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
}
.sind-author-box__name { font-size: 15px; font-weight: 700; color: var(--ink); }
.sind-author-box__bio { margin: 6px 0 0; font-size: 14px; color: var(--mut); line-height: 1.55; }
.sind-sources { margin-top: 28px; }
.sind-sources h3 { margin-bottom: 12px; }
.sind-sources ul { padding-left: 1.3em; }
.sind-sources li { font-size: 14px; color: var(--mut); margin-bottom: 8px; line-height: 1.55; }

/* Search results / 404 */
.sind-search-results { padding-top: 56px; padding-bottom: 56px; }
.sind-search-results article {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
  margin-bottom: 16px;
}
.sind-search-results article h2 { font-size: 20px; margin-bottom: 6px; }
.sind-search-results article h2 a { color: var(--ink); }
.sind-search-results article h2 a:hover { color: var(--blue); }

/* Pagination */
.sind-pagination { display: flex; gap: 8px; justify-content: center; margin: 40px 0; }
.sind-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--card);
  border: 1px solid var(--line);
  font-weight: 700;
  font-size: 14.5px;
}
.sind-pagination .page-numbers.current { background: var(--ink); color: #fff; border-color: var(--ink); }

/* ============================================================
   Product single (PDP)
   ============================================================ */
.sind-pdp { padding-top: 40px; }

.sind-pdp-hero {
  display: grid;
  /* Media column matches the fixed image frame so the text column sits right
     beside it instead of leaving a gap. */
  grid-template-columns: 468px minmax(0, 1fr);
  gap: 56px;
  align-items: start;
  margin-bottom: 34px;
}
/* min-width:0 so the nowrap thumbnail strip below can't blow out the grid.
   Not sticky: the gallery must scroll together with the text column. */
.sind-pdp-media { min-width: 0; }
.sind-pdp-main-img {
  position: relative;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 20px;
  overflow: hidden;
  display: grid;
  place-items: center;
  padding: 28px;
  /* Same frame on every product page; images scale to fit it. */
  aspect-ratio: 3 / 2;
  max-width: 468px;
}
/* Absolutely position the image so its box is always exactly the frame's
   content area — a grid row sized by content would let taller images
   overflow past the aspect-ratio box (clipped by overflow:hidden). */
.sind-pdp-main-img img {
  position: absolute;
  top: 28px;
  left: 28px;
  width: calc(100% - 56px);
  height: calc(100% - 56px);
  object-fit: contain;
}
.sind-pdp-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  border: 1px solid var(--line);
  box-shadow: 0 2px 8px rgba(27, 35, 44, .12);
  color: var(--ink);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: .15s;
  z-index: 2;
}
.sind-pdp-arrow:hover { border-color: var(--blue); color: var(--blue); }
.sind-pdp-arrow--prev { left: 12px; }
.sind-pdp-arrow--next { right: 12px; }
@media (max-width: 640px) {
  .sind-pdp-arrow { width: 34px; height: 34px; font-size: 18px; }
  .sind-pdp-arrow--prev { left: 8px; }
  .sind-pdp-arrow--next { right: 8px; }
}
/* One-row horizontal strip: many-angle series scroll sideways instead of
   stacking into several rows of thumbnails. */
.sind-pdp-thumbs {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: nowrap;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  padding-bottom: 6px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  max-width: 468px;
}
.sind-pdp-thumbs::-webkit-scrollbar { display: none; }
.sind-pdp-thumbs button {
  flex: 0 0 auto;
  scroll-snap-align: start;
  width: 60px;
  height: 60px;
  padding: 5px;
  background: var(--card);
  border: 2px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
  transition: .15s;
}
.sind-pdp-thumbs button.is-active, .sind-pdp-thumbs button:hover { border-color: var(--blue); }
.sind-pdp-thumbs img { width: 100%; height: 100%; object-fit: contain; }

.sind-pdp-summary h1 { margin: 12px 0 16px; font-size: clamp(28px, 3.2vw, 42px); }
.sind-pdp-summary .sind-pdp-tagline { font-size: 18px; color: var(--mut); }
.sind-pdp-ctas { display: flex; gap: 14px; margin-top: 28px; flex-wrap: wrap; }
/* One button form for the whole CTA row (Get a Quote / WhatsApp Us / Download
   Brochure): same pill, height, padding, type and border width. The brochure
   button comes from the brochure-gate plugin and would otherwise be a square
   blue block. */
.sind-pdp-ctas .sind-btn { border: 2px solid transparent; padding: 13px 30px; white-space: nowrap; }
.sind-pdp-ctas .sind-btn--ghost { border-color: var(--blue); }
.sind-pdp-ctas .sind-bg-cta { margin-top: 0; display: inline-flex; align-items: center; }
.sind-pdp-ctas .sind-bg-link {
  display: inline-flex;
  align-items: center;
  padding: 13px 2px;
  white-space: nowrap;
  color: var(--blue);
  font-size: 15px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: .2s;
}
.sind-pdp-ctas .sind-bg-link:hover { color: var(--blue-dark); }
.sind-pdp-meta { margin-top: 30px; border-top: 1px solid var(--line); }
.sind-pdp-meta .row {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
}
.sind-pdp-meta .row .k { color: var(--mut); font-weight: 600; }
.sind-pdp-meta .row .v { font-weight: 700; text-align: right; }

@media (max-width: 900px) {
  .sind-pdp-hero { grid-template-columns: 1fr; gap: 34px; }
  .sind-pdp-media { position: static; }
}

/* Related products */
.sind-related { margin-top: 72px; }
.sind-related h2 { margin-bottom: 26px; }
.sind-prod-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 1000px) { .sind-prod-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) {
  /* Two columns on phones (the homepage range cards already do this); the
     square image + 20px padding made each card ~470px tall in one column. */
  .sind-prod-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .sind-prod-card .ph { padding: 10px; }
  .sind-prod-card .ph img { aspect-ratio: 4 / 3; }
  .sind-prod-card .bd { padding: 12px 12px 14px; gap: 5px; }
  .sind-prod-card .cat { letter-spacing: .08em; }
  .sind-prod-card h3 { font-size: 14.5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
}

.sind-prod-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: .2s;
}
.sind-prod-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.sind-prod-card .ph {
  padding: 20px;
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.sind-prod-card .ph img { aspect-ratio: 4 / 3; object-fit: contain; width: 100%; }
.sind-prod-card .bd { padding: 16px 20px 20px; display: flex; flex-direction: column; gap: 7px; flex: 1; }
.sind-prod-card .cat {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--blue);
}
.sind-prod-card h3 { font-size: 15.5px; font-weight: 700; }
.sind-prod-card .vm { font-size: 13.5px; font-weight: 700; color: var(--mut); margin-top: auto; }
.sind-prod-card:hover .vm { color: var(--blue); }

/* ============================================================
   Product content — layout family A (sind-stationpack-layout)
   ============================================================ */
.sind-stationpack-layout { font-size: 16.5px; }
.sind-stationpack-layout section { margin-bottom: 56px; }
.sind-stationpack-layout__section-head { margin-bottom: 22px; }
.sind-stationpack-layout__lead { font-size: 18px; color: var(--mut); max-width: 760px; }
.sind-stationpack-layout__intro h2 { margin-bottom: 14px; }

.sind-stationpack-layout__facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}
.sind-stationpack-layout__fact {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-s);
}
.sind-stationpack-layout__fact dt {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--blue);
  margin-bottom: 6px;
}
.sind-stationpack-layout__fact dd { font-weight: 700; font-size: 15.5px; }

.sind-stationpack-layout__model-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
@media (max-width: 860px) { .sind-stationpack-layout__model-grid { grid-template-columns: 1fr; } }
.sind-stationpack-layout__model-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
}
.sind-stationpack-layout__model-card--low { border-top: 4px solid #9fb7c4; }
.sind-stationpack-layout__model-card--mid { border-top: 4px solid var(--blue); }
.sind-stationpack-layout__model-card--high { border-top: 4px solid var(--ink); }
.sind-stationpack-layout__model-kicker {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--mut);
  margin-bottom: 10px;
}
.sind-stationpack-layout__model-card h3 { margin-bottom: 12px; }
.sind-stationpack-layout__model-card dl { margin: 0; }
.sind-stationpack-layout__model-card dl > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, auto);
  gap: 2px 12px;
  padding: 7px 0;
  border-top: 1px solid var(--line);
}
.sind-stationpack-layout__model-card dl > div:first-child { border-top: 0; }
.sind-stationpack-layout__model-card dl dt { margin: 0; font-size: 12.5px; font-weight: 600; color: var(--mut); }
.sind-stationpack-layout__model-card dl dd { margin: 0; font-size: 14.5px; font-weight: 700; text-align: right; }
.sind-stationpack-layout__model-card ul { padding-left: 1.2em; font-size: 15px; color: var(--mut); }
.sind-stationpack-layout__model-card li { margin-bottom: 6px; }

.sind-stationpack-layout__steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  counter-reset: sindstep;
}
.sind-stationpack-layout__step {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
  position: relative;
}
.sind-stationpack-layout__step-number {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--blue-soft);
  color: var(--blue);
  font-weight: 800;
  font-size: 15px;
  margin-bottom: 12px;
}
.sind-stationpack-layout__step-kicker {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--blue);
  margin-bottom: 6px;
}
.sind-stationpack-layout__step p { font-size: 14.5px; color: var(--mut); }

.sind-stationpack-layout__checks {
  list-style: none;
  display: grid;
  gap: 12px;
  max-width: 760px;
}
.sind-stationpack-layout__checks li {
  display: flex;
  gap: 12px;
  align-items: baseline;
  font-weight: 600;
  font-size: 15.5px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 18px;
}
.sind-stationpack-layout__checks li::before {
  content: "\2713";
  flex: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  display: grid;
  place-items: center;
  transform: translateY(3px);
}

.sind-stationpack-layout__faq-list { display: grid; gap: 12px; max-width: 820px; }
.sind-stationpack-layout__faq-item, .sind-product__faq-item {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px 22px;
}
.sind-stationpack-layout__faq-item h3, .sind-product__faq-item h3 { font-size: 16px; margin-bottom: 8px; }
.sind-stationpack-layout__faq-item p, .sind-product__faq-item p { font-size: 15px; color: var(--mut); }

.sind-stationpack-layout__note {
  background: var(--blue-soft);
  border-radius: 12px;
  padding: 18px 22px;
  font-size: 14.5px;
  color: var(--ink);
}
.sind-stationpack-layout__note-label { font-weight: 800; margin-right: 8px; }
.sind-stationpack-layout__source { font-size: 13px; color: var(--mut); margin-top: 10px; }

/* ============================================================
   Product content — layout family B (sind-product__*)
   ============================================================ */
.sind-product__section-head { margin: 36px 0 18px; }
.sind-product__section-head h2 { margin-bottom: 8px; }
.sind-product__section-head p { color: var(--mut); max-width: 720px; }

.sind-product__tech-block {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
  margin-bottom: 16px;
}
.sind-product__tech-block h3 { font-size: 17px; margin-bottom: 10px; }
.sind-product__tech-block p { margin-bottom: 10px; }
.sind-product__tech-block ul { padding-left: 1.2em; margin-bottom: 10px; }
.sind-product__tech-block li { margin-bottom: 6px; }
.sind-product__tech-item {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
}
.sind-product__tech-item h3 { font-size: 16px; margin-bottom: 8px; }
.sind-product__tech-item p { font-size: 14.5px; color: var(--mut); }
/* Keep engineering copy to a comfortable measure (was ~156 chars/line at 1440). */
.sind-product__tech-item p, .sind-product__tech-item li,
.sind-product__tech-block p, .sind-product__tech-block li { max-width: 600px; }

.sind-product__applications, .sind-product__application { margin-bottom: 8px; }
.sind-product__app-matrix {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
}
.sind-product__app-block {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
}
.sind-product__app-block h3 { font-size: 15.5px; margin-bottom: 6px; }
.sind-product__app-block p, .sind-product__app-case p, .sind-product__scenario p { font-size: 14.5px; color: var(--mut); }

.sind-product__app-case {
  background: var(--card);
  border: 1px solid var(--line);
  border-left: 4px solid var(--blue);
  border-radius: 12px;
  padding: var(--pad-m);
  margin-top: 16px;
}
.sind-product__app-case h3 { margin-bottom: 6px; }

.sind-product__deploy { margin-top: 16px; }
.sind-product__scenario {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: var(--pad-m);
  margin-bottom: 14px;
}
.sind-product__scenario h3 { margin-bottom: 6px; }

.sind-product__commercial-block {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
  margin-bottom: 16px;
}
.sind-product__commercial-block h3 { font-size: 17px; margin-bottom: 10px; }
.sind-product__commercial-block > p { margin-bottom: 10px; }
.sind-product__commercial-item {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
}
.sind-product__commercial-item h3 { font-size: 15.5px; margin-bottom: 8px; }
.sind-product__commercial-item p, .sind-product__commercial-item li { font-size: 14.5px; color: var(--mut); }
.sind-product__commercial-item ul { padding-left: 1.2em; }

.sind-product__faq-list { display: grid; gap: 12px; max-width: 820px; }

/* ============================================================
   PDP lean structure (R8 item 5)
   ============================================================ */
/* Product pages use a full-width layout for their grids; the readable
   measure is applied to running prose instead of the whole container. */
body.single-product .entry-content { max-width: none; }
body.single-product .entry-content > p,
body.single-product .entry-content > ul,
body.single-product .entry-content > ol,
body.single-product .entry-content > blockquote { max-width: 680px; }

.sind-product__technology,
.sind-product__applications,
.sind-product__faq,
.sind-product__checklist,
.sind-product__commercial-details { margin-bottom: 24px; }
.sind-product__technology h2,
.sind-product__applications h2,
.sind-product__faq h2,
.sind-product__checklist h2,
.sind-product__commercial-details h2 { margin: 0 0 18px; }
.sind-stationpack-layout section { margin-bottom: 24px; }

.sind-product__tech-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
@media (max-width: 900px) { .sind-product__tech-grid { grid-template-columns: minmax(0, 1fr); } }
.sind-product__tech-grid .sind-product__tech-item { height: 100%; }

.sind-app-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}
@media (min-width: 1101px) { .sind-app-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sind-app-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-m);
}
.sind-app-card h3 { font-size: 15.5px; margin-bottom: 8px; }
.sind-app-card p { font-size: 14.5px; color: var(--mut); }

@media (min-width: 901px) {
  .sind-product__checklist .sind-stationpack-layout__checks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
  }
}
.sind-pdp-checklist-link { display: inline-block; margin-top: 18px; }

/* Mobile density — keep the lean PDP compact on small screens. */@media (max-width: 768px) {
  .sind-product__technology,
  .sind-product__applications,
  .sind-product__faq,
  .sind-product__checklist,
  .sind-product__commercial-details,
  .sind-stationpack-layout section { margin-bottom: 24px; }
  .sind-stationpack-layout__facts { gap: 10px; }
  .sind-stationpack-layout__fact { padding: 14px 16px; }
  .sind-stationpack-layout__model-card { padding: 18px; }
  .sind-stationpack-layout__checks { gap: 8px; }
  .sind-stationpack-layout__checks li { padding: 11px 14px; font-size: 15px; }
  .sind-pdp-acc { margin-top: 10px; padding: 0 16px; }
  .sind-pdp-acc > summary { padding: 12px 30px 12px 0; font-size: 15px; }
  .sind-product__tech-grid,
  .sind-app-cards { gap: 12px; }
  /* R10 E3: on mobile the Technology/Applications cards are teasers — the full
     copy lives in the "More …" accordion directly below, so clamp each summary
     to two lines. Text stays in the DOM (line-clamp, not truncation of markup). */
  .sind-product__tech-item p,
  .sind-app-card p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .sind-pdp-checklist-link { margin-top: 12px; }
  .sind-pdp-hero { gap: 22px; }
  .sind-pdp-summary h1 { margin: 8px 0 12px; }
  .sind-pdp-ctas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-top: 20px; }
  .sind-pdp-ctas .sind-btn { width: 100%; padding: 12px 16px; text-align: center; }
  /* Mobile keeps the sticky .sind-mbar (Get a Quote + WhatsApp), so the header
     WhatsApp ghost button is redundant here. */
  .sind-pdp-ctas .sind-btn--ghost { display: none; }
  /* The mid-page checklist link opens the same inquiry modal as the sticky bar,
     so on mobile it is a third duplicate CTA — hide it to keep the page ≤4. */
  .sind-pdp-checklist-link { display: none; }
  .sind-pdp-meta { margin-top: 20px; }
  .sind-pdp-meta .row { padding: 9px 0; }
}

.sind-pdp-acc {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  margin-top: 14px;
  padding: 0 20px;
}
.sind-pdp-acc--intro { margin-top: 22px; }
.sind-pdp-acc > summary {
  cursor: pointer;
  list-style: none;
  font-weight: 700;
  font-size: 15.5px;
  padding: 15px 34px 15px 0;
  position: relative;
}
.sind-pdp-acc > summary::-webkit-details-marker { display: none; }
.sind-pdp-acc > summary::after {
  content: "+";
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  font-weight: 700;
  color: var(--blue);
  line-height: 1;
}
.sind-pdp-acc[open] > summary::after { content: "\2212"; }
.sind-pdp-acc > p { padding: 0 0 18px; font-size: 15px; color: var(--mut); }
.sind-pdp-acc__body { padding: 0 0 18px; }
.sind-pdp-acc__body > p,
.sind-pdp-acc__body p,
.sind-pdp-acc__body li { font-size: 14.5px; color: var(--mut); max-width: 680px; }
.sind-pdp-acc__body > p { margin-bottom: 10px; }
.sind-pdp-acc__body ul,
.sind-pdp-acc__body ol { padding-left: 1.2em; margin-bottom: 12px; }
.sind-pdp-acc__body li { margin-bottom: 6px; }
.sind-pdp-acc__hd { margin: 16px 0 6px; color: var(--ink); font-size: 15.5px; }
.sind-pdp-acc__body table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 12px 0; }
.sind-pdp-acc__body th,
.sind-pdp-acc__body td { padding: 9px 12px; border-bottom: 1px solid var(--line); text-align: left; }
.sind-pdp-acc__body pre {
  overflow-x: auto;
  font-size: 12.5px;
  background: var(--blue-soft);
  padding: 12px 14px;
  border-radius: 10px;
  margin: 12px 0;
}

.sind-pdp-note { margin-top: 26px; font-size: 13px; color: var(--mut); max-width: 760px; }

/* Compact the trailing related-products row so the PDP stays short. */
.sind-related { margin-bottom: 24px; }
.sind-related .sind-prod-card .ph { padding: 14px; }
.sind-related .sind-prod-card .ph img { aspect-ratio: 4 / 3; }
.sind-pdp-cases { margin-bottom: 24px; }

/* Generic product wrapper + tables */
.sind-gen-product { font-size: 16.5px; }
.sind-gen-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  font-size: 15px;
  margin: 1.2em 0;
}
.sind-gen-table th, .sind-gen-table td {
  padding: 13px 18px;
  text-align: left;
  border-bottom: 1px solid var(--line);
}
.sind-gen-table th {
  background: var(--blue-soft);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.sind-gen-table tr:last-child th, .sind-gen-table tr:last-child td { border-bottom: none; }

.sind-product__comparison-table,
.sind-product__industry-table,
.sind-product__maintenance-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  font-size: 15px;
  margin: 1.2em 0;
}
.sind-product__comparison-table th, .sind-product__comparison-table td,
.sind-product__industry-table th, .sind-product__industry-table td,
.sind-product__maintenance-table th, .sind-product__maintenance-table td {
  padding: 13px 18px;
  text-align: left;
  border-bottom: 1px solid var(--line);
}
.sind-product__comparison-table th, .sind-product__industry-table th, .sind-product__maintenance-table th {
  background: var(--blue-soft);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

@media (max-width: 640px) {
  /* Product data tables inherit the mobile wrap rule above (see "Mobile
     tables" near the single-post section) — no per-class override needed. */
}

/* ============================================================
   Shop archive
   ============================================================ */
.sind-shop { padding: 48px 0 0; }
.sind-shop-head { margin-bottom: 30px; max-width: 760px; }
.sind-shop-head h1 { margin-bottom: 10px; }
.sind-shop-head .sind-shop-sub { color: var(--mut); font-size: 17px; }

.sind-cat-bar { margin: 36px 0 40px; }
.sind-cat-bar h2 { font-size: 15px; letter-spacing: .1em; text-transform: uppercase; color: var(--mut); margin-bottom: 14px; }
.sind-cat-bar-cards { display: flex; flex-wrap: wrap; gap: 10px; }
.sind-cat-btn {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 20px;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: .15s;
  color: inherit;
  font-family: inherit;
}
.sind-cat-btn:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-soft); }
.sind-cat-btn.active { background: var(--blue); color: #fff; border-color: var(--blue); }

.sind-tab-bar { margin: 0 0 28px; }
.sind-tab-bar-cards { display: flex; flex-wrap: wrap; gap: 10px; }
.sind-tab-btn {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 20px;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: .15s;
  color: inherit;
  font-family: inherit;
}
.sind-tab-btn:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-soft); }
.sind-tab-btn.active { background: var(--blue); color: #fff; border-color: var(--blue); }
.sind-tab-panel { display: none; }
.sind-tab-panel.is-active { display: block; }

.sind-cat-section { margin-bottom: 56px; }
.sind-cat-section-head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 14px;
  row-gap: 4px;
  margin-bottom: 22px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--line);
}
.sind-cat-section-head h2 { font-size: 24px; }
.sind-cat-section-head .count { color: var(--mut); font-size: 14px; font-weight: 700; }
.sind-cat-section-head a { margin-left: auto; font-weight: 700; font-size: 14px; color: var(--blue); white-space: nowrap; }
@media (max-width: 560px) {
  .sind-cat-section-head a { margin-left: 0; flex-basis: 100%; }
}

.sind-shop-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 1000px) { .sind-shop-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .sind-shop-grid { grid-template-columns: 1fr; } }

/* Category archive taxonomy description */
.sind-term-desc { color: var(--mut); max-width: 720px; margin-bottom: 30px; }

/* ============================================================
   Inquiry modal
   ============================================================ */
.sind-modal { display: none; position: fixed; inset: 0; z-index: 10000; }
.sind-modal.is-open { display: block; }
.sind-modal__overlay { position: absolute; inset: 0; background: rgba(16, 24, 32, .55); backdrop-filter: blur(3px); }
.sind-modal__dialog {
  position: relative;
  width: min(620px, 92vw);
  max-height: 88vh;
  overflow-y: auto;
  margin: 6vh auto 0;
  background: var(--card);
  border-radius: 20px;
  padding: 38px 42px 42px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .3);
}
.sind-modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 38px;
  height: 38px;
  border: none;
  border-radius: 50%;
  background: #f0ede7;
  color: var(--ink);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.sind-modal__close:hover { background: var(--blue-soft); color: var(--blue); }
/* Popup brand mark: popups carry the SIND logo, never a plain "SIND" text mark.
   Element-qualified so it also wins against WooCommerce's `.woocommerce-page img
   { height:auto }` (same specificity, but style.css loads after WooCommerce). */
img.sind-popup-brand { display: block; height: 34px; width: auto; }
.sind-modal__logo { margin: 2px 0 12px; }
.sind-search-brand { padding: 4px 10px 14px; }
.sind-bg-modal__logo { margin-bottom: 10px; }
.sind-wa-brand { padding: 12px 20px 10px; border-bottom: 1px solid var(--line); }
.sind-modal__dialog h2 { font-size: 26px; margin: 8px 0 8px; }
.sind-modal__sub { color: var(--mut); font-size: 15px; margin-bottom: 22px; }
body.sind-no-scroll { overflow: hidden; }
@media (max-width: 640px) { .sind-modal__dialog { padding: 30px 22px 34px; margin-top: 4vh; } }

/* CF7 form styling inside modal / enquiry card */
.sind-modal .wpcf7, .sind-enquiry-card .wpcf7 { font-size: 15px; }
.sind-modal .wpcf7 label, .sind-enquiry-card .wpcf7 label { font-weight: 700; font-size: 13.5px; display: block; margin-bottom: 6px; }
.sind-modal .wpcf7 input[type=text], .sind-modal .wpcf7 input[type=email], .sind-modal .wpcf7 input[type=tel], .sind-modal .wpcf7 input[type=url], .sind-modal .wpcf7 textarea, .sind-modal .wpcf7 select,
.sind-enquiry-card .wpcf7 input[type=text], .sind-enquiry-card .wpcf7 input[type=email], .sind-enquiry-card .wpcf7 input[type=tel], .sind-enquiry-card .wpcf7 input[type=url], .sind-enquiry-card .wpcf7 textarea, .sind-enquiry-card .wpcf7 select {
  width: 100%;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  background: var(--bg);
  padding: 12px 14px;
  font-family: inherit;
  font-size: 15px;
  color: var(--ink);
  margin-bottom: 4px;
}
.sind-modal .wpcf7 input:focus, .sind-modal .wpcf7 textarea:focus,
.sind-enquiry-card .wpcf7 input:focus, .sind-enquiry-card .wpcf7 textarea:focus {
  outline: none;
  border-color: var(--blue);
  background: #fff;
}
.sind-modal .wpcf7 input[type=submit], .sind-enquiry-card .wpcf7 input[type=submit] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background: var(--ink);
  color: #fff;
  font-weight: 700;
  font-size: 15.5px;
  font-family: inherit;
  padding: 15px 30px;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: .2s;
  margin-top: 8px;
}
.sind-modal .wpcf7 input[type=submit]:hover, .sind-enquiry-card .wpcf7 input[type=submit]:hover { background: var(--blue); }
.sind-modal .wpcf7 form p, .sind-enquiry-card .wpcf7 form p { margin-bottom: 14px; }
.sind-modal .wpcf7-not-valid-tip, .sind-enquiry-card .wpcf7-not-valid-tip { color: #c0392b; font-size: 13px; }
.sind-modal .wpcf7 form .wpcf7-response-output, .sind-enquiry-card .wpcf7 form .wpcf7-response-output {
  border-radius: 10px;
  font-size: 14px;
  margin: 14px 0 0;
  padding: 12px 16px;
}

/* CF7 form styling in page form cards (Contact, Distributor, Spare Parts,
   Solutions). Lower specificity than the modal rules above, so the modal
   forms keep their own styling. */
.wpcf7 { font-size: 15px; }
.wpcf7 label { display: block; font-weight: 700; font-size: 14px; margin-bottom: 6px; }
.wpcf7 input:not([type=submit]):not([type=checkbox]):not([type=radio]):not([type=file]),
.wpcf7 select,
.wpcf7 textarea {
  width: 100%; max-width: 100%; box-sizing: border-box;
  min-height: 48px; padding: 12px 14px;
  border: 1.5px solid var(--line); border-radius: 10px;
  background: #fff; color: var(--ink);
  font-family: inherit; font-size: 16px; margin-bottom: 4px;
}
.wpcf7 input:focus, .wpcf7 select:focus, .wpcf7 textarea:focus { outline: none; border-color: var(--blue); }
.wpcf7 input[type=submit] {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 180px; border: 0; border-radius: 999px; padding: 15px 30px;
  background: var(--blue); color: #fff; font-weight: 700; font-size: 15.5px;
  font-family: inherit; cursor: pointer; transition: .2s; margin-top: 8px;
}
.wpcf7 input[type=submit]:hover { background: var(--blue-dark); }
.wpcf7 form p { margin-bottom: 14px; }
.wpcf7-not-valid-tip { color: #c0392b; font-size: 13px; }
.wpcf7 form .wpcf7-response-output { border-radius: 10px; font-size: 14px; margin: 14px 0 0; padding: 12px 16px; }

/* ============================================================
   Mobile inquiry bar (product pages)
   ============================================================ */
.sind-mbar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9990;
  background: #fff;
  border-top: 2px solid var(--blue);
  padding: 8px 12px;
  gap: 8px;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, .12);
}
.sind-mbar button, .sind-mbar a {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  height: 44px;
  padding: 0 8px;
  border-radius: 999px;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: .3px;
  border: none;
}
.sind-mbar svg { width: 18px; height: 18px; flex: 0 0 18px; }
.sind-mbar .q { background: var(--ink); color: #fff; }
.sind-mbar .w { background: var(--green); color: #fff; }
@media (max-width: 768px) {
  body.sind-has-mbar { padding-bottom: 68px; }
  .sind-mbar { display: flex; }
  /* Product pages already carry WhatsApp in the bottom bar, so the floating
     button would sit on top of the content and duplicate it. */
  body.sind-has-mbar #sind-wa-float { display: none; }
  /* The 148px lift only exists to clear the tall mobile inquiry bar; on
     non-product pages it left the back-to-top button floating over the
     content (covering table cells / paragraph text). Scope it to the mbar. */
  body.sind-has-mbar #sind-back-to-top { bottom: 148px !important; }
}
/* On phones the WhatsApp float (50px button at bottom:16px) would cover the
   last block of content. Give every page bottom clearance; product pages
   keep their taller mbar offset via the more-specific body.sind-has-mbar
   rule above. */
@media (max-width: 640px) {
  body { padding-bottom: 72px; }
}

/* ============================================================
   WhatsApp float
   ============================================================ */
#sind-wa-float { position: fixed; bottom: 24px; right: 24px; z-index: 9999; }
#sind-wa-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  background: var(--green);
  border: none;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(37, 211, 102, .3);
  cursor: pointer;
  transition: .3s;
  padding: 0;
}
#sind-wa-toggle:hover { transform: scale(1.08); background: #1fb855; }
#sind-wa-toggle svg { width: 30px; height: 30px; fill: #fff; }
#sind-wa-panel {
  position: absolute;
  bottom: 70px;
  right: 0;
  background: #fff;
  border-radius: 14px;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-md);
  padding: 8px 0;
  min-width: 260px;
  max-width: min(320px, calc(100vw - 48px));
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: .25s;
}
#sind-wa-float.open #sind-wa-panel { opacity: 1; visibility: visible; transform: translateY(0); }
.sind-wa-contact { display: flex; flex-direction: column; padding: 12px 20px; transition: background .2s; }
.sind-wa-contact:hover { background: var(--blue-soft); }
.sind-wa-name { font-weight: 800; font-size: 15px; color: var(--ink); }
.sind-wa-contact:hover .sind-wa-name { color: var(--blue); }
.sind-wa-title { font-size: 12.5px; color: var(--mut); margin-top: 2px; }
@media (max-width: 767px) {
  #sind-wa-float { bottom: 16px; right: 16px; }
  #sind-wa-toggle { width: 50px; height: 50px; }
  #sind-wa-toggle svg { width: 26px; height: 26px; }
  #sind-wa-panel { min-width: 220px; }
}

/* ============================================================
   Header search — expands in place of the nav, with a scope
   dropdown (All / Products / Case Studies / Insights). The
   desktop nav collapses while the field is open.
   ============================================================ */
.sind-hd-search { display: none; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; }
.sind-hd.is-searching .sind-hd-search {
  display: flex;
  animation: sindSearchIn .26s ease both;
}
@keyframes sindSearchIn {
  from { opacity: 0; transform: translateX(16px); }
  to   { opacity: 1; transform: none; }
}
.sind-hd.is-searching .sind-nav { display: none; }
.sind-hd.is-searching .sind-hd-search__toggle { display: none; }

.sind-hd-search__box {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  padding: 4px 5px 4px 6px;
  transition: border-color .15s ease;
}
.sind-hd-search__box:focus-within { border-color: var(--blue); }

.sind-hd-search__scope { position: relative; flex: 0 0 auto; }
.sind-hd-search__scopebtn {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--blue-dark);
  padding: 8px 24px 8px 12px;
  border-radius: 999px;
  cursor: pointer;
}
.sind-hd-search__scopebtn:hover { background: var(--blue-soft); }
.sind-hd-search__scopebtn:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }

/* Scope menu — replaces the un-styleable native <select> popup. Items are
   centred inside a card that matches the site's rounded chrome. */
.sind-hd-search__scopemenu {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  z-index: 60;
  min-width: 100%;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 16px 36px rgba(16, 24, 40, .14);
}
.sind-hd-search__scopemenu[hidden] { display: none; }
.sind-hd-search__scopemenu li {
  text-align: center;
  padding: 9px 16px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  white-space: nowrap;
  cursor: pointer;
}
.sind-hd-search__scopemenu li:hover,
.sind-hd-search__scopemenu li:focus { background: var(--blue-soft); color: var(--blue-dark); outline: none; }
.sind-hd-search__scopemenu li[aria-selected="true"] { background: var(--blue-soft); color: var(--blue-dark); font-weight: 700; }
/* hairline between the scope picker and the field */
.sind-hd-search__scope::before {
  content: "";
  position: absolute;
  right: 0;
  top: 22%;
  height: 56%;
  border-right: 1px solid var(--line);
  pointer-events: none;
}
/* caret */
.sind-hd-search__scope::after {
  content: "";
  position: absolute;
  right: 11px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.6px solid var(--blue-dark);
  border-bottom: 1.6px solid var(--blue-dark);
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}
.sind-hd-search__scope.is-open::after { transform: translateY(-30%) rotate(225deg); }
.sind-hd-search__sr {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.sind-hd-search input[type=search] {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  padding: 8px 6px;
}
.sind-hd-search input::placeholder { color: #a8a29a; }

.sind-hd-search__submit {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--blue);
  color: #fff;
  cursor: pointer;
}
.sind-hd-search__submit:hover { background: var(--blue-dark); }
.sind-hd-search__submit svg { width: 17px; height: 17px; }

.sind-hd-search__close {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 0;
  background: #f0ede7;
  color: var(--ink);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.sind-hd-search__close:hover { background: var(--blue-soft); color: var(--blue); }

@media (max-width: 1000px) {
  /* Nav is already hidden here, so the open field just takes the row. */
  .sind-hd.is-searching .sind-logo { display: none; }
  .sind-hd.is-searching .sind-burger { display: none; }
  .sind-hd.is-searching .sind-hd-spacer { display: none; }
}
@media (max-width: 700px) {
  .sind-hd-search__scopebtn { font-size: 12.5px; padding: 8px 22px 8px 10px; }
}

/* ============================================================
   404 page
   ============================================================ */
.sind-404-search {
  display: flex;
  align-items: center;
  max-width: 460px;
  margin: 0 auto 30px;
  background: var(--bg);
  border: 2px solid var(--blue);
  border-radius: 999px;
  overflow: hidden;
}
.sind-404-search input[type="search"] {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  padding: 13px 20px;
  font-size: 16px;
  font-family: inherit;
  color: var(--ink);
}
.sind-404-search button {
  border: 0;
  background: var(--blue);
  color: #fff;
  padding: 0 22px;
  align-self: stretch;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}
.sind-404-search button:hover { background: var(--blue-dark); }
.sind-404-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
  justify-content: center;
}
.sind-404-links a {
  color: var(--blue);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sind-404-links a:hover { color: var(--blue-dark); }

/* ============================================================
   Back to top
   ============================================================ */
#sind-back-to-top {
  position: fixed;
  bottom: 96px;
  right: 24px;
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: var(--ink);
  color: #fff;
  border: none;
  border-radius: 50%;
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: .3s;
  padding: 0;
}
#sind-back-to-top.sind-visible { opacity: 1; visibility: visible; transform: translateY(0); }
#sind-back-to-top:hover { background: var(--blue); }
@media (max-width: 767px) {
  #sind-back-to-top { right: 16px; width: 40px; height: 40px; }
  /* Single case / insight pages are full-width reading pages on mobile: the
     fixed corner floats (WhatsApp bubble, back-to-top) sit on top of the
     paragraph and data-table text as it scrolls, clipping words. Both
     templates already carry an in-page CTA band, so drop the floats here for
     clean reading; desktop keeps them (the 920px column never reaches them). */
  body:has(.sind-case-page) #sind-back-to-top,
  body:has(.sind-case-page) #sind-wa-float { display: none; }
  /* R10 E6 (2026-10-06): at 390px a 50px right-docked float can never clear
     full-width content — home cards and product copy reach x=370, leaving only
     a 20px gutter. The WhatsApp bubble covered the "Latest case studies" card
     headings, and the back-to-top button covered a product accordion's "+".
     Drop both floats on the front page and the back-to-top on product pages
     (which already carry the sticky inquiry bar); WhatsApp stays one tap from
     the footer and the mobile menu. */
  body.home #sind-wa-float,
  body.home #sind-back-to-top,
  body.sind-has-mbar #sind-back-to-top { display: none; }
  /* 2026-10-07: the two board pages (Insights, Case Studies) are full-width
     lists at 390px as well — the WhatsApp bubble (50px, x=324) sat over the
     right edge of a row. Drop it here like the front page; WhatsApp stays one
     tap from the footer and the mobile menu. Back-to-top is a scroll-time
     affordance on these long lists and is opacity:0 at load, so it stays. */
  body:has(.sind-cases-list) #sind-wa-float { display: none; }
}

/* ============================================================
   Misc
   ============================================================ */
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
.sind-clear { clear: both; }

/* Case studies filter (page 2254) */
.sind-cases-filter {
  margin-bottom: 28px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.sind-cases-filter label { font-weight: 700; font-size: 14.5px; }
.sind-cases-filter select {
  border: 1.5px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  padding: 10px 18px;
  font-family: inherit;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
}

/* WordPress core alignment helpers */
.alignleft { float: left; margin: 0 1.4em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1.4em; }
.aligncenter { margin: 0 auto 1.2em; }

/* ============================ Homepage ============================ */
.sind-home { display: block; }
.sind-sec { padding: 56px 0; }
.sind-home h2 { font-size: clamp(30px, 3vw, 40px); font-weight: 800; letter-spacing: -.015em; }
.sind-home .sec-sub { color: var(--mut); max-width: 600px; margin-top: 14px; font-size: 17.5px; }
.sind-home .card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }

/* Hero */
.sind-hero__stack { padding: 36px 0 48px; }
.sind-hero__copy { max-width: 780px; margin: 0 auto; text-align: center; }
.sind-hero__copy .sind-eyebrow { display: inline-block; }
.sind-hero__copy .sind-hero__ctas { justify-content: center; }
.sind-hero__banner { margin: 0 0 36px; }
.sind-hero__banner img { display: block; width: 100%; aspect-ratio: 1920 / 506; object-fit: cover; object-position: center 66.7%; border-radius: 20px; background: #fff; border: 1px solid var(--line); }
.sind-hero h1 { font-size: clamp(36px, 4.4vw, 56px); font-weight: 800; line-height: 1.18; letter-spacing: -.015em; margin: 18px 0 20px; }
.sind-hero h1 .hl { color: var(--blue); }
.sind-hero__lead { font-size: 19px; color: var(--mut); max-width: 560px; margin-left: auto; margin-right: auto; }
.sind-hero__ctas { display: flex; gap: 14px; margin-top: 32px; flex-wrap: wrap; align-items: center; }
/* Between the .wrap paddings (<=640px: 20px) and the max-width cap (>1180px:
   centered), the shorthand above zeroes the stack's side padding and the
   banner touches the viewport edge. Restore side gutters in that range. */
@media (min-width: 641px) and (max-width: 1180px) {
  .sind-hero__stack { padding-inline: 20px; }
}

/* Stats strip */
.sind-strip { border-top: 1px solid var(--line); }
.sind-strip__grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.hstat { padding: 26px 30px; }
.hstat + .hstat { border-left: 1px solid var(--line); }
.hstat .v { font-size: 30px; font-weight: 800; }
.hstat .v em { color: var(--blue); font-style: normal; }
.hstat .k { font-size: 13px; color: var(--mut); margin-top: 2px; }

/* Product range */
.sind-range-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.sind-range-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 44px; }
.sind-range-foot { margin-top: 32px; text-align: center; }
/* Contact actions rendered as links (reveal buttons + WhatsApp links). */
.sind-linkbtn {
  background: none; border: 0; padding: 0; margin: 0;
  font: inherit; font-weight: 600; color: var(--blue);
  cursor: pointer; text-align: left; text-decoration: underline; text-underline-offset: 3px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.sind-linkbtn:hover { color: var(--blue-dark); }
.sind-range-card { padding: var(--pad-m); display: flex; flex-direction: column; gap: 13px; transition: .2s; }
.sind-range-card:hover { box-shadow: 0 14px 40px rgba(27,35,44,.08); transform: translateY(-3px); }
.sind-range-card img { width: 100%; aspect-ratio: 4/3; object-fit: contain; background: #fff; border: 1px solid var(--line); border-radius: 10px; }
/* Inset option for near-square shots: they fill the 4:3 box height
   edge to edge, which reads heavier than the wide product shots. */
.sind-range-card--inset img { padding: 7%; }
.sind-range-card h3 { font-size: 16.5px; font-weight: 700; }
.sind-range-card .go { font-size: 13.5px; font-weight: 700; color: var(--blue); margin-top: auto; }

/* About */
.sind-about__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 56px; align-items: center; }
.sind-about figure { margin: 0; }
.sind-about figure img { width: 100%; height: auto; border-radius: 20px; border: 1px solid var(--line); background: #fff; }
.sind-about blockquote { font-size: 26px; font-weight: 800; line-height: 1.35; letter-spacing: -.01em; margin: 18px 0 16px; }
.sind-about p { color: var(--mut); }
.sind-about .ticks { margin-top: 24px; display: grid; gap: 12px; list-style: none; }
.sind-about .ticks li { display: flex; gap: 12px; align-items: baseline; font-weight: 600; font-size: 15.5px; }
.sind-about .ticks li::before { content: "\2713"; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); font-size: 12px; font-weight: 800; display: grid; place-items: center; transform: translateY(3px); }

/* Featured (white band) */
.sind-feat-band { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 56px 0; }
.sind-feat-band h2 { margin-top: 12px; }
.sind-feat-band .sind-prod-grid { margin-top: 44px; }

/* CTA band */
.sind-cta-band .card { background: var(--blue-soft); border: none; padding: 50px 54px; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.sind-cta-band h2 { max-width: 660px; }
.sind-cta-band .sind-cta-link { color: var(--blue); font-size: 16px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.sind-cta-band .sind-cta-link:hover { color: var(--blue-dark); }

/* Insights card grid. Selectors keep the `.sind-news-*` prefix — pages/insights.php
   and sind-news.css own them; only the section name changed when News folded in. */
.sind-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 44px; }
.sind-news-card { padding: var(--pad-m); display: flex; flex-direction: column; gap: 11px; transition: .2s; }
.sind-news-card:hover { box-shadow: 0 14px 40px rgba(27,35,44,.08); transform: translateY(-3px); }
.sind-news-card .date { font-size: 13px; font-weight: 700; color: var(--blue); }
.sind-news-card h3 { font-size: 18px; font-weight: 800; }
.sind-news-card p { font-size: 14.5px; color: var(--mut); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sind-news-card .rm { font-size: 13.5px; font-weight: 700; color: var(--blue); margin-top: auto; }

@media (max-width: 1000px) {
  .sind-range-grid { grid-template-columns: repeat(2, 1fr); }
  .sind-news-grid { grid-template-columns: repeat(2, 1fr); }
  .sind-about__grid { grid-template-columns: 1fr; }
  .sind-strip__grid { grid-template-columns: repeat(2, 1fr); }
  .hstat + .hstat { border-left: none; border-top: 1px solid var(--line); }
  .hstat:nth-child(-n+2) { border-top: none; }
  .hstat:nth-child(even) { border-left: 1px solid var(--line); }
}
@media (max-width: 640px) {
  .sind-sec, .sind-feat-band { padding: 40px 0; }
  .sind-range-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .sind-range-card { padding: var(--pad-s); gap: 8px; }
  .sind-range-card h3 { font-size: 14px; }
  .sind-range-card .go { font-size: 12.5px; }
  .sind-news-grid { grid-template-columns: 1fr; }
  .sind-cta-band .card { padding: 36px 26px; }
}

/* ============================================================
   Inner pages — Phase C native rebuilds
   ============================================================ */
.sind-pg h1 { margin: 14px 0 18px; }
.sind-pg h2 { margin-top: 14px; }
.sind-pg-hero { padding: 56px 0 4px; }
.sind-pg-hero .sind-eyebrow { color: var(--blue); }
.sind-pg-hero h1 { color: var(--ink); }
.sind-pg-hero__sub { color: var(--mut); }
.sind-pg-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.sind-pg-split__sub { color: var(--mut); margin-top: 14px; max-width: 560px; }
.sind-pg-sideimg { margin: 0; }
.sind-pg-sideimg img { width: 100%; height: auto; border-radius: var(--radius); border: 1px solid var(--line); background: #fff; }
.sind-pg-panel { background: #f1f1f1; border-radius: var(--radius); padding: var(--pad-l); }
.sind-pg-panel h2 { font-size: clamp(22px, 2.4vw, 30px); }
.sind-pg-panel .sind-acc { margin-top: 26px; }
.sind-pg-panel .sind-acc-item { background: #fff; }
.sind-pg-panel .sind-btn { margin-top: 26px; }
.sind-pg-contact { display: grid; grid-template-columns: 1.9fr 1fr; gap: 40px; align-items: start; }
.sind-pg-formcard { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--pad-l); }
.sind-pg-formcard h2 { font-size: clamp(22px, 2.4vw, 30px); }
.sind-pg-formcard__sub { color: var(--mut); margin: 12px 0 26px; }
.sind-pg-formcard .wpcf7 { background: #f6f4f0; border-radius: 12px; padding: 28px; }
.sind-pg-aside h3 { font-size: 18px; margin: 34px 0 16px; }
.sind-pg-aside h3:first-child { margin-top: 0; }
.sind-pg-steps { list-style: none; display: grid; gap: 18px; counter-reset: step; }
.sind-pg-steps li { position: relative; padding-left: 46px; color: var(--mut); font-size: 14.5px; }
.sind-pg-steps li strong { display: block; color: var(--ink); font-size: 15.5px; }
.sind-pg-steps li::before { counter-increment: step; content: counter(step); position: absolute; left: 0; top: 2px; width: 30px; height: 30px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); font-weight: 800; font-size: 14px; display: grid; place-items: center; }
.sind-pg-facts { list-style: none; display: grid; gap: 16px; }
.sind-pg-facts li { color: var(--mut); font-size: 14.5px; }
.sind-pg-facts li span { display: block; color: var(--ink); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 2px; }
.sind-pg-facts a { color: var(--blue); font-weight: 600; }
.sind-pg-aside__ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
.sind-pg-whyhero { display: grid; grid-template-columns: 1.9fr 1fr; gap: 44px; align-items: stretch; }
.sind-pg-whyhero__sub { color: var(--mut); margin-top: 14px; max-width: 620px; }
.sind-pg-feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 36px; }
.sind-pg-feat { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.sind-pg-feat img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.sind-pg-feat .bd { padding: var(--pad-m); }
.sind-pg-feat h4 { font-size: 16.5px; font-weight: 700; margin-bottom: 10px; }
.sind-pg-feat p { font-size: 14.5px; color: var(--mut); }
.sind-pg-feat .bd:only-child { margin: auto 0; }
.sind-pg-quotecard { position: relative; margin: 0; border-radius: var(--radius); overflow: hidden; display: flex; min-height: 420px; }
.sind-pg-quotecard > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sind-pg-quotecard .ov { position: relative; margin-top: auto; width: 100%; padding: 26px; background: rgba(0, 144, 200, .92); color: #fff; }
.sind-pg-quotecard .ov h3 { color: #fff; font-size: 17px; }
.sind-pg-quotecard .ov p { font-size: 14px; color: #eaf7fc; margin-top: 10px; }
.sind-pg-quotecard blockquote { font-size: 15px; line-height: 1.6; color: #fff; }
.sind-pg-stars { display: inline-block; color: #fff; letter-spacing: .2em; font-size: 13px; margin-top: 8px; }
.sind-pg-statband { background: var(--ink); color: #fff; padding: 48px 0; }
.sind-pg-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; text-align: center; }
.sind-pg-stat .v { font-size: 46px; font-weight: 800; letter-spacing: -.02em; }
.sind-pg-stat .v em { color: var(--blue); font-style: normal; font-size: .55em; font-weight: 800; }
.sind-pg-stat .k { font-weight: 700; margin-top: 8px; }
.sind-pg-stat .s { font-size: 13.5px; color: #a9b6c2; margin-top: 6px; }
.sind-pg-scrollrow { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 10px; -webkit-overflow-scrolling: touch; }
.sind-pg-scrollrow img { flex: 0 0 76%; max-width: none; width: 76%; scroll-snap-align: center; border-radius: 12px; border: 1px solid var(--line); background: #fff; }
.sind-pg-bar { margin-top: 22px; }
.sind-pg-bar .lbl { display: flex; justify-content: space-between; font-size: 14.5px; font-weight: 700; }
.sind-pg-bar .lbl span:last-child { color: var(--blue); }
.sind-pg-bar .track { height: 8px; background: var(--line); border-radius: 99px; margin-top: 8px; overflow: hidden; }
.sind-pg-bar .fill { height: 100%; background: linear-gradient(90deg, var(--blue), #33b5e2); border-radius: 99px; }
.sind-pg-work { background: #fff; border-top: 1px solid var(--line); }
.sind-pg-steps4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 42px; }
.sind-pg-step { background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--pad-m); }
.sind-pg-step .n { font-size: 13px; font-weight: 800; color: var(--blue); letter-spacing: .12em; }
.sind-pg-step h4 { font-size: 16.5px; font-weight: 700; margin: 10px 0; }
.sind-pg-step p { font-size: 14px; color: var(--mut); }
.sind-pg-step .sub { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line); font-size: 13px; color: var(--blue-dark); font-weight: 600; }
.sind-pg-faqtop { display: grid; grid-template-columns: 1.5fr 1fr; gap: 56px; align-items: center; }
.sind-pg-faqmid { display: grid; grid-template-columns: 1fr 1.3fr; gap: 0; align-items: stretch; }
.sind-pg-faqmid .sind-pg-quotecard { border-radius: var(--radius) 0 0 var(--radius); min-height: 0; }
.sind-pg-faqmid .sind-pg-panel { border-radius: 0 var(--radius) var(--radius) 0; }
.sind-acc { display: grid; gap: 12px; margin-top: 30px; }
.sind-acc-item { background: var(--card); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; transition: border-color .2s; }
.sind-acc-item.open { border-color: var(--blue); }
.sind-acc-q { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 22px; background: none; border: none; cursor: pointer; text-align: left; font-size: 15.5px; font-weight: 700; color: var(--ink); }
.sind-acc-q .chev { flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); display: grid; place-items: center; font-size: 17px; font-weight: 800; transition: .2s; }
.sind-acc-q .chev::before { content: "+"; line-height: 1; }
.sind-acc-item.open .chev { transform: rotate(45deg); background: var(--blue); color: #fff; }
.sind-acc-a { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.sind-acc-a > div { padding: 0 22px 20px; color: var(--mut); font-size: 14.5px; }
.sind-acc-a p + p { margin-top: 10px; }
.sind-acc-a a { color: var(--blue); font-weight: 600; }
.sind-pg-sup { background: #f1f1f1; border-radius: 12px; padding: var(--pad-m); }
.sind-pg-sup h4 { font-size: 15.5px; font-weight: 700; margin-bottom: 8px; }
.sind-pg-sup p { font-size: 13.5px; color: var(--mut); }
.sind-pg-sup--blue { background: var(--blue); color: #fff; }
.sind-pg-sup--blue h4 { color: #fff; }
.sind-pg-sup--blue p { color: #e6f6fc; }
.sind-pg-sup__btn { background: #fff; color: var(--blue-dark); margin-top: 16px; }
.sind-pg-sup__btn:hover { background: var(--ink); color: #fff; }
.sind-pg-plan { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: center; }
.sind-pg-ticks { list-style: none; display: grid; gap: 13px; margin: 26px 0 32px; }
.sind-pg-ticks li { display: flex; gap: 12px; align-items: center; font-weight: 600; font-size: 15.5px; }
.sind-pg-ticks li::before { content: "\2713"; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); font-size: 12px; font-weight: 800; display: grid; place-items: center; }
.sind-pg-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.sind-pg-tile { position: relative; border-radius: 12px; overflow: hidden; min-height: 320px; display: flex; transition: .2s; }
.sind-pg-tile:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.sind-pg-tile > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.sind-pg-tile:hover > img { transform: scale(1.04); }
.sind-pg-tile .ov { position: relative; margin-top: auto; width: 100%; padding: 44px 20px 20px; background: linear-gradient(transparent, rgba(15, 15, 15, .88)); color: #fff; }
.sind-pg-tile .ov h4 { color: #fff; font-size: 15.5px; }
.sind-pg-tile .ov p { font-size: 13px; color: #cfd8e0; margin-top: 6px; }
.sind-pg-lifecycle { display: grid; grid-template-columns: 1fr 1.2fr; gap: 0; align-items: stretch; }
.sind-pg-lifecycle .sind-pg-sideimg { border-radius: var(--radius) 0 0 var(--radius); overflow: hidden; }
.sind-pg-lifecycle .sind-pg-sideimg img { height: 100%; object-fit: cover; border-radius: 0; border: none; }
.sind-pg-lifecycle .sind-pg-panel { border-radius: 0 var(--radius) var(--radius) 0; }
.sind-pg-cards4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 42px; }
.sind-pg-svc { background: var(--card); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; transition: .2s; }
a.sind-pg-svc:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); color: inherit; }
.sind-pg-svc > img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.sind-pg-svc .bd { padding: var(--pad-m); display: block; }
.sind-pg-svc h4 { font-size: 15.5px; font-weight: 700; margin-bottom: 8px; }
.sind-pg-svc p { font-size: 13.5px; color: var(--mut); }
@media (max-width: 1000px) {
  .sind-pg-contact, .sind-pg-whyhero, .sind-pg-split, .sind-pg-faqtop, .sind-pg-faqmid, .sind-pg-plan, .sind-pg-lifecycle { grid-template-columns: 1fr; }
  .sind-pg-stats { grid-template-columns: repeat(2, 1fr); }
  .sind-pg-steps4, .sind-pg-tiles, .sind-pg-cards4 { grid-template-columns: repeat(2, 1fr); }
  .sind-pg-faqmid .sind-pg-quotecard, .sind-pg-faqmid .sind-pg-panel,
  .sind-pg-lifecycle .sind-pg-sideimg, .sind-pg-lifecycle .sind-pg-panel { border-radius: var(--radius); }
  .sind-pg-lifecycle { gap: 18px; }
  .sind-pg-lifecycle .sind-pg-sideimg img { border-radius: var(--radius); }
}
@media (max-width: 640px) {
  .sind-pg-formcard, .sind-pg-panel { padding: 26px 20px; }
  .sind-pg-feature-grid, .sind-pg-steps4, .sind-pg-tiles, .sind-pg-cards4, .sind-pg-stats { grid-template-columns: 1fr; }
  .sind-pg-scrollrow img { flex-basis: 88%; width: 88%; }
  .sind-pg-tile { min-height: 260px; }
}

/* ------------------------------------------------------------
   Phase C batch 2 — solutions / our-process / clients / history
   ---------------------------------------------------------- */
.sind-pg-counters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sind-pg-counter { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--pad-l); }
.sind-pg-counters--5 { grid-template-columns: repeat(5, 1fr); }
.sind-pg-counters--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1180px) { .sind-pg-counters--5 { grid-template-columns: repeat(3, 1fr); } }
.sind-pg-counter .v { font-size: 40px; font-weight: 800; letter-spacing: -.02em; color: var(--blue); }
.sind-pg-counter .k { font-weight: 700; margin-top: 10px; font-size: 15.5px; }
.sind-pg-counter .s { font-size: 13.5px; color: var(--mut); margin-top: 8px; line-height: 1.55; }

.sind-pg-flow { background: var(--ink); color: #fff; }
.sind-pg-flow .wrap { max-width: none; padding: 0; }
.sind-pg-flowgrid { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 max(32px, calc((100vw - 1180px) / 2 + 32px)) 10px; -webkit-overflow-scrolling: touch; }
.sind-pg-flowcard { flex: 0 0 320px; scroll-snap-align: start; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--radius); padding: var(--pad-m); }
.sind-pg-flowcard .k { font-size: 12.5px; font-weight: 800; color: #7fd4f5; text-transform: uppercase; letter-spacing: .1em; }
.sind-pg-flowcard h4 { color: #fff; font-size: 17px; margin: 12px 0 10px; }
.sind-pg-flowcard p { font-size: 14px; color: #c9d3dc; line-height: 1.6; }

.sind-pg-cols3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: start; }

.sind-pg-timeline { max-width: 820px; margin: 0 auto; }
.sind-pg-tlgroup { position: relative; padding-left: 96px; }
.sind-pg-tlgroup + .sind-pg-tlgroup { margin-top: 48px; }
.sind-pg-tlgroup::before { content: ""; position: absolute; left: 32px; top: 72px; bottom: -48px; width: 2px; background: var(--line); }
.sind-pg-tlgroup:last-child::before { display: none; }
.sind-pg-tlyear { position: absolute; left: 0; top: 0; width: 64px; height: 64px; border-radius: 50%; background: var(--ink); color: #fff; font-weight: 800; font-size: 15px; display: grid; place-items: center; letter-spacing: .02em; }
.sind-pg-tlitems { display: grid; gap: 16px; }
.sind-pg-tlitem { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: var(--pad-m); }
.sind-pg-tlitem .sup { display: block; font-size: 12px; font-weight: 800; color: var(--blue); text-transform: uppercase; letter-spacing: .1em; }
.sind-pg-tlitem h4 { font-size: 16.5px; font-weight: 700; margin: 8px 0; }
.sind-pg-tlitem .sup + h4 { margin-top: 8px; }
.sind-pg-tlitem p { font-size: 14.5px; color: var(--mut); line-height: 1.6; }

.sind-pg-minis { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 30px; }
.sind-pg-mini { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: var(--pad-m); display: flex; align-items: center; gap: 16px; }
.sind-pg-mini span { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); font-weight: 800; font-size: 14px; display: grid; place-items: center; }
.sind-pg-mini h4 { font-size: 15.5px; font-weight: 700; }

@media (max-width: 1000px) {
  .sind-pg-counters { grid-template-columns: repeat(2, 1fr); }
  .sind-pg-cols3 { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .sind-pg-counters, .sind-pg-minis { grid-template-columns: 1fr; }
  .sind-pg-tlgroup { padding-left: 76px; }
  .sind-pg-tlgroup::before { left: 24px; top: 60px; }
  .sind-pg-tlyear { width: 48px; height: 48px; font-size: 13px; }
}

/* ============================================================
   Inner pages — Phase C batch 3 (about-us / distributor / spare-parts)
   ============================================================ */
.sind-pg-hero__cta { margin-top: 28px; }
.sind-pg-herostats { display: flex; gap: 14px 34px; flex-wrap: wrap; margin-top: 28px; }
.sind-pg-herostats span { font-size: 13.5px; color: #c9d3dc; padding-left: 14px; border-left: 2px solid var(--blue); }
.sind-pg-herostats strong { color: #fff; }
.sind-pg-brandcard { background: var(--card); border-radius: var(--radius); padding: var(--pad-l); max-width: 780px; margin: 0 auto; }
.sind-pg-cap { display: grid; gap: 22px; margin-top: 30px; }
.sind-pg-cap__item { display: flex; gap: 18px; }
.sind-pg-cap__item .n { flex: none; font-size: 13px; font-weight: 800; color: var(--blue); letter-spacing: .12em; padding-top: 2px; }
.sind-pg-cap__item h4 { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.sind-pg-cap__item p { font-size: 14px; color: var(--mut); }
@media (max-width: 640px) {
  .sind-pg-brandcard { padding: 30px 22px; }
  .sind-pg-herostats { gap: 12px 20px; }
}

/* === Unified sub-page header (2026-10-03) ===================================
   No hero band: eyebrow + H1 + sub render as a compact content header on the
   page background. Applies to every header rendered by sind_render_hero(). */
.sind-pg-hero{
  padding:36px 0 4px;
}
.sind-pg-hero > .wrap{ width:100%; }
.sind-pg-hero .sind-eyebrow{ display:inline-block; color:var(--blue); font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.sind-pg-hero h1{ font-size:clamp(28px,3vw,38px); font-weight:800; line-height:1.2; letter-spacing:-.015em; margin:12px 0 0; max-width:900px; color:var(--ink); }
.sind-pg-hero__sub{ margin-top:12px; max-width:640px; color:var(--mut); font-size:17px; line-height:1.6; }
@media (max-width:640px){
  .sind-pg-hero{ padding:28px 0 0; }
  .sind-pg-hero h1{ font-size:26px; }
  .sind-pg-hero__sub{ font-size:16px; }
}

/* ============================================================
   r5 audit — mobile overflow fixes (formulas, form columns)
   ============================================================ */
/* Long energy formulas / code must wrap instead of widening the page. */
.sind-product code, .entry-content code, .sind-pg code, .sind-case code {
  white-space: pre-wrap; word-break: break-word;
}
/* Card / sidebar columns must be allowed to shrink inside their grid. */
.sind-pg-formcard, .sind-pg-aside { min-width: 0; max-width: 100%; }
@media (max-width: 640px) {
  /* Mobile gutters come from .wrap alone; the page-level rules above must not
     zero them out with the padding shorthand. */
  .wrap { padding-left: 20px; padding-right: 20px; }
  /* Contact: keep form text and inputs >=16px from the card/frame edges. */
  .sind-pg-formcard { padding: 20px 16px; }
  .sind-pg-formcard .wpcf7 { padding: 16px; }
}

/* Related case studies on product pages (single-product.php) */
.sind-pdp-cases { max-width: 1180px; margin: 44px auto 0; padding: 0 32px; }
.sind-pdp-cases-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.sind-pdp-cases-all { font-size: 14px; font-weight: 600; color: var(--blue); text-decoration: none; white-space: nowrap; }
.sind-pdp-cases-all:hover { color: var(--blue-dark); }
.sind-case-mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 24px; }
.sind-case-mini { display: block; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--pad-m); text-decoration: none; box-shadow: var(--shadow-md); transition: transform .15s ease, box-shadow .15s ease; }
.sind-case-mini:hover { transform: translateY(-2px); box-shadow: 0 18px 44px rgba(27,35,44,.12); }
.sind-case-mini__cat { display: block; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); margin-bottom: 6px; }
.sind-case-mini h3 { font-size: 15px; color: var(--ink); margin: 0 0 12px; line-height: 1.4; }
.sind-case-mini__meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sind-case-mini__year { font-size: 12px; color: var(--mut); font-weight: 600; }
.sind-case-mini__more { font-size: 13px; font-weight: 700; color: var(--blue); }
.sind-case-mini-viewall-mobile { display: none; }
@media (max-width: 991px) { .sind-case-mini-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
  .sind-case-mini-grid { grid-template-columns: 1fr; }
  .sind-pdp-cases-head { flex-direction: column; align-items: flex-start; }
  .sind-case-mini-viewall { display: none; }
  .sind-case-mini-viewall-mobile { display: flex; width: 100%; margin-top: 20px; }
}
/* Homepage insights — deep brand-blue editorial panel. It sits directly above
   the closing .sind-cta-band, which is pale (--blue-soft), so the panel carries
   the saturated tone: the two blocks read as distinct, not as repeats. */
.sind-insights__panel {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 56px;
  align-items: center;
  padding: 44px 48px;
  border: 1px solid transparent;
  border-radius: 20px;
  background: linear-gradient(150deg, #00a0dd 0%, #0079aa 100%);
  box-shadow: 0 18px 44px rgba(0, 121, 170, .28);
}
.sind-insights .sind-eyebrow { color: #c8ecfa; }
.sind-insights__intro h2 { margin: 12px 0 0; color: #fff; }
.sind-insights__intro h2 span { white-space: nowrap; color: #c8ecfa; }
.sind-insights__intro p { margin: 14px 0 26px; font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, .88); max-width: 42ch; }
.sind-insights__list { display: flex; flex-direction: column; }
.sind-insight-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
  border-top: 1px solid rgba(255, 255, 255, .24);
  text-decoration: none;
}
.sind-insight-note:last-child { border-bottom: 1px solid rgba(255, 255, 255, .24); }
.sind-insight-note__body { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.sind-insight-note__cat {
  align-self: flex-start;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .18);
  color: #fff;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.sind-insight-note__title { font-size: 17px; font-weight: 700; line-height: 1.4; color: #fff; transition: color .18s ease; }
.sind-insight-note__arrow { flex: 0 0 auto; font-size: 18px; font-weight: 700; color: #c8ecfa; transition: transform .18s ease; }
.sind-insight-note:hover .sind-insight-note__title { color: #c8ecfa; }
.sind-insight-note:hover .sind-insight-note__arrow { transform: translateX(5px); }
/* Primary buttons are dark ink, which disappears on this panel — invert it here. */
.sind-insights .sind-insights__viewall { background: #fff; color: var(--blue-dark); }
.sind-insights .sind-insights__viewall:hover { background: #eaf7fd; color: var(--blue-dark); }
@media (max-width: 1000px) {
  .sind-insights__panel { grid-template-columns: 1fr; gap: 24px; padding: 32px 24px; }
  .sind-insights__intro p { margin-bottom: 20px; }
  .sind-insights__viewall { width: 100%; justify-content: center; }
  .sind-insight-note__title { font-size: 16px; }
}
.sind-calc-teaser {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: var(--pad-l);
}
.sind-calc-teaser h2 { margin: 8px 0 10px; }
.sind-calc-teaser p { color: var(--mut); max-width: 620px; }
@media (max-width: 640px) { .sind-calc-teaser { padding: 26px 22px; gap: 20px; } }

/* Collapsible homepage calculator: the teaser card is the <summary>. */
.sind-calc-embed > summary { list-style: none; cursor: pointer; user-select: none; }
.sind-calc-embed > summary::-webkit-details-marker { display: none; }
.sind-calc-embed > summary::marker { content: ""; }
.sind-calc-embed > summary:hover { border-color: var(--blue); }
.sind-calc-embed__cta { flex: none; }
.sind-calc-embed__close { display: none; }
.sind-calc-embed[open] .sind-calc-embed__open { display: none; }
.sind-calc-embed[open] .sind-calc-embed__close { display: inline; }
.sind-calc-embed__panel { margin-top: 24px; }

/* Technical advisor block on product pages: brand figure + guidance, no CTA. */
.sind-advisor { display: flex; gap: 32px; align-items: center; margin: 56px 0; padding: 32px; background: #fff; border: 1px solid #e5e9ef; border-radius: 12px; }
.sind-advisor__media { flex: 0 0 260px; }
.sind-advisor__img { width: 100%; height: auto; display: block; }
.sind-advisor__title { margin: 0 0 8px; font-size: 24px; }
.sind-advisor__text { margin: 0 0 16px; color: #4a5560; line-height: 1.7; }
.sind-advisor__notes-title { margin: 0 0 10px; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--blue); }
.sind-advisor__notes ul { margin: 0; padding-left: 20px; color: #4a5560; line-height: 1.8; }
@media (max-width: 768px) {
	.sind-advisor { flex-direction: column; text-align: center; padding: 24px; }
	.sind-advisor__media { flex: 0 0 auto; width: 180px; margin: 0 auto; }
	.sind-advisor__notes ul { text-align: left; }
}

/* ============================================================
   Language switcher (Polylang) — compact globe pill in the header.
   ============================================================ */
.sind-lang { position: relative; flex: 0 0 auto; }
.sind-lang__btn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 38px; padding: 0 12px;
  border: 1px solid var(--line); border-radius: 999px;
  background: #fff; color: var(--mut);
  font: inherit; font-size: 13px; font-weight: 700; letter-spacing: .02em;
  cursor: pointer; transition: .15s;
}
.sind-lang__btn:hover { color: var(--ink); border-color: #d8d3ca; }
.sind-lang__btn:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.sind-lang__btn svg { width: 16px; height: 16px; flex: none; }
.sind-lang__menu {
  position: absolute; top: calc(100% + 8px); right: 0;
  min-width: 172px; margin: 0; padding: 8px;
  list-style: none; background: #fff;
  border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 16px 38px rgba(23, 32, 46, .14);
  z-index: 70;
}
.sind-lang__menu[hidden] { display: none; }
.sind-lang__menu li { padding: 0; }
.sind-lang__menu a {
  display: block; padding: 9px 12px; border-radius: 9px;
  font-size: 14.5px; font-weight: 600; color: var(--mut); white-space: nowrap;
}
.sind-lang__menu a:hover,
.sind-lang__menu a:focus { background: var(--blue-soft); color: var(--blue-dark); outline: none; }
.sind-lang__menu li[aria-selected="true"] a { color: var(--blue-dark); font-weight: 700; }
@media (max-width: 1000px) { .sind-hd.is-searching .sind-lang { display: none; } }
@media (max-width: 560px) {
  .sind-lang__btn { padding: 0 10px; }
  .sind-lang__code { display: none; }
}

/* B4: label English-only content that is shown on a translated page
   (homepage case/insight blocks and the two nav entries). */
.sind-en-note {
  display: inline-block; margin: 10px 0 0; padding: 3px 10px;
  border-radius: 999px; background: #eef7fc; border: 1px solid #cfe6f3;
  color: #0b6fa4; font-size: 12px; font-weight: 600; letter-spacing: .02em;
}
.sind-en-note--dark {
  background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3);
  color: #d6ecf8;
}
.sind-nav-en {
  display: inline-block; margin-left: 6px; padding: 0 5px;
  border: 1px solid currentColor; border-radius: 999px;
  font-size: 10px; font-weight: 700; letter-spacing: .06em;
  vertical-align: middle; opacity: .7;
}