:root {
  --ink: #1e211d;
  --paper: #f5f2ea;
  --sage: #d4d8c5;
  --line: rgba(30, 33, 29, .22);
  --soft-ink: #696d63;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "DM Sans", sans-serif; }
button, a { font: inherit; color: inherit; }
button { cursor: pointer; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.site-header { height: 75px; padding: 0 clamp(24px, 5vw, 80px); border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.brand { text-decoration: none; font-family: "DM Mono", monospace; font-size: 14px; letter-spacing: .12em; }
.brand span { color: #8b9c67; }
.header-note { margin: 0; font: 10px "DM Mono", monospace; letter-spacing: .14em; color: var(--soft-ink); }
.menu-button { justify-self: end; border: 0; padding: 6px 0 6px 12px; background: transparent; font-size: 17px; line-height: 1; }

.hero { min-height: min(745px, calc(100vh - 75px)); padding: 57px clamp(24px, 9vw, 145px) 57px; display: grid; grid-template-columns: .89fr 1.11fr; gap: clamp(35px, 7vw, 125px); align-items: center; }
.hero-copy { max-width: 475px; padding-top: 15px; }
.eyebrow { margin: 0 0 19px; font: 10px "DM Mono", monospace; letter-spacing: .15em; color: var(--soft-ink); }
h1, h2 { margin: 0; font-family: "Playfair Display", Georgia, serif; font-weight: 500; }
h1 { font-size: clamp(56px, 6.3vw, 102px); line-height: .94; letter-spacing: -.055em; }
h1 em { font-weight: 500; }
.intro { max-width: 360px; margin: 35px 0; font-size: 15px; line-height: 1.7; color: #51554d; }
.hero-actions { display: flex; gap: 29px; align-items: center; flex-wrap: wrap; }
.text-link, .download-all, .lightbox-download { font: 10px "DM Mono", monospace; letter-spacing: .075em; }
.text-link { text-decoration: none; border-bottom: 1px solid var(--ink); padding-bottom: 5px; }
.text-link span { padding-left: 10px; }
.download-all, .lightbox-download { border: 1px solid var(--ink); background: transparent; padding: 12px 15px; transition: .2s ease; }
.download-all:hover, .lightbox-download:hover { background: var(--ink); color: var(--paper); }
.download-all #photoCount { display: inline-block; margin-left: 11px; color: #788368; font-size: 9px; }
.download-icon { font-size: 14px; margin-right: 6px; }
.download-status { min-height: 18px; margin: 16px 0 0; font: 10px "DM Mono", monospace; color: var(--soft-ink); }
.hero-image-wrap { position: relative; width: min(100%, 650px); justify-self: end; }
.hero-image { width: 100%; height: min(67vh, 610px); min-height: 400px; display: block; object-fit: cover; filter: saturate(.78); }
.image-caption { position: absolute; right: -31px; bottom: 20px; margin: 0; writing-mode: vertical-rl; font: 9px "DM Mono", monospace; letter-spacing: .12em; color: var(--soft-ink); }

.gallery-section { padding: 86px clamp(24px, 9vw, 145px) 104px; background: #e4e5da; }
.gallery-heading { margin-bottom: 48px; display: flex; justify-content: space-between; align-items: end; }
h2 { font-size: clamp(42px, 4vw, 63px); line-height: 1; letter-spacing: -.045em; }
.gallery-instruction { margin: 0; text-align: right; font-size: 12px; line-height: 1.5; color: var(--soft-ink); }
.gallery-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(12px, 1.8vw, 26px); align-items: start; }
.photo-card { position: relative; grid-column: span 4; margin: 0; border: 0; padding: 0; display: block; text-align: left; background: transparent; overflow: hidden; }
.photo-card:nth-child(3n + 2) { margin-top: 69px; }
.photo-card:nth-child(4n + 1) { grid-column: span 5; }
.photo-card:nth-child(4n + 2) { grid-column: span 3; }
.photo-card:nth-child(4n + 3) { grid-column: span 4; }
.photo-card:nth-child(8n + 6) { grid-column: span 5; }
.photo-card img { width: 100%; height: 100%; min-height: 285px; display: block; object-fit: cover; filter: saturate(.78); transition: transform .5s ease, filter .4s ease; }
.photo-card:hover img { transform: scale(1.035); filter: saturate(1); }
.photo-card::after { content: "VER FOTO  ↗"; position: absolute; bottom: 0; left: 0; right: 0; padding: 17px; color: white; font: 9px "DM Mono", monospace; letter-spacing: .11em; background: linear-gradient(transparent, rgba(0,0,0,.57)); opacity: 0; transition: opacity .25s; }
.photo-card:hover::after { opacity: 1; }
.photo-card[data-shape="tall"] img { aspect-ratio: .72; }
.photo-card[data-shape="square"] img { aspect-ratio: 1; }
.photo-card[data-shape="wide"] img { aspect-ratio: 1.22; }

.delivery-note { padding: 82px 24px; text-align: center; background: var(--paper); }
.delivery-note .eyebrow { margin-bottom: 15px; }
.delivery-note p:last-child { margin: 0; font-family: "Playfair Display", Georgia, serif; font-size: clamp(22px, 2.2vw, 32px); line-height: 1.35; }
.delivery-note strong { font-weight: 500; font-style: italic; }
.guestbook-section { padding: 92px clamp(24px, 14vw, 225px); display: grid; grid-template-columns: .78fr 1fr; gap: clamp(45px, 10vw, 160px); background: #d4d8c5; align-items: start; }.guestbook-copy h2 { font-size: clamp(44px, 4vw, 65px); }.guestbook-copy > p:last-child { max-width: 270px; margin: 24px 0 0; color: var(--soft-ink); line-height: 1.6; }.guestbook-form { display: grid; gap: 12px; }.guestbook-form label { color: #596050; font: 10px "DM Mono", monospace; letter-spacing: .09em; }.guestbook-form label span { font: 11px "DM Sans", sans-serif; letter-spacing: 0; text-transform: none; }.guestbook-form input, .guestbook-form textarea { width: 100%; border: 1px solid rgba(30,33,29,.36); border-radius: 0; padding: 14px; background: rgba(255,253,248,.7); color: var(--ink); font: 14px "DM Sans", sans-serif; }.guestbook-form textarea { min-height: 132px; resize: vertical; }.message-status { min-height: 18px; margin: 0; color: #4d5945; font-size: 12px; }.messages-section { padding: 85px clamp(24px, 14vw, 225px); background: #faf8f1; }.messages-section > .eyebrow { text-align: center; }.published-messages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }.published-messages article { padding: 26px; background: var(--paper); border-top: 2px solid #aab296; }.published-messages p { margin: 0 0 20px; font-family: "Playfair Display", Georgia, serif; font-size: 20px; line-height: 1.4; }.published-messages span { color: var(--soft-ink); font: 10px "DM Mono", monospace; letter-spacing: .08em; }
footer { padding: 24px clamp(24px, 5vw, 80px); border-top: 1px solid var(--line); display: flex; justify-content: space-between; font: 9px "DM Mono", monospace; letter-spacing: .1em; color: var(--soft-ink); }
footer p { margin: 0; }

.lightbox { width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 28px 7vw 24px; border: 0; background: rgba(24, 27, 22, .98); color: #f7f5ef; overflow: hidden; }
.lightbox::backdrop { background: rgba(0,0,0,.86); }
.lightbox figure { width: 100%; height: calc(100% - 49px); margin: 0; display: grid; place-items: center; }
.lightbox figure img { max-width: 100%; max-height: calc(100vh - 130px); object-fit: contain; }
.lightbox figcaption { position: absolute; bottom: 26px; left: 7vw; right: 7vw; display: flex; justify-content: space-between; font: 10px "DM Mono", monospace; letter-spacing: .1em; color: #c5c9ba; }
.close-lightbox, .nav-button { position: absolute; z-index: 1; border: 0; background: transparent; color: #f7f5ef; }
.close-lightbox { top: 22px; right: 32px; font: 38px/1 Arial, sans-serif; font-weight: 200; }
.nav-button { top: 50%; padding: 16px; transform: translateY(-50%); font-size: 27px; }
.previous { left: 2vw; }.next { right: 2vw; }
.lightbox-download { position: absolute; top: 28px; left: 7vw; color: #f7f5ef; border-color: rgba(247,245,239,.7); }
.password-dialog { width: min(92vw, 510px); margin: auto; padding: 0; border: 0; background: transparent; overflow: visible; }
.password-dialog::backdrop { background: rgba(24, 27, 22, .76); }
.password-card { position: relative; padding: 45px; background: var(--paper); box-shadow: 0 20px 70px rgba(0,0,0,.2); }
.password-card h2 { margin-bottom: 28px; }.password-card label, .admin-main label { display: grid; gap: 8px; color: var(--soft-ink); font: 10px "DM Mono", monospace; letter-spacing: .08em; }
.password-card input, .admin-main input { width: 100%; border: 1px solid var(--line); border-radius: 0; padding: 13px; background: #fffdf8; color: var(--ink); outline: none; font: 14px "DM Sans", sans-serif; }
.password-card input:focus, .admin-main input:focus { border-color: var(--ink); }
.close-password { position: absolute; top: 12px; right: 16px; border: 0; background: none; font-size: 26px; }.password-error, .form-error { min-height: 18px; margin: 10px 0; color: #9e3434; font-size: 12px; }
.password-submit, .primary-button { width: 100%; margin-top: 10px; border: 1px solid var(--ink); background: var(--ink); color: var(--paper); padding: 14px; font: 10px "DM Mono", monospace; letter-spacing: .08em; }.password-submit:hover, .primary-button:hover { background: #3b4039; }.password-submit:disabled, .primary-button:disabled { opacity: .6; cursor: wait; }
.admin-link { color: inherit; text-decoration: none; }.admin-link:hover { color: var(--ink); }

.admin-body { min-height: 100vh; }.logout-button { justify-self: end; border: 0; background: none; font: 10px "DM Mono", monospace; letter-spacing: .1em; }.admin-main { max-width: 1260px; margin: 0 auto; padding: 74px clamp(24px, 6vw, 80px); }
.admin-login { width: min(100%, 480px); margin: 2vh auto; }.admin-login h1, .admin-intro h1 { margin-bottom: 25px; font-size: clamp(52px, 6vw, 84px); }.admin-login > p:not(.eyebrow) { margin: 0 0 31px; color: var(--soft-ink); line-height: 1.6; }.admin-login form { display: grid; gap: 4px; }
.admin-intro { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 55px; }.admin-intro h1 { margin: 0; }.admin-intro > p { max-width: 300px; margin: 0; color: var(--soft-ink); line-height: 1.55; }
.admin-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 28px; align-items: start; }.create-card, .gallery-list-card { padding: clamp(24px, 3vw, 42px); background: #e4e5da; }.create-card h2, .gallery-list-card h2 { margin-bottom: 30px; font-size: 34px; }.create-card form { display: grid; gap: 19px; }.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.admin-main small { color: var(--soft-ink); font: 10px "DM Sans", sans-serif; letter-spacing: 0; }.optional { font: 10px "DM Sans", sans-serif; letter-spacing: 0; text-transform: none; }.upload-field { padding: 20px; border: 1px dashed rgba(30,33,29,.45); cursor: pointer; }.upload-field input { display: none; }.upload-field span { color: var(--ink); font: 14px "DM Sans", sans-serif; letter-spacing: 0; }.upload-status { min-height: 20px; margin: 0; color: #57604e; font-size: 12px; }.upload-status a { color: inherit; font-weight: 600; }
.photo-sorter { padding: 17px; border: 1px solid rgba(30,33,29,.22); background: rgba(255,253,248,.58); }.photo-sorter > p { margin: 0 0 12px; color: var(--soft-ink); font: 9px "DM Mono", monospace; letter-spacing: .1em; }.photo-preview-list { display: grid; gap: 7px; max-height: 310px; overflow: auto; }.photo-preview-item { display: grid; grid-template-columns: 38px 1fr 26px; gap: 10px; align-items: center; padding: 6px; background: #fffdf8; cursor: grab; }.photo-preview-item.dragging { opacity: .45; }.photo-preview-item.drag-over { outline: 2px solid #788368; }.photo-preview-item img { width: 38px; height: 38px; object-fit: cover; }.photo-preview-item span { overflow: hidden; font: 11px "DM Sans", sans-serif; text-overflow: ellipsis; white-space: nowrap; }.photo-preview-item button { border: 0; background: transparent; color: var(--soft-ink); font-size: 21px; line-height: 1; }
.gallery-list-card { background: #fffdf8; border: 1px solid var(--line); }.list-heading { display: flex; justify-content: space-between; align-items: start; }.icon-button { border: 1px solid var(--line); background: transparent; padding: 7px 10px; font-size: 16px; }.gallery-list { display: grid; gap: 0; }.empty-list { padding: 25px 0; margin: 0; color: var(--soft-ink); font-size: 13px; }.gallery-item { padding: 18px 0; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 15px; align-items: center; }.gallery-item strong { display: block; margin-bottom: 6px; font-size: 14px; }.gallery-item span { color: var(--soft-ink); font-size: 11px; }.item-actions { display: flex; gap: 12px; align-items: center; }.item-actions a, .item-actions button { border: 0; padding: 0; background: transparent; color: var(--ink); text-decoration: none; font: 9px "DM Mono", monospace; letter-spacing: .07em; white-space: nowrap; }.item-actions button { text-decoration: underline; }
.messages-dialog { width: min(92vw, 690px); max-height: min(80vh, 800px); margin: auto; padding: 0; border: 0; background: var(--paper); }.messages-dialog::backdrop { background: rgba(24,27,22,.67); }.messages-dialog-card { position: relative; padding: 44px; }.messages-dialog-card h2 { margin-bottom: 28px; font-size: 40px; }.admin-messages-list { display: grid; gap: 0; }.admin-message { padding: 20px 0; border-top: 1px solid var(--line); }.admin-message strong { font-size: 14px; }.admin-message p { margin: 9px 0; line-height: 1.5; }.admin-message > span { color: var(--soft-ink); font: 9px "DM Mono", monospace; }.message-actions { margin-top: 13px; display: flex; gap: 14px; }.message-actions button { border: 0; padding: 0; background: transparent; text-decoration: underline; font: 9px "DM Mono", monospace; letter-spacing: .08em; }

@media (max-width: 700px) {
  .site-header { height: 60px; }.header-note { display: none; }.site-header { grid-template-columns: 1fr auto; }
  .hero { min-height: auto; padding: 55px 24px 0; grid-template-columns: 1fr; gap: 42px; }.hero-copy { padding-top: 0; }.hero-image-wrap { width: calc(100% + 48px); margin-left: -24px; }.hero-image { height: 56vh; min-height: 360px; }.image-caption { display: none; }
  .gallery-section { padding: 65px 24px 72px; }.gallery-heading { display: block; margin-bottom: 31px; }.gallery-instruction { margin-top: 20px; text-align: left; }.gallery-grid { gap: 12px; }.photo-card, .photo-card:nth-child(n) { grid-column: span 6; margin-top: 0; }.photo-card img { min-height: 180px; }.photo-card[data-shape="wide"] img { aspect-ratio: .8; }
  footer { gap: 18px; padding: 21px 24px; flex-direction: column; }.lightbox { padding: 24px; }.lightbox-download { top: 24px; left: 24px; }.close-lightbox { top: 20px; right: 20px; }.nav-button { display: none; }.lightbox figcaption { left: 24px; right: 24px; bottom: 21px; }.password-card { padding: 36px 27px; }.admin-main { padding: 45px 24px; }.admin-intro { display: block; margin-bottom: 34px; }.admin-intro > p { margin-top: 18px; }.admin-grid, .field-row, .guestbook-section, .published-messages { grid-template-columns: 1fr; }.guestbook-section, .messages-section { padding: 65px 24px; }.gallery-item { align-items: start; flex-direction: column; }.messages-dialog-card { padding: 35px 24px; }
}