:root {
    --navy: #102a43;
    --navy-2: #0b1f33;
    --blue: #1f5f9e;
    --blue-bright: #2d74b8;
    --steel: #6b7c8d;
    --light: #f4f7f9;
    --line: #dce5ec;
    --white: #ffffff;
    --text: #172534;
    --muted: #657687;
    --shadow: 0 18px 55px rgba(14, 38, 62, .12);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--text); background: #fff; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.site-header { position: sticky; top: 0; z-index: 50; background: #000000; border-bottom: 1px solid rgba(255,255,255,.10); }
.nav-wrap { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand img { width: 290px; height: auto; }
.nav-wrap nav, .portal-nav nav { display: flex; align-items: center; gap: 24px; font-weight: 700; font-size: 14px; }
.nav-wrap nav { color: rgba(255,255,255,.90); }
.nav-wrap nav > a:not(.button):hover { color: #9ac8f0; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 8px; border: 1px solid transparent; font-weight: 800; font-size: 14px; cursor: pointer; transition: .2s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { background: var(--blue); color: white; box-shadow: 0 10px 24px rgba(31,95,158,.2); }
.button-primary:hover { background: var(--blue-bright); }
.button-secondary { background: var(--navy); color: white; }
.button-ghost { border-color: rgba(255,255,255,.65); color: white; background: rgba(0,0,0,.14); }
.button-small { min-height: 38px; padding: 0 16px; font-size: 13px; }
.hero { position: relative; min-height: 660px; display: grid; align-items: center; background: url('/assets/img/hero.webp') center 48%/cover no-repeat; color: #fff; overflow: hidden; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(6,22,38,.88) 0%, rgba(6,22,38,.67) 48%, rgba(6,22,38,.16) 100%); }
.hero-content { position: relative; z-index: 2; padding: 90px 0; }
.eyebrow { margin: 0 0 14px; text-transform: uppercase; letter-spacing: .18em; font-size: 12px; font-weight: 900; color: #b9d7f2; }
.eyebrow.dark { color: var(--blue); }
.hero h1 { margin: 0; max-width: 760px; font-size: clamp(52px, 7vw, 88px); line-height: .98; letter-spacing: -.045em; }
.hero-copy { font-size: 18px; margin: 26px 0; color: rgba(255,255,255,.88); }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.trust-strip { background: var(--navy-2); color: #fff; }
.trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.trust-grid > div { padding: 28px 32px; border-right: 1px solid rgba(255,255,255,.13); }
.trust-grid > div:first-child { padding-left: 0; }
.trust-grid > div:last-child { border-right: 0; }
.trust-grid strong { display: block; font-size: 15px; }
.trust-grid span { display: block; color: rgba(255,255,255,.65); font-size: 13px; margin-top: 4px; }
.section { padding: 100px 0; }
.split { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 70px; }
.section h2, .project-portal-callout h2, .contact-section h2 { margin: 0 0 24px; font-size: clamp(36px, 4.4vw, 58px); line-height: 1.05; letter-spacing: -.035em; }
.section-copy p { color: #536577; font-size: 17px; }
.image-stack { display: grid; grid-template-columns: 1.05fr .95fr; gap: 14px; align-items: end; }
.image-stack img { width: 100%; aspect-ratio: .88/1; object-fit: cover; border-radius: 12px; box-shadow: var(--shadow); }
.image-stack img:last-child { transform: translateY(34px); }
.section-dark { background: var(--navy); color: white; }
.section-dark h2 { max-width: 850px; }
.feature-grid { margin-top: 50px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.feature-grid article { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.11); padding: 30px; border-radius: 12px; }
.feature-grid article > span { font-size: 12px; color: #8fbbe4; font-weight: 900; letter-spacing: .14em; }
.feature-grid h3 { margin: 30px 0 10px; font-size: 22px; }
.feature-grid p { color: rgba(255,255,255,.7); }
.project-portal-callout { background: #eaf1f6; padding: 70px 0; }
.portal-callout-inner { display: grid; grid-template-columns: 1fr auto; gap: 60px; align-items: center; }
.portal-callout-inner h2 { font-size: clamp(34px,4vw,52px); }
.portal-callout-inner p { max-width: 760px; color: #536577; }
.contact-section { background: #fff; }
.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: start; }
.phone-link { display: inline-block; margin-top: 22px; font-size: 28px; font-weight: 900; color: var(--blue); }
.license-line { color: var(--muted); font-weight: 700; }
.contact-card, .admin-form-card { background: var(--light); border: 1px solid var(--line); border-radius: 14px; padding: 30px; }
.stack-form, .contact-card { display: grid; gap: 17px; }
label { display: grid; gap: 7px; color: #34495e; font-size: 13px; font-weight: 800; }
input, textarea, select { width: 100%; border: 1px solid #cbd8e3; background: #fff; padding: 13px 14px; border-radius: 7px; font: inherit; color: var(--text); }
input:focus, textarea:focus, select:focus { outline: 2px solid rgba(31,95,158,.18); border-color: var(--blue); }
.honeypot { position: absolute !important; left: -10000px !important; }
.site-footer { background: #000000; color: rgba(255,255,255,.7); padding: 52px 0; }
.footer-inner { display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; gap: 32px; font-size: 13px; }
.footer-inner img { width: 255px; }
.footer-inner p:last-child { text-align: right; }

/* Portal */
.portal-body { background: #f1f5f8; }
.portal-header { background: #000000; border-bottom: 1px solid rgba(255,255,255,.10); color: #fff; }
.portal-nav { min-height: 82px; display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.portal-nav img { width: 260px; }
.portal-nav > div { display: flex; gap: 18px; align-items: center; font-size: 13px; font-weight: 800; }
.portal-nav a:hover { color: #9ac8f0; }
.portal-main { padding-top: 52px; padding-bottom: 80px; }
.portal-heading { margin-bottom: 32px; }
.portal-heading h1 { margin: 0; font-size: clamp(38px, 5vw, 58px); letter-spacing: -.04em; }
.portal-heading p:last-child { color: var(--muted); }
.auth-shell { min-height: 100vh; display: grid; place-items: center; padding: 32px; background: radial-gradient(circle at top, #e2edf5 0, #f2f6f9 42%, #edf2f5 100%); }
.auth-card { width: min(480px, 100%); background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 38px; box-shadow: var(--shadow); }
.auth-logo { width: min(100%, 330px); margin: 0 auto 35px; border-radius: 8px; }
.auth-card h1 { margin: 0 0 12px; font-size: 40px; letter-spacing: -.04em; }
.auth-card > p { color: var(--muted); }
.fine-print { font-size: 12px !important; color: var(--muted) !important; margin-top: 20px; }
.alert { padding: 13px 15px; margin: 0 0 20px; border-radius: 8px; font-size: 14px; font-weight: 700; }
.alert-success { background: #e9f7ef; color: #1d6a42; border: 1px solid #bde5ce; }
.alert-error { background: #fff0f0; color: #8d2727; border: 1px solid #f0c4c4; }
.alert-warning { background: #fff8e5; color: #745913; border: 1px solid #eedda7; }
.project-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.project-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 26px; min-height: 230px; box-shadow: 0 8px 26px rgba(14,38,62,.06); transition: .2s ease; }
.project-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: #b8cbdc; }
.project-card h2 { margin: 22px 0 4px; font-size: 23px; }
.project-card p { margin: 4px 0; }
.status-pill { display: inline-block; background: #e7f0f8; color: var(--blue); padding: 5px 9px; border-radius: 999px; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.muted { color: var(--muted); font-size: 13px; }
.text-link { display: block; margin-top: 24px; color: var(--blue); font-weight: 900; font-size: 13px; }
.back-link { display: inline-block; color: var(--blue); font-weight: 800; margin-bottom: 22px; }
.project-hero-card { background: var(--navy); color: #fff; border-radius: 16px; padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 30px; box-shadow: var(--shadow); }
.project-hero-card h1 { margin: 14px 0 8px; font-size: 42px; line-height: 1.05; }
.project-hero-card p { margin: 6px 0; color: rgba(255,255,255,.72); }
.portal-section { margin-top: 42px; }
.section-title-row { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 18px; }
.section-title-row h2 { margin: 0; font-size: 24px; }
.section-title-row > span { color: var(--muted); font-size: 12px; font-weight: 800; }
.timeline { display: grid; gap: 16px; }
.timeline-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 24px; }
.timeline-card h3 { margin: 12px 0 4px; }
.timeline-card p { color: #526476; }
.timeline-meta { display: flex; justify-content: space-between; gap: 16px; font-size: 12px; color: var(--muted); }
.progress-track { height: 7px; background: #e7edf2; border-radius: 999px; overflow: hidden; margin-top: 18px; }
.progress-track span { display: block; height: 100%; background: var(--blue); border-radius: 999px; }
.photo-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.photo-card { overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 10px; }
.photo-card img { width: 100%; aspect-ratio: 1.2/1; object-fit: cover; }
.photo-card span { display: block; padding: 12px; font-size: 12px; font-weight: 800; }
.video-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.video-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.video-card video { width: 100%; aspect-ratio: 16/9; background: #000; }
.video-card h3 { padding: 0 18px 18px; margin: 14px 0 0; }
.external-video { display: grid; place-items: center; min-height: 220px; background: var(--navy); color: #fff; font-weight: 900; }
.file-list { display: grid; gap: 9px; }
.file-row { display: flex; justify-content: space-between; gap: 24px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; }
.file-row:hover:not(.static) { border-color: #abc2d5; }
.file-row strong { display: block; }
.file-row div span { display: block; color: var(--muted); font-size: 12px; margin-top: 2px; }
.file-row > span { color: var(--muted); font-size: 12px; font-weight: 800; }
.empty-state { background: #fff; border: 1px dashed #b8c9d7; border-radius: 12px; padding: 48px; text-align: center; color: var(--muted); }
.empty-state.compact { padding: 24px; }
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.stat-grid > div { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 26px; }
.stat-grid strong { display: block; font-size: 36px; color: var(--navy); }
.stat-grid span { color: var(--muted); font-size: 13px; }
.two-column-admin { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 30px; align-items: start; }
.admin-form-card { background: #fff; }
.admin-form-card h2 { margin-top: 0; }
.admin-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-top: 30px; }
.assigned-list { display: grid; gap: 7px; margin-bottom: 18px; }
.assigned-list span { background: var(--light); border-radius: 6px; padding: 9px 10px; font-size: 12px; color: var(--muted); }

@media (max-width: 900px) {
    .nav-wrap nav > a:not(.button) { display: none; }
    .hero { min-height: 570px; }
    .split, .contact-grid, .portal-callout-inner, .two-column-admin { grid-template-columns: 1fr; }
    .feature-grid, .project-grid { grid-template-columns: 1fr 1fr; }
    .trust-grid { grid-template-columns: 1fr; }
    .trust-grid > div { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.13); padding-left: 0; }
    .footer-inner { grid-template-columns: 1fr; }
    .footer-inner p:last-child { text-align: left; }
    .photo-grid { grid-template-columns: repeat(2, 1fr); }
    .admin-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
    .container { width: min(100% - 28px, 1160px); }
    .brand img { width: 205px; }
    .portal-nav img { width: 190px; }
    .hero h1 { font-size: 52px; }
    .section { padding: 72px 0; }
    .feature-grid, .project-grid, .video-grid, .stat-grid { grid-template-columns: 1fr; }
    .project-hero-card { align-items: flex-start; flex-direction: column; }
    .photo-grid { grid-template-columns: 1fr 1fr; }
    .portal-nav nav { gap: 12px; font-size: 11px; flex-wrap: wrap; justify-content: flex-end; }
    .portal-nav > div span { display: none; }
    .auth-card { padding: 28px 22px; }
}


/* Admin destructive actions */
.button-danger { background: #a52a2a; color: #fff; border-color: #a52a2a; }
.button-danger:hover { background: #8b2020; }
.project-hero-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.project-hero-actions form, .delete-inline-form { margin: 0; }
.admin-file-row { padding-right: 12px; }
.admin-file-main { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.admin-file-main > span { color: var(--muted); font-size: 12px; font-weight: 800; white-space: nowrap; }
.delete-inline-form { flex: 0 0 auto; }

@media (max-width: 620px) {
    .admin-file-row { align-items: flex-start; }
    .admin-file-main { align-items: flex-start; flex-direction: column; gap: 6px; }
}

/* Admin categorized project files + list/gallery toggle */
.project-files-title-row { align-items: flex-end; }
.project-files-title-row > div:first-child { display: grid; gap: 2px; }
.section-count { color: var(--muted); font-size: 12px; font-weight: 800; }
.file-view-toggle { display: inline-flex; align-items: center; gap: 4px; padding: 4px; background: #e4ebf1; border-radius: 9px; }
.file-view-button { border: 0; background: transparent; color: #526476; min-height: 34px; padding: 0 14px; border-radius: 6px; font: inherit; font-size: 12px; font-weight: 900; cursor: pointer; }
.file-view-button.is-active { background: #fff; color: var(--navy); box-shadow: 0 2px 8px rgba(14,38,62,.10); }
.categorized-files { display: grid; gap: 30px; }
.file-category-block { display: grid; gap: 12px; }
.file-category-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 8px; border-bottom: 1px solid #d9e3eb; }
.file-category-heading h3 { margin: 0; font-size: 18px; color: var(--navy); }
.file-category-heading span { color: var(--muted); font-size: 12px; font-weight: 800; }
.file-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.file-gallery[hidden] { display: none !important; }
.file-gallery-card { min-width: 0; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 5px 18px rgba(14,38,62,.05); }
.file-gallery-preview { min-height: 150px; display: grid; place-items: center; background: linear-gradient(145deg, #e9f0f5, #f6f9fb); border-bottom: 1px solid var(--line); overflow: hidden; }
.file-gallery-preview.has-image { background: #e8eef3; }
.file-gallery-preview img { width: 100%; height: 170px; object-fit: cover; transition: transform .18s ease; }
.file-gallery-preview.has-image:hover img { transform: scale(1.025); }
.file-type-icon { display: grid; place-items: center; width: 78px; height: 92px; padding: 8px; border: 2px solid #9eb3c4; border-radius: 8px; background: rgba(255,255,255,.7); color: var(--navy); font-size: 13px; font-weight: 950; letter-spacing: .06em; text-align: center; }
.file-gallery-card-body { display: grid; gap: 14px; padding: 14px; }
.file-gallery-copy { min-width: 0; }
.file-gallery-copy strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.file-gallery-copy span { display: block; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 11px; }
.file-gallery-actions { display: flex; align-items: center; gap: 7px; }
.file-gallery-actions .button { flex: 1; }
.file-gallery-actions .delete-inline-form { flex: 1; }
.file-gallery-actions .delete-inline-form .button { width: 100%; }

@media (max-width: 1000px) {
    .file-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .project-files-title-row { align-items: flex-start; flex-direction: column; }
    .file-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
    .file-gallery { grid-template-columns: 1fr; }
    .file-gallery-preview img { height: 210px; }
}

/* Client gallery actions */
.client-gallery-actions .button { width: 100%; }