/*
Theme Name: BWA Blocks
Theme URI: http://blackandwhitearea.local
Description: Block theme for Black & White Area, photo and video studio rental in Florence.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: bwa-blocks
*/

/* ---------- Tokens & base ---------- */
:root { --gut: clamp(20px, 5vw, 72px); --ink: #0e0e0e; --line: #e3e1dc; --muted: #66635e; --accent: #c0392b; --mist: #f4f3f0; --serif: var(--wp--preset--font-family--serif); }
body { -webkit-font-smoothing: antialiased; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
.wp-site-blocks > * { margin-block-start: 0; }
img { height: auto; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
h1 em, h2 em { color: var(--accent); font-style: italic; }
.bwa-eyebrow {
	font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--muted);
	display: flex; align-items: center; gap: 14px; margin: 0 0 28px;
}
.bwa-eyebrow::before { content: ''; width: 32px; height: 1px; background: var(--ink); flex: none; }
.bwa-lead { font-family: var(--serif); font-style: italic; font-size: 1.375rem; color: var(--muted); margin: 22px 0 18px; }
.bwa-num { font-family: var(--serif); font-size: 14px; color: var(--accent); margin: 0 0 18px; }
.bwa-label { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin: 0 0 14px; }
.bwa-textlink a, .bwa-link .wp-block-button__link {
	font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; text-decoration: none;
	border-bottom: 1px solid var(--accent); padding: 0 0 4px; background: transparent; color: var(--ink); border-radius: 0;
}
.bwa-link .wp-block-button__link:hover, .bwa-textlink a:hover { background: transparent; color: var(--accent); }
.wp-block-button__link { transition: background .2s, color .2s, border-color .2s; }

/* ---------- Header ---------- */
.bwa-header {
	position: sticky; top: 0; z-index: 50; padding: 18px var(--gut);
	background: rgba(255, 255, 255, .98); border-bottom: 1px solid var(--line);
	align-items: center; gap: 24px;
}
.admin-bar .bwa-header { top: 32px; }
.bwa-brand { margin: 0; }
.bwa-brand .wp-block-site-title { margin: 0; font-size: 24px; line-height: 1; }
.bwa-brand .wp-block-site-title a { text-decoration: none; color: var(--ink); }
.bwa-brand__tag { margin: 6px 0 0 !important; font-size: 9px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.bwa-header__right { gap: 28px; margin: 0; }
.bwa-header .wp-block-navigation { flex-wrap: nowrap; white-space: nowrap; font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; gap: 30px; }
.bwa-header .wp-block-navigation a { text-decoration: none; color: var(--ink); }
.bwa-header .wp-block-navigation a:hover { color: var(--accent); }
.bwa-header__cta .wp-block-button__link { padding: .8rem 1.35rem; }

/* ---------- Hero ---------- */
.bwa-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); min-height: calc(100vh - 74px); gap: 0; }
.bwa-hero > * { margin: 0; }
.bwa-hero__text { padding: clamp(48px, 8vw, 120px) var(--gut); display: flex; flex-direction: column; justify-content: center; }
.bwa-hero__text > * { margin-block: 0; }
.bwa-hero__text p.bwa-eyebrow { margin-bottom: 28px; }
.bwa-hero__text > p:not([class]) { max-width: 46ch; margin: 0 0 36px; }
.bwa-hero__cta { gap: 22px; align-items: center; margin: 0; }
.bwa-hero .bwa-hero__img { position: relative; min-height: 420px; margin: 0; }
.bwa-hero .bwa-hero__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Sections ---------- */
.bwa-section { padding: clamp(64px, 9vw, 128px) var(--gut); }
.bwa-section > * { margin-block: 0; }
.bwa-section h2 { margin: 0; max-width: 20ch; }
.bwa-facts { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bwa-fact { padding: 44px 32px; border-right: 1px solid var(--line); }
.bwa-fact:last-child { border-right: 0; }
.bwa-fact > * { margin-block: 0; }
.bwa-fact h3 { margin-bottom: 10px; }
.bwa-fact p:last-child { font-size: 15px; color: var(--muted); }
.bwa-intro { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(32px, 7vw, 120px); align-items: start; }
.bwa-intro p:not([class]) { font-size: 1.125rem; margin: 0 0 18px; }
.bwa-spaces { padding-top: 0; }
.bwa-spaces h2 { margin-bottom: 48px; }
.bwa-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; }
.bwa-grid > * { margin: 0; }
.bwa-card { position: relative; overflow: hidden; background: var(--mist); }
.bwa-card > * { margin: 0; }
.bwa-card figure { margin: 0; height: 100%; }
.bwa-card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s; }
.bwa-card:hover img { transform: scale(1.03); }
.bwa-card--a { grid-column: span 7; } .bwa-card--b { grid-column: span 5; }
.bwa-card--c { grid-column: span 5; } .bwa-card--d { grid-column: span 7; }
.bwa-card--a img, .bwa-card--d img { aspect-ratio: 16/10; }
.bwa-card--b img, .bwa-card--c img { aspect-ratio: 1/1; }
.bwa-cap {
	position: absolute; left: 0; right: 0; bottom: 0; padding: 56px 24px 22px; color: #fff;
	background: linear-gradient(transparent, rgba(0, 0, 0, .7)); font-family: var(--serif); font-size: 1.375rem;
}
.bwa-cap small { display: block; font-family: var(--wp--preset--font-family--sans); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; opacity: .8; margin-top: 4px; }

/* amenities */
.bwa-amen { background: var(--mist); }
.bwa-amen__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 48px; padding: 0; margin: 40px 0 0; list-style: none; }
.bwa-amen__list li { padding: 22px 0; border-top: 1px solid #d6d3cc; font-size: 15px; display: flex; gap: 14px; }
.bwa-amen__list li::before { content: '+'; color: var(--accent); font-weight: 600; }

/* crew */
.bwa-crew { display: grid; grid-template-columns: 1fr 1.3fr; gap: clamp(32px, 7vw, 120px); }
.bwa-crew > div > p:not([class]) { max-width: 40ch; margin-top: 20px; }
.bwa-roles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 40px; align-content: start; }
.bwa-roles > p { margin: 0; padding: 20px 0; border-top: 1px solid var(--line); }
.bwa-roles strong { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.3rem; color: var(--ink); line-height: 1.25; }
.bwa-roles span { font-size: 14px; color: var(--muted); }

/* dark sections */
.bwa-dark { background: var(--ink); color: #cfcdc8; }
.bwa-dark h2, .bwa-dark strong { color: #fff; }
.bwa-dark .bwa-eyebrow { color: #cfcdc8; }
.bwa-dark .bwa-eyebrow::before { background: #cfcdc8; }
.bwa-dark a { color: #fff; }
.bwa-partner { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(32px, 7vw, 120px); align-items: center; }
.bwa-partner h2 { margin-bottom: 20px; }
.bwa-partner p:not([class]) { max-width: 52ch; margin: 0 0 28px; }
.bwa-btn-light .wp-block-button__link { background: #fff; color: var(--ink); }
.bwa-btn-light .wp-block-button__link:hover, .bwa-btn-accent .wp-block-button__link:hover { background: var(--accent); color: #fff; }
.bwa-btn-accent .wp-block-button__link { background: var(--accent); color: #fff; }
.bwa-btn-accent .wp-block-button__link:hover { background: #fff; color: var(--ink); }
.bwa-areas { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .16); }
.bwa-areas > p { margin: 0; background: var(--ink); padding: 28px 24px; }
.bwa-areas span { display: block; font-size: 11px; letter-spacing: .2em; color: var(--accent); }
.bwa-areas strong { font-family: var(--serif); font-weight: 400; font-size: 1.375rem; }

/* FAQ */
.bwa-faq { max-width: 1000px; margin: 0 auto; }
.bwa-faq h2 { margin-bottom: 40px; }
.bwa-faq .wp-block-details { border-top: 1px solid var(--line); padding: 22px 0; margin: 0; }
.bwa-faq .wp-block-details:last-child { border-bottom: 1px solid var(--line); }
.bwa-faq summary { font-family: var(--serif); font-size: 1.375rem; color: var(--ink); cursor: pointer; }
.bwa-faq .wp-block-details p { margin: 14px 0 0; max-width: 62ch; }

/* location */
.bwa-loc { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.bwa-loc h2 { margin-bottom: 24px; }
.bwa-times { display: flex; gap: 40px; margin-top: 28px; }
.bwa-times > p { margin: 0; }
.bwa-times strong { display: block; font-family: var(--serif); font-weight: 400; font-size: 2.5rem; color: var(--ink); line-height: 1; }
.bwa-times span { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }

/* CTA */
.bwa-cta h2 { max-width: 16ch; margin-bottom: 28px; font-size: clamp(2.25rem, 5vw, 4.5rem); }
.bwa-cta__row { display: flex; flex-wrap: wrap; gap: 28px 64px; margin-top: 56px; padding-top: 32px; border-top: 1px solid rgba(255, 255, 255, .16); font-size: 15px; }
.bwa-cta__row > p { margin: 0; }
.bwa-cta__row strong { display: block; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; font-weight: 600; }

/* ---------- Inner pages ---------- */
.bwa-page__head { padding: clamp(48px, 7vw, 96px) var(--gut) 0; }
.bwa-page__head h1 { font-size: clamp(2.5rem, 6vw, 4.5rem); }
.bwa-page__content { padding: 40px var(--gut) clamp(64px, 9vw, 128px); }
.bwa-page__content > * { max-width: 1320px; margin-left: auto; margin-right: auto; }
.bwa-page__content > .alignfull { max-width: none; }
.bwa-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.bwa-gallery figure { margin: 0; }
.bwa-gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }

/* ---------- Footer ---------- */
.bwa-footer { background: #080808; color: #cfcdc8; padding: 72px var(--gut) 28px; font-size: 15px; }
.bwa-footer a { color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .3); }
.bwa-footer a:hover { color: #fff; border-bottom-color: var(--accent); }
.bwa-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 48px; }
.bwa-footer__grid > * { margin: 0; }
.bwa-footer__grid p { margin: 0 0 8px; }
.bwa-footer__brand { font-family: var(--serif); font-size: 1.9rem; color: #fff; line-height: 1.1; margin-bottom: 14px !important; }
.bwa-footer__bottom { margin-top: 56px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 12px; letter-spacing: .08em; color: #8d8b86; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
	.bwa-hero { grid-template-columns: 1fr; min-height: 0; }
	.bwa-hero .bwa-hero__img { order: -1; min-height: 320px; }
	.bwa-facts { grid-template-columns: 1fr 1fr; }
	.bwa-fact { border-bottom: 1px solid var(--line); }
	.bwa-intro, .bwa-loc, .bwa-crew, .bwa-partner { grid-template-columns: 1fr; }
	.bwa-card--a, .bwa-card--b, .bwa-card--c, .bwa-card--d { grid-column: span 12; }
	.bwa-amen__list, .bwa-roles { grid-template-columns: 1fr; }
	.bwa-gallery { grid-template-columns: 1fr 1fr; }
	.bwa-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 960px) {
	.bwa-header__cta { display: none; }
	.bwa-header .wp-block-navigation { gap: 20px; }
}
@media (max-width: 600px) {
	.bwa-footer__grid, .bwa-gallery { grid-template-columns: 1fr; }
	.bwa-times { gap: 28px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }

/* spacing fixes (beat the `> *` resets) */
.bwa-hero__text > .bwa-lead { margin: 22px 0 18px; }
.bwa-hero__text > p:not([class]) { margin: 0 0 36px; }
.bwa-hero__text > h1 { margin: 0; }
.bwa-section > h2 { margin-bottom: 0; }
.bwa-spaces > h2 { margin-bottom: 48px; }
.bwa-faq > h2 { margin-bottom: 40px; }
.bwa-crew > div > p:not([class]), .bwa-partner > div > p:not([class]) { margin-top: 20px; }
.bwa-partner > div > h2 { margin-bottom: 0; }
.bwa-partner > div > .wp-block-buttons { margin-top: 28px; }
.bwa-cta > .wp-block-buttons { margin-top: 28px; }
.bwa-cta > h2 { margin-bottom: 0; }
.bwa-loc > div > h2 { margin-bottom: 24px; }
.bwa-loc > div > p:not([class]) { margin-bottom: 0; }
.bwa-amen > .bwa-amen__list { margin-top: 40px; }
.bwa-intro > div > h2 { margin: 0; }
.bwa-faq summary { list-style: none; display: flex; justify-content: space-between; gap: 20px; }
.bwa-faq summary::-webkit-details-marker { display: none; }
.bwa-faq summary::after { content: '+'; color: var(--accent); font-family: var(--wp--preset--font-family--sans); }
.bwa-faq details[open] summary::after { content: '\2212'; }
.bwa-faq .wp-block-details p { font-size: 1.0625rem; }
.bwa-contact-info { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; margin: 0 0 56px; padding: 32px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bwa-contact-info > p { margin: 0; }
.bwa-contact-info strong { display: block; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; font-weight: 600; }
@media (max-width: 960px) { .bwa-contact-info { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .bwa-contact-info { grid-template-columns: 1fr; } }
@media (max-width: 960px) { .bwa-header .bwa-header__cta { display: none !important; } }
@media (max-width: 600px) { .bwa-brand .wp-block-site-title { font-size: 20px; } }

/* Mobile menu overlay */
.wp-block-navigation__responsive-container.is-menu-open { padding: 24px var(--gut) 48px; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; padding-top: 48px; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; gap: 22px; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--serif); font-size: 2rem; letter-spacing: -.01em; text-transform: none; }