/* The subscriber acquisition calculator, in the dark design.
   Markup and script are unchanged from the WordPress page, so every
   class and id here is one calculator.js looks for. Do not rename them.
   The "Save as PDF" button builds its own light print page in a new
   window; that styling lives inside calculator.js, not here. */

.sac-wrap{margin-top:8px}
.sac-inner{display:flex;flex-direction:column;gap:24px}

.sac-card{background:var(--raised);border:1px solid var(--line-strong);border-radius:4px;padding:clamp(20px,3vw,34px)}
.sac-section-label{font-family:var(--f-read);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--signal);margin:0 0 18px}
.sac-divider{border:0;border-top:1px solid var(--line);margin:26px 0}

.sac-field-group{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:20px}
@media(min-width:680px){.sac-field-group{grid-template-columns:1fr 1fr}}
.sac-field-group.sac-single{grid-template-columns:1fr}
@media(min-width:680px){.sac-field-group.sac-single .sac-field{max-width:calc(50% - 10px)}}

.sac-field label{display:block;font-family:var(--f-head);font-size:15px;font-weight:600;color:var(--ink)}
.sac-helper{display:block;font-family:var(--f-head);font-size:13px;line-height:1.45;color:var(--ink-mute);margin:3px 0 9px}
.sac-input-wrap{display:flex;align-items:center;background:var(--field);border:1px solid var(--line-strong);border-radius:3px;transition:border-color .15s ease}
.sac-input-wrap:focus-within{border-color:var(--signal);box-shadow:0 0 0 3px rgba(95,208,216,.18)}
.sac-prefix{font-family:var(--f-read);font-size:15px;color:var(--ink-mute);padding-left:14px}
.sac-input-wrap input{flex:1;min-width:0;font-family:var(--f-read);font-size:16px;color:var(--ink);background:transparent;border:0;outline:none;padding:12px 14px 12px 8px}
.sac-input-wrap input.sac-no-prefix{padding-left:14px}
.sac-input-wrap input::placeholder{color:#4d6467}
.sac-input-wrap.sac-field-error-wrap{border-color:var(--bad);background:rgba(239,122,111,.06)}
.sac-field-error{display:block;font-family:var(--f-head);font-size:12px;color:var(--bad);margin-top:5px;min-height:16px}

.sac-disclaimer{font-size:15px;line-height:1.5;color:var(--ink-mute);margin:6px 0 22px}

.sac-btn-row{display:flex;flex-wrap:wrap;gap:12px}
.sac-btn{font-family:var(--f-head);font-size:15px;font-weight:600;border-radius:3px;padding:12px 22px;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease}
.sac-btn-primary{background:var(--signal);color:var(--on-signal);border:1px solid var(--signal)}
.sac-btn-primary:hover{background:var(--signal-hover);border-color:var(--signal-hover)}
.sac-btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line-strong)}
.sac-btn-ghost:hover{border-color:var(--signal);color:var(--signal)}

/* results stay hidden until the script adds sac-visible */
.sac-results{display:none}
.sac-results.sac-visible{display:block}
.sac-results-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:680px){.sac-results-grid{grid-template-columns:1fr 1fr}}
.sac-result-card{background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:20px 22px}
.sac-result-card.sac-featured{border-color:var(--signal-line);background:var(--raised)}
.sac-result-card.sac-full{grid-column:1/-1}
.sac-result-card.sac-green{border-color:rgba(79,194,138,.45)}
.sac-result-card.sac-amber{border-color:rgba(227,176,75,.45)}
.sac-result-card.sac-red{border-color:rgba(239,122,111,.45)}
.sac-result-label{font-family:var(--f-read);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)}
.sac-result-value{font-family:var(--f-head);font-size:clamp(30px,4vw,40px);font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:8px 0 6px;font-variant-numeric:tabular-nums}
.sac-featured .sac-result-value{color:var(--signal)}
.sac-benchmark{font-size:15px;line-height:1.45;color:var(--ink-body)}
.sac-tag{display:inline-block;font-family:var(--f-read);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;border-radius:3px;padding:3px 8px;margin-top:9px}
.sac-tag:empty{display:none}
.sac-tag-good{background:rgba(79,194,138,.14);color:var(--good)}
.sac-tag-warn{background:rgba(227,176,75,.14);color:var(--warn)}
.sac-tag-bad{background:rgba(239,122,111,.14);color:var(--bad)}

.sac-share-row{display:grid;grid-template-columns:1fr;gap:18px;margin-top:22px}
@media(min-width:680px){.sac-share-row{grid-template-columns:1fr 1fr}}
.sac-share-action{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.sac-action-desc{font-family:var(--f-head);font-size:13px;color:var(--ink-mute)}
.sac-share-confirm{display:none;font-family:var(--f-head);font-size:13px;font-weight:600;color:var(--good)}
.sac-share-confirm.sac-visible{display:block}