:root {
    --black: #050505;
    --charcoal: #171717;
    --red: #e31b23;
    --gold: #ffcb05;
    --cream: #f5f0e2;
    --white: #fffdf7;
    --muted: #b9b4aa;
    --line: rgba(255, 203, 5, .28);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--white); background: var(--black); font-family: "Inter", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }

.site-header {
    width: min(1240px, calc(100% - 48px));
    min-height: 100px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    border-bottom: 2px solid var(--gold);
}
.brand { display: flex; align-items: center; gap: 18px; text-decoration: none; }
.brand img { width: min(300px, 34vw); height: auto; }
.brand span { padding-left: 18px; display: flex; flex-direction: column; border-left: 1px solid var(--line); }
.brand strong { color: var(--gold); font: 800 25px/1 "Barlow Condensed", sans-serif; letter-spacing: .03em; text-transform: uppercase; }
.brand small { margin-top: 5px; color: var(--muted); font-size: 9px; letter-spacing: .16em; text-transform: uppercase; }
nav { display: flex; align-items: center; gap: 25px; }
nav a { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
nav a:hover, nav a:focus-visible { color: var(--gold); }
.nav-cta { padding: 12px 15px; color: var(--black); background: var(--gold); }
.nav-cta:hover, .nav-cta:focus-visible { color: white; background: var(--red); }
.nav-toggle { display: none; color: var(--gold); border: 1px solid var(--gold); background: transparent; }

.flash { width: min(760px, calc(100% - 48px)); margin: 22px auto 0; padding: 14px 18px; color: var(--black); font-size: 14px; font-weight: 600; background: var(--gold); border-left: 5px solid var(--red); }
.flash.error { color: white; background: var(--red); }
.flash.success { color: var(--black); background: var(--gold); }

.hero {
    width: min(1240px, calc(100% - 48px));
    min-height: 650px;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 60px;
}
.eyebrow { margin: 0 0 20px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
h1, h2, h3 { font-family: "Barlow Condensed", sans-serif; text-transform: uppercase; }
.hero h1 { margin: 0; font-size: clamp(76px, 10vw, 132px); line-height: .78; letter-spacing: -.035em; }
.hero h1 em { color: var(--gold); font-style: normal; }
.hero-copy > p:not(.eyebrow) { max-width: 560px; margin: 38px 0; color: #d4d0c8; font-size: 17px; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 28px; }
.button { display: inline-flex; justify-content: center; padding: 15px 20px; border: 0; font-size: 11px; font-weight: 800; letter-spacing: .09em; cursor: pointer; text-decoration: none; text-transform: uppercase; }
.button.gold { color: var(--black); background: var(--gold); }
.button.gold:hover, .button.gold:focus-visible { color: white; background: var(--red); }
.text-link { color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-underline-offset: 5px; text-transform: uppercase; }
.hero-logo { min-height: 470px; display: grid; place-items: center; position: relative; overflow: hidden; background: repeating-linear-gradient(135deg, #181818 0, #181818 24px, #0b0b0b 24px, #0b0b0b 48px); border: 1px solid var(--line); }
.hero-logo::before { content: ""; position: absolute; inset: 20px; border: 1px solid rgba(227,27,35,.65); }
.hero-logo img { width: 94%; position: relative; filter: drop-shadow(0 18px 25px rgba(0,0,0,.55)); }

.mission { min-height: 340px; padding: 75px max(24px, calc((100% - 1240px) / 2)); display: grid; grid-template-columns: .4fr 1fr 1fr; align-items: center; gap: 60px; color: white; background: var(--red); border-top: 6px solid var(--gold); }
.mission > span { color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.mission h2 { margin: 0; font-size: clamp(55px, 7vw, 86px); line-height: .82; }
.mission p { margin: 0; font-size: 16px; line-height: 1.8; }

.public-events, .member-heading, .calendar-shell, .detail-card, .form-shell, .admin-shell, .about-hero, .officer-grid, .profile-heading, .join-hero, .membership-types, .request-detail { width: min(1240px, calc(100% - 48px)); margin: auto; }
.public-events { padding: 90px 0; }
.section-title { margin-bottom: 35px; display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.section-title span { color: var(--red); font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.section-title h2 { margin: 8px 0 0; font-size: clamp(48px, 6vw, 76px); line-height: .9; }
.section-title > p { max-width: 320px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.event-list { border-top: 1px solid var(--line); }
.event-list article { min-height: 120px; padding: 24px 0; display: grid; grid-template-columns: 120px 1fr; align-items: center; border-bottom: 1px solid var(--line); }
.event-list time { color: var(--gold); font: 800 35px/1 "Barlow Condensed", sans-serif; text-transform: uppercase; }
.event-list h3 { margin: 0; font-size: 27px; }
.event-list p, .empty { color: var(--muted); }

.about-hero { padding: 100px 0 70px; }
.about-hero h1 { max-width: 850px; margin: 0 0 28px; font-size: clamp(68px, 9vw, 118px); line-height: .82; }
.about-hero > p:last-child { max-width: 690px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.officer-grid { padding-bottom: 110px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; background: var(--gold); border: 2px solid var(--gold); }
.officer-card { min-height: 390px; padding: 42px; position: relative; color: white; background: var(--charcoal); }
.officer-mark { width: 68px; height: 68px; margin-bottom: 35px; display: grid; place-items: center; color: var(--black); font: 800 25px "Barlow Condensed", sans-serif; background: var(--gold); clip-path: polygon(50% 0, 100% 20%, 92% 78%, 50% 100%, 8% 78%, 0 20%); }
.officer-photo { width: 100%; aspect-ratio: 4 / 3; margin-bottom: 30px; display: block; object-fit: cover; object-position: center top; border-bottom: 5px solid var(--gold); }
.officer-card > p { margin: 0 0 8px; color: var(--red); font-size: 10px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.officer-card h2 { margin: 0; font-size: 42px; line-height: 1; }
.member-number { margin-top: 9px; display: inline-block; color: var(--gold); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.officer-bio { margin-top: 28px; color: #d4d0c8; font-size: 14px; line-height: 1.75; }
.officer-contact { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 10px 22px; }
.officer-contact a { color: var(--gold); font-size: 11px; font-weight: 700; text-underline-offset: 5px; }

.join-hero { padding: 100px 0 55px; }
.join-hero h1 { max-width: 900px; margin: 0 0 28px; font-size: clamp(70px, 10vw, 120px); line-height: .8; }
.join-hero > p:not(.eyebrow) { max-width: 760px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.access-warning { max-width: 760px; margin-top: 32px; padding: 18px 22px; display: flex; flex-direction: column; gap: 5px; color: var(--black); background: var(--gold); border-left: 7px solid var(--red); }
.access-warning strong { font: 800 20px "Barlow Condensed", sans-serif; text-transform: uppercase; }
.access-warning span { font-size: 12px; line-height: 1.5; }
.membership-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: var(--gold); border: 2px solid var(--gold); }
.membership-types article { min-height: 260px; padding: 32px; background: var(--charcoal); }
.membership-types article > span { color: var(--gold); font: 800 40px "Barlow Condensed", sans-serif; }
.membership-types h2 { margin: 22px 0 12px; font-size: 30px; }
.membership-types p { color: var(--muted); font-size: 13px; line-height: 1.7; }
.join-form { margin-top: 65px; }
.join-form > h2 { margin: 0 0 15px; font-size: 54px; }
.honeypot { width: 1px; height: 1px; position: absolute; left: -10000px; overflow: hidden; }
.check-label { padding: 14px; display: grid; grid-template-columns: 22px 1fr; align-items: start; gap: 11px; font-size: 11px; line-height: 1.5; text-transform: none; background: rgba(255,255,255,.35); }
.check-label input { width: 18px; height: 18px; margin: 0; padding: 0; }
.join-thanks > p { color: var(--muted); font-size: 15px; line-height: 1.7; }

.auth-shell { min-height: 720px; padding: 80px 24px; display: grid; place-items: center; background: repeating-linear-gradient(135deg, #151515 0, #151515 25px, #090909 25px, #090909 50px); }
.auth-panel { width: min(540px, 100%); padding: 48px; color: var(--black); background: var(--gold); border-top: 8px solid var(--red); }
.auth-panel .eyebrow { color: var(--red); }
.auth-panel h1, .form-shell h1, .admin-shell h1, .detail-card h1, .member-heading h1 { margin: 0 0 18px; font-size: clamp(48px, 6vw, 72px); line-height: .9; }
.auth-panel > p { line-height: 1.6; }
form { display: grid; gap: 18px; }
label { display: grid; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
input, textarea, select { width: 100%; padding: 13px 14px; color: var(--black); background: white; border: 1px solid #b8aa76; border-radius: 0; }
input:focus, textarea:focus, select:focus { outline: 3px solid var(--red); outline-offset: 1px; }
form small { margin-top: -10px; font-size: 11px; }
.auth-panel .button { color: white; background: var(--black); }
.auth-panel .button:hover { background: var(--red); }
.auth-switch { margin-top: 25px; font-size: 12px; }
.auth-switch a { font-weight: 800; }

.member-heading { padding: 75px 0 45px; display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.member-heading h1 { margin-bottom: 10px; }
.member-heading p:last-child { color: var(--muted); }
.calendar-shell { padding-bottom: 100px; }
.calendar-toolbar { min-height: 90px; display: flex; align-items: center; justify-content: space-between; color: var(--black); background: var(--gold); }
.calendar-toolbar h2 { margin: 0; font-size: 38px; }
.calendar-toolbar a { padding: 28px; font-size: 28px; text-decoration: none; }
.calendar { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: #3d392e; border: 1px solid #3d392e; }
.weekday { padding: 12px 6px; color: var(--gold); font-size: 10px; font-weight: 700; text-align: center; text-transform: uppercase; background: var(--black); }
.day { min-height: 145px; padding: 10px; color: var(--white); background: var(--charcoal); }
.day.blank { background: #0c0c0c; }
.day.today { box-shadow: inset 0 0 0 3px var(--gold); }
.day-number { color: var(--gold); font: 700 20px/1 "Barlow Condensed", sans-serif; }
.calendar-event { margin-top: 8px; padding: 7px; display: block; color: white; font-size: 10px; line-height: 1.35; text-decoration: none; background: var(--red); border-left: 3px solid var(--gold); }
.calendar-event.public { color: var(--black); background: var(--gold); border-left-color: var(--red); }
.calendar-event time { display: block; margin-bottom: 3px; font-weight: 800; }

.detail-card, .form-shell, .admin-shell { margin-top: 75px; margin-bottom: 100px; padding: 48px; background: var(--charcoal); border-top: 6px solid var(--gold); }
.detail-card { max-width: 900px; }
.detail-card dl { margin: 35px 0; display: grid; gap: 1px; background: #333; }
.detail-card dl div { padding: 18px; display: grid; grid-template-columns: 130px 1fr; background: #111; }
dt { color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
dd { margin: 0; }
.event-description { padding: 28px 0; line-height: 1.8; border-top: 1px solid var(--line); }
.event-flyer-link { margin: 30px 0; display: block; }
.event-flyer { width: 100%; max-height: 780px; display: block; object-fit: contain; background: #0b0b0b; border: 1px solid var(--line); border-bottom: 5px solid var(--gold); }
.map-link { color: var(--gold); font-weight: 700; line-height: 1.6; text-underline-offset: 4px; }
.map-link span { margin-left: 7px; color: #d8d4ca; font-size: 9px; text-transform: uppercase; }
.event-image-field { margin-top: 5px; }
.event-image-field > img { width: min(100%, 560px); max-height: 500px; display: block; object-fit: contain; background: #0b0b0b; border: 1px solid var(--line); }
.event-image-field .check-label { color: var(--black); }
.event-rsvp { margin-top: 30px; padding: 28px; display: grid; grid-template-columns: 1fr 1.4fr; align-items: center; gap: 30px; background: #101010; border-left: 5px solid var(--gold); }
.event-rsvp h2 { margin: 0 0 8px; font-size: 34px; }
.event-rsvp > div > p:last-child { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.event-rsvp form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.event-rsvp button { min-height: 78px; padding: 10px; display: grid; place-items: center; gap: 5px; color: white; cursor: pointer; background: #282828; border: 2px solid transparent; }
.event-rsvp button strong { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.event-rsvp button span { font: 800 26px "Barlow Condensed", sans-serif; }
.event-rsvp button:hover, .event-rsvp button:focus-visible { border-color: var(--gold); }
.event-rsvp button.selected { color: var(--black); background: var(--gold); border-color: var(--gold); box-shadow: 0 0 0 3px var(--red); }
.detail-actions, .form-actions { margin-top: 30px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.form-shell { max-width: 850px; }
.profile-heading { padding: 75px 0 20px; }
.profile-heading > p { max-width: 780px; color: var(--muted); line-height: 1.7; }
.position-banner { margin-top: 28px; padding: 20px; display: flex; flex-direction: column; gap: 5px; color: var(--black); background: var(--gold); border-left: 6px solid var(--red); }
.position-banner strong { font: 800 24px "Barlow Condensed", sans-serif; text-transform: uppercase; }
.position-banner span { font-size: 12px; }
.profile-form { margin-top: 25px; }
fieldset { margin: 0 0 15px; padding: 25px; display: grid; gap: 18px; border: 1px solid var(--line); }
legend { padding: 0 10px; color: var(--gold); font: 800 22px "Barlow Condensed", sans-serif; text-transform: uppercase; }
.address-row { display: grid; grid-template-columns: 2fr .7fr .8fr; gap: 18px; }
.field-help { margin: -4px 0 6px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.photo-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.photo-field { display: grid; align-content: start; gap: 13px; }
.photo-field > img, .photo-placeholder { width: 100%; aspect-ratio: 4 / 3; display: block; object-fit: cover; object-position: center top; border: 1px solid var(--line); }
.photo-placeholder { place-items: center; color: var(--gold); font: 800 45px "Barlow Condensed", sans-serif; background: #0d0d0d; text-transform: uppercase; }
.photo-field input[type="file"] { padding: 9px; color: var(--black); }
.photo-field > small { color: var(--muted); font-size: 11px; line-height: 1.5; }
.photo-field .check-label { color: var(--black); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.name-row { display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 18px; }
.delete-form { margin-top: 50px; padding-top: 25px; border-top: 1px solid rgba(227,27,35,.5); }
.delete-form button { justify-self: start; padding: 0; color: #ff7378; cursor: pointer; background: none; border: 0; text-decoration: underline; }

.admin-shell > p { color: var(--muted); }
.table-wrap { margin-top: 35px; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 13px; color: var(--gold); font-size: 10px; letter-spacing: .1em; text-align: left; text-transform: uppercase; border-bottom: 2px solid var(--gold); }
td { padding: 13px; border-bottom: 1px solid #3a3a3a; }
td strong, td small { display: block; }
td small { margin-top: 5px; color: var(--muted); }
td select { min-width: 120px; padding: 8px; }
td button { padding: 9px 12px; color: var(--black); font-weight: 800; cursor: pointer; background: var(--gold); border: 0; }
.position-options { min-width: 220px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px 12px; }
.position-options label { display: flex; align-items: center; gap: 5px; font-size: 9px; text-transform: none; }
.position-options input { width: 15px; height: 15px; margin: 0; padding: 0; }
.status-filters { margin: 30px 0 20px; display: flex; flex-wrap: wrap; gap: 8px; }
.status-filters a { padding: 9px 12px; color: var(--black); font-size: 10px; font-weight: 800; text-decoration: none; text-transform: uppercase; background: var(--gold); }
.request-list { border-top: 1px solid var(--line); }
.request-list > a { min-height: 92px; padding: 17px 10px; display: grid; grid-template-columns: 105px 1fr auto 25px; align-items: center; gap: 20px; text-decoration: none; border-bottom: 1px solid var(--line); }
.request-list > a:hover { background: #222; }
.request-list strong, .request-list small { display: block; }
.request-list strong { font: 700 24px "Barlow Condensed", sans-serif; text-transform: uppercase; }
.request-list small { margin-top: 4px; color: var(--muted); }
.request-list time { color: var(--muted); font-size: 11px; }
.status-pill { padding: 6px 8px; display: inline-block; color: var(--black); font-size: 9px; font-weight: 800; text-align: center; text-transform: uppercase; background: var(--gold); }
.status-pill.contacted, .status-pill.in_progress { color: white; background: #406aa3; }
.status-pill.approved { color: white; background: #357a46; }
.status-pill.declined, .status-pill.withdrawn, .status-pill.rejected { color: white; background: #686868; }
.request-detail { padding: 75px 0 100px; display: grid; grid-template-columns: 1.3fr .7fr; align-items: start; gap: 35px; }
.request-person, .request-manage { padding: 38px; background: var(--charcoal); border-top: 6px solid var(--gold); }
.request-person h1 { margin: 0 0 18px; font-size: clamp(55px, 7vw, 82px); line-height: .9; }
.request-person dl { margin: 32px 0; display: grid; gap: 1px; background: #393939; }
.request-person dl div { padding: 14px; display: grid; grid-template-columns: 150px 1fr; background: #111; }
.request-person h2, .request-manage h2 { margin: 30px 0 12px; color: var(--gold); font-size: 28px; }
.request-person > p:not(.eyebrow) { color: #d4d0c8; line-height: 1.75; }
.request-manage { position: sticky; top: 20px; }
.request-manage h2 { margin-top: 0; }
.request-manage .text-link { margin-top: 25px; display: inline-block; }
.submission-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.submission-heading > div > p:last-child { max-width: 680px; color: var(--muted); line-height: 1.7; }
.subsection-title { margin: 55px 0 18px; font-size: 32px; }
.subsection-title span { margin-left: 8px; padding: 3px 8px; color: var(--black); font: 800 14px "Inter", sans-serif; vertical-align: middle; background: var(--gold); border-radius: 20px; }
.submission-list { display: grid; gap: 12px; }
.submission-list article { padding: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; background: #101010; border-left: 5px solid var(--gold); }
.submission-list h3 { margin: 13px 0 7px; font-size: 28px; }
.submission-list p { margin: 5px 0; color: var(--muted); font-size: 12px; }
.review-actions { display: flex; align-items: center; gap: 10px; }
.review-actions button { padding: 10px 14px; color: white; font-size: 10px; font-weight: 800; cursor: pointer; border: 0; text-transform: uppercase; }
.review-actions .approve { background: #357a46; }
.review-actions .reject { background: var(--red); }
.review-actions a { margin-left: auto; color: var(--gold); font-size: 10px; font-weight: 700; text-transform: uppercase; }

.email-shell { width: min(1100px, calc(100% - 48px)); min-height: 650px; margin: 70px auto 100px; }
.email-toolbar { margin-bottom: 28px; display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.email-toolbar h1 { margin: 0 0 8px; font-size: clamp(52px, 7vw, 80px); line-height: .85; }
.email-toolbar span { color: var(--muted); font-size: 12px; }
.mailbox-switcher { margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 7px; }
.mailbox-switcher a { padding: 9px 12px; color: var(--gold); font-size: 9px; font-weight: 800; text-decoration: none; text-transform: uppercase; border: 1px solid var(--gold); }
.mailbox-switcher a.active { color: var(--black); background: var(--gold); }
.email-layout { display: grid; grid-template-columns: 210px 1fr; align-items: start; gap: 24px; }
.folder-list { display: grid; background: var(--charcoal); border-top: 4px solid var(--gold); }
.folder-list a { min-height: 42px; padding: 11px 13px; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #d5d0c6; font-size: 11px; text-decoration: none; border-bottom: 1px solid #333; }
.folder-list a:hover, .folder-list a.active { color: var(--black); background: var(--gold); }
.folder-list strong { min-width: 21px; padding: 2px 5px; color: var(--black); font-size: 9px; text-align: center; background: var(--gold); border-radius: 10px; }
.folder-list a.active strong { color: var(--gold); background: var(--black); }
.email-list { border-top: 1px solid var(--line); }
.email-list > a { min-height: 76px; padding: 14px 12px; display: grid; grid-template-columns: 230px 1fr 145px; align-items: center; gap: 20px; color: #d8d4ca; text-decoration: none; border-bottom: 1px solid var(--line); }
.email-list > a:hover { background: #1e1e1e; }
.email-list > a.unread { color: white; background: #191919; border-left: 5px solid var(--gold); }
.mail-from { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.email-list strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.email-list time { color: var(--muted); font-size: 10px; text-align: right; }
.compose-form { padding: 35px; background: var(--charcoal); border-top: 5px solid var(--gold); }
.message-meta { padding: 18px; display: grid; gap: 8px; color: var(--muted); font-size: 12px; background: var(--charcoal); border-top: 5px solid var(--gold); }
.message-meta strong { margin-right: 8px; color: var(--gold); text-transform: uppercase; }
.message-body { min-height: 300px; margin-bottom: 25px; padding: 30px 18px; color: #eee9df; line-height: 1.75; white-space: normal; background: #0d0d0d; }
.message-pane { min-width: 0; }
.email-toolbar-actions { display: flex; align-items: center; gap: 22px; }
.email-settings-shell { width: min(1100px, calc(100% - 48px)); margin: 70px auto 100px; }
.email-settings-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 25px; }
.settings-card { padding: 34px; background: var(--charcoal); border-top: 5px solid var(--gold); }
.settings-card h2 { margin: 5px 0 20px; font-size: 34px; }
.settings-card form { display: grid; gap: 16px; }
.connection-details { margin: 0 0 22px; display: grid; gap: 1px; background: #3a3a3a; }
.connection-details div { padding: 13px 15px; display: grid; grid-template-columns: 145px 1fr; gap: 15px; background: #111; }
.connection-details dd { overflow-wrap: anywhere; }

footer { width: min(1240px, calc(100% - 48px)); min-height: 150px; margin: auto; display: grid; grid-template-columns: 1fr 2fr auto; align-items: center; gap: 40px; color: var(--muted); font-size: 10px; line-height: 1.6; border-top: 1px solid var(--line); }
footer div { display: flex; flex-direction: column; }
footer strong { color: var(--gold); font: 700 19px "Barlow Condensed", sans-serif; text-transform: uppercase; }
footer p { max-width: 470px; }

@media (max-width: 900px) {
    .site-header { min-height: 85px; position: relative; }
    .brand span { display: none; }
    .brand img { width: min(270px, 58vw); }
    .nav-toggle { display: block; padding: 9px; }
    nav { padding: 20px; display: none; position: absolute; z-index: 10; top: 84px; right: 0; left: 0; flex-direction: column; align-items: stretch; background: var(--black); border: 1px solid var(--line); }
    nav.open { display: flex; }
    nav a { padding: 10px; }
    .hero { padding: 75px 0; grid-template-columns: 1fr; }
    .hero-logo { min-height: 390px; }
    .mission { grid-template-columns: 1fr; gap: 20px; }
    .section-title, .member-heading { align-items: flex-start; flex-direction: column; }
    .officer-grid { grid-template-columns: 1fr; }
    .membership-types, .request-detail { grid-template-columns: 1fr; }
    .submission-heading { align-items: flex-start; flex-direction: column; }
    .submission-list article { grid-template-columns: 1fr; }
    .request-manage { position: static; }
    .calendar { min-width: 850px; }
    .calendar-shell { overflow-x: auto; }
    footer { padding: 35px 0; grid-template-columns: 1fr; gap: 14px; }
}

@media (max-width: 560px) {
    .site-header, .hero, .public-events, .member-heading, .calendar-shell, .detail-card, .form-shell, .admin-shell, .about-hero, .officer-grid, .profile-heading, .join-hero, .membership-types, .request-detail, footer { width: min(100% - 30px, 1240px); }
    .hero h1 { font-size: 72px; }
    .hero-actions, .detail-actions, .form-actions { align-items: stretch; flex-direction: column; }
    .auth-panel, .detail-card, .form-shell, .admin-shell { padding: 30px 22px; }
    .form-row { grid-template-columns: 1fr; }
    .name-row { grid-template-columns: 1fr; }
    .photo-fields { grid-template-columns: 1fr; }
    .event-rsvp { grid-template-columns: 1fr; }
    .event-rsvp form { grid-template-columns: 1fr; }
    .address-row { grid-template-columns: 1fr; }
    .event-list article { grid-template-columns: 90px 1fr; }
    .request-list > a { grid-template-columns: 1fr; gap: 8px; }
    .email-shell { width: min(100% - 30px, 1100px); }
    .email-toolbar { align-items: flex-start; flex-direction: column; }
    .email-layout { grid-template-columns: 1fr; }
    .email-settings-shell { width: min(100% - 30px, 1100px); }
    .email-settings-grid { grid-template-columns: 1fr; }
    .email-toolbar-actions { width: 100%; justify-content: space-between; }
    .folder-list { grid-template-columns: repeat(2, 1fr); }
    .email-list > a { grid-template-columns: 1fr; gap: 5px; }
    .email-list time { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    * { transition: none !important; }
}