/* HoS24 - Newsletter — fluid, container-aware public layout */
.h24-nls-signup {
  --h24-ink: #082438;
  --h24-blue: #43ade2;
  --h24-sky: #7cd7fb;
  --h24-panel-pad: clamp(1.5rem, 3.4vw, 3rem);
  --h24-story-pad: clamp(1.5rem, 3.5vw, 3rem);
  position: relative;
  isolation: isolate;
  container-type: inline-size;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(21rem, .92fr);
  gap: clamp(.35rem, .8vw, .6rem);
  width: min(100%, 90rem);
  margin: clamp(1.1rem, 3vw, 2rem) auto;
  padding: clamp(.35rem, .8vw, .6rem);
  overflow: clip;
  border-radius: clamp(1.5rem, 3vw, 2.4rem);
  background: var(--h24-ink);
  box-shadow: 0 1.625rem 5rem rgba(8, 36, 56, .22);
  color: var(--h24-ink);
  font-family: Arial, Helvetica, sans-serif;
  font-synthesis: none;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
.h24-nls-signup *, .h24-nls-signup *::before, .h24-nls-signup *::after { box-sizing: border-box; }
.h24-nls-signup :where(h2, h3, p, span, strong, label, button, input) {
  font-family: inherit;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures;
  word-spacing: normal;
}
.h24-nls-signup__glow { position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.h24-nls-signup__glow--one { top: -9.375rem; left: -4.375rem; width: 19.375rem; height: 19.375rem; background: rgba(67, 173, 226, .32); filter: blur(5rem); }
.h24-nls-signup__glow--two { right: -7.2rem; bottom: -10rem; width: 23rem; height: 23rem; border: clamp(1.5rem, 3vw, 2.2rem) solid rgba(67, 173, 226, .26); }
.h24-nls-signup__story { position: relative; min-height: clamp(31rem, 43vw, 35rem); overflow: hidden; padding: var(--h24-story-pad); border-radius: clamp(1.15rem, 2.4vw, 1.8rem); background: #edfaff; }
.h24-nls-signup__story > img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: 65% center; }
.h24-nls-signup__story-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(247,253,255,.99) 0%, rgba(247,253,255,.92) 39%, rgba(247,253,255,.3) 74%, rgba(247,253,255,0) 100%); }
.h24-nls-signup__story-content { position: relative; z-index: 1; width: min(100%, 34rem); max-width: 64%; }
.h24-nls-kicker { margin: 0; color: #345e74; font-size: clamp(.56rem, .72vw, .65rem); font-weight: 800; letter-spacing: .12em; line-height: 1.3; text-transform: uppercase; white-space: normal; }
.h24-nls-signup__story .h24-nls-kicker { display: inline-block; padding: .5rem .75rem; border: 1px solid rgba(25,122,168,.18); border-radius: 999px; background: rgba(255,255,255,.72); box-shadow: 0 .2rem .55rem rgba(8,36,56,.08); }
.h24-nls-signup h2, .h24-nls-signup h3 { margin: clamp(1.75rem, 4.2vw, 2.15rem) 0 0; font-weight: 900; font-variant-ligatures: none; letter-spacing: -.055em; line-height: .84; text-align: left; text-transform: uppercase; text-wrap: balance; white-space: normal; overflow-wrap: normal; word-break: normal; hyphens: none; }
.h24-nls-signup h2 { max-width: 8.5ch; font-size: clamp(3.05rem, 7.3vw, 5.75rem); }
.h24-nls-intro { max-width: 28rem; margin: clamp(1.35rem, 2.4vw, 1.7rem) 0 0; color: #1c526d; font-size: clamp(.82rem, 1.25vw, .95rem); line-height: 1.65; text-wrap: pretty; }
.h24-nls-discount { display: inline-flex; align-items: center; gap: .8rem; margin-top: clamp(1.25rem, 2.4vw, 1.55rem); padding: .7rem .9rem; border-radius: .95rem; color: #fff; background: var(--h24-ink); box-shadow: 0 .75rem 1.6rem rgba(8,36,56,.2); }
.h24-nls-discount strong { color: var(--h24-sky); font-size: clamp(1.85rem, 3vw, 2.3rem); font-weight: 900; letter-spacing: -.065em; line-height: .9; }
.h24-nls-discount span { font-size: clamp(.55rem, .75vw, .63rem); font-weight: 800; letter-spacing: .095em; line-height: 1.45; text-transform: uppercase; }
.h24-nls-signup__form-panel { position: relative; min-width: 0; overflow: hidden; padding: var(--h24-panel-pad); border-radius: clamp(1.15rem, 2.4vw, 1.8rem); color: #fff; background: radial-gradient(circle at 105% -10%, rgba(67,173,226,.28), transparent 35%), #0d344b; }
.h24-nls-form-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.h24-nls-kicker--blue { color: var(--h24-sky); font-size: clamp(.73rem, .94vw, .85rem); }
.h24-nls-mail-icon { display: grid; flex: 0 0 auto; place-items: center; width: clamp(2.25rem, 3vw, 2.45rem); height: clamp(2.25rem, 3vw, 2.45rem); border: 1px solid rgba(255,255,255,.2); border-radius: 50%; color: var(--h24-sky); background: rgba(255,255,255,.06); font-size: 1rem; }
.h24-nls-signup h3 { max-width: none; color: #fff; font-size: clamp(1.2rem, 3.2cqw, 3.1rem); letter-spacing: -.045em; line-height: 1; white-space: nowrap; }
.h24-nls-signup h3 span { color: #fff; }
.h24-nls-signup h3 em { color: var(--h24-sky); font-style: normal; }
.h24-nls-signup__form-panel > p { max-width: 32rem; margin: clamp(1.2rem, 2.2vw, 1.4rem) 0 0; color: rgba(255,255,255,.74); font-size: clamp(1.04rem, 1.5vw, 1.17rem); line-height: 1.55; text-wrap: pretty; }
.h24-nls-offer { display: flex; align-items: center; gap: .8rem; margin-top: clamp(1.25rem, 2.4vw, 1.55rem); padding: .8rem .9rem; border: 1px solid rgba(255,255,255,.14); border-radius: .95rem; background: rgba(255,255,255,.1); backdrop-filter: blur(.5rem); }
.h24-nls-offer strong { flex: 0 0 auto; color: var(--h24-sky); font-size: clamp(1.85rem, 3vw, 2.3rem); font-weight: 900; letter-spacing: -.065em; line-height: .9; }
.h24-nls-offer span { color: rgba(255,255,255,.88); font-size: clamp(.68rem, .95vw, .75rem); font-weight: 700; line-height: 1.48; }
.h24-nls-offer small { color: rgba(255,255,255,.56); font-size: .92em; font-weight: 400; }
.h24-nls-form { margin-top: clamp(1.3rem, 2.4vw, 1.6rem); }
.h24-nls-form .h24-nls-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.h24-nls-form > label:not(.h24-nls-checkbox):not(.h24-nls-honeypot) { display: block; margin-bottom: .58rem; color: rgba(255,255,255,.74); font-size: clamp(.73rem, .94vw, .83rem); font-weight: 800; letter-spacing: .11em; line-height: 1.3; text-transform: uppercase; }
.h24-nls-form input[type=email] { display: block; width: 100%; min-width: 0; min-height: 3.9rem; padding: 1.04rem 1.17rem; border: 1px solid rgba(255,255,255,.2); border-radius: .91rem; outline: 0; color: #fff; background: rgba(255,255,255,.1); font-family: inherit; font-size: max(1.3rem, 1em); line-height: 1.25; transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.h24-nls-form input[type=email]::placeholder { color: rgba(255,255,255,.48); opacity: 1; }
.h24-nls-form input[type=email]:focus { border-color: var(--h24-sky); background: rgba(255,255,255,.16); box-shadow: 0 0 0 .25rem rgba(67,173,226,.16); }
.h24-nls-checkbox { display: flex; align-items: flex-start; gap: .55rem; margin-top: .85rem; color: rgba(255,255,255,.7); font-size: clamp(.845rem, 1.144vw, .91rem); line-height: 1.5; text-wrap: pretty; }
.h24-nls-checkbox input { flex: 0 0 .95rem; width: .95rem; height: .95rem; margin: .1rem 0 0; accent-color: var(--h24-blue); }
.h24-nls-form button { display: flex; align-items: center; justify-content: center; gap: .75rem; width: 100%; min-height: 3.125rem; margin-top: 1.15rem; padding: .8rem 1rem; border: 0; border-radius: .7rem; color: var(--h24-ink); background: var(--h24-sky); box-shadow: 0 .75rem 1.6rem rgba(67,173,226,.28); font-family: inherit; font-size: clamp(.64rem, .88vw, .72rem); font-weight: 900; letter-spacing: .1em; line-height: 1.1; text-transform: uppercase; cursor: pointer; transition: transform .16s ease, background .16s ease, box-shadow .16s ease; }
.h24-nls-form button:hover { background: #fff; box-shadow: 0 .9rem 1.75rem rgba(67,173,226,.34); transform: translateY(-.0625rem); }
.h24-nls-form button:active { transform: scale(.98); }
.h24-nls-form button:focus-visible { outline: .2rem solid #fff; outline-offset: .2rem; }
.h24-nls-form button:disabled { cursor: wait; opacity: .72; transform: none; }
.h24-nls-form-status { min-height: 1.25rem; margin: .75rem 0 0; color: #a1e6ff; font-size: clamp(.68rem, .9vw, .75rem); line-height: 1.5; }
.h24-nls-form-status.is-error { color: #ffb4bf; }
.h24-nls-legal { margin: .4rem 0 0; color: rgba(255,255,255,.5); font-size: clamp(.754rem, .936vw, .832rem); line-height: 1.55; text-wrap: pretty; }

/* The layout switches based on the actual shortcode width, not only the viewport. */
@container (max-width: 62rem) {
  .h24-nls-signup { grid-template-columns: 1fr; }
  .h24-nls-signup__story { min-height: clamp(29rem, 78vw, 33rem); }
  .h24-nls-signup__story-content { max-width: min(74%, 32rem); }
  .h24-nls-signup__form-panel { min-height: 0; }
}
@container (max-width: 36rem) {
  .h24-nls-signup { border-radius: 1.45rem; }
  .h24-nls-signup__story { min-height: 29rem; }
  .h24-nls-signup__story > img { object-position: 62% center; }
  .h24-nls-signup__story-overlay { background: linear-gradient(90deg, rgba(247,253,255,.99) 0%, rgba(247,253,255,.9) 47%, rgba(247,253,255,.32) 84%, rgba(247,253,255,.05) 100%); }
  .h24-nls-signup__story-content { max-width: 76%; }
  .h24-nls-signup h2 { max-width: 8.1ch; font-size: clamp(2.75rem, 15cqw, 4.25rem); letter-spacing: -.05em; }
	  .h24-nls-signup h3 { font-size: clamp(1.2rem, 5.6cqw, 2.6rem); letter-spacing: -.045em; }
  .h24-nls-intro { max-width: 16rem; }
  .h24-nls-discount, .h24-nls-offer { gap: .65rem; }
}
@container (max-width: 24rem) {
  .h24-nls-signup__story { min-height: 27rem; }
  .h24-nls-signup__story-content { max-width: 81%; }
  .h24-nls-signup h2 { font-size: clamp(2.35rem, 14.5cqw, 3.3rem); line-height: .88; }
	  .h24-nls-signup h3 { font-size: clamp(1.15rem, 5.2cqw, 2.15rem); line-height: 1; }
  .h24-nls-discount strong, .h24-nls-offer strong { font-size: 1.7rem; }
  .h24-nls-discount span, .h24-nls-offer span { font-size: .62rem; }
}

/* Fallback for older browsers without container queries. */
@media (max-width: 62rem) {
  .h24-nls-signup { grid-template-columns: 1fr; }
  .h24-nls-signup__story { min-height: clamp(29rem, 78vw, 33rem); }
  .h24-nls-signup__story-content { max-width: min(74%, 32rem); }
}
@media (max-width: 36rem) {
  .h24-nls-signup { width: 100%; margin-inline: 0; border-radius: 1.45rem; }
  .h24-nls-signup__story { min-height: 29rem; }
  .h24-nls-signup__story-content { max-width: 76%; }
  .h24-nls-signup h2 { max-width: 8.1ch; font-size: clamp(2.75rem, 15vw, 4.25rem); letter-spacing: -.05em; }
	  .h24-nls-signup h3 { font-size: clamp(1.2rem, 5.6vw, 2.6rem); letter-spacing: -.045em; }
}
@media (prefers-reduced-motion: reduce) {
  .h24-nls-signup *, .h24-nls-signup *::before, .h24-nls-signup *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}