/* ============================================================
   Ampy Hero 1  |  live Bricks build matched to prototype "B"
   Full responsive. Replaces the previous paste in full.
   ============================================================ */

/* FRAME: veil, framing, vertical centering */
#brxe-fwtruv.brxe-container{
  justify-content:center; align-items:stretch; gap:0;
  padding:0 clamp(24px,5vw,84px);
  border-radius:22px;
  background-position:62% 60%;
}
#brxe-fwtruv.brxe-container::before{
  content:""; position:absolute; inset:0; z-index:0;
  pointer-events:none; border-radius:inherit;
  background:
    linear-gradient(98deg, rgba(9,11,50,.68) 0%, rgba(9,11,50,.46) 42%, rgba(9,11,50,.12) 66%, rgba(9,11,50,.02) 100%),
    linear-gradient(0deg, rgba(9,11,50,.38) 0%, rgba(9,11,50,0) 26%);
}

/* CONTENT stack */
#brxe-gjdywh.brxe-block{ position:relative; z-index:1; max-width:880px; gap:18px; padding:0; }

/* H1 */
#brxe-neabxo.brxe-heading{
  font-size:clamp(36px,4.6vw,60px); line-height:1.07; font-weight:700;
  letter-spacing:-.018em; color:#fff; text-wrap:balance;
}

/* Subtext */
#brxe-ecwpxi.brxe-text, #brxe-ecwpxi.brxe-text p{
  font-size:clamp(17px,1.55vw,22px); line-height:1.58; font-weight:400;
  color:rgba(255,255,255,.92); text-shadow:0 1px 12px rgba(9,11,50,.35); max-width:none;
}

/* CTA */
#brxe-sbnsjo.brxe-button{
  align-self:flex-start; gap:16px; min-height:58px; padding:11px 26px;
  border-radius:16px; margin-top:14px; color:hsl(237 35% 24%);
  font-size:16px; font-weight:500; line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 2px 4px rgba(9,11,50,.10), 0 14px 32px -8px rgba(9,11,50,.40);
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
#brxe-sbnsjo.brxe-button:hover{
  transform:translateY(-1.5px); filter:saturate(1.06) brightness(1.02);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 3px 6px rgba(9,11,50,.12), 0 18px 38px -8px rgba(9,11,50,.46);
}
#brxe-sbnsjo.brxe-button:active{ transform:translateY(0); }
#brxe-sbnsjo.brxe-button svg{ transition:transform .16s ease; }
#brxe-sbnsjo.brxe-button:hover svg{ transform:scale(1.18); }

/* PROOF row, bottom-right */
#brxe-bqpxuw.brxe-block{
  z-index:1; top:auto; left:auto;
  right:clamp(24px,3vw,44px); bottom:clamp(20px,3vh,32px);
  gap:14px; align-items:center; color:#fff; font-size:14.5px;
  text-shadow:0 1px 8px rgba(9,11,50,.45);
}
#brxe-nyhrpk.brxe-text-basic{ font-size:14.5px; color:#fff; font-weight:400; }
#brxe-ydarib.brxe-text-basic{ font-size:14.5px; color:#fff; text-align:left; }
#brxe-nyhrpk.brxe-text-basic strong, #brxe-ydarib.brxe-text-basic strong{ font-weight:700; }

/* divider before the volume text (no separator element exists in the build) */
#brxe-ydarib.brxe-text-basic::before{
  content:""; display:inline-block; width:1px; height:15px;
  margin-right:14px; background:rgba(255,255,255,.45); vertical-align:-3px;
}

/* stars container (data-mf="stars") and the five star icons */
#brxe-vtckef.brxe-div{ display:inline-flex; align-items:center; gap:2.5px; flex:0 0 auto; width:auto; min-width:0; height:auto; background:none; }
#brxe-vtckef.brxe-div svg{ width:14px; height:14px; flex:0 0 auto; fill:#fff; }
#brxe-vtckef.brxe-div svg path{ fill:#fff; }

/* Google "G" icon: hug the 16px icon so it does not inflate the row */
#brxe-bqpxuw .bricks-link-wrapper{ display:inline-flex; align-items:center; line-height:1; height:16px; min-height:0; max-height:16px; flex:0 0 auto; }
#brxe-bqpxuw .bricks-link-wrapper > svg{ width:16px; height:16px; flex:0 0 auto; }

/* corners tighten on small screens */
@media (max-width:992px){
  #brxe-fwtruv.brxe-container{ border-radius:18px; }
}

/* tablet / small landscape 561 to 992 */
@media (min-width:561px) and (max-width:992px){
  #brxe-gjdywh.brxe-block{ max-width:640px; }
  #brxe-fwtruv.brxe-container{ padding:0 clamp(30px,6vw,60px); }
  #brxe-neabxo.brxe-heading{ font-size:clamp(38px,6.2vw,50px); }
  #brxe-ecwpxi.brxe-text, #brxe-ecwpxi.brxe-text p{ font-size:clamp(16px,2.3vw,19px); }
  #brxe-bqpxuw.brxe-block{ right:24px; bottom:20px; }
}

/* large tablet / small desktop 993 to 1200 */
@media (min-width:993px) and (max-width:1200px){
  #brxe-gjdywh.brxe-block{ max-width:720px; }
  #brxe-neabxo.brxe-heading{ font-size:clamp(38px,4.4vw,46px); }
}

/* phone, max 560: veil bottom-heavy, proof stacks bottom-left */
@media (max-width:560px){
  #brxe-fwtruv.brxe-container{ padding:0 24px 7vh; background-position:66% 62%; }
  #brxe-fwtruv.brxe-container::before{
    background:
      linear-gradient(180deg, rgba(9,11,50,.30) 0%, rgba(9,11,50,.24) 30%, rgba(9,11,50,.28) 62%, rgba(9,11,50,.64) 100%),
      linear-gradient(98deg, rgba(9,11,50,.28) 0%, rgba(9,11,50,.05) 60%);
  }
  #brxe-gjdywh.brxe-block{ max-width:none; gap:14px; }
  #brxe-neabxo.brxe-heading{ font-size:36px; }
  #brxe-ecwpxi.brxe-text, #brxe-ecwpxi.brxe-text p{ font-size:15.5px; line-height:1.55; }
  #brxe-sbnsjo.brxe-button{ min-height:52px; padding:9px 22px; gap:12px; font-size:15px; margin-top:12px; }

  /* proof: bottom-left, rating row on top, volume wraps below */
  #brxe-bqpxuw.brxe-block{ left:24px; right:auto; bottom:20px; flex-wrap:wrap; gap:9px; font-size:13.5px; max-width:calc(100% - 48px); }
  #brxe-nyhrpk.brxe-text-basic{ font-size:13.5px; }
  #brxe-vtckef.brxe-div svg{ width:13.5px; height:13.5px; }
  #brxe-ydarib.brxe-text-basic{ flex-basis:100%; font-size:13.5px; opacity:.92; }
  #brxe-ydarib.brxe-text-basic::before{ display:block; width:26px; height:1px; margin:0 0 9px; background:rgba(255,255,255,.38); }
}