/* Signup typography and spacing follow brand/BRAND-GUIDELINES-v0.1.txt. */
.sin:has(.signup-options){max-height:calc(100dvh - 48px);overflow-y:auto;padding:40px 44px 36px;background:#FBFAF7}
.sin:has(.signup-options) .eyebrow{margin-bottom:16px;font:500 13px/1.5 "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:#1F4D3A}
.sin:has(.signup-options) h2{margin:0 0 22px;font:400 42px/1.06 "Newsreader",Georgia,serif;letter-spacing:-.017em;color:#14161A}
.signup-options>p{margin:0;font:400 17.5px/1.52 "Newsreader",Georgia,serif;color:rgba(20,22,26,.76);text-wrap:pretty}
.signup-plan-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin:28px 0 32px}
.signup-plan-grid button{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-width:0;text-align:left;border:1px solid rgba(20,22,26,.13);background:#FBFAF7;padding:24px;color:rgba(20,22,26,.76);font:400 17.5px/1.52 "Newsreader",Georgia,serif;cursor:pointer}
.signup-plan-grid button[aria-pressed=true]{border:2px solid #1F4D3A;background:#F3F0E8;padding:23px}
.signup-plan-grid button:focus-visible{outline:2px solid #1F4D3A;outline-offset:4px}
.signup-plan-grid strong{font:400 22px/1.25 "Newsreader",Georgia,serif;color:#1F4D3A}
.signup-plan-grid h3{font:400 30px/1.15 "Newsreader",Georgia,serif;color:#14161A;margin:14px 0 18px}
.signup-plan-grid small{font:400 11px/1.5 "IBM Plex Mono",monospace;color:#8C857A}
.signup-plan-grid p{margin:0;font:400 17.5px/1.52 "Newsreader",Georgia,serif;color:rgba(20,22,26,.76)}
.signup-options .signup-plan-grid ul{display:block;list-style:disc;margin:18px 0 0;padding:0 0 0 18px}
.signup-options .signup-plan-grid li{display:list-item;grid-template-columns:none;width:auto;min-width:0;padding:0;border:0;margin:0;font:400 17.5px/1.52 "Newsreader",Georgia,serif;color:rgba(20,22,26,.76)}
.signup-options .signup-plan-grid li+li{margin-top:10px}
.signup-options .signup-plan-grid li:last-child{border:0}
.sin:has(.signup-options) .gbtn{display:flex;justify-content:center;margin:0 0 22px!important;width:100%;max-width:100%}
.sin:has(.signup-options) .consent{margin:0!important;text-align:center;font:400 11px/1.7 "IBM Plex Mono",monospace;color:#8C857A}
@media(max-width:600px){.signup-plan-grid{grid-template-columns:1fr;gap:16px}.sin:has(.signup-options) h2{font-size:32px!important}.sin:has(.signup-options){padding:28px 22px 24px}}

/* One line per bullet on a desktop only. Below 900px a nowrap bullet is
   wider than the phone, and a grid item's min-width follows its content,
   so BOTH cards grew past the screen (Robert, 2026-09-23). */
@media(min-width:901px){.signup-options .single-report-benefits li{white-space:nowrap}}
.signup-options .signup-plan-grid>*{min-width:0}
.signup-options .signup-plan-grid h3+.single-report-benefits{margin-top:0}
@media(max-width:900px){.signup-plan-grid{grid-template-columns:1fr}}

.sin:has(.signup-options) .signup-action-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:center;margin-bottom:24px}
.sin:has(.signup-options) .signup-action-row .gbtn{margin:0!important;justify-content:flex-start;min-width:0}
.signup-youtube-mark{display:block;justify-self:end;line-height:0}
.signup-youtube-mark img{display:block;width:300px;max-width:100%;height:auto}
@media(max-width:900px){.sin:has(.signup-options) .signup-action-row{grid-template-columns:1fr}.signup-youtube-mark{margin-top:4px}}

.sin:has(.signup-options) .signup-action-row{display:flex;justify-content:center}
.sin:has(.signup-options) .signup-action-row .gbtn{width:400px;max-width:100%}

.signup-options>p+p{margin-top:16px}
.sin:has(.signup-options) h2{text-wrap:balance}

.sin:has(.signup-options) .signup-action-row{margin-bottom:16px}
.signup-next-step{margin:0 0 22px;font:400 17.5px/1.52 "Newsreader",Georgia,serif;color:rgba(20,22,26,.76);text-align:center;text-wrap:pretty}