/* Shared finishing states: reserve space and keep recovery actions easy to find. */
body:not([data-page="/jw-v2/owner"]) .form-status { min-height: 1.6em; margin-top: 16px; overflow-wrap: anywhere; }
body:not([data-page="/jw-v2/owner"]) .booking-load-error { display: grid; justify-items: start; gap: 20px; padding: 24px 0; }
body:not([data-page="/jw-v2/owner"]) .booking-load-error .error { margin: 0; }
body:not([data-page="/jw-v2/owner"]) [aria-busy="true"] { cursor: progress; }
body:not([data-page="/jw-v2/owner"]) :is(#faq-empty, #journal-empty, .cart-empty) { line-height: 1.7; }
body:not([data-page="/jw-v2/owner"]) :is(#faq-empty, #journal-empty) { padding: 20px 0; }

/* Full-bleed homepage photograph, with readable copy over its left edge. */
body:not([data-page="/jw-v2/owner"]) .site-header { padding-top: 0; padding-bottom: 8px; }
body:not([data-page="/jw-v2/owner"]) .site-header .brand { height: 100px; }
body:not([data-page="/jw-v2/owner"]) .site-header .brand img { width: 140px; height: 140px; transform: translateY(-8px); }
@media (max-width: 700px) {
 body:not([data-page="/jw-v2/owner"]) { --mobile-header-height: 89px; }
 body:not([data-page="/jw-v2/owner"]) .site-header .brand { height: 80px; }
 body:not([data-page="/jw-v2/owner"]) .site-header .brand img { width: 110px; height: 110px; transform: translateY(-6px); }
}
@media (max-height: 500px) and (max-width: 1000px) {
 body:not([data-page="/jw-v2/owner"]) .site-header .brand { height: 70px; }
 body:not([data-page="/jw-v2/owner"]) .site-header .brand img { width: 98px; height: 98px; transform: translateY(-6px); }
 body:not([data-page="/jw-v2/owner"]) .site-header nav.open { max-height: calc(100dvh - 80px - env(safe-area-inset-bottom)); }
}
body[data-page="/"] .studio-hero { display: block; position: relative; min-height: 690px; }
body[data-page="/"] .studio-hero .hero-art { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; z-index: 0; }
body[data-page="/"] .studio-hero .hero-photo { object-position: 20% center; transform: translateX(6vw) scale(1.14); }
body[data-page="/"] .studio-hero .hero-art::after { background: linear-gradient(90deg, #111f 0%, #111e 20%, #1119 38%, #1110 64%); }
body[data-page="/"] .studio-hero .hero-copy { width: 48%; min-height: max(690px, calc(100svh - 163px)); background: transparent; padding-top: 56px; padding-bottom: 90px; }
body[data-page="/"] .studio-photo-note { left: auto; right: 24px; bottom: 24px; max-width: calc(100% - 48px); }
@media (max-width: 700px) {
 body[data-page="/"] .studio-hero { display: flex; flex-direction: column; min-height: 0; }
 body[data-page="/"] .studio-hero .hero-art { position: relative; order: 0; height: 420px; flex: 0 0 420px; }
 body[data-page="/"] .studio-hero .hero-photo { transform: none; object-position: 50% 48%; }
 body[data-page="/"] .studio-hero .hero-art::after { background: linear-gradient(0deg, #181818 0%, transparent 25%); }
 body[data-page="/"] .studio-hero .hero-copy { order: 1; width: 100%; min-height: 0; padding: 28px 24px 40px; background: #181818; }
 body[data-page="/"] .studio-photo-note { right: 16px; bottom: 16px; max-width: calc(100% - 32px); }
}

/* User-selected mint-on-black Afterpay artwork, kept at its original proportions. */
.payment-options > div { flex-wrap:wrap; align-items:center; justify-content:center; }
.payment-options .afterpay-badge { background:#000; padding:0; width:180px; height:56px; min-height:56px; overflow:hidden; }
.payment-options .afterpay-badge img { width:180px; max-width:none; height:auto; flex-shrink:0; }

/* Blend the selected artwork as a whole so black disappears into the footer. */
.payment-options .afterpay-badge { mix-blend-mode:screen; background:transparent; }

/* Original uploaded Zip badge; preserve its 300:135 proportions. */
.payment-options .zip-badge { background:transparent; padding:0; min-height:0; }
.payment-options .zip-badge img { width:124px; height:auto; max-width:100%; }

/* Suburb visit guides and the progressively enhanced area directory. */
.local-visit-intro { max-width:1050px; margin-left:auto; margin-right:auto; }
.local-visit-intro p { max-width:760px; }
.local-visit-intro .btn { margin-top:24px; }
.local-visit-next { padding-top:40px; }
.area-directory-tools { margin:30px 0; max-width:620px; }
.area-directory-tools label { display:block; margin-bottom:8px; font-weight:600; }
.area-directory-tools > div { display:flex; align-items:center; gap:16px; }
.area-directory-tools input { min-width:0; width:100%; padding:14px 16px; font:inherit; font-size:16px; color:#191919; background:#fff; border:1px solid #b9aa91; border-radius:12px; }
.area-directory-tools input:focus-visible { outline:2px solid #8c703e; outline-offset:3px; }
.area-directory-tools button { flex-shrink:0; }
.area-directory-tools [role="status"] { margin-top:12px; }
.area-alphabet { display:flex; flex-wrap:wrap; gap:8px; margin:24px 0; }
.area-alphabet a { display:grid; place-items:center; min-width:44px; min-height:44px; border-radius:8px; background:#eee7dc; color:#24211c; }
.area-directory [data-area-group] { padding:28px 0; border-top:1px solid #ded7cb; }
.area-directory h3 { scroll-margin-top:140px; }
.area-directory ul { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px 24px; padding:0; list-style:none; }
.area-directory li a { display:flex; align-items:center; min-height:44px; overflow-wrap:anywhere; text-decoration:underline; text-underline-offset:4px; }
.area-directory [hidden] { display:none!important; }
@media(max-width:960px){.area-directory ul{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:480px){.area-directory ul{grid-template-columns:1fr;}.area-directory-tools > div{flex-wrap:wrap;}}
@media(max-width:480px){body .local-visit-intro h1{font-size:clamp(1.9rem,8vw,2.4rem);overflow-wrap:normal;}}

/* Keep locality planning headings readable between phone and desktop layouts. */
@media(min-width:701px) and (max-width:1000px){
 body[data-page^="/jw-v2/teeth-whitening/"] #salon-options .section-head { display:block; }
 body[data-page^="/jw-v2/teeth-whitening/"] #salon-options .section-head h2 { max-width:none; }
 body[data-page^="/jw-v2/teeth-whitening/"] #salon-options .section-head > p { margin-top:var(--space-md); max-width:65ch; }
}