
.hhcl-wrap,.hhcl-wrap *{box-sizing:border-box}
.hhcl-wrap{
  --hh-dark:#082f72;
  --hh-mid:#258f96;
  --hh-teal:#2aa2a4;
  --hh-bright:#82e3e0;
  --hh-lavender:#bcaed8;
  --hh-green:#28b913;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:100%;
  max-width:1120px;
  margin:24px auto;
  padding:42px 48px;
  border-radius:28px;
  background:linear-gradient(135deg,var(--hh-dark) 0%,#126b83 44%,var(--hh-mid) 100%);
  color:#fff;
  box-shadow:0 24px 65px rgba(8,47,114,.28),0 0 0 1px rgba(255,255,255,.14) inset;
  font-family:inherit;
}
.hhcl-wrap:before{
  content:"";
  position:absolute;
  z-index:0;
  inset:-75% auto -75% -30%;
  width:22%;
  transform:rotate(18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);
  animation:hhclShine 6s ease-in-out infinite;
  pointer-events:none;
}
.hhcl-inner{position:relative;z-index:3;max-width:900px;margin:auto}
.hhcl-orb{position:absolute;z-index:0;border-radius:999px;filter:blur(12px);opacity:.28;pointer-events:none}
.hhcl-orb-one{width:260px;height:260px;right:-100px;top:-120px;background:var(--hh-bright);animation:hhclFloat 6s ease-in-out infinite}
.hhcl-orb-two{width:220px;height:220px;left:-110px;bottom:-130px;background:var(--hh-lavender);animation:hhclFloat 7s ease-in-out infinite reverse}

/* Neutral DIV wrapper: deliberately not a semantic <header> to avoid Astra/theme header styling. */
.hhcl-ui-header{
  text-align:center;
  max-width:780px;
  margin:0 auto 26px;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
}
.hhcl-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 15px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
  box-shadow:0 8px 24px rgba(0,0,0,.11);
  backdrop-filter:blur(8px);
}
.hhcl-kicker:before{
  content:"";
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--hh-green);
  animation:hhclPulse 1.7s infinite;
}
.hhcl-ui-header h2{
  margin:18px auto 12px;
  color:#fff!important;
  font-size:clamp(34px,5vw,54px)!important;
  line-height:1.05!important;
  font-weight:950!important;
  letter-spacing:-.03em!important;
  text-shadow:0 6px 26px rgba(0,0,0,.20);
}
.hhcl-ui-header p{
  max-width:720px;
  margin:0 auto;
  color:rgba(255,255,255,.92);
  font-size:17px;
  line-height:1.6;
}
.hhcl-card{
  padding:26px;
  border:1px solid rgba(255,255,255,.20);
  border-radius:22px;
  background:rgba(255,255,255,.11);
  box-shadow:0 14px 36px rgba(0,0,0,.13);
  backdrop-filter:blur(10px);
}
.hhcl-form label{
  display:block;
  margin:0 0 16px;
}
.hhcl-form label>span{
  display:block;
  margin:0 0 7px;
  color:var(--hh-bright);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.hhcl-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.hhcl-form input,
.hhcl-form textarea{
  display:block;
  width:100%;
  border:1px solid rgba(255,255,255,.26);
  border-radius:14px;
  padding:14px 15px;
  background:rgba(255,255,255,.97);
  color:#183f4a;
  font:inherit;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.03);
}
.hhcl-form input:focus,
.hhcl-form textarea:focus{
  outline:none;
  border-color:var(--hh-bright);
  box-shadow:0 0 0 4px rgba(130,227,224,.18);
}
.hhcl-form textarea{resize:vertical;min-height:150px}
.hhcl-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  min-width:220px;
  max-width:100%;
  padding:15px 22px;
  border:0;
  border-radius:14px;
  background:linear-gradient(100deg,#65dc54,var(--hh-green),#65dc54);
  background-size:220% 100%;
  color:#102f39!important;
  font-size:15px;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 14px 30px rgba(0,0,0,.22),0 0 0 0 rgba(40,185,19,.55);
  animation:hhclButton 2.5s ease-in-out infinite;
  transition:transform .2s ease;
}
.hhcl-button:hover{transform:translateY(-2px)}
.hhcl-notice{
  margin:0 0 18px;
  padding:13px 16px;
  border-radius:14px;
  background:#fff;
  color:#173d63;
  font-weight:800;
  box-shadow:0 10px 25px rgba(0,0,0,.13);
}
.hhcl-success{border-left:5px solid #2ab69d}
.hhcl-error{border-left:5px solid #d94a5a}
.hhcl-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}

@keyframes hhclShine{
  0%,50%{left:-35%;opacity:0}
  60%{opacity:1}
  80%,100%{left:125%;opacity:0}
}
@keyframes hhclFloat{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-16px,16px,0) scale(1.08)}
}
@keyframes hhclPulse{
  0%{box-shadow:0 0 0 0 rgba(40,185,19,.72)}
  70%{box-shadow:0 0 0 12px rgba(40,185,19,0)}
  100%{box-shadow:0 0 0 0 rgba(40,185,19,0)}
}
@keyframes hhclButton{
  0%,100%{background-position:0 0}
  50%{background-position:100% 0}
}

@media(max-width:700px){
  .hhcl-wrap{
    max-width:430px;
    margin:18px auto;
    padding:28px 18px;
    border-radius:22px;
  }
  .hhcl-ui-header{margin-bottom:20px}
  .hhcl-kicker{padding:8px 13px;font-size:10px}
  .hhcl-ui-header h2{font-size:33px!important;margin:15px auto 11px}
  .hhcl-ui-header p{font-size:15px;line-height:1.55}
  .hhcl-card{padding:18px;border-radius:18px}
  .hhcl-grid{grid-template-columns:1fr;gap:0}
  .hhcl-form textarea{min-height:135px}
  .hhcl-button{width:100%;min-width:0}
}
