/* Mad Habit. Colors and shapes come from the design system in CLAUDE.md. Orange is the only accent. */

:root {
	--bg: #0c0e10;
	--surface-low: #121416;
	--surface: #171a1c;
	--surface-high: #1e2124;
	--surface-bright: #292c2f;
	--line: #232629;
	--line-strong: #46484a;
	--text: #eeeef0;
	--text-soft: #dcc1b8;
	--text-muted: #a48b84;
	--accent: #ff7948;
	--on-accent: #390c00;
	--on-accent-soft: #5c1900;

	--amazon: #eeeef0;
	--tiktok: #82d3de;
	--instagram: #ff5fa8;
	--youtube: #ff4a3d;

	--font-display: "Barlow Condensed", "Arial Narrow", sans-serif;
	--font-body: "Barlow", "Helvetica Neue", Arial, sans-serif;
	--font-mono: "IBM Plex Mono", ui-monospace, monospace;

	--max-width: 1240px;
	--gutter: 24px;
	--header-h: 73px;
}

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font-body); font-size: 17px; line-height: 1.55; }
h1, h2, h3, p, ol, ul { margin: 0; }
img, video, svg { display: block; max-width: 100%; }
a { color: var(--text); }
a:hover { color: var(--accent); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: var(--gutter); top: -100px; z-index: 20; padding: 12px 18px; background: var(--accent); color: var(--on-accent); font-weight: 700; }
.skip-link:focus { top: 12px; color: var(--on-accent); }

/* Shapes and texture */
.cut { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%); }
.cut-card { clip-path: polygon(0 0, calc(100% - 32px) 0, 100% 32px, 100% 100%, 0 100%); }
.cut-band { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 48px), calc(100% - 48px) 100%, 0 100%); }
.cut:focus-visible { outline: none; box-shadow: inset 0 0 0 3px currentColor; }
.gridbg { background-image: linear-gradient(rgba(238, 238, 240, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(238, 238, 240, .05) 1px, transparent 1px); background-size: 64px 64px; }
.vid { background-color: var(--surface); background-image: repeating-linear-gradient(135deg, rgba(238, 238, 240, .035) 0 10px, transparent 10px 20px); }

/* Type */
.display { font-family: var(--font-display); font-style: italic; font-weight: 800; line-height: 1; text-transform: uppercase; }
.display--hero { font-size: clamp(60px, 8vw, 112px); line-height: .88; }
.display--hero .accent { display: block; }
.display--page { font-size: clamp(56px, 7vw, 96px); line-height: .9; }
.display--send { font-size: clamp(56px, 6vw, 88px); line-height: .9; }
.display--section { font-size: clamp(44px, 5vw, 56px); }
.display--sub { font-size: 48px; }
.accent { color: var(--accent); }
.mono { font-family: var(--font-mono); font-size: 13px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.label { letter-spacing: .06em; }
.lede { font-size: 20px; color: var(--text-soft); max-width: 50ch; }
.body-soft { color: var(--text-soft); }
.muted { color: var(--text-muted); }
.small { font-size: 14px; }
.small-body { font-size: 15px; }
.text-strong { color: var(--text); font-weight: 700; }
.text-link { font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 14px; }
.text-link-inline { font-weight: 600; }
.email { color: inherit; font-weight: 600; user-select: all; }

/* Layout */
.container { width: 100%; max-width: var(--max-width); margin-inline: auto; padding-inline: var(--gutter); }
.container--narrow { max-width: 860px; }
.section { padding-block: 88px; }
.section--grid { padding-block: 48px 96px; }
.section--tight { padding-block: 64px; }
.section--mid { padding-block: 72px; }
.section--faq { padding-block: 64px 96px; }
.stack { display: flex; flex-direction: column; gap: 28px; }
.stack--lg { gap: 32px; }
.stack--sm { gap: 16px; }
.stack--xs { gap: 12px; }
.band { background: var(--surface-low); border-block: 1px solid var(--line); }
.button-row { display: flex; flex-wrap: wrap; gap: 12px; }

/* Buttons */
.btn { display: inline-flex; align-items: center; min-height: 52px; padding: 16px 32px 16px 24px; border: 0; font-family: inherit; font-size: 15px; font-weight: 700; letter-spacing: .06em; line-height: 1.2; text-decoration: none; text-transform: uppercase; cursor: pointer; }
.btn:hover { filter: brightness(1.1); }
.btn--sm { min-height: 44px; padding: 13px 26px 13px 20px; font-size: 14px; }
.btn--lg { min-height: 56px; padding: 18px 36px 18px 26px; font-size: 16px; }
.btn--primary, .btn--primary:hover { background: var(--accent); color: var(--on-accent); }
.btn--secondary, .btn--secondary:hover { background: var(--surface-bright); color: var(--text); }
.btn--ghost, .btn--ghost:hover { background: rgba(238, 238, 240, .12); color: var(--text); }
.btn--dark, .btn--dark:hover { background: var(--bg); color: var(--accent); }

/* Header */
.site-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 15; background: var(--bg); border-bottom: 1px solid var(--line); transition: transform .25s ease, background-color .25s ease; }
/* Home: the frosted header sits over the hero video, then turns solid once the hero is scrolled past (main.js adds .is-scrolled). */
.site-header--glass { margin-bottom: calc(-1 * var(--header-h)); background: rgba(23, 26, 28, .7); border-bottom-color: transparent; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
.site-header--glass.is-scrolled { background: var(--bg); border-bottom-color: var(--line); }
.site-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-block: 14px; }
.logo { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 28px; letter-spacing: .01em; line-height: 1.2; text-decoration: none; text-transform: uppercase; color: var(--text); }
.logo--footer { font-size: 26px; }
.site-nav__links, .site-nav__menu { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; }
.site-nav__menu { padding: 0; list-style: none; }
.site-nav__menu a { font-size: 14px; font-weight: 600; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }
.site-nav__menu .current-menu-item a { font-weight: 700; color: var(--accent); }
.menu-toggle { display: none; align-items: center; gap: 10px; min-height: 44px; padding: 0 18px 0 14px; border: 0; background: var(--surface-bright); color: var(--text); font: 500 13px/1 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.menu-toggle:focus-visible { outline: none; box-shadow: inset 0 0 0 3px currentColor; }
.menu-toggle .icon--close, .menu-toggle[aria-expanded="true"] .icon--menu { display: none; }
.menu-toggle[aria-expanded="true"] .icon--close { display: block; }

/* Footer */
.site-footer { border-top: 1px solid var(--line); }
.site-footer__inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px 64px; padding-block: 44px; }
.site-footer__brand { display: flex; flex-direction: column; gap: 8px; font-size: 15px; }
.site-footer__brand .small { font-size: 14px; }
.site-footer__nav { display: flex; flex-wrap: wrap; gap: 28px 56px; font-size: 15px; }
.footer-list { display: flex; flex-direction: column; gap: 8px; padding: 0; list-style: none; }

/* Page header */
.page-header { border-bottom: 1px solid var(--line); }
.page-header__inner { display: flex; flex-direction: column; gap: 18px; padding-block: 88px 64px; }

/* Hero */
.hero { position: relative; display: flex; flex-direction: column; min-height: 780px; overflow: hidden; background-color: var(--surface-low); }
.hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__placeholder { position: absolute; top: 42%; left: 50%; width: 90%; transform: translate(-50%, -50%); color: var(--text-muted); text-align: center; text-transform: none; }
.hero__shade { position: absolute; inset: 0; background: linear-gradient(to top, rgba(12, 14, 16, .96) 0%, rgba(12, 14, 16, .55) 45%, rgba(12, 14, 16, .25) 100%); }
.hero__inner { position: relative; flex: 1 1 auto; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 32px; padding-block: 192px 72px; }
.hero__copy { flex: 999 1 520px; min-width: 0; max-width: 760px; display: flex; flex-direction: column; gap: 22px; }
.hero__lede { max-width: 48ch; }
.hero__toggle { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border: 0; background: rgba(23, 26, 28, .7); color: var(--text); cursor: pointer; }
.hero__toggle .icon--play, .hero__toggle.is-paused .icon--pause { display: none; }
.hero__toggle.is-paused .icon--play { display: block; }

/* Video grid */
.section-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; }
.reel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.video-card { position: relative; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.video-card[hidden] { display: none; }
.video-card__media { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 5; overflow: hidden; }
.video-card__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.video-card__image { transition: transform .25s; }
.video-card__image--whole { object-fit: contain; }
.video-card__backdrop { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: blur(24px) brightness(.55); transform: scale(1.2); }
.video-card__play { position: relative; }
.video-card__play circle, .video-card__play path { transition: fill .15s; }
.video-card__open { color: inherit; text-decoration: none; }
.video-card__open::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.video-card__open:focus-visible { outline: none; }
.video-card__open:focus-visible::after { outline: 3px solid var(--accent); outline-offset: 2px; }
.video-card:has(.video-card__open):hover .video-card__title { color: var(--accent); }
.video-card:has(.video-card__open):hover .video-card__image { transform: scale(1.04); }
.video-card:has(.video-card__open):hover .video-card__play circle { fill: var(--accent); fill-opacity: 1; }
.video-card:has(.video-card__open):hover .video-card__play path { fill: var(--on-accent); }
.video-card__length { position: absolute; right: 12px; bottom: 12px; padding: 3px 7px; background: rgba(12, 14, 16, .8); font-size: 12px; font-weight: 600; }
.video-card__title { font-size: 19px; font-weight: 700; line-height: 1.3; }
.video-card__format { font-size: 15px; }
.video-card__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 15px; }
.video-card__watch { position: relative; z-index: 2; font-weight: 600; }
.video-card__media .tag { position: absolute; top: 12px; left: 12px; z-index: 1; }

.tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { padding: 4px 8px; color: var(--bg); font-size: 12px; font-weight: 700; letter-spacing: .05em; line-height: 1.5; text-transform: uppercase; }
.tag--amazon { background: var(--amazon); }
.tag--tiktok { background: var(--tiktok); }
.tag--instagram { background: var(--instagram); }
.tag--youtube, .tag--shorts { background: var(--youtube); }

.filter-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; }
.filters[hidden] { display: none; }
.pill { min-height: 44px; padding: 11px 22px 11px 16px; border: 0; background: var(--surface-high); color: var(--text); font: inherit; font-size: 14px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.pill[aria-pressed="true"] { background: var(--accent); color: var(--on-accent); }

/* Video player */
html:has(.player[open]) { overflow: hidden; }
.player { width: min(1120px, calc(100vw - 48px)); max-width: none; max-height: calc(100dvh - 48px); padding: 0; border: 0; overflow: auto; background: var(--surface-high); color: var(--text); }
.player::backdrop { background: rgba(12, 14, 16, .88); }
.player__inner { display: flex; }
.player__media { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; justify-content: center; background: #000; }
.player__media iframe, .player__media video { display: block; width: 100%; height: 100%; border: 0; background: #000; }
.player__frame { width: 100%; aspect-ratio: 16 / 9; }
.player.is-vertical { width: fit-content; }
.player.is-vertical .player__frame { width: auto; height: min(760px, calc(100dvh - 48px)); aspect-ratio: 9 / 16; }
.player.is-instagram .player__frame { aspect-ratio: 400 / 720; }
.player__side { position: relative; flex: 0 0 300px; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 56px 28px 28px; }
.player__title { font-size: 22px; font-weight: 700; line-height: 1.25; }
.player__disclosure { margin-top: -6px; }
.player__side .btn { margin-top: auto; }
.player__watch { font-size: 15px; font-weight: 600; }
.player__watch[hidden] { display: none; }
.player__close { position: absolute; top: 10px; right: 10px; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; background: var(--surface-bright); color: var(--text); cursor: pointer; }
.player__close:hover { color: var(--accent); }
.player__close .icon { transform: rotate(45deg); }

/* Services */
.services-intro { max-width: 56ch; }
.service-cards { display: flex; flex-wrap: wrap; gap: 20px; }
.service-card { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px; padding: 32px; background: var(--surface-high); }
.service-card__title { font-size: 34px; }
.price { font-size: 48px; color: var(--accent); }
.price--lg { font-size: 56px; }
.price__prefix { font-size: 26px; }
.price--lg .price__prefix { font-size: 30px; }
.price__note { font-family: var(--font-body); font-size: 15px; font-style: normal; font-weight: 500; color: var(--text-muted); text-transform: none; }
.addon-note { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 20px 24px; border: 1px solid var(--line-strong); }
.addon-note .mono { letter-spacing: .06em; }

.service-wide { display: flex; flex-wrap: wrap; gap: 32px 56px; padding: 40px; background: var(--surface-high); scroll-margin-top: 24px; }
.service-wide__main { flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.service-wide__side { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.service-wide__title { font-size: 44px; }
.service-wide__desc { max-width: 48ch; }
.includes { display: flex; flex-direction: column; gap: 10px; padding: 0; list-style: none; }
.includes li { display: flex; gap: 10px; align-items: flex-start; }
.includes .icon { flex: 0 0 18px; margin-top: 4px; color: var(--accent); stroke-width: 2.5; }

.addons { display: flex; flex-wrap: wrap; gap: 20px; }
.addon { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 28px; background: var(--surface-high); }
.addon__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; }
.addon__title { font-size: 22px; font-weight: 700; }
.addon__price { font-size: 32px; color: var(--accent); }

/* How it works */
.how { display: flex; flex-wrap: wrap; gap: 32px 64px; padding-block: 88px; }
.how__intro { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.how__lede { max-width: 36ch; }
.how__body { flex: 2 1 480px; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.steps { display: flex; flex-direction: column; padding: 0; list-style: none; color: var(--text-muted); }
.step { display: flex; align-items: center; gap: 20px; padding-block: 18px; border-bottom: 1px solid var(--line); }
.step:last-child { border-bottom: 0; }
.step__icon { flex: 0 0 52px; display: flex; align-items: center; justify-content: center; height: 52px; background: var(--surface-high); color: var(--accent); }
.step__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: 16px; }
.step__title { color: var(--text); font-size: 18px; font-weight: 700; }
.step__timing { flex: 0 0 auto; font-size: 12px; }
.fine-print { display: flex; flex-direction: column; gap: 4px; color: var(--text-muted); font-size: 13px; line-height: 1.5; }

/* Closing CTA */
.cta-wrap { padding: 0 var(--gutter) 96px; }
.cta-band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px; max-width: calc(var(--max-width) - 2 * var(--gutter)); margin-inline: auto; padding: 64px 48px; background-color: var(--accent); color: var(--on-accent); }
.cta-band__text { flex: 999 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.cta-band__title { font-size: clamp(44px, 6vw, 64px); line-height: .95; }
.cta-band__copy { max-width: 48ch; color: var(--on-accent-soft); font-size: 18px; }
.cta-band .email { color: var(--on-accent); }

/* FAQ */
.faq-layout { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 48px 64px; }
.faq-groups { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 44px; }
.faq-group { display: flex; flex-direction: column; gap: 10px; }
.faq-group .label { margin-bottom: 6px; }
.qa { background: var(--surface); }
.qa[open] { background: var(--surface-high); }
.qa summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; padding: 20px 24px; font-size: 19px; font-weight: 700; list-style: none; cursor: pointer; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary:hover { color: var(--accent); }
.qa summary:focus-visible { outline: none; box-shadow: inset 0 0 0 3px var(--accent); }
.qa summary .icon { flex: 0 0 auto; color: var(--accent); stroke-width: 2.5; transition: transform .15s; }
.qa[open] summary .icon { transform: rotate(45deg); }
.qa p { max-width: 62ch; padding: 0 24px 22px; color: var(--text-soft); }
.ask { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 14px; padding: 32px; background: var(--surface-high); }
.ask__title { font-size: 36px; }
.ask__email { font-weight: 700; }
.ask .btn { align-self: flex-start; }

/* Send a Product */
.send-layout { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 48px 64px; padding-block: 80px 96px; }
.send-intro { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 28px; }
.send-intro__lede { font-size: 19px; max-width: 40ch; }
.next-steps { display: flex; flex-direction: column; gap: 10px; padding-left: 20px; color: var(--text-soft); }
.send-form { flex: 1.4 1 520px; min-width: 0; padding: 40px; background: var(--surface-high); }
.send-form form { display: flex; flex-direction: column; gap: 22px; }
.field-row { display: flex; flex-wrap: wrap; gap: 18px; }
.field-row .fld { flex: 1 1 220px; }
.fld { display: flex; flex-direction: column; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.fld > label, .fld > legend { padding: 0; color: var(--text); font-size: 14px; font-weight: 600; }
.fld > legend { margin-bottom: 8px; }
.opt { font-weight: 400; color: var(--text-muted); }
.help { color: var(--text-muted); font-size: 13px; }
.inp { width: 100%; min-height: 48px; padding: 13px 14px; border: 1px solid var(--line-strong); border-radius: 0; background: var(--surface-low); color: var(--text); font: inherit; font-size: 16px; }
.inp::placeholder { color: #7d7f82; }
.inp:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
textarea.inp { display: block; resize: vertical; }
.wpcf7-form-control-wrap { display: block; }
.wpcf7-checkbox { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wpcf7-list-item { display: block; margin: 0; }
.wpcf7-list-item label { display: flex; align-items: center; gap: 10px; min-height: 44px; height: 100%; padding: 8px 14px; border: 1px solid var(--line-strong); background: var(--surface-low); font-size: 15px; cursor: pointer; }
.wpcf7-list-item label:has(input:checked) { border-color: var(--accent); }
.wpcf7-list-item input { flex: 0 0 18px; width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }
.form-submit { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; }
.form-submit .help { flex: 1 1 200px; }
.send-form .wpcf7-not-valid { border-color: var(--accent); }
.send-form .wpcf7-not-valid-tip { display: block; margin-top: 6px; color: var(--accent); font-size: 14px; font-weight: 500; }
.send-form .wpcf7-spinner { margin: 0; background-color: var(--text-muted); }
.send-form .wpcf7-response-output { margin: 0; padding: 12px 14px; border: 1px solid var(--accent); color: var(--text); font-size: 15px; }
.send-form .wpcf7 form.init .wpcf7-response-output, .send-form .wpcf7 form.resetting .wpcf7-response-output, .send-form .wpcf7 form.submitting .wpcf7-response-output { display: none; }

/* Thanks and 404 */
.message-page { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; padding-block: 120px 140px; }
.message-page .button-row { margin-top: 8px; }
.message-page__icon { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; background: var(--accent); color: var(--on-accent); }
.message-page__icon .icon { stroke-width: 3; }

/* Policy pages */
.prose { max-width: 780px; padding-block: 64px 96px; color: var(--text-soft); }
.prose > * + * { margin-top: 1em; }
.prose h2, .prose h3 { color: var(--text); }
.prose a { color: var(--accent); }

/* Responsive */
@media (max-width: 900px) {
	.reel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	/* Mobile menu: only collapses once main.js has shown the toggle, so links stay usable without JavaScript. */
	.menu-toggle:not([hidden]) { display: inline-flex; }
	.menu-toggle:not([hidden]) + .site-nav__links { display: none; position: absolute; inset: 100% 0 auto; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 24px 28px; background: var(--bg); border-bottom: 1px solid var(--line); }
	.menu-toggle[aria-expanded="true"] + .site-nav__links { display: flex; }
	.site-header.is-menu-open { background: var(--bg); }
	.site-header.is-hidden { transform: translateY(-100%); }
	.menu-toggle:not([hidden]) + .site-nav__links { max-height: calc(100dvh - var(--header-h)); overflow-y: auto; }
	.site-nav__links .site-nav__menu { flex-direction: column; align-items: stretch; gap: 0; }
	.site-nav__links .site-nav__menu a { display: flex; align-items: center; min-height: 56px; border-bottom: 1px solid var(--line); font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 28px; letter-spacing: .01em; }
	.site-nav__links > .btn { justify-content: center; margin-top: 24px; }
	.player, .player.is-vertical { width: 100vw; height: 100dvh; max-height: 100dvh; }
	.player__inner { flex-direction: column; min-height: 100%; }
	.player__media { flex: 1 1 auto; min-height: 0; }
	.player.is-vertical .player__frame { width: 100%; height: auto; max-height: 68dvh; }
	.player__side { flex: 0 0 auto; padding: 18px 24px 24px; }
	.player__side .btn { margin-top: 4px; }
	.player__close { position: fixed; z-index: 2; }
}
@media (max-width: 560px) {
	.reel { grid-template-columns: minmax(0, 1fr); }
	.section, .how { padding-block: 64px; }
	.section--grid { padding-block: 40px 72px; }
	.page-header__inner { padding-block: 64px 48px; }
	.hero { min-height: 720px; }
	.hero__inner { padding-block: 200px 64px; }
	.hero__placeholder { top: auto; bottom: 16px; transform: translateX(-50%); font-size: 11px; }
	.service-card, .ask { padding: 24px; }
	.service-wide, .send-form { padding: 24px; }
	.send-layout { padding-block: 56px 72px; }
	.cta-band { padding: 44px 24px 56px; }
	.cta-wrap { padding-bottom: 72px; }
	.step { flex-wrap: wrap; gap: 12px 16px; }
	.step__text { flex: 1 1 0; }
	.step__timing { flex-basis: 100%; }
	.wpcf7-checkbox { grid-template-columns: minmax(0, 1fr); }
	.message-page { padding-block: 72px 96px; }
}
@media (max-width: 600px) {
	/* WordPress's admin bar scrolls away at this width, so the header sticks to the very top. */
	.admin-bar .site-header { top: 0; }
}
@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; }
}