/* ============================================================================
   NEWSLETTER SIGNUP, 2026-09-25.

   Same ink, gold and serif as New Arrivals and the world rail, so the letter
   reads as part of Omega World rather than a banner bolted onto it. It borrows
   the --ow-* tokens where they exist and falls back to the same values, so this
   file also works on pages that do not load the world stylesheet.
   ========================================================================= */

.nsub{
 --ns-gold:var(--ow-gold,#F4C45D);
 --ns-gold2:var(--ow-gold2,#FFE7A2);
 --ns-gold-deep:var(--ow-gold-deep,#7B4B09);
 --ns-muted:var(--ow-muted,#B9C7E6);
 --ns-serif:var(--ow-serif,Georgia,"Playfair Display",serif);
 --ns-body:var(--ow-body,Inter,"Segoe UI",Arial,sans-serif);
 display:block;margin:18px 0;min-width:0;
}

.nsub-card{
 padding:22px 20px 20px;border-radius:20px;
 background:linear-gradient(180deg,rgba(9,22,54,.96),rgba(2,7,24,.96));
 border:1px solid rgba(244,196,93,.32);
 box-shadow:0 24px 70px rgba(0,0,0,.45);
}

.nsub-eyebrow{
 margin:0 0 6px;font:700 11px/1.2 var(--ns-body);
 letter-spacing:.18em;text-transform:uppercase;color:var(--ns-gold);
}
.nsub-title{
 margin:0 0 8px;font:700 clamp(20px,3.4vw,27px)/1.15 var(--ns-serif);
 color:var(--ns-gold2);text-wrap:balance;
}
.nsub-copy{
 margin:0 0 16px;font:400 15px/1.6 var(--ns-body);color:var(--ns-muted);
 max-width:56ch;
}

.nsub-label{
 display:block;margin:0 0 6px;font:700 10.5px/1.2 var(--ns-body);
 letter-spacing:.14em;text-transform:uppercase;color:var(--ns-muted);
}

.nsub-row{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch}

.nsub-input{
 flex:1 1 260px;min-width:0;
 padding:13px 14px;border-radius:12px;
 border:1px solid rgba(244,196,93,.34);
 background:rgba(2,7,24,.7);color:#F4F7FF;
 font:400 15px/1.3 var(--ns-body);
}
.nsub-input::placeholder{color:rgba(185,199,230,.6)}
.nsub-input:focus{
 outline:none;border-color:var(--ns-gold);
 box-shadow:0 0 0 4px rgba(244,196,93,.18);
}

.nsub-btn{
 flex:0 0 auto;padding:13px 24px;border-radius:999px;cursor:pointer;
 border:1px solid var(--ns-gold);
 background:linear-gradient(135deg,#FFE7A2 0%,#F4C45D 45%,#C8921F 100%);
 color:#241503;font:700 14px/1 var(--ns-serif);letter-spacing:.02em;
}
.nsub-btn:hover:enabled{background:linear-gradient(135deg,#FFF2C8 0%,#FFD97A 45%,#D9A32C 100%)}
.nsub-btn:disabled{opacity:.55;cursor:default}
.nsub-btn:focus-visible{outline:3px solid var(--ns-gold2);outline-offset:2px}

.nsub-note{
 margin:10px 0 0;font:400 12.5px/1.55 var(--ns-body);
 color:var(--ns-muted);opacity:.85;max-width:60ch;
}

.nsub-status{
 margin:10px 0 0;font:400 13.5px/1.5 var(--ns-body);color:var(--ns-gold2);
}
.nsub-status.bad{color:#FFB4A2}

.nsub-done{
 margin:0;font:700 19px/1.3 var(--ns-serif);color:var(--ns-gold2);
}

/* The compact form, for a footer or a sidebar: same promise, less room. */
.nsub-compact .nsub-card{padding:16px 16px 14px;border-radius:16px}
.nsub-compact .nsub-title{font-size:clamp(17px,2.6vw,20px)}
.nsub-compact .nsub-copy{margin-bottom:12px;font-size:14px}

@media (max-width:520px){
 .nsub-btn{flex:1 1 100%}
}

@media (prefers-reduced-motion:no-preference){
 .nsub-btn{transition:background .16s ease}
}

/* When the script had to make its own spot at the foot of a page, give it the
   margins a page-level section would have had. */
.nsub-auto{max-width:1100px;margin:28px auto 34px;padding:0 16px}
