/*
Theme Name: Karen Van Creveld — Coming Soon
Description: Editable text and CSS based on the client's coming-soon reference.
Version: 1.2.0
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: karen-coming-soon
*/
@font-face {
  font-family: 'Karen Belleza';
  src: url('assets/fonts/Belleza-Regular.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Karen Tenor';
  src: url('assets/fonts/TenorSans-Regular.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
:root { --bg: #fffbf8; --accent: #780c2c; --ink: #292929; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: 'Karen Belleza', sans-serif; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > .page { margin: 0; }
.page { min-height: 100svh; display: grid; place-items: center; padding: 0; }
.hero { --u: min(calc(100vw / 1672), calc(100svh / 941)); position: relative; width: calc(1672 * var(--u)); height: calc(941 * var(--u)); text-align: center; }
.hero > * { margin: 0; }
.brand, .role, .intro, .status, .email-wrap { position: absolute; left: 0; width: 100%; margin: 0; font-family: 'Karen Belleza', sans-serif; font-weight: 400; font-style: normal; text-align: center; }
.brand { top: calc(219 * var(--u)); color: var(--accent); font-size: calc(86 * var(--u)); line-height: 1.15; letter-spacing: calc(.45 * var(--u)); }
.role { top: calc(369 * var(--u)); font-family: 'Karen Tenor', sans-serif; font-size: calc(33 * var(--u)); line-height: 1.15; letter-spacing: calc(3.08 * var(--u)); }
.divider { position: absolute; top: calc(465 * var(--u)); left: 50%; width: calc(129 * var(--u)); height: max(1px, calc(2 * var(--u))); transform: translateX(-50%); background: var(--accent); border: 0; }
.intro { top: calc(518 * var(--u)); font-family: 'Karen Tenor', sans-serif; font-size: calc(27 * var(--u)); line-height: 1.2; letter-spacing: calc(1.37 * var(--u)); }
.status { top: calc(636 * var(--u)); color: var(--accent); font-size: calc(35 * var(--u)); line-height: 1.2; letter-spacing: calc(8.53 * var(--u)); text-transform: uppercase; }
.email-wrap { top: calc(746 * var(--u)); font-family: 'Karen Tenor', sans-serif; font-size: calc(23 * var(--u)); line-height: 1.2; letter-spacing: calc(1.34 * var(--u)); }
.email { display: inline-block; color: inherit; text-decoration: none; }
.email:hover { color: var(--accent); }
.email:focus-visible { outline: 2px solid var(--accent); outline-offset: 7px; border-radius: 1px; }
body.admin-bar .page { min-height: calc(100svh - 32px); }
body.admin-bar .hero { --u: min(calc(100vw / 1672), calc((100svh - 32px) / 941)); }
@media (max-width: 767px) {
  .page { padding: 56px 22px; }
  .hero { position: static; width: 100%; height: auto; display: flex; flex-direction: column; align-items: center; }
  .brand, .role, .intro, .status, .email-wrap { position: static; width: 100%; }
  .brand { font-size: min(56px, calc((100vw - 44px) * .1)); line-height: 1.2; letter-spacing: .01em; white-space: nowrap; }
  .hero > .role { margin-top: 38px; max-width: 560px; font-size: clamp(19px, 3.6vw, 27px); line-height: 1.6; letter-spacing: .115em; text-wrap: balance; }
  .hero > .divider { position: static; transform: none; width: 78px; height: 1.5px; margin-top: 28px; }
  .hero > .intro { margin-top: 28px; max-width: 560px; font-size: clamp(17px, 3.3vw, 24px); line-height: 1.65; letter-spacing: .09em; text-wrap: balance; }
  .hero > .status { margin-top: 43px; font-size: clamp(17px, 3.8vw, 26px); line-height: 1.4; letter-spacing: .20em; white-space: nowrap; }
  .hero > .email-wrap { margin-top: 30px; font-size: clamp(16px, 3.3vw, 22px); line-height: 1.5; letter-spacing: .08em; }
  .email { padding-block: 10px; min-height: 44px; }
  body.admin-bar .page { min-height: calc(100svh - 46px); }
}
@media (max-height: 500px) and (min-width: 768px) {
  .page { min-height: 500px; }
  .hero { --u: min(calc(100vw / 1672), calc(500px / 941)); }
}