/* ARMRA full-bleed hero: one photo across the screen, the claim and the product laid over it, the header transparent on top. */
.hq-hf {
  position: relative; isolation: isolate; display: flex; overflow: hidden;
  min-height: min(100svh, 1040px); color: var(--hf-ink); background: #1f3446;
}
.hq-hf--light { background: #f4efe7; }
.hq-hf__media { position: absolute; inset: 0; display: block; }
.hq-hf__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--hf-pos); display: block; }
.hq-hf__shade {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(0, 0, 0, var(--hf-shade)) 0%, rgba(0, 0, 0, calc(var(--hf-shade) * 0.55)) 36%, rgba(0, 0, 0, 0) 64%);
}
.hq-hf--light .hq-hf__shade {
  background: linear-gradient(90deg, rgba(255, 255, 255, var(--hf-shade)) 0%, rgba(255, 255, 255, calc(var(--hf-shade) * 0.6)) 34%, rgba(255, 255, 255, 0) 56%);
}
.hq-hf__inner {
  position: relative; z-index: 1; width: 100%; max-width: 1680px; margin: 0 auto;
  padding: 140px clamp(24px, 5vw, 96px) 64px; display: flex; flex-direction: column; justify-content: center; gap: 44px;
}
.hq-hf__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; max-width: 640px; }
.hq-hf__title {
  margin: 0; font-family: var(--hq-font-display); font-weight: 400; font-size: clamp(54px, 6vw, 104px); line-height: 0.95;
  letter-spacing: -0.02em; color: var(--hf-head); text-wrap: balance; text-shadow: 0 2px 30px rgba(0, 0, 0, 0.2);
}
.hq-hf__body { margin: 0; max-width: 520px; font-family: var(--hq-font-ui); font-size: clamp(17px, 1.4vw, 21px); line-height: 1.42; text-shadow: 0 1px 16px rgba(0, 0, 0, 0.28); }
.hq-hf--light .hq-hf__title, .hq-hf--light .hq-hf__body { text-shadow: none; }
.hq-hf__proof { --hq-star: var(--ebb-lemon); }
.hq-hf__proof .hq-stars__row { font-size: 20px; color: rgba(255, 255, 255, 0.35); }
.hq-hf__proof .hq-stars__count { font-size: 15px; }
.hq-hf--light .hq-hf__proof { --hq-star: var(--ebb-blue); }
.hq-hf--light .hq-hf__proof .hq-stars__row { color: rgba(0, 0, 0, 0.14); }
.hq-hf__cta { min-height: 58px; padding: 0 44px; font-size: 15px; }
.hq-hf--light .hq-hf__cta { background: var(--ebb-purple); color: var(--ebb-white); }
.hq-hf__card {
  display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: 16px; max-width: 440px; padding: 9px 18px 9px 9px;
  background: rgba(255, 255, 255, 0.94); color: var(--ebb-black); text-decoration: none; border-radius: 14px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.16); backdrop-filter: blur(8px); transition: transform 0.2s ease;
}
.hq-hf__card:hover { transform: translateY(-2px); }
.hq-hf__card-img { width: 64px; height: 64px; object-fit: contain; display: block; background: var(--ebb-beige); border-radius: 10px; }
.hq-hf__card-meta { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.hq-hf__card-name { font-family: var(--hq-font-ui); font-size: 12px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1.3; }
.hq-hf__card-price { font-family: var(--hq-font-ui); font-size: 15px; white-space: nowrap; }
.hq-hf__card-go { font-size: 20px; }

/* Phones, after ARMRA's mobile hero: the photo with the headline on it, then the line, rating, button and card below. */
@media (max-width: 749px) {
  .hq-hf { display: grid; grid-template-columns: 100%; min-height: 0; color: var(--ebb-black); background: var(--ebb-white); }
  .hq-hf__inner, .hq-hf__copy { display: contents; }
  .hq-hf__media { position: relative; grid-area: 1 / 1; aspect-ratio: 4 / 5; }
  .hq-hf__img { object-position: var(--hf-pos-m); }
  .hq-hf__shade, .hq-hf--light .hq-hf__shade {
    position: relative; grid-area: 1 / 1;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.55) 22%, rgba(255, 255, 255, 0) 42%);
  }
  .hq-hf--dark .hq-hf__shade { background: linear-gradient(0deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 45%); }
  .hq-hf__title { grid-area: 1 / 1; align-self: end; z-index: 1; padding: 0 20px 16px; font-size: clamp(40px, 11vw, 56px); text-shadow: none; }
  .hq-hf--dark .hq-hf__title { color: var(--ebb-white); }
  .hq-hf--light .hq-hf__title { color: var(--hf-head); }
  .hq-hf__body { grid-row: 2; padding: 10px 20px 0; max-width: none; font-size: 16px; text-shadow: none; }
  .hq-hf__proof { grid-row: 3; padding: 12px 20px 0; --hq-star: var(--ebb-blue); }
  .hq-hf__proof .hq-stars__row { color: rgba(0, 0, 0, 0.14); }
  .hq-hf__cta { grid-row: 4; justify-self: start; margin: 16px 20px 0; min-height: 54px; padding: 0 34px; }
  .hq-hf--dark .hq-hf__cta { background: var(--ebb-lemon); color: var(--ebb-black); }
  .hq-hf__card { grid-row: 5; margin: 18px 20px 28px; grid-template-columns: 52px 1fr auto; gap: 12px; padding: 7px 14px 7px 7px; background: var(--ebb-beige); box-shadow: none; }
  .hq-hf__card-img { width: 52px; height: 52px; background: var(--ebb-white); }
}