/*
 * ALMARA How It Works v1.0.0 — B2C Guest Page / Full CSS
 * Scope: How-it-works guest page only. Header v2.3 remains untouched.
 * Architecture: Elementor structure/content, CSS visual system.
 */

:root {
  --alm-v14-navy: #042034;
  --alm-v14-deep: #042034;
  --alm-v14-deeper: #021827;
  --alm-v14-aqua: #42919D;
  --alm-v14-aqua-deep: #216B7E;
  --alm-v14-sky: #79ACD3;
  --alm-v14-sand: #F4EDE4;
  --alm-v14-cream: #FBF7F0;
  --alm-v14-coral: #EDA88E;
  --alm-v14-coral-soft: #EDA88E;
  --alm-v14-coral-strong: #DF6541;
  --alm-v14-earth: #614A2B;
  --alm-v14-tan: #B28A61;
  --alm-v14-teal: #216B7E;
  --alm-v14-ink: #042034;
  --alm-v14-muted: rgba(4, 32, 52, .82);
  --alm-v14-border: rgba(4, 32, 52, .12);
  --alm-v14-shadow: 0 22px 60px rgba(4, 32, 52, .12);
  --alm-v14-shadow-strong: 0 30px 90px rgba(4, 32, 52, .30);
  --alm-v14-radius: 24px;
  --alm-v14-radius-lg: 32px;
  --alm-v14-section-x: clamp(22px, 5vw, 78px);
  --alm-v14-section-y: clamp(70px, 7vw, 112px);
  --alm-v14-max: 1320px;
}

.almara-page-how-it-works,
.almara-page-how-it-works * { box-sizing: border-box; }

.almara-page-how-it-works {
  background: var(--alm-v14-cream);
  color: var(--alm-v14-ink);
  overflow: hidden;
  font-family: Inter, Arial, sans-serif;
  --alm-section-bg: var(--alm-v14-cream);
}

.almara-page-how-it-works .elementor-widget,
.almara-page-how-it-works .elementor-widget-container,
.almara-page-how-it-works .elementor-widget-heading,
.almara-page-how-it-works .elementor-widget-text-editor,
.almara-page-how-it-works .elementor-widget-image,
.almara-page-how-it-works .e-con-inner > .elementor-element {
  min-width: 0 !important;
  max-width: none !important;
}

.almara-page-how-it-works p { margin: 0; }
.almara-page-how-it-works a { color: inherit; }

.alm-tech-section {
  position: relative;
  width: 100%;
  padding-inline: var(--alm-v14-section-x);
  background: var(--alm-section-bg);
  overflow: hidden;
}

.alm-tech-section > .e-con-inner {
  width: min(100%, var(--alm-v14-max)) !important;
  max-width: var(--alm-v14-max) !important;
  margin-inline: auto !important;
  padding-block: var(--alm-v14-section-y) !important;
  position: relative;
  z-index: 2;
}

.alm-tech-kicker,
.alm-tech-kicker .elementor-widget-container {
  color: var(--alm-v14-aqua) !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  font-weight: 800 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  margin-bottom: 14px !important;
}

.alm-tech-section-title,
.alm-tech-section-title .elementor-heading-title,
.alm-tech-hero-title,
.alm-tech-hero-title .elementor-heading-title,
.alm-tech-final-title,
.alm-tech-final-title .elementor-heading-title {
  font-family: Georgia, 'Times New Roman', serif !important;
  font-weight: 500 !important;
  letter-spacing: -.045em !important;
  margin: 0 !important;
  color: var(--alm-v14-ink) !important;
  text-wrap: balance;
}

.alm-tech-section-title .elementor-heading-title {
  font-size: clamp(34px, 4vw, 58px) !important;
  line-height: .94 !important;
}

.alm-tech-section-lead,
.alm-tech-section-lead .elementor-widget-container,
.alm-tech-hero-lead,
.alm-tech-hero-lead .elementor-widget-container {
  font-size: clamp(15px, 1.08vw, 18px) !important;
  line-height: 1.76 !important;
  color: var(--alm-v14-muted) !important;
}

.alm-tech-section-copy > .e-con-inner {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
}

/* ---------------- Hero ---------------- */
#alm-how-hero {
  --alm-section-bg: var(--alm-v14-deeper);
  min-height: clamp(620px, 74vh, 760px);
  color: #fff;
  background:
    radial-gradient(circle at 78% 34%, rgba(110,193,194,.26) 0%, rgba(110,193,194,0) 28%),
    radial-gradient(circle at 24% 34%, rgba(110,193,194,.10) 0%, rgba(110,193,194,0) 38%),
    linear-gradient(115deg, #052734 0%, #07384a 50%, #0a4b5e 100%);
  border-top: 1px solid rgba(110,193,194,.18);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
#alm-how-hero:before,
#alm-how-hero:after,
.alm-tech-section--dark:after,
.alm-tech-final-card--dark:after {
  content: "";
  position: absolute;
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='980' height='360' viewBox='0 0 980 360'%3E%3Cg fill='none' stroke='%236EC1C2' stroke-linecap='round'%3E%3Cpath d='M0 208 C114 132 214 126 334 196 S608 286 980 130' stroke-width='3' opacity='.58'/%3E%3Cpath d='M0 242 C136 164 250 156 382 224 S644 304 980 164' stroke-width='2.3' opacity='.42'/%3E%3Cpath d='M0 278 C152 204 278 194 424 250 S688 306 980 220' stroke-width='1.8' opacity='.30'/%3E%3Cpath d='M88 148 C210 86 314 84 452 140 S734 214 944 102' stroke-width='1.5' opacity='.22'/%3E%3Cpath d='M126 108 C236 54 334 52 454 96 S702 162 864 84' stroke-width='1.2' opacity='.16'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
}
#alm-how-hero:before {
  width: min(980px, 78vw);
  height: 420px;
  right: -5vw;
  top: 18%;
  opacity: .88;
}
#alm-how-hero:after {
  width: min(820px, 66vw);
  height: 310px;
  left: -12vw;
  bottom: 72px;
  opacity: .36;
  transform: rotate(-2deg);
}
#alm-how-hero > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(390px, .9fr) minmax(460px, 1fr) !important;
  gap: clamp(56px, 8vw, 132px) !important;
  align-items: center !important;
  padding-top: clamp(78px, 8vw, 118px) !important;
  padding-bottom: clamp(82px, 8vw, 120px) !important;
}
.alm-tech-hero-copy > .e-con-inner,
.alm-tech-hero-media > .e-con-inner,
.alm-tech-hero-card > .e-con-inner { padding: 0 !important; width: 100% !important; max-width: none !important; }
.alm-tech-hero-copy .e-con-inner { display: block !important; }
.alm-tech-hero-copy { position: relative; }
.alm-tech-hero-copy:before {
  content: "";
  position: absolute;
  left: -14%;
  top: 24%;
  width: min(520px, 42vw);
  height: 170px;
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='170' viewBox='0 0 560 170'%3E%3Cg fill='none' stroke='%236EC1C2' stroke-linecap='round'%3E%3Cpath d='M2 114 C72 74 132 74 198 108 S348 150 558 76' stroke-width='2.4' opacity='.40'/%3E%3Cpath d='M0 136 C84 92 154 90 232 124 S386 162 556 108' stroke-width='1.7' opacity='.26'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
  opacity: .55;
}
.alm-tech-hero-title .elementor-heading-title {
  font-size: clamp(58px, 6.7vw, 94px) !important;
  line-height: .88 !important;
  color: #fff !important;
  max-width: 740px;
  text-shadow: 0 10px 28px rgba(0,0,0,.18);
}
.alm-tech-hero-lead { margin-top: 28px !important; max-width: 620px; }
.alm-tech-hero-lead .elementor-widget-container { color: rgba(255,255,255,.92) !important; }
.alm-tech-hero-ctas > .e-con-inner,
.alm-tech-cta-row > .e-con-inner {
  display: flex !important;
  gap: 18px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  padding: 0 !important;
  margin: 34px 0 0 !important;
  max-width: none !important;
}
.alm-tech-btn .elementor-button {
  position: relative;
  min-height: 54px;
  border-radius: 12px !important;
  padding: 16px 24px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  border: 1px solid transparent !important;
  box-shadow: 0 18px 34px rgba(4, 30, 42, .14) !important;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease !important;
}
.alm-tech-btn .elementor-button-content-wrapper { align-items: center; gap: 14px; }
.alm-tech-btn .elementor-button-text:after {
  content: "→";
  display: inline-block;
  margin-left: 16px;
  transform: translateY(-1px);
  transition: transform .22s ease;
}
.alm-tech-btn--secondary .elementor-button-text:after { content: "↓"; }
.alm-tech-btn:hover .elementor-button-text:after { transform: translate(5px,-1px); }
.alm-tech-btn--secondary:hover .elementor-button-text:after { transform: translateY(3px); }
.alm-tech-btn--primary .elementor-button {
  background: linear-gradient(135deg, var(--alm-v14-aqua), #58aeb2) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.18) !important;
}
.alm-tech-btn--primary .elementor-button:hover { background: #fff !important; color: var(--alm-v14-deep) !important; transform: translateY(-2px); box-shadow: 0 22px 48px rgba(110,193,194,.24) !important; }
.alm-tech-btn--secondary .elementor-button {
  background: rgba(4, 31, 44, .42) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.50) !important;
}
.alm-tech-btn--secondary .elementor-button:hover { background: rgba(255,255,255,.10) !important; border-color: var(--alm-v14-aqua) !important; transform: translateY(-2px); }
.alm-tech-btn--coral .elementor-button { background: var(--alm-v14-coral) !important; color: #fff !important; border-color: var(--alm-v14-coral) !important; }
.alm-tech-btn--coral .elementor-button:hover { background: var(--alm-v14-aqua) !important; border-color: var(--alm-v14-aqua) !important; transform: translateY(-2px); }

.alm-tech-hero-media { justify-self: end; width: min(100%, 560px) !important; }
.alm-tech-hero-card {
  width: 100%;
  background: #fff;
  border: 2px solid rgba(255,255,255,.75);
  border-radius: 22px;
  box-shadow: var(--alm-v14-shadow-strong);
  overflow: hidden;
}
.alm-tech-hero-img,
.alm-tech-hero-img .elementor-widget-container,
.alm-tech-hero-img img {
  width: 100% !important;
  height: clamp(280px, 31vw, 380px) !important;
  display: block !important;
}
.alm-tech-hero-img img { object-fit: cover !important; object-position: 50% 45% !important; }
.alm-tech-hero-caption > .e-con-inner,
.alm-tech-gallery-caption > .e-con-inner {
  display: grid !important;
  grid-template-columns: 66px minmax(0,1fr) !important;
  gap: 22px !important;
  align-items: center !important;
  padding: 26px 30px !important;
  max-width: none !important;
}
.alm-tech-brand-mark img,
.alm-tech-final-icon img { display: block !important; width: 100% !important; height: auto !important; }
.alm-tech-brand-mark--caption { width: 58px !important; height: 58px !important; padding: 7px; border: 1px solid rgba(110,193,194,.55); border-radius: 999px; }
.alm-tech-caption-title .elementor-heading-title { color: var(--alm-v14-ink) !important; font-family: Inter, Arial, sans-serif !important; font-size: 16px !important; font-weight: 850 !important; letter-spacing: 0 !important; line-height: 1.25 !important; }
.alm-tech-caption-text .elementor-widget-container { color: rgba(31,60,76,.86) !important; font-size: 14px !important; line-height: 1.52 !important; }
.alm-tech-hero-caption-copy > .e-con-inner,
.alm-tech-gallery-caption-copy > .e-con-inner { padding: 0 !important; display:block !important; }

/* ---------------- Icon system ---------------- */
.alm-tech-ui-icon {
  --alm-icon: var(--alm-v14-aqua);
  width: 66px !important;
  height: 66px !important;
  border-radius: 999px;
  border: 1.5px solid rgba(110,193,194,.7);
  background: rgba(110,193,194,.08);
  position: relative;
  flex: 0 0 auto;
}
.alm-tech-ui-icon > .e-con-inner { padding: 0 !important; display: block !important; }

/* ---------------- System Cards ---------------- */
#alm-how-expect > .e-con-inner,
#alm-how-faq > .e-con-inner,
#alm-how-ready > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr) !important;
  gap: clamp(42px, 6vw, 82px) !important;
  align-items: start !important;
}
#alm-how-expect .alm-tech-section-copy,
#alm-how-faq .alm-tech-section-copy,
#alm-how-ready .alm-tech-section-copy { align-self: center; }
.alm-tech-feature-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
  padding: 0 !important;
  max-width: none !important;
}
.alm-tech-feature-card {
  background: rgba(255,255,255,.76);
  border: 1px solid var(--alm-v14-border);
  border-radius: 20px;
  box-shadow: 0 18px 46px rgba(31,60,76,.09);
  min-height: 236px;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.alm-tech-feature-card > .e-con-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 14px !important;
  padding: 30px 22px !important;
  height: 100% !important;
  max-width: none !important;
}
.alm-tech-feature-card:hover { transform: translateY(-5px); box-shadow: 0 26px 66px rgba(31,60,76,.14); border-color: rgba(110,193,194,.36); }
.alm-tech-card-title .elementor-heading-title,
.alm-tech-mini-title .elementor-heading-title,
.alm-tech-process-title .elementor-heading-title,
.alm-tech-loop-title .elementor-heading-title {
  font-family: Inter, Arial, sans-serif !important;
  color: var(--alm-v14-ink) !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 850 !important;
  letter-spacing: -.01em !important;
}
.alm-tech-card-text .elementor-widget-container,
.alm-tech-mini-text .elementor-widget-container,
.alm-tech-process-text .elementor-widget-container,
.alm-tech-loop-text .elementor-widget-container {
  color: var(--alm-v14-muted) !important;
  font-size: 14px !important;
  line-height: 1.58 !important;
}
.alm-tech-feature-card--compact { min-height: 190px; }
.alm-tech-feature-card--compact > .e-con-inner { padding: 24px 20px !important; }
.alm-tech-feature-card--compact .alm-tech-ui-icon { width: 54px !important; height: 54px !important; }

/* ---------------- Equipment Gallery ---------------- */
#alm-how-equipment {
  --alm-section-bg: linear-gradient(115deg, rgba(244,237,228,.92), rgba(255,255,255,.92));
}
#alm-how-equipment > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(330px, 420px) minmax(0, 1fr) !important;
  gap: clamp(46px, 7vw, 100px) !important;
  align-items: center !important;
}
.alm-tech-equipment-copy .alm-tech-section-lead { margin-top: 20px; }
.alm-tech-bullet-list > .e-con-inner {
  display: grid !important;
  gap: 14px !important;
  padding: 0 !important;
  margin-top: 28px !important;
}
.alm-tech-bullet .elementor-widget-container {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  color: var(--alm-v14-ink) !important;
  font-size: 15px !important;
  font-weight: 750 !important;
}
.alm-tech-bullet .elementor-widget-container:before {
  content: "";
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  border: 1px solid rgba(110,193,194,.65);
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 12'%3E%3Cpath d='M1 7 C5 2,10 2,14 7 S24 12,29 5' fill='none' stroke='%236EC1C2' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/16px 9px no-repeat;
}
.alm-tech-equipment-visuals > .e-con-inner,
.alm-tech-gallery-card > .e-con-inner { padding:0 !important; max-width:none !important; width:100% !important; }
.alm-tech-gallery-card {
  background: #fff;
  border: 1px solid rgba(31,60,76,.12);
  border-radius: 22px;
  box-shadow: var(--alm-v14-shadow);
  overflow: hidden;
}
.alm-tech-gallery-media > .e-con-inner {
  display: grid !important;
  grid-template-columns: 1.35fr .78fr .78fr !important;
  grid-template-rows: 190px 190px !important;
  gap: 10px !important;
  padding: 12px 12px 0 !important;
  max-width: none !important;
}
.alm-tech-gallery-img,
.alm-tech-gallery-img .elementor-widget-container,
.alm-tech-gallery-img img { width:100% !important; height:100% !important; display:block !important; }
.alm-tech-gallery-img img { object-fit: cover !important; }
.alm-tech-gallery-img--main { grid-column: 1 / 2; grid-row: 1 / 3; }
.alm-tech-gallery-img--main img { object-position: 50% 50% !important; }
.alm-tech-gallery-img--detail-1 { grid-column: 2 / 4; grid-row: 1 / 2; }
.alm-tech-gallery-img--detail-1 img { object-position: 65% 20% !important; }
.alm-tech-gallery-img--detail-2 { grid-column: 2 / 3; grid-row: 2 / 3; }
.alm-tech-gallery-img--detail-2 img { object-position: 20% 60% !important; }
.alm-tech-gallery-img--detail-3 { grid-column: 3 / 4; grid-row: 2 / 3; }
.alm-tech-gallery-img--detail-3 img { object-position: 90% 60% !important; }
.alm-tech-gallery-img img { border-radius: 12px !important; }

/* ---------------- Dark Bands ---------------- */
.alm-tech-section--dark {
  --alm-section-bg: linear-gradient(115deg, #062837 0%, #0b3a4b 100%);
  color: #fff;
}
.alm-tech-section--dark:after {
  right: -100px;
  bottom: -95px;
  width: 660px;
  height: 260px;
  opacity: .22;
}
.alm-tech-section--dark .alm-tech-section-title .elementor-heading-title { color: #fff !important; }
.alm-tech-section--dark .alm-tech-kicker .elementor-widget-container,
.alm-tech-section--dark .alm-tech-kicker { color: var(--alm-v14-aqua) !important; }
#alm-how-safety > .e-con-inner,
#alm-how-flow > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(290px, 390px) minmax(0, 1fr) !important;
  gap: clamp(44px, 6vw, 92px) !important;
  align-items: center !important;
  padding-block: clamp(56px, 6vw, 84px) !important;
}
.alm-tech-mini-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 18px !important;
  padding: 0 !important;
  max-width: none !important;
}
.alm-tech-mini-card { border-left: 1px solid rgba(255,255,255,.18); }
.alm-tech-mini-card > .e-con-inner {
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) !important;
  grid-template-areas: "icon title" "icon text" !important;
  gap: 6px 16px !important;
  padding: 10px 14px 10px 22px !important;
  max-width: none !important;
}
.alm-tech-mini-card .alm-tech-ui-icon { grid-area: icon; width: 56px !important; height: 56px !important; align-self: center; }
.alm-tech-mini-title { grid-area: title; }
.alm-tech-mini-text { grid-area: text; }
.alm-tech-section--dark .alm-tech-mini-title .elementor-heading-title,
.alm-tech-section--dark .alm-tech-loop-title .elementor-heading-title { color: #fff !important; }
.alm-tech-section--dark .alm-tech-mini-text .elementor-widget-container,
.alm-tech-section--dark .alm-tech-loop-text .elementor-widget-container { color: rgba(255,255,255,.82) !important; }

/* ---------------- Process ---------------- */
#alm-how-booking > .e-con-inner,
#alm-how-audience > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(290px, 390px) minmax(0, 1fr) !important;
  gap: clamp(42px, 6vw, 80px) !important;
  align-items: center !important;
}
.alm-tech-process-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 40px !important;
  align-items: start !important;
  padding: 0 !important;
  max-width: none !important;
}
.alm-tech-process-step { position: relative; text-align: center; }
.alm-tech-process-step:not(:last-child):after {
  content: "→";
  position: absolute;
  top: 38px;
  right: -31px;
  font-size: 42px;
  line-height: 1;
  color: rgba(31,60,76,.50);
  font-family: Georgia, serif;
}
.alm-tech-process-step > .e-con-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 0 !important;
  max-width:none !important;
}
.alm-tech-process-number { display:none !important; }
.alm-tech-process-icon { --alm-icon: var(--alm-v14-coral); width: 74px !important; height: 74px !important; border-color: rgba(230,165,126,.55); background: rgba(230,165,126,.08); }

/* ---------------- Loop ---------------- */
.alm-tech-loop-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 24px !important;
  padding: 0 !important;
  max-width: none !important;
  align-items: start !important;
  position: relative;
}
.alm-tech-loop-grid > .e-con-inner:before {
  content: "";
  position: absolute;
  left: 7%; right: 7%; top: 25px;
  height: 1px;
  border-top: 1px dashed rgba(110,193,194,.38);
}
.alm-tech-loop-step { text-align:center; position:relative; z-index:2; }
.alm-tech-loop-step > .e-con-inner { display:flex!important; flex-direction:column!important; align-items:center!important; gap: 10px!important; padding:0!important; max-width:none!important; }
.alm-tech-loop-number .elementor-widget-container {
  width: 52px; height: 52px; border-radius: 999px; display:grid; place-items:center;
  background: linear-gradient(135deg, var(--alm-v14-aqua), #3d8f98);
  color: #fff !important; font-size: 18px !important; font-weight: 900 !important;
  box-shadow: 0 16px 34px rgba(110,193,194,.20);
}

/* ---------------- Partner / Network / Future ---------------- */
.alm-tech-partner-list-wrap > .e-con-inner,
.alm-tech-checklist > .e-con-inner { padding:0!important; max-width:none!important; }
.alm-tech-checklist > .e-con-inner { display:grid!important; gap:14px!important; }
.alm-tech-check-item .elementor-widget-container {
  display:flex!important; align-items:center!important; gap:12px!important;
  color: var(--alm-v14-ink)!important; font-weight: 780!important; font-size: 15px!important;
}
.alm-tech-check-item .elementor-widget-container:before {
  content:""; width: 25px; height: 25px; border-radius: 50%; flex: 0 0 25px;
  border:1px solid rgba(110,193,194,.65);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M8 15.5l4 4 10-10' fill='none' stroke='%236EC1C2' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/15px 15px no-repeat;
}
.alm-tech-partner-visual-card { border-radius: 20px; overflow:hidden; box-shadow: var(--alm-v14-shadow); position:relative; align-self: stretch; }
.alm-tech-partner-visual-card > .e-con-inner { padding:0!important; max-width:none!important; height:100%; }
.alm-tech-partner-img,
.alm-tech-partner-img .elementor-widget-container,
.alm-tech-partner-img img { width:100%!important; height:100%!important; min-height: 260px!important; display:block!important; }
.alm-tech-partner-img img { object-fit: cover!important; object-position: 50% 50%!important; }
.alm-tech-partner-visual-card .alm-tech-btn { position:absolute; left:28px; bottom:28px; z-index:4; }
.alm-tech-partner-visual-card .alm-tech-btn .elementor-button { min-height: 50px; }
#alm-how-ready { --alm-section-bg: linear-gradient(115deg, rgba(244,237,228,.82), rgba(255,255,255,.92)); }

/* ---------------- Final CTA ---------------- */
#alm-how-final-cta { --alm-section-bg: var(--alm-v14-cream); }
#alm-how-final-cta > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1.75fr) minmax(320px, .85fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
  padding-top: clamp(70px, 7vw, 108px) !important;
}
.alm-tech-final-card { border-radius: 22px; box-shadow: var(--alm-v14-shadow); overflow:hidden; }
.alm-tech-final-card > .e-con-inner { max-width:none!important; padding:0!important; height:100%!important; }
.alm-tech-final-card--dark {
  position:relative;
  background:
    radial-gradient(circle at 0% 30%, rgba(110,193,194,.18), transparent 34%),
    linear-gradient(115deg, #062837 0%, #0b3a4b 100%);
  color: #fff;
  min-height: 320px;
}
.alm-tech-final-card--dark:after { right:-95px; bottom:-65px; width:650px; height:260px; opacity:.30; }
.alm-tech-final-card--dark > .e-con-inner {
  display:grid!important;
  grid-template-columns: 132px minmax(0, 1fr)!important;
  gap: clamp(28px, 4vw, 56px)!important;
  align-items:center!important;
  padding: clamp(40px, 5vw, 64px)!important;
}
.alm-tech-final-icon { width:118px!important; height:118px!important; padding: 10px; border:1px solid rgba(110,193,194,.48); border-radius: 999px; }
.alm-tech-final-copy > .e-con-inner { padding:0!important; display:block!important; max-width:none!important; }
.alm-tech-final-title .elementor-heading-title { color:#fff!important; font-size: clamp(34px, 3.6vw, 56px)!important; line-height:.98!important; }
.alm-tech-final-text .elementor-widget-container { color: rgba(255,255,255,.86)!important; font-size: 16px!important; line-height: 1.72!important; max-width: 680px; margin-top: 18px; }
.alm-tech-final-buttons > .e-con-inner { margin-top: 28px!important; }
.alm-tech-final-card--light { background:#fff; border:1px solid rgba(31,60,76,.12); }
.alm-tech-final-card--light > .e-con-inner { display:flex!important; flex-direction:column!important; justify-content:center!important; align-items:flex-start!important; padding:42px 38px!important; gap:20px!important; }
.alm-tech-contact-title .elementor-heading-title { font-family: Georgia, 'Times New Roman', serif!important; font-size: clamp(28px, 2.5vw, 40px)!important; line-height:1!important; color:var(--alm-v14-ink)!important; }
.alm-tech-contact-text .elementor-widget-container { color:var(--alm-v14-muted)!important; font-size:15px!important; line-height:1.65!important; }
.alm-tech-contact-note .elementor-widget-container { font-size:13px!important; color:rgba(31,60,76,.55)!important; }
.alm-tech-final-card--light .alm-tech-ui-icon { width:56px!important; height:56px!important; }

/* ---------------- Responsive ---------------- */
@media (max-width: 1180px) {
  #alm-how-hero > .e-con-inner,
  #alm-how-equipment > .e-con-inner,
  #alm-how-expect > .e-con-inner,
  #alm-how-safety > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-flow > .e-con-inner,
  #alm-how-audience > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner,
  #alm-how-final-cta > .e-con-inner { gap: 44px !important; }
  .alm-tech-feature-grid > .e-con-inner { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .alm-tech-mini-grid > .e-con-inner { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .alm-tech-process-grid > .e-con-inner { grid-template-columns: repeat(2,minmax(0,1fr)) !important; row-gap: 36px !important; }
  .alm-tech-process-step:nth-child(2):after { display:none; }
  .alm-tech-loop-grid > .e-con-inner { grid-template-columns: repeat(3,minmax(0,1fr)) !important; row-gap: 36px !important; }
  .alm-tech-loop-grid > .e-con-inner:before { display:none; }
}
@media (max-width: 860px) {
  .alm-tech-section { padding-inline: 22px; }
  .alm-tech-section > .e-con-inner { padding-block: 62px !important; }
  #alm-how-hero > .e-con-inner,
  #alm-how-equipment > .e-con-inner,
  #alm-how-expect > .e-con-inner,
  #alm-how-safety > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-flow > .e-con-inner,
  #alm-how-audience > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner,
  #alm-how-final-cta > .e-con-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  #alm-how-hero { min-height: auto; }
  #alm-how-hero > .e-con-inner { padding-top: 54px !important; padding-bottom: 58px !important; }
  .alm-tech-hero-title .elementor-heading-title { font-size: clamp(44px, 13vw, 62px) !important; max-width: 100%; }
  .alm-tech-hero-media { justify-self: stretch; width: 100% !important; }
  .alm-tech-hero-img,
  .alm-tech-hero-img .elementor-widget-container,
  .alm-tech-hero-img img { height: 255px !important; }
  .alm-tech-hero-caption > .e-con-inner,
  .alm-tech-gallery-caption > .e-con-inner { grid-template-columns: 52px minmax(0,1fr) !important; padding: 22px !important; gap: 16px !important; }
  .alm-tech-brand-mark--caption { width: 50px !important; height: 50px !important; }
  .alm-tech-feature-grid > .e-con-inner,
  .alm-tech-mini-grid > .e-con-inner,
  .alm-tech-process-grid > .e-con-inner,
  .alm-tech-loop-grid > .e-con-inner { grid-template-columns: 1fr !important; }
  .alm-tech-feature-card { min-height: auto; }
  .alm-tech-feature-card > .e-con-inner { align-items:flex-start!important; text-align:left!important; padding:24px!important; }
  .alm-tech-mini-card { border-left: 0; border-top:1px solid rgba(255,255,255,.12); }
  .alm-tech-mini-card > .e-con-inner { grid-template-columns: 56px minmax(0,1fr)!important; padding: 18px 0!important; }
  .alm-tech-gallery-media > .e-con-inner {
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 220px 120px 120px !important;
    gap: 8px !important;
  }
  .alm-tech-gallery-img--main { grid-column: 1 / 3; grid-row: 1 / 2; }
  .alm-tech-gallery-img--detail-1 { grid-column: 1 / 2; grid-row: 2 / 3; }
  .alm-tech-gallery-img--detail-2 { grid-column: 2 / 3; grid-row: 2 / 3; }
  .alm-tech-gallery-img--detail-3 { grid-column: 1 / 3; grid-row: 3 / 4; }
  .alm-tech-process-step { text-align:left; }
  .alm-tech-process-step > .e-con-inner { display:grid!important; grid-template-columns: 68px minmax(0,1fr)!important; grid-template-areas:"icon title" "icon text"!important; align-items:center!important; text-align:left!important; column-gap: 18px!important; }
  .alm-tech-process-step:not(:last-child):after { display:none; }
  .alm-tech-process-icon { grid-area: icon; width:62px!important; height:62px!important; }
  .alm-tech-process-title { grid-area:title; }
  .alm-tech-process-text { grid-area:text; }
  .alm-tech-loop-step > .e-con-inner { display:grid!important; grid-template-columns:52px minmax(0,1fr)!important; grid-template-areas:"num title" "num text"!important; align-items:center!important; text-align:left!important; column-gap:16px!important; }
  .alm-tech-loop-number { grid-area:num; }
  .alm-tech-loop-title { grid-area:title; }
  .alm-tech-loop-text { grid-area:text; }
  .alm-tech-final-card--dark > .e-con-inner { grid-template-columns: 1fr !important; padding: 34px 26px !important; }
  .alm-tech-final-icon { width:88px!important; height:88px!important; }
  .alm-tech-final-card--light > .e-con-inner { padding: 30px 26px !important; }
  .alm-tech-hero-ctas > .e-con-inner,
  .alm-tech-cta-row > .e-con-inner { align-items: stretch !important; }
  .alm-tech-cta-row .alm-tech-btn,
  .alm-tech-cta-row .alm-tech-btn .elementor-button { width: 100% !important; }
}


/* =========================================================
 * v1.4.1 HARDENING: Elementor Grid + direct-child fallback
 * This block deliberately targets BOTH Elementor's .e-con-inner
 * wrappers and direct children, because imported templates may
 * render container children differently depending on Elementor
 * settings/cache.
 * ========================================================= */
.almara-page-how-it-works .alm-tech-section {
  isolation: isolate;
}
.almara-page-how-it-works .alm-tech-section > .e-con-inner,
.almara-page-how-it-works .alm-tech-section.e-con > .e-con-inner {
  width: min(100%, var(--alm-v14-max)) !important;
  max-width: var(--alm-v14-max) !important;
  margin-inline: auto !important;
}

/* Desktop section layouts */
@media (min-width: 861px) {
  #alm-how-hero > .e-con-inner,
  #alm-how-hero.elementor-element > .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(420px, .92fr) minmax(500px, 1fr) !important;
    gap: clamp(60px, 7vw, 118px) !important;
    align-items: center !important;
  }
  #alm-how-expect > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(300px, 390px) minmax(0, 1fr) !important;
    gap: clamp(46px, 6vw, 86px) !important;
    align-items: center !important;
  }
  #alm-how-equipment > .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(320px, 440px) minmax(0, 1fr) !important;
    gap: clamp(56px, 6vw, 90px) !important;
    align-items: center !important;
  }
  #alm-how-safety > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-flow > .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(300px, 420px) minmax(0, 1fr) !important;
    gap: clamp(44px, 6vw, 82px) !important;
    align-items: center !important;
  }
  #alm-how-audience > .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(280px, 360px) minmax(260px, 360px) minmax(360px, 1fr) !important;
    gap: clamp(32px, 4vw, 58px) !important;
    align-items: center !important;
  }
  #alm-how-final-cta > .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1.75fr) minmax(340px, .85fr) !important;
    gap: 30px !important;
    align-items: stretch !important;
  }
}

/* Nested grids: apply to container itself and to .e-con-inner fallback */
.almara-page-how-it-works .alm-tech-feature-grid,
.almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
  align-items: stretch !important;
  width: 100% !important;
}
.almara-page-how-it-works .alm-tech-mini-grid,
.almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  width: 100% !important;
}
.almara-page-how-it-works .alm-tech-process-grid,
.almara-page-how-it-works .alm-tech-process-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(24px, 4vw, 46px) !important;
  width: 100% !important;
}
.almara-page-how-it-works .alm-tech-loop-grid,
.almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
}
.almara-page-how-it-works .alm-tech-gallery-media,
.almara-page-how-it-works .alm-tech-gallery-media > .e-con-inner {
  display: grid !important;
  grid-template-columns: 1.18fr .82fr .82fr !important;
  grid-template-rows: 230px 170px !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 12px !important;
}
.almara-page-how-it-works .alm-tech-checklist,
.almara-page-how-it-works .alm-tech-checklist > .e-con-inner {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  width: 100% !important;
}

/* Grid item placement independent of Elementor inner wrappers */
.almara-page-how-it-works .alm-tech-gallery-img--main { grid-column: 1 / 3 !important; grid-row: 1 / 2 !important; }
.almara-page-how-it-works .alm-tech-gallery-img--detail-1 { grid-column: 3 / 4 !important; grid-row: 1 / 2 !important; }
.almara-page-how-it-works .alm-tech-gallery-img--detail-2 { grid-column: 1 / 2 !important; grid-row: 2 / 3 !important; }
.almara-page-how-it-works .alm-tech-gallery-img--detail-3 { grid-column: 2 / 4 !important; grid-row: 2 / 3 !important; }
.almara-page-how-it-works .alm-tech-gallery-img,
.almara-page-how-it-works .alm-tech-gallery-img .elementor-widget-container,
.almara-page-how-it-works .alm-tech-gallery-img img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
}
.almara-page-how-it-works .alm-tech-gallery-img img {
  object-fit: cover !important;
  border-radius: 12px !important;
}

/* Prevent card tower collapse */
.almara-page-how-it-works .alm-tech-feature-grid > .elementor-element,
.almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner > .elementor-element,
.almara-page-how-it-works .alm-tech-mini-grid > .elementor-element,
.almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner > .elementor-element,
.almara-page-how-it-works .alm-tech-process-grid > .elementor-element,
.almara-page-how-it-works .alm-tech-process-grid > .e-con-inner > .elementor-element,
.almara-page-how-it-works .alm-tech-loop-grid > .elementor-element,
.almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner > .elementor-element {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* Hero exactness */
#alm-how-hero .alm-tech-hero-copy,
#alm-how-hero .alm-tech-hero-media { min-width: 0 !important; }
#alm-how-hero .alm-tech-hero-media { justify-self: end !important; width: min(100%, 585px) !important; }
#alm-how-hero .alm-tech-hero-card { border-radius: 22px !important; max-width: 585px !important; }
#alm-how-hero .alm-tech-hero-img img { object-position: 50% 50% !important; }

/* Final CTA stronger, mockup-like */
#alm-how-final-cta .alm-tech-final-card--dark { min-height: 330px !important; }
#alm-how-final-cta .alm-tech-final-card--light { min-height: 330px !important; }

@media (max-width: 1180px) and (min-width: 861px) {
  .almara-page-how-it-works .alm-tech-feature-grid,
  .almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .almara-page-how-it-works .alm-tech-mini-grid,
  .almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .almara-page-how-it-works .alm-tech-process-grid,
  .almara-page-how-it-works .alm-tech-process-grid > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .almara-page-how-it-works .alm-tech-loop-grid,
  .almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 860px) {
  .almara-page-how-it-works .alm-tech-section > .e-con-inner { display: grid !important; grid-template-columns: 1fr !important; gap: 32px !important; }
  .almara-page-how-it-works .alm-tech-feature-grid,
  .almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid,
  .almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid,
  .almara-page-how-it-works .alm-tech-process-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-loop-grid,
  .almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner {
    grid-template-columns: 1fr !important;
  }
  .almara-page-how-it-works .alm-tech-gallery-media,
  .almara-page-how-it-works .alm-tech-gallery-media > .e-con-inner {
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 220px 120px 120px !important;
  }
  .almara-page-how-it-works .alm-tech-gallery-img--main { grid-column: 1 / 3 !important; grid-row: 1 / 2 !important; }
  .almara-page-how-it-works .alm-tech-gallery-img--detail-1 { grid-column: 1 / 2 !important; grid-row: 2 / 3 !important; }
  .almara-page-how-it-works .alm-tech-gallery-img--detail-2 { grid-column: 2 / 3 !important; grid-row: 2 / 3 !important; }
  .almara-page-how-it-works .alm-tech-gallery-img--detail-3 { grid-column: 1 / 3 !important; grid-row: 3 / 4 !important; }
}




/* =========================================================
 * v1.4.8 STABILITY + ICON + WAVE FIX
 * Clean override layer on top of stable v1.4 base.
 * - One hero wave layer, no blue blocks
 * - Final CTA uses same full wave logic
 * - ALMARA brand mark drawn in CSS, no broken image dependency
 * - Lightweight unique glyph icons, no duplicate semantic icons
 * - Higher contrast dark sections, calmer sand rhythm
 * ========================================================= */

.almara-page-how-it-works {
  --alm-v14-max: 1460px;
  --alm-v14-sand: #F2E8DC;
  --alm-v14-cream: #FBF6EF;
  --alm-v14-muted: rgba(20,53,68,.88);
}

/* page rhythm */
#alm-how-expect { --alm-section-bg: #F4ECDF !important; }
#alm-how-equipment { --alm-section-bg: linear-gradient(115deg, #F4EDE4 0%, #FFF9F1 58%, #fff 100%) !important; }
#alm-how-booking { --alm-section-bg: #FAF3EA !important; }
#alm-how-audience { --alm-section-bg: linear-gradient(115deg, #FBF7F0 0%, #F6EDE2 100%) !important; }
#alm-how-faq { --alm-section-bg: #F5EDE1 !important; }
#alm-how-ready { --alm-section-bg: linear-gradient(115deg, #F6EFE5 0%, #FEFAF4 100%) !important; }
#alm-how-final-cta { --alm-section-bg: #F8F2EA !important; }

/* subtle section accent without visual noise */
.almara-page-how-it-works .alm-tech-section:not(.alm-tech-section--dark)::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(circle at 12% 12%, rgba(110,193,194,.08), rgba(110,193,194,0) 28%),
    radial-gradient(circle at 86% 22%, rgba(230,165,126,.06), rgba(230,165,126,0) 30%);
  opacity: .9;
}
.almara-page-how-it-works .alm-tech-section > .e-con-inner {
  position: relative;
  z-index: 2;
}

/* HERO: one full hero background/wave layer only */
#alm-how-hero {
  overflow: hidden !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background:
    radial-gradient(circle at 24% 38%, rgba(110,193,194,.09), rgba(110,193,194,0) 30%),
    linear-gradient(115deg, #052838 0%, #07384a 52%, #0a4c5f 100%) !important;
}
#alm-how-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  background: url('/wp-content/mu-plugins/almara-platform/assets/almara_hero-welle.webp') 78% 54% / 112% auto no-repeat !important;
  opacity: .62 !important;
  mix-blend-mode: screen !important;
  pointer-events: none !important;
  filter: saturate(1.04) contrast(1.02);
}
#alm-how-hero::after,
#alm-how-hero .alm-tech-hero-copy::before {
  content: none !important;
  display: none !important;
}
#alm-how-hero > .e-con-inner,
#alm-how-hero.elementor-element > .e-con-inner,
#alm-how-hero .alm-tech-hero-copy,
#alm-how-hero .alm-tech-hero-copy > .e-con-inner,
#alm-how-hero .alm-tech-hero-copy .e-con-inner,
#alm-how-hero .alm-tech-hero-copy .elementor-widget-container,
#alm-how-hero .alm-tech-hero-media,
#alm-how-hero .alm-tech-hero-media > .e-con-inner,
#alm-how-hero .alm-tech-hero-card > .e-con-inner {
  background: transparent !important;
}
#alm-how-hero .alm-tech-hero-title .elementor-heading-title {
  color: rgba(255,255,255,.985) !important;
  text-shadow: 0 12px 30px rgba(0,0,0,.24) !important;
}
#alm-how-hero .alm-tech-kicker,
#alm-how-hero .alm-tech-kicker .elementor-widget-container,
#alm-how-hero .alm-tech-kicker p {
  color: var(--alm-v14-aqua) !important;
  opacity: 1 !important;
}
#alm-how-hero .alm-tech-hero-lead,
#alm-how-hero .alm-tech-hero-lead .elementor-widget-container,
#alm-how-hero .alm-tech-hero-lead p {
  color: rgba(255,255,255,.94) !important;
  opacity: 1 !important;
  font-weight: 540 !important;
  text-shadow: 0 3px 18px rgba(0,0,0,.22) !important;
}

/* FINAL CTA: same wave logic, full area, no strip */
#alm-how-final-cta .alm-tech-final-card--dark {
  position: relative !important;
  overflow: hidden !important;
  background: linear-gradient(115deg, #052838 0%, #07384a 52%, #0a4c5f 100%) !important;
}
#alm-how-final-cta .alm-tech-final-card--dark::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: url('/wp-content/mu-plugins/almara-platform/assets/almara_hero-welle.webp') 86% 54% / 118% auto no-repeat !important;
  opacity: .24 !important;
  mix-blend-mode: screen !important;
  pointer-events: none !important;
}
#alm-how-final-cta .alm-tech-final-card--dark::after {
  content: none !important;
  display: none !important;
}
#alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

/* ALMARA brand mark: CSS-drawn chip so no broken-image placeholder can appear */
.alm-tech-brand-mark--caption,
.alm-tech-final-icon {
  position: relative !important;
  display: block !important;
  width: 48px !important;
  height: 48px !important;
  padding: 0 !important;
  border-radius: 14px !important;
  border: 1px solid rgba(110,193,194,.42) !important;
  background: rgba(110,193,194,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.20), 0 10px 24px rgba(4,30,42,.10) !important;
}
.alm-tech-final-icon {
  width: 58px !important;
  height: 58px !important;
  border-radius: 16px !important;
}
.alm-tech-brand-mark--caption img,
.alm-tech-final-icon img,
.alm-tech-brand-mark--caption .elementor-widget-container img,
.alm-tech-final-icon .elementor-widget-container img {
  display: none !important;
}
.alm-tech-brand-mark--caption::before,
.alm-tech-final-icon::before {
  content: "A" !important;
  position: absolute !important;
  inset: 6px 0 0 !important;
  display: grid !important;
  place-items: center !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 28px !important;
  line-height: 1 !important;
  color: var(--alm-v14-aqua) !important;
}
.alm-tech-final-icon::before { font-size: 34px !important; }
.alm-tech-brand-mark--caption::after,
.alm-tech-final-icon::after {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  bottom: 10px !important;
  height: 9px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 14'%3E%3Cpath d='M2 8 C10 2,18 2,26 8 S42 14,52 6' fill='none' stroke='%236EC1C2' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

/* Dark sections: make every text layer readable */
.almara-page-how-it-works .alm-tech-section--dark,
.almara-page-how-it-works .alm-tech-section--dark p,
.almara-page-how-it-works .alm-tech-section--dark .elementor-widget-container {
  color: rgba(255,255,255,.88) !important;
}
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-section-title .elementor-heading-title,
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-mini-title .elementor-heading-title,
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-loop-title .elementor-heading-title {
  color: rgba(255,255,255,.985) !important;
}
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-mini-text .elementor-widget-container,
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-mini-text p,
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-loop-text .elementor-widget-container,
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-loop-text p {
  color: rgba(255,255,255,.82) !important;
  opacity: 1 !important;
}
.almara-page-how-it-works .alm-tech-section--dark .alm-tech-mini-card > .e-con-inner {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Lightweight unique glyph icons: faster than repeated SVG masks and no duplicates */

/* each visible card gets a unique, softer, more emotional symbol */






/* partner checklist anchored */
#alm-how-audience .alm-tech-partner-list-wrap {
  background: rgba(255,255,255,.60) !important;
  border: 1px solid rgba(31,60,76,.10) !important;
  border-radius: 20px !important;
  padding: 22px 24px 22px 30px !important;
  box-shadow: 0 18px 42px rgba(31,60,76,.07) !important;
}
#alm-how-audience .alm-tech-check-item .elementor-widget-container {
  color: rgba(31,60,76,.92) !important;
}

/* do not ship huge PNG in v1.4.8; WebP is the page asset */
@media (max-width: 860px) {
  #alm-how-hero::before {
    background-size: 176% auto !important;
    background-position: 80% 52% !important;
    opacity: .48 !important;
  }
  #alm-how-final-cta .alm-tech-final-card--dark::before {
    background-size: 190% auto !important;
    background-position: 78% 56% !important;
    opacity: .20 !important;
  }
}

/* =========================================================
 * v1.4.9 PERFORMANCE + BRAND SYSTEM FIX
 * - New ALMARA palette
 * - New hero-wave WebP
 * - Elementor Icon widgets, no CSS mask icon system
 * - Correct ALMARA icon usage: dark icon on light cards, light icon on dark CTA
 * ========================================================= */

/* New palette rhythm */
.almara-page-how-it-works {
  --alm-section-bg: var(--alm-v14-cream);
  background: var(--alm-v14-cream) !important;
}
#alm-how-expect,
#alm-how-booking,
#alm-how-audience {
  --alm-section-bg:
    radial-gradient(circle at 14% 8%, rgba(121,172,211,.10), transparent 30%),
    linear-gradient(180deg, #FBF7F0 0%, #F2E6D8 100%) !important;
}
#alm-how-equipment,
#alm-how-ready {
  --alm-section-bg:
    radial-gradient(circle at 8% 12%, rgba(66,145,157,.10), transparent 30%),
    linear-gradient(115deg, #F2E6D8 0%, #FFF8EF 52%, #FFFFFF 100%) !important;
}
#alm-how-faq {
  --alm-section-bg:
    radial-gradient(circle at 88% 22%, rgba(226,128,93,.12), transparent 28%),
    linear-gradient(180deg, #FBF7F0 0%, #F2E6D8 100%) !important;
}
#alm-how-final-cta { --alm-section-bg: #F6EEE3 !important; }


/* Hero: single clean full-bleed wave, no old wave/pseudo layers */
#alm-how-hero {
  --alm-section-bg: #042034;
  background: linear-gradient(115deg, #042034 0%, #06283B 50%, #216B7E 100%) !important;
  border: 0 !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
#alm-how-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 24% 44%, rgba(121,172,211,.08), rgba(121,172,211,0) 34%),
    url('/wp-content/mu-plugins/almara-platform/assets/almara_hero-welle.webp') 78% 53% / 112% auto no-repeat !important;
  opacity: .66 !important;
  mix-blend-mode: screen !important;
}
#alm-how-hero::after,
#alm-how-hero .alm-tech-hero-copy::before { content: none !important; display: none !important; }
#alm-how-hero > .e-con-inner,
#alm-how-hero.elementor-element > .e-con-inner,
#alm-how-hero .alm-tech-hero-copy,
#alm-how-hero .alm-tech-hero-copy > .e-con-inner,
#alm-how-hero .alm-tech-hero-copy .elementor-widget-container,
#alm-how-hero .alm-tech-hero-media,
#alm-how-hero .alm-tech-hero-media > .e-con-inner,
#alm-how-hero .alm-tech-hero-card > .e-con-inner {
  background: transparent !important;
}
#alm-how-hero .alm-tech-hero-title .elementor-heading-title {
  color: #fff !important;
  text-shadow: 0 10px 30px rgba(0,0,0,.24) !important;
}
#alm-how-hero .alm-tech-kicker,
#alm-how-hero .alm-tech-kicker .elementor-widget-container,
#alm-how-hero .alm-tech-kicker p { color: #79ACD3 !important; }
#alm-how-hero .alm-tech-hero-lead,
#alm-how-hero .alm-tech-hero-lead .elementor-widget-container,
#alm-how-hero .alm-tech-hero-lead p { color: rgba(255,255,255,.94) !important; }

/* ALMARA icon handling */
.alm-tech-brand-mark--caption,
.alm-tech-final-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background-image: none !important;
}
.alm-tech-brand-mark--caption {
  background: rgba(4,32,52,.04) !important;
  border: 1px solid rgba(66,145,157,.30) !important;
}
.alm-tech-final-icon {
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(121,172,211,.38) !important;
  width: 64px !important;
  height: 64px !important;
  padding: 8px !important;
}
.alm-tech-brand-mark--caption img,
.alm-tech-final-icon img,
.alm-tech-brand-mark--caption .elementor-widget-container img,
.alm-tech-final-icon .elementor-widget-container img {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  width: 78% !important;
  max-width: 78% !important;
  height: auto !important;
}

/* Elementor Icon Widgets — clear, editable, performant */
.alm-tech-ui-icon {
  --alm-icon-color: var(--alm-v14-aqua);
  --alm-icon-border: rgba(66,145,157,.36);
  --alm-icon-bg: rgba(66,145,157,.08);
  width: auto !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.alm-tech-ui-icon::before { content: none !important; display: none !important; }
.alm-tech-ui-icon .elementor-widget-container { line-height: 0 !important; }
.alm-tech-ui-icon .elementor-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 999px !important;
  border: 1px solid var(--alm-icon-border) !important;
  background: var(--alm-icon-bg) !important;
  color: var(--alm-icon-color) !important;
  transition: transform .24s ease, color .24s ease, background .24s ease, border-color .24s ease, box-shadow .24s ease !important;
}
.alm-tech-ui-icon .elementor-icon i { font-size: 24px !important; line-height: 1 !important; }
.alm-tech-ui-icon .elementor-icon svg { width: 24px !important; height: 24px !important; fill: currentColor !important; }
.alm-tech-feature-card:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-feature-card--compact:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-process-step:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-mini-card:hover .alm-tech-ui-icon .elementor-icon {
  --alm-icon-color: var(--alm-v14-coral);
  --alm-icon-border: rgba(226,128,93,.56);
  --alm-icon-bg: rgba(226,128,93,.10);
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(226,128,93,.12);
}
.alm-tech-feature-card:hover .alm-tech-card-title .elementor-heading-title,
.alm-tech-feature-card--compact:hover .alm-tech-card-title .elementor-heading-title {
  color: var(--alm-v14-coral-strong) !important;
}
.alm-tech-section--dark .alm-tech-ui-icon .elementor-icon {
  --alm-icon-color: #79ACD3;
  --alm-icon-border: rgba(121,172,211,.44);
  --alm-icon-bg: rgba(121,172,211,.11);
}
.alm-tech-process-step .alm-tech-ui-icon .elementor-icon {
  width: 76px !important;
  height: 76px !important;
  --alm-icon-color: var(--alm-v14-coral);
  --alm-icon-border: rgba(226,128,93,.50);
  --alm-icon-bg: rgba(226,128,93,.08);
}
.alm-tech-process-step .alm-tech-ui-icon .elementor-icon i { font-size: 28px !important; }

/* Process arrows: aligned to icon center */
.alm-tech-process-grid > .e-con-inner {
  gap: clamp(54px, 5.6vw, 78px) !important;
  align-items: start !important;
}
.alm-tech-process-step:not(:last-child)::after {
  content: "→" !important;
  position: absolute !important;
  top: 33px !important;
  right: clamp(-52px, -3.5vw, -38px) !important;
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  color: rgba(4,32,52,.42) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 30px !important;
  line-height: 1 !important;
}

/* Partner block: premium gradient line + readable bullet box */
#alm-how-audience .alm-tech-partner-list-wrap {
  position: relative !important;
  background: rgba(255,255,255,.62) !important;
  border: 1px solid rgba(4,32,52,.10) !important;
  border-radius: 20px !important;
  padding: 22px 24px 22px 34px !important;
  box-shadow: 0 18px 42px rgba(4,32,52,.07) !important;
}
#alm-how-audience .alm-tech-partner-list-wrap::before {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  top: 18px !important;
  bottom: 18px !important;
  width: 2px !important;
  border-radius: 2px !important;
  background: linear-gradient(180deg, var(--alm-v14-aqua), var(--alm-v14-coral)) !important;
  opacity: .82 !important;
}
.alm-tech-check-item .elementor-widget-container::before {
  border-color: rgba(66,145,157,.60) !important;
  background-color: rgba(66,145,157,.06) !important;
}
#alm-how-audience .alm-tech-check-item .elementor-widget-container {
  color: rgba(4,32,52,.92) !important;
  font-weight: 760 !important;
}

/* Final CTA readability and wave consistency */
#alm-how-final-cta .alm-tech-final-card--dark {
  position: relative !important;
  overflow: hidden !important;
  background: linear-gradient(115deg, #042034 0%, #07384a 52%, #216B7E 100%) !important;
}
#alm-how-final-cta .alm-tech-final-card--dark::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: url('/wp-content/mu-plugins/almara-platform/assets/almara_hero-welle.webp') 86% 54% / 120% auto no-repeat !important;
  opacity: .24 !important;
  mix-blend-mode: screen !important;
  pointer-events: none !important;
}
#alm-how-final-cta .alm-tech-final-card--dark::after { content: none !important; display: none !important; }
#alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner { position: relative !important; z-index: 2 !important; }
#alm-how-final-cta .alm-tech-final-title .elementor-heading-title { color: #fff !important; }
#alm-how-final-cta .alm-tech-final-text,
#alm-how-final-cta .alm-tech-final-text .elementor-widget-container,
#alm-how-final-cta .alm-tech-final-text p {
  color: rgba(255,255,255,.94) !important;
  opacity: 1 !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.18) !important;
}

/* Buttons and hover: restore stronger coral/aqua interplay */
.alm-tech-btn--primary .elementor-button {
  background: linear-gradient(135deg, #79ACD3 0%, #42919D 100%) !important;
  color: #fff !important;
}
.alm-tech-btn--primary .elementor-button:hover,
.alm-tech-btn--coral .elementor-button:hover {
  background: linear-gradient(135deg, #EDA88E 0%, #DF6541 100%) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}
.alm-tech-btn--secondary .elementor-button:hover {
  border-color: rgba(226,128,93,.72) !important;
  color: #fff !important;
  background: rgba(226,128,93,.16) !important;
}

@media (max-width: 1180px) {
  .alm-tech-process-step:nth-child(2)::after { display: none !important; }
}
@media (max-width: 860px) {
  #alm-how-hero::before {
    background-size: 176% auto !important;
    background-position: 80% 52% !important;
    opacity: .50 !important;
  }
  .alm-tech-process-step:not(:last-child)::after { display: none !important; }
  #alm-how-audience .alm-tech-partner-list-wrap::before { display: none !important; }
}


/* =========================================================
 * ALMARA How It Works v1.5.0 — Brand asset + transition fix
 * Uses the new hero wave asset directly, restores real ALMARA icons,
 * and softens section transitions.
 * ========================================================= */

/* Page rhythm: no hard white gaps between section slots */
.almara-page-how-it-works,
.almara-page-how-it-works > .e-con-inner {
  gap: 0 !important;
  row-gap: 0 !important;
  background: #F3E8DC !important;
}
.almara-page-how-it-works .alm-tech-section {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}
.almara-page-how-it-works .alm-tech-section + .alm-tech-section {
  box-shadow: inset 0 1px 0 rgba(4,32,52,.045) !important;
}

/* Hero: pull the new wave image directly, not the old compatibility filename */
#alm-how-hero {
  position: relative !important;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(4,32,52,.94) 0%, rgba(4,32,52,.78) 39%, rgba(4,32,52,.34) 73%, rgba(4,32,52,.42) 100%),
    url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Hero-Welle_neu.webp') center center / cover no-repeat !important;
}
#alm-how-hero::before,
#alm-how-hero::after {
  content: none !important;
  display: none !important;
  background: none !important;
}
#alm-how-hero > .e-con-inner,
#alm-how-hero.elementor-element > .e-con-inner {
  position: relative !important;
  z-index: 2 !important;
}
#alm-how-hero .alm-tech-hero-copy,
#alm-how-hero .alm-tech-hero-copy > .e-con-inner,
#alm-how-hero .alm-tech-hero-copy .e-con-inner,
#alm-how-hero .alm-tech-hero-copy .elementor-widget-container,
#alm-how-hero .alm-tech-hero-copy .elementor-element,
#alm-how-hero .alm-tech-hero-media,
#alm-how-hero .alm-tech-hero-media > .e-con-inner,
#alm-how-hero .alm-tech-hero-media .e-con-inner {
  background: transparent !important;
}
#alm-how-hero .alm-tech-hero-copy::before,
#alm-how-hero .alm-tech-hero-copy::after {
  content: none !important;
  display: none !important;
}

/* Final CTA: same asset logic as Hero, quieter and fully filled */
#alm-how-final-cta .alm-tech-final-card--dark {
  position: relative !important;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(4,32,52,.96) 0%, rgba(4,32,52,.80) 48%, rgba(33,107,126,.46) 100%),
    url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Hero-Welle_neu.webp') center center / cover no-repeat !important;
}
#alm-how-final-cta .alm-tech-final-card--dark::before,
#alm-how-final-cta .alm-tech-final-card--dark::after {
  content: none !important;
  display: none !important;
  background: none !important;
}
#alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

/* Real ALMARA icons: remove all CSS-drawn placeholder marks */
.alm-tech-brand-mark--caption::before,
.alm-tech-brand-mark--caption::after,
.alm-tech-final-icon::before,
.alm-tech-final-icon::after {
  content: none !important;
  display: none !important;
  background: none !important;
}
.alm-tech-brand-mark--caption,
.alm-tech-final-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 10px 24px rgba(4,32,52,.10) !important;
}
.alm-tech-brand-mark--caption {
  width: 50px !important;
  height: 50px !important;
  padding: 6px !important;
  border-radius: 14px !important;
  background: rgba(4,32,52,.035) !important;
  border: 1px solid rgba(66,145,157,.34) !important;
}
.alm-tech-final-icon {
  width: 64px !important;
  height: 64px !important;
  padding: 8px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(121,172,211,.42) !important;
}
.alm-tech-brand-mark--caption img,
.alm-tech-final-icon img,
.alm-tech-brand-mark--caption .elementor-widget-container img,
.alm-tech-final-icon .elementor-widget-container img,
.alm-tech-brand-mark--caption .elementor-image img,
.alm-tech-final-icon .elementor-image img {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  width: 78% !important;
  max-width: 78% !important;
  height: auto !important;
  object-fit: contain !important;
}
.alm-tech-final-icon img,
.alm-tech-final-icon .elementor-widget-container img,
.alm-tech-final-icon .elementor-image img {
  width: 82% !important;
  max-width: 82% !important;
}

/* Ensure all dark CTA text remains readable over the wave */
#alm-how-final-cta .alm-tech-final-title .elementor-heading-title,
#alm-how-final-cta .alm-tech-final-text,
#alm-how-final-cta .alm-tech-final-text .elementor-widget-container,
#alm-how-final-cta .alm-tech-final-text p {
  color: rgba(255,255,255,.96) !important;
  opacity: 1 !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.22) !important;
}

/* Hover: keep the new orange/coral interaction visible */
.alm-tech-feature-card:hover,
.alm-tech-feature-card--compact:hover,
.alm-tech-final-card--light:hover {
  border-color: rgba(226,128,93,.48) !important;
  box-shadow: 0 30px 78px rgba(4,32,52,.16), 0 0 0 1px rgba(226,128,93,.16) !important;
  transform: translateY(-6px) !important;
}
.alm-tech-feature-card:hover .alm-tech-card-title .elementor-heading-title,
.alm-tech-feature-card--compact:hover .alm-tech-card-title .elementor-heading-title,
.alm-tech-final-card--light:hover .alm-tech-contact-title .elementor-heading-title {
  color: #DF6541 !important;
}
.alm-tech-feature-card:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-feature-card--compact:hover .alm-tech-ui-icon .elementor-icon {
  color: #EDA88E !important;
  fill: #EDA88E !important;
  border-color: rgba(226,128,93,.58) !important;
  background: rgba(226,128,93,.10) !important;
}

/* Mobile: use the same direct asset, just shifted for composition */
@media (max-width: 860px) {
  #alm-how-hero {
    background:
      linear-gradient(90deg, rgba(4,32,52,.94) 0%, rgba(4,32,52,.78) 54%, rgba(4,32,52,.42) 100%),
      url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Hero-Welle_neu.webp') 72% center / auto 100% no-repeat !important;
  }
  #alm-how-final-cta .alm-tech-final-card--dark {
    background:
      linear-gradient(90deg, rgba(4,32,52,.96) 0%, rgba(4,32,52,.80) 58%, rgba(33,107,126,.42) 100%),
      url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Hero-Welle_neu.webp') 74% center / auto 100% no-repeat !important;
  }
}


/* =========================================================
 * v1.5.1 ICON + CTA PILL FIX
 * Canonical ALMARA brand-chip assets and button centering.
 * ========================================================= */

/* Brand chips: use image backgrounds, not the inner Elementor image.
   This prevents broken placeholders and guarantees correct light/dark usage. */
.alm-tech-brand-mark--caption,
.alm-tech-final-icon {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  font-size: 0 !important;
  line-height: 0 !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  box-sizing: border-box !important;
}

.alm-tech-brand-mark--caption {
  width: 50px !important;
  height: 50px !important;
  padding: 0 !important;
  border-radius: 14px !important;
  border: 1px solid rgba(66,145,157,.36) !important;
  background-color: rgba(255,255,255,.72) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_transparent.webp') !important;
  background-size: 70% auto !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 10px 24px rgba(4,32,52,.08) !important;
}

.alm-tech-final-icon {
  width: 64px !important;
  height: 64px !important;
  padding: 0 !important;
  border-radius: 16px !important;
  border: 1px solid rgba(121,172,211,.44) !important;
  background-color: rgba(255,255,255,.08) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_light_transparent.webp') !important;
  background-size: 70% auto !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 28px rgba(4,32,52,.18) !important;
}

/* Hide Elementor's inner image/rendered placeholder in brand-chip widgets. */
.alm-tech-brand-mark--caption .elementor-widget-container,
.alm-tech-final-icon .elementor-widget-container {
  width: 100% !important;
  height: 100% !important;
  font-size: 0 !important;
  line-height: 0 !important;
  background: transparent !important;
}

.alm-tech-brand-mark--caption img,
.alm-tech-final-icon img,
.alm-tech-brand-mark--caption svg,
.alm-tech-final-icon svg,
.alm-tech-brand-mark--caption .elementor-icon,
.alm-tech-final-icon .elementor-icon,
.alm-tech-brand-mark--caption .elementor-widget-container img,
.alm-tech-final-icon .elementor-widget-container img,
.alm-tech-brand-mark--caption .elementor-image img,
.alm-tech-final-icon .elementor-image img {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* CTA pills: vertically/horizontally center text and arrows consistently. */
.alm-tech-btn .elementor-button,
.alm-tech-final-buttons .elementor-button,
.alm-tech-hero-ctas .elementor-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 48px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.alm-tech-btn .elementor-button-content-wrapper,
.alm-tech-final-buttons .elementor-button-content-wrapper,
.alm-tech-hero-ctas .elementor-button-content-wrapper {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  height: 100% !important;
  line-height: 1 !important;
  width: auto !important;
}

.alm-tech-btn .elementor-button-text,
.alm-tech-final-buttons .elementor-button-text,
.alm-tech-hero-ctas .elementor-button-text {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Keep CSS arrows on the same visual baseline as the text. */
.alm-tech-btn .elementor-button::after,
.alm-tech-final-buttons .elementor-button::after,
.alm-tech-hero-ctas .elementor-button::after {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin-top: 0 !important;
  transform: translateY(0) !important;
}

/* Process arrows: exact center line through icon chips. */
.alm-tech-process-step {
  position: relative !important;
}

.alm-tech-process-step:not(:last-child)::after {
  top: 26px !important;
  right: clamp(-38px, -2.6vw, -22px) !important;
  line-height: 1 !important;
  transform: translateY(-50%) !important;
  opacity: .66 !important;
}

/* Slight CTA text polish after icon fix. */
#alm-how-final-cta .alm-tech-final-text .elementor-widget-container,
#alm-how-final-cta .alm-tech-final-text p {
  color: rgba(255,255,255,.94) !important;
  opacity: 1 !important;
}

/* Mobile: keep CTA buttons centered and readable. */
@media (max-width: 860px) {
  .alm-tech-btn .elementor-button,
  .alm-tech-final-buttons .elementor-button,
  .alm-tech-hero-ctas .elementor-button {
    min-height: 46px !important;
    width: auto !important;
  }

  .alm-tech-process-step:not(:last-child)::after {
    top: auto !important;
    right: auto !important;
    transform: none !important;
  }
}


/* =========================================================
 * v1.5.2 BRAND ICON + HOVER STABILIZATION
 * - transparent ALMARA brand marks, no black square backgrounds
 * - hover affects the complete icon chip, not a duplicated overlay
 * - dark section copy stays white for readability
 * ========================================================= */

/* Brand chips: use transparent WebP marks (files overwritten in this package). */
.alm-tech-brand-mark--caption,
.alm-tech-final-icon {
  position: relative !important;
  isolation: isolate !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-image: none !important;
}

.alm-tech-brand-mark--caption {
  background-color: rgba(255,255,255,.74) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_transparent.webp') !important;
  background-size: 74% auto !important;
  border-color: rgba(66,145,157,.38) !important;
}

.alm-tech-final-icon {
  background-color: rgba(255,255,255,.075) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_light_transparent.webp') !important;
  background-size: 74% auto !important;
  border-color: rgba(121,172,211,.42) !important;
}

/* Hide Elementor's inner image/placeholder completely in brand chips. */
.alm-tech-brand-mark--caption .elementor-widget-container,
.alm-tech-final-icon .elementor-widget-container,
.alm-tech-brand-mark--caption img,
.alm-tech-final-icon img,
.alm-tech-brand-mark--caption svg,
.alm-tech-final-icon svg,
.alm-tech-brand-mark--caption .elementor-icon,
.alm-tech-final-icon .elementor-icon,
.alm-tech-brand-mark--caption .elementor-widget-container img,
.alm-tech-final-icon .elementor-widget-container img,
.alm-tech-brand-mark--caption .elementor-image img,
.alm-tech-final-icon .elementor-image img {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

/* Elementor icon widgets: remove pseudo/duplicate layers and keep hover stable. */
.alm-tech-ui-icon,
.alm-tech-ui-icon .elementor-icon,
.alm-tech-ui-icon .elementor-icon i,
.alm-tech-ui-icon .elementor-icon svg {
  transform: none !important;
}

.alm-tech-ui-icon::before,
.alm-tech-ui-icon::after,
.alm-tech-ui-icon .elementor-icon::before,
.alm-tech-ui-icon .elementor-icon::after {
  content: none !important;
  display: none !important;
}

.alm-tech-ui-icon .elementor-icon {
  transition:
    color .22s ease,
    background-color .22s ease,
    border-color .22s ease,
    box-shadow .22s ease !important;
}

.alm-tech-feature-card:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-feature-card--compact:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-process-step:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-mini-card:hover .alm-tech-ui-icon .elementor-icon {
  transform: none !important;
  color: #EDA88E !important;
  fill: #EDA88E !important;
  border-color: rgba(226,128,93,.58) !important;
  background-color: rgba(226,128,93,.12) !important;
  box-shadow: 0 0 0 7px rgba(226,128,93,.055) !important;
}

/* Light cards may turn headline coral; dark sections keep white copy for contrast. */
.alm-tech-feature-card:hover .alm-tech-card-title .elementor-heading-title,
.alm-tech-feature-card--compact:hover .alm-tech-card-title .elementor-heading-title,
.alm-tech-final-card--light:hover .alm-tech-contact-title .elementor-heading-title {
  color: #DF6541 !important;
}

.alm-tech-section--dark .alm-tech-mini-card:hover .alm-tech-mini-title .elementor-heading-title,
.alm-tech-section--dark .alm-tech-loop-step:hover .alm-tech-loop-title .elementor-heading-title,
.alm-tech-section--dark .alm-tech-card-title .elementor-heading-title {
  color: rgba(255,255,255,.98) !important;
}

.alm-tech-section--dark .alm-tech-mini-card:hover .alm-tech-mini-text .elementor-widget-container,
.alm-tech-section--dark .alm-tech-loop-step:hover .alm-tech-loop-text .elementor-widget-container {
  color: rgba(255,255,255,.86) !important;
}

/* CTA pill micro-centering refinement */
.alm-tech-btn .elementor-button,
.alm-tech-final-buttons .elementor-button,
.alm-tech-hero-ctas .elementor-button {
  min-height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
}

.alm-tech-btn .elementor-button-text,
.alm-tech-final-buttons .elementor-button-text,
.alm-tech-hero-ctas .elementor-button-text {
  line-height: 1 !important;
  transform: translateY(.5px) !important;
}


/* =========================================================
 * v1.5.3 ALMARA BRAND ICON FINAL FIX
 * Uses cache-safe transparent mark files directly in JSON and CSS.
 * Prevents black background squares and keeps hover behavior stable.
 * ========================================================= */

.alm-tech-brand-mark--caption,
.alm-tech-final-icon {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  box-sizing: border-box !important;
}

/* Light surfaces: dark/standard transparent brand mark */
.alm-tech-brand-mark--caption {
  background-color: rgba(255,255,255,.78) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_transparent.webp') !important;
  background-size: 72% auto !important;
  border-color: rgba(66,145,157,.38) !important;
}

/* Dark surfaces / final CTA: light transparent brand mark */
.alm-tech-final-icon {
  background-color: rgba(255,255,255,.075) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_light_transparent.webp') !important;
  background-size: 72% auto !important;
  border-color: rgba(121,172,211,.44) !important;
}

/* Elementor may still render the image widget above the chip.
   The JSON now also points to the transparent mark files, so showing it is safe.
   We keep it visually aligned and remove any native widget background. */
.alm-tech-brand-mark--caption .elementor-widget-container,
.alm-tech-final-icon .elementor-widget-container {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: 0 !important;
}

.alm-tech-brand-mark--caption img,
.alm-tech-final-icon img,
.alm-tech-brand-mark--caption .elementor-widget-container img,
.alm-tech-final-icon .elementor-widget-container img,
.alm-tech-brand-mark--caption .elementor-image img,
.alm-tech-final-icon .elementor-image img {
  display: block !important;
  opacity: 0 !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  background: transparent !important;
  object-fit: contain !important;
}

/* Hover: move the whole chip subtly. No duplicate coral layer. */
.alm-tech-feature-card:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-feature-card--compact:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-process-step:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-mini-card:hover .alm-tech-ui-icon .elementor-icon {
  transform: translateY(-2px) !important;
  color: #EDA88E !important;
  fill: #EDA88E !important;
  border-color: rgba(226,128,93,.58) !important;
  background-color: rgba(226,128,93,.12) !important;
  box-shadow: 0 0 0 7px rgba(226,128,93,.055) !important;
}

.alm-tech-section--dark .alm-tech-mini-card:hover .alm-tech-mini-title .elementor-heading-title,
.alm-tech-section--dark .alm-tech-loop-step:hover .alm-tech-loop-title .elementor-heading-title {
  color: rgba(255,255,255,.98) !important;
}

.alm-tech-section--dark .alm-tech-mini-card:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-section--dark .alm-tech-loop-step:hover .alm-tech-ui-icon .elementor-icon {
  color: #EDA88E !important;
  fill: #EDA88E !important;
  border-color: rgba(226,128,93,.62) !important;
  background-color: rgba(226,128,93,.12) !important;
}


/* =========================================================
 * v1.5.4 HOVER RESTORE + BRAND ICON STABILITY
 * Keeps transparent ALMARA marks from v1.5.3 and restores the
 * stronger v1.5.2-style coral hover without duplicate pseudo layers.
 * ========================================================= */

/* Brand chips: use only the transparent CSS-background marks.
   Any Elementor inner image/widget is hidden to prevent cached black-background files. */
.alm-tech-brand-mark--caption,
.alm-tech-final-icon {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  box-sizing: border-box !important;
}

.alm-tech-brand-mark--caption {
  background-color: rgba(255,255,255,.78) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_transparent.webp') !important;
  background-size: 72% auto !important;
  border-color: rgba(66,145,157,.38) !important;
}

.alm-tech-final-icon {
  background-color: rgba(255,255,255,.075) !important;
  background-image: url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Icon_mark_light_transparent.webp') !important;
  background-size: 72% auto !important;
  border-color: rgba(121,172,211,.44) !important;
}

/* Hide the original Elementor image layer completely so the black-background file cannot leak through. */
.alm-tech-brand-mark--caption .elementor-widget-container,
.alm-tech-final-icon .elementor-widget-container,
.alm-tech-brand-mark--caption img,
.alm-tech-final-icon img,
.alm-tech-brand-mark--caption .elementor-widget-container img,
.alm-tech-final-icon .elementor-widget-container img,
.alm-tech-brand-mark--caption .elementor-image img,
.alm-tech-final-icon .elementor-image img,
.alm-tech-brand-mark--caption svg,
.alm-tech-final-icon svg {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

/* Prevent duplicate/old CSS icon layers. */
.alm-tech-ui-icon::before,
.alm-tech-ui-icon::after,
.alm-tech-ui-icon .elementor-icon::before,
.alm-tech-ui-icon .elementor-icon::after {
  content: none !important;
  display: none !important;
}

/* Baseline icon-chip transition. */
.alm-tech-ui-icon,
.alm-tech-ui-icon .elementor-icon {
  transition:
    transform .24s ease,
    color .24s ease,
    fill .24s ease,
    background-color .24s ease,
    border-color .24s ease,
    box-shadow .24s ease !important;
}

/* Restore stronger card hover from v1.5.2:
   the whole chip responds; no displaced coral pseudo-layer. */
.alm-tech-feature-card:hover,
.alm-tech-feature-card--compact:hover,
.alm-tech-final-card--light:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(226,128,93,.46) !important;
  box-shadow:
    0 28px 76px rgba(31,60,76,.15),
    0 0 0 1px rgba(226,128,93,.20) !important;
}

.alm-tech-feature-card:hover .alm-tech-ui-icon,
.alm-tech-feature-card--compact:hover .alm-tech-ui-icon,
.alm-tech-final-card--light:hover .alm-tech-ui-icon {
  transform: translateY(-2px) !important;
}

.alm-tech-feature-card:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-feature-card--compact:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-final-card--light:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-process-step:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-mini-card:hover .alm-tech-ui-icon .elementor-icon {
  transform: none !important;
  color: #EDA88E !important;
  fill: #EDA88E !important;
  border-color: rgba(226,128,93,.62) !important;
  background-color: rgba(226,128,93,.12) !important;
  box-shadow:
    0 0 0 7px rgba(226,128,93,.055),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

/* Light cards: headline may turn coral. */
.alm-tech-feature-card:hover .alm-tech-card-title .elementor-heading-title,
.alm-tech-feature-card--compact:hover .alm-tech-card-title .elementor-heading-title,
.alm-tech-final-card--light:hover .alm-tech-contact-title .elementor-heading-title {
  color: #DF6541 !important;
}

/* Dark sections: keep type white for premium contrast; only icon/border becomes coral. */
.alm-tech-section--dark .alm-tech-mini-card:hover .alm-tech-mini-title .elementor-heading-title,
.alm-tech-section--dark .alm-tech-loop-step:hover .alm-tech-loop-title .elementor-heading-title,
.alm-tech-section--dark .alm-tech-card-title .elementor-heading-title {
  color: rgba(255,255,255,.98) !important;
}

.alm-tech-section--dark .alm-tech-mini-card:hover .alm-tech-mini-text .elementor-widget-container,
.alm-tech-section--dark .alm-tech-loop-step:hover .alm-tech-loop-text .elementor-widget-container {
  color: rgba(255,255,255,.86) !important;
}

.alm-tech-section--dark .alm-tech-mini-card:hover .alm-tech-ui-icon .elementor-icon,
.alm-tech-section--dark .alm-tech-loop-step:hover .alm-tech-ui-icon .elementor-icon {
  color: #EDA88E !important;
  fill: #EDA88E !important;
  border-color: rgba(226,128,93,.64) !important;
  background-color: rgba(226,128,93,.12) !important;
  box-shadow:
    0 0 0 7px rgba(226,128,93,.07),
    inset 0 1px 0 rgba(255,255,255,.16) !important;
}

/* CTA pill alignment retained. */
.alm-tech-btn .elementor-button,
.alm-tech-final-buttons .elementor-button,
.alm-tech-hero-ctas .elementor-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 48px !important;
}

.alm-tech-btn .elementor-button-text,
.alm-tech-final-buttons .elementor-button-text,
.alm-tech-hero-ctas .elementor-button-text {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
  transform: translateY(.5px) !important;
}


/* =========================================================
 * v1.5.5 TABLET CLEAN / FINAL FREEZE CANDIDATE
 * Desktop remains frozen. This block only stabilizes tablet rhythm
 * and medium-viewport card grids. Header behavior is intentionally untouched.
 * ========================================================= */

/* Freeze coral palette from the approved desktop stand */
.almara-page-how-it-works {
  --alm-v14-coral: #EDA88E;
  --alm-v14-coral-soft: #EDA88E;
  --alm-v14-coral-strong: #DF6541;
}

/* Header-safe: no tablet header overrides here. The global Header template controls tablet CTA/navigation. */

/* Tablet section rhythm: closer to desktop, less mobile stacking */
@media (min-width: 641px) and (max-width: 1024px) {
  .almara-page-how-it-works {
    --alm-v14-section-x: clamp(32px, 6vw, 56px);
    --alm-v14-section-y: clamp(68px, 8vw, 94px);
  }

  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    width: min(100%, 900px) !important;
    max-width: 900px !important;
    padding-block: var(--alm-v14-section-y) !important;
  }

  #alm-how-hero > .e-con-inner,
  #alm-how-hero.elementor-element > .e-con-inner {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
    max-width: 760px !important;
    padding-top: 64px !important;
    padding-bottom: 74px !important;
  }

  #alm-how-hero .alm-tech-hero-copy {
    max-width: 670px !important;
  }

  #alm-how-hero .alm-tech-hero-title .elementor-heading-title {
    font-size: clamp(56px, 8.2vw, 76px) !important;
    line-height: .90 !important;
    max-width: 660px !important;
  }

  #alm-how-hero .alm-tech-hero-lead {
    max-width: 640px !important;
    margin-top: 22px !important;
  }

  #alm-how-hero .alm-tech-hero-media {
    justify-self: center !important;
    width: min(100%, 560px) !important;
  }

  #alm-how-hero .alm-tech-hero-img,
  #alm-how-hero .alm-tech-hero-img .elementor-widget-container,
  #alm-how-hero .alm-tech-hero-img img {
    height: clamp(250px, 36vw, 330px) !important;
  }

  #alm-how-expect > .e-con-inner,
  #alm-how-equipment > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-audience > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner {
    grid-template-columns: minmax(240px, 310px) minmax(0, 1fr) !important;
    gap: clamp(34px, 5vw, 56px) !important;
    align-items: center !important;
  }

  #alm-how-safety > .e-con-inner,
  #alm-how-flow > .e-con-inner {
    grid-template-columns: minmax(240px, 310px) minmax(0, 1fr) !important;
    gap: clamp(34px, 5vw, 56px) !important;
  }

  #alm-how-audience > .e-con-inner {
    grid-template-columns: minmax(230px, 290px) minmax(230px, 310px) minmax(300px, 1fr) !important;
  }

  .alm-tech-section-title .elementor-heading-title {
    font-size: clamp(40px, 5.8vw, 58px) !important;
    line-height: .94 !important;
  }

  .almara-page-how-it-works .alm-tech-feature-grid,
  .almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid,
  .almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid,
  .almara-page-how-it-works .alm-tech-process-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-feature-grid .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid .e-con-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }

  .almara-page-how-it-works .alm-tech-loop-grid,
  .almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-loop-grid .e-con-inner {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
  }

  .almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner::before,
  .almara-page-how-it-works .alm-tech-loop-grid .e-con-inner::before,
  .alm-tech-process-step:not(:last-child)::after {
    display: none !important;
  }

  .alm-tech-feature-card,
  .alm-tech-feature-card--compact {
    min-height: 210px !important;
  }

  .alm-tech-feature-card > .e-con-inner,
  .alm-tech-feature-card--compact > .e-con-inner {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding: 24px !important;
  }

  .alm-tech-mini-card {
    border-left: 0 !important;
  }

  .alm-tech-mini-card > .e-con-inner {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    padding: 18px 16px !important;
    border-radius: 18px !important;
  }

  .alm-tech-process-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    align-items: center !important;
    text-align: left !important;
    column-gap: 18px !important;
    row-gap: 4px !important;
  }

  .alm-tech-process-icon,
  .alm-tech-process-step .alm-tech-ui-icon {
    grid-area: icon !important;
  }

  .alm-tech-process-title { grid-area: title !important; }
  .alm-tech-process-text { grid-area: text !important; }

  .alm-tech-gallery-media,
  .alm-tech-gallery-media > .e-con-inner,
  .alm-tech-gallery-media .e-con-inner {
    grid-template-columns: 1.2fr .8fr .8fr !important;
    grid-template-rows: 180px 140px !important;
  }

  .alm-tech-partner-visual-card,
  #alm-how-audience .alm-tech-partner-visual-card {
    max-width: 100% !important;
  }

  .alm-tech-partner-img,
  .alm-tech-partner-img .elementor-widget-container,
  .alm-tech-partner-img img {
    min-height: 240px !important;
  }

  #alm-how-final-cta > .e-con-inner {
    grid-template-columns: 1fr !important;
    max-width: 760px !important;
  }

  #alm-how-final-cta .alm-tech-final-card--dark,
  #alm-how-final-cta .alm-tech-final-card--light {
    min-height: auto !important;
  }
}

/* Narrow tablet / large mobile: keep one-column flow but make it calmer */
@media (min-width: 641px) and (max-width: 760px) {
  #alm-how-expect > .e-con-inner,
  #alm-how-equipment > .e-con-inner,
  #alm-how-safety > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-flow > .e-con-inner,
  #alm-how-audience > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner {
    grid-template-columns: 1fr !important;
    max-width: 640px !important;
  }

  .alm-tech-section-copy,
  .alm-tech-equipment-copy {
    max-width: 520px !important;
  }

  .alm-tech-feature-grid,
  .alm-tech-feature-grid > .e-con-inner,
  .alm-tech-mini-grid,
  .alm-tech-mini-grid > .e-con-inner,
  .alm-tech-process-grid,
  .alm-tech-process-grid > .e-con-inner,
  .alm-tech-loop-grid,
  .alm-tech-loop-grid > .e-con-inner {
    grid-template-columns: 1fr !important;
  }
}


/* =========================================================
 * ALMARA How It Works v1.5.7 — Tablet Polish / Header-Safe
 * Scope: Technology content only. No global header overrides.
 * Desktop remains frozen from v1.5.4/1.5.5 line.
 * ========================================================= */

.almara-page-how-it-works {
  --alm-v156-tablet-max: 760px;
  --alm-v157-portrait-max: 620px;
  --alm-v14-coral: #EDA88E;
  --alm-v14-coral-soft: #EDA88E;
  --alm-v14-coral-strong: #DF6541;
}


/* Medium tablet: keep a premium, not-too-mobile rhythm. */
@media (min-width: 641px) and (max-width: 1024px) {
  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    width: min(100%, 900px) !important;
    max-width: 900px !important;
  }

  #alm-how-hero > .e-con-inner,
  #alm-how-hero.elementor-element > .e-con-inner {
    max-width: 780px !important;
    padding-top: clamp(58px, 7vw, 74px) !important;
    padding-bottom: clamp(66px, 8vw, 86px) !important;
    gap: 34px !important;
  }

  #alm-how-hero .alm-tech-hero-ctas,
  #alm-how-hero .alm-tech-hero-ctas > .e-con-inner,
  #alm-how-hero .alm-tech-hero-ctas .e-con-inner {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    align-items: center !important;
  }

  #alm-how-hero .alm-tech-hero-ctas .alm-tech-btn .elementor-button {
    min-width: 190px !important;
    width: auto !important;
  }

  .almara-page-how-it-works .alm-tech-feature-grid,
  .almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid,
  .almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid,
  .almara-page-how-it-works .alm-tech-process-grid > .e-con-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }

  .almara-page-how-it-works .alm-tech-loop-grid,
  .almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }

  #alm-how-final-cta > .e-con-inner {
    max-width: 780px !important;
  }
}

/* Narrow tablet / portrait tablet polish based on current screenshot. */
@media (max-width: 640px) {
  .almara-page-how-it-works {
    --alm-v14-section-y: clamp(48px, 13vw, 66px);
    --alm-v14-section-x: clamp(18px, 5.2vw, 28px);
  }

  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    padding-top: var(--alm-v14-section-y) !important;
    padding-bottom: var(--alm-v14-section-y) !important;
  }

  #alm-how-hero > .e-con-inner,
  #alm-how-hero.elementor-element > .e-con-inner {
    padding-top: 42px !important;
    padding-bottom: 48px !important;
    gap: 24px !important;
  }

  #alm-how-hero .alm-tech-hero-title .elementor-heading-title {
    font-size: clamp(38px, 12.4vw, 50px) !important;
    line-height: .90 !important;
    max-width: 340px !important;
  }

  #alm-how-hero .alm-tech-hero-lead,
  #alm-how-hero .alm-tech-hero-lead .elementor-widget-container,
  #alm-how-hero .alm-tech-hero-lead p {
    max-width: 350px !important;
    font-size: 13.5px !important;
    line-height: 1.58 !important;
  }

  #alm-how-hero .alm-tech-hero-ctas,
  #alm-how-hero .alm-tech-hero-ctas > .e-con-inner,
  #alm-how-hero .alm-tech-hero-ctas .e-con-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 340px !important;
  }

  #alm-how-hero .alm-tech-hero-ctas .elementor-button {
    width: 100% !important;
    min-height: 42px !important;
    padding: 12px 18px !important;
  }

  #alm-how-hero .alm-tech-hero-media,
  #alm-how-hero .alm-tech-hero-card {
    width: 100% !important;
    max-width: 330px !important;
  }

  #alm-how-hero .alm-tech-hero-img,
  #alm-how-hero .alm-tech-hero-img .elementor-widget-container,
  #alm-how-hero .alm-tech-hero-img img {
    height: clamp(178px, 50vw, 220px) !important;
  }

  .almara-page-how-it-works .alm-tech-section-title .elementor-heading-title {
    font-size: clamp(32px, 10.2vw, 44px) !important;
    line-height: .94 !important;
  }

  .alm-tech-feature-card,
  .alm-tech-feature-card--compact {
    min-height: auto !important;
  }

  .alm-tech-feature-card > .e-con-inner,
  .alm-tech-feature-card--compact > .e-con-inner {
    padding: 17px 18px !important;
  }

  .alm-tech-card-title .elementor-heading-title,
  .alm-tech-mini-title .elementor-heading-title,
  .alm-tech-process-title .elementor-heading-title {
    font-size: 15px !important;
    line-height: 1.18 !important;
  }

  .alm-tech-card-text .elementor-widget-container,
  .alm-tech-mini-text .elementor-widget-container,
  .alm-tech-process-text .elementor-widget-container {
    font-size: 13px !important;
    line-height: 1.48 !important;
  }

  .alm-tech-process-step > .e-con-inner {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }

  .alm-tech-process-icon .elementor-icon,
  .alm-tech-process-step .alm-tech-ui-icon .elementor-icon {
    width: 42px !important;
    height: 42px !important;
  }

  #alm-how-flow .alm-tech-loop-grid,
  #alm-how-flow .alm-tech-loop-grid > .e-con-inner {
    gap: 18px !important;
  }

  #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  #alm-how-audience .alm-tech-checklist {
    margin-top: 2px !important;
  }

  #alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-card--light > .e-con-inner {
    padding: 24px 22px !important;
  }

  #alm-how-final-cta .alm-tech-final-buttons,
  #alm-how-final-cta .alm-tech-final-buttons > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-buttons .e-con-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  #alm-how-final-cta .alm-tech-final-buttons .elementor-button {
    width: 100% !important;
    min-height: 42px !important;
  }
}


/* =========================================================
 * ALMARA How It Works v1.5.7 — Tablet Final Polish / Header-Safe
 * Scope: Content layout only. No global header overrides.
 * Goal: remove cramped narrow-tablet grids, stabilize equipment,
 * partner and loop sections, preserve desktop freeze.
 * ========================================================= */

/* Wider portrait tablets: use premium stacking where cards would be too narrow. */
@media (min-width: 521px) and (max-width: 760px) {
  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    max-width: 660px !important;
  }

  #alm-how-expect > .e-con-inner,
  #alm-how-equipment > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-audience > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
    align-items: start !important;
  }

  #alm-how-safety > .e-con-inner,
  #alm-how-flow > .e-con-inner {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
    align-items: start !important;
  }

  .alm-tech-section-copy,
  .alm-tech-equipment-copy {
    max-width: 560px !important;
  }

  .almara-page-how-it-works .alm-tech-feature-grid,
  .almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-feature-grid .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid,
  .almara-page-how-it-works .alm-tech-process-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid,
  .almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid .e-con-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }

  .almara-page-how-it-works .alm-tech-loop-grid,
  .almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-loop-grid .e-con-inner {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }

  .alm-tech-gallery-card,
  .alm-tech-equipment-visuals,
  .alm-tech-partner-visual-card {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }

  #alm-how-audience .alm-tech-checklist,
  #alm-how-audience .alm-tech-partner-list-wrap {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Narrow tablet / phone-like tablet portrait from the current screenshot. */
@media (max-width: 520px) {
  .almara-page-how-it-works {
    --alm-v14-section-y: clamp(48px, 14vw, 62px);
    --alm-v14-section-x: clamp(18px, 5.4vw, 24px);
  }

  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    width: 100% !important;
    max-width: 390px !important;
    padding-inline: var(--alm-v14-section-x) !important;
  }

  #alm-how-expect > .e-con-inner,
  #alm-how-equipment > .e-con-inner,
  #alm-how-safety > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-flow > .e-con-inner,
  #alm-how-audience > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner {
    grid-template-columns: 1fr !important;
    gap: 26px !important;
    align-items: start !important;
  }

  .alm-tech-section-copy,
  .alm-tech-equipment-copy {
    max-width: 100% !important;
  }

  /* Cards: one wide column instead of cramped 2-column cards. */
  .almara-page-how-it-works .alm-tech-feature-grid,
  .almara-page-how-it-works .alm-tech-feature-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-feature-grid .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid,
  .almara-page-how-it-works .alm-tech-process-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-process-grid .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid,
  .almara-page-how-it-works .alm-tech-mini-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-mini-grid .e-con-inner,
  .almara-page-how-it-works .alm-tech-loop-grid,
  .almara-page-how-it-works .alm-tech-loop-grid > .e-con-inner,
  .almara-page-how-it-works .alm-tech-loop-grid .e-con-inner {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  /* First system cards + network/future cards: compact horizontal card, not narrow tile. */
  #alm-how-expect .alm-tech-feature-card > .e-con-inner,
  #alm-how-faq .alm-tech-feature-card > .e-con-inner,
  #alm-how-ready .alm-tech-feature-card > .e-con-inner,
  #alm-how-faq .alm-tech-feature-card--compact > .e-con-inner,
  #alm-how-ready .alm-tech-feature-card--compact > .e-con-inner {
    display: grid !important;
    grid-template-columns: 50px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    align-items: center !important;
    text-align: left !important;
    gap: 5px 14px !important;
    padding: 17px 18px !important;
  }

  #alm-how-expect .alm-tech-feature-card .alm-tech-ui-icon,
  #alm-how-faq .alm-tech-feature-card .alm-tech-ui-icon,
  #alm-how-ready .alm-tech-feature-card .alm-tech-ui-icon,
  #alm-how-faq .alm-tech-feature-card--compact .alm-tech-ui-icon,
  #alm-how-ready .alm-tech-feature-card--compact .alm-tech-ui-icon {
    grid-area: icon !important;
    width: 44px !important;
    height: 44px !important;
    align-self: center !important;
  }

  #alm-how-expect .alm-tech-card-title,
  #alm-how-faq .alm-tech-card-title,
  #alm-how-ready .alm-tech-card-title { grid-area: title !important; }
  #alm-how-expect .alm-tech-card-text,
  #alm-how-faq .alm-tech-card-text,
  #alm-how-ready .alm-tech-card-text { grid-area: text !important; }

  /* Equipment visual: full-width, premium, with a less tall collage. */
  #alm-how-equipment .alm-tech-equipment-visuals,
  #alm-how-equipment .alm-tech-gallery-card {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }

  #alm-how-equipment .alm-tech-gallery-media,
  #alm-how-equipment .alm-tech-gallery-media > .e-con-inner,
  #alm-how-equipment .alm-tech-gallery-media .e-con-inner {
    grid-template-columns: 1.35fr .8fr !important;
    grid-template-rows: 120px 96px !important;
    gap: 8px !important;
    padding: 10px 10px 0 !important;
  }

  #alm-how-equipment .alm-tech-gallery-img--main {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 3 !important;
  }
  #alm-how-equipment .alm-tech-gallery-img--detail-1 {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important;
  }
  #alm-how-equipment .alm-tech-gallery-img--detail-2 {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important;
  }
  #alm-how-equipment .alm-tech-gallery-img--detail-3 {
    display: none !important;
  }

  /* Dark safety band: stack headline, then full-width mini cards. */
  #alm-how-safety .alm-tech-mini-card,
  #alm-how-flow .alm-tech-loop-step {
    border-left: 0 !important;
  }

  #alm-how-safety .alm-tech-mini-card > .e-con-inner {
    display: grid !important;
    grid-template-columns: 50px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 5px 14px !important;
    padding: 16px 16px !important;
    background: rgba(255,255,255,.035) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 16px !important;
  }
  #alm-how-safety .alm-tech-mini-card .alm-tech-ui-icon {
    grid-area: icon !important;
    width: 44px !important;
    height: 44px !important;
  }
  #alm-how-safety .alm-tech-mini-title { grid-area: title !important; }
  #alm-how-safety .alm-tech-mini-text { grid-area: text !important; }

  /* Bookable process: keep vertical rhythm tighter and remove misplaced arrows. */
  .alm-tech-process-step:not(:last-child)::after {
    display: none !important;
  }
  #alm-how-booking .alm-tech-process-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    text-align: left !important;
    align-items: center !important;
    gap: 4px 14px !important;
    padding: 15px 0 !important;
  }
  #alm-how-booking .alm-tech-process-icon,
  #alm-how-booking .alm-tech-process-step .alm-tech-ui-icon { grid-area: icon !important; }
  #alm-how-booking .alm-tech-process-title { grid-area: title !important; }
  #alm-how-booking .alm-tech-process-text { grid-area: text !important; }

  /* Operating loop: readable stacked timeline instead of squeezed multi-column row. */
  #alm-how-flow .alm-tech-loop-grid,
  #alm-how-flow .alm-tech-loop-grid > .e-con-inner,
  #alm-how-flow .alm-tech-loop-grid .e-con-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    grid-template-areas: "number title" "number text" !important;
    column-gap: 14px !important;
    row-gap: 2px !important;
    align-items: start !important;
    text-align: left !important;
    padding: 8px 0 !important;
  }
  #alm-how-flow .alm-tech-loop-number {
    grid-area: number !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
  }
  #alm-how-flow .alm-tech-loop-title { grid-area: title !important; }
  #alm-how-flow .alm-tech-loop-text { grid-area: text !important; }

  /* Partner section: text, checklist and image should stack cleanly. */
  #alm-how-audience .alm-tech-checklist,
  #alm-how-audience .alm-tech-partner-list-wrap,
  #alm-how-audience .alm-tech-partner-visual-card {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }
  #alm-how-audience .alm-tech-partner-list-wrap::before {
    display: none !important;
  }
  #alm-how-audience .alm-tech-checklist > .e-con-inner {
    padding: 18px 20px !important;
  }
  #alm-how-audience .alm-tech-partner-img,
  #alm-how-audience .alm-tech-partner-img .elementor-widget-container,
  #alm-how-audience .alm-tech-partner-img img {
    min-height: 210px !important;
    height: 210px !important;
  }

  /* Final CTA: keep full-width buttons, but give card a little more air. */
  #alm-how-final-cta > .e-con-inner {
    max-width: 390px !important;
    gap: 16px !important;
  }
  #alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-card--light > .e-con-inner {
    padding: 26px 22px !important;
  }
}

/* Very narrow mobile safety: prevent any inherited two-column grid. */
@media (max-width: 390px) {
  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    max-width: 360px !important;
  }
  #alm-how-hero .alm-tech-hero-title .elementor-heading-title,
  .almara-page-how-it-works .alm-tech-section-title .elementor-heading-title {
    word-break: normal !important;
    overflow-wrap: normal !important;
  }
}


/* =========================================================
 * ALMARA How It Works v1.5.8 — Tablet Portrait Fix / Header-Safe
 * Scope: CSS only, content layout only. Desktop and global header stay untouched.
 * Fix: current tablet viewport was still receiving cramped desktop-style 2-col grids.
 * ========================================================= */

@media (min-width: 521px) and (max-width: 860px) {
  .almara-page-how-it-works {
    --alm-v14-section-y: clamp(62px, 9vw, 82px);
    --alm-v14-section-x: clamp(28px, 5.2vw, 42px);
  }

  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    width: 100% !important;
    max-width: 700px !important;
    padding-inline: var(--alm-v14-section-x) !important;
  }

  /* Tablet portrait should read as a premium stacked layout, not a squeezed desktop layout. */
  #alm-how-expect > .e-con-inner,
  #alm-how-equipment > .e-con-inner,
  #alm-how-booking > .e-con-inner,
  #alm-how-audience > .e-con-inner,
  #alm-how-faq > .e-con-inner,
  #alm-how-ready > .e-con-inner,
  #alm-how-safety > .e-con-inner,
  #alm-how-flow > .e-con-inner {
    grid-template-columns: 1fr !important;
    gap: clamp(28px, 5vw, 42px) !important;
    align-items: start !important;
  }

  .alm-tech-section-copy,
  .alm-tech-equipment-copy,
  #alm-how-safety .alm-tech-section-copy,
  #alm-how-flow .alm-tech-section-copy {
    width: 100% !important;
    max-width: 560px !important;
  }

  /* Main feature cards: one wide horizontal card column on portrait tablet. */
  #alm-how-expect .alm-tech-feature-grid,
  #alm-how-expect .alm-tech-feature-grid > .e-con-inner,
  #alm-how-expect .alm-tech-feature-grid .e-con-inner,
  #alm-how-faq .alm-tech-feature-grid,
  #alm-how-faq .alm-tech-feature-grid > .e-con-inner,
  #alm-how-faq .alm-tech-feature-grid .e-con-inner,
  #alm-how-ready .alm-tech-feature-grid,
  #alm-how-ready .alm-tech-feature-grid > .e-con-inner,
  #alm-how-ready .alm-tech-feature-grid .e-con-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 620px !important;
  }

  #alm-how-expect .alm-tech-feature-card,
  #alm-how-faq .alm-tech-feature-card,
  #alm-how-ready .alm-tech-feature-card,
  #alm-how-faq .alm-tech-feature-card--compact,
  #alm-how-ready .alm-tech-feature-card--compact {
    width: 100% !important;
    max-width: 100% !important;
  }

  #alm-how-expect .alm-tech-feature-card > .e-con-inner,
  #alm-how-faq .alm-tech-feature-card > .e-con-inner,
  #alm-how-ready .alm-tech-feature-card > .e-con-inner,
  #alm-how-faq .alm-tech-feature-card--compact > .e-con-inner,
  #alm-how-ready .alm-tech-feature-card--compact > .e-con-inner {
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    align-items: center !important;
    gap: 5px 16px !important;
    text-align: left !important;
    padding: 18px 22px !important;
    min-height: 0 !important;
  }

  #alm-how-expect .alm-tech-feature-card .alm-tech-ui-icon,
  #alm-how-faq .alm-tech-feature-card .alm-tech-ui-icon,
  #alm-how-ready .alm-tech-feature-card .alm-tech-ui-icon,
  #alm-how-faq .alm-tech-feature-card--compact .alm-tech-ui-icon,
  #alm-how-ready .alm-tech-feature-card--compact .alm-tech-ui-icon {
    grid-area: icon !important;
    width: 50px !important;
    height: 50px !important;
    align-self: center !important;
  }

  #alm-how-expect .alm-tech-card-title,
  #alm-how-faq .alm-tech-card-title,
  #alm-how-ready .alm-tech-card-title { grid-area: title !important; }

  #alm-how-expect .alm-tech-card-text,
  #alm-how-faq .alm-tech-card-text,
  #alm-how-ready .alm-tech-card-text { grid-area: text !important; }

  /* Equipment: let the image collage breathe below the copy. */
  #alm-how-equipment .alm-tech-gallery-card,
  #alm-how-equipment .alm-tech-equipment-visuals {
    width: 100% !important;
    max-width: 640px !important;
    justify-self: stretch !important;
  }

  #alm-how-equipment .alm-tech-gallery-media,
  #alm-how-equipment .alm-tech-gallery-media > .e-con-inner,
  #alm-how-equipment .alm-tech-gallery-media .e-con-inner {
    grid-template-columns: 1.35fr .8fr !important;
    grid-template-rows: clamp(138px, 27vw, 190px) clamp(112px, 21vw, 150px) !important;
    gap: 10px !important;
    padding: 12px 12px 0 !important;
  }

  #alm-how-equipment .alm-tech-gallery-img--main { grid-column: 1 / 2 !important; grid-row: 1 / 3 !important; }
  #alm-how-equipment .alm-tech-gallery-img--detail-1 { grid-column: 2 / 3 !important; grid-row: 1 / 2 !important; }
  #alm-how-equipment .alm-tech-gallery-img--detail-2 { grid-column: 2 / 3 !important; grid-row: 2 / 3 !important; }
  #alm-how-equipment .alm-tech-gallery-img--detail-3 { display: none !important; }

  /* Safety band: headline first, then a readable 2-col grid. */
  #alm-how-safety .alm-tech-mini-grid,
  #alm-how-safety .alm-tech-mini-grid > .e-con-inner,
  #alm-how-safety .alm-tech-mini-grid .e-con-inner {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    width: 100% !important;
  }

  #alm-how-safety .alm-tech-mini-card {
    border-left: 0 !important;
  }

  #alm-how-safety .alm-tech-mini-card > .e-con-inner {
    background: rgba(255,255,255,.035) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 16px !important;
    padding: 18px !important;
    min-height: 150px !important;
    align-items: start !important;
  }

  /* Bookable process: keep 2x2 on portrait tablet, but align the cards cleaner. */
  #alm-how-booking .alm-tech-process-grid,
  #alm-how-booking .alm-tech-process-grid > .e-con-inner,
  #alm-how-booking .alm-tech-process-grid .e-con-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    width: 100% !important;
  }

  #alm-how-booking .alm-tech-process-step:not(:last-child)::after {
    display: none !important;
  }

  #alm-how-booking .alm-tech-process-step > .e-con-inner {
    padding: 18px 16px !important;
    min-height: 156px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    gap: 9px !important;
  }

  #alm-how-booking .alm-tech-process-icon,
  #alm-how-booking .alm-tech-process-step .alm-tech-ui-icon {
    width: 54px !important;
    height: 54px !important;
  }

  /* Operating loop: convert squeezed row into a 2-column timeline-card grid. */
  #alm-how-flow .alm-tech-loop-grid,
  #alm-how-flow .alm-tech-loop-grid > .e-con-inner,
  #alm-how-flow .alm-tech-loop-grid .e-con-inner {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
  }

  #alm-how-flow .alm-tech-loop-grid > .e-con-inner::before,
  #alm-how-flow .alm-tech-loop-grid .e-con-inner::before {
    display: none !important;
  }

  #alm-how-flow .alm-tech-loop-step {
    border-left: 0 !important;
  }

  #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    grid-template-areas: "num title" "num text" !important;
    column-gap: 12px !important;
    row-gap: 2px !important;
    align-items: start !important;
    text-align: left !important;
    padding: 12px 10px !important;
    min-height: 110px !important;
    background: rgba(255,255,255,.025) !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    border-radius: 14px !important;
  }

  #alm-how-flow .alm-tech-loop-number { grid-area: num !important; width: 28px !important; height: 28px !important; margin: 0 !important; }
  #alm-how-flow .alm-tech-loop-title { grid-area: title !important; }
  #alm-how-flow .alm-tech-loop-text { grid-area: text !important; }

  /* Partner: strong stack: copy, bullet box, image full-width. */
  #alm-how-audience .alm-tech-partner-list-wrap,
  #alm-how-audience .alm-tech-checklist,
  #alm-how-audience .alm-tech-partner-visual-card {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }

  #alm-how-audience .alm-tech-partner-list-wrap::before {
    display: none !important;
  }

  #alm-how-audience .alm-tech-checklist > .e-con-inner {
    padding: 20px 24px !important;
  }

  #alm-how-audience .alm-tech-partner-img,
  #alm-how-audience .alm-tech-partner-img .elementor-widget-container,
  #alm-how-audience .alm-tech-partner-img img {
    height: clamp(238px, 42vw, 320px) !important;
    min-height: 238px !important;
  }

  #alm-how-audience .alm-tech-partner-visual-card .alm-tech-btn {
    left: 22px !important;
    bottom: 22px !important;
  }

  /* Final CTA: more room, less compressed. */
  #alm-how-final-cta > .e-con-inner {
    gap: 18px !important;
  }

  #alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-card--light > .e-con-inner {
    padding: 30px 28px !important;
  }
}

/* The very narrow end of tablet portrait should behave like premium mobile. */
@media (max-width: 640px) {
  #alm-how-safety .alm-tech-mini-grid,
  #alm-how-safety .alm-tech-mini-grid > .e-con-inner,
  #alm-how-safety .alm-tech-mini-grid .e-con-inner,
  #alm-how-booking .alm-tech-process-grid,
  #alm-how-booking .alm-tech-process-grid > .e-con-inner,
  #alm-how-booking .alm-tech-process-grid .e-con-inner,
  #alm-how-flow .alm-tech-loop-grid,
  #alm-how-flow .alm-tech-loop-grid > .e-con-inner,
  #alm-how-flow .alm-tech-loop-grid .e-con-inner {
    grid-template-columns: 1fr !important;
  }

  #alm-how-booking .alm-tech-process-step > .e-con-inner,
  #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    min-height: 0 !important;
  }
}


/* =========================================================
 * ALMARA How It Works v1.5.9 — Tablet Freeze Polish / Header-Safe
 * Scope: final tablet polish only. Desktop + global header stay untouched.
 * Intent: keep v1.5.8 structure, add slightly more premium spacing,
 * harmonize partner image, and calm dark-section density.
 * ========================================================= */

/* iPad / tablet portrait: a little more premium air without changing the structure. */
@media (min-width: 521px) and (max-width: 860px) {
  .almara-page-how-it-works .alm-tech-section > .e-con-inner {
    max-width: 720px !important;
  }

  #alm-how-expect,
  #alm-how-equipment,
  #alm-how-booking,
  #alm-how-faq,
  #alm-how-ready,
  #alm-how-final-cta {
    padding-top: clamp(66px, 9.8vw, 88px) !important;
    padding-bottom: clamp(66px, 9.8vw, 88px) !important;
  }

  #alm-how-safety,
  #alm-how-flow {
    padding-top: clamp(72px, 10.5vw, 94px) !important;
    padding-bottom: clamp(72px, 10.5vw, 94px) !important;
  }

  #alm-how-equipment .alm-tech-gallery-card,
  #alm-how-equipment .alm-tech-equipment-visuals,
  #alm-how-audience .alm-tech-partner-visual-card {
    max-width: 650px !important;
    margin-inline: auto !important;
  }

  #alm-how-audience .alm-tech-checklist,
  #alm-how-audience .alm-tech-partner-list-wrap {
    max-width: 650px !important;
    margin-inline: auto !important;
  }

  #alm-how-audience .alm-tech-partner-img,
  #alm-how-audience .alm-tech-partner-img .elementor-widget-container,
  #alm-how-audience .alm-tech-partner-img img {
    height: clamp(250px, 45vw, 335px) !important;
    min-height: 250px !important;
  }

  #alm-how-audience .alm-tech-partner-img img {
    object-position: 50% 48% !important;
  }

  #alm-how-safety .alm-tech-mini-grid,
  #alm-how-safety .alm-tech-mini-grid > .e-con-inner,
  #alm-how-safety .alm-tech-mini-grid .e-con-inner,
  #alm-how-flow .alm-tech-loop-grid,
  #alm-how-flow .alm-tech-loop-grid > .e-con-inner,
  #alm-how-flow .alm-tech-loop-grid .e-con-inner {
    gap: 16px !important;
  }

  #alm-how-safety .alm-tech-mini-card > .e-con-inner,
  #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  }

  #alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-card--light > .e-con-inner {
    padding: 32px 30px !important;
  }
}

/* iPad Pro / wide tablet: keep the desktop feel, but make the partner image less clipped. */
@media (min-width: 861px) and (max-width: 1180px) {
  #alm-how-audience > .e-con-inner {
    grid-template-columns: minmax(260px, .78fr) minmax(260px, .72fr) minmax(360px, 1.05fr) !important;
    gap: clamp(28px, 3.2vw, 46px) !important;
    align-items: center !important;
  }

  #alm-how-audience .alm-tech-partner-visual-card {
    max-width: 560px !important;
    justify-self: end !important;
  }

  #alm-how-audience .alm-tech-partner-img,
  #alm-how-audience .alm-tech-partner-img .elementor-widget-container,
  #alm-how-audience .alm-tech-partner-img img {
    min-height: 292px !important;
    height: clamp(292px, 28vw, 360px) !important;
  }

  #alm-how-audience .alm-tech-partner-img img {
    object-position: 50% 48% !important;
  }

  #alm-how-safety,
  #alm-how-flow {
    padding-top: clamp(78px, 7.2vw, 104px) !important;
    padding-bottom: clamp(78px, 7.2vw, 104px) !important;
  }
}

/* Very narrow tablet remains premium-mobile, with slightly calmer final CTA spacing. */
@media (max-width: 640px) {
  #alm-how-final-cta .alm-tech-final-card--dark,
  #alm-how-final-cta .alm-tech-final-card--light {
    max-width: 100% !important;
  }

  #alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-card--light > .e-con-inner {
    padding: 28px 22px !important;
  }
}

/* =========================================================
 * ALMARA How It Works v1.8.0 — Final Image Asset + Mobile Structural Lock
 * Scope: Technology page only. Header v2.3 untouched.
 * Final images: hero, equipment mosaic, partner operations.
 * ========================================================= */

/* Final equipment image mode: one composed ALMARA mosaic asset instead of four repeated dummy tiles. */
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-media > .e-con-inner,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-media > .e-con-inner,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-media > .e-con-inner {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  gap: 0 !important;
  padding: 12px 12px 0 !important;
  width: 100% !important;
  max-width: none !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail-1,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail-2,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail-3,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail-1,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail-2,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail-3,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail-1,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail-2,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail-3 {
  display: none !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--main,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--main,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--main {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  grid-column: auto !important;
  grid-row: auto !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--main .elementor-widget-container,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--main .elementor-widget-container,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--main .elementor-widget-container {
  width: 100% !important;
  height: auto !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--main img,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--main img,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--main img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  object-position: 50% 50% !important;
  border-radius: 14px !important;
}

@media screen and (max-width: 767px) {
  #almara-how-it-works-page,
  .almara-page-how-it-works,
  .almara-how-it-works-v1,
  #almara-how-it-works-page *,
  .almara-page-how-it-works *,
  .almara-how-it-works-v1 * {
    box-sizing: border-box;
  }

  #almara-how-it-works-page,
  .almara-page-how-it-works,
  .almara-how-it-works-v1 {
    --alm-mobile-pad: clamp(18px, 5.6vw, 24px);
    --alm-mobile-section-y: clamp(56px, 15vw, 74px);
    --alm-mobile-radius: 20px;
    --alm-mobile-shadow: 0 18px 44px rgba(4,32,52,.12);
    overflow-x: hidden !important;
  }

  #almara-how-it-works-page .alm-tech-section,
  .almara-page-how-it-works .alm-tech-section,
  .almara-how-it-works-v1 .alm-tech-section {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: var(--alm-mobile-pad) !important;
    padding-right: var(--alm-mobile-pad) !important;
    overflow: hidden !important;
  }

  #almara-how-it-works-page .alm-tech-section > .e-con-inner,
  #almara-how-it-works-page .alm-tech-section.elementor-element > .e-con-inner,
  .almara-page-how-it-works .alm-tech-section > .e-con-inner,
  .almara-page-how-it-works .alm-tech-section.elementor-element > .e-con-inner,
  .almara-how-it-works-v1 .alm-tech-section > .e-con-inner,
  .almara-how-it-works-v1 .alm-tech-section.elementor-element > .e-con-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: var(--alm-mobile-section-y) 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: clamp(24px, 7vw, 34px) !important;
    align-items: start !important;
  }

  #almara-how-it-works-page .alm-tech-section > .e-con-inner > .elementor-element,
  #almara-how-it-works-page .alm-tech-section .e-con-inner > .elementor-element,
  .almara-page-how-it-works .alm-tech-section > .e-con-inner > .elementor-element,
  .almara-page-how-it-works .alm-tech-section .e-con-inner > .elementor-element,
  .almara-how-it-works-v1 .alm-tech-section > .e-con-inner > .elementor-element,
  .almara-how-it-works-v1 .alm-tech-section .e-con-inner > .elementor-element,
  .almara-page-how-it-works .alm-tech-section-copy,
  .almara-page-how-it-works .alm-tech-equipment-copy,
  .almara-page-how-it-works .alm-tech-equipment-visuals,
  .almara-page-how-it-works .alm-tech-hero-copy,
  .almara-page-how-it-works .alm-tech-hero-media,
  .almara-page-how-it-works .alm-tech-gallery-card,
  .almara-page-how-it-works .alm-tech-partner-list-wrap,
  .almara-page-how-it-works .alm-tech-partner-visual-card,
  .almara-page-how-it-works .alm-tech-final-card--dark,
  .almara-page-how-it-works .alm-tech-final-card--light,
  .almara-how-it-works-v1 .alm-tech-section-copy,
  .almara-how-it-works-v1 .alm-tech-equipment-copy,
  .almara-how-it-works-v1 .alm-tech-equipment-visuals,
  .almara-how-it-works-v1 .alm-tech-hero-copy,
  .almara-how-it-works-v1 .alm-tech-hero-media,
  .almara-how-it-works-v1 .alm-tech-gallery-card,
  .almara-how-it-works-v1 .alm-tech-partner-list-wrap,
  .almara-how-it-works-v1 .alm-tech-partner-visual-card,
  .almara-how-it-works-v1 .alm-tech-final-card--dark,
  .almara-how-it-works-v1 .alm-tech-final-card--light,
  #almara-how-it-works-page .alm-tech-section-copy,
  #almara-how-it-works-page .alm-tech-equipment-copy,
  #almara-how-it-works-page .alm-tech-equipment-visuals,
  #almara-how-it-works-page .alm-tech-hero-copy,
  #almara-how-it-works-page .alm-tech-hero-media,
  #almara-how-it-works-page .alm-tech-gallery-card,
  #almara-how-it-works-page .alm-tech-partner-list-wrap,
  #almara-how-it-works-page .alm-tech-partner-visual-card,
  #almara-how-it-works-page .alm-tech-final-card--dark,
  #almara-how-it-works-page .alm-tech-final-card--light {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    justify-self: stretch !important;
  }

  #almara-how-it-works-page .alm-tech-kicker .elementor-widget-container,
  #almara-how-it-works-page .alm-tech-kicker p,
  .almara-page-how-it-works .alm-tech-kicker .elementor-widget-container,
  .almara-page-how-it-works .alm-tech-kicker p,
  .almara-how-it-works-v1 .alm-tech-kicker .elementor-widget-container,
  .almara-how-it-works-v1 .alm-tech-kicker p {
    font-size: 10px !important;
    letter-spacing: .18em !important;
    line-height: 1.2 !important;
  }

  #almara-how-it-works-page .alm-tech-section-title .elementor-heading-title,
  .almara-page-how-it-works .alm-tech-section-title .elementor-heading-title,
  .almara-how-it-works-v1 .alm-tech-section-title .elementor-heading-title {
    font-size: clamp(32px, 10vw, 42px) !important;
    line-height: .94 !important;
    letter-spacing: -.044em !important;
    max-width: 355px !important;
  }

  #almara-how-it-works-page .alm-tech-section-lead .elementor-widget-container,
  #almara-how-it-works-page .alm-tech-section-lead p,
  .almara-page-how-it-works .alm-tech-section-lead .elementor-widget-container,
  .almara-page-how-it-works .alm-tech-section-lead p,
  .almara-how-it-works-v1 .alm-tech-section-lead .elementor-widget-container,
  .almara-how-it-works-v1 .alm-tech-section-lead p {
    font-size: 14px !important;
    line-height: 1.62 !important;
    max-width: 355px !important;
  }

  #alm-how-hero {
    min-height: auto !important;
    padding-left: var(--alm-mobile-pad) !important;
    padding-right: var(--alm-mobile-pad) !important;
  }

  #alm-how-hero > .e-con-inner,
  #alm-how-hero.elementor-element > .e-con-inner {
    padding-top: 34px !important;
    padding-bottom: 48px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 25px !important;
  }

  #alm-how-hero::before {
    background-position: 76% 48% !important;
    background-size: 176% auto !important;
    opacity: .48 !important;
  }

  #alm-how-hero::after {
    display: none !important;
    content: none !important;
  }

  #alm-how-hero .alm-tech-hero-title .elementor-heading-title {
    font-size: clamp(38px, 11.4vw, 47px) !important;
    line-height: .91 !important;
    max-width: 360px !important;
  }

  #alm-how-hero .alm-tech-hero-lead .elementor-widget-container,
  #alm-how-hero .alm-tech-hero-lead p {
    font-size: 13.5px !important;
    line-height: 1.58 !important;
    color: rgba(255,255,255,.94) !important;
    max-width: 360px !important;
  }

  #alm-how-hero .alm-tech-hero-ctas,
  #alm-how-hero .alm-tech-hero-ctas > .e-con-inner,
  #alm-how-hero .alm-tech-hero-ctas .e-con-inner,
  #alm-how-final-cta .alm-tech-final-buttons,
  #alm-how-final-cta .alm-tech-final-buttons > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-buttons .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #alm-how-hero .alm-tech-btn,
  #alm-how-hero .alm-tech-btn .elementor-button,
  #alm-how-final-cta .alm-tech-btn,
  #alm-how-final-cta .alm-tech-btn .elementor-button {
    width: 100% !important;
  }

  #alm-how-hero .alm-tech-btn .elementor-button,
  #alm-how-final-cta .alm-tech-btn .elementor-button {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 18px !important;
    text-align: center !important;
  }

  #alm-how-hero .alm-tech-hero-card,
  #alm-how-equipment .alm-tech-gallery-card,
  #alm-how-audience .alm-tech-partner-visual-card,
  #alm-how-final-cta .alm-tech-final-card--dark,
  #alm-how-final-cta .alm-tech-final-card--light {
    border-radius: 20px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #alm-how-hero .alm-tech-hero-img,
  #alm-how-hero .alm-tech-hero-img .elementor-widget-container,
  #alm-how-hero .alm-tech-hero-img img {
    height: clamp(204px, 58vw, 244px) !important;
  }

  #alm-how-hero .alm-tech-hero-caption > .e-con-inner,
  #alm-how-equipment .alm-tech-gallery-caption > .e-con-inner {
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) !important;
    gap: 12px !important;
    padding: 18px 18px 20px !important;
  }

  #alm-how-expect .alm-tech-feature-grid,
  #alm-how-expect .alm-tech-feature-grid > .e-con-inner,
  #alm-how-expect .alm-tech-feature-grid .e-con-inner,
  #alm-how-faq .alm-tech-feature-grid,
  #alm-how-faq .alm-tech-feature-grid > .e-con-inner,
  #alm-how-faq .alm-tech-feature-grid .e-con-inner,
  #alm-how-ready .alm-tech-feature-grid,
  #alm-how-ready .alm-tech-feature-grid > .e-con-inner,
  #alm-how-ready .alm-tech-feature-grid .e-con-inner,
  #alm-how-booking .alm-tech-process-grid,
  #alm-how-booking .alm-tech-process-grid > .e-con-inner,
  #alm-how-booking .alm-tech-process-grid .e-con-inner,
  #alm-how-safety .alm-tech-mini-grid,
  #alm-how-safety .alm-tech-mini-grid > .e-con-inner,
  #alm-how-safety .alm-tech-mini-grid .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 14px !important;
  }

  #alm-how-expect .alm-tech-feature-card,
  #alm-how-faq .alm-tech-feature-card,
  #alm-how-faq .alm-tech-feature-card--compact,
  #alm-how-ready .alm-tech-feature-card,
  #alm-how-ready .alm-tech-feature-card--compact,
  #alm-how-booking .alm-tech-process-step {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    border-radius: 18px !important;
    box-shadow: var(--alm-mobile-shadow) !important;
  }

  #alm-how-expect .alm-tech-feature-card > .e-con-inner,
  #alm-how-faq .alm-tech-feature-card > .e-con-inner,
  #alm-how-faq .alm-tech-feature-card--compact > .e-con-inner,
  #alm-how-ready .alm-tech-feature-card > .e-con-inner,
  #alm-how-ready .alm-tech-feature-card--compact > .e-con-inner,
  #alm-how-booking .alm-tech-process-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 52px minmax(0,1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 5px 15px !important;
    align-items: start !important;
    text-align: left !important;
    padding: 20px !important;
  }

  #alm-how-expect .alm-tech-ui-icon,
  #alm-how-faq .alm-tech-ui-icon,
  #alm-how-ready .alm-tech-ui-icon,
  #alm-how-booking .alm-tech-ui-icon {
    grid-area: icon !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }

  #alm-how-expect .alm-tech-card-title,
  #alm-how-faq .alm-tech-card-title,
  #alm-how-ready .alm-tech-card-title,
  #alm-how-booking .alm-tech-process-title { grid-area: title !important; }

  #alm-how-expect .alm-tech-card-text,
  #alm-how-faq .alm-tech-card-text,
  #alm-how-ready .alm-tech-card-text,
  #alm-how-booking .alm-tech-process-text { grid-area: text !important; }

  #almara-how-it-works-page .alm-tech-card-title .elementor-heading-title,
  #almara-how-it-works-page .alm-tech-mini-title .elementor-heading-title,
  #almara-how-it-works-page .alm-tech-process-title .elementor-heading-title,
  #almara-how-it-works-page .alm-tech-loop-title .elementor-heading-title,
  .almara-page-how-it-works .alm-tech-card-title .elementor-heading-title,
  .almara-page-how-it-works .alm-tech-mini-title .elementor-heading-title,
  .almara-page-how-it-works .alm-tech-process-title .elementor-heading-title,
  .almara-page-how-it-works .alm-tech-loop-title .elementor-heading-title,
  .almara-how-it-works-v1 .alm-tech-card-title .elementor-heading-title,
  .almara-how-it-works-v1 .alm-tech-mini-title .elementor-heading-title,
  .almara-how-it-works-v1 .alm-tech-process-title .elementor-heading-title,
  .almara-how-it-works-v1 .alm-tech-loop-title .elementor-heading-title {
    font-size: 15px !important;
    line-height: 1.18 !important;
  }

  #almara-how-it-works-page .alm-tech-card-text .elementor-widget-container,
  #almara-how-it-works-page .alm-tech-card-text p,
  #almara-how-it-works-page .alm-tech-mini-text .elementor-widget-container,
  #almara-how-it-works-page .alm-tech-mini-text p,
  #almara-how-it-works-page .alm-tech-process-text .elementor-widget-container,
  #almara-how-it-works-page .alm-tech-process-text p,
  #almara-how-it-works-page .alm-tech-loop-text .elementor-widget-container,
  #almara-how-it-works-page .alm-tech-loop-text p,
  .almara-page-how-it-works .alm-tech-card-text .elementor-widget-container,
  .almara-page-how-it-works .alm-tech-card-text p,
  .almara-page-how-it-works .alm-tech-mini-text .elementor-widget-container,
  .almara-page-how-it-works .alm-tech-mini-text p,
  .almara-page-how-it-works .alm-tech-process-text .elementor-widget-container,
  .almara-page-how-it-works .alm-tech-process-text p,
  .almara-page-how-it-works .alm-tech-loop-text .elementor-widget-container,
  .almara-page-how-it-works .alm-tech-loop-text p,
  .almara-how-it-works-v1 .alm-tech-card-text .elementor-widget-container,
  .almara-how-it-works-v1 .alm-tech-card-text p,
  .almara-how-it-works-v1 .alm-tech-mini-text .elementor-widget-container,
  .almara-how-it-works-v1 .alm-tech-mini-text p,
  .almara-how-it-works-v1 .alm-tech-process-text .elementor-widget-container,
  .almara-how-it-works-v1 .alm-tech-process-text p,
  .almara-how-it-works-v1 .alm-tech-loop-text .elementor-widget-container,
  .almara-how-it-works-v1 .alm-tech-loop-text p {
    font-size: 13px !important;
    line-height: 1.52 !important;
  }

  #alm-how-equipment .alm-tech-gallery-media,
  #alm-how-equipment .alm-tech-gallery-media > .e-con-inner,
  #alm-how-equipment .alm-tech-gallery-media .e-con-inner {
    display: block !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    gap: 0 !important;
    padding: 10px 10px 0 !important;
  }

  #alm-how-equipment .alm-tech-gallery-img--main img {
    aspect-ratio: 4 / 3 !important;
    height: auto !important;
    object-fit: cover !important;
  }

  #alm-how-safety .alm-tech-mini-card {
    width: 100% !important;
    border-left: 0 !important;
  }

  #alm-how-safety .alm-tech-mini-card > .e-con-inner {
    display: grid !important;
    grid-template-columns: 48px minmax(0,1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 5px 14px !important;
    align-items: start !important;
    padding: 14px 0 !important;
    text-align: left !important;
  }

  #alm-how-safety .alm-tech-mini-card .alm-tech-ui-icon {
    grid-area: icon !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
  }

  #alm-how-safety .alm-tech-mini-title { grid-area: title !important; }
  #alm-how-safety .alm-tech-mini-text { grid-area: text !important; }

  #alm-how-flow .alm-tech-loop-grid,
  #alm-how-flow .alm-tech-loop-grid > .e-con-inner,
  #alm-how-flow .alm-tech-loop-grid .e-con-inner {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 11px !important;
  }

  #alm-how-flow .alm-tech-loop-grid > .e-con-inner::before,
  #alm-how-flow .alm-tech-loop-grid .e-con-inner::before {
    content: "" !important;
    position: absolute !important;
    left: 15px !important;
    top: 8px !important;
    bottom: 8px !important;
    width: 1px !important;
    background: linear-gradient(180deg, rgba(110,193,194,0), rgba(110,193,194,.42), rgba(110,193,194,0)) !important;
  }

  #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 38px minmax(0,1fr) !important;
    grid-template-areas: "num title" "num text" !important;
    gap: 3px 14px !important;
    text-align: left !important;
    padding: 8px 0 !important;
  }

  #alm-how-flow .alm-tech-loop-number {
    grid-area: num !important;
    width: 31px !important;
    height: 31px !important;
    margin: 0 !important;
    z-index: 2 !important;
  }

  #alm-how-flow .alm-tech-loop-title { grid-area: title !important; }
  #alm-how-flow .alm-tech-loop-text { grid-area: text !important; }

  #alm-how-audience .alm-tech-checklist,
  #alm-how-audience .alm-tech-checklist > .e-con-inner,
  #alm-how-audience .alm-tech-partner-list-wrap,
  #alm-how-audience .alm-tech-partner-visual-card {
    width: 100% !important;
    max-width: 100% !important;
  }

  #alm-how-audience .alm-tech-partner-list-wrap::before { display: none !important; }

  #alm-how-audience .alm-tech-checklist > .e-con-inner {
    padding: 20px 22px !important;
    border-radius: 18px !important;
  }

  #alm-how-audience .alm-tech-partner-img,
  #alm-how-audience .alm-tech-partner-img .elementor-widget-container,
  #alm-how-audience .alm-tech-partner-img img {
    height: clamp(218px, 63vw, 258px) !important;
    object-position: center !important;
  }

  #alm-how-audience .alm-tech-partner-visual-card .alm-tech-btn {
    left: 18px !important;
    bottom: 18px !important;
  }

  #alm-how-final-cta .alm-tech-final-card--dark > .e-con-inner,
  #alm-how-final-cta .alm-tech-final-card--light > .e-con-inner {
    padding: 26px 22px !important;
  }

  #alm-how-final-cta .alm-tech-final-title .elementor-heading-title {
    font-size: clamp(29px, 8.7vw, 38px) !important;
    line-height: .98 !important;
  }

  #alm-how-final-cta .alm-tech-final-text .elementor-widget-container,
  #alm-how-final-cta .alm-tech-final-text p {
    color: rgba(255,255,255,.92) !important;
    font-size: 13.5px !important;
    line-height: 1.58 !important;
  }
}

@media screen and (max-width: 374px) {
  #almara-how-it-works-page,
  .almara-page-how-it-works,
  .almara-how-it-works-v1 { --alm-mobile-pad: 16px; }

  #alm-how-hero .alm-tech-hero-title .elementor-heading-title {
    font-size: clamp(35px, 10.8vw, 42px) !important;
  }

  #almara-how-it-works-page .alm-tech-section-title .elementor-heading-title,
  .almara-page-how-it-works .alm-tech-section-title .elementor-heading-title,
  .almara-how-it-works-v1 .alm-tech-section-title .elementor-heading-title {
    font-size: clamp(31px, 9.8vw, 39px) !important;
  }
}

.almara-page-how-it-works .almara-tech-equipment-mosaic img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 18px;
}

/* =========================================================
 * ALMARA How It Works v2.2.1 FINAL POLISH
 * Scope: Technology page only. Header v2.3 untouched.
 * - Sector 03 single equipment mosaic reinforcement
 * - Mobile hero card minimal compression
 * - Desktop partner image subtle brightness/contrast lift
 * ========================================================= */

/* Sector 03: single composed equipment visual, no empty gallery slots. */
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-media,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-media > .e-con-inner,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-media,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-media > .e-con-inner,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-media,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-media > .e-con-inner {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  gap: 0 !important;
  padding: 12px 12px 0 !important;
  width: 100% !important;
  max-width: none !important;
}

#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail-1,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail-2,
#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--detail-3,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail-1,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail-2,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--detail-3,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail-1,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail-2,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--detail-3 {
  display: none !important;
}

#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--main,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--main,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--main,
#almara-how-it-works-page #alm-how-equipment .almara-tech-equipment-mosaic,
.almara-page-how-it-works #alm-how-equipment .almara-tech-equipment-mosaic,
.almara-how-it-works-v1 #alm-how-equipment .almara-tech-equipment-mosaic {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  grid-column: auto !important;
  grid-row: auto !important;
}

#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--main .elementor-widget-container,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--main .elementor-widget-container,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--main .elementor-widget-container,
#almara-how-it-works-page #alm-how-equipment .almara-tech-equipment-mosaic .elementor-widget-container,
.almara-page-how-it-works #alm-how-equipment .almara-tech-equipment-mosaic .elementor-widget-container,
.almara-how-it-works-v1 #alm-how-equipment .almara-tech-equipment-mosaic .elementor-widget-container {
  width: 100% !important;
  height: auto !important;
}

#almara-how-it-works-page #alm-how-equipment .alm-tech-gallery-img--main img,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--main img,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-gallery-img--main img,
#almara-how-it-works-page #alm-how-equipment .almara-tech-equipment-mosaic img,
.almara-page-how-it-works #alm-how-equipment .almara-tech-equipment-mosaic img,
.almara-how-it-works-v1 #alm-how-equipment .almara-tech-equipment-mosaic img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  object-position: 50% 50% !important;
  border-radius: 14px !important;
}

/* Desktop polish: partner visual slightly brighter and more legible without changing the asset. */
@media (min-width: 1025px) {
  #almara-how-it-works-page #alm-how-audience .alm-tech-partner-img img,
  .almara-page-how-it-works #alm-how-audience .alm-tech-partner-img img,
  .almara-how-it-works-v1 #alm-how-audience .alm-tech-partner-img img {
    filter: brightness(1.055) contrast(1.045) saturate(1.025) !important;
  }
}

/* Mobile polish: hero card/caption slightly more compact, no structural changes. */
@media (max-width: 767px) {
  #almara-how-it-works-page #alm-how-hero .alm-tech-hero-card,
  .almara-page-how-it-works #alm-how-hero .alm-tech-hero-card,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-hero-card {
    border-radius: 18px !important;
  }

  #almara-how-it-works-page #alm-how-hero .alm-tech-hero-img,
  #almara-how-it-works-page #alm-how-hero .alm-tech-hero-img .elementor-widget-container,
  #almara-how-it-works-page #alm-how-hero .alm-tech-hero-img img,
  .almara-page-how-it-works #alm-how-hero .alm-tech-hero-img,
  .almara-page-how-it-works #alm-how-hero .alm-tech-hero-img .elementor-widget-container,
  .almara-page-how-it-works #alm-how-hero .alm-tech-hero-img img,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-hero-img,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-hero-img .elementor-widget-container,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-hero-img img {
    height: clamp(194px, 53vw, 226px) !important;
  }

  #almara-how-it-works-page #alm-how-hero .alm-tech-hero-caption > .e-con-inner,
  .almara-page-how-it-works #alm-how-hero .alm-tech-hero-caption > .e-con-inner,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-hero-caption > .e-con-inner {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 14px 16px 16px !important;
  }

  #almara-how-it-works-page #alm-how-hero .alm-tech-brand-mark--caption,
  .almara-page-how-it-works #alm-how-hero .alm-tech-brand-mark--caption,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-brand-mark--caption {
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
  }

  #almara-how-it-works-page #alm-how-hero .alm-tech-caption-title .elementor-heading-title,
  .almara-page-how-it-works #alm-how-hero .alm-tech-caption-title .elementor-heading-title,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-caption-title .elementor-heading-title {
    font-size: 14px !important;
    line-height: 1.16 !important;
  }

  #almara-how-it-works-page #alm-how-hero .alm-tech-caption-text .elementor-widget-container,
  #almara-how-it-works-page #alm-how-hero .alm-tech-caption-text p,
  .almara-page-how-it-works #alm-how-hero .alm-tech-caption-text .elementor-widget-container,
  .almara-page-how-it-works #alm-how-hero .alm-tech-caption-text p,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-caption-text .elementor-widget-container,
  .almara-how-it-works-v1 #alm-how-hero .alm-tech-caption-text p {
    font-size: 12.5px !important;
    line-height: 1.42 !important;
  }
}



/* =========================================================
 * ALMARA How It Works v1.0.0 — B2C final refinements
 * Scope only: .almara-page-how-it-works
 * Header v2.3 freeze: no header, nav, burger or language-switcher rules included.
 * ========================================================= */
.almara-page-how-it-works #alm-how-hero .alm-tech-hero-img img {
  object-position: 50% 50% !important;
}
.almara-page-how-it-works #alm-how-equipment .almara-tech-equipment-mosaic img,
.almara-page-how-it-works #alm-how-equipment .alm-tech-gallery-img--main img {
  object-position: 50% 50% !important;
}
.almara-page-how-it-works #alm-how-audience .alm-tech-partner-img img {
  object-position: 50% 50% !important;
}
.almara-page-how-it-works #alm-how-faq .alm-tech-card-text .elementor-widget-container,
.almara-page-how-it-works #alm-how-ready .alm-tech-card-text .elementor-widget-container {
  max-width: 24em;
}
.almara-page-how-it-works #alm-how-audience .alm-tech-check-item .elementor-widget-container,
.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet .elementor-widget-container {
  font-weight: 760 !important;
}
@media (max-width: 767px) {
  .almara-page-how-it-works #alm-how-hero .alm-tech-hero-title .elementor-heading-title {
    font-size: clamp(38px, 11.2vw, 48px) !important;
  }
  .almara-page-how-it-works #alm-how-equipment .almara-tech-equipment-mosaic img {
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
  }
  .almara-page-how-it-works #alm-how-audience .alm-tech-partner-visual-card .alm-tech-btn {
    left: 16px !important;
    bottom: 16px !important;
  }
}

/* =========================================================
 * ALMARA How It Works v2.3.0 — FINAL POLISH / STRUCTURAL LOCK
 * Scope: only How-It-Works page content.
 * Header v2.3 freeze: no header, nav, burger or language-switcher rules.
 * Fixes:
 * - Hero restored to ALMARA dark wave signature
 * - Stronger dark-section typography contrast
 * - Desktop/tablet card rhythm normalized
 * - Mobile cards full-width; no skinny columns
 * - Mobile pills/process rows converted to readable cards/timeline
 * ========================================================= */

/* ---------- Page tokens ---------- */
:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) {
  --alm-how-navy: #042034;
  --alm-how-deep: #021827;
  --alm-how-aqua: #6EC1C2;
  --alm-how-aqua-strong: #42919D;
  --alm-how-sand: #F4EDE4;
  --alm-how-cream: #FBF7F0;
  --alm-how-coral: #EDA88E;
  --alm-how-ink: #042034;
  --alm-how-muted: rgba(4, 32, 52, .78);
  --alm-how-shadow: 0 24px 66px rgba(4, 32, 52, .12);
  --alm-how-shadow-soft: 0 16px 42px rgba(4, 32, 52, .09);
  --alm-how-radius: 22px;
  background: var(--alm-how-cream) !important;
  overflow-x: clip !important;
}

/* ---------- Hero: restore ALMARA dark wave signature ---------- */
:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: clamp(620px, 72vh, 760px) !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 23% 38%, rgba(110,193,194,.12), rgba(110,193,194,0) 34%),
    radial-gradient(circle at 78% 30%, rgba(110,193,194,.18), rgba(110,193,194,0) 32%),
    linear-gradient(115deg, #052838 0%, #07384a 52%, #0a4c5f 100%) !important;
  border: 0 !important;
  box-shadow: none !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background: url('/wp-content/mu-plugins/almara-platform/assets/almara_hero-welle.webp') 78% 54% / 112% auto no-repeat !important;
  opacity: .60 !important;
  mix-blend-mode: screen !important;
  filter: saturate(1.04) contrast(1.02) !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background:
    linear-gradient(90deg, rgba(2,24,39,.70) 0%, rgba(2,24,39,.42) 42%, rgba(2,24,39,.08) 100%),
    radial-gradient(circle at 78% 45%, rgba(110,193,194,.12), transparent 34%) !important;
  opacity: 1 !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero > .e-con-inner {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero :is(.alm-tech-hero-copy, .alm-tech-hero-copy > .e-con-inner, .alm-tech-hero-media, .alm-tech-hero-media > .e-con-inner, .alm-tech-hero-card > .e-con-inner, .elementor-widget-container) {
  background: transparent !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero .alm-tech-hero-title .elementor-heading-title {
  color: #fff !important;
  text-shadow: 0 14px 34px rgba(0,0,0,.26) !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero :is(.alm-tech-hero-lead, .alm-tech-hero-lead .elementor-widget-container, .alm-tech-hero-lead p) {
  color: rgba(255,255,255,.93) !important;
  text-shadow: 0 4px 18px rgba(0,0,0,.22) !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero :is(.alm-tech-kicker, .alm-tech-kicker .elementor-widget-container, .alm-tech-kicker p) {
  color: var(--alm-how-aqua) !important;
  opacity: 1 !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero .alm-tech-hero-card {
  background: #fff !important;
  border: 2px solid rgba(255,255,255,.72) !important;
  box-shadow: 0 34px 90px rgba(0,0,0,.34) !important;
}

/* ---------- Dark section contrast ---------- */
:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-safety, #alm-how-flow, .alm-tech-section--dark) {
  background: linear-gradient(115deg, #052838 0%, #07384a 52%, #0a4c5f 100%) !important;
  color: #fff !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-safety, #alm-how-flow, .alm-tech-section--dark) .alm-tech-section-title .elementor-heading-title {
  color: rgba(255,255,255,.985) !important;
  text-shadow: 0 8px 24px rgba(0,0,0,.22) !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-safety, #alm-how-flow, .alm-tech-section--dark) :is(.alm-tech-mini-title .elementor-heading-title, .alm-tech-loop-title .elementor-heading-title) {
  color: rgba(255,255,255,.98) !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-safety, #alm-how-flow, .alm-tech-section--dark) :is(.alm-tech-mini-text .elementor-widget-container, .alm-tech-mini-text p, .alm-tech-loop-text .elementor-widget-container, .alm-tech-loop-text p, .alm-tech-section-lead .elementor-widget-container, .alm-tech-section-lead p) {
  color: rgba(255,255,255,.86) !important;
  opacity: 1 !important;
}

:is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-safety, #alm-how-flow, .alm-tech-section--dark) :is(.alm-tech-kicker, .alm-tech-kicker .elementor-widget-container, .alm-tech-kicker p) {
  color: var(--alm-how-aqua) !important;
  opacity: 1 !important;
}

/* ---------- Desktop/tablet card rhythm ---------- */
@media (min-width: 1025px) {
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid > .e-con-inner {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(150px, 1fr)) !important;
    gap: 22px !important;
    width: 100% !important;
    max-width: none !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-card,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-step {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid > .e-con-inner {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: none !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-card,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-step {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

/* ---------- Mobile structural lock ---------- */
@media (max-width: 767px) {
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) {
    --alm-how-mobile-pad: clamp(18px, 5.6vw, 24px);
    --alm-how-mobile-section-y: clamp(58px, 15vw, 76px);
    overflow-x: clip !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: var(--alm-how-mobile-pad) !important;
    padding-right: var(--alm-how-mobile-pad) !important;
    overflow: hidden !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section.elementor-element > .e-con-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: var(--alm-how-mobile-section-y) 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: clamp(24px, 7vw, 34px) !important;
    align-items: start !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero {
    min-height: auto !important;
    padding-left: var(--alm-how-mobile-pad) !important;
    padding-right: var(--alm-how-mobile-pad) !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero::before {
    background-size: 182% auto !important;
    background-position: 78% 46% !important;
    opacity: .44 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero::after {
    background: linear-gradient(180deg, rgba(2,24,39,.62) 0%, rgba(2,24,39,.35) 48%, rgba(2,24,39,.12) 100%) !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero > .e-con-inner {
    padding-top: 42px !important;
    padding-bottom: 52px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero .alm-tech-hero-title .elementor-heading-title {
    color: #fff !important;
    font-size: clamp(38px, 11.4vw, 48px) !important;
    line-height: .94 !important;
    max-width: 360px !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero :is(.alm-tech-hero-lead .elementor-widget-container, .alm-tech-hero-lead p) {
    color: rgba(255,255,255,.93) !important;
    font-size: 13.8px !important;
    line-height: 1.58 !important;
    max-width: 360px !important;
  }

  /* Mobile grids: full width cards, no skinny columns. */
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-grid > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-grid .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-grid > .e-con-inner > .elementor-element,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-card,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-grid > .e-con-inner > .elementor-element,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-step,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-grid > .e-con-inner > .elementor-element,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 100% !important;
    justify-self: stretch !important;
    min-height: 0 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-card,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-step {
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(4,32,52,.12) !important;
    background: rgba(255,255,255,.84) !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-feature-card > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 52px minmax(0,1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 5px 15px !important;
    align-items: start !important;
    text-align: left !important;
    padding: 20px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready, #alm-how-booking) .alm-tech-ui-icon {
    grid-area: icon !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-card-title,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-title { grid-area: title !important; }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-expect, #alm-how-faq, #alm-how-ready) .alm-tech-card-text,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-booking .alm-tech-process-text { grid-area: text !important; }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-card-title .elementor-heading-title, .alm-tech-mini-title .elementor-heading-title, .alm-tech-process-title .elementor-heading-title, .alm-tech-loop-title .elementor-heading-title) {
    font-size: 15px !important;
    line-height: 1.18 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-card-text .elementor-widget-container, .alm-tech-card-text p, .alm-tech-mini-text .elementor-widget-container, .alm-tech-mini-text p, .alm-tech-process-text .elementor-widget-container, .alm-tech-process-text p, .alm-tech-loop-text .elementor-widget-container, .alm-tech-loop-text p) {
    font-size: 13px !important;
    line-height: 1.52 !important;
  }

  /* Safety dark cards on mobile: visible and calm. */
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-card {
    border-left: 0 !important;
    border-top: 1px solid rgba(255,255,255,.12) !important;
    background: rgba(255,255,255,.065) !important;
    border-radius: 16px !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-card > .e-con-inner {
    display: grid !important;
    grid-template-columns: 48px minmax(0,1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 5px 14px !important;
    align-items: start !important;
    padding: 18px !important;
    text-align: left !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-card .alm-tech-ui-icon {
    grid-area: icon !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-title { grid-area: title !important; }
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-safety .alm-tech-mini-text { grid-area: text !important; }

  /* Six-step dark band: convert skinny pills into readable timeline. */
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-grid,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-grid > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-grid .e-con-inner {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 11px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-grid > .e-con-inner::before,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-grid .e-con-inner::before {
    content: "" !important;
    position: absolute !important;
    left: 15px !important;
    top: 8px !important;
    bottom: 8px !important;
    width: 1px !important;
    background: linear-gradient(180deg, rgba(110,193,194,0), rgba(110,193,194,.42), rgba(110,193,194,0)) !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-step {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    background: rgba(255,255,255,.055) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 16px !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    display: grid !important;
    grid-template-columns: 38px minmax(0,1fr) !important;
    grid-template-areas: "num title" "num text" !important;
    gap: 3px 14px !important;
    text-align: left !important;
    padding: 14px 16px !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-number {
    grid-area: num !important;
    width: 31px !important;
    height: 31px !important;
    margin: 0 !important;
    z-index: 2 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-title { grid-area: title !important; }
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-text { grid-area: text !important; }

  /* Hero/final buttons stack safely. */
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero, #alm-how-final-cta) .alm-tech-cta-row,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero, #alm-how-final-cta) .alm-tech-cta-row > .e-con-inner,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero, #alm-how-final-cta) .alm-tech-cta-row .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero, #alm-how-final-cta) .alm-tech-btn,
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero, #alm-how-final-cta) .alm-tech-btn .elementor-button {
    width: 100% !important;
    min-width: 0 !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero, #alm-how-final-cta) .alm-tech-btn .elementor-button {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 18px !important;
    text-align: center !important;
  }

  /* Visual cards stay full width without overflows. */
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-hero-card, .alm-tech-gallery-card, .alm-tech-partner-visual-card, .alm-tech-final-card--dark, .alm-tech-final-card--light) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    border-radius: 20px !important;
  }

  /* Final CTA readable mobile split. */
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-final-cta > .e-con-inner {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 18px !important;
  }

  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-final-cta :is(.alm-tech-final-card--dark > .e-con-inner, .alm-tech-final-card--light > .e-con-inner) {
    padding: 26px 22px !important;
  }
}

@media (max-width: 374px) {
  :is(#almara-how-it-works-page, .almara-page-how-it-works, .almara-how-it-works-v1) {
    --alm-how-mobile-pad: 16px;
  }
}


/* =========================================================
 * ALMARA How It Works v2.8.0 — Standalone Loader-Separated Mobile Lock
 * Added to full B2C CSS.
 * Purpose: keep B2C How-it-works independent from almara-technology.css.
 * Header v2.3 untouched: no header/nav/burger/language selectors.
 * ========================================================= */
/* =========================================================
 * ALMARA How it Works v2.7.0 — Phone/Tablet Squeeze Lock
 * Scope: B2C How-it-works only. Header-safe.
 * Purpose:
 * - fixes Elementor root padding / flex-grid squeeze where phone preview
 *   still renders two-column/skinny cards despite earlier mobile locks
 * - deliberately uses flex-column at <=1024px to defeat Elementor Grid
 *   and inline/container layout inheritance
 * - no header, nav, burger or language-switcher selectors
 * ========================================================= */

@media screen and (max-width: 1024px) {
  html body .elementor :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1),
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) {
    box-sizing: border-box !important;
    display: block !important;
    flex-direction: initial !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow-x: clip !important;
    --alm-how-lock-pad: clamp(18px, 5.6vw, 28px);
    --alm-how-lock-max: min(440px, calc(100vw - (2 * var(--alm-how-lock-pad))));
  }

  html body .elementor :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) > .elementor-element,
  html body .elementor :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) > .alm-tech-section,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) > .elementor-element,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) > .alm-tech-section {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--alm-how-lock-pad) !important;
    padding-right: var(--alm-how-lock-pad) !important;
    overflow: hidden !important;
  }

  html body .elementor :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section > .e-con-inner,
  html body .elementor :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section.elementor-element > .e-con-inner,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section > .e-con-inner,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section.elementor-element > .e-con-inner {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: clamp(24px, 6vw, 34px) !important;
    width: 100% !important;
    max-width: var(--alm-how-lock-max) !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: clamp(54px, 14vw, 76px) !important;
    padding-bottom: clamp(54px, 14vw, 76px) !important;
    grid-template-columns: none !important;
    grid-auto-flow: row !important;
  }

  html body .elementor :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section > .e-con-inner > .elementor-element,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) .alm-tech-section > .e-con-inner > .elementor-element,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-hero-copy,.alm-tech-hero-media,.alm-tech-section-copy,.alm-tech-equipment-copy,.alm-tech-equipment-visuals,.alm-tech-gallery-card,.alm-tech-partner-list-wrap,.alm-tech-partner-visual-card,.alm-tech-final-card--dark,.alm-tech-final-card--light) {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    flex-basis: auto !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }

  /* Card/step container: use flex-column to beat Elementor grid/flex leftovers. */
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-feature-grid,.alm-tech-mini-grid,.alm-tech-process-grid,.alm-tech-loop-grid,.alm-tech-checklist),
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-feature-grid,.alm-tech-mini-grid,.alm-tech-process-grid,.alm-tech-loop-grid,.alm-tech-checklist) > .e-con-inner,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-feature-grid,.alm-tech-mini-grid,.alm-tech-process-grid,.alm-tech-loop-grid,.alm-tech-checklist).elementor-element > .e-con-inner {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    grid-template-columns: none !important;
    grid-auto-flow: row !important;
    overflow: visible !important;
  }

  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-feature-grid,.alm-tech-mini-grid,.alm-tech-process-grid,.alm-tech-loop-grid,.alm-tech-checklist) > .elementor-element,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-feature-grid,.alm-tech-mini-grid,.alm-tech-process-grid,.alm-tech-loop-grid,.alm-tech-checklist) > .e-con-inner > .elementor-element,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-feature-card,.alm-tech-mini-card,.alm-tech-process-step,.alm-tech-loop-step) {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    flex-basis: auto !important;
    margin: 0 !important;
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    transform: none !important;
  }

  /* Keep cards readable, not vertical pills. */
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-feature-card,.alm-tech-mini-card,.alm-tech-process-step) > .e-con-inner {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 5px 14px !important;
    align-items: start !important;
    text-align: left !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 18px !important;
  }

  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-step > .e-con-inner {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    grid-template-areas: "num title" "num text" !important;
    gap: 3px 14px !important;
    align-items: start !important;
    text-align: left !important;
    width: 100% !important;
    padding: 14px 16px !important;
  }

  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-ui-icon,.alm-tech-process-icon) {
    grid-area: icon !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    margin: 0 !important;
  }
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-flow .alm-tech-loop-number { grid-area: num !important; }
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-card-title,.alm-tech-mini-title,.alm-tech-process-title,.alm-tech-loop-title) { grid-area: title !important; }
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-card-text,.alm-tech-mini-text,.alm-tech-process-text,.alm-tech-loop-text) { grid-area: text !important; }

  /* Hero/media cards and buttons: never split. */
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) #alm-how-hero .alm-tech-hero-card,
  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(.alm-tech-gallery-card,.alm-tech-partner-visual-card,.alm-tech-final-card--dark,.alm-tech-final-card--light) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero,#alm-how-final-cta) :is(.alm-tech-cta-row,.alm-tech-cta-row > .e-con-inner,.alm-tech-cta-row .e-con-inner) {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body :is(#almara-how-it-works-page.almara-page-how-it-works, .almara-page-how-it-works, .almara-how-it-works-v1) :is(#alm-how-hero,#alm-how-final-cta) :is(.alm-tech-btn,.alm-tech-btn .elementor-button) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}


/* =========================================================
   ALMARA How It Works v3.0.0 — Direct-Child Mobile Lock
   Scope: ONLY B2C How-it-works.
   Reason: Elementor e-con-full child containers often have no .e-con-inner;
   previous mobile rules targeted > .e-con-inner and therefore did not fully
   affect card/step internals on phones.
   Header v2.3 untouched: no header/nav/burger/language selectors.
   ========================================================= */

@media screen and (max-width: 767px) {
  html body #almara-how-it-works-page,
  html body .almara-page-how-it-works,
  html body .almara-how-it-works-v1 {
    --alm-how-mobile-pad: 18px !important;
    --alm-how-mobile-max: 100% !important;
  }

  html body #almara-how-it-works-page .alm-tech-section > .e-con-inner,
  html body .almara-page-how-it-works .alm-tech-section > .e-con-inner,
  html body .almara-how-it-works-v1 .alm-tech-section > .e-con-inner {
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Hero / gallery captions: direct-child layout, not only .e-con-inner. */
  html body #almara-how-it-works-page :is(.alm-tech-hero-caption,.alm-tech-gallery-caption),
  html body .almara-page-how-it-works :is(.alm-tech-hero-caption,.alm-tech-gallery-caption),
  html body .almara-how-it-works-v1 :is(.alm-tech-hero-caption,.alm-tech-gallery-caption) {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: 14px !important;
    align-items: start !important;
    width: 100% !important;
    padding: 18px !important;
  }

  html body #almara-how-it-works-page :is(.alm-tech-hero-caption,.alm-tech-gallery-caption) > .alm-tech-brand-mark,
  html body .almara-page-how-it-works :is(.alm-tech-hero-caption,.alm-tech-gallery-caption) > .alm-tech-brand-mark,
  html body .almara-how-it-works-v1 :is(.alm-tech-hero-caption,.alm-tech-gallery-caption) > .alm-tech-brand-mark {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
  }

  html body #almara-how-it-works-page :is(.alm-tech-hero-caption-copy,.alm-tech-gallery-caption-copy),
  html body .almara-page-how-it-works :is(.alm-tech-hero-caption-copy,.alm-tech-gallery-caption-copy),
  html body .almara-how-it-works-v1 :is(.alm-tech-hero-caption-copy,.alm-tech-gallery-caption-copy) {
    grid-column: 2 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  /* Feature / FAQ / ready cards: direct child cards get the mobile card layout. */
  html body #almara-how-it-works-page :is(.alm-tech-feature-card,.alm-tech-feature-card--compact),
  html body .almara-page-how-it-works :is(.alm-tech-feature-card,.alm-tech-feature-card--compact),
  html body .almara-how-it-works-v1 :is(.alm-tech-feature-card,.alm-tech-feature-card--compact) {
    display: grid !important;
    grid-template-columns: 50px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 6px 14px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.90) !important;
    border: 1px solid rgba(4,32,52,.10) !important;
    box-shadow: 0 14px 34px rgba(4,32,52,.10) !important;
    text-align: left !important;
  }

  html body #almara-how-it-works-page .alm-tech-feature-card > .alm-tech-ui-icon,
  html body #almara-how-it-works-page .alm-tech-feature-card > .elementor-widget-icon,
  html body .almara-page-how-it-works .alm-tech-feature-card > .alm-tech-ui-icon,
  html body .almara-page-how-it-works .alm-tech-feature-card > .elementor-widget-icon,
  html body .almara-how-it-works-v1 .alm-tech-feature-card > .alm-tech-ui-icon,
  html body .almara-how-it-works-v1 .alm-tech-feature-card > .elementor-widget-icon {
    grid-area: icon !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    margin: 0 !important;
    align-self: start !important;
  }

  html body #almara-how-it-works-page .alm-tech-feature-card > .alm-tech-card-title,
  html body .almara-page-how-it-works .alm-tech-feature-card > .alm-tech-card-title,
  html body .almara-how-it-works-v1 .alm-tech-feature-card > .alm-tech-card-title {
    grid-area: title !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  html body #almara-how-it-works-page .alm-tech-feature-card > .alm-tech-card-text,
  html body .almara-page-how-it-works .alm-tech-feature-card > .alm-tech-card-text,
  html body .almara-how-it-works-v1 .alm-tech-feature-card > .alm-tech-card-text {
    grid-area: text !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  /* Safety cards on dark background: same direct-child pattern, but dark glass. */
  html body #almara-how-it-works-page .alm-tech-mini-card,
  html body .almara-page-how-it-works .alm-tech-mini-card,
  html body .almara-how-it-works-v1 .alm-tech-mini-card {
    display: grid !important;
    grid-template-columns: 50px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 6px 14px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 18px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.065) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
    text-align: left !important;
  }

  html body #almara-how-it-works-page .alm-tech-mini-card > .alm-tech-ui-icon,
  html body #almara-how-it-works-page .alm-tech-mini-card > .elementor-widget-icon,
  html body .almara-page-how-it-works .alm-tech-mini-card > .alm-tech-ui-icon,
  html body .almara-page-how-it-works .alm-tech-mini-card > .elementor-widget-icon,
  html body .almara-how-it-works-v1 .alm-tech-mini-card > .alm-tech-ui-icon,
  html body .almara-how-it-works-v1 .alm-tech-mini-card > .elementor-widget-icon {
    grid-area: icon !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    margin: 0 !important;
  }
  html body #almara-how-it-works-page .alm-tech-mini-card > .alm-tech-mini-title,
  html body .almara-page-how-it-works .alm-tech-mini-card > .alm-tech-mini-title,
  html body .almara-how-it-works-v1 .alm-tech-mini-card > .alm-tech-mini-title { grid-area: title !important; min-width:0!important; width:100%!important; }
  html body #almara-how-it-works-page .alm-tech-mini-card > .alm-tech-mini-text,
  html body .almara-page-how-it-works .alm-tech-mini-card > .alm-tech-mini-text,
  html body .almara-how-it-works-v1 .alm-tech-mini-card > .alm-tech-mini-text { grid-area: text !important; min-width:0!important; width:100%!important; }

  /* Booking process cards: direct-child step containers. */
  html body #almara-how-it-works-page .alm-tech-process-step,
  html body .almara-page-how-it-works .alm-tech-process-step,
  html body .almara-how-it-works-v1 .alm-tech-process-step {
    display: grid !important;
    grid-template-columns: 50px minmax(0, 1fr) !important;
    grid-template-areas: "icon title" "icon text" !important;
    gap: 6px 14px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 18px !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.90) !important;
    border: 1px solid rgba(4,32,52,.10) !important;
    box-shadow: 0 14px 34px rgba(4,32,52,.08) !important;
    text-align: left !important;
  }
  html body #almara-how-it-works-page .alm-tech-process-step::after,
  html body .almara-page-how-it-works .alm-tech-process-step::after,
  html body .almara-how-it-works-v1 .alm-tech-process-step::after { display: none !important; content: none !important; }
  html body #almara-how-it-works-page .alm-tech-process-step > .alm-tech-process-icon,
  html body #almara-how-it-works-page .alm-tech-process-step > .elementor-widget-icon,
  html body .almara-page-how-it-works .alm-tech-process-step > .alm-tech-process-icon,
  html body .almara-page-how-it-works .alm-tech-process-step > .elementor-widget-icon,
  html body .almara-how-it-works-v1 .alm-tech-process-step > .alm-tech-process-icon,
  html body .almara-how-it-works-v1 .alm-tech-process-step > .elementor-widget-icon {
    grid-area: icon !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    margin: 0 !important;
  }
  html body #almara-how-it-works-page .alm-tech-process-step > .alm-tech-process-title,
  html body .almara-page-how-it-works .alm-tech-process-step > .alm-tech-process-title,
  html body .almara-how-it-works-v1 .alm-tech-process-step > .alm-tech-process-title { grid-area:title!important; min-width:0!important; width:100%!important; }
  html body #almara-how-it-works-page .alm-tech-process-step > .alm-tech-process-text,
  html body .almara-page-how-it-works .alm-tech-process-step > .alm-tech-process-text,
  html body .almara-how-it-works-v1 .alm-tech-process-step > .alm-tech-process-text { grid-area:text!important; min-width:0!important; width:100%!important; }

  /* Six-step flow: direct-child mobile cards. */
  html body #almara-how-it-works-page .alm-tech-loop-step,
  html body .almara-page-how-it-works .alm-tech-loop-step,
  html body .almara-how-it-works-v1 .alm-tech-loop-step {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    grid-template-areas: "num title" "num text" !important;
    gap: 4px 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 14px 16px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    background: rgba(255,255,255,.055) !important;
    text-align: left !important;
  }
  html body #almara-how-it-works-page .alm-tech-loop-step > .alm-tech-loop-number,
  html body .almara-page-how-it-works .alm-tech-loop-step > .alm-tech-loop-number,
  html body .almara-how-it-works-v1 .alm-tech-loop-step > .alm-tech-loop-number { grid-area:num!important; width:36px!important; min-width:36px!important; margin:0!important; }
  html body #almara-how-it-works-page .alm-tech-loop-step > .alm-tech-loop-title,
  html body .almara-page-how-it-works .alm-tech-loop-step > .alm-tech-loop-title,
  html body .almara-how-it-works-v1 .alm-tech-loop-step > .alm-tech-loop-title { grid-area:title!important; min-width:0!important; width:100%!important; }
  html body #almara-how-it-works-page .alm-tech-loop-step > .alm-tech-loop-text,
  html body .almara-page-how-it-works .alm-tech-loop-step > .alm-tech-loop-text,
  html body .almara-how-it-works-v1 .alm-tech-loop-step > .alm-tech-loop-text { grid-area:text!important; min-width:0!important; width:100%!important; }

  /* Final CTA cards: avoid very narrow internal columns. */
  html body #almara-how-it-works-page .alm-tech-final-card--dark,
  html body #almara-how-it-works-page .alm-tech-final-card--light,
  html body .almara-page-how-it-works .alm-tech-final-card--dark,
  html body .almara-page-how-it-works .alm-tech-final-card--light,
  html body .almara-how-it-works-v1 .alm-tech-final-card--dark,
  html body .almara-how-it-works-v1 .alm-tech-final-card--light {
    display: block !important;
    padding: 24px !important;
  }

  html body #almara-how-it-works-page .alm-tech-final-card--dark > .alm-tech-final-icon,
  html body .almara-page-how-it-works .alm-tech-final-card--dark > .alm-tech-final-icon,
  html body .almara-how-it-works-v1 .alm-tech-final-card--dark > .alm-tech-final-icon {
    margin-bottom: 16px !important;
  }

  html body #almara-how-it-works-page .alm-tech-final-copy,
  html body .almara-page-how-it-works .alm-tech-final-copy,
  html body .almara-how-it-works-v1 .alm-tech-final-copy {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}



/* =========================================================
   ALMARA How It Works v5.0 Mobile Renderer Failsafe
   Purpose: Real-phone mobile uses one self-contained editorial renderer.
   Desktop/tablet remain Elementor-native.
   ========================================================= */
.alm-how-mobile-renderer{display:none!important;}
@media (max-width:767px){
  html,body{overflow-x:hidden!important;}
  html body #almara-how-it-works-page{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    background:#FBF7F0!important;
    overflow:hidden!important;
  }
  html body #almara-how-it-works-page > .alm-tech-section,
  html body #almara-how-it-works-page > .alm-how-mobile-shell{
    display:none!important;
    visibility:hidden!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
  }
  html body #almara-how-it-works-page > .alm-how-mobile-renderer,
  html body #almara-how-it-works-page .alm-how-mobile-renderer{
    display:block!important;
    visibility:visible!important;
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    padding:0!important;
    overflow:hidden!important;
    background:#FBF7F0!important;
  }
  .alm-how-mobile-page,.alm-how-mobile-page *{box-sizing:border-box!important;}
  .alm-how-mobile-page{width:100vw!important;max-width:100vw!important;margin:0!important;padding:0!important;font-family:Inter,Arial,sans-serif!important;color:#042034!important;background:#FBF7F0!important;}
  .alm-how-m-sec{width:100%!important;margin:0!important;padding:58px 18px!important;background:#FBF7F0!important;overflow:hidden!important;}
  .alm-how-m-sec + .alm-how-m-sec{border-top:1px solid rgba(4,32,52,.045)!important;}
  .alm-how-m-inner{width:100%!important;max-width:390px!important;margin:0 auto!important;display:block!important;}
  .alm-how-m-dark{background:linear-gradient(115deg,#052838 0%,#07384a 52%,#0a4c5f 100%)!important;color:#fff!important;position:relative!important;}
  .alm-how-m-dark:before,.alm-how-m-hero:before,.alm-how-m-cta-dark:before{content:""!important;position:absolute!important;inset:0!important;pointer-events:none!important;background:url('/wp-content/mu-plugins/almara-platform/assets/almara_hero-welle.webp') 78% 58%/190% auto no-repeat!important;opacity:.24!important;mix-blend-mode:screen!important;}
  .alm-how-m-hero{position:relative!important;background:linear-gradient(115deg,#052838 0%,#07384a 52%,#0a4c5f 100%)!important;color:#fff!important;padding-top:34px!important;padding-bottom:46px!important;}
  .alm-how-m-hero .alm-how-m-inner,.alm-how-m-dark .alm-how-m-inner,.alm-how-m-cta-dark > *{position:relative!important;z-index:2!important;}
  .alm-how-m-kicker{font-size:10px!important;line-height:1.2!important;letter-spacing:.18em!important;text-transform:uppercase!important;font-weight:800!important;color:#42919D!important;margin:0 0 14px!important;}
  .alm-how-m-dark .alm-how-m-kicker,.alm-how-m-hero .alm-how-m-kicker{color:#6EC1C2!important;}
  .alm-how-m-title{font-family:Georgia,'Times New Roman',serif!important;font-weight:500!important;letter-spacing:-.045em!important;font-size:clamp(34px,10.2vw,44px)!important;line-height:.94!important;margin:0 0 16px!important;color:#042034!important;}
  .alm-how-m-hero .alm-how-m-title,.alm-how-m-dark .alm-how-m-title,.alm-how-m-cta-dark .alm-how-m-title{color:#fff!important;}
  .alm-how-m-lead{font-size:14px!important;line-height:1.62!important;color:rgba(4,32,52,.82)!important;margin:0!important;}
  .alm-how-m-hero .alm-how-m-lead,.alm-how-m-dark .alm-how-m-lead,.alm-how-m-cta-dark .alm-how-m-lead{color:rgba(255,255,255,.86)!important;}
  .alm-how-m-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin-top:22px!important;width:100%!important;}
  .alm-how-m-btn{display:flex!important;align-items:center!important;justify-content:center!important;min-height:44px!important;border-radius:10px!important;padding:12px 18px!important;font-size:13px!important;font-weight:800!important;text-decoration:none!important;text-align:center!important;}
  .alm-how-m-btn-primary{background:#6EC1C2!important;color:#fff!important;box-shadow:0 16px 34px rgba(4,32,52,.20)!important;}
  .alm-how-m-btn-secondary{background:rgba(4,31,44,.34)!important;color:#fff!important;border:1px solid rgba(255,255,255,.38)!important;}
  .alm-how-m-btn-coral{background:#EDA88E!important;color:#fff!important;}
  .alm-how-m-image-card{width:100%!important;margin:26px 0 0!important;background:#fff!important;border:1px solid rgba(4,32,52,.10)!important;border-radius:20px!important;overflow:hidden!important;box-shadow:0 22px 54px rgba(4,32,52,.18)!important;}
  .alm-how-m-image-card img{display:block!important;width:100%!important;height:210px!important;object-fit:cover!important;object-position:center!important;margin:0!important;padding:0!important;border:0!important;}
  .alm-how-m-equipment-img img{height:190px!important;}
  .alm-how-m-image-caption{padding:18px!important;}
  .alm-how-m-caption-title{font-size:13px!important;line-height:1.35!important;font-weight:850!important;color:#042034!important;margin:0 0 6px!important;}
  .alm-how-m-caption-text{font-size:12px!important;line-height:1.55!important;color:rgba(4,32,52,.68)!important;margin:0!important;}
  .alm-how-m-mini-mark{width:38px!important;height:38px!important;border-radius:12px!important;border:1px solid rgba(110,193,194,.45)!important;background:rgba(110,193,194,.10)!important;display:grid!important;place-items:center!important;color:#42919D!important;font-weight:900!important;margin-bottom:12px!important;}
  .alm-how-m-cards{display:grid!important;grid-template-columns:1fr!important;gap:13px!important;margin-top:26px!important;width:100%!important;}
  .alm-how-m-card,.alm-how-m-step{display:grid!important;grid-template-columns:46px minmax(0,1fr)!important;gap:12px!important;align-items:start!important;width:100%!important;min-width:0!important;padding:17px!important;border-radius:18px!important;background:rgba(255,255,255,.86)!important;border:1px solid rgba(4,32,52,.09)!important;box-shadow:0 14px 34px rgba(4,32,52,.09)!important;}
  .alm-how-m-dark .alm-how-m-card,.alm-how-m-dark .alm-how-m-step{background:rgba(255,255,255,.065)!important;border-color:rgba(255,255,255,.12)!important;box-shadow:none!important;}
  .alm-how-m-card-icon,.alm-how-m-step-number{width:42px!important;height:42px!important;border-radius:999px!important;display:grid!important;place-items:center!important;background:rgba(110,193,194,.13)!important;border:1px solid rgba(110,193,194,.55)!important;color:#42919D!important;font-size:17px!important;font-weight:900!important;}
  .alm-how-m-step-number{background:rgba(237,168,142,.11)!important;border-color:rgba(237,168,142,.62)!important;color:#EDA88E!important;}
  .alm-how-m-dark .alm-how-m-card-icon,.alm-how-m-dark .alm-how-m-step-number{background:rgba(110,193,194,.12)!important;border-color:rgba(110,193,194,.50)!important;color:#6EC1C2!important;}
  .alm-how-m-card-title,.alm-how-m-step-title{font-size:13px!important;line-height:1.25!important;font-weight:850!important;color:#042034!important;margin:0 0 5px!important;}
  .alm-how-m-dark .alm-how-m-card-title,.alm-how-m-dark .alm-how-m-step-title{color:#fff!important;}
  .alm-how-m-card-text,.alm-how-m-step-text{font-size:12px!important;line-height:1.55!important;color:rgba(4,32,52,.72)!important;margin:0!important;}
  .alm-how-m-dark .alm-how-m-card-text,.alm-how-m-dark .alm-how-m-step-text{color:rgba(255,255,255,.78)!important;}
  .alm-how-m-bullets{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin-top:22px!important;}
  .alm-how-m-bullets p{font-size:13px!important;line-height:1.45!important;color:rgba(4,32,52,.78)!important;margin:0!important;}
  .alm-how-m-bullets p:before{content:"✓";color:#42919D;font-weight:900;margin-right:8px;}
  .alm-how-m-audience-img img{height:220px!important;}
  .alm-how-m-final{display:grid!important;gap:16px!important;}
  .alm-how-m-final-card{position:relative!important;width:100%!important;border-radius:20px!important;padding:24px!important;overflow:hidden!important;box-shadow:0 18px 44px rgba(4,32,52,.11)!important;}
  .alm-how-m-cta-dark{background:linear-gradient(115deg,#052838 0%,#07384a 52%,#0a4c5f 100%)!important;color:#fff!important;}
  .alm-how-m-contact{background:#fff!important;border:1px solid rgba(4,32,52,.10)!important;color:#042034!important;}
}

/* =========================================================
   ALMARA How It Works v5.1 — Phone Width Normalizer
   Purpose: fix remaining Elementor mobile squeeze by normalizing
   the root container, the HTML widget wrapper and the mobile renderer
   itself. Scope: B2C How-it-works only. No header/nav rules.
   ========================================================= */
@media screen and (max-width: 767px) {
  html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body:has(#almara-how-it-works-page) .elementor[data-elementor-type="wp-page"],
  body:has(#almara-how-it-works-page) .elementor.elementor-4002,
  body:has(#almara-how-it-works-page) .elementor-location-single,
  body:has(#almara-how-it-works-page) .site-main,
  body:has(#almara-how-it-works-page) main {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
  }

  html body #almara-how-it-works-page,
  html body .almara-page-how-it-works.alm-how-v5-mobile-renderer-active,
  html body .almara-how-it-works-v1.alm-how-v5-mobile-renderer-active {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #FBF7F0 !important;
  }

  html body #almara-how-it-works-page > .elementor-element:not(.alm-how-mobile-renderer),
  html body #almara-how-it-works-page > .alm-tech-section,
  html body #almara-how-it-works-page > .alm-how-mobile-shell {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  html body #almara-how-it-works-page > .alm-how-mobile-renderer,
  html body #almara-how-it-works-page .elementor-widget-html.alm-how-mobile-renderer,
  html body .almara-page-how-it-works .elementor-widget-html.alm-how-mobile-renderer {
    display: block !important;
    visibility: visible !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: #FBF7F0 !important;
  }

  html body #almara-how-it-works-page .elementor-widget-html.alm-how-mobile-renderer > .elementor-widget-container,
  html body .almara-page-how-it-works .elementor-widget-html.alm-how-mobile-renderer > .elementor-widget-container {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #FBF7F0 !important;
  }

  html body #almara-how-it-works-page .alm-how-mobile-page,
  html body .almara-page-how-it-works .alm-how-mobile-page {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #FBF7F0 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-sec,
  html body .almara-page-how-it-works .alm-how-m-sec {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    overflow: hidden !important;
  }

  html body #almara-how-it-works-page .alm-how-m-inner,
  html body .almara-page-how-it-works .alm-how-m-inner {
    width: 100% !important;
    max-width: 420px !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-card,
  html body #almara-how-it-works-page .alm-how-m-step,
  html body #almara-how-it-works-page .alm-how-m-image-card,
  html body #almara-how-it-works-page .alm-how-m-final-card,
  html body .almara-page-how-it-works .alm-how-m-card,
  html body .almara-page-how-it-works .alm-how-m-step,
  html body .almara-page-how-it-works .alm-how-m-image-card,
  html body .almara-page-how-it-works .alm-how-m-final-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-title,
  html body .almara-page-how-it-works .alm-how-m-title {
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }
}

@media screen and (max-width: 374px) {
  html body #almara-how-it-works-page .alm-how-m-sec,
  html body .almara-page-how-it-works .alm-how-m-sec {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  html body #almara-how-it-works-page .alm-how-m-title,
  html body .almara-page-how-it-works .alm-how-m-title {
    font-size: clamp(31px, 9.7vw, 39px) !important;
  }
}


/* =========================================================
   ALMARA How It Works v5.3 FINAL POLISH
   Scope: B2C page only. Requires the outer Elementor page container
   to be Full Width / 100% / Stretch / no side padding.
   Purpose: final editorial rhythm after architecture fix.
   Header v2.3 untouched. Technology/B2B untouched.
   ========================================================= */

.almara-page-how-it-works,
#almara-how-it-works-page,
.almara-how-it-works-v1{
  background:#FBF7F0 !important;
  overflow-x:hidden !important;
}

/* Desktop/tablet: keep proven layout, only refine surface rhythm. */
@media (min-width:768px){
  .almara-page-how-it-works .alm-tech-section > .e-con-inner{
    scroll-margin-top:96px !important;
  }

  .almara-page-how-it-works .alm-tech-feature-card,
  .almara-page-how-it-works .alm-tech-gallery-card,
  .almara-page-how-it-works .alm-tech-hero-card,
  .almara-page-how-it-works .alm-tech-partner-visual-card,
  .almara-page-how-it-works .alm-tech-final-card{
    backface-visibility:hidden !important;
  }

  .almara-page-how-it-works :is(#alm-how-safety,#alm-how-flow) .alm-tech-section-title .elementor-heading-title,
  .almara-page-how-it-works :is(#alm-how-safety,#alm-how-flow) .alm-tech-mini-title .elementor-heading-title,
  .almara-page-how-it-works :is(#alm-how-safety,#alm-how-flow) .alm-tech-loop-title .elementor-heading-title{
    color:rgba(255,255,255,.98) !important;
  }

  .almara-page-how-it-works :is(#alm-how-safety,#alm-how-flow) :is(.alm-tech-mini-text .elementor-widget-container,.alm-tech-loop-text .elementor-widget-container){
    color:rgba(255,255,255,.82) !important;
  }
}

/* Mobile: final editorial proportions. No viewport breakout. */
@media (max-width:767px){
  html,body{
    overflow-x:hidden !important;
  }

  html body #almara-how-it-works-page,
  html body .almara-page-how-it-works,
  html body .almara-how-it-works-v1,
  html body #almara-how-it-works-page .alm-how-mobile-renderer,
  html body #almara-how-it-works-page .alm-how-mobile-renderer > .elementor-widget-container,
  html body #almara-how-it-works-page .alm-how-mobile-page{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    overflow-x:hidden !important;
    background:#FBF7F0 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-sec,
  html body .almara-page-how-it-works .alm-how-m-sec{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:52px 18px !important;
    overflow:hidden !important;
  }

  html body #almara-how-it-works-page .alm-how-m-sec + .alm-how-m-sec,
  html body .almara-page-how-it-works .alm-how-m-sec + .alm-how-m-sec{
    border-top:1px solid rgba(4,32,52,.045) !important;
  }

  html body #almara-how-it-works-page .alm-how-m-inner,
  html body .almara-page-how-it-works .alm-how-m-inner{
    width:100% !important;
    max-width:390px !important;
    min-width:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    display:block !important;
  }

  html body #almara-how-it-works-page .alm-how-m-hero,
  html body .almara-page-how-it-works .alm-how-m-hero{
    padding-top:30px !important;
    padding-bottom:40px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-hero:before,
  html body .almara-page-how-it-works .alm-how-m-hero:before,
  html body #almara-how-it-works-page .alm-how-m-dark:before,
  html body .almara-page-how-it-works .alm-how-m-dark:before,
  html body #almara-how-it-works-page .alm-how-m-cta-dark:before,
  html body .almara-page-how-it-works .alm-how-m-cta-dark:before{
    background-position:78% 56% !important;
    background-size:172% auto !important;
    opacity:.22 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-kicker,
  html body .almara-page-how-it-works .alm-how-m-kicker{
    font-size:9.5px !important;
    line-height:1.25 !important;
    letter-spacing:.18em !important;
    margin-bottom:12px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-title,
  html body .almara-page-how-it-works .alm-how-m-title{
    font-size:clamp(32px,9.8vw,42px) !important;
    line-height:.96 !important;
    letter-spacing:-.044em !important;
    margin-bottom:14px !important;
    text-wrap:balance !important;
  }

  html body #almara-how-it-works-page .alm-how-m-lead,
  html body .almara-page-how-it-works .alm-how-m-lead{
    font-size:13.5px !important;
    line-height:1.58 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-actions,
  html body .almara-page-how-it-works .alm-how-m-actions{
    gap:9px !important;
    margin-top:20px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-btn,
  html body .almara-page-how-it-works .alm-how-m-btn{
    min-height:42px !important;
    border-radius:10px !important;
    padding:11px 16px !important;
    font-size:12.5px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-image-card,
  html body .almara-page-how-it-works .alm-how-m-image-card{
    margin-top:22px !important;
    border-radius:19px !important;
    box-shadow:0 18px 46px rgba(4,32,52,.16) !important;
  }

  html body #almara-how-it-works-page .alm-how-m-image-card img,
  html body .almara-page-how-it-works .alm-how-m-image-card img{
    height:196px !important;
    object-fit:cover !important;
    object-position:center !important;
  }

  html body #almara-how-it-works-page .alm-how-m-equipment-img img,
  html body .almara-page-how-it-works .alm-how-m-equipment-img img{
    height:176px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-audience-img img,
  html body .almara-page-how-it-works .alm-how-m-audience-img img{
    height:208px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-image-caption,
  html body .almara-page-how-it-works .alm-how-m-image-caption{
    padding:16px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-caption-title,
  html body .almara-page-how-it-works .alm-how-m-caption-title{
    font-size:12.5px !important;
    line-height:1.32 !important;
    margin-bottom:5px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-caption-text,
  html body .almara-page-how-it-works .alm-how-m-caption-text{
    font-size:11.8px !important;
    line-height:1.5 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-cards,
  html body .almara-page-how-it-works .alm-how-m-cards{
    gap:12px !important;
    margin-top:22px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-card,
  html body #almara-how-it-works-page .alm-how-m-step,
  html body .almara-page-how-it-works .alm-how-m-card,
  html body .almara-page-how-it-works .alm-how-m-step{
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:11px !important;
    padding:15px !important;
    border-radius:17px !important;
    box-shadow:0 12px 30px rgba(4,32,52,.085) !important;
  }

  html body #almara-how-it-works-page .alm-how-m-dark .alm-how-m-card,
  html body #almara-how-it-works-page .alm-how-m-dark .alm-how-m-step,
  html body .almara-page-how-it-works .alm-how-m-dark .alm-how-m-card,
  html body .almara-page-how-it-works .alm-how-m-dark .alm-how-m-step{
    background:rgba(255,255,255,.07) !important;
    border-color:rgba(255,255,255,.12) !important;
    box-shadow:none !important;
  }

  html body #almara-how-it-works-page .alm-how-m-card-icon,
  html body #almara-how-it-works-page .alm-how-m-step-number,
  html body .almara-page-how-it-works .alm-how-m-card-icon,
  html body .almara-page-how-it-works .alm-how-m-step-number{
    width:38px !important;
    height:38px !important;
    font-size:15px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-card-title,
  html body #almara-how-it-works-page .alm-how-m-step-title,
  html body .almara-page-how-it-works .alm-how-m-card-title,
  html body .almara-page-how-it-works .alm-how-m-step-title{
    font-size:12.8px !important;
    line-height:1.24 !important;
    margin-bottom:4px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-card-text,
  html body #almara-how-it-works-page .alm-how-m-step-text,
  html body .almara-page-how-it-works .alm-how-m-card-text,
  html body .almara-page-how-it-works .alm-how-m-step-text{
    font-size:11.8px !important;
    line-height:1.48 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-bullets,
  html body .almara-page-how-it-works .alm-how-m-bullets{
    gap:9px !important;
    margin-top:20px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-bullets p,
  html body .almara-page-how-it-works .alm-how-m-bullets p{
    font-size:12.7px !important;
    line-height:1.42 !important;
  }

  html body #almara-how-it-works-page .alm-how-m-final,
  html body .almara-page-how-it-works .alm-how-m-final{
    gap:14px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-final-card,
  html body .almara-page-how-it-works .alm-how-m-final-card{
    border-radius:19px !important;
    padding:22px !important;
    box-shadow:0 16px 40px rgba(4,32,52,.10) !important;
  }

  html body #almara-how-it-works-page .alm-how-m-mini-mark,
  html body .almara-page-how-it-works .alm-how-m-mini-mark{
    width:34px !important;
    height:34px !important;
    border-radius:11px !important;
    margin-bottom:10px !important;
  }
}

@media (max-width:374px){
  html body #almara-how-it-works-page .alm-how-m-sec,
  html body .almara-page-how-it-works .alm-how-m-sec{
    padding-left:15px !important;
    padding-right:15px !important;
  }

  html body #almara-how-it-works-page .alm-how-m-title,
  html body .almara-page-how-it-works .alm-how-m-title{
    font-size:clamp(30px,9.4vw,38px) !important;
  }
}

/* =========================================================
 * v3.1.3 FINAL HERO VISUAL ALIGNMENT
 * Scope: How-it-works only. Aligns the hero with the approved About-us
 * dark ALMARA wave composition. Loader must load this file only on
 * /de/so-funktioniert-almara/ and /en/how-almara-works/.
 * ========================================================= */
.almara-page-how-it-works #alm-how-hero,
#almara-how-it-works-page #alm-how-hero,
#alm-how-hero.alm-tech-hero {
  position: relative !important;
  overflow: hidden !important;
  color: #fff !important;
  background:
    linear-gradient(
      90deg,
      rgba(4,32,52,.96) 0%,
      rgba(4,32,52,.82) 42%,
      rgba(4,32,52,.38) 72%,
      rgba(4,32,52,.28) 100%
    ),
    url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Hero-Welle_neu.webp') center center / cover no-repeat !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

.almara-page-how-it-works #alm-how-hero::before,
.almara-page-how-it-works #alm-how-hero::after,
.almara-page-how-it-works #alm-how-hero .alm-tech-hero-copy::before,
.almara-page-how-it-works #alm-how-hero .alm-tech-hero-copy::after,
#almara-how-it-works-page #alm-how-hero::before,
#almara-how-it-works-page #alm-how-hero::after,
#almara-how-it-works-page #alm-how-hero .alm-tech-hero-copy::before,
#almara-how-it-works-page #alm-how-hero .alm-tech-hero-copy::after,
#alm-how-hero.alm-tech-hero::before,
#alm-how-hero.alm-tech-hero::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

.almara-page-how-it-works #alm-how-hero > .e-con-inner,
#almara-how-it-works-page #alm-how-hero > .e-con-inner,
#alm-how-hero.alm-tech-hero > .e-con-inner {
  position: relative !important;
  z-index: 2 !important;
}

.almara-page-how-it-works #alm-how-hero .alm-tech-hero-title .elementor-heading-title,
#almara-how-it-works-page #alm-how-hero .alm-tech-hero-title .elementor-heading-title,
#alm-how-hero.alm-tech-hero .alm-tech-hero-title .elementor-heading-title {
  color: #fff !important;
  text-shadow: 0 12px 30px rgba(0,0,0,.24) !important;
}

.almara-page-how-it-works #alm-how-hero .alm-tech-hero-lead,
.almara-page-how-it-works #alm-how-hero .alm-tech-hero-lead .elementor-widget-container,
.almara-page-how-it-works #alm-how-hero .alm-tech-hero-lead p,
#almara-how-it-works-page #alm-how-hero .alm-tech-hero-lead,
#almara-how-it-works-page #alm-how-hero .alm-tech-hero-lead .elementor-widget-container,
#almara-how-it-works-page #alm-how-hero .alm-tech-hero-lead p,
#alm-how-hero.alm-tech-hero .alm-tech-hero-lead,
#alm-how-hero.alm-tech-hero .alm-tech-hero-lead .elementor-widget-container,
#alm-how-hero.alm-tech-hero .alm-tech-hero-lead p {
  color: rgba(255,255,255,.94) !important;
  opacity: 1 !important;
}

@media (max-width: 860px) {
  .almara-page-how-it-works #alm-how-hero,
  #almara-how-it-works-page #alm-how-hero,
  #alm-how-hero.alm-tech-hero {
    background:
      linear-gradient(
        90deg,
        rgba(4,32,52,.96) 0%,
        rgba(4,32,52,.82) 56%,
        rgba(4,32,52,.42) 100%
      ),
      url('/wp-content/mu-plugins/almara-platform/assets/ALMARA_Hero-Welle_neu.webp') 72% center / auto 100% no-repeat !important;
  }
}

/* =========================================================
 * ALMARA How It Works v3.1.4 — Equipment List Visual Polish
 * Scope: only B2C How-it-works equipment section.
 * Purpose: restore the visual support for the four equipment lines
 * without touching loader, header, nav, Technology/B2B or JSON.
 * ========================================================= */

.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list {
  margin-top: 30px !important;
  max-width: 430px !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner {
  position: relative !important;
  display: grid !important;
  gap: 12px !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Subtle vertical guide behind the four chips. */
.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner::before,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner::before,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner::before {
  content: "" !important;
  position: absolute !important;
  left: 17px !important;
  top: 18px !important;
  bottom: 18px !important;
  width: 1px !important;
  background: linear-gradient(180deg, rgba(66,145,157,.12), rgba(66,145,157,.34), rgba(237,168,142,.22)) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Robust selector: works whether the individual text widgets still carry
   .alm-tech-bullet or only sit inside .alm-tech-bullet-list. */
.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet,
.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet .elementor-widget-container,
.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet .elementor-widget-container,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet .elementor-widget-container,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 13px !important;
  min-height: 42px !important;
  padding: 6px 0 !important;
  color: rgba(4,32,52,.92) !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 760 !important;
  letter-spacing: -.01em !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet .elementor-widget-container::before,
.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container::before,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet .elementor-widget-container::before,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container::before,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet .elementor-widget-container::before,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container::before {
  content: "" !important;
  width: 35px !important;
  height: 35px !important;
  min-width: 35px !important;
  display: block !important;
  border-radius: 999px !important;
  border: 1px solid rgba(66,145,157,.42) !important;
  background:
    rgba(255,255,255,.72)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'%3E%3Cpath d='M7 18.4 C10.2 14.9 13.5 14.8 16.7 18.2 C20 21.7 23.6 21.7 27.1 17.2' fill='none' stroke='%2342919D' stroke-width='2.2' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='17' r='15.2' fill='none' stroke='%2342919D' stroke-opacity='.22' stroke-width='1.2'/%3E%3C/svg%3E")
    center / 34px 34px no-repeat !important;
  box-shadow: 0 10px 24px rgba(4,32,52,.08), inset 0 1px 0 rgba(255,255,255,.7) !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet .elementor-widget-container p,
.almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container p,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet .elementor-widget-container p,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container p,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet .elementor-widget-container p,
#almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container p {
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 861px) {
  .almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list {
    margin-top: 34px !important;
  }
}

@media (max-width: 767px) {
  .almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list {
    max-width: 100% !important;
    margin-top: 24px !important;
  }

  .almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner {
    gap: 10px !important;
  }

  .almara-page-how-it-works #alm-how-equipment .alm-tech-bullet .elementor-widget-container,
  .almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet .elementor-widget-container,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-bullet .elementor-widget-container,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 12px !important;
    min-height: 40px !important;
    font-size: 14px !important;
  }

  .almara-page-how-it-works #alm-how-equipment .alm-tech-bullet .elementor-widget-container::before,
  .almara-page-how-it-works #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container::before,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet .elementor-widget-container::before,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container::before,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-bullet .elementor-widget-container::before,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-bullet-list > .e-con-inner > .elementor-widget-text-editor .elementor-widget-container::before {
    width: 33px !important;
    height: 33px !important;
    min-width: 33px !important;
    background-size: 33px 33px !important;
  }
}

/* =========================================================
 * ALMARA How It Works v3.1.5 — Equipment List DOM Fallback
 * Reason: On the live page the four equipment items may no longer sit
 * inside .alm-tech-bullet-list / .alm-tech-bullet. This fallback targets
 * the actual left copy column after .alm-tech-section-lead and restores
 * the visual support without JSON changes.
 * Scope: #alm-how-equipment only.
 * ========================================================= */

.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy > .e-con-inner,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy > .e-con-inner,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy > .e-con-inner {
  position: relative !important;
}

/* Catch the four standalone item widgets when the list wrapper class is missing. */
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor,
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 430px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

/* Add spacing before the first actual item after the lead. */
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-text-editor,
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-heading,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-text-editor,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-heading,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-text-editor,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-heading {
  margin-top: 30px !important;
}

/* Visual chip + text layout for the fallback item widgets. */
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container,
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 44px !important;
  padding: 6px 0 !important;
  color: rgba(4,32,52,.92) !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 760 !important;
  letter-spacing: -.01em !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container::before,
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title::before,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container::before,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title::before,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container::before,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title::before {
  content: "" !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  display: block !important;
  border-radius: 999px !important;
  border: 1px solid rgba(66,145,157,.42) !important;
  background:
    rgba(255,255,255,.72)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'%3E%3Cpath d='M7 18.4 C10.2 14.9 13.5 14.8 16.7 18.2 C20 21.7 23.6 21.7 27.1 17.2' fill='none' stroke='%2342919D' stroke-width='2.2' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='17' r='15.2' fill='none' stroke='%2342919D' stroke-opacity='.22' stroke-width='1.2'/%3E%3C/svg%3E")
    center / 34px 34px no-repeat !important;
  box-shadow: 0 10px 24px rgba(4,32,52,.08), inset 0 1px 0 rgba(255,255,255,.7) !important;
}

.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container p,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container p,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container p {
  margin: 0 !important;
  padding: 0 !important;
}

/* If the fallback catches too many text widgets, keep it within the intended copy column only
   and do not affect the gallery card/caption on the right. */
.almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-visuals .elementor-widget-container::before,
#almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-visuals .elementor-widget-container::before,
.almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-visuals .elementor-widget-container::before {
  content: none !important;
  display: none !important;
}

@media (max-width: 767px) {
  .almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-text-editor,
  .almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-heading,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-text-editor,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-heading,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-text-editor,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead + .elementor-widget-heading {
    margin-top: 24px !important;
  }

  .almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container,
  .almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 12px !important;
    min-height: 40px !important;
    font-size: 14px !important;
  }

  .almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container::before,
  .almara-page-how-it-works #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title::before,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container::before,
  #almara-how-it-works-page #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title::before,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-text-editor .elementor-widget-container::before,
  .almara-how-it-works-v1 #alm-how-equipment .alm-tech-equipment-copy .alm-tech-section-lead ~ .elementor-widget-heading .elementor-heading-title::before {
    width: 33px !important;
    height: 33px !important;
    min-width: 33px !important;
    background-size: 33px 33px !important;
  }
}

/* =========================================================
 * ALMARA How It Works v3.1.6 — Equipment Bullet Direct Fix
 * Reason: Live DOM shows each equipment line is the Elementor widget
 * itself: .alm-tech-bullet.elementor-widget-text-editor. Earlier rules
 * targeted only .elementor-widget-container::before, which may be absent
 * or neutralized by Elementor. This final layer draws the visual chip on
 * the bullet widget itself and disables inner pseudo duplicates.
 * Scope: #alm-how-equipment only. No loader/header/json changes.
 * ========================================================= */

#alm-how-equipment .alm-tech-bullet-list,
#alm-how-equipment .alm-tech-bullet-list--equipment {
  margin-top: 34px !important;
  width: 100% !important;
  max-width: 460px !important;
}

#alm-how-equipment .alm-tech-bullet-list > .e-con-inner,
#alm-how-equipment .alm-tech-bullet-list--equipment > .e-con-inner {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
}

#alm-how-equipment .alm-tech-bullet-list > .e-con-inner::before,
#alm-how-equipment .alm-tech-bullet-list--equipment > .e-con-inner::before {
  content: "" !important;
  position: absolute !important;
  left: 17px !important;
  top: 21px !important;
  bottom: 21px !important;
  width: 1px !important;
  background: linear-gradient(180deg, rgba(66,145,157,.10), rgba(66,145,157,.42), rgba(66,145,157,.10)) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

#alm-how-equipment .alm-tech-bullet {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 14px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 3px 0 !important;
  color: rgba(4,32,52,.92) !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 760 !important;
  letter-spacing: -.01em !important;
}

#alm-how-equipment .alm-tech-bullet::before {
  content: "" !important;
  display: block !important;
  width: 35px !important;
  height: 35px !important;
  min-width: 35px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(66,145,157,.44) !important;
  background:
    rgba(255,255,255,.78)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'%3E%3Cpath d='M7 18.4 C10.2 14.9 13.5 14.8 16.7 18.2 C20 21.7 23.6 21.7 27.1 17.2' fill='none' stroke='%2342919D' stroke-width='2.2' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='17' r='15.2' fill='none' stroke='%2342919D' stroke-opacity='.22' stroke-width='1.2'/%3E%3C/svg%3E")
    center / 34px 34px no-repeat !important;
  box-shadow: 0 10px 24px rgba(4,32,52,.08), inset 0 1px 0 rgba(255,255,255,.72) !important;
}

#alm-how-equipment .alm-tech-bullet > .elementor-widget-container {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
}

#alm-how-equipment .alm-tech-bullet > .elementor-widget-container::before,
#alm-how-equipment .alm-tech-bullet .elementor-widget-container::before {
  content: none !important;
  display: none !important;
}

#alm-how-equipment .alm-tech-bullet p,
#alm-how-equipment .alm-tech-bullet .elementor-widget-container p {
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
}

@media (max-width: 767px) {
  #alm-how-equipment .alm-tech-bullet-list,
  #alm-how-equipment .alm-tech-bullet-list--equipment {
    margin-top: 24px !important;
    max-width: 100% !important;
  }

  #alm-how-equipment .alm-tech-bullet-list > .e-con-inner,
  #alm-how-equipment .alm-tech-bullet-list--equipment > .e-con-inner {
    gap: 10px !important;
  }

  #alm-how-equipment .alm-tech-bullet {
    grid-template-columns: 33px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    min-height: 39px !important;
    font-size: 14px !important;
  }

  #alm-how-equipment .alm-tech-bullet::before {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    background-size: 32px 32px !important;
  }

  #alm-how-equipment .alm-tech-bullet-list > .e-con-inner::before,
  #alm-how-equipment .alm-tech-bullet-list--equipment > .e-con-inner::before {
    left: 16px !important;
    top: 19px !important;
    bottom: 19px !important;
  }
}