/* ────────────────────────────────────────────────────────────
   RASC GA 2027 — Membership Demand Survey
   Survey-specific styles. Reuses site.css + registration.css for the
   header, buttons, error box, overlay, and confirmation screen.
   Palette matches the site: navy #0B4F6C, copper #B87333, cream #F1ECE3.
   ──────────────────────────────────────────────────────────── */

.survey-intro {
    background: #F1ECE3;
    border: 1px solid #C9C2B5;
    border-radius: 8px;
    padding: 18px 22px;
    margin-bottom: 24px;
    line-height: 1.6;
    color: #1F1F1F;
}
.survey-intro p { margin: 0 0 10px; }
.survey-intro p:last-child { margin-bottom: 0; }

.section-head {
    color: #0B4F6C;
    border-bottom: 2px solid #C9C2B5;
    padding-bottom: 8px;
    margin: 0 0 6px;
}

.survey-q { margin: 22px 0 0; }

.survey-q .q-text {
    font-weight: 600;
    color: #1F1F1F;
    margin: 0 0 8px;
    line-height: 1.45;
}
.survey-q .qnum {
    color: #0B4F6C;
    font-weight: 700;
    margin-right: 4px;
}
.survey-q .hint {
    margin: -4px 0 8px;
    font-size: 0.88em;
    color: #6B6256;
    font-style: italic;
}

/* Option lists (radio / checkbox rows) */
.opt-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.opt-list .opt {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 9px 12px;
    border: 1px solid #C9C2B5;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s;
    line-height: 1.4;
}
.opt-list .opt:hover { background: #F7F3EC; border-color: #0B4F6C; }
.opt-list .opt input { margin-top: 3px; flex: 0 0 auto; accent-color: #0B4F6C; }
.opt-list .opt input:disabled + span { color: #A79E8E; }
.opt-list .opt:has(input:checked) { background: #EAF1F4; border-color: #0B4F6C; }

/* Free-text inputs / textarea (match registration field styling closely) */
.survey-q input[type="text"],
.survey-q select,
.survey-q textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #C9C2B5;
    border-radius: 6px;
    font: inherit;
    color: #1F1F1F;
    background: #fff;
}
.survey-q textarea { resize: vertical; }
.survey-q input[type="text"]:focus,
.survey-q select:focus,
.survey-q textarea:focus {
    outline: none;
    border-color: #0B4F6C;
    box-shadow: 0 0 0 2px rgba(11, 79, 108, 0.15);
}

.confirmation .muted { color: #6B6256; }

/* Minimal standalone footer — no internal site links (survey is distributed
   before the rest of the site is ready for public traffic). */
.survey-footer {
    text-align: center;
    color: #6B6256;
    font-size: 0.88em;
    line-height: 1.6;
    padding: 28px 20px 40px;
    border-top: 1px solid #C9C2B5;
    margin-top: 32px;
}
.survey-footer p { margin: 2px 0; }
.survey-footer a { color: #0B4F6C; }

.survey-footer .footer-logo-link {
    display: inline-block;
    margin-bottom: 12px;
}
.survey-footer .footer-logo {
    max-width: 96px;
    height: auto;
    margin: 0 auto;
    display: block;
    transition: opacity 0.15s;
}
.survey-footer .footer-logo-link:hover .footer-logo { opacity: 0.75; }

/* Honeypot — kept off-screen so humans never interact with it. */
.hp-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}


/* ── GA 2027 hero banner — survey page only (scoped via data-page) ── */
body[data-page="survey"] .ga-header{
    position:relative;
    width:100vw; margin-left:calc(50% - 50vw); margin-top:-24px; margin-bottom:34px;
    padding:56px 24px 46px; min-height:clamp(320px,44vh,460px); display:flex; flex-direction:column; justify-content:center; align-items:center;
    border-bottom:1px solid var(--rule);
    color:#fff; text-align:center;
    background-color:#2a1a0e;
    background-image:
        radial-gradient(ellipse 88% 78% at 50% 46%, rgba(16,9,4,0.58) 0%, rgba(28,16,8,0.28) 54%, rgba(46,27,13,0.30) 100%),
        linear-gradient(rgba(150,92,34,0.12), rgba(150,92,34,0.12)),
        url('assets/survey-hero.jpg');
    background-size:cover; background-position:center top;
}
body[data-page="survey"] .ga-header .eyebrow{ color:#F0E4CE; font-size:0.78em; text-shadow:0 1px 8px rgba(0,0,0,.45); }
body[data-page="survey"] .ga-header h1{ color:#fff; font-size:clamp(2.4em, 6.5vw, 4em); text-shadow:0 2px 22px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.4); }
body[data-page="survey"] .ga-header h1 .year{ color:#E6A15C; }
body[data-page="survey"] .ga-header .dates{ color:#F6EEE0; font-size:1.1em; font-weight:600; text-shadow:0 1px 10px rgba(0,0,0,.5); }
body[data-page="survey"] .ga-header .venue{ color:#E7DAC6; font-size:0.95em; text-shadow:0 1px 8px rgba(0,0,0,.5); }
@media(max-width:520px){
    body[data-page="survey"] .ga-header{ padding:40px 18px 34px; margin-bottom:26px; }
}


/* Highlight a required question the respondent missed (set by survey.js validation) */
.survey-q.q-missing{
    outline:2px solid #c0392b;
    outline-offset:6px;
    border-radius:8px;
    background:rgba(192,57,43,0.06);
}