/* The Welm letter, on the footer surface of every page (the homepage version). body[data-page] keeps these above the
   page styles; the ids beat styles.css, which styles the older light card by id. */
body[data-page] .newsletter.newsletter-editorial{
  --letter-surface:#3a1317;
  --letter-ink:#f2ede6;
  --letter-muted:#d2bcb4;
  --letter-line:#a1837d;
  --letter-button:#f2ede6;
  --letter-button-ink:#47181c;
  padding:60px var(--gutter) 0;
  background:var(--letter-surface);
  color:var(--letter-ink);
  text-align:left;
  scroll-margin-top:90px;
}
body[data-page] .newsletter-editorial .newsletter-inner{
  max-width:1280px;
  margin:0 auto;
  padding:0 0 40px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,1fr);
  align-items:start;
  gap:clamp(32px,6vw,88px);
  border:0;
  border-bottom:1px solid rgb(242 237 230 / 18%);
  border-radius:0;
  background:none;
  color:inherit;
}
body[data-page] .newsletter-editorial h2{
  margin:0;
  color:var(--letter-ink);
  font:500 clamp(38px,3.6vw,52px)/1.12 var(--display);
  letter-spacing:-.025em;
}
body[data-page] .newsletter-editorial .newsletter-copy p{
  max-width:36ch;
  margin:14px 0 0;
  color:var(--letter-muted);
  font:400 17px/1.6 var(--body);
}
body[data-page] .newsletter-editorial form{min-width:0;width:100%;max-width:none;margin:4px 0 0;text-align:left}
.newsletter-editorial .newsletter-label{display:block;margin:0 0 9px;color:var(--letter-muted);font:500 13px/1.4 var(--body)}
body[data-page] .newsletter-editorial .newsletter-control:focus-within{outline:none}
body[data-page] .newsletter-editorial .newsletter-control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:14px;background:none;padding:0;border:0;border-radius:0;outline:none}
body[data-page] .newsletter-editorial .newsletter-control input{width:100%;min-width:0;min-height:54px;padding:12px 0;border:0;border-bottom:1px solid var(--letter-line);border-radius:0;background:transparent;color:var(--letter-ink);caret-color:var(--letter-ink);font:400 16px/1.4 var(--body);box-shadow:none}
body[data-page] .newsletter-editorial .newsletter-control input::placeholder{color:var(--letter-muted);opacity:1}
body[data-page] .newsletter-editorial .newsletter-control input:focus-visible{outline:2px solid var(--letter-ink);outline-offset:4px}
body[data-page] .newsletter-editorial .newsletter-control .button{min-height:54px;min-width:122px;padding:13px 23px;border:1px solid var(--letter-button);border-radius:12px;background:var(--letter-button);color:var(--letter-button-ink);font:500 15px/1.4 var(--body);white-space:nowrap;box-shadow:none;transition:opacity 150ms ease}
.newsletter-editorial .button:hover{opacity:.88}
.newsletter-editorial .button:focus-visible,.newsletter-editorial a:focus-visible{outline:2px solid var(--letter-ink);outline-offset:4px;transition:none}
/* The homepage card styles its consent link by id (wine); keep the ring visible on this surface. */
body[data-page] .newsletter-editorial #newsletter-consent a:focus-visible{outline-color:var(--letter-ink)}
body[data-page] .newsletter-editorial #newsletter-consent{max-width:62ch;margin:14px 0 0;color:var(--letter-muted);font:400 12px/1.6 var(--body)}
body[data-page] .newsletter-editorial #newsletter-consent a{color:var(--letter-ink);text-decoration:underline;text-underline-offset:3px}
body[data-page] .newsletter-editorial #newsletter-status{margin:12px 0 0;padding:0;background:none;border:0;border-radius:0;color:var(--letter-ink);font:400 14px/1.5 var(--body)}
body[data-page] .newsletter-editorial + .welmc-footer{padding-top:36px}
/* Alternate directions are isolated to the local design comparison. */
body[data-page] .newsletter-editorial.newsletter-paper{--letter-surface:#f2ede6;--letter-ink:#47181c;--letter-muted:#705650;--letter-line:#977a72;--letter-button:#47181c;--letter-button-ink:#f2ede6;padding-bottom:52px}
body[data-page] .newsletter-paper .newsletter-inner{max-width:620px;grid-template-columns:1fr;gap:28px;padding:0;border:0;text-align:center}
body[data-page] .newsletter-paper .newsletter-copy p{max-width:42ch;margin-left:auto;margin-right:auto}
body[data-page] .newsletter-editorial.newsletter-compact{padding-top:36px}
body[data-page] .newsletter-compact .newsletter-inner{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:48px;padding-bottom:32px;align-items:center}
body[data-page] .newsletter-compact h2{font-size:36px}
body[data-page] .newsletter-compact .newsletter-copy p{font-size:15px;margin-top:10px;max-width:35ch}
body[data-page] .newsletter-compact .newsletter-control input{border:1px solid var(--letter-line);border-radius:12px;padding:12px 16px}
@media(max-width:900px){
  body[data-page] .newsletter-editorial .newsletter-inner,body[data-page] .newsletter-compact .newsletter-inner{grid-template-columns:1fr;gap:28px}
  body[data-page] .newsletter-editorial .newsletter-copy p{max-width:46ch}
  body[data-page] .newsletter-editorial form{max-width:620px;margin:0}
}
@media(max-width:600px){
  body[data-page] .newsletter.newsletter-editorial{padding-top:42px}
  body[data-page] .newsletter-editorial .newsletter-inner{padding-bottom:32px;gap:26px}
  body[data-page] .newsletter-editorial h2{font-size:36px;letter-spacing:-.02em}
  body[data-page] .newsletter-editorial .newsletter-copy p{font-size:16px;margin-top:12px;max-width:34ch}
  body[data-page] .newsletter-editorial .newsletter-control{gap:12px}
  body[data-page] .newsletter-editorial .newsletter-control .button{min-width:106px;padding:13px 17px;font-size:14px}
  body[data-page] .newsletter-paper .newsletter-inner{padding-bottom:0}
  body[data-page] .newsletter-editorial.newsletter-paper{padding-bottom:42px}
  body[data-page] .newsletter-compact h2{font-size:32px}
}
@media(max-width:360px){body[data-page] .newsletter-editorial .newsletter-control{grid-template-columns:1fr;gap:12px}}
@media(prefers-reduced-motion:reduce){.newsletter-editorial .button{transition:none}}