/* Cape Captures Portraits — responsive, no framework required */
:root{--ink:#090d11;--panel:#11171d;--panel2:#171e25;--gold:#e9bf79;--gold-light:#f6d9a0;--white:#f8f7f3;--muted:#aeb4ba;--line:rgba(255,255,255,.13);--serif:"Playfair Display",Georgia,serif;--sans:"DM Sans",Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--ink);color:var(--white);font-family:var(--sans);font-size:15px;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit}.site-header{height:82px;padding:0 clamp(22px,5vw,82px);display:flex;align-items:center;justify-content:space-between;background:rgba(8,12,16,.96);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;backdrop-filter:blur(16px)}.brand{display:inline-flex;align-items:center;gap:11px;min-width:max-content}.brand-mark{width:43px;height:38px;display:grid;place-items:center;font-size:28px;color:var(--gold)}.brand-mark svg{width:43px}.brand-words{display:flex;flex-direction:column;line-height:1.2;letter-spacing:.17em}.brand-words strong{font-size:12px;font-weight:700}.brand-words small{font-size:9px;letter-spacing:.32em;color:#c4c6c6;margin-top:4px}.nav-links{display:flex;align-items:center;gap:clamp(18px,2.5vw,38px)}.nav-links>a:not(.button){font-size:12px;color:#d3d5d7;transition:color .2s}.nav-links>a:not(.button):hover,.text-link:hover{color:var(--gold)}.menu-toggle{display:none;border:0;background:none;color:white;font-size:25px}.button{display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:13px 20px;border-radius:5px;font-size:12px;font-weight:700;letter-spacing:.01em;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.button-gold{background:var(--gold);color:#15130f}.button-gold:hover{background:var(--gold-light)}.button-large{padding:16px 23px;min-width:184px}.button-outline{border:1px solid rgba(233,191,121,.75);color:var(--gold);margin-top:14px}.hero{min-height:610px;position:relative;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--line)}.hero-photo{position:absolute;inset:0;background-image:url("https://images.unsplash.com/photo-1518837695005-2083093ee35b?auto=format&fit=crop&w=2200&q=85");background-size:cover;background-position:center 48%;transform:scale(1.015)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,9,13,.94) 0%,rgba(5,9,13,.76) 34%,rgba(5,9,13,.24) 70%,rgba(5,9,13,.1) 100%),linear-gradient(0deg,rgba(5,9,13,.55),transparent 30%)}.hero-content{position:relative;width:min(650px,90%);margin-left:clamp(24px,8vw,130px);padding:65px 0 70px}.eyebrow{font-size:10px;letter-spacing:.27em;font-weight:700;color:var(--gold);margin:0 0 16px}.hero h1{font-size:clamp(40px,5.2vw,72px);line-height:.99;letter-spacing:-.045em;margin:0 0 18px;font-weight:700}.hero h1 span{font-family:var(--serif);font-weight:500;letter-spacing:.035em;font-size:.76em}.hero-tagline{font-size:15px;font-weight:600;margin:0 0 9px}.hero-copy{max-width:430px;color:#d1d2d2;font-size:13px;margin:0 0 25px}.service-shortcuts{display:flex;gap:clamp(22px,4vw,50px);margin-top:34px}.service-shortcuts a{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:10px;color:#e7e7e5;min-width:50px}.shortcut-icon{font-size:27px;line-height:1.2;font-weight:300}.hero-caption{position:absolute;right:clamp(20px,5vw,80px);bottom:24px;display:flex;align-items:center;gap:10px;font-size:8px;letter-spacing:.18em;color:#e4dfd5}.hero-caption span:first-child{height:1px;width:28px;background:var(--gold)}.section{padding:94px clamp(22px,7vw,110px)}.packages-section{background:#0d1217}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:35px}.section-heading h2,.story-copy h2,.booking-banner h2,.contact-copy h2{font-size:clamp(29px,3.3vw,43px);line-height:1.15;letter-spacing:-.035em;margin:0;font-weight:600}.section-heading h2 em,.story-copy h2 em,.booking-banner h2 em,.contact-copy h2 em{font-family:var(--serif);font-weight:500;color:var(--gold);letter-spacing:0}.section-heading>p{max-width:360px;color:var(--muted);font-size:12px;margin:0 0 4px}.package-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}.package-card{background:var(--panel);border:1px solid rgba(255,255,255,.09);overflow:hidden;border-radius:5px;transition:transform .25s,border-color .25s}.package-card:hover{transform:translateY(-5px);border-color:rgba(233,191,121,.55)}.package-image{height:205px;background-size:cover;background-position:center;transition:transform .4s}.package-card:hover .package-image{transform:scale(1.03)}.portrait-img{background-image:url("https://images.unsplash.com/photo-1534528741775-53994a69daeb?auto=format&fit=crop&w=700&q=80")}.event-img{background-image:url("https://images.unsplash.com/photo-1506157786151-b8491531f063?auto=format&fit=crop&w=700&q=80")}.couple-img{background-image:url("https://images.unsplash.com/photo-1519741497674-611481863552?auto=format&fit=crop&w=700&q=80")}.grad-img{background-image:url("https://images.unsplash.com/photo-1523050854058-8df90110c9f1?auto=format&fit=crop&w=700&q=80")}.package-info{padding:17px 15px 12px;display:flex;justify-content:space-between;gap:8px;align-items:start}.package-info h3{font-size:14px;margin:0 0 3px}.package-info p{font-size:10px;color:var(--muted);margin:0}.price{font-size:10px;color:var(--gold);white-space:nowrap;padding-top:3px}.text-link{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:12px 15px;font-size:10px;font-weight:700;transition:color .2s}.text-link span{font-size:15px}.price-note{font-size:10px;color:#8e969d;margin:15px 0 0}.story-section{display:grid;grid-template-columns:1fr 1fr;min-height:500px;background:#151a1f}.story-image{background:url("https://images.unsplash.com/photo-1473116763249-2faaef81ccda?auto=format&fit=crop&w=1200&q=85") center/cover;min-height:440px}.story-copy{align-self:center;padding:70px clamp(28px,7vw,110px)}.story-copy h2{margin-bottom:22px}.story-copy>p:not(.eyebrow){font-size:13px;color:#b9bec1;max-width:450px;margin:0 0 14px}.gallery-section{background:#0b1015}.gallery-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;grid-template-rows:210px 210px;gap:13px}.gallery-tile{position:relative;background-size:cover;background-position:center;border-radius:4px;overflow:hidden;min-height:150px}.gallery-tile:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.65),transparent 58%)}.gallery-tile span{position:absolute;z-index:1;bottom:14px;left:16px;font-family:var(--serif);font-size:17px}.gallery-one{grid-row:span 2;background-image:url("https://images.unsplash.com/photo-1524504388940-b1c1722653e1?auto=format&fit=crop&w=900&q=80")}.gallery-two{background-image:url("https://images.unsplash.com/photo-1470229722913-7c0e2dbbafd3?auto=format&fit=crop&w=800&q=80")}.gallery-three{background-image:url("https://images.unsplash.com/photo-1516589178581-6cd7833ae3b2?auto=format&fit=crop&w=800&q=80")}.gallery-four{background-image:url("https://images.unsplash.com/photo-1523050854058-8df90110c9f1?auto=format&fit=crop&w=800&q=80")}.gallery-five{background-image:url("https://images.unsplash.com/photo-1473116763249-2faaef81ccda?auto=format&fit=crop&w=800&q=80")}.booking-banner{padding:54px clamp(22px,7vw,110px);display:flex;justify-content:space-between;align-items:center;gap:30px;background:linear-gradient(110deg,#20252a,#13191e);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.booking-banner h2{font-size:clamp(27px,3.2vw,40px)}.booking-banner>div>p:last-child{color:var(--muted);font-size:12px;margin:10px 0 0}.contact-section{display:grid;grid-template-columns:1fr 1fr;gap:60px;background:#0d1217}.contact-copy>p:not(.eyebrow){max-width:360px;color:var(--muted);font-size:13px;margin-top:18px}.contact-details{border-top:1px solid var(--line)}.contact-details>a,.contact-details>div{position:relative;display:flex;flex-direction:column;gap:5px;padding:19px 35px 19px 0;border-bottom:1px solid var(--line)}.contact-label{font-size:9px;letter-spacing:.2em;color:var(--gold)}.contact-details strong{font-size:13px;font-weight:500}.contact-arrow{position:absolute;right:4px;top:30px;color:var(--gold);font-size:18px}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px clamp(22px,5vw,82px);border-top:1px solid var(--line);color:#969da3;font-size:10px}.footer-brand .brand-mark{width:28px;font-size:23px}.footer-brand .brand-words strong{font-size:10px}.footer-brand .brand-words small{font-size:8px}.site-footer p{margin:0}
@media(max-width:900px){.site-header{height:72px}.nav-links{gap:15px}.nav-links>a:not(.button){font-size:11px}.package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.package-image{height:230px}.section{padding-top:70px;padding-bottom:70px}.hero{min-height:570px}.story-copy{padding:50px 35px}.gallery-grid{grid-template-rows:180px 180px}}
@media(max-width:650px){.site-header{padding:0 19px}.menu-toggle{display:block}.nav-links{display:none;position:absolute;left:0;right:0;top:71px;background:#0a0f13;border-bottom:1px solid var(--line);padding:18px 22px 22px;align-items:stretch;flex-direction:column;gap:0}.nav-links.open{display:flex}.nav-links>a:not(.button){padding:12px 0;font-size:13px}.nav-book{margin-top:10px}.hero{min-height:620px;align-items:flex-end}.hero-photo{background-position:59% center}.hero-shade{background:linear-gradient(0deg,rgba(5,9,13,.96) 0%,rgba(5,9,13,.7) 47%,rgba(5,9,13,.12) 100%)}.hero-content{margin:0;padding:65px 22px 72px;width:100%}.hero h1{font-size:clamp(38px,11vw,56px)}.hero-tagline{font-size:13px}.hero-copy{font-size:12px;max-width:360px}.service-shortcuts{justify-content:space-between;gap:10px;margin-top:28px}.hero-caption{display:none}.section{padding:62px 20px}.section-heading{display:block;margin-bottom:25px}.section-heading>p{margin-top:13px}.section-heading h2,.story-copy h2,.contact-copy h2{font-size:32px}.package-grid{gap:11px}.package-image{height:155px}.package-info{padding:12px 10px 10px;display:block}.package-info h3{font-size:13px}.package-info p{min-height:30px}.price{display:block;margin-top:7px}.text-link{padding:10px;font-size:9px}.story-section{grid-template-columns:1fr}.story-image{min-height:300px}.story-copy{padding:48px 23px 55px}.gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:170px 170px 170px;gap:9px}.gallery-one{grid-row:span 2}.gallery-five{grid-column:span 2}.gallery-tile span{font-size:15px;left:12px;bottom:10px}.booking-banner{padding:43px 22px;align-items:flex-start;flex-direction:column}.booking-banner h2{font-size:31px}.contact-section{grid-template-columns:1fr;gap:28px}.site-footer{flex-wrap:wrap;justify-content:space-between;padding:23px 20px}.site-footer p{order:3;width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* CAPE CAPTURES BOOKING MODAL */
.booking-modal[hidden] { display: none !important; }
.booking-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 20px; overflow-y: auto; }
.booking-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.82); backdrop-filter: blur(5px); }
.booking-dialog { position: relative; z-index: 1; width: min(100%, 560px); max-height: calc(100vh - 40px); overflow-y: auto; padding: clamp(24px, 5vw, 42px); color: var(--white, #f8f7f3); background: var(--panel, #11171d); border: 1px solid rgba(233,191,121,.48); border-radius: 12px; box-shadow: 0 24px 80px rgba(0,0,0,.55); }
.booking-close { position: absolute; top: 12px; right: 16px; border: 0; background: transparent; color: var(--white, #f8f7f3); font-size: 32px; cursor: pointer; line-height: 1; }
.booking-eyebrow { margin: 0 32px 12px 0; color: var(--gold, #e9bf79); font-size: 11px; letter-spacing: .18em; font-weight: 700; }
.booking-dialog h2 { margin: 0 28px 12px 0; font-family: "Playfair Display", Georgia, serif; font-size: clamp(27px, 5vw, 38px); line-height: 1.15; }
.booking-intro { color: var(--muted, #aeb4ba); line-height: 1.6; margin: 0 0 24px; }
.booking-label { display: block; margin-bottom: 9px; font-size: 13px; font-weight: 600; }
.booking-date { display: block; width: 100%; min-height: 48px; padding: 12px; color: var(--white, #f8f7f3); color-scheme: dark; background: var(--ink, #090d11); border: 1px solid rgba(233,191,121,.5); border-radius: 6px; font: inherit; }
.availability-status { margin: 20px 0 12px; color: var(--muted, #aeb4ba); font-size: 14px; line-height: 1.5; }
.availability-times { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.availability-times:empty { display: none; }
.booking-time { min-height: 43px; padding: 9px 6px; color: var(--white, #f8f7f3); background: var(--panel2, #171e25); border: 1px solid var(--line, rgba(255,255,255,.13)); border-radius: 5px; font: inherit; cursor: pointer; }
.booking-time:hover, .booking-time:focus-visible { border-color: var(--gold, #e9bf79); outline: none; }
.booking-time[aria-pressed="true"] { color: var(--ink, #090d11); background: var(--gold, #e9bf79); border-color: var(--gold, #e9bf79); }
.booking-notice { margin: 22px 0 0; padding: 13px 14px; color: #e8d7b9; background: rgba(233,191,121,.08); border-left: 2px solid var(--gold, #e9bf79); font-size: 12px; line-height: 1.65; }
@media (max-width: 420px) { .booking-modal { padding: 10px; } .booking-dialog { max-height: calc(100vh - 20px); padding: 26px 18px; } .availability-times { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* CUSTOMER DETAILS — CAPE CAPTURES PORTRAITS */
.booking-customer-details {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid rgba(233, 191, 121, 0.28);
}

.booking-section-title {
  margin: 0 0 8px;
  color: var(--white, #f8f7f3);
  font-family: "Playfair Display", Georgia, serif;
  font-size: 23px;
  font-weight: 600;
}

.booking-section-intro {
  margin: 0 0 22px;
  color: var(--muted, #aeb4ba);
  font-size: 13px;
  line-height: 1.6;
}

.booking-field {
  display: block;
  width: 100%;
  min-height: 46px;
  margin: 0 0 20px;
  padding: 12px 13px;
  color: var(--white, #f8f7f3);
  background: var(--ink, #090d11);
  border: 1px solid rgba(233, 191, 121, 0.35);
  border-radius: 6px;
  font: inherit;
  font-size: 14px;
  box-sizing: border-box;
}

.booking-field::placeholder {
  color: #858b91;
}

.booking-field:focus {
  outline: none;
  border-color: var(--gold, #e9bf79);
  box-shadow: 0 0 0 2px rgba(233, 191, 121, 0.12);
}

.booking-field:invalid:not(:placeholder-shown) {
  border-color: #b87575;
}

.booking-field textarea,
textarea.booking-field {
  min-height: 100px;
  resize: vertical;
}

select.booking-field {
  color-scheme: dark;
  cursor: pointer;
}

@media (max-width: 420px) {
  .booking-customer-details {
    margin-top: 22px;
    padding-top: 20px;
  }

  .booking-section-title {
    font-size: 21px;
  }
}
/* BOOKING FORM VALIDATION BUTTON */
.booking-validation {
  margin-top: 8px;
}

.booking-validate-button {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 13px 18px;
  color: var(--ink, #090d11);
  background: var(--gold, #e9bf79);
  border: 1px solid var(--gold, #e9bf79);
  border-radius: 6px;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

.booking-validate-button:hover {
  background: #f2d39d;
  transform: translateY(-1px);
}

.booking-validate-button:focus-visible {
  outline: 2px solid var(--white, #f8f7f3);
  outline-offset: 3px;
}

.booking-validation-status {
  margin: 12px 0 0;
  color: var(--muted, #aeb4ba);
  font-size: 13px;
  line-height: 1.6;
}

.booking-validation-status[data-valid="true"] {
  color: #9ed6ad;
}

.booking-validation-status[data-valid="false"] {
  color: #e8b0a5;
}