/*
Theme Name: Measured AI
Theme URI: https://measuredai.com.au
Author: Measured AI
Description: Block theme for Measured AI. Warm paper, ink, one terracotta accent; Fraunces and JetBrains Mono; the dimension line as the house device.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.2
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: measured-ai
*/

/* ---------- fonts (local, no third-party request) ---------- */
@font-face {
  font-family: "Fraunces";
  src: url("assets/fonts/Fraunces-var.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("assets/fonts/JetBrainsMono-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("assets/fonts/JetBrainsMono-Medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}

/* ---------- base ---------- */
html { font-optical-sizing: auto; -webkit-text-size-adjust: 100%; }
body { text-rendering: optimizeLegibility; }
h1, h2, h3, h4 { text-wrap: balance; }
.mai-card p, .mai-stat p, .mai-step p, .wp-block-column p { max-width: none; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid var(--wp--preset--color--accent); outline-offset: 3px;
}
::selection { background: var(--wp--preset--color--accent-tint); }
img { height: auto; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }

/* ---------- the dimension line ---------- */
.is-style-dimensioned {
  display: block; position: relative;
  padding-bottom: calc(var(--wp--preset--spacing--30) + 24px);
}
.is-style-dimensioned::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 24px;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 24'><path d='M1 2H13M7 2V22M1 22H13' stroke='%231c1917' stroke-width='2.5' stroke-linecap='round' fill='none'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 24'><path d='M1 2H13M7 2V22M1 22H13' stroke='%231c1917' stroke-width='2.5' stroke-linecap='round' fill='none'/></svg>"),
    linear-gradient(var(--mai-line, #1c1917), var(--mai-line, #1c1917));
  background-repeat: no-repeat;
  background-position: left center, right center, center center;
  background-size: 14px 24px, 14px 24px, calc(100% - 14px) 1.5px;
}
.has-ink-background-color .is-style-dimensioned::after,
.is-style-dimensioned.has-paper-color::after {
  --mai-line: #fbfaf7;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 24'><path d='M1 2H13M7 2V22M1 22H13' stroke='%23fbfaf7' stroke-width='2.5' stroke-linecap='round' fill='none'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 24'><path d='M1 2H13M7 2V22M1 22H13' stroke='%23fbfaf7' stroke-width='2.5' stroke-linecap='round' fill='none'/></svg>"),
    linear-gradient(#fbfaf7, #fbfaf7);
}

/* ---------- utility text styles ---------- */
.mai-eyebrow, .is-style-eyebrow {
  font-family: var(--wp--preset--font-family--mono) !important;
  font-size: 12px !important; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--wp--preset--color--muted);
}
.has-ink-background-color .mai-eyebrow, .has-ink-background-color .is-style-eyebrow { color: var(--wp--preset--color--muted-on-ink); }
.mai-number { font-family: var(--wp--preset--font-family--mono); font-weight: 500; font-variant-numeric: tabular-nums; }
.mai-ai { font-family: var(--wp--preset--font-family--mono); font-weight: 500; letter-spacing: 0.22em; color: var(--wp--preset--color--accent); border: 1.5px solid currentColor; border-radius: 4px; padding: 2px 4px 1px 6px; font-size: 0.5em; vertical-align: 0.45em; }

/* ---------- header ---------- */
.mai-header { border-bottom: 1px solid var(--wp--preset--color--rule); }
.mai-logo img { width: 168px; height: auto; display: block; }
.mai-header .wp-block-navigation { font-family: var(--wp--preset--font-family--mono); font-size: 12px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; }
.mai-header .wp-block-navigation a:hover { color: var(--wp--preset--color--accent); text-decoration: none; }
.mai-header .wp-block-navigation .wp-block-navigation-item.current-menu-item > a { color: var(--wp--preset--color--accent); }

/* ---------- footer ---------- */
.mai-footer { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--paper); }
.mai-footer a { color: var(--wp--preset--color--paper); }
.mai-footer a:hover { color: var(--wp--preset--color--accent-on-ink); }
.mai-footer .mai-logo img { width: 140px; }
.mai-footer .wp-block-navigation { font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; }
.mai-footer-mark { display: block; width: 240px; height: auto; opacity: 0.9; }

/* ---------- buttons ---------- */
.wp-block-button__link { font-family: var(--wp--preset--font-family--mono); font-size: 13px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; padding: 14px 22px; border-radius: 6px; transition: background-color .15s ease, color .15s ease; }
.wp-block-button__link:hover { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--paper); }
.is-style-outline .wp-block-button__link { border: 1.5px solid currentColor; background: transparent; color: var(--wp--preset--color--ink); }
.is-style-outline .wp-block-button__link:hover { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); background: transparent; }
.has-ink-background-color .is-style-outline .wp-block-button__link { color: var(--wp--preset--color--paper); }
.is-style-accent .wp-block-button__link { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--paper); }
.is-style-accent .wp-block-button__link:hover { background: var(--wp--preset--color--accent-deep); }

/* ---------- cards, pricing, numbers ---------- */
.mai-card { border: 1px solid var(--wp--preset--color--rule); border-radius: 6px; padding: var(--wp--preset--spacing--50); background: var(--wp--preset--color--paper); }
.mai-card--featured { border-color: var(--wp--preset--color--ink); box-shadow: inset 0 3px 0 var(--wp--preset--color--accent); }
.mai-price { font-family: var(--wp--preset--font-family--mono); font-weight: 500; font-size: 32px; letter-spacing: -0.02em; line-height: 1; font-variant-numeric: tabular-nums; margin: 0; }
.mai-price small { display: inline-block; white-space: nowrap; font-size: 12px; letter-spacing: 0.1em; font-weight: 400; color: var(--wp--preset--color--muted); margin-left: 4px; }
.mai-list { list-style: none; padding: 0; margin: 0; }
.mai-list li { position: relative; padding-left: 22px; padding-block: 5px; border-top: 1px solid var(--wp--preset--color--rule); font-size: 15px; line-height: 1.5; }
.mai-list li:first-child { border-top: 0; }
.mai-list li::before { content: ""; position: absolute; left: 0; top: 14px; width: 12px; height: 1.5px; background: var(--wp--preset--color--accent); }
.mai-list li.mai-list__inherit { color: var(--wp--preset--color--muted); }
.mai-list li.mai-list__inherit::before { background: var(--wp--preset--color--muted); }
.mai-stat { border-top: 1.5px solid var(--wp--preset--color--ink); padding-top: var(--wp--preset--spacing--30); }
.mai-stat .mai-stat__value { font-family: var(--wp--preset--font-family--mono); font-weight: 500; font-size: clamp(36px, 5vw, 48px); letter-spacing: -0.02em; line-height: 1; margin: 0 0 8px; font-variant-numeric: tabular-nums; }
.mai-stat .mai-stat__value em { font-style: normal; color: var(--wp--preset--color--accent); }
.mai-stat p { margin: 0; }
.mai-step { position: relative; padding-left: 56px; }
.mai-step__n { position: absolute; left: 0; top: 2px; width: 40px; height: 40px; border: 1.5px solid var(--wp--preset--color--ink); border-radius: 6px; display: grid; place-items: center; font-family: var(--wp--preset--font-family--mono); font-weight: 500; font-size: 14px; }
.mai-compare td, .mai-compare th { padding: 12px 14px; border-top: 1px solid var(--wp--preset--color--rule); text-align: left; vertical-align: top; font-size: 15px; }
.mai-compare th { font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--muted); border-top: 0; font-weight: 500; }
.mai-compare .mai-number { white-space: nowrap; }
.mai-compare .mai-us { color: var(--wp--preset--color--accent); }
.wp-block-table.mai-compare table { border-collapse: collapse; }

/* ---------- contact form ---------- */
.mai-form { display: grid; gap: var(--wp--preset--spacing--30); max-width: 560px; }
.mai-form label { display: block; font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--muted); margin-bottom: 6px; }
.mai-form input, .mai-form textarea, .mai-form select { width: 100%; font: inherit; font-size: 16px; padding: 12px 14px; border: 1px solid var(--wp--preset--color--rule); border-radius: 4px; background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); box-sizing: border-box; }
.mai-form input:focus, .mai-form textarea:focus { border-color: var(--wp--preset--color--ink); }
.mai-form button { font-family: var(--wp--preset--font-family--mono); font-size: 13px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; padding: 14px 22px; border-radius: 6px; border: 0; background: var(--wp--preset--color--ink); color: var(--wp--preset--color--paper); cursor: pointer; justify-self: start; }
.mai-form button:hover { background: var(--wp--preset--color--accent); }
.mai-form .mai-hp { position: absolute; left: -9999px; }
.mai-notice { border-left: 3px solid var(--wp--preset--color--accent); padding: 12px 16px; background: var(--wp--preset--color--accent-tint); max-width: 560px; }

/* ---------- responsive ---------- */
@media (max-width: 781px) {
  .mai-price { font-size: 30px; }
  .mai-logo img { width: 140px; }
  .mai-header .wp-block-navigation__responsive-container-open { color: var(--wp--preset--color--ink); }
}
.mai-stat .mai-stat__value em { font-size: 0.5em; letter-spacing: 0; }
.mai-footer .wp-block-navigation.is-vertical, .mai-footer .wp-block-navigation.is-vertical .wp-block-navigation__container { flex-direction: column; align-items: flex-start; }
.mai-compare td:first-child, .mai-compare th:first-child { padding-left: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.page-template-page-landing .wp-block-post-content > * + * { margin-block-start: 0; }

/* ---------- notes (blog posts) ---------- */
.single-post .wp-block-post-content > * + * { margin-block-start: 1.15em; }
.single-post .wp-block-post-content > h2 { margin-block-start: 1.8em; font-size: var(--wp--preset--font-size--heading); }
.single-post .wp-block-post-content > h3 { margin-block-start: 1.5em; font-size: var(--wp--preset--font-size--subheading); }
.single-post .wp-block-post-content > .alignfull { margin-block-start: var(--wp--preset--spacing--70); }
.single-post .wp-block-post-content li + li { margin-top: .4em; }
.single-post .mai-stat { margin-block-start: 0; }
.wp-block-table.mai-compare table, .wp-block-table.mai-compare td, .wp-block-table.mai-compare th { border: 0; }
.wp-block-table.mai-compare thead { border-bottom: 1.5px solid var(--wp--preset--color--ink); }
.wp-block-table.mai-compare td { border-top: 1px solid var(--wp--preset--color--rule); }
.wp-block-table.mai-compare { overflow-x: auto; }
.blog .wp-block-post-title a, .archive .wp-block-post-title a { color: var(--wp--preset--color--ink); text-decoration: none; }
.blog .wp-block-post-title a:hover { color: var(--wp--preset--color--accent); }
