/* Scripta Care content pages (home, services, contact, thanks, privacy, Scripta Logs password page). Light only; tokens live in chrome.css. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100svh;display:flex;flex-direction:column;font:400 16px/1.5 var(--cc-font-body);background:var(--cc-bg);color:var(--cc-text)}
main{flex:1 0 auto;padding-bottom:48px}
a{color:var(--cc-primary);text-underline-offset:2px}
a:hover{color:var(--cc-primary-hover)}
:focus-visible{outline:2px solid var(--cc-primary);outline-offset:2px}
b,strong{font-weight:600}
h1,h2,h3{margin:0;font-weight:600;line-height:1.25;text-wrap:balance}
h1,h2{font-family:var(--cc-font-display)}
h1{font-size:28px}
h2{font-size:22px}
h3{font-size:18px}
p{margin:0}
.wrap{max-width:1040px;margin:0 auto;padding-inline:16px}
@media (min-width:640px){.wrap{padding-inline:24px}}
.muted,.status-line{color:var(--cc-muted)}

/* Page header: one pattern for every content page; the home page gets the larger h1 */
.page-head{display:grid;gap:12px;padding-block:32px 24px;max-width:65ch}
.page-head p{color:var(--cc-muted)}
.page-head .cc-btn{justify-self:start}
.home-head{padding-block:48px 32px}
.home-head h1{font-size:clamp(32px,5vw,36px)}

/* Sections: one column, dividers between, no cards */
.section{display:grid;gap:12px;padding-block:24px;border-top:1px solid var(--cc-divider);max-width:65ch}
.section .cc-btn{justify-self:start}
.prose{max-width:65ch}
.prose h2{margin-top:32px}
.prose p,.prose ul{margin:12px 0 0}
.prose li{margin-bottom:8px}

/* Forms: label above, hint under the label, error under the hint */
form{display:grid;gap:20px;max-width:520px}
.field{display:grid;gap:6px;min-width:0}
.field label{font-size:14px;font-weight:600}
.hint{font-size:14px;color:var(--cc-muted)}
.field-error{font-size:14px;font-weight:600;color:var(--cc-danger)}
.field-error[hidden]{display:none}
input,textarea{width:100%;height:40px;margin:0;padding:0 12px;border:1px solid var(--cc-control);border-radius:var(--cc-r-control);background:var(--cc-surface);color:var(--cc-text);font:400 16px/1.5 var(--cc-font-body)}
textarea{height:auto;min-height:104px;padding:8px 12px;resize:vertical}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--cc-danger)}
@media (pointer:coarse){input{height:44px}}
.form-actions{display:flex;flex-wrap:wrap;gap:12px}
.form-note{font-size:14px;color:var(--cc-muted)}
/* a note before the form (the preview build's "Preview:" line) is set apart from the first label */
.form-note + form{margin-top:16px}
.after-form{margin-top:16px}
.form-status:empty{display:none}
.form-status.is-error{font-weight:600;color:var(--cc-danger)}
.notice{margin-top:24px;padding:12px 16px;border:1px solid var(--cc-divider);border-radius:var(--cc-r-box);background:var(--cc-surface)}
.notice:empty{display:none}
.hp{position:absolute;left:-9999px}