/* ---------- Launch offer card (10% off the first order) ---------- */
.offer-card {
  container-type: inline-size;
  width: 100%;
  max-width: 60rem;
  margin: 3.5rem auto 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  scroll-margin-top: 6.5rem;
}
.oc-inner { display: grid; grid-template-columns: 1.2fr 1fr; }
.oc-left { display: flex; flex-direction: column; justify-content: center; padding: clamp(1.75rem, 5cqi, 3.5rem); }
.oc-logo { display: none; } /* the page already carries the logo */
.prose .offer-card p { margin: 0; }
.offer-card .oc-eyebrow { margin: 0; font: 500 .78rem var(--sans); letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.offer-card .oc-title {
  margin: .8rem 0 .9rem; padding: 0; border: 0;
  font: 500 clamp(1.8rem, 4.2cqi, 2.7rem)/1.06 var(--sans);
  letter-spacing: -.035em; color: var(--ink);
}
.prose .offer-card .oc-text, .offer-card .oc-text { max-width: 30ch; margin: 0 0 1.5rem; font: 400 clamp(.98rem, 1.5cqi, 1.05rem)/1.6 var(--sans); color: var(--text); }
.nf-hp { display: none; }
.nf-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.offer-card .nf { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; max-width: 30rem; }
.oc-field {
  display: flex; align-items: center; gap: .7rem;
  min-height: 52px; padding: 0 1rem;
  border: 1px solid rgba(30, 27, 32, .2); border-radius: 6px; background: #fff;
  transition: border-color .2s, box-shadow .2s;
}
.oc-field:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 0, 201, .12); }
.oc-field svg { width: 19px; height: auto; flex: none; fill: none; stroke: var(--muted); stroke-width: 1.5; stroke-linejoin: round; }
.oc-field input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; padding: .9rem 0; font: 400 .98rem var(--sans); color: var(--ink); }
.oc-field input::placeholder { color: #8E8C90; }
.offer-card .nf-btn {
  min-height: 52px;
  display: flex; align-items: center; justify-content: center; gap: .55rem;
  padding: 0 1.35rem; border: 0; border-radius: 6px; cursor: pointer;
  background: var(--blue); color: #fff;
  font: 500 .95rem var(--sans); letter-spacing: 0; text-transform: none; white-space: nowrap;
  transition: background .2s;
}
.offer-card .nf-btn svg { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.offer-card .nf-btn:hover { background: var(--navy); }
.offer-card .nf-btn:hover svg { transform: translateX(3px); }
.offer-card .nf-btn:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.offer-card .nf-btn[disabled] { opacity: .6; cursor: wait; }
.prose .offer-card .nf-note, .offer-card .nf-note { grid-column: 1 / -1; margin: .35rem 0 0; font: 400 .82rem/1.5 var(--sans); color: var(--muted); }
.offer-card .nf-note.ok { color: var(--navy); }
.offer-card .nf-note.err { color: #a33a3a; }
.offer-card .nf-note a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* right panel: gradient is colour-matched to the offer-panel artwork */
.oc-right { position: relative; aspect-ratio: 800 / 931; background: linear-gradient(165deg, #d0e2f8 0%, #d6e4f8 60%, #e0e0f6 100%); }
.oc-right picture, .oc-right img { position: absolute; inset: 0; width: 100%; height: 100%; }
.oc-right img { object-fit: cover; object-position: 50% 45%; }

@container (min-width: 1100px) {
  .oc-inner { grid-template-columns: 1.9fr 1fr; }
}
@container (max-width: 860px) {
  .offer-card .nf { grid-template-columns: 1fr; }
}
@container (max-width: 680px) {
  .oc-inner { grid-template-columns: 1fr; }
  .oc-right { order: -1; height: 280px; aspect-ratio: auto; background: linear-gradient(90deg, rgb(206,225,243) 0%, rgb(214,227,245) 50%, rgb(222,226,245) 100%); }
  .oc-right img { object-fit: contain; object-position: 50% 100%; padding-top: 10px; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 90%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 90%, transparent 100%); }
  .offer-card .oc-text { max-width: none; }
  .offer-card .nf { max-width: none; }
}

/* Master launch signup styling. */
.article-signup{max-width:calc(72rem + 2 * var(--gutter));margin:clamp(2.5rem,5vw,4.5rem) auto;padding-bottom:clamp(3rem,6vw,5rem)}
.offer-card.launch-offer{border:1px solid #dce0f3;border-radius:28px;background:#f0f3ff;box-shadow:0 16px 50px #10104f08;overflow:hidden}
.offer-card.launch-offer .oc-inner{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.offer-card.launch-offer .oc-left{padding:clamp(1.5rem,4.3cqi,3.25rem);min-width:0}
.offer-card.launch-offer .oc-eyebrow{display:flex;align-items:center;gap:.6rem;font-size:.68rem;letter-spacing:.1em;color:var(--navy);line-height:1.5}
.offer-card.launch-offer .oc-eyebrow>span{width:7px;height:7px;border-radius:50%;background:var(--blue);flex:none}
.offer-card.launch-offer .oc-title{margin:1.2rem 0 1rem;font:500 clamp(2rem,4.4cqi,3.5rem)/1.06 var(--sans);letter-spacing:-.045em;color:var(--navy)}
.offer-card.launch-offer .oc-text{max-width:35ch;margin-bottom:1.25rem;font-size:1rem;color:var(--text);line-height:1.65}
.offer-card.launch-offer .oc-text strong{font-weight:500;color:var(--navy)}
.launch-offer-benefits{list-style:none;display:grid;gap:.65rem;margin:0 0 1.75rem;padding:0;font:400 .88rem/1.5 var(--sans);color:var(--navy)}
.launch-offer-benefits li{display:flex;gap:.65rem;align-items:start}
.launch-offer-benefits li>span{display:grid;place-items:center;width:20px;height:20px;flex:none;border-radius:50%;background:#e0e6ff;color:var(--blue);font-size:.7rem}
.launch-offer-form{padding-top:1.5rem;border-top:1px solid #d8def2}
.launch-offer-label{margin:0 0 .75rem;font:500 .85rem/1.4 var(--sans);color:var(--navy)}
.offer-card.launch-offer .nf{grid-template-columns:minmax(0,1fr) auto;max-width:none;gap:.65rem}
.offer-card.launch-offer .oc-field{border-color:#d8def2;border-radius:12px;min-height:52px;gap:.6rem;padding:0 .85rem}
.offer-card.launch-offer .oc-field input{font-size:16px}
.offer-card.launch-offer .nf-btn{min-height:52px;background:var(--blue);border-radius:12px;padding:0 1rem;font-size:.88rem}
.offer-card.launch-offer .nf-btn:hover{background:var(--navy)}
.offer-card.launch-offer .nf-note{font-size:.73rem;line-height:1.6;margin-top:.4rem;color:var(--muted)}
.offer-card.launch-offer .nf-btn:focus-visible,.offer-card.launch-offer .oc-field:focus-within{outline:3px solid var(--blue);outline-offset:3px}
.launch-offer-foot{margin:1.5rem 0 0;font:400 .72rem/1.5 var(--sans);color:var(--muted)}
.offer-card.launch-offer .oc-right{align-self:stretch;aspect-ratio:auto;min-height:580px;background:#e4ebf8;isolation:isolate}
.offer-card.launch-offer .oc-right img{object-fit:cover;object-position:50% 40%;padding:0;mask-image:none;-webkit-mask-image:none}
.offer-card.launch-offer .oc-right::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#10104f00 50%,#10104f99)}
.launch-offer-stamp{position:absolute;z-index:2;top:1.4rem;right:1.4rem;display:flex;flex-direction:column;align-items:center;justify-content:center;width:130px;height:130px;border-radius:50%;border:1px solid #dde3fa;background:#f8faff;box-shadow:0 5px 24px #10104f12;transform:rotate(8deg);color:var(--blue)}
.launch-offer-stamp>span{font:500 .48rem/1.5 var(--sans);letter-spacing:.09em}
.launch-offer-stamp strong{font:500 3.3rem/1.1 var(--sans);letter-spacing:-.065em}
.launch-offer-stamp small{font-size:1.65rem;vertical-align:top;display:inline-block;margin-top:.3rem}
.launch-offer-image-note{position:absolute;z-index:2;bottom:2rem;left:2rem;margin:0;font:400 1.65rem/1.2 var(--sans);letter-spacing:-.025em;color:#fff;text-shadow:0 1px 12px #0002}
.launch-offer-image-note em{font-style:normal;opacity:.85}
@media(min-width:701px) and (max-width:1050px){.offer-card.launch-offer .nf{grid-template-columns:1fr}.offer-card.launch-offer .nf-btn{justify-content:space-between}.offer-card.launch-offer .oc-right{min-height:620px}.launch-offer-stamp{width:108px;height:108px}.launch-offer-stamp strong{font-size:2.7rem}}
@media(max-width:700px){
 .offer-card.launch-offer{border-radius:22px}
 .offer-card.launch-offer .oc-inner{grid-template-columns:1fr}
 .offer-card.launch-offer .oc-right{order:-1;height:280px;min-height:0;aspect-ratio:auto}
 .offer-card.launch-offer .oc-right img{object-fit:cover;object-position:50% 38%}
 .offer-card.launch-offer .oc-left{padding:1.5rem}
 .offer-card.launch-offer .oc-title{font-size:clamp(2rem,8vw,2.8rem);margin:1rem 0}
 .offer-card.launch-offer .oc-title br{display:none}
 .offer-card.launch-offer .oc-text{max-width:none;font-size:.96rem}
 .launch-offer-stamp{width:104px;height:104px;top:1rem;right:1rem}
 .launch-offer-stamp strong{font-size:2.6rem}
 .launch-offer-stamp small{font-size:1.3rem}
 .launch-offer-stamp>span{font-size:.4rem}
 .launch-offer-image-note{left:1.5rem;bottom:1.25rem;font-size:1.4rem}
 .offer-card.launch-offer .nf{grid-template-columns:1fr}
 .offer-card.launch-offer .nf-btn{justify-content:space-between;padding:0 1rem}
 .launch-offer-benefits{font-size:.82rem;margin-bottom:1.4rem}
 .launch-offer-foot{margin-top:1.1rem}
}
@media(prefers-reduced-motion:reduce){.offer-card.launch-offer *{transition:none!important}}

.home-launch-signup{max-width:calc(72rem + 2 * var(--gutter));margin:0 auto;padding:clamp(3rem,6vw,5rem) var(--gutter)}
.home-launch-signup .offer-card{max-width:none;margin:0}
.offer-card.launch-offer p{padding:0}
