/*
Theme Name: dabu
Theme URI: https://dabu.design
Description: Portfolio theme for Daniel Burwen, Creative Director. Child theme of Twenty Twenty-Five, built from the dabu.design Figma file.
Author: Daniel Burwen
Template: twentytwentyfive
Version: 0.1.0
Requires at least: 6.7
Requires PHP: 7.4
Text Domain: dabu
*/

/* ---------- Tokens ---------- */
:root {
	--dabu-bg: #090909;
	--dabu-fg: #ffffff;
	--dabu-muted: #949494;
	--dabu-subtle: #9e9e9e;
	--dabu-line: #333333;
	--dabu-yellow: #ffe933;
	--dabu-gutter: 40px;
	--dabu-gap: 16px;
}
@media (max-width: 781px) {
	:root { --dabu-gutter: 20px; --dabu-gap: 12px; }
}

body { background: var(--dabu-bg); color: var(--dabu-fg); -webkit-font-smoothing: antialiased; }
.dabu-home { position: relative; }
.dabu-home, .dabu-home * { box-sizing: border-box; }
.dabu-home p, .dabu-home h1, .dabu-home h2, .dabu-home h3 { margin: 0; }
.dabu-home a { color: inherit; text-decoration: none; }
.dabu-home a:hover { opacity: .75; }
.dabu-home .wp-block-group, .dabu-home .wp-block-cover { margin-block: 0; }
.dabu-home :where(.is-layout-flow) > * { margin-block-start: 0; }

/* ---------- Nav ---------- */
.dabu-nav {
	position: absolute; top: 0; left: 0; right: 0; z-index: 20;
	display: flex; align-items: center; justify-content: space-between;
	padding: 28px var(--dabu-gutter);
}
.dabu-nav__brand { display: flex; align-items: center; gap: 12px; }
.dabu-nav__brand .wp-block-image { margin: 0; line-height: 0; }
.dabu-nav__brand img { width: 25px; height: 28px; display: block; }
.dabu-nav__name { font-size: 14px; font-weight: 500; letter-spacing: .01em; }
.dabu-menu .wp-block-navigation__responsive-container-open svg,
.dabu-menu .wp-block-navigation__responsive-container-close svg { width: 30px; height: 30px; fill: #fff; }
.dabu-menu .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--dabu-bg) !important; color: #fff !important;
	padding: 28px var(--dabu-gutter);
}
.dabu-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 8px;
}
.dabu-menu .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
	font-size: clamp(36px, 6vw, 64px); font-weight: 600; letter-spacing: -.03em; line-height: 1.1;
}

/* ---------- Hero ---------- */
.dabu-hero.wp-block-cover {
	min-height: 100vh; min-height: 100svh;
	padding: 0 var(--dabu-gutter) 28px;
	align-items: flex-end;
}
.dabu-hero .wp-block-cover__background {
	background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 30%, rgba(0,0,0,.92) 100%) !important;
	opacity: 1 !important;
}
.dabu-hero .wp-block-cover__inner-container { width: 100%; max-width: none; }
.dabu-hero__eyebrow {
	font-size: 15px; letter-spacing: .14em; text-transform: uppercase; font-weight: 400;
	margin-bottom: 18px !important;
}
.dabu-hero__eyebrow strong { font-weight: 600; }
.dabu-hero__title {
	font-size: clamp(44px, 6.67vw, 96px); line-height: .88; font-weight: 600;
	letter-spacing: -.01em; max-width: 12.5em;
}
.dabu-hero__sub {
	font-size: clamp(16px, 1.4vw, 20px); color: var(--dabu-muted); margin-top: 22px !important;
}

/* Credentials bar */
.dabu-creds { margin-top: 46px !important; }
.dabu-creds__rule { height: 1px; background: rgba(255,255,255,.14); margin-bottom: 20px !important; }
.dabu-creds__row {
	display: flex; align-items: center; justify-content: space-between;
	gap: 20px 28px; flex-wrap: wrap;
}
.dabu-creds__label {
	font-size: 12px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
	color: var(--dabu-subtle); white-space: nowrap;
}
.dabu-creds__row .wp-block-image { margin: 0; line-height: 0; }
.dabu-creds__row img { width: auto; display: block; }
.dabu-logo--webby img { height: 40px; }
.dabu-logo--fwa img { height: 24px; }
.dabu-logo--sxsw img { height: 22px; }
.dabu-logo--idfa img { height: 30px; }
.dabu-logo--comiccon img { height: 44px; }
.dabu-logo--nyt img { height: 26px; }
.dabu-logo--wired img { height: 20px; }
.dabu-logo--huffpost img { height: 22px; }
.dabu-logo--maddow img { height: 34px; }
.dabu-scroll {
	text-align: center; font-size: 13px; letter-spacing: .04em; color: var(--dabu-subtle);
	margin-top: 71px !important;
}
@media (max-width: 1100px) {
	.dabu-creds__row { justify-content: flex-start; gap: 20px 32px; }
	.dabu-creds__label { flex-basis: 100%; }
}
@media (max-width: 781px) {
	.dabu-creds__row { gap: 18px 24px; }
	.dabu-creds__row img { transform: scale(.85); transform-origin: left center; }
	.dabu-scroll { margin-top: 40px !important; }
}

/* ---------- Work mosaic ---------- */
.dabu-mosaic {
	padding: 40px var(--dabu-gutter) var(--dabu-gap);
	display: flex; flex-direction: column; gap: var(--dabu-gap);
	scroll-margin-top: 20px;
}
.dabu-row { display: grid; gap: var(--dabu-gap); align-items: stretch; }
.dabu-row--a, .dabu-row--c { grid-template-columns: 2fr 1fr; }
.dabu-row--b { grid-template-columns: 1fr 2fr; }
.dabu-stack { display: grid; gap: var(--dabu-gap); grid-auto-rows: 1fr; }
.dabu-row > *, .dabu-stack > * { margin: 0 !important; }

.dabu-tile.wp-block-cover {
	min-height: 0; height: 100%;
	border: 1px solid var(--dabu-line);
	padding: 24px 28px 28px;
	align-items: flex-end; overflow: hidden;
	transition: border-color .3s ease;
}
.dabu-tile .wp-block-cover__image-background { transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.dabu-tile:hover .wp-block-cover__image-background { transform: scale(1.03); }
.dabu-tile:hover { border-color: #555; }
.dabu-tile .wp-block-cover__background {
	background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.85) 100%) !important;
	opacity: 1 !important;
}
.dabu-tile--md .wp-block-cover__background { background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.85) 100%) !important; }
.dabu-tile--sm .wp-block-cover__background { background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.85) 100%) !important; }
.dabu-tile .wp-block-cover__inner-container { width: 100%; max-width: none; position: relative; z-index: 2; }

.dabu-tile--xl.dabu-tile--a { aspect-ratio: 896 / 760; }
.dabu-tile--xl.dabu-tile--b { aspect-ratio: 896 / 640; }
.dabu-tile--xl.dabu-tile--c { aspect-ratio: 896 / 700; }
.dabu-tile--sm { padding: 16px 20px 18px; }

.dabu-tile__title { color: #fff; font-weight: 600; line-height: 1; }
.dabu-tile--xl .dabu-tile__title { font-size: clamp(28px, 3.06vw, 44px); letter-spacing: -.04em; }
.dabu-tile--md .dabu-tile__title { font-size: clamp(22px, 2.08vw, 30px); letter-spacing: -.04em; }
.dabu-tile--sm .dabu-tile__title { font-size: 20px; font-weight: 500; letter-spacing: -.02em; line-height: 1.2; }
.dabu-tile__meta { color: var(--dabu-muted); font-size: 14px; margin-top: 8px !important; }
.dabu-tile--sm .dabu-tile__meta { font-size: 12px; margin-top: 4px !important; color: #bdbdbd; }
.dabu-tile__awards { font-size: 12px; font-weight: 600; letter-spacing: .08em; margin-top: 10px !important; }

.dabu-tile--sony .wp-block-cover__image-background { object-position: 12% 50%; }
.dabu-tile--westfield .wp-block-cover__image-background { object-position: 62% 50%; }

/* RSM Studio tile */
.dabu-tile--rsm.wp-block-cover { background: var(--dabu-yellow); }
.dabu-tile--rsm .wp-block-cover__background { opacity: 1 !important; }
.dabu-tile--rsm .dabu-rsm-mark { position: absolute; right: -8.7%; top: -10px; width: 65%; max-width: 291px; margin: 0; z-index: 1; pointer-events: none; }
.dabu-tile--rsm .dabu-rsm-mark img { width: 100%; height: auto; display: block; }
.dabu-tile--rsm .wp-block-cover__inner-container { position: static; }
.dabu-tile--rsm .wp-block-cover__inner-container > *:not(.dabu-rsm-mark) { position: relative; z-index: 3; }

/* ---------- About + Speaking ---------- */
.dabu-about {
	display: grid; grid-template-columns: 1fr 1fr; gap: var(--dabu-gap);
	padding: 96px var(--dabu-gutter);
}
.dabu-about > * { margin: 0 !important; border-top: 1px solid var(--dabu-line); padding-top: 24px; }
.dabu-label {
	font-size: 13px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
	color: var(--dabu-muted); margin-bottom: 20px !important;
}
.dabu-about__body { font-size: clamp(19px, 1.67vw, 24px); line-height: 1.4; letter-spacing: -.01em; max-width: 30em; }
.dabu-more { font-size: 15px; font-weight: 500; margin-top: 20px !important; }

/* ---------- Contact / Footer ---------- */
.dabu-contact {
	border-top: 1px solid var(--dabu-line);
	padding: 80px var(--dabu-gutter) 40px;
	scroll-margin-top: 20px;
}
.dabu-contact__title { font-size: clamp(36px, 3.9vw, 56px); line-height: 1; letter-spacing: -.04em; font-weight: 600; max-width: 10em; }
.dabu-footer {
	margin-top: 64px !important;
	display: flex; align-items: center; justify-content: space-between; gap: 20px 28px; flex-wrap: wrap;
}
.dabu-footer__email { font-size: 20px; }
.dabu-footer__links { display: flex; gap: 28px; flex-wrap: wrap; font-size: 14px; color: var(--dabu-muted); }
.dabu-footer__links p { margin: 0; }

/* ---------- Mobile ---------- */
@media (max-width: 781px) {
	.dabu-row--a, .dabu-row--b, .dabu-row--c, .dabu-about { grid-template-columns: 1fr; }
	.dabu-tile--xl.dabu-tile--a, .dabu-tile--xl.dabu-tile--b, .dabu-tile--xl.dabu-tile--c { aspect-ratio: 4 / 5; }
	.dabu-tile--md { aspect-ratio: 4 / 3; }
	.dabu-tile--sm { aspect-ratio: 16 / 9; }
	.dabu-stack { grid-auto-rows: auto; }
	.dabu-tile.wp-block-cover { padding: 20px; }
	.dabu-about { padding: 64px var(--dabu-gutter); gap: 48px; }
	.dabu-contact { padding-top: 64px; }
	.dabu-footer__links { gap: 16px 20px; }
}