.epoptic-full-bleed,
.epoptic-section,
.epoptic-section-band {
  --epoptic-grid-max: 1715px;
  --epoptic-page-pad: clamp(24px, 5.2vw, 100px);
  --epoptic-red: #b43a2c;
  --epoptic-ink: #25272b;
  --epoptic-muted: #6f7377;
  --epoptic-soft: #dce3e8;
  --epoptic-soft-2: #eef2f4;
  --epoptic-white: #ffffff;
  --epoptic-motion: 300ms ease-out;
  box-sizing: border-box;
  font-family: "Manrope", Arial, sans-serif;
  color: var(--epoptic-ink);
}

.epoptic-full-bleed *,
.epoptic-section *,
.epoptic-section-band * {
  box-sizing: border-box;
}

.epoptic-full-bleed {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.elementor-widget-epoptic-service-cards,
.elementor-widget-epoptic-stats-scroll,
.elementor-widget-epoptic-testimonials,
.elementor-widget-epoptic-partnership-spotlight,
.elementor-widget-epoptic-contact-form,
.elementor-widget-epoptic-footer,
.elementor-widget-epoptic-section {
  margin-top: clamp(34px, 3.3vw, 64px);
}

.elementor-widget-epoptic-footer {
  position: relative;
  z-index: 1100;
}

.elementor-widget-epoptic-page-intro,
.elementor-widget-epoptic-hero {
  margin-top: 0;
  margin-bottom: 0;
}

.elementor-widget-epoptic-page-intro + .elementor-widget-epoptic-service-cards {
  margin-top: clamp(18px, 2.2vw, 42px);
}

.epoptic-section {
  width: 100%;
  padding: clamp(52px, 5.4vw, 104px) 0;
}

.epoptic-section-band {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding: clamp(60px, 5.8vw, 112px) 0;
  background: var(--epoptic-soft);
  border-radius: 8px;
}

.epoptic-grid {
  width: min(calc(100% - (var(--epoptic-page-pad) * 2)), var(--epoptic-grid-max));
  margin: 0 auto;
}

/*
 * Consistent page gutter for native Elementor "boxed" sections on desktop.
 *
 * Inner pages (e.g. the services page) are built with plain Elementor
 * containers whose desktop content-width is set very wide (1650–1680px) with
 * no side padding. On laptops that width is wider than the viewport, so the
 * content runs right to the screen edge. Cap the boxed inner so it keeps the
 * same responsive gutter as the Epoptic widgets on the homepage. This only
 * ever shrinks the content when it would otherwise touch the edge; the
 * designed content-width is untouched on large screens.
 *
 * Scoped to >1024px on purpose: below that Elementor already applies its own
 * container padding, so adding the cap there would stack two gutters (making
 * mobile gutters too wide) and would narrow the container enough to push the
 * right-aligned buttons into horizontal overflow.
 */
@media (min-width: 1025px) {
  .elementor .e-con.e-con-boxed > .e-con-inner {
    max-width: min(
      var(--content-width, 1140px),
      calc(100% - (var(--epoptic-page-pad, clamp(24px, 5.2vw, 100px)) * 2))
    );
  }
}

/*
 * "Our values" grid (About page, native Elementor container 7e46732).
 *
 * On desktop it is a 2-column x 3-row grid with `grid-template-rows:
 * repeat(3, 1fr)` so the two columns line up on equal-height rows. On mobile
 * the grid drops to a single column but keeps that 3x1fr row template, which
 * stretches the first three cards to equal height while the remaining cards
 * stay at their natural height — leaving visibly uneven vertical gaps between
 * the value cards. Resetting the rows to `none` lets every card size to its
 * own content, so the spacing between all of them is uniform (the 15px
 * row-gap Elementor already sets for mobile). Scoped to this one grid on
 * phones only — nothing else is affected.
 */
@media (max-width: 767px) {
  /*
   * Specificity must beat Elementor's own per-element rule
   * (.elementor-334 .elementor-element.elementor-element-7e46732 = 0,3,0),
   * otherwise the reset is ignored and repeat(3, 1fr) stays active — which is
   * what left the Ισοτιμία → Αποτελεσματικότητα gap larger than the rest.
   * .elementor + three classes on the element = 0,4,0, so this always wins.
   */
  .elementor .elementor-element.elementor-element-7e46732.e-grid {
    --e-con-grid-template-rows: none;
  }

  /*
   * Two value cards carry leftover per-item margins on mobile
   * (Ισοτιμία 475648c: -15px / +40px, Αποτελεσματικότητα 408856a: -30px / 0)
   * that were used to fine-tune the desktop two-column layout but make the
   * mobile single-column gaps uneven — a big gap after Ισοτιμία and a pulled-up
   * Αποτελεσματικότητα. Zero them so the only spacing left is the grid's
   * uniform 15px row-gap. Elementor feeds --margin-top/-bottom into
   * margin-block-*. The trailing .e-con adds a 4th class so this is (0,4,0)
   * and reliably beats Elementor's (0,3,0) per-element rule (without it the two
   * tie and Elementor wins on source order — which is why it looked unchanged).
   */
  .elementor .elementor-element.elementor-element-475648c.e-con,
  .elementor .elementor-element.elementor-element-408856a.e-con {
    --margin-top: 0px;
    --margin-bottom: 0px;
  }
}

.epoptic-eyebrow {
  margin: 0 0 22px;
  font-size: 18px;
  line-height: 1.22;
  font-weight: 700;
  color: var(--epoptic-muted);
  text-transform: uppercase;
}

.epoptic-rich-text {
  font-size: 22px;
  line-height: 1.42;
  color: var(--epoptic-ink);
}

.epoptic-rich-text p,
.epoptic-rich-text ul {
  margin: 0 0 22px;
}

.epoptic-rich-text p:last-child,
.epoptic-rich-text ul:last-child {
  margin-bottom: 0;
}

.epoptic-rich-text ul {
  padding-left: 1.15em;
}

.epoptic-pill-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #4a4e52;
  text-decoration: none;
  font-size: 13px;
  line-height: 1;
  font-weight: 800;
  transition: gap var(--epoptic-motion);
}

.epoptic-pill-link > span:first-child {
  min-height: 30px;
  padding: 0 24px;
  border-radius: 999px;
  background: #e7ecef;
  display: inline-flex;
  align-items: center;
  transition: border-radius var(--epoptic-motion), transform var(--epoptic-motion), padding var(--epoptic-motion);
}

.epoptic-pill-link__icon {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #e7ecef;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-radius var(--epoptic-motion), transform var(--epoptic-motion), margin var(--epoptic-motion);
}

.epoptic-pill-link:hover,
.epoptic-pill-link:focus,
.epoptic-pill-link:focus-visible {
  gap: 0;
  outline: none;
}

.epoptic-pill-link:hover > span:first-child,
.epoptic-pill-link:focus > span:first-child,
.epoptic-pill-link:focus-visible > span:first-child {
  padding-right: 16px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  transform: translateX(2px);
}

.epoptic-pill-link:hover .epoptic-pill-link__icon,
.epoptic-pill-link:focus .epoptic-pill-link__icon,
.epoptic-pill-link:focus-visible .epoptic-pill-link__icon {
  margin-left: -1px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  transform: translateX(-1px);
}

/*
 * Touch devices: neutralise the pill "merge" animation. On a phone/tablet a tap
 * leaves :hover/:focus stuck, so the button froze mid-animation. We reset it to
 * its resting state for pointers that cannot truly hover, while keeping the
 * desktop hover and keyboard :focus-visible untouched.
 */
@media (hover: none) {
  .epoptic-pill-link:hover,
  .epoptic-pill-link:focus:not(:focus-visible) {
    gap: 10px;
  }

  .epoptic-pill-link:hover > span:first-child,
  .epoptic-pill-link:focus:not(:focus-visible) > span:first-child {
    padding-right: 24px;
    border-radius: 999px;
    transform: none;
  }

  .epoptic-pill-link:hover .epoptic-pill-link__icon,
  .epoptic-pill-link:focus:not(:focus-visible) .epoptic-pill-link__icon {
    margin-left: 0;
    border-radius: 50%;
    transform: none;
  }
}

.epoptic-icon-svg,
.epoptic-pill-link svg,
.epoptic-footer__cta svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
}

.epoptic-hero {
  min-height: clamp(560px, 54.6vw, 1048px);
  position: relative;
  z-index: 260;
  overflow: hidden;
  background: #141414;
}

.epoptic-hero__media {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
}

.epoptic-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0.02) 60%);
}

.epoptic-hero__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.epoptic-hero__content {
  min-height: inherit;
  position: relative;
  z-index: 1;
  display: grid;
  align-items: end;
  padding-bottom: clamp(64px, 6.5vw, 126px);
}

.epoptic-hero__title {
  width: min(100%, 860px);
  margin: 0;
  color: #ffffff;
  font-size: clamp(38px, 3.65vw, 70px);
  line-height: 1.18;
  font-weight: 800;
}

.epoptic-hero__badge {
  position: fixed;
  right: clamp(16px, 2.2vw, 42px);
  bottom: clamp(24px, 4.6vh, 54px);
  z-index: 1000;
  width: clamp(86px, 5.2vw, 114px);
  min-height: clamp(96px, 6vw, 124px);
  padding: clamp(14px, 1.1vw, 20px) clamp(13px, 1vw, 17px);
  border-radius: 15px;
  background: var(--epoptic-red);
  color: #ffffff;
  display: grid;
  align-content: center;
  justify-items: start;
  text-align: left;
  font-size: clamp(16px, 1vw, 21px);
  line-height: 1.05;
  font-weight: 900;
  box-shadow: 0 18px 36px rgba(37, 39, 43, 0.18);
  pointer-events: none;
}

.epoptic-hero__badge--link {
  pointer-events: auto;
  text-decoration: none;
  cursor: pointer;
  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    background-color 220ms ease;
}

.epoptic-hero__badge--link:hover,
.epoptic-hero__badge--link:focus,
.epoptic-hero__badge--link:focus-visible {
  color: #ffffff;
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: 0 22px 42px rgba(37, 39, 43, 0.2);
  outline: none;
}

.epoptic-hero__badge--link:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.86);
  outline-offset: 4px;
}

.epoptic-page-intro__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 25px;
  align-items: center;
}

.epoptic-page-intro--text-only {
  width: min(calc(100% - (var(--epoptic-page-pad) * 2)), var(--epoptic-grid-max));
  max-width: var(--epoptic-grid-max);
  margin-left: auto;
  margin-right: auto;
}

.epoptic-page-intro__copy {
  grid-column: 1 / span 6;
}

.epoptic-page-intro--media-left .epoptic-page-intro__copy {
  grid-column: 8 / span 5;
}

/*
 * Text-only intro: the body (left) and the audience (right) must start at the
 * exact same height, whatever the title's length or the viewport width.
 *
 * Instead of pushing the audience down with a magic offset, we promote the
 * copy column's children into this grid (display: contents on __copy) and lay
 * everything out with named areas. The title sits in its own row above, while
 * `body` and `audience` share the same row — so their tops always line up.
 */
.epoptic-page-intro--text-only .epoptic-page-intro__grid {
  width: 100%;
  max-width: 100%;
  grid-template-columns: minmax(0, 760px) minmax(360px, 540px);
  column-gap: clamp(96px, 7.4vw, 165px);
  align-items: start;
  grid-template-areas:
    "eyebrow  eyebrow"
    "title    title"
    "body     audience"
    "button   audience";
}

.epoptic-page-intro--text-only .epoptic-page-intro__copy {
  display: contents;
}

.epoptic-page-intro--text-only .epoptic-eyebrow {
  grid-area: eyebrow;
}

.epoptic-page-intro--text-only .epoptic-page-intro__title {
  grid-area: title;
}

.epoptic-page-intro--text-only .epoptic-page-intro__body {
  grid-area: body;
}

.epoptic-page-intro--text-only .epoptic-pill-link {
  grid-area: button;
  align-self: start;
}

.epoptic-page-intro--text-only .epoptic-page-intro__audience {
  grid-area: audience;
  margin-top: 0;
}

/* Below ~1024px the two columns get too tight and the heading would collapse
   into a tall, narrow tower. Stack the whole intro in one full-width column
   instead (copy block, then audience), which reads cleanly on tablets. */
@media (max-width: 1024px) {
  .epoptic-page-intro--text-only .epoptic-page-intro__grid {
    grid-template-columns: 1fr;
    grid-template-areas: none;
    gap: 32px;
  }

  .epoptic-page-intro--text-only .epoptic-page-intro__copy {
    display: block;
  }

  .epoptic-page-intro--text-only .epoptic-page-intro__audience {
    grid-area: auto;
    margin-top: 0;
  }
}

.epoptic-page-intro__media {
  grid-column: 8 / span 5;
}

.epoptic-page-intro--media-left .epoptic-page-intro__media {
  grid-column: 1 / span 6;
  order: -1;
}

.epoptic-page-intro__media img,
.epoptic-service-detail__heading img,
.epoptic-about-bio__media img {
  width: 100%;
  display: block;
  object-fit: cover;
  border-radius: 24px;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 110px), calc(100% - 110px) 100%, 0 100%);
}

.epoptic-page-intro__media img {
  aspect-ratio: 683 / 324;
}

.epoptic-page-intro__title,
.epoptic-about-bio__copy h1 {
  margin: 0 0 34px;
  font-size: clamp(42px, 2.6vw, 50px);
  line-height: 1.2;
  font-weight: 800;
}

.epoptic-page-intro--text-only .epoptic-page-intro__title {
  max-width: 760px;
  margin-bottom: 28px;
  font-size: clamp(30px, 1.64vw, 34px);
  line-height: 1.28;
  font-weight: 800;
  color: var(--epoptic-muted);
}

.epoptic-page-intro__body {
  margin-bottom: 40px;
  max-width: 660px;
}

.epoptic-page-intro--text-only .epoptic-page-intro__body {
  max-width: 690px;
  margin-bottom: 0;
  font-size: clamp(21px, 1.22vw, 25px);
  line-height: 1.42;
}

.epoptic-page-intro--text-only .epoptic-page-intro__body p {
  margin-bottom: 24px;
}

.epoptic-page-intro__audience {
  color: var(--epoptic-ink);
}

.epoptic-page-intro__audience h2 {
  margin: 0 0 8px;
  font-size: clamp(21px, 1.22vw, 25px);
  line-height: 1.35;
  font-weight: 400;
}

.epoptic-page-intro__audience ul {
  margin: 0;
  padding-left: 1.05em;
  font-size: clamp(21px, 1.22vw, 25px);
  line-height: 1.38;
}

.epoptic-page-intro__audience li + li {
  margin-top: 2px;
}

.epoptic-service-detail {
  border-radius: 8px;
}

.epoptic-service-detail__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 25px;
  align-items: start;
}

.epoptic-service-detail__heading {
  grid-column: 1 / span 6;
}

.epoptic-service-detail__copy {
  grid-column: 8 / span 5;
  padding-top: 90px;
}

.epoptic-service-detail--image-right .epoptic-service-detail__heading {
  grid-column: 7 / span 6;
}

.epoptic-service-detail--image-right .epoptic-service-detail__copy {
  grid-column: 1 / span 5;
}

.epoptic-service-detail__heading h2 {
  margin: 0 0 30px;
  font-size: clamp(36px, 2.35vw, 45px);
  line-height: 1.12;
  font-weight: 900;
}

.epoptic-service-detail__heading p {
  margin: 0 0 70px;
  font-size: 25px;
  line-height: 1.2;
  font-weight: 800;
}

.epoptic-service-detail__heading img {
  aspect-ratio: 682 / 322;
}

.epoptic-service-detail__copy h3 {
  margin: 0 0 18px;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 900;
}

.epoptic-service-detail__copy .epoptic-rich-text {
  margin-bottom: 72px;
}

.epoptic-section-title {
  margin: 0 0 54px;
  font-size: clamp(28px, 1.6vw, 30px);
  line-height: 1.32;
  font-weight: 900;
}

.epoptic-challenge-grid__items {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(37, 39, 43, 0.22);
  border-bottom: 1px solid rgba(37, 39, 43, 0.08);
}

.epoptic-challenge-grid__item {
  min-height: 128px;
  padding: 24px 28px 20px 0;
  display: grid;
  grid-template-columns: 18px 1fr;
  column-gap: 18px;
  border-right: 1px solid rgba(37, 39, 43, 0.22);
}

.epoptic-challenge-grid__item:nth-child(4n) {
  border-right: 0;
}

.epoptic-check-dot {
  width: 13px;
  height: 13px;
  margin-top: 6px;
  border-radius: 2px;
  background: #2b3033;
}

.epoptic-challenge-grid__item p {
  margin: 0;
  font-size: 22px;
  line-height: 1.36;
}

.epoptic-challenge-grid__cta {
  margin-top: 32px;
  float: right;
}

.epoptic-approach__intro {
  width: min(100%, 640px);
  margin-bottom: 82px;
}

.epoptic-approach__intro h2,
.epoptic-industries__intro h2,
.epoptic-values__intro h2 {
  margin: 0 0 30px;
  font-size: clamp(42px, 2.35vw, 50px);
  line-height: 1.15;
  font-weight: 900;
}

.epoptic-approach__intro p,
.epoptic-industries__intro p,
.epoptic-values__intro p {
  margin: 0;
  font-size: 26px;
  line-height: 1.54;
}

.epoptic-approach__steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  position: relative;
  column-gap: 42px;
  margin-bottom: 80px;
}

.epoptic-approach__steps::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 16px;
  height: 2px;
  background: rgba(37, 39, 43, 0.36);
}

.epoptic-approach__step {
  position: relative;
  padding-top: 54px;
}

.epoptic-approach__mark {
  position: absolute;
  top: 0;
  left: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid #2c3135;
  background: var(--epoptic-white);
  z-index: 1;
}

.epoptic-approach__mark::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 5px;
  border-left: 2px solid #2c3135;
  border-bottom: 2px solid #2c3135;
  transform: rotate(-45deg);
  left: 9px;
  top: 10px;
}

.epoptic-approach__step h3 {
  margin: 0 0 10px;
  font-size: 34px;
  line-height: 1.1;
}

.epoptic-approach__step p {
  margin: 0;
  font-size: 18px;
  line-height: 1.28;
}

.epoptic-approach__body {
  width: min(100%, 1040px);
  font-size: 18px;
}

.epoptic-about-bio__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 25px;
  align-items: center;
}

.epoptic-about-bio__media {
  grid-column: 1 / span 6;
}

.epoptic-about-bio__copy {
  grid-column: 8 / span 5;
}

.epoptic-about-bio__media img {
  aspect-ratio: 683 / 673;
  filter: grayscale(1);
}

.epoptic-about-bio__signature {
  margin: 24px 0 26px;
  color: #8a8c8f;
  font-size: 28px;
  line-height: 1.25;
  font-weight: 500;
}

.epoptic-industries {
  background: #f6f6f6;
}

.epoptic-industries__intro {
  width: min(100%, 670px);
  margin-bottom: 72px;
}

.epoptic-industries__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  row-gap: 54px;
}

.epoptic-industries__grid span {
  min-height: 70px;
  padding: 0 34px;
  border-right: 2px solid rgba(37, 39, 43, 0.24);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 800;
  color: #62666a;
}

.epoptic-industries__grid span:nth-child(4n) {
  border-right: 0;
}

.epoptic-values {
  position: relative;
  overflow: hidden;
}

.epoptic-values__lines {
  position: absolute;
  right: -90px;
  bottom: -120px;
  width: min(58vw, 880px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid rgba(255, 255, 255, 0.82);
  box-shadow:
    0 0 0 16px transparent,
    0 0 0 24px rgba(255, 255, 255, 0.72),
    0 0 0 44px transparent,
    0 0 0 52px rgba(255, 255, 255, 0.62),
    0 0 0 72px transparent,
    0 0 0 80px rgba(255, 255, 255, 0.52),
    0 0 0 100px transparent,
    0 0 0 108px rgba(255, 255, 255, 0.42);
}

.epoptic-values .epoptic-grid {
  position: relative;
  z-index: 1;
}

.epoptic-values__intro {
  width: min(100%, 760px);
  margin-bottom: 74px;
}

.epoptic-values__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 130px;
  row-gap: 54px;
  width: min(100%, 1280px);
}

.epoptic-values__grid article h3 {
  margin: 0 0 16px;
  font-size: 25px;
  line-height: 1.24;
}

.epoptic-values__grid article p {
  margin: 0;
  font-size: 20px;
  line-height: 1.35;
}

.epoptic-values__standards {
  margin-top: 70px;
}

.epoptic-values__standards p {
  margin: 0 0 22px;
  font-size: 20px;
}

.epoptic-values__logos {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}

.epoptic-values__logos span {
  min-width: 88px;
  min-height: 46px;
  padding: 0 12px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.82);
  color: #32669a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  font-weight: 900;
}

.epoptic-cta-band__inner {
  min-height: 174px;
  padding: 42px 56px;
  border-radius: 8px;
  background: var(--epoptic-soft);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 48px;
  align-items: center;
}

.epoptic-cta-band__inner .epoptic-rich-text {
  max-width: 760px;
  font-size: 24px;
  line-height: 1.25;
  font-weight: 600;
}

.epoptic-contact-form {
  --epoptic-contact-outer-width: 100%;
  --epoptic-contact-outer-max-width: 100%;
  --epoptic-contact-outer-column-gap: 48px;
  --epoptic-contact-pixel-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 643 835' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M34 0H609C627.8 0 643 15.2 643 34V690C643 701.5 637.6 712.4 628.4 719.5L508.5 820.5C497.5 829.7 483.6 835 469.2 835H34C15.2 835 0 819.8 0 801V34C0 15.2 15.2 0 34 0Z'/%3E%3C/svg%3E");
  --epoptic-contact-card-mask: var(--epoptic-contact-pixel-mask);
  --epoptic-contact-mobile-card-mask: none;
  --epoptic-contact-mobile-card-radius: 24px;
  --epoptic-contact-card-width: 528px;
  --epoptic-contact-tablet-card-width: 100%;
  --epoptic-contact-card-min-height: 684px;
  --epoptic-contact-card-padding-top: 31px;
  --epoptic-contact-card-padding-right: 154px;
  --epoptic-contact-card-padding-bottom: 38px;
  --epoptic-contact-card-padding-left: 30px;
  --epoptic-contact-tablet-right-space: 24px;
  --epoptic-contact-card-bg: #dce4e7;
  --epoptic-contact-card-bg-image: none;
  --epoptic-contact-card-bg-position: center center;
  --epoptic-contact-card-bg-size: cover;
  --epoptic-contact-card-bg-custom-size: 100%;
  --epoptic-contact-card-bg-repeat: no-repeat;
  --epoptic-contact-title-color: #000000;
  --epoptic-contact-title-gap: 39px;
  --epoptic-contact-field-width: 328px;
  --epoptic-contact-field-height: 50px;
  --epoptic-contact-textarea-height: 123px;
  --epoptic-contact-textarea-padding-top: 23px;
  --epoptic-contact-field-gap: 21px;
  --epoptic-contact-field-radius: 8px;
  --epoptic-contact-field-bg: #ffffff;
  --epoptic-contact-field-text: #25282c;
  --epoptic-contact-placeholder: #b8b8b8;
  --epoptic-contact-field-border: #c8cfd2;
  --epoptic-contact-field-shadow: 0 2px 5px rgba(37, 39, 43, 0.22);
  --epoptic-contact-message-label-color: #000000;
  --epoptic-contact-terms-color: #000000;
  --epoptic-contact-button-width: 328px;
  --epoptic-contact-button-height: 44px;
  --epoptic-contact-button-radius: 999px;
  --epoptic-contact-button-bg: #b33a2d;
  --epoptic-contact-button-text: #ffffff;
  --epoptic-contact-button-hover-bg: #9f3026;
  --epoptic-contact-button-hover-text: #ffffff;
  --epoptic-contact-button-shadow: 0 2px 5px rgba(37, 39, 43, 0.25);
}

.elementor-widget-epoptic-contact-form {
  margin-top: 0;
}

.epoptic-contact-form.epoptic-section {
  padding: 0;
}

.epoptic-contact-form__grid {
  width: var(--epoptic-contact-outer-width);
  max-width: var(--epoptic-contact-outer-max-width);
  margin-left: 0;
  margin-right: 0;
  display: grid;
  grid-template-columns: minmax(0, var(--epoptic-contact-card-width)) minmax(0, 1fr);
  column-gap: var(--epoptic-contact-outer-column-gap);
  align-items: start;
}

.epoptic-contact-form__card {
  box-sizing: border-box;
  width: var(--epoptic-contact-card-width);
  max-width: 100%;
  min-height: var(--epoptic-contact-card-min-height);
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border: 0;
  border-radius: 0;
  background-color: var(--epoptic-contact-card-bg);
  background-image: var(--epoptic-contact-card-bg-image);
  background-position: var(--epoptic-contact-card-bg-position);
  background-repeat: var(--epoptic-contact-card-bg-repeat);
  background-size: var(--epoptic-contact-card-bg-size);
  -webkit-mask-image: var(--epoptic-contact-card-mask);
  mask-image: var(--epoptic-contact-card-mask);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  padding:
    var(--epoptic-contact-card-padding-top)
    var(--epoptic-contact-card-padding-right)
    var(--epoptic-contact-card-padding-bottom)
    var(--epoptic-contact-card-padding-left);
}

@media (max-width: 767px) {
  .epoptic-contact-form__card {
    border-radius: var(--epoptic-contact-mobile-card-radius);
    -webkit-mask-image: var(--epoptic-contact-mobile-card-mask);
    mask-image: var(--epoptic-contact-mobile-card-mask);
  }
}

.epoptic-contact-form__card * {
  box-sizing: border-box;
}

.epoptic-contact-form__card > * {
  position: relative;
  z-index: 3;
}

.epoptic-contact-form__card h2 {
  width: min(100%, var(--epoptic-contact-field-width));
  max-width: 100%;
  margin: 0 0 var(--epoptic-contact-title-gap);
  color: var(--epoptic-contact-title-color);
  font-size: 22px;
  line-height: 1.16;
  font-weight: 800;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.epoptic-contact-form__native,
.epoptic-contact-form__cf7,
.epoptic-contact-form__cf7 .wpcf7,
.epoptic-contact-form__cf7 .wpcf7-form {
  width: min(100%, var(--epoptic-contact-field-width));
  max-width: 100%;
}

.epoptic-contact-form__native,
.epoptic-contact-form__cf7 .wpcf7-form {
  display: grid;
  gap: var(--epoptic-contact-field-gap);
}

.epoptic-contact-form__card label,
.epoptic-contact-form__cf7 p {
  display: block;
  margin: 0;
}

.epoptic-contact-form__card label > span:not(.epoptic-contact-form__message-text):not(.wpcf7-form-control-wrap),
.epoptic-contact-form__cf7 label {
  font-size: 0;
  line-height: 0;
}

.epoptic-contact-form__cf7 .wpcf7-form-control-wrap {
  display: block;
}

.epoptic-contact-form__card input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.epoptic-contact-form__card textarea,
.epoptic-contact-form__card .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance):not(.wpcf7-checkbox):not(.wpcf7-radio) {
  width: 100%;
  max-width: 100%;
  min-height: var(--epoptic-contact-field-height);
  border: 1px solid var(--epoptic-contact-field-border);
  border-radius: var(--epoptic-contact-field-radius);
  background: var(--epoptic-contact-field-bg);
  color: var(--epoptic-contact-field-text);
  font: inherit;
  font-size: 15px;
  line-height: 1.2;
  box-shadow: var(--epoptic-contact-field-shadow);
  outline: none;
  padding: 0 16px;
}

.epoptic-contact-form__card input::placeholder,
.epoptic-contact-form__card textarea::placeholder {
  color: var(--epoptic-contact-placeholder);
  opacity: 1;
}

.epoptic-contact-form__card input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus,
.epoptic-contact-form__card textarea:focus,
.epoptic-contact-form__card .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance):not(.wpcf7-checkbox):not(.wpcf7-radio):focus {
  border-color: color-mix(in srgb, var(--epoptic-contact-field-border), #25282c 22%);
}

.epoptic-contact-form__card textarea,
.epoptic-contact-form__card .wpcf7-textarea {
  min-height: var(--epoptic-contact-textarea-height);
  padding-top: var(--epoptic-contact-textarea-padding-top) !important;
  padding-right: 16px;
  padding-left: 16px;
  resize: vertical;
}

.epoptic-contact-form__message {
  display: grid !important;
  gap: 13px;
}

.epoptic-contact-form__cf7 label.epoptic-contact-form__message {
  display: grid;
  gap: 13px;
  font-size: inherit;
  line-height: normal;
}

.epoptic-contact-form__message-text,
.epoptic-contact-form__cf7-message-label {
  display: block;
  color: var(--epoptic-contact-message-label-color);
  font-size: 13px;
  line-height: 1.06;
  font-weight: 400;
  overflow-wrap: anywhere;
}

.epoptic-contact-form__cf7-message-label {
  width: min(100%, var(--epoptic-contact-field-width));
  max-width: 100%;
  margin: 0 0 -8px;
}

.epoptic-contact-form__terms,
.epoptic-contact-form__cf7-terms {
  width: min(100%, var(--epoptic-contact-field-width));
  max-width: 100%;
  margin: -3px 0 0;
  color: var(--epoptic-contact-terms-color);
  font-size: 9px;
  line-height: 1.08;
  font-weight: 400;
  overflow-wrap: anywhere;
}

.epoptic-contact-form__terms p,
.epoptic-contact-form__cf7-terms p {
  margin: 0;
}

.epoptic-contact-form__terms strong,
.epoptic-contact-form__cf7-terms strong {
  font-weight: 800;
}

.epoptic-contact-form__card button,
.epoptic-contact-form__card input[type="submit"],
.epoptic-contact-form__card .wpcf7-submit {
  width: min(100%, var(--epoptic-contact-button-width));
  max-width: 100%;
  min-height: var(--epoptic-contact-button-height);
  margin: 0;
  border: 0;
  border-radius: var(--epoptic-contact-button-radius);
  background: var(--epoptic-contact-button-bg);
  color: var(--epoptic-contact-button-text);
  font-size: 15px;
  line-height: 1;
  font-weight: 800;
  cursor: pointer;
  box-shadow: var(--epoptic-contact-button-shadow);
  transition:
    transform var(--epoptic-motion),
    background-color var(--epoptic-motion),
    color var(--epoptic-motion);
}

.epoptic-contact-form__card button:hover,
.epoptic-contact-form__card button:focus-visible,
.epoptic-contact-form__card input[type="submit"]:hover,
.epoptic-contact-form__card input[type="submit"]:focus-visible,
.epoptic-contact-form__card .wpcf7-submit:hover,
.epoptic-contact-form__card .wpcf7-submit:focus-visible {
  background: var(--epoptic-contact-button-hover-bg);
  color: var(--epoptic-contact-button-hover-text);
  transform: translateY(-1px);
}

.epoptic-contact-form__cf7 .wpcf7-not-valid-tip {
  width: min(100%, var(--epoptic-contact-field-width));
  max-width: 100%;
  margin-top: 5px;
  font-size: 10px;
  line-height: 1.2;
}

.epoptic-contact-form__cf7 .wpcf7-response-output {
  width: min(100%, var(--epoptic-contact-field-width));
  max-width: 100%;
  margin: 8px 0 0;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 11px;
  line-height: 1.25;
}

.epoptic-contact-form__info {
  display: grid;
  gap: 42px;
}

.epoptic-contact-form__info article {
  min-height: 160px;
  padding: 38px 34px;
  border-radius: 6px;
  background: var(--epoptic-soft);
}

.epoptic-contact-form__info h3 {
  margin: 0 0 32px;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 500;
}

.epoptic-contact-form__info p {
  margin: 0;
  font-size: 24px;
  line-height: 1.35;
}
.epoptic-booking__frame {
  overflow: hidden;
  min-height: 740px;
  border: 1px solid rgba(37, 39, 43, 0.16);
  border-radius: 10px;
  background: #ffffff;
}

.epoptic-booking__frame iframe {
  width: 100%;
  height: 740px;
  border: 0;
  display: block;
}

.epoptic-booking__mock {
  min-height: 740px;
  display: grid;
  grid-template-columns: 1.1fr 1fr 1fr;
}

.epoptic-booking__mock > div {
  padding: 64px 52px;
  border-right: 1px solid rgba(37, 39, 43, 0.16);
}

.epoptic-booking__mock > div:last-child {
  border-right: 0;
}

.epoptic-booking__mock h2 {
  margin: 12px 0 34px;
  font-size: 30px;
}

.epoptic-booking__mock h3 {
  margin: 0 0 42px;
  font-size: 24px;
}

.epoptic-booking__days {
  display: grid;
  grid-template-columns: repeat(3, 56px);
  gap: 16px;
}

.epoptic-booking__days span,
.epoptic-booking__mock button {
  min-height: 44px;
  border: 1px solid #0b72ff;
  border-radius: 8px;
  background: #ffffff;
  color: #0b72ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
}

.epoptic-booking__days .is-active {
  background: #0b72ff;
  color: #ffffff;
}

.epoptic-booking__mock button {
  width: 100%;
  margin-bottom: 14px;
}

.epoptic-footer {
  --epoptic-footer-brand-image-width: 265px;
  --epoptic-footer-brand-image-max-height: 92px;
  position: relative;
  z-index: 1100;
  overflow: hidden;
  min-height: 320px;
  padding: 70px 0 48px;
  background: var(--epoptic-red);
  color: #ffffff;
}

.epoptic-footer::after {
  content: "Epoptic";
  position: absolute;
  left: 370px;
  bottom: -72px;
  color: rgba(255, 255, 255, 0.06);
  font-size: clamp(140px, 16vw, 300px);
  line-height: 1;
  font-weight: 900;
}

.epoptic-footer__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 25px;
  align-items: end;
}

.epoptic-footer__brand {
  grid-column: 1 / span 4;
}

.epoptic-footer__logo {
  margin-bottom: 26px;
  color: #ffffff;
  font-size: 54px;
  line-height: 1;
  font-weight: 500;
}

.epoptic-footer__logo--image {
  line-height: 0;
}

.epoptic-footer__brand-image {
  display: block;
  width: var(--epoptic-footer-brand-image-width);
  max-width: 100%;
  max-height: var(--epoptic-footer-brand-image-max-height);
  height: auto;
  object-fit: contain;
  object-position: left center;
}

.epoptic-footer__brand p {
  margin: 0 0 28px;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 800;
}

.epoptic-footer__brand small {
  display: block;
  margin-bottom: 18px;
  font-size: 18px;
  line-height: 1.2;
  color: rgba(255, 255, 255, 0.72);
}

.epoptic-footer__standards-image {
  display: block;
  width: min(100%, 412px);
  max-width: 100%;
  height: auto;
}

.epoptic-footer__nav {
  grid-column: 5 / span 3;
}

.epoptic-footer__social {
  grid-column: 9 / span 2;
}

.epoptic-footer__nav,
.epoptic-footer__social {
  display: grid;
  gap: 22px;
}

.epoptic-footer a {
  color: #ffffff;
  text-decoration: none;
  font-size: 20px;
  line-height: 1.15;
}

.epoptic-footer__cta {
  --epoptic-footer-cta-bg: #ffffff;
  --epoptic-footer-cta-text: #252220;
  --epoptic-footer-cta-hover-bg: #ffffff;
  --epoptic-footer-cta-hover-text: #252220;
  --epoptic-footer-cta-height: 46px;
  --epoptic-footer-cta-gap: 10px;
  --epoptic-footer-cta-duration: 460ms;
  --epoptic-footer-cta-ease: cubic-bezier(0.22, 1, 0.36, 1);
  grid-column: 11 / span 2;
  justify-self: end;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--epoptic-footer-cta-gap);
  min-height: var(--epoptic-footer-cta-height);
  color: var(--epoptic-footer-cta-text);
  isolation: isolate;
  transition:
    gap var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease),
    transform var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease);
}

.epoptic-footer__cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 999px;
  background: var(--epoptic-footer-cta-hover-bg);
  opacity: 0;
  transform: scale(0.992);
  transform-origin: center;
  transition:
    opacity 340ms var(--epoptic-footer-cta-ease),
    transform var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease);
}

.epoptic-footer__cta span {
  position: relative;
  z-index: 1;
  min-height: var(--epoptic-footer-cta-height);
  height: var(--epoptic-footer-cta-height);
  padding: 0 28px;
  border-radius: 999px;
  background: var(--epoptic-footer-cta-bg);
  color: var(--epoptic-footer-cta-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  transition:
    background-color 340ms var(--epoptic-footer-cta-ease),
    color 340ms var(--epoptic-footer-cta-ease),
    transform var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease),
    border-radius var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease),
    margin var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease),
    padding var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease);
}

.epoptic-footer__cta span:last-child {
  width: var(--epoptic-footer-cta-height);
  flex: 0 0 var(--epoptic-footer-cta-height);
  padding: 0;
  border-radius: 50%;
  overflow: hidden;
}

.epoptic-footer__cta span:last-child svg,
.epoptic-footer__cta span:last-child i {
  transform: rotate(45deg);
  transition: transform var(--epoptic-footer-cta-duration) var(--epoptic-footer-cta-ease);
  will-change: transform;
}

.epoptic-footer__cta:hover,
.epoptic-footer__cta:focus,
.epoptic-footer__cta:focus-visible {
  gap: 0;
  color: var(--epoptic-footer-cta-hover-text);
  outline: none;
  transform: translateY(-1px);
}

.epoptic-footer__cta:hover::before,
.epoptic-footer__cta:focus::before,
.epoptic-footer__cta:focus-visible::before {
  opacity: 1;
  transform: scale(1);
}

.epoptic-footer__cta:hover span:first-child,
.epoptic-footer__cta:focus span:first-child,
.epoptic-footer__cta:focus-visible span:first-child {
  padding-right: 24px;
  background: transparent;
  color: var(--epoptic-footer-cta-hover-text);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  transform: scale(0.985);
  margin-right: -1px;
}

.epoptic-footer__cta:hover span:last-child,
.epoptic-footer__cta:focus span:last-child,
.epoptic-footer__cta:focus-visible span:last-child {
  background: transparent;
  color: var(--epoptic-footer-cta-hover-text);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  transform: scale(0.985);
  margin-left: -1px;
}

.epoptic-footer__cta:hover span:last-child svg,
.epoptic-footer__cta:focus span:last-child svg,
.epoptic-footer__cta:focus-visible span:last-child svg,
.epoptic-footer__cta:hover span:last-child i,
.epoptic-footer__cta:focus span:last-child i,
.epoptic-footer__cta:focus-visible span:last-child i {
  transform: rotate(0deg);
}

/*
 * Touch devices: hold the footer CTA in its resting state so a tap does not
 * leave the pill split / arrow rotated. Desktop hover and keyboard
 * :focus-visible are untouched.
 */
@media (hover: none) {
  .epoptic-footer__cta:hover,
  .epoptic-footer__cta:focus:not(:focus-visible) {
    gap: var(--epoptic-footer-cta-gap);
    color: var(--epoptic-footer-cta-text);
    transform: none;
  }

  .epoptic-footer__cta:hover::before,
  .epoptic-footer__cta:focus:not(:focus-visible)::before {
    opacity: 0;
    transform: scale(0.992);
  }

  .epoptic-footer__cta:hover span:first-child,
  .epoptic-footer__cta:focus:not(:focus-visible) span:first-child {
    padding: 0 28px;
    background: var(--epoptic-footer-cta-bg);
    color: var(--epoptic-footer-cta-text);
    border-radius: 999px;
    transform: none;
    margin-right: 0;
  }

  .epoptic-footer__cta:hover span:last-child,
  .epoptic-footer__cta:focus:not(:focus-visible) span:last-child {
    background: var(--epoptic-footer-cta-bg);
    color: var(--epoptic-footer-cta-text);
    border-radius: 50%;
    transform: none;
    margin-left: 0;
  }

  .epoptic-footer__cta:hover span:last-child svg,
  .epoptic-footer__cta:focus:not(:focus-visible) span:last-child svg,
  .epoptic-footer__cta:hover span:last-child i,
  .epoptic-footer__cta:focus:not(:focus-visible) span:last-child i {
    transform: rotate(45deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .epoptic-full-bleed *,
  .epoptic-section *,
  .epoptic-section-band * {
    transition: none !important;
  }
}

@media (max-width: 1180px) {
  .epoptic-challenge-grid__items,
  .epoptic-industries__grid,
  .epoptic-approach__steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .epoptic-challenge-grid__item:nth-child(4n),
  .epoptic-industries__grid span:nth-child(4n) {
    border-right: 1px solid rgba(37, 39, 43, 0.22);
  }

  .epoptic-challenge-grid__item:nth-child(2n),
  .epoptic-industries__grid span:nth-child(2n) {
    border-right: 0;
  }
}

@media (max-width: 1024px) {
  .epoptic-contact-form {
    --epoptic-contact-card-min-height: auto;
    --epoptic-contact-field-width: 100%;
    --epoptic-contact-button-width: 100%;
  }

  .epoptic-contact-form__grid {
    grid-template-columns: minmax(0, var(--epoptic-contact-tablet-card-width));
  }

  .epoptic-contact-form__card {
    width: var(--epoptic-contact-tablet-card-width);
    padding-right: min(var(--epoptic-contact-card-padding-right), var(--epoptic-contact-tablet-right-space));
  }
}

@media (max-width: 860px) {
  .epoptic-section,
  .epoptic-section-band {
    padding: 46px 0;
  }

  .epoptic-page-intro__grid,
  .epoptic-service-detail__grid,
  .epoptic-about-bio__grid,
  .epoptic-contact-form__grid,
  .epoptic-footer__grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .epoptic-page-intro__copy,
  .epoptic-page-intro--media-left .epoptic-page-intro__copy,
  .epoptic-page-intro--text-only .epoptic-page-intro__copy,
  .epoptic-page-intro__media,
  .epoptic-page-intro--media-left .epoptic-page-intro__media,
  .epoptic-service-detail__heading,
  .epoptic-service-detail__copy,
  .epoptic-service-detail--image-right .epoptic-service-detail__heading,
  .epoptic-service-detail--image-right .epoptic-service-detail__copy,
  .epoptic-about-bio__media,
  .epoptic-about-bio__copy,
  .epoptic-contact-form__card,
  .epoptic-contact-form__info,
  .epoptic-footer__brand,
  .epoptic-footer__nav,
  .epoptic-footer__social,
  .epoptic-footer__cta {
    grid-column: auto;
  }

  .epoptic-page-intro--media-left .epoptic-page-intro__media {
    order: 0;
  }

  /* Stacking itself is handled by the max-width:1024px query above; here we
     only tighten the side gutter on small screens. */
  .epoptic-page-intro--text-only .epoptic-page-intro__grid {
    width: min(calc(100% - 32px), var(--epoptic-grid-max));
    gap: 32px;
  }

  .epoptic-service-detail__copy {
    padding-top: 0;
  }

  .epoptic-service-detail__copy .epoptic-rich-text {
    margin-bottom: 34px;
  }

  .epoptic-hero__badge {
    right: 18px;
    bottom: 24px;
    width: 88px;
    min-height: 102px;
    padding: 14px 12px;
    border-radius: 14px;
    font-size: 17px;
  }

  .epoptic-approach__steps::before {
    display: none;
  }

  .epoptic-values__grid,
  .epoptic-booking__mock {
    grid-template-columns: 1fr;
  }

  .epoptic-booking__mock > div {
    border-right: 0;
    border-bottom: 1px solid rgba(37, 39, 43, 0.16);
  }

  .epoptic-contact-form__card {
    width: min(100%, var(--epoptic-contact-card-width));
  }

  .epoptic-contact-form__card input,
  .epoptic-contact-form__card textarea,
  .epoptic-contact-form__card button {
    font-size: 15px;
  }

  .epoptic-contact-form__card button,
  .epoptic-contact-form__card input[type="submit"],
  .epoptic-contact-form__card .wpcf7-submit {
    font-size: 15px;
  }

  .epoptic-footer__cta {
    justify-self: start;
  }
}

.elementor-widget-epoptic-contact-form {
  margin-top: 0;
}

@media (max-width: 640px) {
  body.elementor-page {
    overflow-x: clip;
  }

  .epoptic-grid {
    width: min(calc(100% - 32px), var(--epoptic-grid-max));
  }

  .elementor-widget-epoptic-service-cards,
  .elementor-widget-epoptic-stats-scroll,
  .elementor-widget-epoptic-testimonials,
  .elementor-widget-epoptic-partnership-spotlight,
  .elementor-widget-epoptic-contact-form,
  .elementor-widget-epoptic-footer,
  .elementor-widget-epoptic-section {
    margin-top: 38px;
  }

  .elementor-widget-epoptic-page-intro + .elementor-widget-epoptic-service-cards {
    margin-top: 22px;
  }

  .epoptic-rich-text,
  .epoptic-page-intro__body,
  .epoptic-challenge-grid__item p,
  .epoptic-approach__intro p,
  .epoptic-industries__intro p,
  .epoptic-values__intro p,
  .epoptic-values__grid article p {
    font-size: 17px;
  }

  .epoptic-hero {
    min-height: calc(100svh - 98px);
    min-height: calc(100dvh - 98px);
  }

  .epoptic-hero__content {
    display: grid;
    align-items: end;
    padding-bottom: 44px;
  }

  .epoptic-hero__title {
    width: min(calc(100vw - 32px), 342px);
    max-width: min(calc(100vw - 32px), 342px);
    font-size: 30px;
    line-height: 1.15;
  }

  .epoptic-hero__badge {
    position: fixed;
    right: 12px;
    bottom: 14px;
    justify-self: auto;
    width: 76px;
    min-height: 86px;
    max-width: none;
    margin-top: 0;
    padding: 11px 10px;
    border-radius: 13px;
    font-size: 15px;
    line-height: 1.05;
  }

  .epoptic-page-intro__title,
  .epoptic-about-bio__copy h1,
  .epoptic-approach__intro h2,
  .epoptic-industries__intro h2,
  .epoptic-values__intro h2 {
    font-size: 34px;
  }

  .epoptic-challenge-grid__items,
  .epoptic-industries__grid,
  .epoptic-approach__steps {
    grid-template-columns: 1fr;
  }

  .epoptic-challenge-grid__item,
  .epoptic-challenge-grid__item:nth-child(2n),
  .epoptic-industries__grid span,
  .epoptic-industries__grid span:nth-child(2n) {
    border-right: 0;
  }

  .epoptic-cta-band__inner {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 28px 22px;
  }

  .epoptic-footer::after {
    left: 24px;
  }
}

/* ==========================================================================
   Secondary footer (Epoptic Footer 2): icon social row + copyright
   ========================================================================== */
.elementor-widget-epoptic-footer-secondary {
  position: relative;
  z-index: 1100;
  margin-top: clamp(34px, 3.3vw, 64px);
}

.epoptic-footer--secondary {
  --epoptic-footer-social-size: 26px;
}

.epoptic-footer--secondary .epoptic-footer__bg-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-repeat: no-repeat;
  background-position: 22% 55%;
  background-size: 700px auto;
  opacity: 0.08;
  pointer-events: none;
}

.epoptic-footer--secondary.epoptic-footer--has-bg::after {
  display: none;
}

/* Bottom content area (renders a chosen Elementor template at the footer end). */
.epoptic-footer--secondary .epoptic-footer__extra {
  position: relative;
  z-index: 1;
  width: min(calc(100% - (var(--epoptic-page-pad) * 2)), var(--epoptic-grid-max));
  margin: 0 auto;
}

.epoptic-footer--secondary .epoptic-footer__extra--filled {
  margin-top: 28px;
}

.epoptic-footer--secondary .epoptic-footer__nav {
  grid-column: 5 / span 4;
}

.epoptic-footer--secondary .epoptic-footer__nav a {
  transition: color 300ms ease-out;
}

.epoptic-footer--secondary .epoptic-footer__aside {
  grid-column: 9 / span 4;
  justify-self: end;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 18px;
}

.epoptic-footer--secondary .epoptic-footer__social {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 14px;
}

.epoptic-footer--secondary .epoptic-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  transition:
    opacity 300ms ease-out,
    transform 300ms ease-out;
}

.epoptic-footer--secondary .epoptic-footer__social-link:hover,
.epoptic-footer--secondary .epoptic-footer__social-link:focus,
.epoptic-footer--secondary .epoptic-footer__social-link:focus-visible {
  opacity: 0.82;
  transform: translateY(-1px);
  outline: none;
}

.epoptic-footer--secondary .epoptic-footer__social-icon {
  display: block;
  width: var(--epoptic-footer-social-size, 26px);
  height: var(--epoptic-footer-social-size, 26px);
  background-color: var(--epoptic-footer-social-color, #edebe8);
  -webkit-mask: var(--epoptic-footer-social-mask) no-repeat center / contain;
  mask: var(--epoptic-footer-social-mask) no-repeat center / contain;
  transition: background-color 300ms ease-out;
}

.epoptic-footer--secondary .epoptic-footer__social-link:hover .epoptic-footer__social-icon,
.epoptic-footer--secondary .epoptic-footer__social-link:focus .epoptic-footer__social-icon,
.epoptic-footer--secondary .epoptic-footer__social-link:focus-visible .epoptic-footer__social-icon {
  background-color: var(--epoptic-footer-social-hover-color, var(--epoptic-footer-social-color, #edebe8));
}

/* Bottom bar: a 12-column grid that mirrors the footer grid, so the copyright
   lines up under the logo and the legal links line up under the services nav.
   Item alignment is overridable per device via the widget control. */
.epoptic-footer--secondary .epoptic-footer__legal {
  position: relative;
  z-index: 1;
  width: min(calc(100% - (var(--epoptic-page-pad) * 2)), var(--epoptic-grid-max));
  margin: 48px auto 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 25px;
  row-gap: 12px;
  align-items: center;
  justify-items: start;
}

.epoptic-footer--secondary .epoptic-footer__copyright {
  grid-column: 1 / span 4;
  margin: 0;
  font-size: 15px;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.6);
}

.epoptic-footer--secondary .epoptic-footer__legal-links {
  grid-column: 5 / span 8;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 12px;
  row-gap: 6px;
}

.epoptic-footer--secondary .epoptic-footer__legal-link {
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  font-size: 15px;
  line-height: 1.3;
  transition: color 300ms ease-out;
}

.epoptic-footer--secondary .epoptic-footer__legal-link:hover,
.epoptic-footer--secondary .epoptic-footer__legal-link:focus,
.epoptic-footer--secondary .epoptic-footer__legal-link:focus-visible {
  color: #ffffff;
  outline: none;
}

.epoptic-footer--secondary .epoptic-footer__legal-sep {
  color: rgba(255, 255, 255, 0.32);
  font-size: 15px;
  line-height: 1;
  user-select: none;
}

/* Icon circle on the CTA. Uses the CTA colour variables so the Button colour
   controls recolour the arrow pill together with the label pill; falls back to
   the original white circle / dark arrow when no override is set. */
.epoptic-footer--secondary .epoptic-footer__cta span:last-child {
  background: var(--epoptic-footer-cta-bg, #ffffff);
  color: var(--epoptic-footer-cta-text, #252220);
}

/* Keep the CTA's outer width fixed on hover so the left-aligned social row
   above it does not shift while the button plays its animation. The visual
   hover (lift, white pill fade, arrow rotation) stays intact. */
.epoptic-footer--secondary .epoptic-footer__cta:hover,
.epoptic-footer--secondary .epoptic-footer__cta:focus,
.epoptic-footer--secondary .epoptic-footer__cta:focus-visible {
  gap: var(--epoptic-footer-cta-gap);
}

.epoptic-footer--secondary .epoptic-footer__cta:hover span:first-child,
.epoptic-footer--secondary .epoptic-footer__cta:focus span:first-child,
.epoptic-footer--secondary .epoptic-footer__cta:focus-visible span:first-child {
  padding-right: 28px;
  margin-right: 0;
}

.epoptic-footer--secondary .epoptic-footer__cta:hover span:last-child,
.epoptic-footer--secondary .epoptic-footer__cta:focus span:last-child,
.epoptic-footer--secondary .epoptic-footer__cta:focus-visible span:last-child {
  margin-left: 0;
}

@media (max-width: 860px) {
  .epoptic-footer--secondary .epoptic-footer__nav,
  .epoptic-footer--secondary .epoptic-footer__aside {
    grid-column: auto;
  }

  .epoptic-footer--secondary .epoptic-footer__aside {
    justify-self: start;
    align-self: auto;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 26px;
  }

  .epoptic-footer--secondary .epoptic-footer__social {
    justify-content: flex-start;
  }

  .epoptic-footer--secondary .epoptic-footer__legal {
    grid-template-columns: 1fr;
  }

  .epoptic-footer--secondary .epoptic-footer__copyright,
  .epoptic-footer--secondary .epoptic-footer__legal-links {
    grid-column: auto;
  }
}
