/* ESK Section Heading (C4) — reusable heading block: kicker / display hero /
   support line / paragraph. Transparent background; lives inside any column
   (e.g. next to an embedded form). Literal token fallbacks so pages without
   esk-tokens.css match, sizes pinned against theme #content h2 rules. */

.esksh { position: relative; color: #022450; }
.esksh *, .esksh *::before, .esksh *::after { box-sizing: border-box; }
.esksh, .esksh * { font-family: "niveaugroteskregular", system-ui, sans-serif !important; }

.esksh__kicker { display: block; font-size: var(--esk-kicker, 16px); letter-spacing: var(--esk-kicker-ls, 0.15em); text-transform: uppercase; font-weight: 700; color: var(--accent, #e36745); margin-bottom: 0.55em; }
.esksh__title { margin: 0; }
.esksh__hero {
  display: block;
  font-size: var(--esk-display, clamp(72px, 10vw, 160px)) !important;
  line-height: var(--esk-display-lh, 0.88) !important;
  letter-spacing: var(--esk-display-ls, normal);
  font-weight: 800;
  text-transform: uppercase;
  color: #022450 !important;
}
.esksh__support {
  display: block;
  margin-top: 0.35em;
  font-size: clamp(22px, 2.4vw, 34px) !important;
  line-height: 1.15 !important;
  font-weight: 800;
  letter-spacing: 0.04em;
  word-spacing: 0.15em;
  text-transform: uppercase;
  color: #022450 !important;
}
.esksh__para { margin: clamp(14px, 1.8vh, 22px) 0 0; max-width: 640px; font-size: 17px; line-height: 1.5; font-weight: 500; color: #5B6474; }

@media (max-width: 767px) {
  .esksh { padding: clamp(28px, 7vw, 40px) 0 clamp(20px, 5vw, 28px); }
  .esksh__hero { font-size: clamp(36px, 10.4vw, 54px) !important; }
  .esksh__support { font-size: 18px !important; margin-top: 0.5em; }
  .esksh__para { margin-top: 14px; }
}


/* Support-line shimmer — same sweep as Why Choose (.eskw__t2): base-colour
   text, orange band drifts through every 9s. Reduced motion: static base. */
.esksh__support {
  background-image: linear-gradient(100deg, #022450 0%, #022450 42%, #e36745 50%, #022450 58%, #022450 100%) !important;
  background-size: 300% auto !important;
  background-position: 0% 50%;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
  animation: eskshGrad 6s ease-in-out infinite !important;
}
@keyframes eskshGrad { 0% { background-position: 0% 50%; } 75%, 100% { background-position: 100% 50%; } }
@media (prefers-reduced-motion: reduce) {
  .esksh__support { animation: none !important; }
}