:root {
  --ink: #1a1a18;
  --muted: #6c6a64;
  --paper: #f8f6f1;
  --line: #dfd9cd;
  --accent: #685e4c;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Manrope", ui-sans-serif, system-ui, sans-serif; }
a { color: inherit; }
button, input { font: inherit; }
.portal-header { min-height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 0 5vw; border-bottom: 1px solid var(--line); background: rgba(248,246,241,.94); }
.portal-brand { color: var(--ink); font-family: Georgia, serif; font-size: 1.2rem; letter-spacing: .18em; text-decoration: none; }
.portal-brand span { color: var(--accent); }
.text-button { border: 0; background: transparent; color: var(--muted); cursor: pointer; text-decoration: underline; text-underline-offset: .25em; }
.portal-shell { width: min(1360px, 90vw); margin: 0 auto; padding: clamp(2.5rem, 6vw, 6rem) 0; }
.session-intro { max-width: 720px; }
.eyebrow { margin: 0 0 .75rem; color: var(--accent); font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
h1 { margin: 0; font-family: Georgia, serif; font-size: clamp(2.3rem, 5vw, 4.8rem); font-weight: 400; line-height: 1.03; }
.session-intro > p:not(.eyebrow) { max-width: 58ch; color: var(--muted); line-height: 1.65; }
.session-nav { display: flex; flex-wrap: wrap; gap: .55rem; margin: 1.4rem 0; }
.session-nav a { padding: .45rem .65rem; border: 1px solid var(--line); background: #fff; font-size: .82rem; text-decoration: none; }
.session-nav a[aria-current="page"] { border-color: var(--ink); background: var(--ink); color: #fff; }
.download-all { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; margin: 2rem 0 3rem; padding: 1.2rem 1.3rem; border: 1px solid var(--line); background: #fff; }
.document-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.8rem 0 1.25rem; }
.button-secondary { color: var(--ink); background: #fff; }
.button-secondary:hover { color: #fff; }
.document-frame { height: min(900px, 78vh); overflow: hidden; border: 1px solid var(--line); background: #fff; }
.document-frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.download-all strong, .download-all span { display: block; }
.download-all span { margin-top: .25rem; color: var(--muted); font-size: .88rem; }
.button, .access-form button { display: inline-block; border: 1px solid var(--ink); padding: .82rem 1.1rem; color: #fff; background: var(--ink); cursor: pointer; text-decoration: none; white-space: nowrap; }
.button:hover, .access-form button:hover { background: var(--accent); border-color: var(--accent); }
.photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.media-section { margin-top: clamp(3rem, 6vw, 5rem); }
.media-section h2 { margin: 0 0 1.3rem; font-family: Georgia, serif; font-size: clamp(2rem, 3.5vw, 3.2rem); font-weight: 400; }
.video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.video-card { overflow: hidden; border: 1px solid var(--line); background: #fff; }
.video-player { display: block; width: 100%; height: auto; max-height: 72vh; background: #161614; }
.photo-card { overflow: hidden; background: #fff; border: 1px solid var(--line); }
.image-button { display: block; width: 100%; padding: 0; border: 0; background: #ddd; cursor: zoom-in; aspect-ratio: 4 / 3; overflow: hidden; }
.image-button img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.image-button:hover img { transform: scale(1.025); }
.photo-actions { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .85rem .9rem; font-size: .84rem; }
.photo-actions > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.photo-actions a { color: var(--muted); margin-left: .75rem; text-underline-offset: .25em; }
.empty-state { padding: 3rem; border: 1px solid var(--line); color: var(--muted); background: #fff; }
.client-home { min-height: calc(100vh - 72px); padding-bottom: clamp(3rem, 8vw, 8rem); }
.client-hero { padding: clamp(3rem, 8vw, 7rem) 0 clamp(2.4rem, 5vw, 4.2rem); border-bottom: 1px solid var(--line); }
.client-hero h1 { max-width: 780px; }
.client-brand-logo { display: block; width: min(230px, 65vw); height: auto; margin: 1.65rem 0 0; }
.client-intro { max-width: 55ch; color: var(--muted); line-height: 1.65; margin: 1.5rem 0 0; }
.client-details { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.3rem; }
.client-details div { min-width: min(100%, 250px); padding: 1rem 1.1rem; border: 1px solid var(--line); background: rgba(255,255,255,.7); }
.client-details span, .client-details strong { display: block; }
.client-details span { color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.client-details strong { margin-top: .35rem; font-family: Georgia, serif; font-size: 1.2rem; font-weight: 400; }
.client-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 3.4rem; border: 1px solid var(--line); background: var(--line); }
.client-action { min-height: 300px; display: flex; flex-direction: column; padding: 1.5rem; color: var(--ink); background: #fff; text-decoration: none; transition: background .2s ease, color .2s ease; }
.client-action:hover, .client-action:focus-visible { color: #fff; background: var(--ink); outline: none; }
.action-index { color: var(--accent); font-size: .72rem; font-weight: 700; letter-spacing: .1em; }
.client-action:hover .action-index { color: #d2c6ae; }
.action-title { margin-top: auto; font-family: Georgia, serif; font-size: clamp(1.55rem, 2.3vw, 2.25rem); line-height: 1.06; }
.action-copy { min-height: 3.2em; margin-top: .7rem; color: var(--muted); font-size: .9rem; line-height: 1.55; }
.client-action:hover .action-copy { color: #ddd7cc; }
.action-link { display: flex; justify-content: space-between; margin-top: 1.4rem; font-size: .82rem; font-weight: 700; }
.action-link b { font-size: 1.2rem; line-height: .7; }
.client-action-featured { background: #e5ded0; }
.client-action-pending { background: #f0ece4; cursor: default; }
.client-action-pending:hover { color: var(--ink); background: #f0ece4; }
.client-action-pending:hover .action-index { color: var(--accent); }
.client-action-pending:hover .action-copy { color: var(--muted); }
.courtesy-note { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 1.4rem; max-width: 800px; margin-top: 2.7rem; color: var(--muted); }
.courtesy-note span { color: var(--accent); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.courtesy-note p { margin: 0; line-height: 1.6; }
.lightbox { max-width: min(1200px, 94vw); max-height: 94vh; padding: 0; border: 0; background: transparent; }
.lightbox::backdrop { background: rgba(10,10,9,.88); }
.lightbox img { display: block; max-width: 94vw; max-height: 90vh; }
.lightbox-close { position: fixed; top: 1rem; right: 1.3rem; color: white; border: 0; background: transparent; font-size: 2.5rem; cursor: pointer; }
.portal-login { min-height: 100vh; display: grid; place-items: center; padding: 1.5rem; background: linear-gradient(135deg, #e8e2d7, #f8f6f1 56%, #ddd4c4); }
.access-card { width: min(100%, 480px); padding: clamp(2rem, 7vw, 4rem); background: rgba(255,255,255,.89); border: 1px solid rgba(104,94,76,.24); box-shadow: 0 18px 60px rgba(50,43,31,.12); }
.access-card .portal-brand { display: block; margin-bottom: 4rem; }
.access-copy, .access-help { color: var(--muted); line-height: 1.65; }
.access-form { display: grid; gap: .6rem; margin: 2rem 0 1.25rem; }
.access-form label { font-size: .87rem; font-weight: 700; }
.access-form input { width: 100%; min-height: 48px; padding: .7rem; border: 1px solid var(--line); border-radius: 0; }
.access-form button { margin-top: .6rem; }
.form-error { padding: .8rem; color: #751f1f; background: #fceded; font-size: .9rem; line-height: 1.45; }
@media (max-width: 800px) { .photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .video-grid { grid-template-columns: 1fr; } .client-actions { grid-template-columns: 1fr; } .client-action { min-height: 220px; } }
@media (max-width: 540px) { .portal-header { padding: 0 1.25rem; } .portal-shell { width: min(100% - 2.5rem, 1360px); } .download-all { align-items: flex-start; flex-direction: column; } .photo-grid { grid-template-columns: 1fr; } .photo-actions { align-items: flex-start; flex-direction: column; } .photo-actions a { margin: 0 .8rem 0 0; } .courtesy-note { grid-template-columns: 1fr; gap: .55rem; } }
