/**
 * Section components (BEM). Consumes tokens.css; depends on base.css.
 * One banner per section. Positional decorative shapes use modifier classes
 * (no inline styles).
 */

/* ============================ HERO ============================ */
.enfx-hero {
  background: linear-gradient(160deg, var(--enfx-navy) 0%, var(--enfx-navy-dark) 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
  padding: var(--enfx-section-y) 0;
}
.enfx-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 30px 30px;
  opacity: .6;
}
.enfx-hero__glow {
  position: absolute;
  top: -140px;
  right: -120px;
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, rgba(232, 160, 32, .22), transparent 62%);
  z-index: 0;
}
.enfx-hero__shape--1 { width: 180px; height: 180px; top: 60px; left: -60px; }
.enfx-hero__shape--2 { bottom: 50px; left: 6%; }
.enfx-hero__shape--3 { width: 90px; height: 90px; top: 130px; right: 6%; }
.enfx-hero__grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 56px;
  align-items: flex-start;
}
.enfx-hero__title { color: #fff; font-size: clamp(38px, 5.4vw, 62px); font-weight: 800; margin: 20px 0 22px; }
.enfx-hero__title-mark { color: var(--enfx-orange); }
.enfx-hero__lead { color: var(--enfx-gray-light); font-size: 18.5px; max-width: 520px; margin-bottom: 32px; }
.enfx-hero__actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 34px; }
.enfx-hero__meta { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.enfx-hero__stat b { color: #fff; font-family: var(--enfx-f-head); font-size: 20px; display: block; line-height: 1; }
.enfx-hero__stat small { color: var(--enfx-gray-muted); font-size: 13px; }
.enfx-hero__visual { position: relative; z-index: 2; }
.enfx-hero__media { position: relative; animation: enfx-hero-in .7s cubic-bezier(.2, .7, .2, 1) .1s both; }
.enfx-hero__media img { width: 100%; height: auto; display: block; }
/* Gentle float takes over once the load-in entrance has settled. */
.enfx-hero__img { animation: enfx-float 6s ease-in-out 1s infinite; }

/* Hero image load-in entrance — slide in from the right + fade, matching the
   original HTML's `reveal r-right`. CSS-only, so it runs once on load. */
@keyframes enfx-hero-in {
  from { opacity: 0; transform: translateX(55px); }
  to   { opacity: 1; transform: translateX(0); }
}
.enfx-hero__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: var(--enfx-orange);
  display: grid;
  place-items: center;
  cursor: pointer;
  z-index: 4;
  animation: enfx-pulse 2.6s infinite;
  border: none;
}
.enfx-hero__play .enfx-icon { width: 26px; height: 26px; fill: var(--enfx-navy-dark); stroke: none; margin-left: 3px; }

.enfx-avatars { display: flex; }
.enfx-avatars__item {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid var(--enfx-navy);
  margin-left: -12px;
  background: var(--enfx-navy-3);
  display: grid;
  place-items: center;
  font-family: var(--enfx-f-head);
  font-weight: 700;
  font-size: 13px;
  color: #fff;
}
.enfx-avatars__item:first-child { margin-left: 0; }

.enfx-float-card {
  position: absolute;
  background: #fff;
  color: var(--enfx-ink);
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 20px 40px -18px rgba(0, 0, 0, .5);
  display: flex;
  align-items: center;
  gap: 12px;
  z-index: 5;
}
.enfx-float-card__ic { width: 40px; height: 40px; border-radius: 10px; background: var(--enfx-gold-soft); display: grid; place-items: center; flex: none; }
.enfx-float-card__ic .enfx-icon { width: 20px; height: 20px; stroke: var(--enfx-orange); stroke-width: 2; }
.enfx-float-card b { font-family: var(--enfx-f-head); font-size: 17px; color: var(--enfx-ink); display: block; line-height: 1; }
.enfx-float-card small { font-size: 12px; color: var(--enfx-gray-muted); }
.enfx-float-card--1 { top: 24px; left: -30px; }
.enfx-float-card--2 { bottom: 28px; right: -24px; }
.enfx-float-card--3 { bottom: -22px; left: 30px; background: var(--enfx-navy); color: #fff; }
.enfx-float-card--3 b { color: #fff; }
.enfx-float-card--3 small { color: var(--enfx-gray-light); }
.enfx-float-card--3 .enfx-float-card__ic { background: rgba(232, 160, 32, .2); }

/* ============================ VIDEO MODAL ============================ */
.enfx-video-modal { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 24px; }
.enfx-video-modal[hidden] { display: none; }
.enfx-video-modal__backdrop { position: absolute; inset: 0; background: rgba(10, 17, 33, .82); backdrop-filter: blur(4px); }
.enfx-video-modal__dialog { position: relative; z-index: 1; width: min(960px, 100%); }
.enfx-video-modal__frame { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .7); }
.enfx-video-modal__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.enfx-video-modal__close { position: absolute; top: -46px; right: 0; width: 40px; height: 40px; border-radius: 50%; border: none; background: #fff; color: var(--enfx-navy-dark); font-size: 26px; line-height: 1; cursor: pointer; display: grid; place-items: center; transition: background .2s; }
.enfx-video-modal__close:hover { background: var(--enfx-orange); }
body.enfx-modal-open { overflow: hidden; }

/* ============================ CLIENTS ============================ */
.enfx-clients { padding: calc(var(--enfx-band-y) * .75) 0; background: #fff; border-bottom: 1px solid var(--enfx-line); }
.enfx-clients__row { display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.enfx-clients__label { font-family: var(--enfx-f-head); font-weight: 600; font-size: 13.5px; color: var(--enfx-gray-muted); white-space: nowrap; }
.enfx-clients__brand { font-family: var(--enfx-f-head); font-weight: 800; font-size: 22px; color: #c3cad6; letter-spacing: -.02em; transition: .25s; }
.enfx-clients__brand:hover { color: var(--enfx-navy); }
.enfx-clients__brand img { height: 28px; width: auto; opacity: .7; filter: grayscale(1); transition: .25s; }
.enfx-clients__brand:hover img { opacity: 1; filter: none; }

/* ============================ SERVICES ============================ */
.enfx-services__shape--1 { width: 150px; height: 150px; top: 70px; left: -50px; }
.enfx-services__shape--2 { bottom: 70px; right: 3%; width: 110px; height: 110px; }
.enfx-service { display: grid; grid-template-columns: .82fr 1.18fr; gap: 34px; align-items: stretch; position: relative; z-index: 1; }
.enfx-service__tabs { display: flex; flex-direction: column; gap: 14px; }
.enfx-service__tab {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 26px;
  border-radius: var(--enfx-radius);
  background: #fff;
  border: 1px solid var(--enfx-line);
  cursor: pointer;
  transition: .3s;
  flex: 1;
  min-height: 74px;
  text-align: left;
  width: 100%;
  font-family: var(--enfx-f-body);
}
.enfx-service__tab-ic { width: 48px; height: 48px; flex: none; border-radius: 13px; background: var(--enfx-gold-soft); display: grid; place-items: center; transition: .3s; }
.enfx-service__tab-ic .enfx-icon { width: 23px; height: 23px; stroke: var(--enfx-orange); stroke-width: 1.7; transition: .3s; }
.enfx-service__tab-ic .enfx-fa { width: 23px; height: 23px; fill: var(--enfx-orange); transition: .3s; }
.enfx-service__tab.is-active .enfx-service__tab-ic .enfx-fa { fill: var(--enfx-navy-dark); }
.enfx-service__tab-text { flex: 1; }
.enfx-service__tab-text b { display: block; font-family: var(--enfx-f-head); font-weight: 600; font-size: 17px; color: var(--enfx-ink); transition: .3s; }
.enfx-service__tab-text small { font-size: 12.5px; color: var(--enfx-gray-muted); }
.enfx-service__tab-arrow { width: 30px; height: 30px; flex: none; border-radius: 50%; border: 1px solid var(--enfx-line); display: grid; place-items: center; transition: .3s; }
.enfx-service__tab-arrow .enfx-icon { width: 15px; height: 15px; stroke: var(--enfx-gray-muted); stroke-width: 2; transition: .3s; }
.enfx-service__tab:hover { border-color: var(--enfx-orange-light); }
.enfx-service__tab.is-active {
  background: linear-gradient(160deg, var(--enfx-navy), var(--enfx-navy-dark));
  border-color: transparent;
  box-shadow: var(--enfx-shadow);
  transform: translateX(4px);
}
.enfx-service__tab.is-active .enfx-service__tab-ic { background: var(--enfx-orange); }
.enfx-service__tab.is-active .enfx-service__tab-ic .enfx-icon { stroke: var(--enfx-navy-dark); }
.enfx-service__tab.is-active .enfx-service__tab-text b { color: #fff; }
.enfx-service__tab.is-active .enfx-service__tab-text small { color: var(--enfx-gray-light); }
.enfx-service__tab.is-active .enfx-service__tab-arrow { background: var(--enfx-orange); border-color: var(--enfx-orange); }
.enfx-service__tab.is-active .enfx-service__tab-arrow .enfx-icon { stroke: var(--enfx-navy-dark); }

.enfx-service__stage { position: relative; border-radius: 22px; overflow: hidden; background: #fff; border: 1px solid var(--enfx-line); box-shadow: var(--enfx-shadow); display: flex; min-height: 508px; }
@keyframes enfx-svcfade { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.enfx-service__panel { display: none; flex-direction: column; flex: 1; }
.enfx-service__panel.is-active { display: flex; animation: enfx-svcfade .5s ease; }
.enfx-service__pimg { position: relative; aspect-ratio: 700 / 250; overflow: hidden; flex: none; }
.enfx-service__pimg img { width: 100%; height: 100%; object-fit: cover; }
.enfx-service__pimg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(15, 27, 51, .50), rgba(15, 27, 51, .2)); }
.enfx-service__ptag { position: absolute; top: 22px; left: 26px; background: rgba(232, 160, 32, .96); color: var(--enfx-navy-dark); font-family: var(--enfx-f-head); font-weight: 600; font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; padding: 6px 14px; border-radius: 50px; z-index: 2; }
.enfx-service__pbody { padding: 40px; flex: 1; display: flex; flex-direction: column; }
.enfx-service__panel h3 { font-size: 26px; margin-bottom: 12px; }
.enfx-service__panel p { font-size: 15.5px; }
.enfx-service__plist { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0 28px; }
.enfx-service__plist li { display: flex; gap: 10px; align-items: center; font-family: var(--enfx-f-head); font-weight: 600; font-size: 14px; color: var(--enfx-ink); }
.enfx-service__plist i { width: 22px; height: 22px; border-radius: 50%; background: var(--enfx-gold-soft); display: grid; place-items: center; flex: none; }
.enfx-service__plist i .enfx-icon { width: 12px; height: 12px; stroke: var(--enfx-orange); stroke-width: 3; }
.enfx-service__pbtn { margin-top: auto; align-self: flex-start; }

/* ============================ TRUST / ABOUT ============================ */
.enfx-trust { background: var(--enfx-soft); }
.enfx-trust__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 66px; align-items: center; }
.enfx-trust__visual { position: relative; }
.enfx-trust__main { border-radius: 20px; aspect-ratio: 680 / 480; overflow: hidden; box-shadow: var(--enfx-shadow); position: relative; }
.enfx-trust__main img { width: 100%; height: 100%; object-fit: cover; }
.enfx-trust__badge { position: absolute; bottom: -26px; left: -26px; background: var(--enfx-orange); color: var(--enfx-navy-dark); border-radius: 18px; padding: 22px 26px; text-align: center; box-shadow: 0 22px 40px -16px rgba(232, 160, 32, .7); z-index: 2; animation: enfx-pulse 3s infinite; }
.enfx-trust__badge b { font-family: var(--enfx-f-head); font-size: 40px; font-weight: 800; line-height: 1; display: block; }
.enfx-trust__badge span { font-size: 13px; font-weight: 600; }
.enfx-trust__mini { position: absolute; top: 26px; right: -24px; background: #fff; border-radius: var(--enfx-radius); padding: 16px 20px; text-align: center; box-shadow: var(--enfx-shadow); z-index: 2; }
.enfx-trust__mini b { font-family: var(--enfx-f-head); font-weight: 800; font-size: 26px; color: var(--enfx-navy); display: block; line-height: 1; }
.enfx-trust__mini small { font-size: 12px; color: var(--enfx-gray-muted); }
.enfx-trust__lead { margin-top: 16px; }
.enfx-feat { display: flex; gap: 18px; padding: 20px 0; border-bottom: 1px dashed var(--enfx-line); }
.enfx-feat:last-of-type { border-bottom: none; }
.enfx-feat__ic { width: 58px; height: 58px; border-radius: 15px; background: var(--enfx-gold-soft); display: grid; place-items: center; flex: none; transition: .25s; }
.enfx-feat:hover .enfx-feat__ic { background: var(--enfx-orange); }
.enfx-feat__ic .enfx-icon { width: 26px; height: 26px; stroke: var(--enfx-orange); stroke-width: 1.7; transition: .25s; }
.enfx-feat:hover .enfx-feat__ic .enfx-icon { stroke: var(--enfx-navy-dark); }
.enfx-feat__ic .enfx-fa { width: 24px; height: 24px; fill: var(--enfx-orange); transition: .25s; }
.enfx-feat:hover .enfx-feat__ic .enfx-fa { fill: var(--enfx-navy-dark); }
.enfx-trust__intro p { margin-top: 16px; }
.enfx-feat h4 { font-size: 19px; margin-bottom: 6px; }
.enfx-feat p { font-size: 14.5px; }
.enfx-trust__btn { margin-top: 26px; }

/* ============================ PROCESS ============================ */
.enfx-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 26px; position: relative; }
.enfx-steps::before { content: ""; position: absolute; top: 40px; left: 16%; right: 16%; height: 2px; background: repeating-linear-gradient(90deg, var(--enfx-line) 0 10px, transparent 10px 20px); z-index: 0; }
.enfx-step { position: relative; z-index: 1; text-align: center; }
.enfx-step__circle { width: 82px; height: 82px; border-radius: 50%; background: #fff; border: 2px solid var(--enfx-line); display: grid; place-items: center; margin: 0 auto 22px; position: relative; transition: .3s; }
.enfx-step__circle .enfx-icon { width: 34px; height: 34px; stroke: var(--enfx-orange); stroke-width: 1.7; }
.enfx-step__circle .enfx-fa { width: 32px; height: 32px; fill: var(--enfx-orange); }
.enfx-step:hover .enfx-step__circle .enfx-fa { fill: var(--enfx-navy-dark); }
.enfx-step__n { position: absolute; top: -8px; right: -8px; width: 30px; height: 30px; border-radius: 50%; background: var(--enfx-navy); color: #fff; font-family: var(--enfx-f-head); font-weight: 700; font-size: 13px; display: grid; place-items: center; }
.enfx-step:hover .enfx-step__circle { background: var(--enfx-orange); border-color: var(--enfx-orange); transform: translateY(-5px); }
.enfx-step:hover .enfx-step__circle .enfx-icon { stroke: var(--enfx-navy-dark); }
.enfx-step h4 { font-size: 20px; margin-bottom: 9px; }
.enfx-step p { font-size: 15px; max-width: 300px; margin-inline: auto; }

/* ============================ PROJECTS ============================ */
.enfx-projects { background: var(--enfx-soft); }
.enfx-projects__head { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 20px; margin-bottom: var(--enfx-sec-head-gap); }
.enfx-projects__head-text { max-width: 560px; margin-bottom: 0; }
.enfx-projects__nav { display: flex; gap: 12px; }
.enfx-projects__nav button { width: 50px; height: 50px; border-radius: 50%; border: 1px solid var(--enfx-line); background: #fff; cursor: pointer; display: grid; place-items: center; transition: .25s; }
.enfx-projects__nav button:hover { background: var(--enfx-navy); border-color: var(--enfx-navy); }
.enfx-projects__nav .enfx-icon { width: 19px; height: 19px; stroke: var(--enfx-ink); stroke-width: 2; transition: .25s; }
.enfx-projects__nav button:hover .enfx-icon { stroke: #fff; }
.enfx-pslider { overflow: hidden; padding: 6px 6px 8px; }
.enfx-ptrack { display: flex; gap: 26px; transition: transform .55s cubic-bezier(.4, 0, .2, 1); }
.enfx-pslide { flex: 0 0 calc((100% - 52px) / 3); position: relative; border-radius: 22px; overflow: hidden; aspect-ratio: 600 / 440; box-shadow: var(--enfx-shadow); }
.enfx-pslide img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.enfx-pslide:hover img { transform: scale(1.08); }
.enfx-pslide__ov { position: absolute; inset: 0; padding: 30px; display: flex; flex-direction: column; justify-content: flex-end; background: linear-gradient(0deg, rgba(15, 27, 51, .95), rgba(15, 27, 51, .1) 60%, transparent); }
.enfx-pslide__chip { align-self: flex-start; background: rgba(232, 160, 32, .96); color: var(--enfx-navy-dark); font-family: var(--enfx-f-head); font-weight: 600; font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; padding: 7px 15px; border-radius: 50px; margin-bottom: 14px; transform: translateY(10px); opacity: 0; transition: .4s; }
.enfx-pslide__title { color: #fff; font-size: 23px; margin-bottom: 6px; }
.enfx-pslide__desc { color: var(--enfx-gray-light); font-size: 14.5px; max-height: 0; opacity: 0; overflow: hidden; transition: .45s; }
.enfx-pslide:hover .enfx-pslide__chip { transform: none; opacity: 1; }
.enfx-pslide:hover .enfx-pslide__desc { max-height: 70px; opacity: 1; margin-top: 4px; }
.enfx-pslide__arrow { position: absolute; top: 22px; right: 22px; width: 48px; height: 48px; border-radius: 50%; background: #fff; display: grid; place-items: center; opacity: 0; transform: scale(.6) rotate(-40deg); transition: .4s; }
.enfx-pslide:hover .enfx-pslide__arrow { opacity: 1; transform: none; }
.enfx-pslide__arrow .enfx-icon { width: 20px; height: 20px; stroke: var(--enfx-navy); stroke-width: 2.2; }

/* ============================ CTA ============================ */
.enfx-cta { padding: var(--enfx-band-y) 0; }
.enfx-cta__box { background: linear-gradient(120deg, var(--enfx-orange), var(--enfx-orange-light)); border-radius: var(--enfx-radius-lg); padding: 30px 62px; display: flex; align-items: center; justify-content: space-between; gap: 30px; flex-wrap: wrap; position: relative; overflow: hidden; box-shadow: 0 30px 60px -30px rgba(232, 160, 32, .6); }
.enfx-cta__box::after { content: ""; position: absolute; right: -40px; top: -40px; width: 220px; height: 220px; border-radius: 50%; border: 30px solid rgba(255, 255, 255, .12); }
.enfx-cta__box::before { content: ""; position: absolute; left: -30px; bottom: -60px; width: 180px; height: 180px; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.enfx-cta__title { color: var(--enfx-navy-dark); font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; position: relative; }
.enfx-cta__text { color: rgba(15, 27, 51, .75); position: relative; margin-top: 8px; max-width: 540px; }
.enfx-cta__box .enfx-btn { position: relative; flex: none; }

/* ============================ TESTIMONIALS ============================ */
.enfx-tst__grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 56px; }
/* Allow both columns to shrink to the track; the slider's min-width:100%
   slides would otherwise force the column wider than the viewport and clip. */
.enfx-tst__grid > * { min-width: 0; }
.enfx-tslider { min-width: 0; }
.enfx-tst__intro { margin: 22px 0; }
.enfx-tst__rating { display: flex; align-items: center; gap: 16px; margin: 22px 0; }
.enfx-tst__score { font-family: var(--enfx-f-head); font-weight: 800; font-size: 52px; color: var(--enfx-ink); line-height: 1; }
.enfx-tst__stars { color: var(--enfx-orange); font-size: 20px; letter-spacing: 2px; }
.enfx-tst__rating small { color: var(--enfx-gray-muted); font-size: 13px; }
.enfx-tst__stat { background: #fff; border: 1px solid var(--enfx-line); border-radius: var(--enfx-radius); padding: 22px 24px; margin: 22px 0; box-shadow: var(--enfx-shadow); }
.enfx-tst__stat b { font-family: var(--enfx-f-head); font-weight: 800; font-size: 34px; color: var(--enfx-orange); }
.enfx-tst__stat span { color: var(--enfx-body); font-size: 15px; }
.enfx-tst__rev { display: flex; align-items: center; gap: 14px; }
.enfx-tst__rev .enfx-avatars__item { border-color: #fff; background: var(--enfx-navy); }
.enfx-tst__rev small { font-family: var(--enfx-f-head); font-weight: 600; color: var(--enfx-ink); }
.enfx-tslider { overflow: hidden; }
.enfx-ttrack { display: flex; transition: transform .5s ease; }
.enfx-tslide { min-width: 100%; padding: 4px; }
.enfx-tcard { background: #fff; border: 1px solid var(--enfx-line); border-radius: 20px; padding: 40px 42px; box-shadow: var(--enfx-shadow); }
.enfx-tcard__q { font-family: var(--enfx-f-head); font-size: 60px; color: var(--enfx-orange); line-height: .6; height: 30px; }
.enfx-tcard p { font-size: 18px; color: var(--enfx-ink); margin: 18px 0 26px; line-height: 1.7; }
.enfx-tcard__who { display: flex; align-items: center; gap: 14px; }
.enfx-tcard__av { width: 52px; height: 52px; border-radius: 50%; background: var(--enfx-navy); color: #fff; display: grid; place-items: center; font-family: var(--enfx-f-head); font-weight: 700; }
.enfx-tcard__who b { font-family: var(--enfx-f-head); color: var(--enfx-ink); font-size: 16px; display: block; }
.enfx-tcard__who small { color: var(--enfx-gray-muted); }
.enfx-tst__navs { display: flex; gap: 12px; margin-top: 26px; }
.enfx-tst__navs button { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--enfx-line); background: #fff; cursor: pointer; display: grid; place-items: center; transition: .25s; }
.enfx-tst__navs button:hover { background: var(--enfx-navy); border-color: var(--enfx-navy); }
.enfx-tst__navs .enfx-icon { width: 18px; height: 18px; stroke: var(--enfx-ink); stroke-width: 2; transition: .25s; }
.enfx-tst__navs button:hover .enfx-icon { stroke: #fff; }

/* ============================ FAQ ============================ */
.enfx-faq { background: var(--enfx-soft); }
.enfx-faq__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: start; }
.enfx-faq__intro p { margin: 16px 0 26px; }
.enfx-faq__list { display: grid; gap: 14px; }
.enfx-qa { background: #fff; border: 1px solid var(--enfx-line); border-radius: 14px; overflow: hidden; transition: .2s; }
.enfx-qa.is-open { border-color: var(--enfx-orange); box-shadow: var(--enfx-shadow); }
.enfx-qa__q { padding: 22px 24px; display: flex; justify-content: space-between; align-items: center; gap: 16px; cursor: pointer; font-family: var(--enfx-f-head); font-weight: 600; color: var(--enfx-ink); font-size: 16.5px; width: 100%; text-align: left; background: none; border: none; }
.enfx-qa__pm { width: 26px; height: 26px; flex: none; border-radius: 50%; background: var(--enfx-gold-soft); color: var(--enfx-orange); display: grid; place-items: center; font-size: 18px; transition: .3s; }
.enfx-qa.is-open .enfx-qa__pm { background: var(--enfx-orange); color: #fff; transform: rotate(45deg); }
.enfx-qa__a { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.enfx-qa__a p { padding: 0 24px 22px; font-size: 15px; }

/* ============================ BLOG ============================ */
.enfx-blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.enfx-post { background: #fff; border: 1px solid var(--enfx-line); border-radius: 18px; overflow: hidden; transition: .3s; }
.enfx-post:hover { transform: translateY(-6px); box-shadow: var(--enfx-shadow); border-color: transparent; }
.enfx-post__thumb { aspect-ratio: 700 / 210; position: relative; overflow: hidden; }
.enfx-post__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.enfx-post:hover .enfx-post__thumb img { transform: scale(1.07); }
.enfx-post__date { position: absolute; top: 16px; left: 16px; background: var(--enfx-orange); color: var(--enfx-navy-dark); border-radius: 12px; padding: 10px 14px; text-align: center; font-family: var(--enfx-f-head); z-index: 2; }
.enfx-post__date b { font-size: 20px; font-weight: 800; line-height: 1; display: block; }
.enfx-post__date small { font-size: 11px; font-weight: 600; }
.enfx-post__body { padding: 24px 26px 30px; }
.enfx-post__cat { font-family: var(--enfx-f-head); font-weight: 600; font-size: 12.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--enfx-orange); }
.enfx-post__title { font-size: 19px; margin: 10px 0 12px; line-height: 1.35; }
.enfx-post__title a:hover { color: var(--enfx-orange); }
.enfx-post__rm { font-family: var(--enfx-f-head); font-weight: 600; font-size: 14px; color: var(--enfx-ink); display: inline-flex; align-items: center; gap: 8px; transition: .2s; }
.enfx-post__rm:hover { color: var(--enfx-orange); gap: 12px; }

/* ============================ CONTACT ============================ */
.enfx-contact__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 40px; align-items: stretch; }
.enfx-contact__left { background: linear-gradient(160deg, var(--enfx-navy), var(--enfx-navy-dark)); border-radius: var(--enfx-radius-lg); padding: 42px; color: var(--enfx-gray-light); position: relative; overflow: hidden; display: flex; flex-direction: column; }
.enfx-contact__left .enfx-shape { opacity: .5; }
.enfx-contact__shape--1 { bottom: 20px; right: 20px; width: 100px; height: 100px; color: rgba(232, 160, 32, .35); }
.enfx-contact__shape--2 { width: 120px; height: 120px; top: -30px; right: -30px; }
.enfx-contact__left h3 { color: #fff; font-size: 25px; margin-bottom: 8px; position: relative; z-index: 1; }
.enfx-contact__intro { font-size: 14.5px; margin-bottom: 14px; position: relative; z-index: 1; }
.enfx-contact__ci { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid rgba(255, 255, 255, .1); position: relative; z-index: 1; }
.enfx-contact__ci-ic { width: 50px; height: 50px; flex: none; border-radius: 13px; background: rgba(232, 160, 32, .18); display: grid; place-items: center; }
.enfx-contact__ci-ic .enfx-icon { width: 21px; height: 21px; stroke: var(--enfx-orange-light); stroke-width: 1.8; }
.enfx-contact__lab { font-family: var(--enfx-f-head); font-weight: 600; color: #fff; font-size: 15px; margin-bottom: 3px; }
.enfx-contact__val { font-size: 14px; color: var(--enfx-gray-light); }
.enfx-contact__val--stack { display: flex; flex-direction: column; gap: 2px; }
.enfx-contact__val a:hover { color: var(--enfx-orange-light); }
/* Push the socials to the bottom so the panel fills the row height evenly. */
.enfx-contact__social { display: flex; gap: 10px; margin-top: auto; padding-top: 26px; position: relative; z-index: 1; }
.enfx-contact__social a { width: 42px; height: 42px; border-radius: 11px; border: 1px solid rgba(255, 255, 255, .16); display: grid; place-items: center; transition: .25s; }
.enfx-contact__social a:hover { background: var(--enfx-orange); border-color: var(--enfx-orange); }
.enfx-contact__social .enfx-icon { width: 17px; height: 17px; stroke: #fff; stroke-width: 1.8; transition: .25s; }
.enfx-contact__social a:hover .enfx-icon { stroke: var(--enfx-navy-dark); }
/* Full-width map band below the two columns. */
.enfx-contact__map {
  margin-top: 40px;
  border-radius: var(--enfx-radius-lg);
  overflow: hidden;
  aspect-ratio: 1320 / 360;
  position: relative;
  z-index: 1;
  border: 1px solid var(--enfx-line);
  box-shadow: var(--enfx-shadow);
}
.enfx-contact__map iframe { width: 100%; height: 100%; border: 0; filter: grayscale(.3) contrast(1.05); }
.enfx-form { background: #fff; border: 1px solid var(--enfx-line); border-radius: var(--enfx-radius-lg); padding: 40px; box-shadow: var(--enfx-shadow); }
.enfx-form h3 { font-size: 23px; margin-bottom: 22px; }
.enfx-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.enfx-field { margin-bottom: 16px; }
.enfx-field label { display: block; font-family: var(--enfx-f-head); font-weight: 600; font-size: 13.5px; color: var(--enfx-ink); margin-bottom: 7px; }
.enfx-field input, .enfx-field textarea { width: 100%; border: 1px solid var(--enfx-line); border-radius: 12px; padding: 13px 15px; font-family: var(--enfx-f-body); font-size: 15px; color: var(--enfx-ink); background: var(--enfx-soft); transition: .2s; }
.enfx-field input:focus, .enfx-field textarea:focus { outline: none; border-color: var(--enfx-orange); background: #fff; box-shadow: 0 0 0 3px var(--enfx-gold-soft); }
.enfx-field textarea { min-height: 130px; resize: vertical; }
.enfx-form .enfx-btn { width: 100%; justify-content: center; }
.enfx-form__note { text-align: center; font-size: 12.5px; color: var(--enfx-gray-muted); margin-top: 14px; }

/* ---------- Editor placeholders (visible to logged-in editors only) ---------- */
/* Uses currentColor so it reads on both light sections and the navy hero/footer. */
.enfx-placeholder {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  border: 1px dashed currentColor;
  border-radius: 12px;
  padding: 14px 18px;
  margin: 10px 0;
  font-size: 14px;
  line-height: 1.5;
  opacity: .75;
}
.enfx-placeholder__text { margin: 0; }
.enfx-placeholder__link {
  color: var(--enfx-orange);
  font-weight: 600;
  text-decoration: underline;
  white-space: nowrap;
}
.enfx-placeholder__link:hover { color: var(--enfx-orange-light); }
.enfx-placeholder--compact { padding: 8px 14px; font-size: 13px; margin: 0; }
.enfx-placeholder--section { justify-content: center; text-align: center; }
.enfx-placeholder-section { padding: var(--enfx-band-y) 0; }

/* ---------- Honeypot ---------- */
/* Off-screen for humans, present in the DOM for bots. */
.enfx-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Toast notifications ---------- */
.enfx-toasts {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 300;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(380px, calc(100vw - 32px));
  pointer-events: none;
}
.enfx-toast {
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: #fff;
  color: var(--enfx-ink);
  border-radius: 12px;
  border-left: 4px solid var(--enfx-navy);
  padding: 14px 12px 14px 16px;
  box-shadow: 0 18px 40px -14px rgba(16, 29, 52, .35);
  opacity: 0;
  transform: translateX(16px);
  transition: opacity .28s ease, transform .28s ease;
}
.enfx-toast.is-in { opacity: 1; transform: none; }
.enfx-toast.is-leaving { opacity: 0; transform: translateX(16px); }
.enfx-toast__msg { margin: 0; flex: 1; font-size: 14.5px; line-height: 1.5; }
.enfx-toast__close {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  color: var(--enfx-gray-muted);
  padding: 0 2px;
  transition: color .2s;
}
.enfx-toast__close:hover { color: var(--enfx-ink); }
.enfx-toast--success { border-left-color: #0f7a38; }
.enfx-toast--error { border-left-color: #b32d2e; }
.enfx-toast--info { border-left-color: var(--enfx-orange); }

@media (max-width: 600px) {
  .enfx-toasts { top: 12px; right: 12px; left: 12px; width: auto; }
}

/* ============================ FOOTER ============================ */
.enfx-footer { position: relative; color: var(--enfx-gray-light); padding-top: 60px; background: linear-gradient(rgba(15, 27, 51, .94), rgba(12, 22, 42, .97)), url('../images/footer-bg.jpg') center / cover no-repeat; background-attachment: fixed; }
.enfx-footer__cta { background: linear-gradient(120deg, var(--enfx-orange), var(--enfx-orange-light)); border-radius: 20px; padding: 34px 44px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; position: relative; z-index: 2; box-shadow: 0 26px 50px -28px rgba(232, 160, 32, .6); }
.enfx-footer__cta h3 { color: var(--enfx-navy-dark); font-size: 24px; }
.enfx-footer__cta-form { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 340px; max-width: 440px; }
.enfx-footer__cta-box { display: flex; background: rgba(255, 255, 255, .25); border: 1px solid rgba(255, 255, 255, .4); border-radius: 50px; padding: 6px 6px 6px 20px; }
.enfx-footer__cta-box input { flex: 1; background: none; border: none; color: var(--enfx-navy-dark); font-family: var(--enfx-f-body); font-size: 14px; outline: none; }
.enfx-footer__cta-box input::placeholder { color: rgba(15, 27, 51, .6); }
.enfx-footer__cta-box button { background: var(--enfx-navy-dark); color: #fff; border: none; border-radius: 50px; padding: 0 24px; height: 44px; cursor: pointer; font-family: var(--enfx-f-head); font-weight: 600; transition: .2s; }
.enfx-footer__cta-box button:hover { background: var(--enfx-navy); }
.enfx-footer__top { padding: 60px 0 46px; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.4fr; gap: 44px; position: relative; z-index: 2; }
.enfx-footer__brand img { height: 36px; width: auto; margin-bottom: 20px; }
.enfx-footer__brand p { font-size: 14.5px; max-width: 300px; margin-bottom: 20px; }
.enfx-footer__social { display: flex; gap: 10px; }
.enfx-footer__social a { width: 40px; height: 40px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .14); display: grid; place-items: center; transition: .25s; background: rgba(255, 255, 255, .04); }
.enfx-footer__social a:hover { background: var(--enfx-orange); border-color: var(--enfx-orange); }
.enfx-footer__social .enfx-icon { width: 16px; height: 16px; stroke: var(--enfx-gray-light); stroke-width: 1.8; transition: .25s; }
.enfx-footer__social a:hover .enfx-icon { stroke: var(--enfx-navy-dark); }
.enfx-footer__col h5 { color: #fff; font-family: var(--enfx-f-head); font-size: 16px; margin-bottom: 20px; }
/* wp_nav_menu output — keep the plain-link look of the original design. */
.enfx-footer__menu { list-style: none; margin: 0; padding: 0; }
.enfx-footer__menu li { margin: 0; }
.enfx-footer__col a { display: block; padding: 7px 0; font-size: 14.5px; transition: .2s; }
.enfx-footer__col a:hover { color: var(--enfx-orange); padding-left: 6px; }
.enfx-footer__get p { font-size: 14.5px; margin-bottom: 14px; display: flex; gap: 10px; }
.enfx-footer__phones { display: flex; flex-direction: column; gap: 2px; }
/* Contact links here are not nav links — cancel the column-link block padding
   so email/phone align with their icon (and don't shift on hover). */
.enfx-footer__get a { display: inline; padding: 0; }
.enfx-footer__get a:hover { padding-left: 0; }
.enfx-footer__get .enfx-icon { width: 17px; height: 17px; stroke: var(--enfx-orange); stroke-width: 1.8; flex: none; margin-top: 3px; }
.enfx-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); padding: 24px 0; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: 13.5px; position: relative; z-index: 2; }
.enfx-footer__bottom a:hover { color: var(--enfx-orange); }
.enfx-footer__legal-sep { margin: 0 6px; opacity: .6; }

/* ============================ SINGLE ============================ */
.enfx-single__inner { max-width: 820px; margin: 0 auto; }
.enfx-single__head { margin-bottom: 24px; }
.enfx-single__media { border-radius: var(--enfx-radius-lg); overflow: hidden; margin-bottom: 30px; }
.enfx-single__media img { width: 100%; height: auto; display: block; }
.enfx-single__content { font-size: 16.5px; }
.enfx-single__content p { margin-bottom: 18px; }
.enfx-single__content h2, .enfx-single__content h3 { margin: 28px 0 12px; }
.enfx-single__content a { color: var(--enfx-orange-d); text-decoration: underline; }
.enfx-single__back { margin-top: 36px; }

/* ============================ RESPONSIVE ============================ */
@media (max-width: 980px) {
  .enfx-hero__grid, .enfx-trust__grid, .enfx-contact__grid, .enfx-tst__grid, .enfx-faq__grid { grid-template-columns: 1fr; gap: 48px; }

  /* Once the hero stacks, the visual owns the full container — on a tablet that
     renders the image wider than it ever gets on desktop (~630px in its .98fr
     column), so it reads as oversized. Cap it to the same measure as the hero
     lead and centre it; below ~580px the container is narrower than the cap, so
     the image simply goes full width as before.
     The cap is on __media, not the image, so the play button stays anchored. */
  .enfx-hero__media { max-width: 520px; margin-inline: auto; }

  /* With the visual centred above/below it, left-aligned copy reads as adrift —
     centre the whole hero column to match. This also means the meta row stays
     balanced on the line it wraps to, rather than hanging off the left edge. */
  .enfx-hero__intro { text-align: center; }
  .enfx-hero__lead { margin-inline: auto; }
  .enfx-hero__actions,
  .enfx-hero__meta { justify-content: center; }
  .enfx-hero__stat { text-align: center; }
  .enfx-blog__grid { grid-template-columns: 1fr 1fr; }
  /* ---- Services: tabs become an accordion ----
     The two wrappers stop generating boxes, so all the tabs and panels become
     items of the same grid and can be interleaved header/panel/header/panel via
     `order` — no duplicated markup and no moving DOM around on resize.
     --enfx-i is the service index, printed on each tab and panel in
     template-parts/home/services.php. services-tabs.js switches the behaviour
     and ARIA to match at this same breakpoint. */
  .enfx-service { grid-template-columns: 1fr; gap: 0; }
  .enfx-service__tabs,
  .enfx-service__stage { display: contents; }

  .enfx-service__tab { order: calc(var(--enfx-i) * 2); }
  .enfx-service__panel { order: calc(var(--enfx-i) * 2 + 1); }

  /* Header */
  .enfx-service__tab { min-height: 70px; padding: 0 20px; gap: 14px; margin-bottom: 10px; border-radius: 14px; }
  .enfx-service__tab.is-active { transform: none; border-radius: 14px 14px 0 0; margin-bottom: 0; box-shadow: none; }
  .enfx-service__tab-arrow .enfx-icon { transition: transform .3s ease; }
  .enfx-service__tab.is-active .enfx-service__tab-arrow .enfx-icon { transform: rotate(90deg); }

  /* Body — animated open/closed like the FAQ accordion. Always rendered (not
     display:none) so max-height has something to transition. */
  .enfx-service__panel,
  .enfx-service__panel.is-active {
    display: block;
    max-height: 0;
    overflow: hidden;
    margin-bottom: 10px;
    background: #fff;
    border: 1px solid var(--enfx-line);
    border-top: 0;
    border-radius: 0 0 14px 14px;
    transition: max-height .35s ease;
    animation: none;
  }
  .enfx-service__panel:not(.is-active) { margin-bottom: 0; border-color: transparent; }

  .enfx-service__pimg { aspect-ratio: 700 / 300; }
  .enfx-service__pbody { padding: 26px 22px 28px; }
  .enfx-service__panel h3 { font-size: 21px; }
  .enfx-service__plist { grid-template-columns: 1fr; gap: 10px; margin: 16px 0 22px; }
  .enfx-pslide { flex: 0 0 calc((100% - 26px) / 2); }
  .enfx-steps { grid-template-columns: 1fr; }
  .enfx-steps::before { display: none; }
  .enfx-footer__top { grid-template-columns: 1fr 1fr; }
  .enfx-footer { background-attachment: scroll; }
  .enfx-clients__row { justify-content: center; gap: 22px; }
}
@media (max-width: 600px) {
  .enfx-blog__grid, .enfx-form__row, .enfx-footer__top { grid-template-columns: 1fr; }
  .enfx-service__plist { grid-template-columns: 1fr; }

  /* Around 430px the avatars and both stats no longer fit on one line, so the
     second stat gets stranded on a line of its own. Give the avatars a row to
     themselves and the two stats always pair up underneath — a deliberate
     two-line block instead of a ragged wrap. */
  .enfx-avatars { flex-basis: 100%; justify-content: center; }
  .enfx-hero__meta { gap: 16px 22px; }
  .enfx-service__tab-text small { display: none; }
  .enfx-pslide { flex: 0 0 100%; }
  .enfx-cta__box, .enfx-footer__cta { padding: 36px 26px; }
  .enfx-trust__badge { left: 12px; bottom: -18px; }
  .enfx-footer__cta-form { min-width: auto; width: 100%; max-width: none; }
  .enfx-contact__left, .enfx-form { padding: 30px; }
  .enfx-contact__map { aspect-ratio: 4 / 3; margin-top: 28px; }
  .enfx-tcard { padding: 28px 24px; }
  .enfx-tcard p { font-size: 16px; }
  .enfx-tst__stat { padding: 20px 22px; }
  .enfx-tst__score { font-size: 44px; }
}

/* ==========================================================================
   Inner pages (Services + Pages)
   Chrome for block-editor driven templates: compact page head, featured
   banner, and the width rules for block content.
   ========================================================================== */

/* --- Compact page head --- */
.enfx-page-head { background: var(--enfx-navy); color: var(--enfx-white); padding: 38px 0; }
.enfx-page-head__title { color: var(--enfx-white); font-family: var(--enfx-f-head); font-size: clamp(26px, 3.6vw, 38px); font-weight: 800; line-height: 1.2; letter-spacing: -.02em; margin: 0; }
.enfx-page-head__sub { color: var(--enfx-gray-light); font-size: 16px; margin: 10px 0 0; }

/* --- Breadcrumb (gold) --- */
.enfx-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 14px; color: var(--enfx-orange-light); }
.enfx-crumb a { color: var(--enfx-orange-light); }
.enfx-crumb a:hover { color: var(--enfx-orange); }
.enfx-crumb__sep { width: 13px; height: 13px; flex: none; stroke: rgba(232, 160, 32, .55); fill: none; stroke-width: 2; }
.enfx-crumb__here { color: var(--enfx-orange); font-weight: 600; }

/* --- Featured banner: natural ratio, never cropped --- */
.enfx-feat { padding: 34px 0 0; }
.enfx-feat__img { margin: 0; border-radius: var(--enfx-radius); overflow: hidden; border: 1px solid var(--enfx-line); box-shadow: 0 30px 60px -42px rgba(19, 32, 56, .5); background: var(--enfx-soft); }
.enfx-feat__img img { width: 100%; height: auto; display: block; }

/* --- Block content --- */
/* Default breathing room from the page head above and the footer below. */
.enfx-entry { padding: 56px 0 90px; }

/* …but a full-width band opening or closing the page should meet the chrome
   edge to edge, so the padding that would show as a white strip is dropped.
   Only that case is affected — ordinary content keeps the spacing above, and
   the author does not have to configure anything.
   :has() is unsupported only in browsers that predate it; there the band simply
   keeps its default gap, which is a cosmetic fallback, not a break. */
.enfx-entry:has( > .enfx-entry__inner > .alignfull:first-child ) { padding-top: 0; }
.enfx-entry:has( > .enfx-entry__inner > .alignfull:last-child ) { padding-bottom: 0; }
.enfx-entry__inner > .alignfull:first-child { margin-top: 0; }
.enfx-entry__inner > .alignfull:last-child { margin-bottom: 0; }

/* The inner wrapper spans the viewport and pads itself, rather than being an
   .enfx-container. Children are capped at the same measure a container would
   give (--enfx-content-w), so they line up with the logo bar — but a block set
   to Full width can cancel the padding and run edge to edge.
   One gutter variable drives both the padding and that negative margin, so they
   can never drift apart. Mirrors theme.json (contentSize == wideSize). */
.enfx-entry__inner {
  --enfx-entry-gutter: var(--enfx-gutter);
  padding-inline: var(--enfx-entry-gutter);
}
.enfx-entry__inner > * {
  max-width: var(--enfx-content-w);
  margin-inline: auto;
}
.enfx-entry__inner > .alignfull {
  max-width: none;
  margin-inline: calc(var(--enfx-entry-gutter) * -1);
}
/* A full-width band pads its own contents back to the page measure. Scoped to
   Group blocks so an alignfull image still bleeds edge to edge. */
.enfx-entry__inner > .alignfull.wp-block-group { padding-inline: var(--enfx-entry-gutter); }

.enfx-entry__inner > .alignleft { float: left; margin-inline: 0 2em; }
.enfx-entry__inner > .alignright { float: right; margin-inline: 2em 0; }
.enfx-entry__inner > .aligncenter { margin-inline: auto; }

/* Vertical rhythm between blocks (blockGap parity for classic content). */
.enfx-entry__inner > * + * { margin-top: 24px; }
.enfx-entry__inner > :first-child { margin-top: 0; }

/* Direct children only — these must not reach inside a block and override its
   own heading/text rhythm (e.g. .enfx-svc-head__title). */
.enfx-entry__inner > h2 { font-size: 26px; margin-top: 44px; }
.enfx-entry__inner > h3 { font-size: 19px; margin-top: 30px; }
.enfx-entry__inner > p { line-height: 1.75; }
.enfx-entry__inner a:where(:not(.wp-element-button)) { color: var(--enfx-orange-d); text-decoration: underline; }
.enfx-entry__inner .wp-block-image img { border-radius: var(--enfx-radius); }
.enfx-entry__inner .wp-block-separator { border: 0; border-top: 1px solid var(--enfx-line); opacity: 1; }
.enfx-entry__pages { margin-top: 28px; font-family: var(--enfx-f-head); font-weight: 600; }

@media (max-width: 600px) {
  .enfx-page-head { padding: 28px 0; }
  .enfx-feat { padding-top: 24px; }
  .enfx-entry { padding: 40px 0 64px; }
  .enfx-entry__inner > h2 { margin-top: 34px; }
  /* Matches the narrow-screen gutter on .enfx-container. Changing the one
     variable keeps the padding and the full-width negative margin in step. */
  .enfx-entry__inner { --enfx-entry-gutter: 20px; }
}