:root {
  --ink: #1f2f3d;
  --ink-soft: #4f6474;
  --paper: #f7f6f2;
  --white: #ffffff;
  --line: #d9e0e2;
  --blue: #6f91a8;
  --blue-dark: #25465d;
  --mint: #9ba99b;
  --sand: #c6a77f;
  --violet: #9a8caf;
  --shadow: 0 14px 34px rgba(31,47,61,.08);
  --radius: 18px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: "Montserrat", Arial, sans-serif;
  background: var(--paper);
  color: var(--ink);
  line-height: 1.6;
}

img { max-width: 100%; display: block; }

a { color: inherit; text-decoration: none; }

.container {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(247,246,242,.94);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(31,47,61,.08);
}

.header-inner {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
}

.brand-logo {
  width: 220px;
  height: 54px;
  object-fit: contain;
  object-position: left center;
}

.nav {
  display: flex;
  align-items: center;
  gap: 25px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
}

.nav a:hover { color: var(--blue); }

.menu-button {
  display: none;
  background: none;
  border: 1px solid var(--line);
  padding: 10px 12px;
  border-radius: 10px;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 14px 20px;
  border: 1px solid var(--blue-dark);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  transition: .2s ease;
}

.button:hover { transform: translateY(-2px); }

.button-primary {
  background: var(--blue-dark);
  color: white;
}

.button-light {
  background: white;
  color: var(--blue-dark);
}

.eyebrow {
  margin: 0 0 10px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

h1, h2, h3, p { margin-top: 0; }

h1 {
  font-size: clamp(42px, 6vw, 74px);
  line-height: 1.04;
  letter-spacing: -.04em;
}

h2 {
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.15;
  letter-spacing: -.025em;
}

h3 {
  font-size: 15px;
  line-height: 1.3;
}

.lead {
  font-size: 15px;
  color: var(--ink-soft);
  max-width: 680px;
}

.section {
  padding: 84px 0;
}

.section-tight {
  padding: 56px 0;
}

.hero {
  min-height: 610px;
  display: grid;
  align-items: center;
  background-size: cover;
  background-position: center;
}

.hero-overlay {
  min-height: inherit;
  display: grid;
  align-items: center;
  background: linear-gradient(
    90deg,
    rgba(247,246,242,.98) 0%,
    rgba(247,246,242,.92) 38%,
    rgba(247,246,242,.42) 65%,
    rgba(247,246,242,.04) 100%
  );
}

.hero-content { max-width: 650px; }

.hero-subtitle {
  margin: 0 0 22px;
  font-size: clamp(22px, 3vw, 34px);
  color: var(--blue);
  font-weight: 400;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.section-heading {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 60px;
  align-items: end;
  margin-bottom: 34px;
}

.grid-4, .grid-3, .grid-2, .tech-grid {
  display: grid;
  gap: 18px;
}

.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.tech-grid { grid-template-columns: repeat(3, 1fr); }

.goal-card, .service-card, .article-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.goal-card img,
.service-card img,
.article-card img {
  width: 100%;
  height: 210px;
  object-fit: cover;
}

.goal-card-body,
.service-card-body,
.article-card-body {
  padding: 22px;
}

.goal-card p,
.service-card p,
.article-card p {
  font-size: 12px;
  color: var(--ink-soft);
  margin-bottom: 0;
}

.goal-link {
  display: inline-flex;
  margin-top: 18px;
  color: var(--blue-dark);
  font-size: 11px;
  font-weight: 700;
}

.system-section {
  background: var(--ink);
  color: white;
}

.system-section .eyebrow { color: #9dc0d5; }

.system-section .lead { color: #c8d2d8; }

.system-steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
  margin-top: 42px;
}

.system-step { text-align: center; }

.hex {
  width: 66px;
  height: 72px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  border: 1px solid #8ba7b8;
  clip-path: polygon(25% 2%,75% 2%,100% 50%,75% 98%,25% 98%,0 50%);
  font-size: 13px;
  color: #dceaf1;
}

.system-step:nth-child(2) .hex { border-color: #aab8a1; color: #c5d1bd; }
.system-step:nth-child(3) .hex { border-color: #d0aa7c; color: #ebcda8; }
.system-step:nth-child(4) .hex { border-color: #b89098; color: #d8b9c0; }
.system-step:nth-child(5) .hex { border-color: #b5a6c6; color: #d7cce3; }

.system-step h3 {
  margin-bottom: 7px;
  font-size: 11px;
  letter-spacing: .04em;
}

.system-step p {
  font-size: 10px;
  color: #bac8cf;
  margin: 0;
}

.tech-card {
  background: white;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}

.tech-card img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.tech-card-body { padding: 18px; }

.tech-card h3 { margin-bottom: 8px; }

.tech-card p {
  margin: 0;
  font-size: 11px;
  color: var(--ink-soft);
}

.page-hero {
  padding: 100px 0 78px;
  background: linear-gradient(135deg, #edf0ee, #f7f6f2);
}

.page-hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

.page-hero-image {
  border-radius: 24px;
  min-height: 420px;
  background-size: cover;
  background-position: center;
  box-shadow: var(--shadow);
}

.prose {
  max-width: 800px;
}

.prose p,
.prose li {
  color: var(--ink-soft);
  font-size: 14px;
}

.prose ul { padding-left: 22px; }

.note {
  padding: 22px;
  background: #eef2f2;
  border-left: 4px solid var(--blue);
  border-radius: 0 12px 12px 0;
  color: var(--ink-soft);
  font-size: 13px;
}

.cta-panel {
  padding: 48px;
  border-radius: 22px;
  background: linear-gradient(135deg, var(--ink), #304e63);
  color: white;
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: center;
}

.cta-panel h2 { margin-bottom: 10px; }

.cta-panel p { margin: 0; color: #cbd8df; }

.faq {
  display: grid;
  gap: 12px;
}

details {
  background: white;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px 20px;
}

summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
}

details p {
  margin: 15px 0 0;
  font-size: 13px;
  color: var(--ink-soft);
}

.footer {
  padding: 54px 0;
  background: #152b3b;
  color: #d7e1e6;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 40px;
}

.footer p, .footer a {
  font-size: 11px;
  color: #c2d0d7;
}

.footer-title {
  color: white;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 10px;
}

.small {
  font-size: 11px;
  color: var(--ink-soft);
}

@media (max-width: 900px) {
  .nav {
    display: none;
    position: absolute;
    left: 20px;
    right: 20px;
    top: 74px;
    padding: 18px;
    background: white;
    border: 1px solid var(--line);
    border-radius: 14px;
    flex-direction: column;
    align-items: stretch;
  }

  .nav.open { display: flex; }
  .menu-button { display: inline-flex; }

  .section-heading,
  .page-hero-grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3, .tech-grid { grid-template-columns: repeat(2, 1fr); }
  .system-steps { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .container { width: min(100% - 28px, 1180px); }
  .header-inner { min-height: 70px; }
  .brand-logo { width: 175px; height: 42px; }
  .section { padding: 60px 0; }
  .hero { min-height: 620px; }
  .hero-overlay {
    background: linear-gradient(
      180deg,
      rgba(247,246,242,.96),
      rgba(247,246,242,.82),
      rgba(247,246,242,.36)
    );
  }
  .grid-4, .grid-3, .grid-2, .tech-grid { grid-template-columns: 1fr; }
  .system-steps { grid-template-columns: 1fr; }
  .cta-panel { padding: 30px; flex-direction: column; align-items: flex-start; }
  .footer-grid { grid-template-columns: 1fr; }
}

/* HOME V2 */
.hero-carousel{position:relative;height:407px;overflow:hidden;background:#e9eeef}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .65s ease;background-size:cover;background-position:center}
.hero-slide.is-active{opacity:1;visibility:visible}
.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,246,242,.96),rgba(247,246,242,.78) 37%,rgba(247,246,242,.20) 70%,rgba(247,246,242,.04))}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-carousel .hero-content{position:relative;z-index:2;padding-top:10px}
.hero-carousel .hero-content h1{font-size:clamp(38px,5vw,62px);margin-bottom:8px}
.hero-carousel .hero-subtitle{font-size:clamp(20px,2.5vw,30px);margin-bottom:12px}
.hero-carousel .lead{font-size:13px;max-width:560px}
.carousel-controls{position:absolute;z-index:5;left:50%;bottom:18px;transform:translateX(-50%);display:flex;gap:7px}
.carousel-dot{width:7px;height:7px;border:0;border-radius:50%;background:rgba(31,47,61,.32);cursor:pointer}.carousel-dot.is-active{width:24px;border-radius:8px;background:var(--blue-dark)}
.carousel-arrow{position:absolute;z-index:6;top:50%;transform:translateY(-50%);width:38px;height:38px;border:1px solid rgba(31,47,61,.22);border-radius:50%;background:rgba(255,255,255,.78);cursor:pointer}.carousel-arrow.prev{left:18px}.carousel-arrow.next{right:18px}
.tile-carousel{overflow:hidden}.tile-track{display:flex;gap:18px;transition:transform .45s ease}.tile-item{flex:0 0 calc((100% - 54px)/4)}.tile-item .goal-card{height:100%}.tile-carousel-control{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.tile-page{font-size:11px;color:var(--ink-soft)}.tile-arrows{display:flex;gap:8px}.tile-arrow{width:38px;height:38px;border:1px solid var(--line);background:white;border-radius:50%;cursor:pointer}.tile-arrow:disabled{opacity:.35;cursor:default}
.reviews-section{background:#eef1f1}.review-card{background:white;border:1px solid var(--line);border-radius:16px;padding:25px;min-height:210px}.review-source{display:inline-flex;margin-bottom:12px;font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--blue-dark)}.review-stars{letter-spacing:.12em;margin-bottom:14px;font-size:13px}.review-card blockquote{margin:0 0 18px;font-size:15px;line-height:1.55}.review-author,.rating-meta{font-size:11px;color:var(--ink-soft)}.rating-number{font-size:32px;font-weight:600;line-height:1;margin-bottom:7px}.booksy-panel{margin-top:25px;background:white;border:1px solid var(--line);border-radius:18px;padding:28px}.booksy-placeholder{padding:25px;border:1px dashed #aab6bd;border-radius:12px;background:#f7f8f8;color:var(--ink-soft);font-size:12px}
@media(max-width:900px){.hero-carousel{height:440px}.tile-item{flex-basis:calc((100% - 18px)/2)}}
@media(max-width:560px){.hero-carousel{height:570px}.hero-slide::after{background:linear-gradient(180deg,rgba(247,246,242,.95),rgba(247,246,242,.60),rgba(247,246,242,.20))}.tile-item{flex-basis:100%}}


/* SEO + accessibility enhancements */
.skip-link {
  position: fixed;
  left: 1rem;
  top: -5rem;
  z-index: 9999;
  padding: .75rem 1rem;
  background: #111;
  color: #fff;
  border-radius: .35rem;
  text-decoration: none;
}
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.seo-intro { padding-top: 3rem; padding-bottom: 1rem; }
.footer a { text-decoration-thickness: .08em; text-underline-offset: .16em; }
@media (max-width: 700px) { .seo-intro { padding-top: 2rem; } }

.hero-video-slide{background:#182b38}
.hero-video{z-index:0}
.hero-video-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,43,59,.72),rgba(21,43,59,.18));z-index:1}
.hero-video-slide .hero-content{color:#fff}
.hero-video-slide .hero-content .eyebrow,.hero-video-slide .hero-content .lead{color:#fff}

/* HOME V5 — goals immediately below the hero */
.home-goals {
  padding-top: 28px;
  padding-bottom: 54px;
}
.home-goals .tile-carousel {
  width: 100%;
}
.home-goals .goal-card img {
  height: 190px;
}
.home-goals .goal-card-body {
  min-height: 126px;
  padding: 18px;
}
.home-goals .goal-link {
  margin-top: 12px;
}
@media (max-width: 900px) {
  .home-goals { padding-top: 24px; }
  .home-goals .goal-card img { height: 180px; }
}
@media (max-width: 560px) {
  .home-goals { padding-top: 18px; }
  .home-goals .goal-card img { height: 210px; }
}

/* HOME V6 — aligned section width */
.seo-intro .prose {
  max-width: none;
}

.seo-intro .prose p {
  max-width: 980px;
}

/* BOOKSY — official widget */
.booksy-widget {
  min-height: 120px;
}
.brand-logo {
  width: 210px;
  height: 72px;
}
@media (max-width: 560px) {
  .brand-logo {
    width: 165px;
    height: 54px;
  }
}

/* V8 — 16 problemów / cele zdrowotne */
.home-problems{padding-top:34px;padding-bottom:54px}.problem-carousel{width:100%}.problem-viewport{overflow:hidden;width:100%}.problem-track{display:flex;width:100%;gap:0;transition:transform .45s ease;will-change:transform}.problem-page{flex:0 0 100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.problem-tile{min-height:112px;border-radius:18px;overflow:hidden}.problem-tile a{height:100%;min-height:112px;display:flex;align-items:center;gap:14px;padding:22px 24px;text-decoration:none;color:#fff;font-weight:700;letter-spacing:.02em}.problem-number{font-size:12px;opacity:.65;min-width:24px}.problem-tile span:nth-child(1){font-size:18px;line-height:1.15;text-transform:none}.problem-arrow{margin-left:auto;font-size:22px;opacity:.7}.problem-blue{background:#cbdbe6;color:#203444}.problem-navy{background:#24445d}.problem-green{background:#587968}.problem-sage{background:#819b8f}.problem-sand{background:#cdbfa5;color:#243746}.problem-steel{background:#789bb5}.problem-taupe{background:#a99782}.problem-rose{background:#c68176}.problem-brick{background:#b66e68}.problem-teal{background:#5c9b9c}.problem-mauve{background:#ad8ca8}.problem-gold{background:#d7b15e;color:#243746}.problem-indigo{background:#66719a}.problem-carousel .problem-tile{display:block}.tile-carousel-control{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.tile-page{font-size:11px;color:var(--ink-soft)}.tile-arrows{display:flex;gap:8px}.tile-arrow{width:38px;height:38px;border:1px solid var(--line);background:white;border-radius:50%;cursor:pointer}.tile-arrow:disabled{opacity:.35;cursor:default}
@media (max-width: 900px){.problem-page{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 600px){.problem-page{grid-template-columns:1fr}.problem-tile,.problem-tile a{min-height:92px}}


/* HOME V9 — photographic hero and unnumbered problem tiles */
.hero-video-slide .hero-video { object-fit: cover; }
.hero-video-slide .hero-video-overlay { background: linear-gradient(90deg, rgba(21,43,59,.72), rgba(21,43,59,.18)); }
.hero-vald-slide { background-size: 52% auto !important; background-repeat: no-repeat !important; background-position: 88% center !important; background-color: #edf0ef; }
.hero-vald-slide::after { background: linear-gradient(90deg, rgba(247,246,242,.98) 0%, rgba(247,246,242,.92) 40%, rgba(247,246,242,.28) 67%, rgba(247,246,242,.04) 100%); }
@media (max-width: 700px) {
  .hero-vald-slide { background-size: 72% auto !important; background-position: 50% 72% !important; }
  .hero-vald-slide::after { background: linear-gradient(180deg, rgba(247,246,242,.96), rgba(247,246,242,.72) 58%, rgba(247,246,242,.25)); }
}

/* MitoHACKER PROMAX visual */
.rlt-hero-visual { overflow: hidden; }
.rlt-hero-visual img { width:100%; height:100%; object-fit:cover; display:block; }
.technology-product-image { width:100%; max-height:360px; object-fit:cover; border-radius:18px; margin:0 0 22px; display:block; }
.rlt-promax-specs { margin-top:24px; }


/* SYSTEM — four-pillar architecture */
.system-pillar-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.system-pillar {
  min-height: 250px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 26px;
  border-radius: 18px;
  overflow: hidden;
  color: #fff;
  border: 1px solid rgba(31,47,61,.08);
  transition: transform .2s ease, box-shadow .2s ease;
}
.system-pillar:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.system-pillar .pillar-label {
  position: absolute;
  top: 24px;
  left: 26px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .09em;
  opacity: .82;
}
.system-pillar strong {
  display: block;
  font-size: clamp(25px, 2.5vw, 36px);
  line-height: 1;
  letter-spacing: -.03em;
  margin-bottom: 14px;
}
.system-pillar > span:not(.pillar-label):not(.pillar-arrow) {
  max-width: 250px;
  font-size: 12px;
  line-height: 1.5;
  opacity: .94;
}
.system-pillar .pillar-arrow {
  position: absolute;
  right: 24px;
  bottom: 22px;
  font-size: 22px;
  opacity: .75;
}
.pillar-longevity { background: #6f8799; }
.pillar-recovery { background: #52746a; }
.pillar-performance { background: #36556d; }
.pillar-nutrition { background: #a78f73; }

.system-intro {
  background: #fff;
}
.system-pillar-detail {
  background: var(--paper);
}
.system-pillar-detail-alt {
  background: #eef1ef;
}
.system-detail-grid {
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  gap: 80px;
  align-items: start;
}
.system-detail-grid > div:first-child {
  position: sticky;
  top: 112px;
}
.system-detail-grid .hero-subtitle {
  margin-top: 18px;
}
.system-detail-grid .prose {
  max-width: 760px;
}
.system-detail-grid ul {
  padding-left: 20px;
}
.system-statement {
  margin: 28px 0;
  font-size: 17px;
  line-height: 1.5;
  color: var(--ink);
}
.system-connection {
  background: #fff;
}
.system-flow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 42px 0;
  flex-wrap: wrap;
}
.system-flow span {
  padding: 15px 20px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
}
.system-flow i {
  font-style: normal;
  color: var(--blue);
  font-size: 20px;
}
.system-process {
  background: var(--paper);
}

@media (max-width: 1000px) {
  .system-pillar-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .system-detail-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .system-detail-grid > div:first-child {
    position: static;
  }
}
@media (max-width: 600px) {
  .system-pillar-grid {
    grid-template-columns: 1fr;
  }
  .system-pillar {
    min-height: 210px;
  }
  .system-flow {
    justify-content: flex-start;
    gap: 10px;
  }
  .system-flow i {
    display: none;
  }
}


/* V18 — stable hero first paint, system pillar typography and mobile problem carousel */
.hero-video-slide { background: #182b38; }
.hero-video-slide .hero-video { background: #182b38; }

.system-pillar strong {
  font-size: clamp(24px, 2.15vw, 34px);
  letter-spacing: -.035em;
  white-space: nowrap;
}

@media (max-width: 1180px) {
  .system-pillar strong {
    font-size: clamp(22px, 2.05vw, 30px);
  }
}

@media (max-width: 900px) {
  .system-pillar strong {
    font-size: clamp(22px, 4vw, 30px);
  }
}

@media (max-width: 600px) {
  .problem-page {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .problem-tile,
  .problem-tile a {
    min-height: 76px;
  }
  .problem-tile a {
    gap: 8px;
    padding: 12px 13px;
  }
  .problem-tile span:nth-child(1) {
    font-size: 13px;
    line-height: 1.18;
  }
  .problem-arrow {
    font-size: 16px;
  }
  .tile-carousel-control {
    margin-top: 12px;
  }
}

/* V19 — unified typography across all hero slides */
.hero-carousel .hero-content h1,
.hero-carousel .hero-content h2 {
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.06;
  letter-spacing: -0.025em;
}

@media (max-width: 560px) {
  .hero-carousel .hero-content h1,
  .hero-carousel .hero-content h2 {
    font-size: clamp(26px, 7vw, 34px);
  }
}


/* =========================================================
   V20 — COOL SYSTEM / 4 FILARY
   ========================================================= */

.system-pillars,
.pillars-grid,
.system-grid {
    width: 100%;
}

.pillar-title {
    font-size: clamp(28px, 2.15vw, 40px) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.045em !important;
    white-space: nowrap !important;
    overflow: visible;
}

/* Performance ma być dokładnie w tej samej osi pionowej
   i mieścić się w szerokości karty. */
.pillar-title {
    transform: none;
}

/* Wspólna pozycja głównego tytułu w każdym kafelku */
.system-card h3,
.pillar-card h3,
.pillars-grid .card h3,
.system-pillars .card h3 {
    min-height: 1.05em;
    display: flex;
    align-items: center;
}

/* Karty filarów — proporcje z najnowszego projektu */
.system-card,
.pillar-card,
.pillars-grid .card,
.system-pillars .card {
    min-height: 330px;
}

/* Tablet */
@media (max-width: 1100px) {
    .pillar-title {
        font-size: clamp(25px, 3.2vw, 34px) !important;
    }
}

/* Mobile: dwa kafelki obok siebie, kompaktowa typografia */
@media (max-width: 700px) {
    .pillar-title {
        font-size: clamp(20px, 5.8vw, 28px) !important;
        letter-spacing: -0.035em !important;
    }

    .system-card,
    .pillar-card,
    .pillars-grid .card,
    .system-pillars .card {
        min-height: 270px;
    }
}

/* V20 FIX — equal pillar title baseline and PERFORMANCE fit */
.system-pillar {
  min-height: 330px;
  box-sizing: border-box;
}

.system-pillar strong {
  position: absolute;
  left: 26px;
  right: 26px;
  bottom: 94px;
  margin: 0;
  display: block;
  font-size: 30px;
  line-height: 1;
  letter-spacing: -.045em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}

.system-pillar > span:not(.pillar-label):not(.pillar-arrow) {
  position: absolute;
  left: 26px;
  right: 58px;
  bottom: 26px;
  max-width: none;
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
}

@media (max-width: 1180px) {
  .system-pillar strong {
    font-size: 27px;
  }
}

@media (max-width: 1000px) {
  .system-pillar strong {
    font-size: 28px;
  }
}

@media (max-width: 600px) {
  .system-pillar {
    min-height: 210px;
  }
  .system-pillar strong {
    left: 20px;
    right: 20px;
    bottom: 67px;
    font-size: 24px;
  }
  .system-pillar > span:not(.pillar-label):not(.pillar-arrow) {
    left: 20px;
    right: 44px;
    bottom: 18px;
    font-size: 11px;
    line-height: 1.35;
  }
}

/* V22 — granatowy header zgodny z dolnym panelem strony */
.site-header {
  background: #152b3b;
  border-bottom: 1px solid rgba(255,255,255,.12);
  backdrop-filter: none;
}

.site-header .brand-logo {
  filter: brightness(0) invert(1);
}

.site-header .nav a {
  color: #f5f7f8;
}

.site-header .nav a:hover,
.site-header .nav a:focus-visible {
  color: #b9d1df;
}

.site-header .button {
  background: #c6a77f;
  border-color: #c6a77f;
  color: #fff;
}

.site-header .button:hover,
.site-header .button:focus-visible {
  background: #b89468;
  border-color: #b89468;
  color: #fff;
}

.site-header .menu-button {
  color: #fff;
  border-color: rgba(255,255,255,.35);
  background: transparent;
}

@media (max-width: 900px) {
  .site-header .nav {
    background: #152b3b;
    border-color: rgba(255,255,255,.14);
    box-shadow: 0 14px 34px rgba(0,0,0,.18);
  }

  .site-header .nav a {
    color: #f5f7f8;
  }
}


/* =========================================================
   V23 — HEADER / HERO / TANITA
   ========================================================= */

/* V23 — video text contrast; preserve HOME V2 carousel positioning. */
.hero-carousel .hero-content,
.hero-carousel .hero-slide .hero-content {
    position: relative;
    z-index: 3;
}

.hero-carousel .hero-slide .hero-legacy-claim {
    position: relative;
    z-index: 4;
    display: inline-block;
    margin: 0 0 14px 0;
    color: rgba(255,255,255,0.94);
    font-size: clamp(12px, 1vw, 15px);
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    text-shadow: 0 1px 8px rgba(0,0,0,0.45);
}

.hero-carousel .hero-video-overlay {
    pointer-events: none;
}

/* TANITA medical certification badge */
.tech-medical-badge {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin: 20px 0 24px;
    padding: 16px 18px;
    border: 1px solid rgba(24, 43, 58, 0.18);
    border-radius: 14px;
    background: rgba(24, 43, 58, 0.06);
}

.tech-medical-badge strong {
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: #152B3B;
}

.tech-medical-badge span {
    font-size: 15px;
    line-height: 1.45;
    color: #53697A;
    max-width: 820px;
}

.tech-lead-note {
    max-width: 900px;
    margin: 0 0 24px;
    font-size: 16px;
    line-height: 1.65;
    color: #53697A;
}

@media (max-width: 700px) {
    .hero-slide .hero-legacy-claim,
    .hero .hero-legacy-claim {
        font-size: 10px;
        letter-spacing: 0.12em;
        margin-bottom: 10px;
    }

    .tech-medical-badge {
        padding: 14px;
    }

    .tech-medical-badge span {
        font-size: 14px;
    }
}


/* V35 — lighter homepage video overlay */
.hero-video-overlay {
    background: linear-gradient(
        90deg,
        rgba(10, 23, 34, 0.42) 0%,
        rgba(10, 23, 34, 0.28) 45%,
        rgba(10, 23, 34, 0.12) 78%,
        rgba(10, 23, 34, 0.05) 100%
    ) !important;
}

.hero-video-slide .hero-content {
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.28);
}

.hero-video-slide .hero-legacy-claim {
    display: block;
    margin: 0 0 14px;
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(11px, 0.9vw, 14px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.42);
}

@media (max-width: 700px) {
    .hero-video-overlay {
        background: linear-gradient(
            180deg,
            rgba(10, 23, 34, 0.44) 0%,
            rgba(10, 23, 34, 0.30) 52%,
            rgba(10, 23, 34, 0.10) 100%
        ) !important;
    }

    .hero-video-slide .hero-legacy-claim {
        font-size: 10px;
        letter-spacing: 0.11em;
        margin-bottom: 10px;
    }
}

/* V24 HOTFIX — restore hero carousel positioning after V23 contrast rules */
.hero-carousel {
  position: relative;
  overflow: hidden;
}
.hero-carousel .hero-slide {
  position: absolute !important;
  inset: 0 !important;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.hero-carousel .hero-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.hero-carousel .hero-video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}
.hero-carousel .hero-video-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1;
}
.hero-carousel .container {
  position: relative;
  z-index: 2;
}
.hero-carousel .hero-content {
  position: relative;
  z-index: 3;
}


/* V25 — stable 7-second hero carousel layering */
.hero-carousel { position: relative !important; overflow: hidden; }
.hero-carousel .hero-slide { position: absolute !important; inset: 0 !important; width: 100%; height: 100%; opacity: 0; visibility: hidden; }
.hero-carousel .hero-slide.is-active { opacity: 1; visibility: visible; }
.hero-carousel .hero-video { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover; z-index: 0; }
.hero-carousel .hero-video-overlay { position: absolute !important; inset: 0 !important; z-index: 1 !important; pointer-events: none; }
.hero-carousel .hero-slide > .container { position: relative; z-index: 2; height: 100%; }

/* V26 — mobile hero video playback */
.hero-carousel .hero-video {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.hero-carousel .hero-video-slide {
  background: #182b38 !important;
}
@media (max-width: 700px) {
  .hero-carousel .hero-video {
    object-position: center center;
  }
}


/* Location links */
.location-link{color:inherit;text-decoration:none}
.location-link:hover{text-decoration:underline}


/* V28 — homepage slide text contrast, mobile anchor and footer socials */
.home-problems { scroll-margin-top: 110px; }
.hero-carousel .hero-slide:not(.hero-video-slide) .hero-content h2,
.hero-carousel .hero-slide:not(.hero-video-slide) .hero-content h1 { color:#152b3b; text-shadow:0 1px 0 rgba(255,255,255,.35); }
.hero-carousel .hero-slide:not(.hero-video-slide) .hero-content .hero-subtitle { color:#355a72; text-shadow:0 1px 0 rgba(255,255,255,.28); }
.hero-carousel .hero-slide:not(.hero-video-slide) .hero-content .lead { color:#263f50; text-shadow:0 1px 0 rgba(255,255,255,.24); }
.hero-carousel .hero-slide:not(.hero-video-slide) .hero-content .eyebrow { color:#4f7085; }
.hero-carousel .hero-slide:not(.hero-video-slide)::after { background:linear-gradient(90deg,rgba(247,246,242,.985) 0%,rgba(247,246,242,.94) 40%,rgba(247,246,242,.38) 70%,rgba(247,246,242,.08) 100%); }
@media(max-width:700px){
 .hero-carousel .hero-slide:not(.hero-video-slide)::after { background:linear-gradient(180deg,rgba(247,246,242,.985) 0%,rgba(247,246,242,.92) 48%,rgba(247,246,242,.36) 100%); }
 .hero-carousel .hero-slide:not(.hero-video-slide) .hero-content h2,.hero-carousel .hero-slide:not(.hero-video-slide) .hero-content h1 { text-shadow:0 1px 0 rgba(255,255,255,.5); }
}
.footer-social{display:flex;gap:10px;margin-top:18px}.footer-social a{width:34px;height:34px;border:1px solid rgba(255,255,255,.28);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;text-decoration:none!important}.footer-social a:hover{border-color:#fff;transform:translateY(-1px)}.footer-social svg{width:17px;height:17px;display:block;fill:currentColor}.footer-social svg rect,.footer-social svg circle{fill:none}
.knowledge-video-wrap{margin:0 0 36px;border-radius:22px;overflow:hidden;background:#152b3b;box-shadow:var(--shadow)}.knowledge-story-video{display:block;width:100%;height:auto;max-height:680px;object-fit:cover;background:#152b3b}.knowledge-fact-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.knowledge-tip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.knowledge-tip-grid .knowledge-mini{min-height:170px}
@media(max-width:900px){.knowledge-fact-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.knowledge-tip-grid{grid-template-columns:1fr}}
@media(max-width:560px){.knowledge-fact-grid-4{grid-template-columns:1fr 1fr}.knowledge-tip-grid .knowledge-mini{min-height:0}}
/* V28 — transparent CryoSpace/JBG-2 logo presentation */
.technology-brand-head img.cryospace-logo-transparent{background:transparent!important}


/* V29 — mobile-first partner carousel, consistent logos, social sizing and knowledge layout */
.partners-track{width:100%;}
.partner-card{min-width:0;background:transparent;border-color:transparent;}
.partner-card img{width:82%;height:96px;object-fit:contain;object-position:center;filter:none;}
.footer-social{align-items:center;}
.footer-social a{flex:0 0 34px;}
.footer-social svg{width:17px;height:17px;}
.knowledge-intro-grid{grid-template-columns:1fr;gap:28px;}
.knowledge-feature{width:100%;}
.knowledge-side{grid-template-columns:repeat(3,minmax(0,1fr));}
.knowledge-article-head{grid-template-columns:1fr;align-items:start;max-width:980px;}
.knowledge-article-head>div:first-child,.knowledge-article-head>p{max-width:900px;}
.knowledge-video-wrap{width:min(100%,980px);margin-left:auto;margin-right:auto;}
@media(max-width:900px){
  .knowledge-side{grid-template-columns:1fr 1fr;}
  .partner-card img{height:88px;width:84%;}
}
@media(max-width:560px){
  .footer-social{gap:8px;margin-top:14px;}
  .footer-social a{flex-basis:30px;width:30px;height:30px;}
  .footer-social svg{width:15px;height:15px;}
  .knowledge-intro-grid{gap:18px;}
  .knowledge-side{grid-template-columns:1fr;}
  .knowledge-feature{padding:28px;}
  .knowledge-article-head{gap:18px;margin-bottom:26px;}
  .knowledge-video-wrap{border-radius:16px;}
  .knowledge-story-video{width:100%;height:auto;}
  .partner-card{height:150px;}
  .partner-card img{height:92px;width:86%;}
}


/* V30 — knowledge hero / footer legal / newsletter / partner logo balance */
.knowledge-hero .container{margin-left:40px;margin-right:40px;width:auto;max-width:none;}
.knowledge-hero .hero-copy{max-width:1100px;}
@media(max-width:560px){.knowledge-hero .container{margin-left:20px;margin-right:20px;width:auto}.knowledge-hero .hero-copy{max-width:none}}

/* Partner visual balance: compensate for transparent whitespace in source logo files. */
.partner-card img{max-width:90%;}
.partner-card:nth-child(4) img{width:92%;height:120px;}
.partner-card:nth-child(5) img{width:92%;height:120px;}
.partner-card:nth-child(6) img{width:auto;height:142px;}
@media(max-width:900px){.partner-card:nth-child(4) img,.partner-card:nth-child(5) img{height:110px}.partner-card:nth-child(6) img{height:126px}}
@media(max-width:560px){.partner-card:nth-child(4) img,.partner-card:nth-child(5) img{height:108px}.partner-card:nth-child(6) img{height:130px}}

.footer-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.18);font-size:11px;color:rgba(255,255,255,.72);align-items:center;}
.footer-meta a{color:rgba(255,255,255,.82);text-decoration:none!important;}
.footer-meta a:hover{text-decoration:underline!important;color:#fff;}
.footer-meta .footer-copy{margin-left:auto;}
.newsletter-panel{background:#eef1f1;border-radius:22px;padding:36px;}
.newsletter-panel h2{margin:0 0 10px;}
.newsletter-panel>p{max-width:760px;color:var(--ink-soft);}
.newsletter-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:end;margin-top:24px;}
.newsletter-field label{display:block;font-size:11px;font-weight:700;margin-bottom:7px;}
.newsletter-field input{width:100%;height:48px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 14px;font:inherit;color:var(--ink);}
.newsletter-consents{grid-column:1/-1;display:grid;gap:9px;margin-top:2px;}
.newsletter-consent{display:flex;gap:9px;align-items:flex-start;font-size:11px;line-height:1.5;color:var(--ink-soft);}
.newsletter-consent input{margin-top:3px;accent-color:var(--blue-dark);}
.newsletter-consent a{text-decoration:underline;text-underline-offset:2px;}
.newsletter-hint{font-size:10px!important;line-height:1.55;color:#71808a!important;margin:12px 0 0!important;}
@media(max-width:700px){.newsletter-form{grid-template-columns:1fr}.newsletter-form .button{width:100%;}.newsletter-panel{padding:26px 22px}.footer-meta .footer-copy{margin-left:0;width:100%;}}

/* V31 — final alignment and mobile polish */
/* Knowledge hero uses the same container grid as the sections below. */
.knowledge-hero .container{
  width:min(1180px, calc(100% - 40px));
  margin-left:auto;
  margin-right:auto;
  max-width:none;
}
.knowledge-hero .hero-copy{max-width:1100px;}

/* Knowledge mini cards: create clearer separation between headline and supporting text. */
.knowledge-mini span{display:block;margin-top:14px;}

/* Partner logos: use the cropped transparent assets and give the three previously undersized marks more visual weight. */
.partner-card img{max-width:90%;object-fit:contain;object-position:center;}
.partner-card:nth-child(4) img{width:92%;height:135px;}
.partner-card:nth-child(5) img{width:92%;height:112px;}
.partner-card:nth-child(6) img{width:auto;height:150px;max-width:82%;}
@media(max-width:900px){
  .partner-card:nth-child(4) img{height:125px;}
  .partner-card:nth-child(5) img{height:105px;}
  .partner-card:nth-child(6) img{height:140px;}
}
@media(max-width:560px){
  .knowledge-hero .container{width:min(100% - 28px, 1180px);margin-left:auto;margin-right:auto;}
  .knowledge-mini span{margin-top:16px;}
  .partner-card:nth-child(4) img{height:125px;max-width:92%;}
  .partner-card:nth-child(5) img{height:105px;max-width:94%;}
  .partner-card:nth-child(6) img{height:140px;max-width:84%;}
}

/* Keep footer legal/meta items safely inside the visual margins. */
.footer-meta{padding-left:20px;padding-right:20px;}
@media(max-width:700px){.footer-meta{padding-left:8px;padding-right:8px;}}


/* V38 — COOLVity Education training hero slide */
.hero-training-slide{
  background:#eaf2f6 url('wide-training-hero.png') center center / cover no-repeat;
  isolation:isolate;
}
.hero-training-slide::after{
  display:none;
}
.hero-training-link{
  position:absolute;
  inset:0;
  z-index:3;
  display:block;
}
.hero-training-cta{
  position:absolute;
  left:clamp(28px,7vw,96px);
  bottom:24px;
  z-index:4;
  pointer-events:none;
  background:#cdb18b;
  color:#fff;
  border-radius:12px;
  padding:14px 24px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  box-shadow:0 8px 22px rgba(21,43,59,.12);
}
@media(max-width:900px){
  .hero-training-slide{background-image:url('mobile-training-hero.png');background-position:center center;background-size:cover;}
  .hero-training-cta{left:24px;bottom:22px;}
}
@media(max-width:560px){
  .hero-training-slide{background-size:cover;background-position:center center;}
  .hero-training-cta{left:18px;bottom:18px;padding:12px 18px;font-size:11px;}
}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}


/* V39 — hero readability, full training slide, knowledge contrast, contact CTA */
.hero-video-slide .hero-content h1,
.hero-video-slide .hero-content h2,
.hero-video-slide .hero-content .hero-subtitle,
.hero-video-slide .hero-content .lead,
.hero-video-slide .hero-content .eyebrow {
  text-shadow: 0 3px 18px rgba(0,0,0,.62), 0 1px 3px rgba(0,0,0,.55);
}
.hero-video-slide .hero-content h1 { font-weight: 800; }

/* Show the complete education artwork without cropping. */
.hero-training-slide {
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: #eaf2f6 !important;
}
.hero-training-cta {
  left: 50% !important;
  bottom: 18px !important;
  transform: translateX(-50%);
}
@media(max-width:900px){
  .hero-training-slide {
    background-size: contain !important;
    background-position: center center !important;
  }
  .hero-training-cta { bottom: 14px !important; }
}
@media(max-width:560px){
  .hero-training-slide { background-size: contain !important; }
  .hero-training-cta { bottom: 10px !important; font-size:10px; padding:10px 14px; }
}

/* The second Knowledge section uses white type on a dark surface for contrast. */
.knowledge-side .knowledge-mini {
  background: #152b3b;
  border-color: rgba(255,255,255,.16);
  color: #fff;
  box-shadow: 0 10px 28px rgba(21,43,59,.10);
}
.knowledge-side .knowledge-mini strong { color:#fff; }
.knowledge-side .knowledge-mini span { color:#e7eef2; }

/* Contact: guide the visitor directly to DLA CIEBIE. */
.contact-direction-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
  color: #152b3b;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(21,43,59,.22);
  padding-bottom: 7px;
  transition: gap .2s ease, border-color .2s ease;
}
.contact-direction-link::after { content: '→'; font-size: 20px; line-height: 1; }
.contact-direction-link:hover { gap: 16px; border-color: rgba(21,43,59,.55); }

/* V40 — anchor alignment for COOL SYSTEM program sections */
.system-pillar-detail{scroll-margin-top:140px;}
@media(max-width:700px){.system-pillar-detail{scroll-margin-top:110px;}}

/* V40 — approved COOL Education training artwork */
.hero-training-slide{background-image:url('wide-training-hero.png') !important;background-size:contain !important;background-position:center center !important;background-repeat:no-repeat !important;background-color:#eaf2f6 !important;}
.hero-training-cta{left:50% !important;transform:translateX(-50%) !important;bottom:18px !important;}
@media(max-width:560px){.hero-training-slide{background-image:url('wide-training-hero.png') !important;background-size:contain !important;background-position:center center !important;}.hero-training-cta{bottom:10px !important;}}

/* V41 — system detail sections: one centered system per viewport */
.system-pillar-detail {
  min-height: calc(100vh - 80px);
  display: flex;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;
}
.system-pillar-detail .container { width: 100%; }
.system-pillar-detail .system-detail-grid { width: 100%; }
@media (max-width: 900px) {
  .system-pillar-detail {
    min-height: calc(100svh - 72px);
    overflow: visible;
  }
}
@media (max-width: 560px) {
  .system-pillar-detail {
    min-height: calc(100svh - 70px);
    padding-top: 54px;
    padding-bottom: 54px;
  }
}

/* V41 — training hero uses the approved artwork at full slide height without a second CTA */
.hero-training-slide {
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}


/* V42 — visual alignment, education card contrast and system viewport centering */
.hero-training-slide {
  background-image: url('wide-training-hero-v42.png') !important;
  background-color: #eaf2f6 !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
}
.hero-training-slide .hero-training-cta {
  left: 28px !important;
  right: auto !important;
  bottom: 22px !important;
  transform: none !important;
  font-family: "Montserrat", Arial, sans-serif !important;
  background: #c6a77f !important;
}
/* The artwork already contains the single CTA; no second HTML CTA should appear. */
.hero-training-slide .hero-training-cta { display: none !important; }

/* Education segment cards: restore dark text on white cards. */
.edu-dark .edu-card { color: var(--ink) !important; }
.edu-dark .edu-card h3,
.edu-dark .edu-card li,
.edu-dark .edu-card p,
.edu-dark .edu-card a { color: inherit; }
.edu-dark .edu-card p { color: var(--ink-soft); }
.edu-dark .edu-card a { color: var(--blue-dark); }

/* Knowledge side cards: high-contrast white typography. */
.knowledge-side .knowledge-mini strong { color: #fff !important; }
.knowledge-side .knowledge-mini span { color: #f4f8fa !important; }

/* System: keep every pillar detail on its own centered viewport without horizontal drift. */
.system-pillar-detail {
  min-height: calc(100vh - 82px);
  height: auto;
  display: flex;
  align-items: center;
  overflow: visible;
  scroll-margin-top: 82px;
}
.system-pillar-detail .container {
  width: min(1180px, calc(100% - 40px));
  max-width: 1180px;
  margin-inline: auto;
}
.system-pillar-detail .system-detail-grid {
  width: 100%;
  max-width: 1180px;
  margin-inline: auto;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  min-width: 0;
  align-items: center;
}
.system-detail-grid > div,
.system-detail-grid .prose,
.system-detail-grid h2,
.system-detail-grid p,
.system-detail-grid ul { min-width: 0; }
.system-detail-grid > div:first-child { position: static; }
@media (max-width: 900px) {
  .system-pillar-detail {
    min-height: calc(100svh - 72px);
    scroll-margin-top: 72px;
  }
  .system-pillar-detail .container { width: min(100% - 32px, 760px); }
  .system-pillar-detail .system-detail-grid { grid-template-columns: minmax(0,1fr); gap: 30px; }
}
@media (max-width: 560px) {
  .system-pillar-detail {
    min-height: calc(100svh - 70px);
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .system-pillar-detail .container { width: calc(100% - 28px); }
}
@media (max-width: 900px) {
  .hero-training-slide { background-image: url('wide-training-hero.png') !important; background-size: cover !important; background-position: center center !important; }
}
@media (max-width: 560px) {
  .hero-training-slide { background-image: url('wide-training-hero.png') !important; background-size: cover !important; background-position: center center !important; }
}


/* V43 — training hero: wide, centered artwork with the same visual rhythm as the video slide. */
.hero-training-slide {
  background-image: url('training-hero-v43.png') !important;
  background-color: #eaf2f6 !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 100% 100% !important;
}
.hero-training-slide .hero-training-link { z-index: 3; }
.hero-training-slide .hero-training-cta {
  display: inline-flex !important;
  position: absolute !important;
  left: clamp(28px, 4.5vw, 72px) !important;
  right: auto !important;
  bottom: 24px !important;
  transform: none !important;
  z-index: 5 !important;
  pointer-events: auto !important;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 14px 28px !important;
  border-radius: 12px;
  background: #23465f !important;
  color: #fff !important;
  font-family: "Montserrat", Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .04em;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(21,43,59,.16);
}
.hero-training-slide .hero-training-cta:hover { background:#152b3b !important; }
@media(max-width:900px){
  .hero-training-slide { background-size: cover !important; background-position:center center !important; }
  .hero-training-slide .hero-training-cta { left:24px !important; bottom:20px !important; }
}
@media(max-width:560px){
  .hero-training-slide { background-image:url('mobile-training-hero.png') !important; background-size:cover !important; background-position:center center !important; }
  .hero-training-slide .hero-training-cta { left:18px !important; bottom:18px !important; min-height:46px; padding:11px 18px !important; font-size:11px !important; }
}

/* V44 — global visual/SEO/mobile polish */
html, body { max-width:100%; overflow-x:clip; }
body { text-rendering:optimizeLegibility; }
.hero-training-slide {
  background-image:url('training-hero-v44.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-color:#eaf2f6 !important;
}
.hero-training-slide .hero-training-cta {
  display:inline-flex !important;
  left:clamp(28px,4.5vw,72px) !important;
  bottom:24px !important;
  transform:none !important;
  background:#25465d !important;
  color:#fff !important;
}
@media(max-width:900px){
  .hero-training-slide { background-image:url('training-hero-v44.webp') !important; background-size:cover !important; background-position:center center !important; }
  .hero-training-slide .hero-training-cta { left:24px !important; bottom:20px !important; }
}
@media(max-width:560px){
  .hero-training-slide { background-image:url('training-hero-v44.webp') !important; background-size:cover !important; background-position:center center !important; }
  .hero-training-slide .hero-training-cta { left:18px !important; bottom:18px !important; min-height:46px; padding:11px 18px !important; font-size:11px !important; }
}

/* One complete system per screen: center when short, grow naturally when content is long. */
.system-pillar-detail {
  min-height:max(680px, calc(100dvh - 82px));
  height:auto;
  padding:clamp(72px,8vh,110px) 0;
  display:flex;
  align-items:center;
  overflow:visible;
  scroll-margin-top:82px;
  position:relative;
}
.system-pillar-detail .container {
  width:min(1180px, calc(100% - 40px));
  margin-inline:auto;
}
.system-pillar-detail .system-detail-grid {
  width:100%;
  max-width:1180px;
  margin-inline:auto;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  align-items:center;
}
.system-pillar-detail-alt { background:#eef1ef; }
@media(max-width:900px){
  .system-pillar-detail { min-height:max(720px, calc(100dvh - 72px)); padding:70px 0; }
  .system-pillar-detail .container { width:min(100% - 32px,760px); }
  .system-pillar-detail .system-detail-grid { grid-template-columns:minmax(0,1fr); gap:32px; }
}
@media(max-width:560px){
  .system-pillar-detail { min-height:max(760px, calc(100dvh - 70px)); padding:64px 0; }
  .system-pillar-detail .container { width:calc(100% - 28px); }
}

/* System: concise, readable sales CTA under the orientation section. */
.system-intro-cta { margin-top:26px; }
.system-intro-cta .button { font-size:11px; }

/* Typography consistency: the design uses Montserrat 400–800. */
button, input, textarea, select { font-family:"Montserrat",Arial,sans-serif; }

/* V45 — final hero slider alignment and contrast */
.hero-video-overlay {
  background: linear-gradient(
    90deg,
    rgba(10,23,34,.30) 0%,
    rgba(10,23,34,.20) 45%,
    rgba(10,23,34,.08) 78%,
    rgba(10,23,34,.03) 100%
  ) !important;
}
.hero-video-slide .hero-content .hero-subtitle {
  color:#7fa7bf !important;
  text-shadow:0 2px 10px rgba(0,0,0,.55) !important;
}
.hero-video-slide .hero-content .eyebrow,
.hero-video-slide .hero-content .lead { color:#fff !important; }

/* Training slide: exactly the same 1810×407 canvas/rhythm as the other desktop slides. */
.hero-training-slide {
  background-image:url('training-hero-v45.webp') !important;
  background-size:100% 100% !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-color:#eaf2f6 !important;
}
.hero-training-slide .hero-training-cta {
  display:inline-flex !important;
  left:clamp(24px,5vw,80px) !important;
  right:auto !important;
  bottom:24px !important;
  transform:none !important;
  z-index:6 !important;
  background:#23465f !important;
  color:#fff !important;
}

/* Education: ensure the white type has a genuinely dark surface. */
.edu-dark {
  background:#152b3b !important;
  color:#fff !important;
}
.edu-dark .edu-intro { color:#dbe7ec !important; }

@media(max-width:900px){
  .hero-training-slide {
    background-image:url('training-hero-v45.webp') !important;
    background-size:100% auto !important;
    background-position:center center !important;
  }
  .hero-training-slide .hero-training-cta {
    left:24px !important;
    bottom:20px !important;
  }
}
@media(max-width:560px){
  /* Keep one consistent wide banner canvas; do not use the broken legacy mobile artwork. */
  .hero-training-slide {
    background-image:url('training-hero-v45.webp') !important;
    background-size:auto 100% !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
  }
  .hero-training-slide .hero-training-cta {
    left:18px !important;
    bottom:18px !important;
    min-height:46px;
    padding:11px 18px !important;
    font-size:11px !important;
  }
  .hero-video-overlay {
    background:linear-gradient(180deg,rgba(10,23,34,.30),rgba(10,23,34,.12)) !important;
  }
}

/* V46 — final consistency pass: training slide, knowledge stack, recovery accuracy */
/* Training uses the same content container and native .button styling as every other hero slide. */
.hero-training-slide {
  background-image:url('training-hero-v45.webp') !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:100% 100% !important;
  background-color:#eaf2f6 !important;
}
.hero-training-slide::after { display:none !important; }
.hero-training-slide .container {
  position:relative;
  z-index:4;
  width:min(1180px, calc(100% - 40px));
  height:100%;
  margin-inline:auto;
  align-items:end !important;
}
.hero-training-actions {
  margin:0 0 24px 0 !important;
  justify-content:flex-start !important;
}
.hero-training-slide .hero-training-cta {
  position:static !important;
  display:inline-flex !important;
  transform:none !important;
  min-height:unset !important;
  padding:14px 20px !important;
  border-radius:8px !important;
  background:var(--blue-dark) !important;
  color:#fff !important;
  font-family:"Montserrat",Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.03em !important;
  line-height:1.2 !important;
  box-shadow:none !important;
  text-decoration:none !important;
}
.hero-training-slide .hero-training-cta:hover { background:#152b3b !important; }
/* The knowledge cards are a vertical reading sequence, not a 3-column strip. */
.knowledge-side {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:14px !important;
}
.knowledge-side .knowledge-mini {
  width:100%;
}
@media(max-width:900px){
  .knowledge-side { grid-template-columns:1fr !important; }
}
@media(max-width:560px){
  .knowledge-side { grid-template-columns:1fr !important; }
  .hero-training-slide {
    background-size:auto 100% !important;
    background-position:center center !important;
  }
  .hero-training-slide .container { width:calc(100% - 28px); }
  .hero-training-actions { margin-bottom:18px !important; }
  .hero-training-slide .hero-training-cta { padding:12px 18px !important; font-size:11px !important; }
}

/* V48 — mobile-first hero consistency and technology room visual */
/* All homepage hero slides share one fixed canvas and one CTA rhythm. */
.hero-carousel{
  height:407px !important;
  overflow:hidden !important;
}
.hero-carousel .hero-slide{
  width:100% !important;
  height:100% !important;
  inset:0 !important;
}
.hero-carousel .hero-slide > .container{
  width:min(1180px, calc(100% - 40px)) !important;
  height:100% !important;
  margin-inline:auto !important;
}

/* Video: retain the image quality, lift the overlay and use the same blue as the photographic slides. */
.hero-video-slide .hero-video-overlay{
  background:linear-gradient(90deg,rgba(10,23,34,.20) 0%,rgba(10,23,34,.12) 48%,rgba(10,23,34,.04) 100%) !important;
}
.hero-video-slide .hero-content .hero-subtitle{
  color:#355a72 !important;
  text-shadow:0 1px 7px rgba(255,255,255,.45) !important;
}

/* Training: identical CTA dimensions and identical lower-left placement. */
.hero-training-slide{
  background-image:url('training-hero-v45.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-color:#eaf2f6 !important;
}
.hero-training-slide .container{
  width:min(1180px, calc(100% - 40px)) !important;
  height:100% !important;
  margin-inline:auto !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:flex-start !important;
}
.hero-training-actions{
  margin:0 0 24px 0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
}
.hero-training-slide .hero-training-cta{
  position:static !important;
  min-height:0 !important;
  padding:14px 20px !important;
  border:1px solid var(--blue-dark) !important;
  border-radius:8px !important;
  font-family:"Montserrat",Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.03em !important;
  line-height:1.2 !important;
  background:var(--blue-dark) !important;
  color:#fff !important;
  box-shadow:none !important;
  transform:none !important;
}

/* Technology hero: use the dedicated treatment-room visual, not the doctor/phone artwork. */
.page-hero-image[style*="technology-hero"]{
  background-image:url('assets/technology-hero-coolvity.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
}

@media(max-width:900px){
  .hero-carousel{height:440px !important;}
  .hero-carousel .hero-slide > .container{width:calc(100% - 32px) !important;}
  .hero-training-slide{background-size:cover !important;background-position:center center !important;}
  .hero-training-actions{margin-bottom:20px !important;}
}

@media(max-width:560px){
  /* Every slide remains the same mobile canvas. Artwork may crop, but no slide becomes wider/taller. */
  .hero-carousel{height:570px !important;}
  .hero-carousel .hero-slide > .container{width:calc(100% - 36px) !important;}
  .hero-training-slide{background-size:cover !important;background-position:center center !important;}
  .hero-training-slide .container{width:calc(100% - 36px) !important;}
  .hero-training-actions{margin:0 0 18px 0 !important;}
  .hero-training-slide .hero-training-cta{
    padding:14px 20px !important;
    font-size:11px !important;
    min-height:0 !important;
  }
  .hero-video-slide .hero-video-overlay{
    background:linear-gradient(180deg,rgba(10,23,34,.18) 0%,rgba(10,23,34,.08) 100%) !important;
  }
}

/* V49 — approved COOL EDUCATION hero + exact CTA rhythm across all slides */
.hero-carousel .hero-training-slide {
  background-image:url('training-hero-v49.webp') !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:100% 100% !important;
  background-color:#eaf2f6 !important;
}
.hero-carousel .hero-training-slide .container {
  position:relative !important;
  height:100% !important;
  width:min(1180px, calc(100% - 40px)) !important;
  margin-inline:auto !important;
  display:flex !important;
  align-items:flex-end !important;
}
.hero-carousel .hero-training-actions {
  position:absolute !important;
  left:0 !important;
  bottom:24px !important;
  margin:0 !important;
  z-index:10 !important;
}
.hero-carousel .hero-training-slide .hero-training-cta {
  position:static !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:140px !important;
  min-height:54px !important;
  padding:14px 20px !important;
  border:0 !important;
  border-radius:8px !important;
  background:var(--blue-dark) !important;
  color:#fff !important;
  font-family:"Montserrat",Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.03em !important;
  line-height:1.2 !important;
  box-shadow:none !important;
  transform:none !important;
}
@media(max-width:900px){
  .hero-carousel .hero-training-slide .container { width:calc(100% - 32px) !important; }
  .hero-carousel .hero-training-actions { bottom:20px !important; }
}
@media(max-width:560px){
  .hero-carousel .hero-training-slide {
    background-image:url('training-hero-v49-mobile.webp') !important;
    background-size:100% 100% !important;
    background-position:center center !important;
  }
  .hero-carousel .hero-training-slide .container { width:calc(100% - 36px) !important; }
  .hero-carousel .hero-training-actions { left:0 !important; bottom:18px !important; }
  .hero-carousel .hero-training-slide .hero-training-cta {
    min-width:140px !important;
    min-height:46px !important;
    padding:12px 18px !important;
    font-size:11px !important;
  }
}

/* V50 — unified homepage hero system
   One geometry for every slide: same canvas, same content gutter and same CTA anchor.
   The training slide is intentionally treated as a normal hero slide, not a separate layout. */
.hero-carousel .hero-slide > .container{
  position:relative !important;
  width:min(1180px, calc(100% - 40px)) !important;
  height:100% !important;
  margin-inline:auto !important;
}
.hero-carousel .hero-slide .hero-content{
  position:relative !important;
  z-index:2 !important;
  width:min(650px, 100%) !important;
  max-width:650px !important;
  padding-top:10px !important;
}
.hero-carousel .hero-slide .hero-actions{
  position:absolute !important;
  left:0 !important;
  bottom:24px !important;
  z-index:4 !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin:0 !important;
}
.hero-carousel .hero-slide .hero-actions .button,
.hero-training-slide .hero-training-cta{
  box-sizing:border-box !important;
  height:55px !important;
  min-height:55px !important;
  padding:14px 20px !important;
  border-radius:8px !important;
  border:1px solid var(--blue-dark) !important;
  font-family:"Montserrat",Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.03em !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}
.hero-carousel .hero-slide .hero-actions .button-primary,
.hero-training-slide .hero-training-cta{
  background:var(--blue-dark) !important;
  color:#fff !important;
}
.hero-carousel .hero-slide .hero-actions .button-light{
  background:#fff !important;
  color:var(--blue-dark) !important;
}
.hero-training-slide{
  background-image:url('training-hero-v49.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
.hero-training-slide::after{display:none !important;}
.hero-training-slide > .container{
  display:block !important;
}
.hero-training-actions{
  position:absolute !important;
  left:0 !important;
  bottom:24px !important;
  margin:0 !important;
}
.hero-training-slide .hero-training-cta{
  position:static !important;
  transform:none !important;
  box-shadow:none !important;
}
@media (max-width:900px){
  .hero-carousel{height:440px !important;}
  .hero-carousel .hero-slide > .container{width:calc(100% - 32px) !important;}
  .hero-carousel .hero-slide .hero-actions{left:0 !important;bottom:20px !important;}
  .hero-training-actions{left:0 !important;bottom:20px !important;}
}
@media (max-width:560px){
  .hero-carousel{height:570px !important;}
  .hero-carousel .hero-slide > .container{width:calc(100% - 36px) !important;}
  .hero-carousel .hero-slide .hero-actions{left:0 !important;bottom:18px !important;gap:10px !important;}
  .hero-training-actions{left:0 !important;bottom:18px !important;}
  .hero-carousel .hero-slide .hero-actions .button,
  .hero-training-slide .hero-training-cta{
    height:48px !important;
    min-height:48px !important;
    padding:12px 18px !important;
    font-size:11px !important;
  }
  .hero-training-slide{background-image:url('training-hero-v49-mobile.webp') !important;background-size:cover !important;background-position:center center !important;}
}


/* V51 — training hero rebuilt with the same HTML typography and CTA geometry as slides 1–3–5. */
.hero-carousel .hero-training-slide{
  background-image:url('training-hero-v51.webp') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
.hero-carousel .hero-training-slide::after{
  display:block !important;
  background:linear-gradient(90deg,rgba(247,246,242,.98) 0%,rgba(247,246,242,.94) 38%,rgba(247,246,242,.42) 66%,rgba(247,246,242,.06) 100%) !important;
}
.hero-carousel .hero-training-slide > .container{
  display:grid !important;
  align-items:center !important;
}
.hero-carousel .hero-training-slide .hero-content{
  width:min(650px,100%) !important;
  max-width:650px !important;
  padding-top:10px !important;
}
.hero-carousel .hero-training-slide .hero-actions{
  position:absolute !important;
  left:0 !important;
  bottom:24px !important;
  margin:0 !important;
}
.hero-carousel .hero-training-slide .hero-training-cta{
  position:static !important;
  height:55px !important;
  min-height:55px !important;
  padding:14px 20px !important;
  border-radius:8px !important;
  font-family:"Montserrat",Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.03em !important;
  line-height:1.2 !important;
}
@media(max-width:560px){
  .hero-carousel .hero-training-slide{background-image:url('training-hero-v51-mobile.webp') !important;background-size:cover !important;background-position:center center !important;}
  .hero-carousel .hero-training-slide::after{background:linear-gradient(180deg,rgba(247,246,242,.97),rgba(247,246,242,.78) 54%,rgba(247,246,242,.24) 100%) !important;}
  .hero-carousel .hero-training-slide .hero-actions{left:0 !important;bottom:18px !important;}
}

/* V52 — homepage hero CTA alignment: move every CTA down ~20px while preserving identical geometry. */
.hero-carousel .hero-slide .hero-actions {
  transform: translateY(20px) !important;
}

/* Keep the adjustment stable on mobile as well. */
@media (max-width: 760px) {
  .hero-carousel .hero-slide .hero-actions {
    transform: translateY(20px) !important;
  }
}

/* V53 — final CTA vertical alignment across the homepage hero slider.
   All five slides use the same bottom anchor so the CTA sits lower without
   changing the hero canvas, typography or artwork. */
.hero-carousel .hero-slide .hero-actions {
  bottom: 4px !important;
}

.hero-carousel .hero-slide .hero-actions .button,
.hero-carousel .hero-training-slide .hero-training-cta {
  box-sizing: border-box !important;
  height: 55px !important;
  min-height: 55px !important;
  font-family: "Montserrat", Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: .03em !important;
}

@media (max-width: 560px) {
  .hero-carousel .hero-slide .hero-actions {
    bottom: 4px !important;
  }
  .hero-carousel .hero-slide .hero-actions .button,
  .hero-carousel .hero-training-slide .hero-training-cta {
    height: 55px !important;
    min-height: 55px !important;
  }
}

/* V55 — CTA always follows the slide copy, with a shared vertical anchor.
   The hero canvas is allowed to be taller so the CTA never covers text. */
.hero-carousel{
  height:470px !important;
  overflow:hidden !important;
}
.hero-carousel .hero-slide > .container{
  height:100% !important;
  display:grid !important;
  align-items:center !important;
}
.hero-carousel .hero-slide .hero-content{
  width:min(650px,100%) !important;
  max-width:650px !important;
  min-height:360px !important;
  height:360px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  box-sizing:border-box !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
.hero-carousel .hero-slide .hero-actions{
  position:static !important;
  left:auto !important;
  bottom:auto !important;
  margin-top:auto !important;
  margin-bottom:0 !important;
  transform:none !important;
  flex:0 0 auto !important;
  z-index:5 !important;
}
.hero-carousel .hero-slide .hero-actions .button,
.hero-carousel .hero-training-slide .hero-training-cta{
  height:55px !important;
  min-height:55px !important;
  box-sizing:border-box !important;
  font-family:"Montserrat",Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.03em !important;
  padding:14px 20px !important;
}
.hero-carousel .hero-training-slide .hero-content{
  min-height:360px !important;
  height:360px !important;
}

@media (max-width:900px){
  .hero-carousel{height:500px !important;}
  .hero-carousel .hero-slide .hero-content{
    min-height:390px !important;
    height:390px !important;
  }
  .hero-carousel .hero-slide > .container{width:calc(100% - 32px) !important;}
}

@media (max-width:560px){
  .hero-carousel{height:640px !important;}
  .hero-carousel .hero-slide > .container{width:calc(100% - 36px) !important;}
  .hero-carousel .hero-slide .hero-content{
    min-height:540px !important;
    height:540px !important;
    max-width:100% !important;
  }
  .hero-carousel .hero-slide .hero-actions{
    margin-top:auto !important;
    width:auto !important;
  }
  .hero-carousel .hero-slide .hero-actions .button,
  .hero-carousel .hero-training-slide .hero-training-cta{
    height:55px !important;
    min-height:55px !important;
    padding:14px 18px !important;
    font-size:11px !important;
  }
}

/* V56 — production fix: hero copy above CTA, no overlap on any slide.
   Use one natural content flow for all slides; never absolutely position CTA. */
.hero-carousel {
  height: 540px !important;
  overflow: hidden !important;
}
.hero-carousel .hero-slide > .container {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}
.hero-carousel .hero-slide .hero-content,
.hero-carousel .hero-training-slide .hero-content {
  width: min(650px, 100%) !important;
  max-width: 650px !important;
  height: auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  box-sizing: border-box !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  transform: translateY(-18px) !important;
}
.hero-carousel .hero-slide .hero-actions,
.hero-carousel .hero-training-slide .hero-actions {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin-top: 28px !important;
  margin-bottom: 0 !important;
  transform: none !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  z-index: 5 !important;
}
.hero-carousel .hero-slide .hero-actions .button,
.hero-carousel .hero-training-slide .hero-training-cta {
  box-sizing: border-box !important;
  width: auto !important;
  height: 55px !important;
  min-height: 55px !important;
  padding: 14px 20px !important;
  border-radius: 8px !important;
  font-family: "Montserrat", Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: .03em !important;
}

@media (max-width: 900px) {
  .hero-carousel { height: 570px !important; }
  .hero-carousel .hero-slide .hero-content,
  .hero-carousel .hero-training-slide .hero-content {
    max-width: 100% !important;
    transform: translateY(-12px) !important;
  }
}

@media (max-width: 560px) {
  .hero-carousel {
    height: 700px !important;
  }
  .hero-carousel .hero-slide > .container {
    width: calc(100% - 36px) !important;
  }
  .hero-carousel .hero-slide .hero-content,
  .hero-carousel .hero-training-slide .hero-content {
    width: 100% !important;
    max-width: 100% !important;
    transform: translateY(-8px) !important;
  }
  .hero-carousel .hero-slide .hero-actions,
  .hero-carousel .hero-training-slide .hero-actions {
    margin-top: 24px !important;
  }
  .hero-carousel .hero-slide .hero-actions .button,
  .hero-carousel .hero-training-slide .hero-training-cta {
    height: 55px !important;
    min-height: 55px !important;
    padding: 14px 18px !important;
    font-size: 11px !important;
  }
}

/* V57 — HP problem tiles: centered labels, expanded palette and consistent links */
.problem-tile a{position:relative;justify-content:center;text-align:center;padding:22px 46px 22px 24px;}
.problem-tile span:nth-child(1){width:100%;text-align:center;}
.problem-arrow{position:absolute;right:20px;top:50%;transform:translateY(-50%);margin-left:0;}
.problem-plum{background:#8068a5}.problem-coral{background:#c87970}.problem-sky{background:#79a7c2}.problem-rust{background:#9b6b5d}
@media(max-width:900px){.problem-tile a{padding:18px 40px 18px 16px}.problem-arrow{right:15px}}
@media(max-width:600px){.problem-tile a{padding:14px 34px 14px 10px}.problem-tile span:nth-child(1){font-size:13px;line-height:1.18}.problem-arrow{right:10px;font-size:15px}}

/* V59 — COOL SYSTEM: client map / mobile-first */
.cool-system-hero .page-hero-image{background-position:center;background-size:cover}
.cool-system-hero h1{letter-spacing:-.035em}
.cool-problem-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.cool-problem-grid a{position:relative;display:flex;flex-direction:column;gap:9px;padding:24px 48px 24px 22px;background:#f3efe9;color:#152b3b;border:1px solid rgba(21,43,59,.08);text-decoration:none;min-height:145px;transition:transform .2s ease,box-shadow .2s ease}
.cool-problem-grid a:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(21,43,59,.08)}
.cool-problem-grid strong{font-size:15px;line-height:1.3;letter-spacing:.01em}.cool-problem-grid span{font-size:13px;line-height:1.55;color:#53616a}.cool-problem-grid i{position:absolute;right:19px;top:50%;transform:translateY(-50%);font-style:normal;font-size:20px}
.cool-process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.cool-process-grid article{padding:25px;background:#f3efe9;min-height:290px}.cool-process-grid article>span{font-weight:800;font-size:12px;letter-spacing:.12em}.cool-process-grid h3{margin:16px 0 2px;font-size:25px;letter-spacing:.02em}.cool-process-grid h4{margin:0 0 16px;font-size:15px}.cool-process-grid p{font-size:13px;line-height:1.65;margin-bottom:18px}.cool-process-grid b{font-size:12px;line-height:1.45;display:block}
.cool-tech-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.cool-tech-grid a{display:flex;flex-direction:column;justify-content:space-between;min-height:170px;padding:23px;background:#152b3b;color:#fff;text-decoration:none}.cool-tech-grid span{font-size:11px;font-weight:800;letter-spacing:.13em}.cool-tech-grid strong{font-size:15px;line-height:1.45}.cool-tech-statement{max-width:800px;margin:25px 0 0;font-size:15px;line-height:1.65}
.cool-path-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.cool-path-grid article{padding:24px;border:1px solid rgba(21,43,59,.12)}.cool-path-grid span{font-size:11px;font-weight:800;letter-spacing:.1em}.cool-path-grid p{margin:12px 0 0;font-size:14px;line-height:1.6}.cool-system-statement{background:#f3efe9}.cool-system-statement .narrow{max-width:820px}.cool-system-statement h2{max-width:650px}.cool-system-statement p{font-size:16px;line-height:1.7;max-width:760px}
@media(max-width:900px){.cool-process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cool-tech-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.cool-system-hero .page-hero-grid{display:block}.cool-system-hero .page-hero-image{display:none}.cool-system-hero h1{font-size:clamp(32px,9vw,44px);line-height:1.04}.cool-system-hero .hero-subtitle{font-size:18px}.cool-system-hero .lead{font-size:14px;line-height:1.65}.cool-system-hero .hero-actions{display:flex;flex-direction:column;align-items:stretch;gap:10px}.cool-system-hero .hero-actions .button{width:100%;text-align:center}.cool-problem-grid{grid-template-columns:1fr;gap:10px}.cool-problem-grid a{min-height:116px;padding:19px 46px 19px 18px}.cool-problem-grid strong{font-size:14px}.cool-problem-grid span{font-size:12px}.cool-process-grid,.cool-tech-grid,.cool-path-grid{grid-template-columns:1fr}.cool-process-grid article{min-height:0;padding:21px}.cool-process-grid h3{font-size:23px}.cool-tech-grid a{min-height:135px;padding:20px}.cool-path-grid article{padding:20px}.cool-system-statement p{font-size:15px}.cool-system-statement h2{font-size:28px}}

/* V61 — COOL System customer-path architecture */
.cool-problem-grid-v60{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.cool-problem-grid-v60 a{min-height:118px;display:flex;flex-direction:column;justify-content:center;position:relative;padding:22px 54px 22px 24px;border:1px solid rgba(21,43,59,.08);border-radius:2px;text-decoration:none}
.cool-problem-grid-v60 a strong{font-size:14px;line-height:1.25;letter-spacing:.04em;color:#152b3b}
.cool-problem-grid-v60 a span{margin-top:8px;max-width:560px;font-size:13px;line-height:1.55;color:#52606b}
.cool-problem-grid-v60 a i{position:absolute;right:20px;top:50%;transform:translateY(-50%);font-style:normal;font-size:20px;color:#152b3b}
.cool-pathways{background:#f6f3ee}
.cool-pathway-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.cool-pathway-list article{background:#fff;padding:28px;border:1px solid rgba(21,43,59,.08);scroll-margin-top:110px}
.pathway-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.pathway-head span{font-size:12px;font-weight:800;letter-spacing:.12em;color:#8068a5}
.pathway-head h3{margin:0;font-size:17px;letter-spacing:.02em;color:#152b3b}
.cool-pathway-list p{font-size:14px;line-height:1.65;color:#52606b;margin:8px 0}
.cool-pathway-list article>a{display:inline-block;margin-top:12px;font-size:11px;font-weight:800;letter-spacing:.08em;color:#152b3b;text-decoration:none}
.cool-pathway-list article>a:hover{text-decoration:underline}
.cool-faq details{border-top:1px solid rgba(21,43,59,.16);padding:18px 0}
.cool-faq details:last-child{border-bottom:1px solid rgba(21,43,59,.16)}
.cool-faq summary{cursor:pointer;font-weight:700;color:#152b3b;font-size:14px}
.cool-faq details p{margin:12px 0 0;color:#52606b;line-height:1.65;font-size:14px}
@media(max-width:760px){
 .cool-problem-grid-v60{grid-template-columns:1fr;gap:10px}
 .cool-problem-grid-v60 a{min-height:104px;padding:20px 50px 20px 20px}
 .cool-problem-grid-v60 a strong{font-size:12px}
 .cool-problem-grid-v60 a span{font-size:12px;line-height:1.5}
 .cool-problem-grid-v60 a i{right:18px}
 .cool-pathway-list{grid-template-columns:1fr;gap:10px}
 .cool-pathway-list article{padding:22px 18px;scroll-margin-top:88px}
 .pathway-head h3{font-size:14px}
 .cool-pathway-list p{font-size:13px}
}

/* V62 — COOL System: decision map, 16 client pathways, mobile-first */
.cool-problem-grid-v62{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cool-problem-grid-v62 a{position:relative;display:flex;flex-direction:column;justify-content:center;min-height:126px;padding:22px 54px 22px 22px;background:#f3efe9;border:1px solid rgba(21,43,59,.08);color:#152b3b;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.cool-problem-grid-v62 a:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(21,43,59,.08)}
.cool-problem-grid-v62 strong{font-size:13px;line-height:1.3;letter-spacing:.035em}.cool-problem-grid-v62 span{margin-top:8px;font-size:12px;line-height:1.5;color:#52606b}.cool-problem-grid-v62 i{position:absolute;right:19px;top:50%;transform:translateY(-50%);font-style:normal;font-size:20px}
.cool-process-grid-v62{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.cool-process-grid-v62 article{background:#f3efe9;padding:24px;min-height:230px}.cool-process-grid-v62 article>span{font-size:11px;font-weight:800;letter-spacing:.12em}.cool-process-grid-v62 h3{font-size:18px;margin:18px 0 10px}.cool-process-grid-v62 p{font-size:13px;line-height:1.65;color:#52606b}.cool-process-grid-v62 b{display:block;margin-top:18px;font-size:11px;line-height:1.4}
.cool-decision-rule{background:#152b3b;color:#fff}.cool-decision-rule h2{color:#fff}.cool-decision-rule p{color:rgba(255,255,255,.82);font-size:16px;line-height:1.7}.cool-flow{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:28px}.cool-flow span{padding:11px 13px;border:1px solid rgba(255,255,255,.25);font-size:10px;font-weight:800;letter-spacing:.08em}.cool-flow b{font-size:16px;color:#d8c6a9}
.cool-pathway-stack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.cool-pathway-stack article{background:#fff;border:1px solid rgba(21,43,59,.1);padding:25px;scroll-margin-top:100px}.cool-pathway-stack article:nth-child(3n){background:#f8f5f0}.cool-pathway-stack .pathway-head{display:flex;align-items:center;gap:13px;margin-bottom:14px}.cool-pathway-stack .pathway-head span{font-size:11px;font-weight:800;letter-spacing:.12em;color:#8068a5}.cool-pathway-stack h3{margin:0;font-size:15px;line-height:1.35;color:#152b3b}.cool-pathway-stack p{font-size:13px;line-height:1.65;color:#52606b;margin:8px 0}.cool-pathway-stack article>a{display:inline-block;margin-top:10px;font-size:10px;font-weight:800;letter-spacing:.08em;color:#152b3b;text-decoration:none}.cool-pathway-stack article>a:hover{text-decoration:underline}
.cool-tech-grid-v62{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.cool-tech-grid-v62 a{min-height:160px;padding:22px;background:#152b3b;color:#fff;text-decoration:none;display:flex;flex-direction:column;justify-content:space-between}.cool-tech-grid-v62 span{font-size:10px;font-weight:800;letter-spacing:.13em}.cool-tech-grid-v62 strong{font-size:14px;line-height:1.5}.cool-system-intro,.cool-pathways-v62{background:#f6f3ee}.cool-pathways-v62 .section-heading{margin-bottom:30px}
@media(max-width:900px){.cool-process-grid-v62{grid-template-columns:repeat(2,minmax(0,1fr))}.cool-tech-grid-v62{grid-template-columns:repeat(2,minmax(0,1fr))}.cool-pathway-stack{grid-template-columns:1fr}}
@media(max-width:640px){.cool-problem-grid-v62{grid-template-columns:1fr;gap:9px}.cool-problem-grid-v62 a{min-height:104px;padding:18px 48px 18px 18px}.cool-problem-grid-v62 strong{font-size:12px}.cool-problem-grid-v62 span{font-size:11.5px}.cool-problem-grid-v62 i{right:16px}.cool-process-grid-v62,.cool-tech-grid-v62{grid-template-columns:1fr}.cool-process-grid-v62 article{min-height:0;padding:20px}.cool-process-grid-v62 h3{font-size:17px}.cool-decision-rule p{font-size:14px}.cool-flow{display:grid;grid-template-columns:1fr;gap:6px}.cool-flow b{text-align:center;transform:rotate(90deg);height:12px}.cool-flow span{text-align:center}.cool-pathway-stack article{padding:20px 18px}.cool-pathway-stack h3{font-size:13px}.cool-pathway-stack p{font-size:12.5px}.cool-pathway-stack article>a{font-size:10px}.cool-tech-grid-v62 a{min-height:125px;padding:19px}.cool-tech-grid-v62 strong{font-size:13px}}

/* V63 — COOL System: four areas + COOL MAPA + 20 concise client pathways */
.system-pillars-v63 .section-heading{margin-bottom:42px}
.system-pillars-v63 .system-pillar{min-height:370px}
.system-pillars-v63 .system-pillar > span:not(.pillar-label):not(.pillar-arrow){max-width:240px;font-size:13px;line-height:1.5}
.cool-map-section{background:#f6f3ee}
.cool-map-section .section-heading{margin-bottom:32px}
.cool-map-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.cool-map-grid .problem-tile{min-height:112px;border-radius:18px;overflow:hidden}
.cool-map-grid .problem-tile a{min-height:112px}
.cool-map-grid .problem-tile span:first-child{font-size:15px;line-height:1.18}
.cool-map-grid .problem-arrow{opacity:.72}
.cool-pathways-v63{background:#fff}
.cool-pathways-v63 .section-heading{margin-bottom:34px}
.cool-pathway-stack-v63{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.cool-pathway-stack-v63 article{background:#f7f5f1;border:1px solid rgba(21,43,59,.08);padding:27px 28px 25px;scroll-margin-top:105px}
.cool-pathway-stack-v63 article:target{box-shadow:0 0 0 2px rgba(21,43,59,.12)}
.cool-pathway-stack-v63 .pathway-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:13px}
.cool-pathway-stack-v63 .pathway-head span{font-size:11px;font-weight:800;letter-spacing:.12em;color:#8068a5;padding-top:3px}
.cool-pathway-stack-v63 .pathway-head h3{margin:0;font-size:16px;line-height:1.35;color:#152b3b}
.cool-pathway-stack-v63 .pathway-context{margin:0 0 20px;color:#52606b;font-size:13px;line-height:1.6}
.cool-pathway-stack-v63 .pathway-context strong{display:block;color:#152b3b;font-size:10px;letter-spacing:.09em;margin-bottom:4px}
.pathway-steps-v63{display:grid;gap:9px}
.pathway-steps-v63>div{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start;padding-top:9px;border-top:1px solid rgba(21,43,59,.1)}
.pathway-steps-v63>div>span{font-size:10px;font-weight:800;letter-spacing:.1em;color:#8068a5;padding-top:2px}
.pathway-steps-v63 p{margin:0;color:#52606b;font-size:12.5px;line-height:1.55}
.pathway-steps-v63 p strong{display:inline-block;color:#152b3b;font-size:10px;letter-spacing:.08em;margin-right:7px}
.pathway-cta-v63{display:inline-block;margin-top:20px;color:#152b3b;text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.09em;border-bottom:1px solid rgba(21,43,59,.35);padding-bottom:4px}
.pathway-cta-v63:hover{border-color:#152b3b}
.cool-system-final-v63{background:#f6f3ee}
.cool-system-final-v63 .cta-panel{align-items:center}
.cool-system-final-v63 .eyebrow{margin-bottom:10px}
@media(max-width:1000px){
 .system-pillars-v63 .system-pillar{min-height:310px}
 .cool-map-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cool-pathway-stack-v63{grid-template-columns:1fr}
}
@media(max-width:600px){
 .system-pillars-v63 .section-heading{margin-bottom:28px}
 .system-pillars-v63 .system-pillar{min-height:245px}
 .system-pillars-v63 .system-pillar > span:not(.pillar-label):not(.pillar-arrow){font-size:12px}
 .cool-map-grid{grid-template-columns:1fr;gap:10px}
 .cool-map-grid .problem-tile,.cool-map-grid .problem-tile a{min-height:92px}
 .cool-map-grid .problem-tile span:first-child{font-size:13px}
 .cool-pathway-stack-v63{gap:10px}
 .cool-pathway-stack-v63 article{padding:21px 18px 20px;scroll-margin-top:88px}
 .cool-pathway-stack-v63 .pathway-head h3{font-size:14px}
 .cool-pathway-stack-v63 .pathway-context{font-size:12.5px}
 .pathway-steps-v63 p{font-size:12px}
 .cool-system-final-v63 .cta-panel{align-items:flex-start}
}

/* V64 — COOL MAPA + 6 concise client systems. */
html{scroll-behavior:smooth}
.cool-map-v64{padding-top:68px;padding-bottom:76px}
.cool-map-v64 .section-heading{margin-bottom:34px}
.cool-map-v64 .cool-map-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.cool-map-v64 .problem-tile{min-height:122px;border-radius:18px;overflow:hidden}
.cool-map-v64 .problem-tile a{min-height:122px;height:100%;display:flex;align-items:center;gap:14px;padding:24px;text-decoration:none;color:#fff;font-weight:700;letter-spacing:.02em}
.cool-map-v64 .problem-tile span:first-child{font-size:17px;line-height:1.18}
.cool-map-v64 .problem-arrow{margin-left:auto;font-size:22px;opacity:.78}
.cool-map-v64 .problem-blue{background:#cbdbe6;color:#203444}.cool-map-v64 .problem-navy{background:#24445d}.cool-map-v64 .problem-green{background:#587968}.cool-map-v64 .problem-sage{background:#819b8f}.cool-map-v64 .problem-sand{background:#cdbfa5;color:#243746}.cool-map-v64 .problem-steel{background:#789bb5}.cool-map-v64 .problem-taupe{background:#a99782}.cool-map-v64 .problem-rose{background:#c68176}.cool-map-v64 .problem-brick{background:#b66e68}.cool-map-v64 .problem-teal{background:#5c9b9c}.cool-map-v64 .problem-mauve{background:#ad8ca8}.cool-map-v64 .problem-gold{background:#d7b15e;color:#243746}.cool-map-v64 .problem-indigo{background:#66719a}.cool-map-v64 .problem-plum{background:#81708d}.cool-map-v64 .problem-coral{background:#b77c78}.cool-map-v64 .problem-sky{background:#7e9eb4}.cool-map-v64 .problem-rust{background:#9a685e}
.cool-map-v64 .problem-tile a:hover .problem-arrow{transform:translateX(4px);opacity:1}
.cool-map-v64 .problem-arrow{transition:transform .2s ease,opacity .2s ease}

.cool-systems-v64{background:#f7f6f2;padding-top:78px;padding-bottom:82px}
.cool-systems-v64 .section-heading{margin-bottom:36px}
.cool-system-card{position:relative;display:grid;grid-template-columns:96px minmax(0,1fr);gap:30px;padding:38px 42px 40px;margin-bottom:18px;border-radius:22px;scroll-margin-top:100px;border:1px solid rgba(21,43,59,.06);box-shadow:0 8px 26px rgba(21,43,59,.04);overflow:visible}
.cool-system-card:last-child{margin-bottom:0}
.system-card-01{background:#e8eef1}.system-card-02{background:#e9eeeb}.system-card-03{background:#eee9e5}.system-card-04{background:#ece7dc}.system-card-05{background:#e7edf0}.system-card-06{background:#ebe9ee}
.cool-system-number{font-size:12px;font-weight:800;letter-spacing:.08em;color:#526b7a;padding-top:4px;white-space:nowrap}
.cool-system-main{min-width:0}
.cool-system-main h3{margin:4px 0 16px;font-size:clamp(28px,3.1vw,46px);line-height:1.04;letter-spacing:-.035em;color:#152b3b}
.cool-system-main .eyebrow{margin-bottom:8px}
.cool-system-intro{font-size:17px;line-height:1.62;max-width:900px;margin:0 0 26px;color:#41576a}
.cool-system-columns{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-bottom:28px}
.cool-system-columns h4{font-size:13px;letter-spacing:.02em;margin:0 0 12px;color:#152b3b}
.cool-system-columns p,.cool-system-columns li{font-size:14px;line-height:1.62;color:#42586a}
.cool-system-columns ul{margin:0;padding-left:19px}
.cool-system-columns li+li{margin-top:7px}
.cool-system-columns strong{color:#243d4f}
.cool-note{margin-top:16px;padding:14px 16px;border-left:3px solid rgba(21,43,59,.22);background:rgba(255,255,255,.34)}
.cool-system-cta{display:inline-flex;align-items:center;gap:10px;margin-top:2px;padding:13px 0;color:#152b3b;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.07em;border-bottom:1px solid rgba(21,43,59,.3);transition:gap .2s ease,border-color .2s ease}
.cool-system-cta::after{content:'→';font-size:18px;line-height:1}
.cool-system-cta:hover{gap:15px;border-color:#152b3b}
.cool-system-final-v64{padding-top:18px;padding-bottom:70px}
.cool-system-final-v64 .cta-panel{gap:30px}

@media (max-width:1000px){
  .cool-map-v64 .cool-map-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cool-system-card{grid-template-columns:64px minmax(0,1fr);gap:22px;padding:32px}
}
@media (max-width:700px){
  .cool-map-v64{padding-top:48px;padding-bottom:54px}
  .cool-map-v64 .section-heading{margin-bottom:24px}
  .cool-map-v64 .cool-map-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cool-map-v64 .problem-tile,.cool-map-v64 .problem-tile a{min-height:94px}
  .cool-map-v64 .problem-tile a{padding:14px 13px;gap:8px}
  .cool-map-v64 .problem-tile span:first-child{font-size:12.5px;line-height:1.18}
  .cool-map-v64 .problem-arrow{font-size:16px}
  .cool-systems-v64{padding-top:54px;padding-bottom:58px}
  .cool-systems-v64 .section-heading{margin-bottom:26px}
  .cool-system-card{grid-template-columns:1fr;gap:8px;padding:26px 22px 28px;margin-bottom:12px;border-radius:18px;scroll-margin-top:84px}
  .cool-system-number{padding-top:0;font-size:11px}
  .cool-system-main h3{font-size:27px;line-height:1.08;margin:3px 0 13px}
  .cool-system-intro{font-size:15px;line-height:1.58;margin-bottom:22px}
  .cool-system-columns{grid-template-columns:1fr;gap:20px;margin-bottom:22px}
  .cool-system-columns p,.cool-system-columns li{font-size:13px;line-height:1.58}
  .cool-system-cta{font-size:11px}
  .cool-system-final-v64{padding-top:6px;padding-bottom:50px}
}