/* Custom pieces on top of Tailwind (CDN). Light editorial look modeled on ownyourshade.org:
   Fraunces display serif + Instrument Sans body, light editorial backgrounds,
   dot-grid + thin ring texture, fully-rounded bold pill buttons, small badge pills. */
:root{--teal-950:#082629;--gold-400:#e2b230}
html{scroll-padding-top:96px}

/* editorial texture: dot grid on a light ground */
.texture{background-color:#faf9f6;background-image:radial-gradient(rgba(8,38,41,.14) 1px,transparent 1px);background-size:24px 24px}
.texture-dark{background-image:radial-gradient(rgba(255,255,255,.12) 1px,transparent 1px);background-size:24px 24px}
.rings{position:absolute;inset:0;color:#0826291a;pointer-events:none;overflow:hidden}
.rings svg{width:100%;height:100%}
.gold-text{background:linear-gradient(120deg,#eecb5a,#c99a1f 60%);-webkit-background-clip:text;background-clip:text;color:transparent}

.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.72rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#a67a17}
.eyebrow::before{content:"";width:26px;height:1.5px;background:currentColor}
.eyebrow-dark{color:#a67a17}

/* small pill badge, e.g. the reference site's live pledge-count chip */
.badge{display:inline-flex;align-items:center;gap:8px;padding:.55rem 1.1rem;border-radius:999px;background:#fff;border:1px solid rgba(8,38,41,.12);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#123a3e;box-shadow:0 6px 18px rgba(8,38,41,.05)}
.dot{width:7px;height:7px;border-radius:50%;background:#c1121c;box-shadow:0 0 0 4px rgba(193,18,28,.18)}

/* pill buttons: bold, uppercase, letter-spaced — matches reference CTA styling */
.btn-gold,.btn-line,.btn-line-dark,.btn-teal{display:inline-flex;align-items:center;gap:8px;padding:1rem 2rem;border-radius:999px;font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;transition:all .25s;border:1.5px solid transparent;white-space:nowrap}
.btn-gold{background:#e2b230;color:#082629}
.btn-gold:hover{background:#eecb5a;transform:translateY(-2px)}
.btn-line{border-color:rgba(255,255,255,.5);color:#fff}
.btn-line:hover{background:#fff;color:#123a3e}
.btn-line-dark{border-color:rgba(8,38,41,.25);color:#123a3e}
.btn-line-dark:hover{background:#123a3e;color:#fff;border-color:#123a3e}
.btn-teal{background:#123a3e;color:#fff}
.btn-teal:hover{background:#1e6b6f;transform:translateY(-2px)}

.nlink{position:relative;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#123a3e;padding:.25rem 0;opacity:.7;transition:.2s}
.nlink:hover{opacity:1}
.nlink.active{opacity:1;color:#a67a17}
.nlink.active::after{content:"";position:absolute;left:50%;bottom:-10px;width:4px;height:4px;border-radius:50%;background:#e2b230;transform:translateX(-50%)}

.lbl{display:grid;gap:.4rem;font-size:.85rem;font-weight:600;color:#123a3e}
.field{font:inherit;font-weight:400;padding:.85rem 1rem;border-radius:.85rem;border:1.5px solid #dcefee;background:#f1f9f8;color:#082629;transition:.2s;width:100%}
.field:focus{outline:none;border-color:#e2b230;background:#fff;box-shadow:0 0 0 4px rgba(226,178,48,.18)}

/* WhatsApp join button (WhatsApp green so it's instantly recognisable) */
.btn-whatsapp{display:inline-flex;align-items:center;gap:10px;padding:1.2rem 1.25rem;border-radius:999px;font-weight:800;font-size:.86rem;letter-spacing:.05em;text-align:center;text-transform:uppercase;background:#25d366;color:#04280f;box-shadow:0 12px 28px rgba(37,211,102,.45);transition:all .25s}
.btn-whatsapp:hover{background:#1ebe5a;transform:translateY(-2px);box-shadow:0 16px 34px rgba(37,211,102,.55)}

/* radio option cards (webinar consent question) */
.radio{display:flex;align-items:center;gap:.7rem;padding:.75rem 1rem;border:1.5px solid #dcefee;border-radius:.85rem;background:#f1f9f8;color:#123a3e;font-size:.9rem;cursor:pointer;transition:.2s}
.radio:hover{border-color:#e2b230}
.radio:has(input:checked){border-color:#e2b230;background:#fff;box-shadow:0 0 0 4px rgba(226,178,48,.15)}
.radio input{flex:none;width:1.1rem;height:1.1rem;accent-color:#c99a1f}

@keyframes marquee{to{transform:translateX(-25%)}}
.marquee{animation:marquee 28s linear infinite}
@media(prefers-reduced-motion:reduce){.marquee{animation:none}}

/* webinar countdown + form feedback */
.cdbox{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:68px;height:68px;border-radius:1rem;background:#082629;color:#fff;flex:none}
.cdbox b{font-family:Fraunces,Georgia,serif;font-size:1.4rem;line-height:1}
.cdbox span{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#e2b230}
.webinar-msg{font-size:.85rem;font-weight:600;border-radius:.75rem;padding:.7rem 1rem}
.webinar-msg.ok{background:#f1f9f8;color:#1a5659}
.webinar-msg.err{background:#fdf2f2;color:#b3261e}