/* Email list: the homepage box and the timed popup (Otis, 2026-10-05).
   Shared by both designs; each design's own tokens (--display, --body, --r,
   --olive, --olive-2) flow in. Lindsey's palette: cream, periwinkle, green and
   the dark green charcoal. No orange here at all.
   Contrast checked: olive #383D31 on paper #F1ECE0 ~9.6:1; cream on
   #2F3329 ~12:1; olive on soft periwinkle #A9BEE3 ~5.9:1. #6D90CA is used
   for rules and focus rings only, never for text. */

.nl-hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.nl-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.nl-form{margin:0}
.nl-row{display:flex;flex-wrap:wrap;gap:10px}
.nl-input{flex:1 1 220px;min-width:0;min-height:48px;margin:0;padding:0 16px;border:1px solid rgba(56,61,49,.38);border-radius:var(--r,6px);background:#FFFDF8;color:#2F3329;font:inherit;font-size:16px;line-height:1.2;box-shadow:none;-webkit-appearance:none;appearance:none}
.nl-input::placeholder{color:#6B705F;opacity:1}
.nl-input:focus{outline:2px solid #6D90CA;outline-offset:2px;border-color:#6D90CA}
.nl-btn{flex:0 0 auto;min-height:48px;min-width:44px;margin:0;padding:0 26px;border:0;border-radius:var(--r,6px);background:var(--olive,#383D31);color:var(--cream,#F9F6EE);font:inherit;font-size:15px;font-weight:600;letter-spacing:.02em;cursor:pointer;touch-action:manipulation}
.nl-btn:hover{background:var(--olive-2,#2F3329)}
.nl-btn:focus-visible{outline:2px solid #6D90CA;outline-offset:3px}
.nl-btn[disabled]{opacity:.6;cursor:progress}
.nl-msg{margin:10px 0 0;min-height:0;font-size:14.5px;line-height:1.45}
.nl-msg:empty{display:none}
.nl-msg.is-ok{color:#2F5A43}
.nl-msg.is-err{color:#8A2B2B}
.nl-form.is-done .nl-row{display:none}
.nl-form.is-done .nl-msg{margin-top:0;font-size:16px}

/* ---------------------------------------------------------------- the box */
.nl-box{padding:48px 0;padding:max(48px,min(7vw,88px)) 0;padding:clamp(48px,7vw,88px) 0}
.nl-box-in{position:relative;display:grid;gap:22px;max-width:1040px;margin:0 auto;padding:28px;padding:max(28px,min(5vw,48px));padding:clamp(28px,5vw,48px);background:var(--paper,#F1ECE0);border-radius:var(--r,6px);color:var(--olive,#383D31)}
.nl-box-in::before{content:"";position:absolute;left:28px;left:max(28px,min(5vw,48px));left:clamp(28px,5vw,48px);top:0;width:56px;height:3px;background:#6D90CA}
.nl-box-title{margin:0;font-family:var(--display,Georgia,serif);font-weight:500;font-size:26px;font-size:max(26px,min(3.4vw,36px));font-size:clamp(26px,3.4vw,36px);line-height:1.15;letter-spacing:-.01em;color:var(--olive-2,#2F3329);text-wrap:balance}
.nl-box-text{margin:10px 0 0;max-width:46ch;font-size:16.5px;line-height:1.55;color:var(--ink-2,#4B5042)}
.nl-box-note{margin:12px 0 0;font-size:13.5px;line-height:1.5;color:var(--muted,#666B57)}
@media (min-width:860px){
  .nl-box-in{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:48px}
}
/* lotus: its caps face on the button, square corners come from its --r */
.nl-box--lotus .nl-btn{font-family:var(--caps,inherit);font-weight:400;text-transform:uppercase;letter-spacing:.12em;font-size:14px}
.nl-box--lotus .nl-box-title{font-weight:400}

/* -------------------------------------------------------------- the popup */
html.nl-lock{overflow:hidden}
.nl-pop{position:fixed;top:0;right:0;bottom:0;left:0;inset:0;z-index:90;display:grid;place-items:center;padding:16px}
.nl-pop[hidden]{display:none}
.nl-pop-back{position:absolute;top:0;right:0;bottom:0;left:0;inset:0;background:rgba(24,27,20,.58)}
.nl-pop-card{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);width:100%;max-width:820px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:hidden;border-radius:var(--r,6px);background:var(--olive-2,#2F3329);color:var(--cream,#F9F6EE);box-shadow:0 24px 70px -20px rgba(0,0,0,.55);outline:none}
.nl-pop--nophoto .nl-pop-card{grid-template-columns:minmax(0,1fr);max-width:520px}
.nl-pop-photo{position:relative;min-height:100%;background:#4B5042}
.nl-pop-photo img{position:absolute;top:0;right:0;bottom:0;left:0;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.nl-pop-panel{padding:44px 40px 36px;overflow-y:auto;overscroll-behavior:contain;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px)}
.nl-pop-title{margin:0 40px 14px 0;font-family:var(--display,Georgia,serif);font-weight:500;font-size:25px;font-size:max(25px,min(3vw,31px));font-size:clamp(25px,3vw,31px);line-height:1.15;color:var(--cream,#F9F6EE);text-wrap:balance}
.nl-pop-text{margin:0 0 18px;font-size:16px;line-height:1.55;color:rgba(249,246,238,.9)}
.nl-pop-list{margin:0 0 18px;padding:14px 0 0;border-top:1px solid rgba(249,246,238,.18)}
.nl-pop-lt{margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#C9D6EE}
.nl-pop-list ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.nl-pop-list li{padding:5px 12px;border:1px solid rgba(169,190,227,.55);border-radius:999px;font-size:14.5px;line-height:1.3;color:var(--cream,#F9F6EE)}
.nl-pop-note{margin:0 0 16px;font-size:15px;line-height:1.5;color:rgba(249,246,238,.86)}
.nl-pop .nl-row{flex-direction:column}
.nl-pop .nl-input{flex:0 0 auto;width:100%;border-color:rgba(249,246,238,.35)}
.nl-pop .nl-input:focus{outline-color:#A9BEE3;border-color:#A9BEE3}
.nl-pop .nl-btn{width:100%;background:#A9BEE3;color:#2F3329}
.nl-pop .nl-btn:hover{background:#BDCDEA}
.nl-pop .nl-btn:focus-visible{outline-color:#F9F6EE}
.nl-pop .nl-msg.is-ok{color:#CFE3D6}
.nl-pop .nl-msg.is-err{color:#F3C9C4}
.nl-pop-x{position:absolute;top:8px;right:8px;z-index:2;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--cream,#F9F6EE);cursor:pointer}
.nl-pop-x:hover{background:rgba(249,246,238,.12)}
.nl-pop-x:focus-visible{outline:2px solid #A9BEE3;outline-offset:0}

@media (max-width:599px){
  .nl-pop{padding:12px;align-items:end}
  .nl-pop-card{display:flex;flex-direction:column;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}
  .nl-pop-photo{flex:0 0 auto;height:min(26vh,170px);height:min(26dvh,170px);min-height:0}
  .nl-pop-panel{flex:1 1 auto;min-height:0;max-height:none;padding:22px 20px 20px}
  .nl-pop-title{margin-right:0;font-size:23px}
  .nl-pop-text{margin-bottom:14px;font-size:15.5px}
  .nl-pop-list{margin-bottom:14px;padding-top:12px}
  .nl-pop-x{background:rgba(24,27,20,.55)}
  .nl-pop--nophoto .nl-pop-title{margin-right:40px}
}

@media (prefers-reduced-motion:no-preference){
  .nl-pop.is-in .nl-pop-back{animation:nl-fade .25s ease-out both}
  .nl-pop.is-in .nl-pop-card{animation:nl-rise .32s cubic-bezier(.2,.7,.2,1) both}
}
@keyframes nl-fade{from{opacity:0}to{opacity:1}}
@keyframes nl-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
