/* Tiho Letters signup · uses the landing tokens (landing.css) with fallbacks. */
.newsletter-wrap { padding-block: clamp(24px, 4vw, 48px) clamp(64px, 8vw, 112px); }
.newsletter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); align-items: center; padding: clamp(24px, 4vw, 48px); border-radius: var(--r-sheet, 22px); background: var(--paper-2, #d0d9d6); color: var(--ink, #1b2925); }
.newsletter h2 { font: 500 clamp(28px, 3vw, 38px)/1.1 var(--serif, Georgia, serif); letter-spacing: -0.02em; margin: 0 0 14px; }
.newsletter p { color: var(--ink-2, #4b5f5a); font-size: 16px; line-height: 1.55; max-width: 30em; margin: 0; }
.newsletter .newsletter-offer { display: flex; align-items: center; gap: 20px; margin: 22px 0 26px; }
.newsletter-offer > span { font: 500 clamp(64px, 8vw, 104px)/0.9 var(--serif, Georgia, serif); letter-spacing: -0.04em; color: var(--ink, #1b2925); white-space: nowrap; }
.newsletter .newsletter-offer p { font-size: 17px; line-height: 1.4; color: var(--ink, #1b2925); }
.newsletter form { background: var(--card-hi, #f2f7f4); border: 1px solid var(--line-2, rgba(27, 41, 37, 0.08)); border-radius: var(--r-card, 16px); padding: clamp(20px, 3vw, 28px); display: grid; gap: 14px; }
.newsletter label[for="newsletter-email"] { font: 500 12px/1.3 var(--mono, monospace); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-2, #4b5f5a); }
.newsletter input[type="email"] { width: 100%; min-height: 48px; border: 1px solid var(--line, rgba(27, 41, 37, 0.15)); border-radius: var(--r-field, 10px); background: var(--paper, #dae2df); padding: 12px 14px; font: 16px var(--sans, system-ui); color: var(--ink, #1b2925); }
.newsletter input[type="email"]::placeholder { color: var(--ink-2, #4b5f5a); opacity: 0.7; }
.newsletter .newsletter-consent { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; color: var(--ink-2, #4b5f5a); }
.newsletter input[type="checkbox"] { margin-top: 3px; width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--ink, #1b2925); }
.newsletter button { min-height: 52px; width: 100%; border: 0; border-radius: var(--r-button, 14px); background: var(--ink, #1b2925); color: var(--paper, #dae2df); font: 500 17px var(--sans, system-ui); cursor: pointer; }
.newsletter button:disabled { opacity: 0.5; cursor: default; }
.newsletter a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.newsletter small { display: block; font-size: 13px; line-height: 1.55; color: var(--ink-2, #4b5f5a); }
.newsletter #newsletter-status { font-size: 14px; color: var(--ink, #1b2925); }
.newsletter #newsletter-status:empty { display: none; }
.newsletter input:focus-visible, .newsletter button:focus-visible { outline: 2px solid var(--ink, #1b2925); outline-offset: 3px; }
@media (max-width: 800px) { .newsletter { grid-template-columns: 1fr; } }
@media (max-width: 400px) { .newsletter .newsletter-offer { flex-wrap: wrap; gap: 8px; } }