/* The newsletter sign-up page (/signup/) - mock-up: the pitch and the form
   side by side on the warm band, the week's cover beside them, the latest
   three issues under them. The form itself is nuevoMailer's (styled by
   /app/forms/signup.js), unchanged. */
@font-face{font-family:sgn-script;src:url('/resources/fonts/chocolate-caliente-regular1.ttf') format('truetype');font-display:swap}
@font-face{font-family:sgn-helv;src:url('/resources/fonts/helvetica.ttf') format('truetype');font-display:swap}
@font-face{font-family:sgn-helvb;src:url('/resources/fonts/helvetica-bold.ttf') format('truetype');font-display:swap}
.sgn{color:#21282e}
.sgn a{color:inherit;text-decoration:none}
.sgn-k{font:400 10.5px/1.2 sgn-helv,Helvetica,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8a6d3b;margin:0}
/* the band */
.sgn-hero{background:#f6f2eb;padding:56px 24px 64px}
.sgn-in{max-width:1096px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;align-items:center}
.sgn-fig{width:200px;height:auto;margin:0 0 6px -6px}
.sgn-name{font:400 clamp(44px,4.7vw,58px)/1.15 "Playfair Display",Georgia,serif;margin:6px 0 0}
.sgn-line{font:400 24px/1.35 "Playfair Display",Georgia,serif;margin:8px 0 0;max-width:520px}
.sgn-pts{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px;max-width:520px}
.sgn-pts li{position:relative;padding-left:22px;font:400 15px/1.5 sgn-helv,Helvetica,Arial,sans-serif;color:#4a5056}
.sgn-pts li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;background:#8a6d3b}
.sgn-pts b{font-family:sgn-helvb,Helvetica,Arial,sans-serif;font-weight:400;color:#21282e}
.sgn-form{margin:30px 0 0;background:#fff;border-radius:6px;box-shadow:0 18px 44px rgba(33,40,46,.10);padding:8px 8px 0;max-width:560px}
.sgn-form iframe{display:block;width:100%;height:412px;border:0;overflow:hidden}
.sgn-cover{margin:0;justify-self:end;max-width:380px;width:100%}
.sgn-cover a{display:block}
.sgn-cover img{width:100%;height:auto;border-radius:3px;box-shadow:0 22px 50px rgba(20,22,25,.22)}
.sgn-cover .cma-hv{border-radius:3px;overflow:hidden;box-shadow:0 22px 50px rgba(20,22,25,.22)}
.sgn-cover .cma-hv img{box-shadow:none}
.sgn-cover figcaption{margin-top:18px;text-align:center}
.sgn-cover figcaption span{display:block;font:italic 500 19px/1.3 "Cormorant Garamond",Georgia,serif;color:#5d6268;margin-top:4px;letter-spacing:0;text-transform:none}
/* the latest issues */
.sgn-recent{max-width:1096px;margin:0 auto;padding:60px 24px 70px}
.sgn-h{text-align:center;margin:0 0 30px}
.sgn-h h2{font:400 34px/1.1 "Playfair Display",Georgia,serif;margin:8px 0 0}
.sgn-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.sgn-row img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:3px;background:#f1efeb;display:block}
.sgn-row .sgn-k{margin-top:12px}
.sgn-row .sgn-k span{color:#7b8187;letter-spacing:.02em;text-transform:none;font-size:12px}
.sgn-row h3{font:400 22px/1.22 "Playfair Display",Georgia,serif;margin:6px 0 0}
.sgn-row a:hover h3{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.sgn-row p{font:400 14px/1.5 sgn-helv,Helvetica,Arial,sans-serif;color:#5d6268;margin:6px 0 0}
/* the welcome and goodbye pages (after subscribing, after leaving) */
.nt-hero{text-align:center}
.nt-hero .sgn-in{display:block;max-width:820px}
.nt-hero .sgn-fig{margin:0 auto 6px}
.nt-hero .sgn-line{margin-left:auto;margin-right:auto;max-width:640px}
.nt-msg{font:400 30px/1.3 "Playfair Display",Georgia,serif;margin:22px auto 0;max-width:640px}
.nt-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:900px;margin:34px auto 0;text-align:left}
.nt-step{background:#fff;border-radius:6px;box-shadow:0 14px 36px rgba(33,40,46,.08);padding:24px 26px}
.nt-step h3{font:400 22px/1.25 "Playfair Display",Georgia,serif;margin:8px 0 0}
.nt-step p{font:400 15px/1.6 Georgia,serif;color:#4a5056;margin:8px 0 0}
.nt-step b{font-family:sgn-helvb,Helvetica,Arial,sans-serif;font-weight:400;color:#21282e}
.nt-share{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.nt-share a{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 14px;border:1px solid #cfcac2;border-radius:18px;font:400 11px/1 sgn-helv,Helvetica,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#21282e}
.nt-share a:hover{background:#f4f2ee}
.nt-go{display:inline-flex;align-items:center;gap:9px;margin-top:26px;padding:4px 0;color:#8a6d3b;font:400 11.5px/1 sgn-helv,Helvetica,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.nt-go::after{content:"";flex:none;width:28px;height:28px;border:1px solid #cfcac2;border-radius:50%;background:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27%3E%3Cpath d=%27M4.5 2.5 8 6l-3.5 3.5%27 fill=%27none%27 stroke=%27%2321282e%27 stroke-width=%271.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E") center/10px no-repeat}
.nt-go:hover{text-decoration:underline;text-underline-offset:3px}
.nt-go:hover::after{background-color:#f4f2ee}
@media (max-width:900px){.nt-msg{font-size:22px}.nt-steps{grid-template-columns:1fr}}
/* the footer's own "subscribe" band is the page itself here */
#cft .cft-nl,#cft .cft-div{display:none!important}
@media (max-width:900px){
  .sgn-hero{padding:34px 20px 44px}
  .sgn-in{grid-template-columns:1fr;gap:34px}
  .sgn-pitch{text-align:center;display:flex;flex-direction:column}
  .sgn-pitch .sgn-form{order:5}.sgn-pitch .sgn-pts{order:6;margin-top:28px}     /* on a phone the form comes straight after the name */
  .sgn-fig{width:150px;margin:0 auto 4px}
  .sgn-name{font-size:36px}
  .sgn-line{font-size:20px;margin-left:auto;margin-right:auto}
  .sgn-pts{text-align:left;margin-left:auto;margin-right:auto}
  .sgn-form{margin-left:auto;margin-right:auto}
  .sgn-cover{justify-self:center;max-width:260px}
  .sgn-recent{padding:44px 20px 50px}
  .sgn-row{grid-template-columns:1fr;gap:0;border-top:1px solid #eeeae4}
  .sgn-row a{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;align-items:start;padding:16px 0;border-bottom:1px solid #eeeae4}
  .sgn-row .sgn-k{margin-top:1px}
  .sgn-row h3{font-size:18px;line-height:1.2;margin-top:5px}
  .sgn-row p{display:none}
}
