/* Weekly Safety Gate digest signup. */
.sg-digest-section { padding: 8px 0 44px; }

.sgd {
   background: var(--bg-card, #1F1F2A);
   border: 1px solid rgba(240, 165, 30, .24);
   border-radius: var(--radius-lg, 16px);
   padding: 26px 28px;
   max-width: 820px;
   margin: 0 auto;
}
.sgd__eyebrow {
   display: block;
   font-size: 11px;
   font-weight: 700;
   letter-spacing: .13em;
   text-transform: uppercase;
   color: var(--gold, #F0A51E);
   margin-bottom: 8px;
}
.sgd__copy h2 {
   font-size: 21px;
   font-weight: 700;
   color: var(--text-bright, #F0F0F5);
   margin: 0 0 8px;
   letter-spacing: -.02em;
}
.sgd__copy p {
   font-size: 14px;
   line-height: 1.65;
   color: var(--text-mid, #9A9AAE);
   margin: 0 0 20px;
   max-width: 62ch;
}

.sgd__row { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
.sgd__field { display: flex; flex-direction: column; gap: 6px; flex: 1 1 210px; min-width: 0; }
.sgd__field > span {
   font-size: 12px;
   font-weight: 600;
   color: var(--text-mid, #9A9AAE);
}
.sgd__field > span small { font-weight: 500; color: var(--text-dim, #5A5A72); }
.sgd__field input,
.sgd__field select {
   background: var(--bg-black, #09090C);
   border: 1px solid rgba(255, 255, 255, .13);
   border-radius: 10px;
   padding: 12px 13px;
   color: var(--text-bright, #F0F0F5);
   font: inherit;
   font-size: 14.5px;
   width: 100%;
}
.sgd__field input:focus,
.sgd__field select:focus { outline: none; border-color: rgba(240, 165, 30, .55); }

.sgd__btn {
   flex: none;
   border: 0;
   background: linear-gradient(135deg, #F0A51E, #D08C14);
   color: #111116;
   font: inherit;
   font-size: 14.5px;
   font-weight: 700;
   padding: 13px 24px;
   border-radius: 10px;
   cursor: pointer;
}
.sgd__btn:hover:not(:disabled) { filter: brightness(1.06); }
.sgd__btn:disabled { opacity: .6; cursor: default; }
.sgd__btn:focus-visible { outline: 2px solid #F5BC45; outline-offset: 2px; }

.sgd__msg { margin: 14px 0 0; font-size: 13.5px; line-height: 1.6; color: #4ADE80; min-height: 1em; }
.sgd__msg.is-bad { color: #FF8A7A; }
.sgd__legal { margin: 14px 0 0; font-size: 12px; line-height: 1.55; color: var(--text-dim, #5A5A72); }

html.light-mode .sgd { background: #FFF; border-color: rgba(240, 165, 30, .3); }
html.light-mode .sgd__copy h2 { color: #15151C; }
html.light-mode .sgd__field input,
html.light-mode .sgd__field select { background: #F5F5F8; color: #15151C; border-color: rgba(17,17,22,.14); }

@media (max-width: 620px) {
   .sgd { padding: 20px 16px; }
   .sgd__btn { width: 100%; }
}
