/* Google Fonts: redistributed under the OFL licenses in /static/fonts/. */
/* latin-ext */
@font-face {
  font-family: 'DM Serif Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-e026521e59b7b3e5.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Serif Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-ed8b291611e32fa2.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Serif Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-3af47815d6183efc.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Serif Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-fdf61e20fd2c0108.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-de37de877dc17e45.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-c268b459a9329e59.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-2fb2e8cbfd52ae46.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-6bbb044ab420e07e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-3911b66d9f2e005a.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/static/fonts/font-a30ddcd349703aff.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/font-de37de877dc17e45.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/font-c268b459a9329e59.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/font-2fb2e8cbfd52ae46.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/font-6bbb044ab420e07e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/font-3911b66d9f2e005a.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/static/fonts/font-a30ddcd349703aff.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/fonts/font-de37de877dc17e45.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/fonts/font-c268b459a9329e59.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/fonts/font-2fb2e8cbfd52ae46.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/fonts/font-6bbb044ab420e07e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/fonts/font-3911b66d9f2e005a.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/static/fonts/font-a30ddcd349703aff.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/font-de37de877dc17e45.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/font-c268b459a9329e59.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/font-2fb2e8cbfd52ae46.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/font-6bbb044ab420e07e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/font-3911b66d9f2e005a.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/static/fonts/font-a30ddcd349703aff.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/static/fonts/font-de37de877dc17e45.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/static/fonts/font-c268b459a9329e59.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/static/fonts/font-2fb2e8cbfd52ae46.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/static/fonts/font-6bbb044ab420e07e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/static/fonts/font-3911b66d9f2e005a.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/static/fonts/font-a30ddcd349703aff.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --ink: #051c2c;
    --ink-deep: #03131f;
    --ink-soft: #40545e;
    --paper: #f7f2e7;
    --paper-bright: #fffdf8;
    --paper-shade: #e9dfca;
    --line: color-mix(in srgb, var(--ink) 17%, transparent);
    --clay: #aa8432;
    --clay-dark: #765310;
    --sun: #c2a25a;
    --sage: #dde3de;
    --display: "DM Serif Display", Georgia, serif;
    --body: "Manrope", sans-serif;
    --ease-out: cubic-bezier(.16, 1, .3, 1);
    --surface-page: color-mix(in srgb, var(--paper-bright) 82%, transparent);
    --surface-hero: color-mix(in srgb, var(--paper-shade) 28%, transparent);
    --surface-paper: color-mix(in srgb, var(--paper-shade) 87%, transparent);
    --surface-paper-bright: color-mix(in srgb, var(--paper-bright) 84%, transparent);
    --surface-sage: color-mix(in srgb, var(--sage) 85%, transparent);
    --surface-ink: color-mix(in srgb, var(--ink) 89%, transparent);
}

* { box-sizing: border-box; }
html { background: var(--ink-deep); scroll-behavior: smooth; scroll-padding-top: 6rem; }
body { background: var(--ink-deep); color: var(--ink); font-family: var(--body); line-height: 1.5; margin: 0; text-rendering: optimizeLegibility; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
::selection { background: color-mix(in srgb, var(--sun) 68%, var(--paper)); color: var(--ink-deep); }
:focus-visible { outline: 3px solid var(--clay); outline-offset: 4px; }
input::placeholder, textarea::placeholder { color: color-mix(in srgb, var(--ink-soft) 74%, transparent); opacity: 1; }
.site-shell { min-height: 100svh; overflow: clip; position: relative; z-index: 1; }
main { background: var(--surface-page); }
body:has(.landing-hero) main, body:has(.services-page) main, body:has(.contact-page) main { background: transparent; }
.section-wrap { margin-inline: auto; max-width: none; padding-inline: clamp(1.25rem, 4vw, 6rem); }
.skip-link { background: var(--sun); color: var(--ink-deep); font-weight: 800; left: 1rem; padding: .7rem 1rem; position: fixed; top: -4rem; z-index: 20; }
.skip-link:focus { top: 1rem; }
.sr-only { clip: rect(0, 0, 0, 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }

/* Keep main navigation above the experience selector (z-index: 25). */
.site-header { align-items: center; background: color-mix(in srgb, var(--paper) 92%, transparent); border-bottom: 1px solid transparent; display: flex; height: 82px; justify-content: space-between; padding-inline: clamp(1.25rem, 4vw, 3.25rem); position: relative; transition: background .25s ease, border-color .25s ease, height .25s var(--ease-out); z-index: 30; }
.site-header.scrolled { background: color-mix(in srgb, var(--paper) 98%, transparent); border-color: var(--line); height: 70px; position: sticky; top: 0; }
.brand { align-items: center; display: inline-flex; flex: 0 0 auto; line-height: 1; }
.brand-wordmark { font-family: var(--display); font-size: 2.1rem; letter-spacing: -.075em; }
.brand-descriptor { border-left: 1px solid var(--line); color: var(--ink-soft); font-size: .875rem; font-weight: 800; letter-spacing: .045em; line-height: 1.3; margin-left: .9rem; padding-left: .9rem; text-transform: uppercase; }
.brand-mata { color: var(--ink); }.brand-dot { color: var(--sun); }.brand-works { color: var(--ink); }
.site-nav { align-items: center; display: flex; gap: clamp(.85rem, 1.5vw, 1.55rem); }
.site-nav > a { border-bottom: 1px solid transparent; color: var(--ink-soft); font-size: .875rem; font-weight: 800; letter-spacing: .015em; padding-block: .3rem; white-space: nowrap; }
.site-nav > a:not(.nav-cta):hover, .site-nav > a:not(.nav-cta):focus-visible, .site-nav > a:not(.nav-cta)[aria-current="page"] { border-color: var(--clay); color: var(--ink); }
.site-nav .nav-cta { background: var(--ink); border: 1px solid var(--ink); color: var(--paper); padding: .72rem .88rem; transition: background .18s ease, color .18s ease, transform .18s var(--ease-out); }
.site-nav .nav-cta span { color: var(--sun); font-size: .95rem; margin-left: .2rem; }
.site-nav .nav-cta:hover, .site-nav .nav-cta:focus-visible { background: var(--clay-dark); border-color: var(--clay); transform: translateY(-2px); }
.site-nav .nav-cta[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--sun); color: var(--paper); }
.menu-toggle { background: transparent; border: 0; display: none; height: 34px; padding: 0; position: relative; width: 40px; }
.menu-toggle span:not(.sr-only) { background: var(--ink); display: block; height: 2px; left: 7px; position: absolute; transition: transform .2s var(--ease-out); width: 26px; }
.menu-toggle span:nth-child(2) { top: 12px; }.menu-toggle span:nth-child(3) { top: 21px; }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(4.5px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-4.5px) rotate(-45deg); }

.eyebrow { align-items: center; color: var(--clay-dark); display: flex; font-size: .875rem; font-weight: 800; gap: .55rem; letter-spacing: .09em; margin: 0 0 1.1rem; text-transform: uppercase; }
.eyebrow-dot { background: var(--clay); border-radius: 50%; height: 7px; width: 7px; }.eyebrow-light { color: color-mix(in srgb, var(--paper) 71%, transparent); }.eyebrow-light .eyebrow-dot { background: var(--sun); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--display); font-weight: 400; }
h1 em, h2 em { color: var(--clay); font-style: italic; }
.button { align-items: center; border: 1px solid transparent; display: inline-flex; font-size: .875rem; font-weight: 800; gap: .45rem; justify-content: center; letter-spacing: .01em; min-height: 48px; padding: .8rem 1rem; transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s var(--ease-out); }
.button span { color: var(--sun); font-size: 1.05rem; }.button-primary { background: var(--sun); color: var(--ink-deep); }.button-primary:hover, .button-primary:focus-visible { background: var(--clay-dark); box-shadow: 5px 5px 0 var(--ink); color: var(--paper); transform: translate(-2px, -2px); }.button-primary:hover span, .button-primary:focus-visible span { color: var(--paper); }
.button-sun { background: var(--sun); color: var(--ink-deep); }.button-sun:hover, .button-sun:focus-visible { background: var(--clay-dark); box-shadow: 5px 5px 0 var(--paper); color: var(--paper); transform: translate(-2px, -2px); }.button-sun:hover span, .button-sun:focus-visible span { color: var(--sun); }
.text-link { border-bottom: 1px solid color-mix(in srgb, var(--ink) 45%, transparent); color: var(--ink); font-size: .875rem; font-weight: 800; padding-bottom: .15rem; }.text-link span { color: var(--clay); font-size: 1rem; margin-left: .25rem; }.text-link:hover, .text-link:focus-visible { border-color: var(--clay); }.text-link-light { border-color: color-mix(in srgb, var(--paper) 48%, transparent); color: var(--paper); }

/* Landing */
.landing-hero { background: var(--surface-ink); color: var(--paper); min-height: calc(100svh - 82px); overflow: hidden; position: relative; }
.landing-layout { align-items: center; display: grid; gap: clamp(3rem, 8vw, 8rem); grid-template-columns: minmax(0, .94fr) minmax(390px, .82fr); min-height: calc(100svh - 82px); padding-block: clamp(1.75rem, 4vh, 3rem); position: relative; }
.landing-copy h1 { font-size: clamp(3.35rem, 5.6vw, 6.4rem); letter-spacing: -.085em; line-height: .88; margin-bottom: 1.25rem; max-width: 715px; }.landing-copy h1 em { color: var(--sun); }
.landing-copy > p:not(.eyebrow):not(.landing-proof) { color: color-mix(in srgb, var(--paper) 74%, transparent); font-size: clamp(.9rem, 1.2vw, 1.02rem); line-height: 1.65; margin-bottom: 1.35rem; max-width: 555px; }
.landing-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1.1rem; }.landing-proof { color: color-mix(in srgb, var(--paper) 63%, transparent); font-size: .875rem; font-weight: 800; letter-spacing: .07em; margin: 1.25rem 0 0; text-transform: uppercase; }
.landing-desk { background: var(--paper); box-shadow: 15px 15px 0 color-mix(in srgb, var(--sun) 30%, transparent); color: var(--ink); display: grid; grid-template-columns: 1fr 1fr; padding: clamp(1.25rem, 2.5vw, 2rem); position: relative; transform: rotate(1.5deg); }
.desk-label { border-bottom: 1px solid var(--line); color: var(--ink-soft); font-size: .875rem; font-weight: 800; grid-column: 1 / -1; letter-spacing: .1em; margin: 0; padding-bottom: .8rem; text-transform: uppercase; }
.desk-path { border-bottom: 1px solid var(--line); min-height: 156px; padding: 1rem .85rem .9rem 0; position: relative; }.desk-path:nth-of-type(odd) { border-left: 1px solid var(--line); padding-left: 1rem; }.desk-path:nth-last-child(-n+2) { border-bottom: 0; }
.desk-path span { color: var(--clay); display: block; font-family: var(--display); font-size: 1.25rem; letter-spacing: -.05em; }.desk-path strong { display: block; font-family: var(--display); font-size: clamp(1.45rem, 2.2vw, 2rem); font-weight: 400; letter-spacing: -.05em; margin: .65rem 0 .3rem; }.desk-path small { color: var(--ink-soft); display: block; font-size: .875rem; font-weight: 700; line-height: 1.55; max-width: 180px; }.desk-path i { bottom: .85rem; color: var(--clay); font-size: 1.2rem; font-style: normal; opacity: 0; position: absolute; right: .1rem; transition: opacity .18s ease, transform .18s var(--ease-out); }.desk-path:hover { background: color-mix(in srgb, var(--sun) 13%, var(--paper)); }.desk-path:hover i, .desk-path:focus-visible i { opacity: 1; transform: translate(2px, -2px); }

/* Shared page treatments */
.page-hero { padding-block: clamp(4.2rem, 8vw, 8rem); }.page-hero-paper { background: var(--surface-hero); }.page-hero-ink { background: var(--surface-ink); color: var(--paper); }.page-hero-layout { align-items: end; display: grid; gap: clamp(2rem, 7vw, 7rem); grid-template-columns: minmax(0, 1.05fr) minmax(260px, .55fr); }.page-hero h1 { font-size: clamp(3.4rem, 6.4vw, 6.6rem); letter-spacing: -.08em; line-height: .9; margin: 0; max-width: 760px; }.page-hero-ink h1 { color: var(--paper); }.page-hero-intro { color: var(--ink-soft); font-size: .91rem; line-height: 1.8; margin: 0; max-width: 420px; }.page-hero-ink .page-hero-intro { color: color-mix(in srgb, var(--paper) 72%, transparent); }
.section-heading { margin-bottom: clamp(2.5rem, 5vw, 4.8rem); max-width: 760px; }.section-heading h2 { font-size: clamp(2.7rem, 5.3vw, 5.2rem); letter-spacing: -.07em; line-height: .92; margin: 0; }
.closing-band { background: var(--surface-ink); color: var(--paper); padding-block: clamp(3.5rem, 7vw, 6.5rem); }.closing-band-layout { align-items: end; display: flex; gap: 2rem; justify-content: space-between; }.closing-band h2 { font-size: clamp(2.6rem, 5vw, 5rem); letter-spacing: -.07em; line-height: .91; margin: 0; max-width: 650px; }

/* Services */
.services-page { position: relative; }
.services-hero { background: var(--surface-paper); }
.services-ledger-surface { background: var(--surface-paper-bright); }
.services-closing { background: var(--surface-ink); }
.service-ledger { padding-bottom: clamp(4rem, 8vw, 8rem); padding-top: clamp(4.5rem, 8vw, 8.5rem); }.service-entry { border-top: 1px solid var(--line); display: grid; gap: 1.6rem; grid-template-columns: 72px minmax(245px, .85fr) minmax(280px, .7fr); padding-block: clamp(2.3rem, 4.5vw, 4.2rem); scroll-margin-top: 90px; }.service-entry:last-child { border-bottom: 1px solid var(--line); }.service-index { color: var(--clay); font-family: var(--display); font-size: 1.5rem; letter-spacing: -.06em; margin: 0; }.service-entry h2 { font-size: clamp(2rem, 3.45vw, 3.55rem); letter-spacing: -.06em; line-height: .98; margin: .2rem 0 0; }.service-entry-detail > p { color: var(--ink-soft); font-size: .875rem; line-height: 1.75; margin-bottom: 1.15rem; }.service-entry-detail ul { border-top: 1px solid var(--line); list-style: none; margin: 0; padding: 0; }.service-entry-detail li { border-bottom: 1px solid var(--line); color: var(--ink); font-size: .875rem; font-weight: 800; line-height: 1.45; padding: .7rem 0 .7rem 1.25rem; position: relative; }.service-entry-detail li::before { color: var(--clay); content: "•"; left: .18rem; position: absolute; }.service-note { border-top: 1px solid var(--line); font-size: .875rem !important; font-weight: 700; padding-top: .8rem; }

/* Pricing */
.pricing-principles { display: grid; gap: clamp(2.5rem, 8vw, 7rem); grid-template-columns: minmax(250px, .7fr) minmax(0, 1.3fr); padding-block: clamp(4.5rem, 9vw, 8rem); }.pricing-intro h2 { font-size: clamp(2.8rem, 4.8vw, 4.8rem); letter-spacing: -.07em; line-height: .92; margin: 0; }.pricing-principle-list { border-top: 1px solid var(--line); }.pricing-principle { border-bottom: 1px solid var(--line); display: grid; gap: 1.15rem; grid-template-columns: 50px minmax(150px, .65fr) minmax(230px, 1fr); padding-block: 1.35rem; }.pricing-principle > span { color: var(--clay); font-family: var(--display); font-size: 1.25rem; }.pricing-principle h3 { font-size: 1.55rem; letter-spacing: -.045em; margin: 0; }.pricing-principle p, .pricing-principle-detail { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; margin: 0; }.pricing-principle-detail > p { margin: 0; }.pricing-principle strong { color: var(--ink); }.pricing-volume-table-wrap { border-top: 1px solid var(--line); margin-top: 1rem; }.pricing-volume-table { border-collapse: collapse; margin: 0; width: 100%; }.pricing-volume-table caption { clip: rect(0, 0, 0, 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }.pricing-volume-table th, .pricing-volume-table td { border-bottom: 1px solid var(--line); padding: .55rem 0; text-align: left; }.pricing-volume-table th { color: var(--ink-soft); font-size: .875rem; font-weight: 800; letter-spacing: .075em; text-transform: uppercase; }.pricing-volume-table td { color: var(--ink); font-size: .875rem; font-weight: 800; }.pricing-volume-table th:last-child, .pricing-volume-table td:last-child { text-align: right; }.pricing-volume-note { font-size: .875rem !important; margin-top: .85rem !important; }
.care-section { background: var(--surface-sage); padding-block: clamp(4.5rem, 9vw, 8rem); }.care-ladder { border-top: 1px solid color-mix(in srgb, var(--ink) 25%, transparent); }.care-rung { align-items: baseline; border-bottom: 1px solid color-mix(in srgb, var(--ink) 25%, transparent); display: grid; gap: 1.25rem; grid-template-columns: 1.1fr .75fr 1fr; padding: clamp(1.3rem, 2.7vw, 2.2rem) 0; }.care-rung span { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }.care-rung strong { font-family: var(--display); font-size: clamp(1.5rem, 2.8vw, 2.55rem); font-weight: 400; letter-spacing: -.05em; }.care-rung p { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; margin: 0; }.care-footnote { color: var(--ink-soft); font-size: .875rem; line-height: 1.65; margin: 1.25rem 0 0; max-width: 660px; }
.invoice-section { align-items: center; display: grid; gap: clamp(2.5rem, 8vw, 8rem); grid-template-columns: minmax(0, .9fr) minmax(340px, .82fr); padding-block: clamp(5rem, 9vw, 8rem); }.invoice-copy h2 { font-size: clamp(2.7rem, 4.9vw, 4.85rem); letter-spacing: -.07em; line-height: .92; margin: 0 0 1.25rem; }.invoice-copy > p { color: var(--ink-soft); font-size: .875rem; line-height: 1.75; margin-bottom: 1.7rem; max-width: 500px; }.invoice-sheet { background: var(--paper-bright); box-shadow: 14px 14px 0 var(--paper-shade); padding: clamp(1.2rem, 2.7vw, 2.15rem); transform: rotate(1deg); }.invoice-sheet-top { align-items: baseline; border-bottom: 2px solid var(--ink); display: flex; justify-content: space-between; padding-bottom: .75rem; }.invoice-sheet-top span { color: var(--clay-dark); font-family: var(--display); font-size: 1.45rem; letter-spacing: -.06em; }.invoice-sheet-top strong { font-size: .875rem; letter-spacing: .09em; text-transform: uppercase; }.invoice-line, .invoice-total { border-bottom: 1px solid var(--line); display: grid; gap: 1rem; grid-template-columns: 1fr minmax(120px, .8fr); padding: .85rem 0; }.invoice-line span, .invoice-total span { font-size: .875rem; font-weight: 700; line-height: 1.5; }.invoice-line b, .invoice-total b { color: var(--ink-soft); font-size: .875rem; line-height: 1.5; text-align: right; }.invoice-margin span, .invoice-margin b { color: var(--clay-dark); }.invoice-total { border-bottom: 0; padding-bottom: 0; }.invoice-total b { color: var(--ink); font-weight: 800; }
.margin-tool-section { background: var(--surface-ink); color: var(--paper); padding-block: clamp(4.5rem, 8vw, 7.5rem); }.margin-tool-layout { align-items: center; display: grid; gap: clamp(2.5rem, 9vw, 8rem); grid-template-columns: minmax(0, .9fr) minmax(315px, .62fr); }.margin-tool-layout h2 { font-size: clamp(2.6rem, 5vw, 5rem); letter-spacing: -.07em; line-height: .91; margin: 0 0 1.2rem; }.margin-tool-layout > div > p:not(.eyebrow) { color: color-mix(in srgb, var(--paper) 68%, transparent); font-size: .875rem; line-height: 1.75; max-width: 510px; }.margin-tool { background: var(--paper); color: var(--ink); padding: clamp(1.3rem, 3vw, 2.15rem); }.margin-tool label { display: block; font-size: .875rem; font-weight: 800; letter-spacing: .07em; margin-bottom: .55rem; text-transform: uppercase; }.margin-input-row { align-items: center; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: auto 1fr; padding-bottom: .85rem; }.margin-input-row > span { color: var(--clay); font-family: var(--display); font-size: 2rem; }.margin-input-row input { background: transparent; border: 0; color: var(--ink); font-family: var(--display); font-size: 2rem; letter-spacing: -.06em; min-width: 0; outline: none; padding: 0 .25rem; width: 100%; }.margin-input-row small { color: var(--ink-soft); font-size: .875rem; font-weight: 700; grid-column: 1 / -1; margin-top: .45rem; }.margin-result, .margin-total { align-items: baseline; display: flex; justify-content: space-between; padding-top: 1rem; }.margin-result span, .margin-total span { font-size: .875rem; font-weight: 800; }.margin-result strong, .margin-total strong { font-family: var(--display); font-size: 1.65rem; font-weight: 400; letter-spacing: -.05em; }.margin-total { border-top: 1px solid var(--line); margin-top: 1rem; }.margin-total strong { color: var(--clay-dark); }

/* Demos */
.demo-intro { padding-block: 2.1rem; }.demo-intro p { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; margin: 0; max-width: 720px; }.demo-intro strong { color: var(--ink); }.demo-workbench { display: grid; gap: clamp(2rem, 4.5vw, 4rem); padding-bottom: clamp(5rem, 9vw, 8rem); }.demo-module { border-top: 1px solid var(--line); display: grid; gap: clamp(2rem, 7vw, 7rem); grid-template-columns: minmax(0, .75fr) minmax(360px, .95fr); padding-top: clamp(2rem, 4vw, 3.5rem); }.demo-module-copy h2 { font-size: clamp(2.25rem, 4.1vw, 4.05rem); letter-spacing: -.065em; line-height: .95; margin: 0 0 1rem; }.demo-module-copy > p:not(.eyebrow):not(.demo-outcome) { color: var(--ink-soft); font-size: .875rem; line-height: 1.75; max-width: 440px; }.demo-outcome { border-top: 1px solid var(--line); font-size: .875rem; font-weight: 800; line-height: 1.6; margin: 1.6rem 0 0; padding-top: .8rem; }.demo-screen { background: var(--paper-bright); box-shadow: 12px 12px 0 var(--paper-shade); padding: clamp(1rem, 2vw, 1.55rem); }.demo-screen-top, .dashboard-top { align-items: center; border-bottom: 1px solid var(--line); display: flex; gap: .45rem; justify-content: space-between; padding-bottom: .65rem; }.demo-screen-top strong, .dashboard-top strong { font-family: var(--display); font-size: 1.25rem; font-weight: 400; letter-spacing: -.04em; }.demo-screen-top small, .dashboard-top small { color: var(--ink-soft); font-size: .875rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }.preview-live-dot { background: #277150; border-radius: 50%; height: 7px; width: 7px; }.demo-screen-top .preview-live-dot { margin-right: -.15rem; }.demo-chat { display: grid; gap: .6rem; padding-block: 1rem; }.demo-chat p { font-size: .875rem; font-weight: 700; line-height: 1.55; margin: 0; padding: .7rem; }.demo-chat-customer { background: var(--paper-shade); justify-self: start; max-width: 78%; }.demo-chat-tool { background: var(--ink); color: var(--paper); justify-self: end; max-width: 84%; }.demo-tags { border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: .35rem; padding-top: .75rem; }.demo-tags span, .demo-tags b { background: var(--sage); font-size: .875rem; font-weight: 800; letter-spacing: .04em; padding: .37rem .45rem; text-transform: uppercase; }.demo-tags span:nth-child(2) { background: color-mix(in srgb, var(--sun) 42%, var(--paper)); }.demo-tags b { background: transparent; color: var(--clay-dark); padding-left: 0; }.demo-controls { align-items: end; border-top: 1px solid var(--line); display: grid; gap: .55rem; grid-template-columns: minmax(0, 1fr) auto; margin-top: .85rem; padding-top: .75rem; }.demo-controls label { color: var(--ink-soft); font-size: .875rem; font-weight: 800; grid-column: 1 / -1; letter-spacing: .07em; text-transform: uppercase; }.demo-controls input, .followup-composer textarea { background: var(--paper); border: 1px solid color-mix(in srgb, var(--ink) 28%, transparent); border-radius: 0; color: var(--ink); font-size: .875rem; min-width: 0; outline: none; padding: .66rem; width: 100%; }.demo-controls input:focus, .followup-composer textarea:focus { border-color: var(--clay); box-shadow: 0 0 0 3px color-mix(in srgb, var(--clay) 15%, transparent); }.demo-controls button, .followup-action, .composer-actions button, .dashboard-controls button { background: var(--ink); border: 0; color: var(--paper); font-size: .875rem; font-weight: 800; min-height: 36px; padding: .55rem .65rem; }.demo-controls button:hover, .demo-controls button:focus-visible, .followup-action:hover, .followup-action:focus-visible, .composer-actions button:hover, .composer-actions button:focus-visible, .dashboard-controls button:hover, .dashboard-controls button:focus-visible { background: var(--clay-dark); outline: 2px solid var(--sun); outline-offset: 2px; }.demo-controls .demo-reset { background: transparent; color: var(--ink-soft); grid-column: 1 / -1; justify-self: start; padding-left: 0; }.demo-status { color: var(--ink-soft); font-size: .875rem; font-weight: 700; line-height: 1.5; margin: .75rem 0 0; min-height: 1.5em; }.followup-list { padding-top: .35rem; }.followup-row { align-items: center; border-bottom: 1px solid var(--line); display: grid; gap: .35rem .7rem; grid-template-columns: auto minmax(0, 1fr) auto; padding: .75rem 0; }.followup-row strong { font-size: .875rem; }.followup-row small { color: var(--ink-soft); font-size: .875rem; font-weight: 700; grid-column: 2; }.followup-badge { font-size: .875rem; font-weight: 800; letter-spacing: .07em; padding: .27rem .32rem; text-transform: uppercase; }.followup-badge-warm { background: color-mix(in srgb, var(--sun) 52%, var(--paper)); }.followup-badge-new { background: var(--sage); }.followup-badge-due { background: color-mix(in srgb, var(--clay) 30%, var(--paper)); }.followup-action { grid-column: 3; grid-row: 1 / span 2; }.followup-row.is-complete { background: color-mix(in srgb, var(--sage) 52%, var(--paper)); margin-inline: -.5rem; padding-inline: .5rem; }.followup-row.is-complete .followup-action { background: #277150; cursor: default; }.followup-composer { border-top: 1px solid var(--line); margin-top: .8rem; padding-top: .8rem; }.followup-composer > div:first-child { align-items: baseline; display: flex; justify-content: space-between; }.followup-composer strong { font-family: var(--display); font-size: 1rem; font-weight: 400; }.followup-composer small { color: var(--ink-soft); font-size: .875rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }.followup-composer label { display: block; font-size: .875rem; font-weight: 800; letter-spacing: .07em; margin: .75rem 0 .35rem; text-transform: uppercase; }.followup-composer textarea { min-height: 76px; resize: vertical; }.composer-actions { display: flex; gap: .5rem; margin-top: .55rem; }.composer-actions button:last-child { background: var(--paper-shade); color: var(--ink-soft); }.dashboard-top { align-items: start; }.dashboard-controls { display: flex; gap: .25rem; }.dashboard-controls button { background: var(--paper-shade); color: var(--ink-soft); min-height: 30px; padding: .35rem .45rem; }.dashboard-controls button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }.dashboard-stats { display: grid; gap: .5rem; grid-template-columns: repeat(3, 1fr); padding-block: .9rem; }.dashboard-stats div { background: var(--paper-shade); padding: .68rem; }.dashboard-stats strong { display: block; font-family: var(--display); font-size: 1.6rem; font-weight: 400; letter-spacing: -.06em; line-height: .95; }.dashboard-stats span { color: var(--ink-soft); display: block; font-size: .875rem; font-weight: 800; margin-top: .35rem; }.dashboard-bars { align-items: end; border-top: 1px solid var(--line); display: grid; gap: .4rem; grid-template-columns: repeat(4, 1fr); height: 128px; padding-top: .75rem; }.dashboard-source { align-items: center; background: transparent; border: 0; color: var(--ink-soft); display: flex; flex-direction: column; font-size: .875rem; font-weight: 800; height: 100%; justify-content: end; padding: 0; }.dashboard-source i { background: var(--ink); display: block; height: var(--bar-height); max-height: 92px; width: 70%; }.dashboard-source:nth-child(2) i { background: var(--clay); }.dashboard-source:nth-child(3) i { background: var(--sun); }.dashboard-source:nth-child(4) i { background: var(--sage); }.dashboard-source b { font-size: .875rem; margin-top: .35rem; }.dashboard-source:hover b, .dashboard-source:focus-visible b { color: var(--clay-dark); text-decoration: underline; }.dashboard-insight { border-top: 1px solid var(--line); padding-top: .65rem; }

/* Contact */
.agent-showcase { padding-block: clamp(4rem, 8vw, 7rem); }
.agent-showcase-heading { max-width: 850px; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.agent-showcase-heading h2 { font-size: clamp(2.7rem, 5vw, 5rem); letter-spacing: -.065em; line-height: .94; margin: .7rem 0 1.1rem; }
.agent-showcase-heading > p:last-child { color: var(--ink-soft); font-size: clamp(.83rem, 1.1vw, 1rem); line-height: 1.7; max-width: 680px; }
.agent-showcase-grid { align-items: start; display: grid; gap: clamp(1.2rem, 2.5vw, 2.5rem); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.agent-card { background: var(--paper-bright); border: 1px solid var(--line); box-shadow: 10px 10px 0 var(--paper-shade); display: flex; flex-direction: column; min-width: 0; padding: clamp(1.2rem, 2.5vw, 2.2rem); }
.agent-card-heading { align-items: center; border-bottom: 1px solid var(--line); display: flex; gap: 1rem; padding-bottom: 1rem; }
.agent-card-heading img { aspect-ratio: 1; border: 2px solid var(--sun); border-radius: 50%; object-fit: cover; object-position: center 19%; }
.agent-card-heading span:not(.agent-voice-mark) { color: var(--clay-dark); display: block; font-size: .875rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.agent-card-heading h3 { font-family: var(--display); font-size: clamp(1.5rem, 2.5vw, 2.3rem); font-weight: 400; letter-spacing: -.05em; line-height: 1; margin: .4rem 0 0; }
.agent-card > p:not(.agent-card-note) { color: var(--ink-soft); font-size: .875rem; line-height: 1.65; margin: 1.1rem 0; }
.agent-chat-log { background: var(--paper); display: flex; flex-direction: column; gap: .65rem; height: 245px; overflow-y: auto; padding: 1rem; }
.agent-message { font-size: .875rem; font-weight: 700; line-height: 1.55; margin: 0; max-width: 87%; padding: .7rem .85rem; }
.agent-message-host { align-self: start; background: var(--ink); color: var(--paper); }
.agent-message-visitor { align-self: end; background: var(--sage); }
.agent-suggestions { display: flex; flex-wrap: wrap; gap: .4rem; margin: .9rem 0; }
.agent-suggestions button { background: transparent; border: 1px solid var(--line); color: var(--ink); font-size: .875rem; font-weight: 800; padding: .45rem .6rem; }
.agent-suggestions button:hover, .agent-suggestions button:focus-visible { background: var(--paper-shade); }
.agent-chat-form { margin-top: auto; }
.agent-chat-form label { display: block; font-size: .875rem; font-weight: 800; letter-spacing: .07em; margin-bottom: .4rem; text-transform: uppercase; }
.agent-chat-form > div { display: flex; }
.agent-chat-form input { background: var(--paper); border: 1px solid var(--line); border-right: 0; border-radius: 0; color: var(--ink); flex: 1; font-size: .875rem; min-width: 0; padding: .65rem .7rem; }
.agent-chat-form button { background: var(--ink); border: 0; color: var(--paper); font-size: .875rem; font-weight: 800; padding: .65rem 1rem; }
.agent-audio-toggle { align-self: flex-start; background: transparent; border: 0; color: var(--clay-dark); font-size: .875rem; font-weight: 800; margin-top: .7rem; padding: .3rem 0; text-decoration: underline; text-underline-offset: .2rem; }
.agent-card-note { border-top: 1px solid var(--line); color: var(--ink-soft); font-size: .875rem; line-height: 1.6; margin: 1rem 0 0; padding-top: .75rem; }
.agent-voice-mark { align-items: center; background: var(--ink); border-radius: 50%; color: var(--sun); display: flex; flex: 0 0 72px; font-family: var(--display); font-size: 2.6rem; height: 72px; justify-content: center; }
.agent-voice-steps { color: var(--ink-soft); display: grid; gap: .85rem; font-size: .875rem; line-height: 1.6; margin: 1.5rem 0 auto; padding-left: 1.2rem; }
.agent-voice-steps li::marker { color: var(--clay); }
.agent-voice-example { background: var(--paper); border-left: 2px solid var(--sun); margin-top: 1.8rem; padding: 1rem 1.2rem; }
.agent-voice-example span { color: var(--clay-dark); display: block; font-size: .875rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.agent-voice-example p { font-family: var(--display); font-size: clamp(1.25rem, 2vw, 1.7rem); letter-spacing: -.035em; line-height: 1.2; margin: .5rem 0; }
.agent-voice-example small { color: var(--ink-soft); display: block; font-size: .875rem; line-height: 1.6; }
.agent-voice-launch { align-self: flex-start; margin-top: 2rem; }
.agent-voice-launch:disabled { cursor: default; opacity: .7; }
.agent-widget-slot { min-height: 130px; margin-top: 1.2rem; }
.agent-widget-slot[hidden], .agent-card-note[hidden] { display: none; }
@media (max-width: 760px) { .agent-showcase-grid { grid-template-columns: 1fr; }.agent-card { box-shadow: 7px 7px 0 var(--paper-shade); }.agent-chat-log { height: 220px; } }
.avatar-video-screen video { aspect-ratio: 1; background: var(--ink); display: block; margin: 1.25rem auto 0; max-width: 430px; object-fit: contain; width: 100%; }
.avatar-video-transcript { border-top: 1px solid var(--line); font-size: .875rem; line-height: 1.65; margin-top: 1rem; padding-top: .65rem; }
.avatar-video-transcript summary { cursor: pointer; font-size: .875rem; font-weight: 800; text-decoration: underline; text-underline-offset: .2rem; }
.avatar-video-transcript p { color: var(--ink-soft); margin: .65rem 0 0; }

/* Recorded customer and team updates sit between the live agents and workbench. */
.video-updates { background: var(--surface-sage); }
.video-updates-layout { padding-block: clamp(4rem, 8vw, 7rem); }
.video-updates-heading { display: grid; gap: 0 clamp(2rem, 6vw, 7rem); grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); }
.video-updates-heading .eyebrow { grid-column: 1 / -1; }
.video-updates-heading h2 { font-size: clamp(3rem, 5vw, 5.5rem); letter-spacing: -.07em; line-height: .94; margin: .7rem 0 0; max-width: 11ch; text-wrap: balance; }
.video-updates-intro { align-self: end; max-width: 42rem; }
.video-updates-intro p { color: var(--ink-soft); font-size: clamp(.83rem, 1vw, 1.05rem); line-height: 1.7; margin: 0 0 1rem; text-wrap: pretty; }
.video-updates-grid { display: grid; gap: clamp(1.5rem, 3vw, 3rem); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: clamp(2rem, 5vw, 5rem); }
.video-update { border-top: 1px solid color-mix(in srgb, var(--ink) 28%, transparent); min-width: 0; padding-top: 1rem; }
.video-update-label { display: flex; flex-wrap: wrap; gap: .4rem 1rem; justify-content: space-between; margin-bottom: 1rem; }
.video-update-label span { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.video-update-label span:last-child { color: var(--ink-soft); }
.video-update video { aspect-ratio: 16 / 9; background: var(--ink); display: block; object-fit: cover; width: 100%; }
.video-update video:focus-visible { outline: 3px solid var(--clay); outline-offset: 4px; }
.video-update h3 { font-family: var(--display); font-size: clamp(1.7rem, 2.5vw, 2.7rem); font-weight: 400; letter-spacing: -.055em; line-height: 1; margin: 1.5rem 0 .7rem; }
.video-update > p { color: var(--ink-soft); font-size: .875rem; line-height: 1.65; margin: 0; max-width: 34rem; }
.video-update .avatar-video-transcript { max-width: 34rem; }
.video-updates-footer { align-items: center; border-top: 1px solid color-mix(in srgb, var(--ink) 28%, transparent); display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: space-between; margin-top: clamp(2rem, 4vw, 4rem); padding-top: 1.25rem; }
.video-updates-footer p { color: var(--ink-soft); font-size: .875rem; line-height: 1.6; margin: 0; max-width: 36rem; }
@media (max-width: 760px) { .video-updates-heading, .video-updates-grid { grid-template-columns: 1fr; }.video-updates-heading h2 { margin-bottom: 1.25rem; }.video-updates-grid { gap: 2.5rem; }.video-updates-footer { align-items: flex-start; flex-direction: column; } }

/* Contact */
.contact-page { background: var(--surface-ink); color: var(--paper); min-height: calc(100svh - 82px); overflow: hidden; padding-block: clamp(4rem, 8vw, 7.5rem); position: relative; }.contact-layout { align-items: start; display: grid; gap: clamp(2.8rem, 8vw, 8rem); grid-template-columns: minmax(0, .93fr) minmax(330px, .78fr); position: relative; z-index: 1; }.contact-copy h1 { font-size: clamp(3.5rem, 6.2vw, 6.4rem); letter-spacing: -.08em; line-height: .89; margin: 0 0 1.55rem; max-width: 670px; }.contact-copy > p:not(.eyebrow):not(.contact-note) { color: color-mix(in srgb, var(--paper) 71%, transparent); font-size: .93rem; line-height: 1.8; max-width: 490px; }.contact-note { color: var(--sun); font-size: .875rem; font-weight: 800; letter-spacing: .08em; margin-top: 2.1rem; text-transform: uppercase; }.contact-orbit { border: 1px solid color-mix(in srgb, var(--paper) 13%, transparent); border-radius: 50%; pointer-events: none; position: absolute; }.orbit-one { height: 730px; right: -280px; top: -180px; width: 730px; }.orbit-two { bottom: -360px; height: 660px; left: -300px; width: 660px; }.contact-form { background: var(--paper); color: var(--ink); padding: clamp(1.35rem, 3vw, 2.25rem); }.form-row { margin-bottom: 1rem; }.form-row label { display: block; font-size: .875rem; font-weight: 800; letter-spacing: .07em; margin-bottom: .4rem; text-transform: uppercase; }.form-row label span { color: var(--clay); }.contact-form input, .contact-form textarea { background: var(--paper-bright); border: 1px solid color-mix(in srgb, var(--ink) 23%, transparent); border-radius: 0; color: var(--ink); font-size: .875rem; outline: none; padding: .72rem .75rem; width: 100%; }.contact-form textarea { min-height: 112px; resize: vertical; }.contact-form input:focus, .contact-form textarea:focus { border-color: var(--clay); box-shadow: 0 0 0 3px color-mix(in srgb, var(--clay) 18%, transparent); }.form-split { display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; }.turnstile-widget { margin: .2rem 0 1rem; }.website-trap { height: 0; opacity: 0; overflow: hidden; position: absolute; width: 0; }.contact-form .button { width: 100%; }.form-status { font-size: .875rem; font-weight: 700; line-height: 1.5; margin: .9rem 0 0; min-height: 1.2em; }.form-status.error { color: var(--clay-dark); }.form-status.success { color: #16704e; }

/* Service area and process */
.area-section { align-items: center; display: grid; gap: clamp(3rem, 10vw, 10rem); grid-template-columns: minmax(290px, .74fr) minmax(0, .9fr); padding-block: clamp(5rem, 10vw, 9rem); }.area-marker { align-items: center; background: var(--surface-ink); color: var(--paper); display: flex; flex-direction: column; justify-content: center; min-height: 390px; overflow: hidden; position: relative; text-align: center; }.area-marker > *:not(i) { position: relative; z-index: 1; }.area-marker p { color: var(--sun); font-family: var(--display); font-size: clamp(6rem, 11vw, 10rem); letter-spacing: -.1em; line-height: .8; margin: 0; }.area-marker span { font-size: .875rem; font-weight: 800; letter-spacing: .1em; margin-top: .8rem; text-transform: uppercase; }.area-marker strong { font-family: var(--display); font-size: 1.65rem; font-weight: 400; letter-spacing: -.05em; margin-top: 1.4rem; }.area-marker i { border: 1px solid color-mix(in srgb, var(--paper) 20%, transparent); border-radius: 50%; height: 520px; position: absolute; width: 520px; }.area-marker .area-ring-one { transform: translate(30%, -34%); }.area-marker .area-ring-two { transform: translate(-40%, 36%); }.area-copy h2 { font-size: clamp(3rem, 5vw, 5rem); letter-spacing: -.07em; line-height: .91; margin: 0 0 1.1rem; }.area-copy > p:not(.eyebrow) { color: var(--ink-soft); font-size: .875rem; line-height: 1.8; max-width: 530px; }.city-list { display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; margin: 1.6rem 0 1.8rem; padding: 0; }.city-list li { border: 1px solid var(--line); font-size: .875rem; font-weight: 800; padding: .5rem .6rem; }
.process-section { padding-block: clamp(4.5rem, 9vw, 8.5rem); }.process-list { border-top: 1px solid var(--line); list-style: none; margin: 0; padding: 0; }.process-list li { border-bottom: 1px solid var(--line); display: grid; gap: clamp(1.5rem, 4vw, 4rem); grid-template-columns: 74px minmax(0, 1fr); padding: clamp(1.7rem, 3.6vw, 3.2rem) 0; }.process-list > li > span { color: var(--clay); font-family: var(--display); font-size: 1.5rem; letter-spacing: -.06em; }.process-list li div { display: grid; gap: 2rem; grid-template-columns: minmax(230px, .72fr) minmax(240px, .9fr); }.process-list h2 { font-size: clamp(2rem, 3.5vw, 3.35rem); letter-spacing: -.06em; line-height: .96; margin: 0; }.process-list p { color: var(--ink-soft); font-size: .875rem; line-height: 1.75; margin: 0; max-width: 510px; }.principles-band { background: var(--surface-sage); padding-block: clamp(4.5rem, 8vw, 7.5rem); }.principles-layout { align-items: start; display: grid; gap: clamp(2.5rem, 9vw, 8rem); grid-template-columns: minmax(0, .9fr) minmax(280px, .72fr); }.principles-layout h2 { font-size: clamp(2.6rem, 4.8vw, 4.8rem); letter-spacing: -.07em; line-height: .92; margin: 0; max-width: 590px; }.principles-layout ul { border-top: 1px solid color-mix(in srgb, var(--ink) 25%, transparent); list-style: none; margin: 0; padding: 0; }.principles-layout li { border-bottom: 1px solid color-mix(in srgb, var(--ink) 25%, transparent); font-size: .875rem; font-weight: 800; padding: .85rem 0 .85rem 1.2rem; position: relative; }.principles-layout li::before { color: var(--clay); content: "•"; left: .15rem; position: absolute; }

/* Footer and motion */
.site-footer { background: var(--surface-paper); }.footer-layout { align-items: start; display: grid; gap: clamp(1.75rem, 4vw, 4rem); grid-template-columns: minmax(220px, .85fr) minmax(300px, 1fr) minmax(190px, .6fr); min-height: 0; padding-block: clamp(2.1rem, 4vw, 3.5rem); }.footer-intro .brand { margin-bottom: .7rem; }.brand-footer .brand-wordmark { font-size: 1.9rem; }.footer-intro > p { color: var(--ink-soft); font-size: .875rem; font-weight: 700; line-height: 1.65; margin: 0; max-width: 270px; }.footer-nav { align-content: start; display: flex; flex-wrap: wrap; gap: .45rem .8rem; padding-top: .3rem; }.footer-nav a, .footer-links a { border-bottom: 1px solid color-mix(in srgb, var(--ink) 38%, transparent); font-size: .875rem; font-weight: 800; padding: .45rem 0 .2rem; transition: border-color .18s ease, color .18s ease; }.footer-nav a:hover, .footer-nav a:focus-visible, .footer-links a:hover, .footer-links a:focus-visible { border-color: var(--clay); color: var(--clay-dark); }.footer-links { align-items: flex-start; display: flex; flex-direction: column; gap: .4rem; justify-self: end; max-width: 210px; }.footer-links > span { color: var(--ink-soft); font-size: .875rem; font-weight: 800; letter-spacing: .07em; line-height: 1.45; text-transform: uppercase; }.footer-links a span { color: var(--clay); font-size: .95rem; margin-left: .2rem; }
.site-progress { background: color-mix(in srgb, var(--ink) 12%, transparent); height: 2px; overflow: hidden; position: relative; z-index: 11; }.site-progress span { background: var(--sun); display: block; height: 100%; transform: translateX(-100%); width: 100%; }.page-ready .site-progress span { animation: page-progress .72s var(--ease-out) both; }
.reveal { transition: opacity .65s var(--ease-out), transform .65s var(--ease-out); }.reveal-delay { transition-delay: .12s; } html.js .reveal { opacity: 0; transform: translateY(18px); } html.js .reveal.visible { opacity: 1; transform: translateY(0); }

/* Shared finishing pass */
.site-shell { animation: site-arrive .5s var(--ease-out) both; }
.site-header { backdrop-filter: blur(14px); }
.brand, .site-nav a, .footer-nav a, .footer-links a { -webkit-tap-highlight-color: transparent; }
.page-hero h1, .landing-copy h1, .contact-copy h1, .section-heading h2, .closing-band h2 { text-wrap: balance; }
.page-hero-intro, .service-entry-detail > p, .invoice-copy > p, .area-copy > p:not(.eyebrow), .process-list p, .contact-copy > p:not(.eyebrow):not(.contact-note) { text-wrap: pretty; }
.page-hero { position: relative; }.page-hero::after { background: linear-gradient(90deg, var(--clay), var(--sun), transparent); bottom: 0; content: ""; height: 2px; left: max(1.25rem, 4vw); opacity: .72; position: absolute; width: clamp(6rem, 13vw, 11rem); }.page-hero-ink::after { background: linear-gradient(90deg, var(--sun), color-mix(in srgb, var(--paper) 56%, transparent), transparent); }
.landing-desk, .invoice-sheet, .demo-screen, .contact-form, .margin-tool { border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent); }.service-entry, .pricing-principle, .care-rung, .process-list li { transition: border-color .22s ease, background .22s ease; }.service-entry:hover, .pricing-principle:hover, .care-rung:hover, .process-list li:hover { border-color: color-mix(in srgb, var(--clay) 48%, var(--line)); }.city-list li { transition: background .18s ease, border-color .18s ease, transform .18s var(--ease-out); }.city-list li:hover { background: color-mix(in srgb, var(--sun) 14%, var(--paper)); border-color: color-mix(in srgb, var(--clay) 52%, var(--line)); transform: translateY(-1px); }
.form-kicker { border-bottom: 1px solid var(--line); color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .085em; margin: 0 0 1.25rem; padding-bottom: .75rem; text-transform: uppercase; }.form-assurance { color: var(--ink-soft); font-size: .875rem; font-weight: 700; line-height: 1.5; margin: .8rem 0 0; }.contact-form[aria-busy="true"] { cursor: progress; }.contact-form input[aria-invalid="true"], .contact-form textarea[aria-invalid="true"] { border-color: var(--clay-dark); box-shadow: 0 0 0 3px color-mix(in srgb, var(--clay) 20%, transparent); }
.margin-tool { box-shadow: 10px 10px 0 color-mix(in srgb, var(--sun) 18%, transparent); }.margin-tool:focus-within { box-shadow: 12px 12px 0 color-mix(in srgb, var(--sun) 36%, transparent); }.margin-input-row input:focus-visible { outline: 0; }.margin-input-row:focus-within { border-bottom-color: var(--clay); }.demo-screen { transition: box-shadow .25s var(--ease-out), transform .25s var(--ease-out); }.demo-module:hover .demo-screen { box-shadow: 15px 15px 0 color-mix(in srgb, var(--sun) 28%, var(--paper-shade)); transform: translate(-2px, -2px); }
@keyframes site-arrive { from { opacity: .001; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } } @keyframes page-progress { from { transform: translateX(-100%); } to { transform: translateX(0); } }

@media (max-width: 1080px) { .site-nav { gap: .75rem; }.site-nav > a { font-size: .875rem; }.landing-layout { gap: 3rem; grid-template-columns: minmax(0, 1fr) minmax(350px, .8fr); }.service-entry { grid-template-columns: 54px minmax(215px, .8fr) minmax(260px, .75fr); }.demo-module { gap: 3rem; grid-template-columns: minmax(0, .74fr) minmax(330px, .86fr); } }
@media (max-width: 880px) { .site-header { height: 72px; }.site-header.scrolled { height: 64px; }.menu-toggle { display: block; z-index: 2; }.site-nav { align-items: flex-start; background: var(--paper); border-bottom: 1px solid var(--line); flex-direction: column; gap: 1.2rem; inset: 72px 0 auto; max-height: 0; opacity: 0; overflow: hidden; padding: 0 clamp(1.25rem, 4vw, 3.25rem); pointer-events: none; position: absolute; transition: max-height .32s var(--ease-out), opacity .2s ease, padding .32s var(--ease-out); }.site-nav.open { max-height: 450px; opacity: 1; padding-block: 1.4rem 1.7rem; pointer-events: auto; }.site-header.scrolled .site-nav { top: 64px; }.site-nav > a { font-size: .875rem; }.site-nav .nav-cta { margin-top: .2rem; }.landing-hero, .landing-layout { min-height: calc(100svh - 72px); }.landing-layout { gap: 3rem; grid-template-columns: minmax(0, 1fr) minmax(330px, .77fr); }.landing-copy h1 { font-size: clamp(3.35rem, 7.5vw, 5.5rem); }.page-hero-layout, .pricing-principles, .invoice-section, .margin-tool-layout, .area-section, .principles-layout { grid-template-columns: 1fr; }.page-hero-intro { max-width: 560px; }.pricing-principles { gap: 2.5rem; }.invoice-sheet { max-width: 620px; }.area-marker { max-width: 620px; }.service-entry { grid-template-columns: 50px minmax(0, 1fr); }.service-entry-detail { grid-column: 2; max-width: 620px; }.demo-module { grid-template-columns: 1fr; }.demo-screen { max-width: 660px; }.demo-module-copy { max-width: 570px; } }
@media (max-width: 620px) { .landing-hero, .landing-layout { min-height: auto; }.landing-layout { display: block; padding-block: 4.5rem 3rem; }.landing-copy h1 { font-size: clamp(3.5rem, 15vw, 5rem); }.landing-copy > p:not(.eyebrow):not(.landing-proof) { font-size: .9rem; }.landing-desk { margin-top: 3.25rem; transform: none; }.desk-path { min-height: 142px; }.page-hero { padding-block: 3.6rem 4rem; }.page-hero h1, .contact-copy h1 { font-size: clamp(3.2rem, 14vw, 4.55rem); }.page-hero-layout { gap: 1.7rem; }.closing-band-layout { align-items: flex-start; flex-direction: column; }.closing-band .button { width: 100%; }.service-ledger { padding-top: 3.6rem; }.service-entry { display: block; padding-block: 2rem; }.service-index { margin-bottom: 1rem; }.service-entry h2 { font-size: 2.25rem; }.service-entry-detail { margin-top: 1.4rem; }.pricing-principles { padding-block: 3.8rem; }.pricing-principle { display: block; padding-block: 1.15rem; }.pricing-principle > span { display: block; margin-bottom: .65rem; }.pricing-principle h3 { margin-bottom: .5rem; }.care-rung { display: block; }.care-rung strong { display: block; margin: .35rem 0 .65rem; }.invoice-section { padding-block: 4.5rem; }.invoice-sheet { box-shadow: 8px 8px 0 var(--paper-shade); transform: none; }.margin-tool-layout { gap: 2.3rem; }.demo-module { padding-top: 1.7rem; }.demo-module-copy h2 { font-size: 2.5rem; }.demo-screen { box-shadow: 7px 7px 0 var(--paper-shade); }.demo-controls { grid-template-columns: 1fr; }.demo-controls button { width: 100%; }.demo-controls .demo-reset { width: auto; }.followup-row { gap: .28rem .5rem; }.followup-action { font-size: .875rem; padding: .4rem; }.dashboard-top { display: block; }.dashboard-controls { margin-top: .7rem; }.dashboard-controls button { flex: 1; }.contact-page { min-height: auto; }.contact-layout { grid-template-columns: 1fr; }.contact-copy > p:not(.eyebrow):not(.contact-note) { font-size: .875rem; }.form-split { display: block; }.area-section { padding-block: 4.5rem; }.area-marker { min-height: 335px; }.area-marker p { font-size: 7rem; }.area-copy h2 { font-size: 3.3rem; }.process-list li { display: block; }.process-list > li > span { display: block; margin-bottom: .75rem; }.process-list li div { display: block; }.process-list p { margin-top: .75rem; }.footer-layout { grid-template-columns: 1fr; justify-items: start; padding-block: 1.7rem; }.footer-layout > p { text-align: left; }.footer-links { flex-wrap: wrap; } }
@media (max-width: 390px) { .landing-desk { grid-template-columns: 1fr; }.desk-path, .desk-path:nth-of-type(odd) { border-left: 0; border-bottom: 1px solid var(--line); padding-left: 0; }.desk-path:last-child { border-bottom: 0; }.desk-path:nth-last-child(2) { border-bottom: 1px solid var(--line); }.desk-path i { opacity: 1; }.invoice-line, .invoice-total { grid-template-columns: 1fr; gap: .3rem; }.invoice-line b, .invoice-total b { text-align: left; } }
@media (max-width: 880px) { .site-nav { visibility: hidden; }.site-nav.open { visibility: visible; }.site-nav > a { min-height: 44px; align-items: center; display: inline-flex; }.site-progress { position: relative; } }
@media (max-width: 620px) { .site-shell { animation-duration: .38s; }.site-header { padding-inline: 1.1rem; }.footer-layout { gap: 1.35rem; padding-block: 2rem; }.footer-nav { gap: .35rem .7rem; padding-top: 0; }.footer-links { justify-self: start; }.footer-links > span { max-width: 260px; }.demo-module:hover .demo-screen { box-shadow: 7px 7px 0 var(--paper-shade); transform: none; }.margin-tool { box-shadow: 7px 7px 0 color-mix(in srgb, var(--sun) 18%, transparent); } }
@media (prefers-reduced-motion: reduce) { .site-shell { animation: none; }.site-progress span { animation: none; transform: translateX(0); } html.js .reveal, html.js .reveal.visible { opacity: 1; transform: none; transition: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.reveal, .reveal-delay { opacity: 1; transform: none; transition: none; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }

.host-hero { background: var(--paper); overflow: hidden; }
.host-hero-layout { align-items: center; column-gap: clamp(3rem, 5vw, 8rem); display: grid; grid-template-areas: "heading media" "support media"; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); min-height: min(900px, calc(100svh - 82px)); padding-block: clamp(3rem, 6vw, 7rem); row-gap: 0; }
.host-hero-heading { align-self: end; grid-area: heading; }
.host-hero-heading h1 { font-size: clamp(3.5rem, 5.4vw, 8.5rem); letter-spacing: -.075em; line-height: .91; margin: 0 0 1.4rem; max-width: 1100px; text-wrap: balance; }
.host-hero-definition { border-left: 2px solid var(--sun); font-size: clamp(.95rem, 1.05vw, 1.15rem); font-weight: 700; line-height: 1.55; margin: 0 0 1.5rem; max-width: 680px; padding-left: 1rem; text-wrap: pretty; }
.host-hero-support { align-self: start; grid-area: support; }
.host-hero-support > p { color: var(--ink-soft); font-size: clamp(.95rem, 1.25vw, 1.28rem); line-height: 1.65; max-width: 720px; text-wrap: pretty; }
.host-hero-support > .host-hero-mobile-intro { display: none; }
.host-hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem 1.4rem; margin-top: 1.6rem; }
.host-hero-transcript { border-top: 1px solid var(--line); font-size: .875rem; line-height: 1.6; margin-top: 2rem; max-width: 520px; padding-top: .8rem; }
.host-hero-transcript summary { cursor: pointer; font-size: .875rem; font-weight: 800; text-decoration: underline; text-underline-offset: .25rem; }
.host-hero-transcript p { margin: .7rem 0 0; }
.host-hero-media { grid-area: media; justify-self: center; margin: 0; max-width: min(100%, clamp(340px, 18vw, 500px)); width: 100%; }
.host-hero-media-square { max-width: min(100%, clamp(470px, 27vw, 680px)); }
.host-hero-media video { aspect-ratio: 9 / 16; background: var(--ink); box-shadow: 11px 11px 0 var(--paper-shade); display: block; object-fit: contain; width: 100%; }
.host-hero-media-square video { aspect-ratio: 1; }
.host-hero-media figcaption { color: var(--ink-soft); font-size: .875rem; font-weight: 700; margin-top: 1.1rem; }
.host-hero-art { background-color: var(--paper); background-image: linear-gradient(90deg, rgba(247, 242, 231, .55), rgba(247, 242, 231, .35) 48%, rgba(247, 242, 231, .08)), var(--hero-art); background-position: center; background-size: cover; }
.host-hero-home { background-color: var(--ink); background-image: linear-gradient(90deg, rgba(5, 28, 44, .94), rgba(5, 28, 44, .88) 48%, rgba(5, 28, 44, .6) 70%, rgba(5, 28, 44, .28)), var(--hero-art); color: var(--paper); }
.host-hero-home .eyebrow { color: var(--sun); }
.host-hero-home .eyebrow-dot { background: var(--sun); }
.host-hero-home .host-hero-support > p, .host-hero-home .host-hero-media figcaption { color: color-mix(in srgb, var(--paper) 78%, transparent); }
.host-hero-home .host-hero-transcript { border-color: color-mix(in srgb, var(--paper) 32%, transparent); }
.host-hero-home .text-link { border-color: color-mix(in srgb, var(--paper) 52%, transparent); color: var(--paper); }
.host-hero-home .host-hero-media video { box-shadow: 11px 11px 0 color-mix(in srgb, var(--sun) 45%, transparent); }
@media (min-width: 621px) { .host-hero-home .host-hero-media { width: min(100%, 340px, 40svh); } }
.host-hero-transcript summary:focus-visible, .host-hero-media video:focus-visible { outline: 3px solid var(--clay); outline-offset: 4px; }
.landing-work { background: var(--surface-sage); padding-block: clamp(4.5rem, 8vw, 7.5rem); }
.landing-work-layout { align-items: start; display: grid; gap: clamp(2.5rem, 7vw, 6rem); grid-template-columns: minmax(0, .85fr) minmax(330px, .9fr); }
.landing-work-copy h2 { font-size: clamp(3rem, 5vw, 5.2rem); letter-spacing: -.07em; line-height: .93; margin-bottom: 1.5rem; max-width: 580px; }
.landing-work-copy > p:not(.eyebrow) { color: var(--ink-soft); font-size: .875rem; line-height: 1.75; max-width: 530px; }
.landing-work-copy .text-link { display: inline-block; margin-top: .8rem; }
.landing-work .landing-desk { justify-self: end; max-width: 1080px; transform: rotate(1deg); width: 100%; }
.service-entry-detail { justify-self: end; max-width: 720px; width: 100%; }
.service-entry-detail > p { font-size: clamp(.84rem, .75vw, 1.05rem); }
.service-entry-detail li { font-size: clamp(.69rem, .7vw, .88rem); }
.contact-page { min-height: 0; }
.contact-copy h2 { font-size: clamp(2.9rem, 4.9vw, 5rem); letter-spacing: -.07em; line-height: .95; margin: 0 0 1.4rem; max-width: 650px; }
@media (max-width: 880px) { .host-hero-layout { grid-template-columns: minmax(0, 1fr) minmax(240px, .72fr); min-height: 0; }.host-hero-heading h1 { font-size: clamp(3rem, 6.5vw, 4.7rem); }.host-hero-media { max-width: 290px; }.landing-work-layout { grid-template-columns: 1fr; }.landing-work .landing-desk { max-width: 720px; } }
@media (max-width: 620px) { .host-hero-layout { display: grid; grid-template-areas: "heading" "media" "support"; grid-template-columns: 1fr; min-height: 0; padding-block: 3rem 3.5rem; row-gap: 1.8rem; }.host-hero-heading h1 { font-size: clamp(3.1rem, 13vw, 4.4rem); margin-bottom: 0; }.host-hero-media { justify-self: start; max-width: min(245px, 70vw); }.host-hero-media-square { max-width: min(320px, 88vw); }.host-hero-media video { box-shadow: 7px 7px 0 var(--paper-shade); }.host-hero-home .host-hero-media video { box-shadow: 7px 7px 0 color-mix(in srgb, var(--sun) 45%, transparent); }.host-hero-media figcaption { margin-top: .8rem; }.host-hero-actions { margin-top: 1.2rem; }.host-hero-transcript { margin-top: 1.6rem; }.landing-work .landing-desk { margin-top: 0; transform: none; } }
@media (max-width: 620px) { .site-header .brand-wordmark { font-size: 1.75rem; }.brand-descriptor { font-size: .875rem; letter-spacing: .01em; margin-left: .55rem; padding-left: .55rem; }.service-entry-detail { justify-self: start; } }
@media (max-width: 620px) { .host-hero-art { background-image: linear-gradient(rgba(247, 242, 231, .82), rgba(247, 242, 231, .72)), var(--hero-art); background-position: 68% center; }.host-hero-home { background-image: linear-gradient(rgba(5, 28, 44, .79), rgba(5, 28, 44, .72)), var(--hero-art); background-position: 22% center; }.host-hero-definition { font-size: .875rem; margin-bottom: 0; padding-left: .8rem; } }
@media (max-width: 620px) {
  .share-menu, .journal-article-hero .share-menu { bottom: auto; margin-top: .45rem; position: static; top: auto; }
  .host-hero-home { padding: .75rem .65rem 1.25rem; }
  .host-hero-home .host-hero-layout { background: color-mix(in srgb, var(--ink) 91%, transparent); border: 1px solid color-mix(in srgb, var(--sun) 65%, transparent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ink) 75%, transparent); column-gap: .85rem; grid-template-areas: "heading heading" "media support"; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); padding: 1rem; row-gap: 1.1rem; }
  .host-hero-home .host-hero-heading .eyebrow { font-size: .875rem; letter-spacing: .08em; line-height: 1.3; margin-bottom: .7rem; }
  .host-hero-home .host-hero-heading h1 { font-size: clamp(2rem, 8.7vw, 2.6rem); line-height: .98; margin: 0; }
  .host-hero-home .host-hero-definition, .host-hero-home .host-hero-support > p:first-child { display: none; }
  .host-hero-home .host-hero-support > .host-hero-mobile-intro { display: block; font-size: .875rem; line-height: 1.45; margin: 0; }
  .host-hero-home .host-hero-media { align-self: start; max-width: none; }
  .host-hero-home .host-hero-media video { box-shadow: 4px 4px 0 color-mix(in srgb, var(--sun) 45%, transparent); }
  .host-hero-home .host-hero-media figcaption { font-size: .875rem; line-height: 1.35; margin-top: .55rem; }
  .host-hero-home .host-hero-actions { margin-top: .9rem; }
  .host-hero-home .host-hero-actions .button { font-size: .875rem; line-height: 1.25; min-height: 42px; padding: .65rem .55rem; width: 100%; }
  .host-hero-home .host-hero-actions .text-link { display: none; }
  .host-hero-home .host-hero-transcript { margin-top: 1rem; padding-top: .65rem; }
  .host-hero-home .host-hero-transcript summary { font-size: .875rem; }
}

/* Inner-page first screens use the same compact, framed rhythm as home. */
@media (max-width: 620px) {
  .host-hero-art:not(.host-hero-home) { padding: .75rem .65rem 1rem; }
  .host-hero-art:not(.host-hero-home) .host-hero-layout {
    background: color-mix(in srgb, var(--paper) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--clay) 54%, transparent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--paper) 58%, transparent);
    column-gap: .85rem;
    grid-template-areas: "heading heading" "media support";
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
    padding: 1rem;
    row-gap: 1rem;
  }
  .host-hero-art:not(.host-hero-home) .host-hero-heading .eyebrow { font-size: .875rem; line-height: 1.3; margin-bottom: .7rem; }
  .host-hero-art:not(.host-hero-home) .host-hero-heading h1 { font-size: clamp(2rem, 8.5vw, 2.65rem); line-height: .98; margin: 0; }
  .host-hero-art:not(.host-hero-home) .host-hero-media { align-self: start; max-width: none; }
  .host-hero-art:not(.host-hero-home) .host-hero-media video { box-shadow: 4px 4px 0 var(--paper-shade); }
  .host-hero-art:not(.host-hero-home) .host-hero-media figcaption { font-size: .875rem; line-height: 1.35; margin-top: .55rem; }
  .host-hero-art:not(.host-hero-home) .host-hero-support > p:first-child { display: none; }
  .host-hero-art:not(.host-hero-home) .host-hero-support > .host-hero-mobile-intro { display: block; font-size: .875rem; line-height: 1.45; margin: 0; }
  .host-hero-art:not(.host-hero-home) .host-hero-actions { margin-top: .9rem; }
  .host-hero-art:not(.host-hero-home) .host-hero-actions .button { font-size: .875rem; line-height: 1.25; min-height: 44px; padding: .65rem .55rem; width: 100%; }
  .host-hero-art:not(.host-hero-home) .host-hero-actions .text-link { display: none; }
  .host-hero-art:not(.host-hero-home) .host-hero-transcript { margin-top: 1rem; padding-top: .65rem; }
  .host-hero-art:not(.host-hero-home) .host-hero-transcript summary { font-size: .875rem; }
  .about-hero .about-hero-layout { display: grid; grid-template-areas: "heading" "media" "support"; grid-template-columns: 1fr; row-gap: .8rem; }
  .about-hero-copy { grid-area: heading; }
  .about-hero .about-hero-copy h1 { font-size: clamp(2rem, 8.5vw, 2.65rem); margin: 0; }
  .about-hero-support { grid-area: support; }
  .about-hero-support p { color: var(--ink-soft); font-size: .875rem; line-height: 1.45; margin: 0 0 .75rem; }
  .about-hero-support .button { font-size: .875rem; min-height: 44px; width: 100%; }
  .about-hero .about-hosts { grid-area: media; max-width: 320px; }
  .about-hero .about-host figcaption { padding: .45rem 0 .25rem; }
  .about-hero .about-host figcaption strong { font-size: 1.15rem; }
  .about-hero .about-host figcaption span { font-size: .875rem; }
  .about-hero .about-host .host-hero-transcript { margin-top: 0; padding-top: .35rem; }
}

/* The About page introduces the two co-owners together. */
.about-hero-layout { align-items: center; display: grid; column-gap: clamp(2.5rem, 5vw, 6rem); grid-template-areas: "heading media" "support media"; grid-template-columns: minmax(0, .76fr) minmax(0, 1fr); padding-block: clamp(2rem, 4vw, 5rem); row-gap: 0; }
.about-hero-copy { align-self: end; grid-area: heading; }
.about-hero-support { align-self: start; grid-area: support; }
.about-hero-copy h1 { font-size: clamp(3.4rem, 5.2vw, 7.5rem); letter-spacing: -.075em; line-height: .92; margin: 0 0 clamp(1.5rem, 3vw, 3rem); text-wrap: balance; }
.about-hero-support p { color: var(--ink-soft); font-size: clamp(1rem, 1.2vw, 1.3rem); line-height: 1.65; margin: 0; max-width: 36rem; text-wrap: pretty; }
.about-hero-support .button { margin-top: 2rem; }
.about-hosts { align-items: start; display: grid; gap: clamp(1rem, 2vw, 2rem); grid-area: media; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-self: center; max-width: 600px; width: 100%; }
.about-host { margin: 0; min-width: 0; }
.about-host video { aspect-ratio: 9 / 16; background: var(--ink); box-shadow: 8px 8px 0 var(--paper-shade); display: block; object-fit: contain; width: 100%; }
.about-host video:focus-visible { outline: 3px solid var(--clay); outline-offset: 4px; }
.about-host figcaption { align-items: baseline; border-bottom: 1px solid var(--line); display: flex; gap: .7rem; justify-content: space-between; padding: 1.1rem 0 .9rem; }
.about-host figcaption strong { font-family: var(--display); font-size: clamp(1.5rem, 2vw, 2.3rem); font-weight: 400; letter-spacing: -.04em; }
.about-host figcaption span { color: var(--ink-soft); font-size: .875rem; font-weight: 700; }
.about-host .host-hero-transcript { border-top: 0; margin-top: 0; padding-top: .8rem; }
@media (max-width: 1050px) { .about-hero-layout { align-items: start; grid-template-areas: "heading" "support" "media"; grid-template-columns: 1fr; row-gap: 1.25rem; }.about-hero-copy { max-width: 48rem; }.about-hosts { max-width: 44rem; width: 100%; } }
@media (max-width: 620px) { .about-hero-layout { gap: 1.1rem; padding-block: 1.25rem 2.5rem; }.about-hero-copy h1 { font-size: clamp(3.1rem, 12vw, 4.8rem); margin-bottom: .75rem; }.about-hero-copy > p:not(.eyebrow) { line-height: 1.5; }.about-hero-copy .button { margin-top: 1rem; }.about-hosts { gap: .8rem; }.about-host video { box-shadow: 5px 5px 0 var(--paper-shade); }.about-host figcaption { align-items: start; flex-direction: column; gap: .1rem; }.about-host figcaption strong { font-size: 1.5rem; }.about-host .host-hero-transcript summary { font-size: .875rem; } }

/* Software on demand introduces the idea at home, then makes it concrete on Services. */
.software-signal { background: var(--surface-paper-bright); border-top: 1px solid var(--line); }
.software-signal-layout { display: grid; gap: 0 clamp(2rem, 7vw, 8rem); grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); padding-block: clamp(4rem, 8vw, 8rem); }
.software-signal .eyebrow { grid-column: 1 / -1; }
.software-signal h2 { font-size: clamp(3rem, 5vw, 5.5rem); letter-spacing: -.07em; line-height: .94; margin: .6rem 0 0; max-width: 12ch; text-wrap: balance; }
.software-signal-layout > div { align-self: end; max-width: 35rem; }
.software-signal-layout > div p { color: var(--ink-soft); font-size: clamp(.9rem, 1.2vw, 1.2rem); line-height: 1.7; margin-bottom: 1.5rem; text-wrap: pretty; }
.software-demand { background: var(--surface-paper); scroll-margin-top: 90px; }
.software-demand-layout { display: grid; gap: 1.5rem clamp(2.5rem, 7vw, 8rem); grid-template-columns: minmax(0, .75fr) minmax(0, 1fr); padding-block: clamp(4.5rem, 8vw, 8rem); }
.software-demand-heading { grid-row: 1 / span 3; }
.software-demand-heading h2 { font-size: clamp(3rem, 5vw, 5.3rem); letter-spacing: -.07em; line-height: .94; margin: .7rem 0 1.5rem; max-width: 11ch; text-wrap: balance; }
.software-demand-heading > p:not(.eyebrow) { color: var(--ink-soft); font-size: clamp(.88rem, 1.05vw, 1.1rem); line-height: 1.7; max-width: 34rem; }
.software-demand-examples { border-top: 1px solid var(--line); }
.software-demand-examples > div { border-bottom: 1px solid var(--line); display: grid; gap: 1rem; grid-template-columns: 2rem minmax(0, .72fr) minmax(0, 1fr); padding-block: clamp(1rem, 2vw, 1.8rem); }
.software-demand-examples span { color: var(--clay-dark); font-family: var(--display); font-size: 1.2rem; }
.software-demand-examples h3 { font-size: clamp(1.4rem, 2vw, 2.1rem); letter-spacing: -.05em; line-height: 1; margin: 0; }
.software-demand-examples p { color: var(--ink-soft); font-size: .875rem; line-height: 1.65; margin: 0; }
.software-demand-note { color: var(--ink-soft); font-size: .875rem; line-height: 1.6; margin: 0; }
.software-demand .button { justify-self: start; }
@media (max-width: 880px) { .software-signal-layout, .software-demand-layout { grid-template-columns: 1fr; }.software-signal h2 { margin-bottom: 1.5rem; }.software-demand-heading { grid-row: auto; }.software-demand-examples > div { grid-template-columns: 2rem minmax(0, .8fr) minmax(0, 1fr); } }
@media (max-width: 620px) { .software-demand-examples > div { gap: .5rem .8rem; grid-template-columns: 1.5rem minmax(0, 1fr); }.software-demand-examples p { grid-column: 2; }.software-signal h2, .software-demand-heading h2 { font-size: clamp(2.9rem, 11vw, 4.3rem); } }

/* The interactive demos read like a small working desk, with a result after each action. */
.demo-jump { border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.8rem; padding-top: 1.2rem; }
.demo-jump a { align-items: center; background: var(--paper-bright); border: 1px solid var(--line); color: var(--ink); display: inline-flex; font-size: .875rem; font-weight: 800; gap: 1.2rem; justify-content: space-between; min-height: 43px; padding: .65rem .8rem; text-decoration: none; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.demo-jump a span { color: var(--clay-dark); }
.demo-jump a:hover, .demo-jump a:focus-visible { background: var(--sun); border-color: var(--clay-dark); transform: translateY(-2px); }
#guided-chat, #voice-agent, #intake-demo, #followup-demo, #dashboard-demo { scroll-margin-top: 90px; }
.agent-suggestions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.agent-suggestions button { background: var(--paper); min-height: 60px; padding: .5rem .6rem; text-align: left; }
.agent-suggestions button small { color: var(--clay-dark); display: block; font-size: .875rem; letter-spacing: .03em; margin-bottom: .25rem; }
.agent-suggestions button:hover, .agent-suggestions button:focus-visible { background: var(--sun); border-color: var(--clay-dark); }
.solution-match { background: var(--sage); border-left: 3px solid var(--clay); margin: .2rem 0 1.1rem; padding: 1.1rem 1.2rem; }
.solution-match[hidden], .intake-handoff[hidden], .dashboard-detail-metrics[hidden] { display: none; }
.solution-match > span, .intake-handoff > span, .dashboard-detail > span { color: var(--clay-dark); display: block; font-size: .875rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.solution-match h4 { font-family: var(--display); font-size: clamp(1.35rem, 2vw, 1.8rem); font-weight: 400; letter-spacing: -.05em; line-height: 1.05; margin: .45rem 0; }
.solution-match > p, .solution-match div p { color: var(--ink-soft); font-size: .875rem; line-height: 1.55; margin: .2rem 0 .7rem; }
.solution-match div { border-top: 1px solid color-mix(in srgb, var(--ink) 16%, transparent); padding-top: .45rem; }
.solution-match div strong { font-size: .875rem; }
.solution-match div p { margin-bottom: .2rem; }
.agent-chat-tools { align-items: center; display: flex; gap: 1rem; justify-content: space-between; margin-top: .7rem; }
.agent-audio-toggle { margin-top: 0; }
.agent-chat-reset { background: none; border: 0; color: var(--ink-soft); cursor: pointer; font-size: .875rem; font-weight: 800; padding: .3rem 0; text-decoration: underline; text-underline-offset: .2rem; }
.agent-chat-reset:hover, .agent-chat-reset:focus-visible { color: var(--clay-dark); }
.demo-workbench { padding-top: clamp(3rem, 6vw, 6rem); }
.demo-workbench-heading { border-top: 1px solid var(--line); max-width: 850px; padding-top: 2rem; }
.demo-workbench-heading h2 { font-size: clamp(2.6rem, 5vw, 5rem); letter-spacing: -.07em; line-height: .95; margin: .6rem 0 1rem; }
.demo-workbench-heading > p:last-child { color: var(--ink-soft); font-size: clamp(.85rem, 1.1vw, 1rem); line-height: 1.65; max-width: 680px; }
.demo-scenarios { align-items: center; display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .85rem; }
.demo-scenarios span { color: var(--ink-soft); font-size: .875rem; font-weight: 800; margin-right: .2rem; }
.demo-scenarios button, .demo-replay { background: var(--paper-shade); border: 1px solid var(--line); color: var(--ink); cursor: pointer; font-size: .875rem; font-weight: 800; min-height: 35px; padding: .45rem .6rem; }
.demo-scenarios button:hover, .demo-scenarios button:focus-visible, .demo-replay:hover, .demo-replay:focus-visible { background: var(--sun); border-color: var(--clay-dark); }
.intake-handoff { background: var(--sage); border-left: 3px solid var(--clay); margin-top: 1rem; padding: .8rem 1rem; }
.intake-handoff strong { display: block; font-family: var(--display); font-size: 1.25rem; font-weight: 400; margin-top: .3rem; }
.intake-handoff p { color: var(--ink-soft); font-size: .875rem; line-height: 1.5; margin: .35rem 0 0; }
.demo-replay { background: transparent; margin-top: .75rem; }
.dashboard-source i { transition: height .35s var(--ease-out), filter .2s ease; }
.dashboard-source[aria-pressed="true"] i { filter: brightness(1.25); outline: 2px solid var(--ink); outline-offset: 2px; }
.dashboard-detail { background: var(--sage); border-top: 3px solid var(--clay); margin-top: 1rem; min-height: 122px; padding: .9rem 1rem; }
.dashboard-detail > strong { display: block; font-family: var(--display); font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 400; letter-spacing: -.04em; line-height: 1.08; margin-top: .4rem; }
.dashboard-detail > p { color: var(--ink-soft); font-size: .875rem; line-height: 1.5; margin: .45rem 0 0; }
.dashboard-detail-metrics { display: flex; gap: 1rem; margin-top: .7rem; }
.dashboard-detail-metrics span { font-size: .875rem; }
.dashboard-detail-metrics strong { font-family: var(--display); font-size: 1.2rem; font-weight: 400; }
@media (max-width: 760px) { .agent-suggestions { grid-template-columns: 1fr; }.agent-suggestions button { min-height: 0; }.demo-jump a { flex: 1 1 140px; } }

/* A clear entry point for the live agent, followed by small publishing ideas. */
.voice-feature { background: var(--ink); color: var(--paper); }
.voice-feature-layout { align-items: center; display: grid; gap: clamp(2rem, 6vw, 7rem); grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); padding-block: clamp(4rem, 7vw, 7rem); }
.voice-feature-copy { max-width: 680px; }
.voice-feature-copy h2 { font-size: clamp(3.2rem, 6vw, 6.4rem); letter-spacing: -.075em; line-height: .93; margin: 1rem 0 1.6rem; text-wrap: balance; }
.voice-feature-copy > p:not(.eyebrow) { color: color-mix(in srgb, var(--paper) 78%, var(--ink)); font-size: clamp(.95rem, 1.2vw, 1.18rem); line-height: 1.7; max-width: 36rem; }
.voice-feature-text-link { border-bottom: 1px solid var(--sun); color: var(--paper); display: inline-flex; font-size: .875rem; font-weight: 800; gap: .7rem; margin-top: 1.8rem; padding-bottom: .45rem; text-decoration: none; }
.voice-feature-text-link:hover, .voice-feature-text-link:focus-visible { color: var(--sun); }
.voice-feature .agent-card { box-shadow: 13px 13px 0 color-mix(in srgb, var(--sun) 30%, var(--ink)); color: var(--ink); }
.voice-feature .agent-card-heading h3 { font-size: clamp(1.65rem, 2.6vw, 2.55rem); }
.voice-feature .agent-voice-launch { margin-top: .5rem; }
.voice-feature .agent-voice-steps { margin-bottom: .6rem; }
.agent-chat-aside { align-self: start; background: var(--sage); border-top: 3px solid var(--clay); padding: clamp(1.4rem, 3vw, 2.6rem); }
.agent-chat-aside > span { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.agent-chat-aside ol { counter-reset: demo-step; list-style: none; margin: 1.7rem 0 0; padding: 0; }
.agent-chat-aside li { border-top: 1px solid color-mix(in srgb, var(--ink) 20%, transparent); counter-increment: demo-step; padding: 1rem 0 1rem 2.5rem; position: relative; }
.agent-chat-aside li::before { color: var(--clay-dark); content: counter(demo-step, decimal-leading-zero); font-family: var(--display); font-size: 1.4rem; left: 0; position: absolute; top: .9rem; }
.agent-chat-aside strong { display: block; font-family: var(--display); font-size: clamp(1.25rem, 1.8vw, 1.65rem); font-weight: 400; letter-spacing: -.04em; }
.agent-chat-aside p { color: var(--ink-soft); font-size: .875rem; line-height: 1.6; margin: .4rem 0 0; }
.here-now-section { background: var(--paper); }
.here-now-layout { padding-block: clamp(4rem, 7vw, 7rem); }
.here-now-heading { display: grid; gap: 1rem clamp(2rem, 6vw, 7rem); grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
.here-now-heading .eyebrow { grid-column: 1 / -1; }
.here-now-heading h2 { font-size: clamp(3rem, 5.5vw, 5.8rem); letter-spacing: -.075em; line-height: .93; margin: .5rem 0 0; max-width: 11ch; text-wrap: balance; }
.here-now-heading > p:last-child { align-self: end; color: var(--ink-soft); font-size: clamp(.95rem, 1.1vw, 1.1rem); line-height: 1.7; margin: 0; max-width: 37rem; }
.here-now-uses { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(2.5rem, 5vw, 5rem); }
.here-now-use { border-top: 1px solid var(--ink); min-width: 0; padding: 1.2rem clamp(1rem, 2vw, 2rem) 1.3rem 0; }
.here-now-use + .here-now-use { border-left: 1px solid var(--line); padding-left: clamp(1rem, 2vw, 2rem); }
.here-now-use > span { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.here-now-use h3 { font-family: var(--display); font-size: clamp(1.7rem, 2.5vw, 2.7rem); font-weight: 400; letter-spacing: -.055em; line-height: 1.05; margin: 1.3rem 0 .8rem; }
.here-now-use p { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; margin: 0 0 1.3rem; }
.here-now-use small { border-top: 1px solid var(--line); color: var(--ink); display: block; font-size: .875rem; font-weight: 800; line-height: 1.6; padding-top: .75rem; }
.here-now-footer { align-items: center; border-top: 1px solid var(--line); display: flex; gap: 1.5rem; justify-content: space-between; margin-top: clamp(1rem, 3vw, 3rem); padding-top: 1.4rem; }
.here-now-footer > p { color: var(--ink-soft); font-size: .875rem; line-height: 1.65; margin: 0; max-width: 35rem; }
.here-now-footer > div { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem 1.4rem; }
.here-now-docs { color: var(--ink); font-size: .875rem; font-weight: 800; text-decoration: underline; text-underline-offset: .22rem; }
@media (max-width: 900px) { .voice-feature-layout, .here-now-heading { grid-template-columns: 1fr; }.voice-feature-copy h2 { max-width: 12ch; }.here-now-heading > p:last-child { max-width: 42rem; }.here-now-uses { grid-template-columns: 1fr; }.here-now-use, .here-now-use + .here-now-use { border-left: 0; padding-left: 0; }.here-now-footer { align-items: start; flex-direction: column; } }
@media (max-width: 560px) { .voice-feature-layout { gap: 1.5rem; padding-block: 2rem 3rem; }.voice-feature-copy h2 { font-size: clamp(2.6rem, 12vw, 3.5rem); margin: .7rem 0 .8rem; }.voice-feature-copy > p:not(.eyebrow) { font-size: .9rem; line-height: 1.55; }.voice-feature-text-link { display: none; }.voice-feature .agent-card { box-shadow: 7px 7px 0 color-mix(in srgb, var(--sun) 30%, var(--ink)); }.agent-chat-aside { padding: 1.4rem; }.here-now-use { padding-right: 0; } }
@media (max-width: 620px) { .host-hero-home { padding-bottom: .6rem; }.landing-work { padding-top: 2rem; }.landing-work-copy h2 { font-size: clamp(2.65rem, 11vw, 3rem); line-height: .98; margin-bottom: 1rem; } }
@media (max-width: 620px) { .about-hero .about-hero-support p { font-size: .875rem; line-height: 1.45; margin: 0 0 .75rem; }.about-hero .about-hero-support .button { margin-top: 0; } }

/* Field notes */
.journal-hero, .journal-article-hero { background-color: var(--surface-ink); background-image: linear-gradient(90deg, rgb(5 28 44 / 91%), rgb(5 28 44 / 72%)), var(--journal-art, url("/static/optimized/home-stencil-mural-v1-1280-1ffb3f4655d2.webp")); background-position: center; background-size: cover; color: var(--paper); }
.podcast-hero { background-image: linear-gradient(90deg, rgb(5 28 44 / 91%), rgb(5 28 44 / 72%)), url("/static/optimized/demos-stencil-mural-v1-1280-3f5d094a0ade.webp"); }
.journal-hero-inner { max-width: 1100px; padding-block: clamp(4rem, 9vw, 8rem); }
.journal-hero h1, .journal-article-hero h1 { font-size: clamp(3.3rem, 7vw, 6.7rem); letter-spacing: -.075em; line-height: .94; margin: .8rem 0 1.4rem; text-wrap: balance; }
.journal-hero-inner > p:last-child, .journal-article-hero .section-wrap > p:last-child { color: color-mix(in srgb, var(--paper) 78%, transparent); font-size: clamp(.95rem, 1.4vw, 1.18rem); line-height: 1.6; max-width: 640px; }
.journal-list { background: var(--paper); padding-block: clamp(2.5rem, 6vw, 6rem); }
.problem-nav { display: flex; flex-wrap: wrap; gap: .7rem; margin-bottom: clamp(2.5rem, 5vw, 5rem); }
.problem-nav a { border: 1px solid var(--line); color: var(--ink); font-size: .875rem; font-weight: 800; line-height: 1.3; padding: .8rem 1rem; transition: background .2s ease, border-color .2s ease; }
.problem-nav a:hover, .problem-nav a:focus-visible { background: var(--paper-shade); border-color: var(--clay); }
.problem-nav span { color: var(--clay-dark); margin-left: .5rem; }
.problem-group { margin-bottom: clamp(3rem, 7vw, 6rem); scroll-margin-top: 6rem; }
.problem-group-heading { border-top: 2px solid var(--clay); padding: 1.4rem 0 2rem; }
.problem-group-heading h2 { color: var(--ink); font-family: var(--display); font-size: clamp(2.2rem, 5vw, 4.5rem); font-weight: 400; letter-spacing: -.06em; line-height: 1.02; margin: .5rem 0; }
.problem-group-heading > p:last-child { color: var(--ink-soft); font-size: .9rem; line-height: 1.6; margin: 0; max-width: 600px; }
.journal-entry { align-items: start; border-top: 1px solid var(--line); display: grid; gap: 1.5rem; grid-template-columns: 3rem minmax(0, 1fr) 2rem; padding-block: clamp(1.6rem, 3vw, 2.6rem); }
.journal-entry:last-child { border-bottom: 1px solid var(--line); }
.journal-number { color: var(--clay); font-family: var(--display); font-size: 1.3rem; }
.journal-topic { color: var(--clay-dark); display: block; font-size: .875rem; font-weight: 800; letter-spacing: .1em; margin-bottom: .5rem; text-transform: uppercase; }
.journal-entry strong { display: block; font-family: var(--display); font-size: clamp(1.7rem, 3.6vw, 3.3rem); font-weight: 400; letter-spacing: -.055em; line-height: 1.05; max-width: 850px; }
.journal-entry small { color: var(--ink-soft); display: block; font-size: .875rem; line-height: 1.5; margin-top: .7rem; }
.journal-arrow { color: var(--clay-dark); font-size: 1.4rem; text-align: right; }
.journal-entry:hover strong, .journal-entry:focus-visible strong { text-decoration: underline; text-decoration-color: var(--sun); text-underline-offset: .12em; }
.journal-entry-linked { cursor: default; }
.journal-entry-title { display: block; width: fit-content; }
.journal-entry-title:hover strong, .journal-entry-title:focus-visible strong { text-decoration: underline; text-decoration-color: var(--sun); text-underline-offset: .12em; }
.journal-entry-links { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem 1.4rem; margin-top: 1rem; }
.journal-entry-links a, .journal-entry-links .share-button { color: var(--clay-dark); font-size: .875rem; font-weight: 800; text-decoration: underline; text-underline-offset: .2rem; }
.share-button { background: transparent; border: 0; color: var(--clay-dark); cursor: pointer; font: inherit; font-size: .875rem; font-weight: 800; line-height: 1.3; padding: 0 0 .2rem; text-align: left; text-decoration: underline; text-underline-offset: .25rem; }
.share-button:hover, .share-button:focus-visible { color: var(--ink); }
.share-button-light { border: 1px solid color-mix(in srgb, var(--sun) 70%, transparent); color: var(--paper); display: inline-block; margin-top: 1.35rem; padding: .7rem .9rem; text-decoration: none; }
.share-button-light:hover, .share-button-light:focus-visible { background: var(--sun); color: var(--ink); }
.share-control { display: inline-block; position: relative; }
.share-menu[hidden] { display: none; }
.share-menu { background: var(--paper); border: 1px solid var(--clay); box-shadow: 0 12px 28px rgb(5 28 44 / 18%); color: var(--ink); display: grid; min-width: 190px; padding: .45rem; position: absolute; right: 0; top: calc(100% + .4rem); z-index: 30; }
.journal-article-hero .share-menu { bottom: calc(100% + .4rem); top: auto; }
.share-button-light + .share-menu { left: 0; right: auto; }
.share-menu a, .share-menu button { background: transparent; border: 0; color: var(--ink); cursor: pointer; display: block; font: inherit; font-size: .875rem; font-weight: 800; line-height: 1.4; padding: .6rem .7rem; text-align: left; text-decoration: none; width: 100%; }
.share-menu a:hover, .share-menu a:focus-visible, .share-menu button:hover, .share-menu button:focus-visible { background: var(--paper-shade); color: var(--clay-dark); }
.journal-article-hero .section-wrap { max-width: 980px; padding-block: clamp(2.5rem, 7vw, 6rem); }
.journal-back { border-bottom: 1px solid currentColor; display: inline-block; font-size: .875rem; font-weight: 800; margin-bottom: 2.5rem; padding-bottom: .2rem; }
.journal-body { background: var(--paper); max-width: 850px; padding-block: clamp(2.5rem, 6vw, 5rem); }
.journal-audio { display: grid; grid-template-columns: 1fr minmax(220px, 320px); align-items: center; gap: 1.5rem; border: 1px solid var(--line); background: #f6f1e7; padding: 1.25rem 1.4rem; margin-bottom: 2.5rem; }
.journal-audio-label { color: var(--ink); font-family: var(--display); font-size: 1.4rem; line-height: 1.1; }
.journal-audio p { color: var(--ink-soft); font-size: .875rem; margin: .35rem 0 0; }
.journal-audio audio { width: 100%; }
.journal-lead { font-family: var(--display); font-size: clamp(1.5rem, 3vw, 2.3rem); letter-spacing: -.025em; line-height: 1.3; margin: 0 0 3rem; }
.journal-featured-episode { align-items: center; background: var(--ink); color: var(--paper); display: grid; gap: clamp(1rem, 3vw, 2rem); grid-template-columns: minmax(145px, .8fr) minmax(0, 1.2fr); margin: -1rem 0 3rem; padding: .7rem; }
.journal-featured-episode img { aspect-ratio: 16 / 9; display: block; height: auto; object-fit: cover; width: 100%; }
.journal-featured-episode > span { display: grid; gap: .45rem; padding-right: .7rem; }
.journal-featured-episode small { color: var(--sun); font-size: .875rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.journal-featured-episode strong { font-family: var(--display); font-size: clamp(1.25rem, 2.8vw, 2rem); font-weight: 400; line-height: 1.12; }
.journal-featured-episode > span > span { color: color-mix(in srgb, var(--paper) 76%, transparent); font-size: .875rem; line-height: 1.5; }
.journal-featured-episode:hover strong, .journal-featured-episode:focus-visible strong { color: var(--sun); }
.journal-body section { border-top: 1px solid var(--line); padding-block: 1.8rem 2.2rem; }
.journal-body h2 { font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 400; letter-spacing: -.05em; line-height: 1.1; margin: 0 0 1.1rem; }
.journal-body section p { color: var(--ink-soft); font-size: 1rem; line-height: 1.78; margin: 0 0 1.1rem; }
.journal-starter ol { color: var(--ink-soft); display: grid; gap: .8rem; line-height: 1.65; margin: .5rem 0 2rem; padding-left: 1.25rem; }
.journal-starter li::marker { color: var(--clay-dark); font-weight: 800; }
.journal-cost { background: var(--paper-shade); border-left: 3px solid var(--clay); padding: clamp(1.2rem, 3vw, 2rem); }
.journal-cost .eyebrow { margin-bottom: .55rem; }
.journal-cost strong { color: var(--ink); display: block; font-family: var(--display); font-size: clamp(1.5rem, 3vw, 2.3rem); font-weight: 400; line-height: 1.15; }
.journal-cost p:not(.eyebrow) { font-size: .88rem; margin: .8rem 0; }
.journal-cost a { color: var(--clay-dark); font-size: .875rem; font-weight: 800; text-decoration: underline; text-underline-offset: .2rem; }
.journal-cost small { color: var(--ink-soft); display: block; font-size: .875rem; line-height: 1.5; margin-top: 1rem; }
.journal-podcast { background: var(--ink); color: var(--paper); margin-block: 1.5rem; padding: clamp(1.2rem, 3vw, 2rem); }
.journal-podcast { scroll-margin-top: 6rem; }
.journal-podcast .eyebrow { color: var(--sun); }
.journal-body .journal-podcast h2 { color: var(--paper); }
.journal-body .journal-podcast > p:not(.eyebrow) { color: color-mix(in srgb, var(--paper) 80%, transparent); font-size: .94rem; }
.journal-podcast video { aspect-ratio: 16 / 9; background: var(--ink); display: block; height: auto; margin: 1.3rem 0; width: 100%; }
.journal-podcast-audio { align-items: center; display: grid; gap: 1rem; grid-template-columns: 1fr minmax(210px, 320px); margin: 1.3rem 0; }
.journal-podcast-audio span { color: var(--sun); font-size: .875rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.journal-podcast-audio audio { width: 100%; }
.journal-podcast .text-link { color: var(--sun); }
.journal-sources { background: var(--paper-shade); margin-top: 1rem; padding: clamp(1.3rem, 3vw, 2rem); }
.journal-sources h2 { font-size: 1.5rem; margin-bottom: .3rem; }
.journal-sources p { color: var(--ink-soft); font-size: .875rem; line-height: 1.6; }
.journal-sources ul { list-style: none; margin: 1rem 0 0; padding: 0; }
.journal-sources li { border-top: 1px solid var(--line); font-size: .875rem; font-weight: 800; padding: .65rem 0; }
.journal-sources a { text-decoration: underline; text-underline-offset: .25rem; }
.journal-next { align-items: center; display: flex; gap: 1.5rem; justify-content: space-between; padding-top: 2.5rem; }
.journal-next p { font-family: var(--display); font-size: 1.4rem; margin: 0; }
.content-path { border-top: 2px solid var(--clay); display: grid; gap: 0; margin-top: 2rem; padding-top: 1.5rem; }
.content-path > .eyebrow { margin-bottom: .7rem; }
.content-path a { align-items: center; border-top: 1px solid var(--line); color: var(--ink); display: grid; gap: .5rem 1rem; grid-template-columns: minmax(110px, .35fr) minmax(0, 1fr) 1.5rem; padding: 1.2rem 0; }
.content-path a:last-child { border-bottom: 1px solid var(--line); }
.content-path a span:first-child { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.content-path a strong { font-family: var(--display); font-size: clamp(1.15rem, 2vw, 1.6rem); font-weight: 400; line-height: 1.15; }
.content-path a:hover strong, .content-path a:focus-visible strong { text-decoration: underline; text-decoration-color: var(--sun); text-underline-offset: .15em; }
.blog-intro .journal-body { max-width: 780px; }
.blog-question .eyebrow { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
@media (max-width: 620px) {
  .journal-hero { padding: .75rem .65rem 1rem; }
  .journal-hero-inner { background: color-mix(in srgb, var(--ink) 91%, transparent); border: 1px solid var(--sun); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ink) 75%, transparent); padding: 1.15rem; }
  .journal-article-hero { padding: .75rem .65rem 1rem; }
  .journal-article-hero .section-wrap { background: color-mix(in srgb, var(--ink) 91%, transparent); border: 1px solid var(--sun); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ink) 75%, transparent); padding: 1.15rem; }
  .journal-back { margin-bottom: 1.4rem; }
  .journal-hero h1, .journal-article-hero h1 { font-size: clamp(2rem, 8.5vw, 2.65rem); line-height: .98; }
  .journal-hero-inner > p:last-child, .journal-article-hero .section-wrap > p:last-child { font-size: .875rem; }
  .journal-entry { gap: .6rem; grid-template-columns: 2rem minmax(0, 1fr) 1rem; }
  .journal-entry strong { font-size: 1.65rem; }
  .journal-entry small { font-size: .875rem; }
  .journal-body section p { font-size: .94rem; }
  .journal-audio { grid-template-columns: 1fr; gap: .85rem; }
  .journal-podcast-audio { grid-template-columns: 1fr; }
  .journal-featured-episode { align-items: start; grid-template-columns: 1fr; padding: .65rem; }
  .journal-featured-episode > span { padding: .35rem .45rem .55rem; }
  .problem-nav { flex-direction: column; }
  .journal-next { align-items: flex-start; flex-direction: column; }
  .content-path a { align-items: start; grid-template-columns: minmax(0, 1fr) 1.2rem; }
  .content-path a span:first-child { grid-column: 1 / -1; }
}
.podcast-hero h1 { max-width: 1100px; }
.podcast-title-mark { color: var(--sun); }
.podcast-hero-foot { border-top: 1px solid rgb(247 242 231 / 28%); color: var(--sun); display: flex; flex-wrap: wrap; gap: .5rem 2rem; font-size: .875rem; font-weight: 800; letter-spacing: .12em; margin-top: clamp(2rem, 5vw, 4rem); padding-top: 1rem; text-transform: uppercase; }
.podcast-list { background: var(--paper); padding-block: clamp(2rem, 5vw, 5rem); }
.podcast-list-intro { align-items: end; display: flex; justify-content: space-between; gap: 2rem; padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.podcast-list-intro > p:last-child { color: var(--ink-soft); font-size: .875rem; line-height: 1.55; margin: 0; max-width: 340px; }
.podcast-entry { border-top: 1px solid var(--line); scroll-margin-top: 6rem; }
.podcast-entry:last-of-type { border-bottom: 1px solid var(--line); }
.podcast-entry-summary { align-items: start; cursor: pointer; display: grid; gap: clamp(.8rem, 2.2vw, 2rem); grid-template-columns: 2.4rem clamp(110px, 15vw, 210px) minmax(0, 1fr) 2rem; list-style: none; padding-block: clamp(1.4rem, 3vw, 2.4rem); }
.podcast-entry-summary::-webkit-details-marker { display: none; }
.podcast-entry-summary:focus-visible { outline: 2px solid var(--clay-dark); outline-offset: 4px; }
.podcast-entry-number, .podcast-entry-topic, .podcast-entry-toggle { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .1em; }
.podcast-entry-number { padding-top: .2rem; }
.podcast-entry-thumb { aspect-ratio: 16 / 9; display: block; height: auto; object-fit: cover; width: 100%; }
.podcast-entry-heading { display: flex; flex-direction: column; }
.podcast-entry-topic { text-transform: uppercase; }
.podcast-entry-heading strong { color: var(--ink); font-family: var(--display); font-size: clamp(2rem, 4.3vw, 4.2rem); font-weight: 400; letter-spacing: -.055em; line-height: 1; margin: .45rem 0 .6rem; transition: color .2s ease; }
.podcast-entry-summary:hover .podcast-entry-heading strong, .podcast-entry[open] .podcast-entry-heading strong { color: var(--clay-dark); }
.podcast-entry-teaser { color: var(--ink-soft); font-size: .875rem; line-height: 1.55; max-width: 690px; }
.podcast-entry-toggle { align-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); display: flex; font-size: 1.4rem; font-weight: 300; height: 2rem; justify-content: center; letter-spacing: 0; line-height: 1; transition: transform .25s ease, background .25s ease; width: 2rem; }
.podcast-entry[open] .podcast-entry-toggle { background: var(--sun); border-color: var(--sun); transform: rotate(45deg); }
.podcast-entry-expanded { padding: 0 0 clamp(2rem, 4vw, 3.5rem) calc(2.4rem + clamp(.8rem, 2.2vw, 2rem)); }
.podcast-art { background: var(--ink); margin: 0 0 clamp(1.5rem, 3vw, 2.7rem); }
.podcast-art img { aspect-ratio: 1672 / 941; display: block; object-fit: cover; width: 100%; }
.podcast-art figcaption { align-items: center; color: var(--sun); display: flex; font-size: .875rem; font-weight: 800; justify-content: space-between; letter-spacing: .1em; padding: .72rem 1rem; text-transform: uppercase; }
.podcast-video-frame { aspect-ratio: 1672 / 941; position: relative; }
.podcast-video-frame video { background: var(--ink); display: block; height: 100%; width: 100%; }
.podcast-video-play { align-items: center; background: color-mix(in srgb, var(--ink) 90%, transparent); border: 1px solid var(--sun); color: var(--paper); display: inline-flex; font-size: .875rem; font-weight: 800; gap: .7rem; left: 50%; letter-spacing: .04em; padding: .85rem 1.15rem; position: absolute; text-transform: uppercase; top: 50%; transform: translate(-50%, -50%); transition: background .2s ease, transform .2s var(--ease-out); white-space: nowrap; }
.podcast-video-play span { color: var(--sun); font-size: 1.1rem; }
.podcast-video-play:hover, .podcast-video-play:focus-visible { background: var(--ink); transform: translate(-50%, -50%) scale(1.04); }
.podcast-video-frame.is-playing .podcast-video-play { display: none; }
.podcast-entry-body { align-items: start; display: grid; gap: clamp(2rem, 5vw, 5rem); grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr); }
.podcast-story > p:not(.eyebrow) { color: var(--ink-soft); font-size: 1rem; line-height: 1.65; max-width: 600px; }
.podcast-entry ul { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; margin: 1rem 0 0; padding-left: 1.1rem; }
.podcast-production-note { color: var(--ink-soft); font-size: .875rem; line-height: 1.5; margin: 1.5rem 0 0; }
.podcast-actions { align-items: flex-start; display: flex; flex-direction: column; gap: 1rem; }
.podcast-audio-label { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.podcast-actions audio { width: 100%; }
.podcast-actions > p { border-top: 1px solid var(--line); font-size: .875rem; font-weight: 800; margin: 0; padding-top: .7rem; width: 100%; }
@media (max-width: 760px) { .podcast-list-intro { align-items: start; flex-direction: column; gap: .35rem; }.podcast-entry-summary { gap: .55rem .75rem; grid-template-columns: 1.5rem minmax(0, 1fr) 2rem; }.podcast-entry-number { font-size: .875rem; }.podcast-entry-thumb { grid-column: 2; grid-row: 1; max-width: 160px; }.podcast-entry-heading { grid-column: 2; grid-row: 2; }.podcast-entry-toggle { grid-column: 3; grid-row: 1; }.podcast-entry-heading strong { font-size: clamp(2rem, 8vw, 3rem); }.podcast-entry-expanded { padding-left: 0; }.podcast-entry-body { gap: 1rem; grid-template-columns: 1fr; }.podcast-actions { padding-top: .5rem; }.podcast-art figcaption { font-size: .875rem; }.podcast-video-play { font-size: .875rem; padding: .7rem .8rem; } }
@media (max-width: 1150px) {
  .site-header { height: 72px; }
  .site-header.scrolled { height: 64px; }
  .menu-toggle { display: block; z-index: 2; }
  .site-nav { align-items: flex-start; background: var(--paper); border-bottom: 1px solid var(--line); flex-direction: column; gap: .4rem; inset: 72px 0 auto; max-height: 0; opacity: 0; overflow: hidden; padding: 0 clamp(1.25rem, 4vw, 3.25rem); pointer-events: none; position: absolute; visibility: hidden; }
  .site-header.scrolled .site-nav { top: 64px; }
  .site-nav.open { max-height: calc(100svh - 72px); opacity: 1; overflow-y: auto; padding-block: .8rem 1rem; pointer-events: auto; visibility: visible; }
  .site-nav > a { align-items: center; display: inline-flex; font-size: .875rem; min-height: 44px; }
}

/* Clear first projects, with the site's paper-and-ink editorial treatment. */
.nav-learn { position: relative; }
.nav-learn summary { border-bottom: 1px solid transparent; color: var(--ink-soft); cursor: pointer; font-size: .875rem; font-weight: 800; letter-spacing: .015em; list-style: none; padding-block: .3rem; white-space: nowrap; }
.nav-learn summary::-webkit-details-marker { display: none; }
.nav-learn summary span { color: var(--clay-dark); margin-left: .18rem; }
.nav-learn summary:hover, .nav-learn summary:focus-visible, .nav-learn summary.is-current, .nav-learn[open] summary { border-color: var(--clay); color: var(--ink); }
.nav-learn-menu { background: var(--paper); border: 1px solid var(--line); box-shadow: 0 12px 25px rgb(5 28 44 / 13%); display: grid; min-width: 210px; padding: .35rem; position: absolute; right: 0; top: calc(100% + .55rem); z-index: 11; }
.nav-learn-menu a { color: var(--ink); font-size: .875rem; font-weight: 800; padding: .7rem .8rem; }
.nav-learn-menu a:hover, .nav-learn-menu a:focus-visible, .nav-learn-menu a[aria-current="page"] { background: var(--paper-shade); }

.first-projects { background: var(--paper); padding-block: clamp(4rem, 7vw, 7rem); scroll-margin-top: 72px; }
.first-projects-heading { align-items: end; display: grid; gap: 1rem clamp(2rem, 5vw, 6rem); grid-template-columns: minmax(0, 1fr) minmax(250px, .65fr); margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.first-projects-heading .eyebrow { grid-column: 1 / -1; margin: 0; }
.first-projects-heading h2, .service-offers-heading h2, .complete-example-copy h2 { font-size: clamp(2.7rem, 5vw, 5.4rem); font-weight: 400; letter-spacing: -.065em; line-height: .96; margin: 0; max-width: 850px; }
.first-projects-heading > p:last-child, .service-offers-heading > p:last-child, .complete-example-copy > p:not(.eyebrow) { color: var(--ink-soft); font-size: clamp(.82rem, 1vw, 1rem); line-height: 1.7; margin: 0; }
.first-projects-layout { display: grid; gap: clamp(1.5rem, 4vw, 4rem); grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.first-project-feature { background: var(--ink); color: var(--paper); display: flex; flex-direction: column; min-height: 390px; padding: clamp(1.5rem, 3vw, 3rem); }
.first-project-number { color: var(--sun); font-size: .875rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.first-project-feature h3 { font-family: var(--display); font-size: clamp(3rem, 5vw, 5rem); font-weight: 400; letter-spacing: -.06em; line-height: .96; margin: 2rem 0 1rem; }
.first-project-feature > p { color: color-mix(in srgb, var(--paper) 83%, transparent); font-size: .9rem; line-height: 1.7; max-width: 550px; }
.first-project-bottom { align-items: center; border-top: 1px solid color-mix(in srgb, var(--paper) 23%, transparent); display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; margin-top: auto; padding-top: 1.5rem; }
.first-project-bottom strong { color: var(--sun); font-family: var(--display); font-size: 1.7rem; font-weight: 400; }
.first-project-options { display: grid; grid-template-rows: 1fr 1fr; }
.first-project-option { border-top: 1px solid var(--line); padding: clamp(1rem, 2vw, 2rem) 0; }
.first-project-option:last-child { border-bottom: 1px solid var(--line); }
.first-project-option > span { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.first-project-option h3 { font-family: var(--display); font-size: clamp(2rem, 3vw, 3rem); font-weight: 400; letter-spacing: -.05em; line-height: 1; margin: .7rem 0; }
.first-project-option p { color: var(--ink-soft); font-size: .875rem; line-height: 1.55; margin: 0 0 1rem; }
.first-project-option a { border-bottom: 1px solid var(--clay); color: var(--clay-dark); font-size: .875rem; font-weight: 800; padding-bottom: .2rem; }
.first-project-proof { align-items: center; border-top: 1px solid var(--line); display: flex; gap: 1.5rem; justify-content: space-between; margin-top: clamp(2rem, 4vw, 4rem); padding-top: 1.25rem; }
.first-project-proof p { color: var(--ink-soft); font-size: .875rem; line-height: 1.6; margin: 0; max-width: 690px; }

.service-offers { background: var(--paper); padding-block: clamp(4rem, 7vw, 7rem); scroll-margin-top: 72px; }
.service-offers-heading { align-items: end; display: grid; gap: 1rem 3rem; grid-template-columns: minmax(0, 1fr) minmax(240px, .6fr); margin-bottom: 3rem; }
.service-offers-heading .eyebrow { grid-column: 1 / -1; margin: 0; }
.service-offer { border-top: 1px solid var(--line); display: grid; gap: clamp(1.5rem, 3vw, 3rem); grid-template-columns: minmax(240px, .9fr) minmax(280px, 1.1fr) minmax(155px, .45fr); padding-block: clamp(1.8rem, 3vw, 3rem); scroll-margin-top: 88px; }
.service-offer:last-child { border-bottom: 1px solid var(--line); }
.service-offer-heading { display: flex; gap: 1rem; }
.service-offer-heading > span { color: var(--clay-dark); font-family: var(--display); font-size: 1.4rem; }
.service-offer h3 { font-family: var(--display); font-size: clamp(2rem, 2.7vw, 3rem); font-weight: 400; letter-spacing: -.055em; line-height: 1; margin: .2rem 0 .75rem; }
.service-offer-heading p { color: var(--ink); font-size: .875rem; font-weight: 700; line-height: 1.5; margin: 0; }
.service-offer-detail > p { color: var(--ink-soft); font-size: .875rem; line-height: 1.65; margin: 0 0 1rem; }
.service-offer-detail ul { list-style: none; margin: 0 0 1rem; padding: 0; }
.service-offer-detail li { border-top: 1px solid var(--line); font-size: .875rem; font-weight: 700; line-height: 1.5; padding: .6rem 0; }
.service-offer-detail small { color: var(--ink-soft); display: block; font-size: .875rem; line-height: 1.55; }
.service-offer-action { align-items: flex-start; display: flex; flex-direction: column; gap: 1rem; }
.service-offer-action strong { color: var(--clay-dark); font-family: var(--display); font-size: 1.5rem; font-weight: 400; line-height: 1.1; }
.service-offer-action a { font-size: .875rem; }
.service-ledger-intro { border-top: 1px solid var(--line); display: grid; gap: 1rem 3rem; grid-template-columns: 1fr 1fr; margin-bottom: 2rem; padding-top: 1.5rem; }
.service-ledger-intro .eyebrow { grid-column: 1 / -1; margin: 0; }
.service-ledger-intro h2 { font-size: clamp(2.7rem, 4.5vw, 4.8rem); font-weight: 400; letter-spacing: -.06em; line-height: .98; margin: 0; }
.service-ledger-intro > p:last-child { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; margin: 0; }

.complete-example { align-items: center; background: var(--paper); display: grid; gap: clamp(2rem, 6vw, 6rem); grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr); padding-block: clamp(4rem, 7vw, 7rem); scroll-margin-top: 72px; }
.complete-example-copy { display: grid; gap: 1.2rem; }
.complete-example-copy .eyebrow { margin: 0; }
.complete-example-copy .complete-example-note { color: var(--ink); font-size: .875rem; font-weight: 800; }
.complete-example-sheet { background: var(--paper-bright); border: 1px solid var(--line); box-shadow: 12px 12px 0 var(--paper-shade); padding: clamp(1.3rem, 2.5vw, 2.5rem); }
.complete-example-top { border-bottom: 2px solid var(--sun); display: grid; gap: .2rem; padding-bottom: 1rem; }
.complete-example-top span { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.complete-example-top strong { font-family: var(--display); font-size: 1.6rem; font-weight: 400; }
.complete-example-build, .complete-example-line, .complete-example-total { align-items: baseline; display: grid; gap: .25rem 1rem; grid-template-columns: 1fr auto; padding-block: .8rem; }
.complete-example-build { border-bottom: 1px solid var(--line); }
.complete-example-build span, .complete-example-line span, .complete-example-total span { font-size: .875rem; font-weight: 700; }
.complete-example-build strong, .complete-example-total strong { font-family: var(--display); font-size: 1.65rem; font-weight: 400; }
.complete-example-build small { color: var(--ink-soft); font-size: .875rem; grid-column: 1 / -1; }
.complete-example-line { border-bottom: 1px solid var(--line); }
.complete-example-line strong { font-size: .875rem; }
.complete-example-total { color: var(--clay-dark); padding-bottom: 0; }
.contact-context { background: var(--paper-shade); color: var(--ink); font-size: .875rem; line-height: 1.5; margin: 0 0 1rem; padding: .65rem .75rem; }
.contact-context strong { font-weight: 800; }
.podcast-next-step { font-size: .875rem; }
.about-evidence { background: var(--paper); display: grid; gap: clamp(2rem, 6vw, 6rem); grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); padding-block: clamp(4rem, 7vw, 7rem); }
.about-evidence h2 { font-size: clamp(2.7rem, 4.6vw, 4.9rem); font-weight: 400; letter-spacing: -.065em; line-height: .98; margin: 0 0 1.25rem; }
.about-evidence > div > p:last-child { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; max-width: 570px; }
.about-evidence nav { border-top: 1px solid var(--line); }
.about-evidence nav a { align-items: center; border-bottom: 1px solid var(--line); display: grid; gap: .7rem; grid-template-columns: 145px 1fr 1rem; padding-block: 1.25rem; }
.about-evidence nav a span:first-child { color: var(--clay-dark); font-size: .875rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.about-evidence nav a strong { font-family: var(--display); font-size: clamp(1.45rem, 2vw, 2.2rem); font-weight: 400; letter-spacing: -.04em; }
.about-evidence nav a:hover strong, .about-evidence nav a:focus-visible strong { color: var(--clay-dark); }

@media (max-width: 1150px) {
  .nav-learn { width: 100%; }
  .nav-learn summary { align-items: center; display: flex; font-size: .875rem; min-height: 44px; }
  .nav-learn-menu { border: 0; border-left: 1px solid var(--sun); box-shadow: none; margin: .2rem 0 .7rem .35rem; padding: 0 0 0 .55rem; position: static; }
  .nav-learn-menu a { font-size: .875rem; }
}
@media (max-width: 900px) {
  .first-projects-heading, .service-offers-heading, .complete-example, .service-ledger-intro, .about-evidence { grid-template-columns: 1fr; }
  .first-projects-heading .eyebrow, .service-offers-heading .eyebrow, .service-ledger-intro .eyebrow { grid-column: 1; }
  .service-offer { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .service-offer-action { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .first-projects { padding-block: 3.5rem; }
  .first-projects-layout, .service-offer { grid-template-columns: 1fr; }
  .first-project-feature { min-height: 0; }
  .first-project-feature h3 { margin-top: 1.5rem; }
  .first-project-bottom { align-items: flex-start; flex-direction: column; }
  .first-project-bottom .button { width: 100%; }
  .first-project-proof { align-items: flex-start; flex-direction: column; }
  .service-offer { gap: 1rem; }
  .service-offer-action { grid-column: 1; }
  .complete-example-sheet { box-shadow: 7px 7px 0 var(--paper-shade); }
  .about-evidence nav a { align-items: start; grid-template-columns: 1fr 1rem; }
  .about-evidence nav a span:first-child { grid-column: 1 / -1; }
}
/* Focused product pilots */
.home-product-note, .service-product-bridge { align-items: end; background: var(--paper-shade); display: flex; gap: 2rem; justify-content: space-between; padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.home-product-note > div, .service-product-bridge > div { max-width: 800px; }
.home-product-note h2, .service-product-bridge h2 { font-size: clamp(2.25rem, 4vw, 4rem); letter-spacing: -.06em; line-height: 1.02; margin-bottom: 1rem; }
.home-product-note p:not(.eyebrow), .service-product-bridge p:not(.eyebrow) { color: var(--ink-soft); font-size: .875rem; line-height: 1.65; margin-bottom: 0; }
.home-product-note > a, .service-product-bridge > a { flex: 0 0 auto; }
.product-hero { background: var(--surface-ink); color: var(--paper); }
.product-hero-inner { align-items: end; display: grid; gap: clamp(2rem, 7vw, 7rem); grid-template-columns: minmax(0, 1.35fr) minmax(240px, .5fr); padding-block: clamp(4rem, 8vw, 7rem); }
.product-hero h1 { font-size: clamp(3.1rem, 6.5vw, 6.7rem); letter-spacing: -.075em; line-height: .94; margin: 0 0 1.5rem; max-width: 950px; text-wrap: balance; }
.product-hero-inner > div:first-child > p:not(.eyebrow) { color: color-mix(in srgb, var(--paper) 78%, transparent); font-size: clamp(.95rem, 1.3vw, 1.15rem); line-height: 1.65; max-width: 650px; }
.product-hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2rem; }
.product-hero-actions .share-button { margin-top: 0; }
.product-hero-card { border-top: 2px solid var(--sun); padding-top: 1.2rem; }
.product-hero-card span, .product-outcome span { color: var(--sun); display: block; font-size: .875rem; font-weight: 800; letter-spacing: .1em; margin-bottom: .8rem; text-transform: uppercase; }
.product-hero-card strong { display: block; font-family: var(--display); font-size: clamp(1.8rem, 2.6vw, 2.7rem); font-weight: 400; letter-spacing: -.05em; line-height: 1.08; }
.product-hero-card p { color: color-mix(in srgb, var(--paper) 72%, transparent); font-size: .875rem; line-height: 1.6; margin: .9rem 0 0; }
.product-index { background: var(--paper); padding-block: clamp(2.5rem, 5vw, 5rem); }
.product-index nav { border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.product-index nav a { border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); min-height: 175px; padding: 1.25rem; position: relative; transition: background .2s ease; }
.product-index nav a:first-child { border-left: 1px solid var(--line); }
.product-index nav a:hover, .product-index nav a:focus-visible { background: var(--paper-shade); }
.product-index nav span { color: var(--clay-dark); display: block; font-size: .875rem; font-weight: 800; margin-bottom: 1.2rem; }
.product-index nav strong { display: block; font-family: var(--display); font-size: clamp(1.4rem, 2vw, 2rem); font-weight: 400; letter-spacing: -.05em; line-height: 1.1; }
.product-index nav small { color: var(--ink-soft); display: block; font-size: .875rem; line-height: 1.5; margin-top: .6rem; max-width: 240px; }
.product-index nav i { bottom: 1rem; color: var(--clay-dark); font-style: normal; position: absolute; right: 1rem; }
.product-list { background: var(--paper); padding-bottom: clamp(4rem, 8vw, 8rem); }
.product-feature { border-top: 2px solid var(--ink); display: grid; gap: clamp(2rem, 5vw, 5rem); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding-block: clamp(2.4rem, 5vw, 5rem); scroll-margin-top: 5.5rem; }
.product-feature:nth-child(even) .product-feature-art { order: 2; }
.product-feature-art { align-self: start; background: var(--ink); position: sticky; top: 5.5rem; }
.product-feature-art img { aspect-ratio: 1672 / 941; display: block; height: auto; object-fit: cover; width: 100%; }
.product-feature-art span { color: var(--paper); display: block; font-size: .875rem; font-weight: 800; letter-spacing: .09em; padding: .8rem 1rem; text-transform: uppercase; }
.product-feature-copy h2 { font-size: clamp(2.7rem, 4.7vw, 5rem); letter-spacing: -.07em; line-height: .95; margin: 0 0 1rem; }
.product-feature-copy > p:not(.eyebrow) { color: var(--ink-soft); font-size: .875rem; line-height: 1.7; }
.product-feature-copy .product-promise { color: var(--ink); font-size: clamp(1rem, 1.4vw, 1.3rem); font-weight: 700; line-height: 1.45; }
.product-outcome { background: var(--ink); color: var(--paper); margin: 1.8rem 0; padding: 1.3rem; }
.product-outcome strong { display: block; font-family: var(--display); font-size: clamp(1.4rem, 2vw, 2rem); font-weight: 400; letter-spacing: -.035em; line-height: 1.15; }
.product-feature-copy h3 { font-size: 1.45rem; letter-spacing: -.035em; margin: 1.7rem 0 .7rem; }
.product-feature-copy ul { list-style: none; margin: 0 0 1.5rem; padding: 0; }
.product-feature-copy li { border-top: 1px solid var(--line); font-size: .875rem; line-height: 1.55; padding: .65rem 0; }
.product-feature-copy li:last-child { border-bottom: 1px solid var(--line); }
.product-feature-copy .product-tools { color: var(--ink); }
.product-feature-copy .product-boundary { border-left: 2px solid var(--clay); padding-left: 1rem; }
.product-feature-foot { border-top: 1px solid var(--line); display: grid; gap: .5rem; margin: 1.8rem 0; padding-top: 1rem; }
.product-feature-foot span { color: var(--clay-dark); font-family: var(--display); font-size: 1.55rem; }
.product-feature-foot small { color: var(--ink-soft); font-size: .875rem; line-height: 1.6; }
.product-feature-links { align-items: center; display: flex; flex-wrap: wrap; gap: .9rem 1.25rem; }
.product-feature-links .button { margin-right: .4rem; }
.product-feature-links .share-button { font-size: .875rem; }
.product-closing { background: var(--surface-ink); color: var(--paper); padding-block: clamp(3.5rem, 7vw, 6rem); }
.product-closing h2 { font-size: clamp(2.8rem, 5vw, 5rem); letter-spacing: -.065em; line-height: .95; margin-bottom: 1rem; max-width: 760px; }
.product-closing p:not(.eyebrow) { color: color-mix(in srgb, var(--paper) 78%, transparent); font-size: .9rem; line-height: 1.6; max-width: 550px; }
@media (max-width: 900px) { .home-product-note, .service-product-bridge { align-items: flex-start; flex-direction: column; }.product-hero-inner, .product-feature { grid-template-columns: 1fr; }.product-hero-card { max-width: 430px; }.product-feature:nth-child(even) .product-feature-art { order: 0; }.product-feature-art { position: static; }.product-index nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }.product-index nav a:nth-child(3) { border-left: 1px solid var(--line); } }
@media (max-width: 620px) { .product-index nav { grid-template-columns: 1fr; }.product-index nav a { border-left: 1px solid var(--line); min-height: 0; padding: 1rem 2.5rem 1rem 1rem; }.product-index nav span { margin-bottom: .3rem; }.product-index nav small { margin-top: .25rem; }.product-feature { gap: 1.5rem; }.product-feature-links { align-items: stretch; flex-direction: column; }.product-feature-links .button { margin-right: 0; }.product-hero-actions { align-items: stretch; flex-direction: column; }.product-hero-actions .share-button { align-self: flex-start; } }

/* Readable type and shared workflow pages, September 2026. */
[hidden] { display: none !important; }
button, summary, select, input, textarea { touch-action: manipulation; }
input, textarea, select, .contact-form input, .contact-form textarea, .demo-controls input, .followup-composer textarea, .agent-chat-form input { font-size: 1rem; }
.button, .share-button, .text-link, .site-nav > a, .nav-learn > summary, .demo-controls button, .followup-action, .composer-actions button, .dashboard-controls button, .agent-suggestions button { min-height: 44px; }
.button, .share-button, .text-link { align-items: center; }
.text-link { display: inline-flex; }
.site-nav > a, .nav-learn > summary { display: inline-flex; align-items: center; font-size: .875rem; }
.eyebrow { font-size: .8125rem; line-height: 1.6; }
.contact-copy p, .host-hero-support > p, .journal-body p, .journal-body li, .product-feature-copy > p, .product-feature-copy li, .demo-module-copy > p:not(.eyebrow):not(.demo-outcome), .first-project-card p { font-size: 1rem; line-height: 1.7; }
.button-primary:hover, .button-primary:focus-visible, .nav-cta:hover { background: var(--clay-dark); color: var(--paper); }
.host-player { position: relative; min-width: 0; }
.host-player video { display: block; width: 100%; }
.host-play { position: absolute; inset: 45% auto auto 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; gap: .5rem; min-width: 44px; min-height: 44px; padding: .65rem 1rem; white-space: nowrap; background: var(--ink); color: var(--paper); border: 1px solid var(--sun); border-radius: 0; font-size: .875rem; font-weight: 800; }
.host-player.is-playing .host-play { display: none; }
.podcast-video-play { min-height: 44px; font-size: .875rem; }
.episode-media { min-width: 0; }
.episode-media video { width: 100%; height: auto; display: block; }
.episode-audio { display: grid; gap: .75rem; margin: 1.5rem 0; }
.episode-audio label { font-weight: 700; }
.episode-audio audio { width: 100%; max-width: 100%; }
.episode-transcript { padding: 1rem 0; border-block: 1px solid var(--line); }
.episode-transcript summary { cursor: pointer; font-weight: 800; min-height: 44px; display: list-item; }
.episode-transcript p { max-width: 75ch; font-size: 1rem; line-height: 1.75; }
.transcript-note, .media-status { color: var(--ink-soft); font-size: .875rem; }
.episode-page { padding-block: clamp(2rem, 5vw, 5rem); }
.episode-heading { max-width: 960px; margin-bottom: 2.5rem; }
.episode-heading h1, .pilot-hero h1, .utility-heading h1 { font-family: var(--display); font-weight: 400; letter-spacing: -.04em; line-height: 1.03; font-size: clamp(2.3rem, 5vw, 5rem); margin: .75rem 0 1.25rem; }
.episode-heading > p:last-child, .utility-heading > p:last-child { font-size: 1.125rem; max-width: 64ch; line-height: 1.7; }
.episode-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.episode-next { border-top: 3px solid var(--sun); padding-top: 1rem; }
.episode-next h2, .pilot-body h2, .problem-path h2, .proof-work h2, .problem-chooser h2 { font-family: var(--display); font-weight: 400; letter-spacing: -.03em; font-size: clamp(1.8rem, 3vw, 2.75rem); line-height: 1.1; }
.episode-next li { margin-bottom: 1rem; }
.episode-next nav, .episode-series { display: grid; gap: .75rem; margin-block: 1.5rem; }
.episode-next nav a { text-decoration: underline; text-underline-offset: .25rem; padding-block: .5rem; }
.episode-series { border-top: 1px solid var(--line); margin-top: 3rem; padding-top: 2rem; }
.pilot-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 3rem; padding-block: 3.5rem; }
.pilot-hero figure { margin: 0; }
.pilot-hero img { width: 100%; height: auto; display: block; }
.pilot-hero figcaption { border-top: 3px solid var(--sun); padding-top: 1rem; font-size: .875rem; line-height: 1.65; }
.pilot-promise { font-size: 1.4rem; line-height: 1.4; font-weight: 700; }
.pilot-hero p:not(.eyebrow) { max-width: 60ch; }
.pilot-actions { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; margin-top: 1.5rem; }
.pilot-body { padding-bottom: 4rem; }
.pilot-body > section { padding-block: 3rem; border-top: 1px solid var(--line); }
.pilot-demo-intro { max-width: 760px; margin-bottom: 2rem; }
.pilot-demo p, .pilot-scope dd { line-height: 1.7; }
.demo-assurance { border-left: 3px solid var(--sun); padding-left: 1rem; color: var(--ink-soft); }
.readiness-layout, .closeout-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 2rem; align-items: start; }
.readiness-queue, .readiness-review, .closeout-layout > div { padding: clamp(1rem, 2.5vw, 2rem); background: var(--paper-bright); border: 1px solid var(--line); min-width: 0; }
.readiness-queue h3, .readiness-review h3 { margin-top: 0; }
.job-choice { display: grid; gap: .5rem; width: 100%; text-align: left; padding: 1rem; border: 0; border-top: 1px solid var(--line); background: transparent; color: var(--ink); }
.job-choice span { font-size: .875rem; }
.job-choice[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-left: 4px solid var(--sun); }
.readiness-review dl { margin: 1.5rem 0; }
.readiness-review dt { font-size: .875rem; font-weight: 800; margin-top: 1rem; }
.readiness-review dd { margin: .3rem 0 0; }
.pilot-demo label { display: block; font-weight: 700; margin-block: .75rem; }
.pilot-demo textarea, .pilot-demo select { width: 100%; border: 1px solid var(--ink-soft); padding: .8rem; font: inherit; background: var(--paper); color: var(--ink); border-radius: 0; }
.pilot-demo textarea { resize: vertical; }
.pilot-demo .review-check { display: flex; gap: .75rem; align-items: flex-start; line-height: 1.6; min-height: 44px; margin-block: 1.25rem; }
.review-check input { flex: 0 0 auto; width: 22px; height: 22px; margin-top: 3px; accent-color: var(--ink); }
.pilot-demo button:disabled { opacity: .55; }
.demo-action { min-height: 44px; padding: .7rem 1rem; background: var(--paper-shade); color: var(--ink); border: 1px solid var(--line); font-weight: 700; }
.demo-next-step { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; margin-top: 2rem; }
.demo-next-step .text-link { border: 0; background: transparent; text-decoration: underline; }
.closeout-layout blockquote { margin: 1.5rem 0; padding: 1rem; border-left: 3px solid var(--sun); line-height: 1.75; background: var(--paper); }
.pilot-scope dl { display: grid; grid-template-columns: 180px minmax(0, 1fr); max-width: 950px; margin-block: 2rem; }
.pilot-scope dt, .pilot-scope dd { border-top: 1px solid var(--line); margin: 0; padding: 1rem 0; }
.pilot-scope dt { font-weight: 800; }
.pilot-ending { background: var(--ink); color: var(--paper); padding: 2rem; margin-top: 2rem; }
.pilot-ending .button { background: var(--sun); color: var(--ink); margin: .5rem 1rem .5rem 0; }
.pilot-ending .share-button { color: var(--paper); border-color: var(--sun); }
.utility-heading { padding-block: 3rem 1rem; }
.utility-heading h1 { max-width: 18ch; }
.problem-chooser { padding-block: 2rem; }
.problem-chooser nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.problem-chooser nav a { display: flex; align-items: center; justify-content: space-between; gap: .75rem; border: 1px solid var(--line); padding: 1.2rem; min-height: 64px; background: var(--paper-bright); font-weight: 700; }
.problem-chooser nav a:hover { background: var(--ink); color: var(--paper); }
.home-chooser { background: var(--paper); }
body[data-page="find_your_fix"] main > .problem-chooser { padding-inline: clamp(1.25rem, 4vw, 6rem); }
.problem-path { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; border-top: 1px solid var(--line); padding-block: 3rem; scroll-margin-top: 5rem; }
.problem-path nav { display: grid; gap: .4rem; align-items: start; justify-items: start; }
.problem-price { font-weight: 800; }
.proof-work { padding-bottom: 4rem; }
.proof-work > section { padding-block: 2.5rem; border-top: 1px solid var(--line); max-width: 1000px; }
.proof-work p { max-width: 75ch; line-height: 1.75; }
.proof-limit { color: var(--ink-soft); border-left: 3px solid var(--sun); padding-left: 1rem; }
.proof-work .text-link { margin-right: 1.5rem; }
.contact-page { padding-top: 3rem; }
.contact-copy h1 { font-family: var(--display); font-size: clamp(2rem, 4vw, 4rem); line-height: 1.08; font-weight: 400; letter-spacing: -.04em; }
.contact-fallback a, .form-assurance a { text-decoration: underline; text-underline-offset: .2rem; }
.contact-fallback { color: var(--paper); }
@media (max-width: 1000px) {
    .pilot-hero, .episode-layout { grid-template-columns: minmax(0, 1fr); }
    .pilot-hero { gap: 2rem; }
    .pilot-hero figure { max-width: 760px; }
    .problem-chooser nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
    .readiness-layout, .closeout-layout, .problem-path { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
    .pilot-hero { padding-block: 2rem; }
    .pilot-scope dl { grid-template-columns: minmax(0, 1fr); }
    .pilot-scope dt { padding-bottom: .25rem; }
    .pilot-scope dd { border-top: 0; padding-top: 0; }
    .pilot-ending { padding: 1.25rem; }
    .contact-layout { gap: 1.25rem; }
    .contact-page { padding-top: 1.5rem; }
    .contact-copy .eyebrow, .contact-copy > p:not(.eyebrow) { display: none; }
    .contact-copy h1 { font-size: 2rem; margin: 0; }
    .contact-form { padding: 1.25rem; }
    .contact-form .form-kicker { display: none; }
    .host-play { padding: .5rem; inset: 45% auto auto 50%; }
    .host-play span { display: none; }
    .podcast-video-play { max-width: calc(100% - 2rem); padding: .75rem; font-size: .875rem; }
    .podcast-entry-summary { column-gap: .65rem; }
    .demo-screen-top, .dashboard-top { flex-wrap: wrap; }
    .followup-row { grid-template-columns: auto minmax(0, 1fr); }
    .followup-action { grid-column: 2; grid-row: auto; justify-self: start; }
    .dashboard-stats { gap: .3rem; }
    .dashboard-stats div { padding: .5rem; }
    .dashboard-bars { height: 165px; }
    .dashboard-source b { overflow-wrap: anywhere; }
}
@media (max-width: 420px) {
    .problem-chooser nav { grid-template-columns: minmax(0, 1fr); }
    .brand-descriptor { font-size: .65rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body[data-page="product_detail"] main, body[data-page="find_your_fix"] main, body[data-page="work"] main, body[data-page="privacy"] main, body:has(.episode-page) main { background: var(--paper); }
.utility-page { padding-block: 3rem; }
.contact-form-wrap { min-width: 0; }

.footer-nav a, .share-menu a, .share-menu button, .problem-nav a { min-height: 44px; display: inline-flex; align-items: center; }
.menu-toggle { min-width: 44px; min-height: 44px; }
.host-hero-transcript summary, .avatar-video-transcript summary { min-height: 44px; padding-block: .65rem; }
.website-offer { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: center; gap: 2rem; padding-block: 2.5rem; background: var(--paper); border-bottom: 1px solid var(--line); }
.website-offer h2, .website-price-note h2 { font-family: var(--display); font-size: clamp(2rem, 3.5vw, 3.2rem); font-weight: 400; line-height: 1.1; letter-spacing: -.035em; margin: .5rem 0 1rem; }
.website-offer p, .website-price-note p { max-width: 65ch; font-size: 1rem; line-height: 1.7; }
.website-price-note { padding-block: 2.5rem; background: var(--paper); }
.website-page { background: var(--paper); }
.website-page li { margin-bottom: .75rem; max-width: 70ch; }
@media(max-width: 700px) { .website-offer { grid-template-columns: minmax(0, 1fr); gap: .5rem; padding-block: 1.5rem; } }

/* Client website proof: static, lazy-loaded previews with direct links. */
.client-work { padding-block: clamp(2rem, 5vw, 4rem); border-bottom: 1px solid var(--line); }
.client-work h2 { font-family: var(--display); font-weight: 400; font-size: clamp(2rem, 3.5vw, 3.2rem); line-height: 1.1; letter-spacing: -.035em; margin: .5rem 0 1rem; }
.client-work-intro { max-width: 75ch; line-height: 1.75; }
.client-work-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 3rem); margin-block: 2rem; }
.client-work-entry { min-width: 0; }
.client-work-preview { display: block; margin-bottom: 1.25rem; }
.client-work-preview img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; border: 1px solid var(--line); }
.client-work-entry h3 { font-family: var(--display); font-size: clamp(1.6rem, 2.5vw, 2.2rem); font-weight: 400; margin: .5rem 0; line-height: 1.15; }
.client-work-entry p { line-height: 1.7; }
@media (max-width: 700px) { .client-work-grid { grid-template-columns: minmax(0, 1fr); } .client-work-entry + .client-work-entry { border-top: 1px solid var(--line); padding-top: 1.5rem; } }

.client-work-wordmark { aspect-ratio: 1200 / 630; padding: 1.5rem; display: flex; flex-direction: column; justify-content: center; background: var(--ink); color: var(--paper); border: 1px solid var(--line); text-decoration: none; }
.client-work-wordmark span { font-family: var(--display); font-size: clamp(1.6rem, 2.7vw, 2.6rem); line-height: 1.1; }
.client-work-wordmark small { margin-top: 1rem; line-height: 1.5; }
@media (min-width: 1100px) { .client-work-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Product introduction: artwork behind the copy, with a separate portrait host. */
.product-hero-inner { grid-template-columns: minmax(0, 1.5fr) minmax(260px, .65fr); align-items: center; gap: clamp(2rem, 4vw, 4rem); }
.product-intro { min-width: 0; max-width: 360px; justify-self: center; }
.product-hero-copy { position: relative; isolation: isolate; padding: clamp(1.25rem, 3vw, 2.5rem); }
.product-hero-copy::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(5, 28, 44, .82); pointer-events: none; }
.product-intro-figure { margin: 0; }
.product-intro-scene { display: flex; justify-content: center; }
.product-intro-art { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; pointer-events: none; }
.product-intro-player { width: min(100%, 260px); border: 2px solid var(--sun); background: var(--paper); }
.product-intro-player video { aspect-ratio: 9 / 16; object-fit: contain; height: auto; }
.product-intro-figure figcaption { font-size: .8125rem; line-height: 1.5; padding-top: 1rem; color: var(--paper); }
.product-intro-transcript { margin-top: .75rem; border-top: 1px solid color-mix(in srgb, var(--paper) 30%, transparent); }
.product-intro-transcript summary { cursor: pointer; padding-block: .8rem; font-size: .9375rem; font-weight: 700; min-height: 44px; }
.product-intro-transcript p, .product-approval-note { font-size: .9375rem; line-height: 1.7; color: color-mix(in srgb, var(--paper) 85%, transparent); }
.product-approval-note { margin-top: 1rem; }
@media (max-width: 900px) { .product-hero-inner { grid-template-columns: minmax(0, 1fr); } .product-intro { max-width: 360px; width: 100%; } }
@media (max-width: 620px) { .product-intro-player .host-play { padding: .6rem; } }

/* Stencil texture and restrained gold foil frame the shared navigation. */
.brand-art-frame { isolation: isolate; }
.site-footer.brand-art-frame { position: relative; }
.brand-art-frame::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: var(--frame-art); background-size: 650px auto; background-position: right 45%; background-repeat: repeat-x; opacity: .075; mask-image: linear-gradient(90deg, transparent, #000 70%, #000); -webkit-mask-image: linear-gradient(90deg, transparent, #000 70%, #000); }
.site-footer.brand-art-frame::before { background-size: 900px auto; background-position: center 58%; opacity: .06; mask-image: linear-gradient(90deg, #000, transparent 80%); -webkit-mask-image: linear-gradient(90deg, #000, transparent 80%); }
.brand-foil-edge { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; overflow: hidden; pointer-events: none; background: radial-gradient(ellipse at 20% 40%, #f5e4b1 0 1px, transparent 2px) 0 0 / 37px 5px, linear-gradient(100deg, #80632e, var(--sun) 24%, #e4cb8b 39%, #a18141 60%, #d3b872 82%, #80632e); }
.site-footer .brand-foil-edge { top: 0; bottom: auto; height: 4px; }
.brand-foil-edge::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 28%; background: linear-gradient(100deg, transparent, rgba(255, 245, 210, .85), transparent); transform: translateX(-110%); }
@media (prefers-reduced-motion: no-preference) { .site-header .brand-foil-edge::after { animation: brand-foil-glint 4s cubic-bezier(.25, 1, .5, 1) .5s 1 both; } .site-footer:hover .brand-foil-edge::after, .site-footer:focus-within .brand-foil-edge::after { animation: brand-foil-glint 3s cubic-bezier(.25, 1, .5, 1) 1 both; } }
@keyframes brand-foil-glint { from { transform: translateX(-110%); opacity: 0; } 15%, 80% { opacity: 1; } to { transform: translateX(460%); opacity: 0; } }
@media (max-width: 700px) { .brand-art-frame::before { opacity: .045; background-size: 450px auto; } }

/* A single custom streetscape for the masthead, never tiled. */
.site-header.brand-art-frame::before { background-repeat: no-repeat; background-size: cover; background-position: center 54%; opacity: .16; mask-image: linear-gradient(90deg, transparent 8%, #000 42%, #000); -webkit-mask-image: linear-gradient(90deg, transparent 8%, #000 42%, #000); }
@media (max-width: 700px) { .site-header.brand-art-frame::before { background-size: auto 260px; background-position: 72% 53%; opacity: .10; } }

/* Vertical retail ad stays poster-first and fits the existing demo module. */
.retail-ad-player { width: min(100%, 300px); margin: 1.25rem auto 0; }
.retail-ad-screen video { aspect-ratio: 9 / 16; max-width: 300px; height: auto; margin: 0; }
.retail-ad-disclosure { font-size: .8125rem; color: var(--ink-soft); line-height: 1.5; margin: .75rem 0 0; text-align: center; }

/* Voice & audio: an editorial listening room. */
.voice-studio { background: var(--paper); }
.voice-studio-hero { display: grid; grid-template-columns: 1.3fr .8fr; gap: clamp(2rem, 6vw, 7rem); padding-block: clamp(3rem, 7vw, 7rem); align-items: center; }
.voice-studio-hero h1 { font-size: clamp(3.1rem, 6.5vw, 6.9rem); line-height: 1.02; letter-spacing: -.04em; margin-bottom: 1.5rem; }
.voice-studio-hero p { max-width: 42rem; }
.voice-studio-lead { font-size: clamp(1.2rem, 2vw, 1.6rem); line-height: 1.55; }
.voice-studio-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.4rem; margin-top: 2rem; }
.voice-studio-cover { background: var(--ink); color: var(--paper); padding: clamp(1.5rem, 3vw, 3.5rem); border-top: 5px solid var(--sun); }
.voice-studio-cover-title { display: block; font-family: var(--display); font-size: clamp(2.7rem, 4vw, 4.6rem); line-height: 1.1; margin-bottom: 1.5rem; color: var(--sun); }
.voice-studio-cover ol { padding-left: 1.3rem; margin: 2rem 0; }
.voice-studio-cover li { border-bottom: 1px solid color-mix(in srgb, var(--paper) 25%, transparent); padding: .65rem .4rem; }
.voice-studio-list { padding-block: 1rem 5rem; }
.voice-studio-intro { max-width: 45rem; margin-bottom: 2.5rem; }
.voice-studio h2 { font-size: clamp(2rem, 3.5vw, 3.6rem); line-height: 1.15; }
.voice-studio-track { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 6vw, 7rem); padding-block: 2.5rem; border-top: 1px solid var(--line); align-items: start; }
.voice-studio-track h3 { font-size: clamp(1.7rem, 2.6vw, 2.6rem); line-height: 1.2; margin-bottom: 1rem; }
.voice-studio-track p { max-width: 40rem; }
.voice-studio-player { min-width: 0; background: var(--paper-bright); padding: clamp(1rem, 2vw, 2rem); }
.voice-studio-player > p { font-weight: 800; }
.voice-studio-player audio { width: 100%; display: block; }
.voice-studio-player details { margin-top: 1.3rem; }
.voice-studio-player summary { cursor: pointer; padding-block: .5rem; font-weight: 700; }
.voice-studio-player details p { margin: 1rem 0 0; line-height: 1.8; }
.voice-studio-live { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 7rem); background: var(--ink); color: var(--paper); padding-block: clamp(3rem, 6vw, 6rem); }
.voice-studio-note { font-size: .85rem; margin: 1.2rem 0 0; }
.voice-studio-prompt { border-top: 1px solid var(--sun); padding-top: 1.5rem; }
.voice-studio-prompt > span { color: var(--sun); font-weight: 800; }
.voice-studio-prompt blockquote { font-family: var(--display); font-size: clamp(1.7rem, 2.8vw, 2.8rem); line-height: 1.3; margin: 1.5rem 0; }
.voice-studio-scope, .voice-studio-close { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 6vw; padding-block: clamp(3rem, 6vw, 6rem); }
.voice-studio-scope dl { margin: 0; }
.voice-studio-scope dl > div { padding-bottom: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.voice-studio-scope dt { font-weight: 800; margin-bottom: .5rem; }
.voice-studio-scope dd { margin: 0; }
.voice-studio-close { background: var(--paper-shade); }
.voice-studio-close ol { padding-left: 1.5rem; margin: 0; }
.voice-studio-close li { padding: 0 0 1.8rem .5rem; }
.voice-studio-close strong, .voice-studio-close span { display: block; }
.voice-studio-close strong { margin-bottom: .5rem; }
.voice-studio-cost { grid-column: 1 / -1; font-size: .875rem; max-width: 65rem; margin-bottom: 0; }
.voice-studio-teaser { background: var(--paper-shade); display: flex; gap: 2rem; align-items: center; justify-content: space-between; padding-block: 3rem; }
.voice-studio-teaser > div { max-width: 49rem; }
.voice-studio-teaser h2 { font-size: clamp(2rem, 3vw, 3rem); line-height: 1.15; }
.voice-studio-teaser p:last-child { margin: 0; }
.voice-studio-teaser > a { flex-shrink: 0; }
.voice-studio-teaser-sample > div:first-child { flex: 1 1 34rem; }
.voice-studio-teaser-sample > .voice-teaser-listen { border-left: 1px solid var(--line); flex: 0 1 28rem; padding-left: clamp(1.25rem, 3vw, 3rem); width: 100%; }
.voice-teaser-listen > .text-link { margin-top: 1rem; }
.welcome-audio-label { color: var(--ink-soft); font-size: .875rem; margin: 0 0 .75rem; }
.welcome-audio-controls[hidden], .welcome-audio audio[hidden] { display: none; }
.welcome-audio-play { font-size: .875rem; min-height: 44px; }
.welcome-audio-play span { color: inherit; font-size: inherit; }
.welcome-audio-status { color: var(--ink-soft); font-size: .875rem; margin: .75rem 0; }
.welcome-audio-status:empty { display: none; }
.welcome-audio-transcript { font-size: .875rem; line-height: 1.6; margin-top: .5rem; }
.welcome-audio-transcript summary { cursor: pointer; min-height: 44px; padding-block: .6rem; text-decoration: underline; text-underline-offset: .25rem; width: fit-content; }
.welcome-audio-transcript p { margin: .25rem 0 .75rem; max-width: 48ch; }
.welcome-audio audio { display: block; margin-block: .75rem; max-width: 100%; }
@media (max-width: 760px) {
    .voice-studio-hero, .voice-studio-track, .voice-studio-live, .voice-studio-scope, .voice-studio-close { grid-template-columns: 1fr; }
    .voice-studio-teaser { flex-direction: column; align-items: flex-start; }
    .voice-studio-teaser-sample > div:first-child { flex: none; }
    .voice-studio-teaser-sample > .voice-teaser-listen { border-left: 0; border-top: 1px solid var(--line); flex: none; padding: 1.25rem 0 0; }
}

/* A readable navigation fallback also works when scripts cannot load. */
@media (max-width: 1150px) {
    html:not(.nav-ready) .site-header { height: auto; min-height: 72px; flex-wrap: wrap; gap: .75rem; }
    html:not(.nav-ready) .menu-toggle { display: none; }
    html:not(.nav-ready) .site-nav { position: static; width: 100%; max-height: none; opacity: 1; visibility: visible; overflow: visible; pointer-events: auto; padding-block: .5rem 1rem; transition: none; }
}

/* The footer's three desktop columns need room before the tablet breakpoint. */
.footer-layout > * { min-width: 0; }
@media (max-width: 1000px) {
    .footer-layout { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
    .footer-links { grid-column: 1 / -1; justify-self: start; max-width: none; }
}
@media (max-width: 620px) {
    .footer-layout { grid-template-columns: minmax(0, 1fr); }
}

/* One customer path connects the catalog, creative work, and working examples. */
.journey-hero { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.75fr); gap: clamp(2rem,6vw,6rem); padding-block: clamp(3rem,7vw,7rem); align-items: center; background: url("/static/art/workshop-grain.svg"), var(--paper); }
.journey-hero h1 { font-size: clamp(2.8rem,5.3vw,5.4rem); line-height: 1.02; margin-bottom: 1.5rem; }
.journey-lead { font-size: clamp(1.2rem,1.8vw,1.55rem); max-width: 38ch; }
.journey-note { padding: clamp(1.4rem,3vw,3rem); background: url("/static/art/workshop-grain.svg"), var(--ink-deep); color: var(--paper); box-shadow: 6px 7px 0 var(--sun); transform: rotate(1deg); }
.journey-note > span { color: var(--sun); font-size: .8rem; font-weight: 800; }
.journey-note h2 { font-size: clamp(1.8rem,3vw,2.6rem); line-height: 1.12; margin-block: 1rem; }
.journey-note ol { padding-left: 1.25rem; }
.journey-note li { padding-block: .4rem; }
.journey-note p { font-size: .82rem; color: var(--paper); margin-bottom: 0; }
.journey-map { background: var(--paper); padding-block: 1rem 3rem; }
.example-journey { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-block: 1px solid var(--line); }
.example-journey > a { display: flex; flex-direction: column; gap: .7rem; padding: 1.4rem 1.5rem; border-right: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.example-journey > a:first-child { padding-left: 0; }
.example-journey > a:last-child { border-right: 0; }
.example-journey a:hover, .example-journey a:focus-visible { background: var(--paper-shade); }
.example-journey span, .story-chapter .eyebrow { color: var(--clay-dark); font-size: .8rem; font-weight: 800; }
.example-journey strong { font-family: var(--display); font-size: clamp(1.35rem,2vw,1.85rem); line-height: 1.16; }
.example-journey small { color: var(--ink-soft); margin-top: auto; }
.example-journey i { font-style: normal; }
.story-chapter { scroll-margin-top: 110px; padding-block: clamp(2.5rem,5vw,4rem); border-top: 1px solid var(--line); background: url("/static/art/workshop-grain.svg"), var(--paper-shade); }
.story-chapter h2, .journey-next h2, .product-collection > h2 { font-size: clamp(2rem,3.5vw,3.4rem); line-height: 1.08; max-width: 26ch; }
.story-chapter > p:not(.eyebrow) { max-width: 53rem; }
.story-related { display: flex; flex-wrap: wrap; gap: .8rem 2rem; margin-top: 1.75rem; }
.story-related a { min-height: 44px; display: inline-flex; align-items: center; font-size: .9rem; font-weight: 800; color: var(--ink); text-underline-offset: .3rem; }
.story-listening { background: url("/static/art/workshop-grain.svg"), var(--paper); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,5vw,5rem); padding-block: 2rem 5rem; }
.story-listening h2 { font-size: clamp(2rem,3vw,3rem); line-height: 1.1; }
.story-listening .text-link { display: block; width: fit-content; margin-block: .8rem; }
.story-listening-takes { padding: clamp(1.25rem,3vw,2.5rem); border: 1px solid var(--sun); background: url("/static/art/workshop-grain.svg"), var(--paper-bright); box-shadow: 4px 5px 0 var(--paper-shade); }
.story-listening-takes article + article { border-top: 1px solid var(--line); padding-top: 1.2rem; margin-top: 1.2rem; }
.story-listening-takes audio { width: 100%; }
.story-listening-takes p { font-size: .9rem; font-weight: 800; }
.journey-next, .product-collection { background: url("/static/art/workshop-grain.svg"), var(--paper); padding-block: clamp(3rem,6vw,6rem); }
.journey-product-links { display: grid; grid-template-columns: 1fr 1fr; margin-block: 2rem; border-top: 1px solid var(--line); }
.journey-product-links a { display: grid; gap: .5rem; padding: 1.5rem 1.5rem 1.5rem 0; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.journey-product-links strong { font-family: var(--display); font-size: 1.6rem; }
.journey-product-links span { max-width: 40ch; color: var(--ink-soft); }
.journey-product-links a:hover strong { text-decoration: underline; text-underline-offset: .3rem; }
.journey-offer { scroll-margin-top: 100px; display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(2rem,5vw,5rem); padding-block: 3rem; border-bottom: 1px solid var(--line); }
.journey-offer h2 { font-size: clamp(2rem,3vw,3rem); line-height: 1.1; }
.journey-offer small { display: block; color: var(--ink-soft); max-width: 50ch; }
.journey-offer > div:last-child { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 1rem; }
.example-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; padding-block: 1.25rem; font-size: .85rem; border-bottom: 1px solid var(--line); }
.example-breadcrumb a { color: var(--ink); min-height: 44px; display: inline-flex; align-items: center; }
.example-breadcrumb a:last-child { margin-left: auto; }
@media (max-width: 760px) {
 .journey-hero, .story-listening, .journey-offer { grid-template-columns: 1fr; }
 .journey-note { transform: none; }
 .example-journey { grid-template-columns: 1fr; }
 .example-journey > a, .example-journey > a:first-child { padding: 1.3rem .5rem; border-right: 0; border-bottom: 1px solid var(--line); }
 .example-journey > a:last-child { border-bottom: 0; }
 .journey-product-links { grid-template-columns: 1fr; }
 .example-breadcrumb a:last-child { margin-left: 0; width: 100%; }
 .story-related { flex-direction: column; gap: .25rem; }
}

.legacy-example-anchor { position: absolute; scroll-margin-top: 110px; }

/* Client proof is presented as three crafted objects; original assets and links
   remain the evidence. Decoration does not imply a new client-site design. */
.client-work {
    --proof-navy-raised: color-mix(in srgb, var(--ink) 80%, var(--paper));
    --proof-navy-edge: color-mix(in srgb, var(--ink) 60%, var(--paper));
    --proof-navy-highlight: color-mix(in srgb, var(--ink) 45%, var(--paper));
    background: url("/static/art/workshop-grain.svg"), linear-gradient(115deg, #f6ecd9, #ece0c6); padding-block: clamp(3rem, 6vw, 6rem); }
.client-work-grid { gap: clamp(2.25rem, 4vw, 4rem); margin-block: 3rem; align-items: start; }
.client-work-label { display: flex; flex-wrap: wrap; gap: .3rem 1rem; justify-content: space-between; align-items: baseline; margin-bottom: 1.25rem; border-top: 1px solid #ad9873; padding-top: .75rem; }
.client-work-label > span { font-size: .8rem; font-weight: 800; color: #644b21; }
.client-work-label small { font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.client-work .client-work-preview { position: relative; isolation: isolate; padding: clamp(.85rem, 1.5vw, 1.5rem); border-radius: 5px; margin-bottom: 2rem; transition: transform .4s var(--ease-out); }
.client-work .client-work-preview img { border: 1px solid #96805b; border-radius: 1px; box-shadow: 0 1px 0 #e4d0a6; }
.client-work .client-work-preview::before,
.client-work .client-work-preview::after { content: ''; position: absolute; width: 7px; height: 7px; border-radius: 50%; pointer-events: none; background: linear-gradient(45deg, #7d693e, #e5cf98 45%, #5b4b2b 48% 55%, #baa16a 58%); box-shadow: 0 1px 2px color-mix(in srgb, var(--ink) 50%, transparent); }
.client-work .client-work-preview::before { top: 7px; left: 7px; }
.client-work .client-work-preview::after { bottom: 7px; right: 7px; }
.client-work-cornerstone .client-work-preview { background: url("/static/art/workshop-grain.svg"), linear-gradient(125deg, var(--proof-navy-raised), var(--ink-deep) 60%, var(--proof-navy-raised)); border: 1px solid var(--proof-navy-edge); box-shadow: inset 0 1px 0 var(--proof-navy-highlight), 0 4px 0 var(--ink-deep), 0 6px 0 var(--ink-deep), 0 24px 35px -17px color-mix(in srgb, var(--ink) 56%, transparent); }
.client-work-servanthood .client-work-preview { background: url("/static/art/workshop-grain.svg"), repeating-linear-gradient(0deg, #98704b15 0 2px, transparent 3px 7px), linear-gradient(135deg, #d6ba88, #ae8a54 70%, #d2b98c); border: 1px solid #a48551; box-shadow: inset 0 1px 0 #efd8b1, 0 4px 0 #816139, 0 6px 0 #6f532e, 0 24px 35px -17px #61482770; }
.client-work .client-work-dfw .client-work-wordmark { padding: clamp(1.3rem, 2vw, 2rem); justify-content: center; aspect-ratio: auto; min-height: clamp(190px, 22vw, 270px); border-radius: 2px; background: url("/static/art/workshop-grain.svg"), linear-gradient(120deg, var(--ink), var(--ink-deep)); color: #f5e8c8; border: 1px solid var(--proof-navy-edge); box-shadow: 3px 4px 0 #d6c7a5, 4px 5px 0 #a99b7e, 7px 8px 0 #e6d8b9, 8px 9px 0 #a99b7e, 0 24px 35px -17px color-mix(in srgb, var(--ink) 50%, transparent); }
.client-work .client-work-wordmark > span:not(.catalog-stamp) { font-size: clamp(2.1rem, 3.4vw, 3.5rem); letter-spacing: -.04em; line-height: .95; }
.client-work .client-work-wordmark > small { font-size: .75rem; max-width: calc(100% - 70px); color: #e0d3b4; border-top: 1px solid var(--proof-navy-edge); padding-top: .7rem; }
.catalog-tabs { display: flex; gap: 4px; position: absolute; top: -12px; right: 15px; z-index: -1; }
.catalog-tabs i { background: #d2b375; color: var(--ink); border: 1px solid #9b8b5b; border-radius: 4px 4px 0 0; font-size: .65rem; font-weight: 800; font-style: normal; padding: .3rem .5rem .6rem; }
.client-work .client-work-wordmark .catalog-stamp { position: absolute; right: 1.1rem; bottom: 1.2rem; color: #d5c59d; border: 1px solid #bfb086; border-radius: 50%; width: 68px; height: 68px; display: grid; place-content: center; text-align: center; font: 700 .65rem/1.2 var(--body); text-transform: uppercase; letter-spacing: .02em; transform: rotate(-12deg); }
.client-work-entry > .eyebrow { font-size: .7rem; }
.client-work-entry > p:not(.eyebrow) { color: var(--ink-soft); }
.client-work-entry .text-link { color: var(--ink); border-bottom: 1px solid var(--proof-navy-edge); }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .client-work-preview:hover { transform: translateY(-5px) rotate(-.7deg); }
    .client-work-servanthood .client-work-preview:hover { transform: translateY(-5px) rotate(.7deg); }
}
@media (min-width: 1100px) {
    .client-work-servanthood { padding-top: 2.5rem; }
    .client-work-dfw { padding-top: 5rem; }
}
@media (max-width: 700px) {
    .client-work-grid { gap: 2.5rem; }
    .client-work .client-work-dfw .client-work-wordmark { min-height: 240px; }
    .client-work-entry + .client-work-entry { border-top: 0; padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) { .client-work .client-work-preview { transition: none; } }

/* A shorter buyer journey, using the existing paper, navy, and brass palette. */
.host-hero-art { --hero-art: var(--hero-art-desktop); }
@media (max-width: 620px) { .host-hero-art { --hero-art: var(--hero-art-mobile); } }
.home-section-heading { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: space-between; margin-bottom: 1.4rem; }
.home-section-heading h2 { font-size: clamp(1.8rem, 3vw, 2.7rem); line-height: 1.12; margin: 0; max-width: 26ch; }
.home-section-heading p { color: var(--ink-soft); margin: .7rem 0 0; max-width: 55ch; }
.home-section-heading > .text-link { flex-shrink: 0; }
.home-proof { background: var(--paper-shade); padding-block: clamp(1.7rem, 3vw, 3rem); }
.home-proof-list { display: grid; gap: 0 1.5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
.home-proof-list a { border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: .4rem; height: 100%; padding-block: 1rem; }
.home-proof-list strong { font-family: var(--display); font-size: 1.35rem; font-weight: 400; line-height: 1.2; }
.home-proof-list a > span { color: var(--ink-soft); font-size: .875rem; }
.home-proof-list a .home-proof-visit { color: var(--ink); font-weight: 800; margin-top: .2rem; }
.home-proof-list a:hover .home-proof-visit { text-decoration: underline; text-underline-offset: .25rem; }
.buyer-paths { background: var(--paper); padding-block: clamp(2.4rem, 5vw, 4.5rem); }
.buyer-path-list { display: grid; gap: 2rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.buyer-path { align-items: start; border-top: 2px solid var(--sun); display: flex; flex-direction: column; gap: .85rem; padding-top: 1.4rem; }
.buyer-path h3 { font-size: clamp(1.7rem, 2.6vw, 2.25rem); line-height: 1.12; margin: 0; max-width: 20ch; }
.buyer-path > p { color: var(--ink-soft); margin: 0 0 .25rem; max-width: 43ch; }
.buyer-path > .button { margin-top: auto; text-align: center; }
.buyer-path-more { display: flex; flex-wrap: wrap; gap: .35rem 1.2rem; }
.buyer-help { border-top: 1px solid var(--line); color: var(--ink-soft); font-size: .875rem; margin: 1.8rem 0 0; padding-top: .75rem; }
.buyer-voice-sample { width: 100%; }
.buyer-voice-sample > summary { align-items: center; cursor: pointer; display: list-item; font-size: .875rem; font-weight: 800; min-height: 44px; padding-block: .7rem; }
.buyer-voice-sample .welcome-audio { margin-top: .75rem; }
.home-process { background: var(--paper-bright); padding-block: clamp(2.2rem, 4vw, 4rem); }
.home-process-steps { counter-reset: home-process; display: grid; gap: 1.5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: 0 0 1rem; padding: 0; }
.home-process-steps li { border-top: 1px solid var(--line); counter-increment: home-process; padding-top: 1rem; }
.home-process-steps li::before { color: var(--clay-dark); content: "0" counter(home-process); display: block; font-size: .875rem; font-weight: 800; margin-bottom: .45rem; }
.home-process-steps h3 { font-size: 1.5rem; line-height: 1.2; margin: 0 0 .6rem; }
.home-process-steps p { color: var(--ink-soft); font-size: .9375rem; margin: 0; max-width: 40ch; }
.home-quote { align-items: center; background: var(--ink); color: var(--paper); display: flex; gap: 1.5rem 3rem; justify-content: space-between; padding-block: clamp(2.2rem, 4vw, 4rem); }
.home-quote h2 { font-size: clamp(2rem, 3.5vw, 3rem); line-height: 1.12; margin: 0 0 .8rem; }
.home-quote p { margin: 0; max-width: 55ch; }
.home-quote .button { flex-shrink: 0; }
.buyer-path .text-link, .home-proof .text-link, .home-process > .text-link, .home-section-heading .text-link { align-items: center; display: inline-flex; min-height: 44px; }
.buyer-help .text-link { display: inline-flex; align-items: center; min-height: 44px; }
.nav-learn-menu a { align-items: center; display: flex; min-height: 44px; }
/* Always available on this long page; no script or horizontal scrolling required. */
.demo-quick-nav { background: var(--paper); border-block: 1px solid var(--line); display: grid; gap: .25rem .5rem; grid-template-columns: repeat(7, minmax(0, 1fr)); padding-block: .35rem; position: sticky; top: 70px; z-index: 9; }
.demo-quick-nav a { align-items: center; color: var(--ink); display: flex; font-size: .875rem; font-weight: 800; justify-content: center; min-height: 44px; padding: .45rem .3rem; text-align: center; }
.demo-quick-nav a:hover, .demo-quick-nav a:focus-visible { background: var(--paper-shade); text-decoration: underline; text-underline-offset: .25rem; }
body[data-page="demos"] #get-noticed, body[data-page="demos"] #voice-agent, body[data-page="demos"] #guided-chat, body[data-page="demos"] #intake-demo, body[data-page="demos"] #followup-demo, body[data-page="demos"] #dashboard-demo, body[data-page="demos"] #owner-brief-demo { scroll-margin-top: 150px; }
@media (max-width: 1150px) { .demo-quick-nav { top: 64px; } }
@media (max-width: 760px) {
    .home-proof-list, .buyer-path-list, .home-process-steps { grid-template-columns: 1fr; }
    .home-section-heading { gap: .45rem; margin-bottom: .8rem; }
    .home-proof-list a { gap: .3rem; padding-block: .8rem; }
    .home-proof-list strong { font-size: 1.2rem; }
    .home-proof-list a > span { font-size: .8125rem; }
    .buyer-path-list { gap: 1.7rem; }
    .buyer-path { gap: .65rem; padding-top: 1.1rem; }
    .buyer-path h3 { max-width: 25ch; }
    .buyer-path > .button { margin-top: .25rem; }
    .home-process-steps { gap: 1.1rem; }
    .home-quote { align-items: flex-start; flex-direction: column; }
    .demo-quick-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .demo-quick-nav a { font-size: .8125rem; }
    body[data-page="demos"] #get-noticed, body[data-page="demos"] #voice-agent, body[data-page="demos"] #guided-chat, body[data-page="demos"] #intake-demo, body[data-page="demos"] #followup-demo, body[data-page="demos"] #dashboard-demo, body[data-page="demos"] #owner-brief-demo { scroll-margin-top: 240px; }
}

/* Magnification and landscape screens need the full height for page content. */
@media (max-height: 480px) {
    .site-header.scrolled { position: relative; }
    .demo-quick-nav { position: static; }
    html { scroll-padding-top: 1rem; }
    body[data-page="demos"] #get-noticed,
    body[data-page="demos"] #voice-agent,
    body[data-page="demos"] #guided-chat,
    body[data-page="demos"] #intake-demo,
    body[data-page="demos"] #followup-demo,
    body[data-page="demos"] #dashboard-demo,
    body[data-page="demos"] #owner-brief-demo { scroll-margin-top: 1rem; }
}

/* Buyer information follows the site's paper, navy and brass palette. */
.buyer-path-note { max-width: 70ch; margin-top: 1.5rem; }
.buyer-example-links { display: flex; flex-wrap: wrap; gap: 1rem 2rem; margin-top: 1.5rem; }
.buyer-scope dl, .buyer-fee-scope dl { display: grid; grid-template-columns: minmax(8rem, 1fr) minmax(0, 3fr); gap: 1rem 2rem; margin: 1.5rem 0; }
.buyer-scope dt, .buyer-fee-scope dt { font-weight: 700; }
.buyer-scope dd, .buyer-fee-scope dd { margin: 0; }
.buyer-technical { margin: 1.5rem 0; border-block: 1px solid var(--line); padding: 1rem 0; }
.buyer-technical summary { cursor: pointer; font-weight: 700; min-height: 2.75rem; display: list-item; align-content: center; }
.buyer-technical summary:focus-visible { outline: 3px solid var(--sun, #c2a25a); outline-offset: 5px; }
.buyer-technical p { margin: .75rem 0 0; }
.buyer-proof-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; margin: 2rem 0; }
.buyer-proof-list article { border-top: 1px solid var(--line); padding-top: 1.25rem; min-width: 0; }
.buyer-proof-list h3 { margin-top: 0; }
.buyer-cost-table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; }
.buyer-cost-table th, .buyer-cost-table td { padding: 1rem .75rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.buyer-cost-table th { font-weight: 700; }
.buyer-cost-table caption { text-align: left; margin-bottom: .75rem; }
@media (max-width: 700px) {
    .buyer-scope dl, .buyer-fee-scope dl { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
    .buyer-scope dd, .buyer-fee-scope dd { margin-bottom: 1rem; }
    .buyer-proof-list { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
    .buyer-cost-table th, .buyer-cost-table td { padding: .8rem .35rem; overflow-wrap: anywhere; }
}

.buyer-budget-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.buyer-budget-lines { margin: 1.5rem 0; }
.buyer-budget-lines dt { margin-top: 1rem; }
.buyer-budget-lines dd { margin: .2rem 0 0; font-weight: 700; }
@media (max-width: 700px) { .buyer-budget-pair { grid-template-columns: minmax(0, 1fr); } }

.about-team-focus { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.about-owner-videos { grid-column: 1 / -1; margin: 0; }
@media (max-width: 700px) { .about-team-focus { grid-template-columns: minmax(0, 1fr); } }

.buyer-budget-examples, .buyer-fee-scope, .buyer-client-scope, .section-wrap.buyer-scope { padding-block: clamp(2.5rem, 5vw, 4rem); }
.services-page > .buyer-scope { background: var(--paper); }
.buyer-budget-examples > h2, .buyer-fee-scope > h2, .buyer-client-scope > h2, .section-wrap.buyer-scope > h2, .about-team-focus h2 { font-family: var(--display); font-weight: 400; font-size: clamp(1.8rem, 3vw, 2.75rem); line-height: 1.1; letter-spacing: -.03em; }
.buyer-budget-examples > p, .buyer-fee-scope > p, .buyer-client-scope > p { max-width: 75ch; }
.buyer-path-note a { text-decoration: underline; text-underline-offset: .2em; }
.about-hero .about-hero-layout { grid-template-areas: "heading support" "focus focus" "videos videos"; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2rem; }
.about-team-focus { grid-area: focus; }
.about-owner-videos { grid-area: videos; }
@media (max-width: 1050px) { .about-hero .about-hero-layout { grid-template-areas: "heading" "support" "focus" "videos"; grid-template-columns: minmax(0, 1fr); } }

/* Quote guidance stays beside the form on every screen. */
.contact-form .contact-next-step { color: var(--ink); background: var(--paper-shade); padding: 1rem; margin: 1rem 0; font-size: .9375rem; line-height: 1.6; }
.contact-next-step strong { display: block; margin-bottom: .35rem; }
.contact-form .form-kicker { font-size: 1rem; line-height: 1.5; }
.contact-form .form-status:empty { margin: 0; min-height: 0; }
.contact-form .form-status:not(:empty) { margin: .75rem 0 1rem; }
.form-row .field-optional { color: var(--ink-soft); font-size: .75rem; letter-spacing: 0; text-transform: none; }
.form-row small { display: block; margin-top: .4rem; font-size: .875rem; line-height: 1.5; color: var(--ink-soft); }
.contact-success { background: var(--paper); color: var(--ink); padding: clamp(1.25rem, 3vw, 2.25rem); }
.contact-success h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.15; margin-top: 0; }
.contact-success p { line-height: 1.7; }
.contact-fallback { line-height: 1.6; overflow-wrap: anywhere; }
.contact-fallback a { display: inline-flex; align-items: center; min-height: 44px; }
.first-project-card a, .demo-reset, [data-intake-reset], [data-followup-reset], [data-demo-reset] { min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 700px) {
    .contact-copy > p:not(.eyebrow), .contact-form .form-kicker { display: block; }
    .contact-copy > p:not(.eyebrow):not(.contact-note) { font-size: .9375rem; line-height: 1.6; margin: .75rem 0; }
    .contact-copy .contact-note { font-size: .875rem; line-height: 1.6; text-transform: none; letter-spacing: 0; margin: .75rem 0 0; }
    .contact-form .contact-next-step { padding: .875rem; }
    .form-split { grid-template-columns: minmax(0, 1fr); gap: 0; }
}

/* Service choices use the site's paper, navy and brass treatment. */
.service-task-index { margin-top: 1.5rem; border-top: 1px solid var(--line); padding-top: .8rem; }
.service-task-label { margin: 0 0 .35rem; font-size: .82rem; font-weight: 800; }
.service-task-index ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
.service-task-index a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: .2em; font-size: .88rem; font-weight: 700; }
.service-start-chooser { padding-block: 1rem 2rem; }
.service-start-chooser h2 { font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.75rem); line-height: 1.1; font-weight: 400; margin: .5rem 0 1.25rem; }
.service-choice-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.service-choice-list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .3rem 1rem; padding: 1.1rem 1rem 1.1rem 0; border-bottom: 1px solid var(--line); min-height: 86px; }
.service-choice-list strong { font-size: 1.05rem; }
.service-choice-list a > span:not([aria-hidden]) { grid-column: 1; font-size: .9rem; color: var(--ink-soft); }
.service-choice-list a > span[aria-hidden] { grid-column: 2; grid-row: 1 / 3; align-self: center; }
.service-choice-list a:hover strong, .service-task-index a:hover { color: var(--clay-dark); }
.service-task-index a:focus-visible, .service-choice-list a:focus-visible { outline: 3px solid var(--sun); outline-offset: 4px; }
.service-example-note { font-size: .9rem; color: var(--ink-soft); max-width: 65ch; }
.project-cost-drivers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; margin-block: 2rem; }
.project-cost-drivers article { border-top: 2px solid var(--sun); padding-top: 1rem; min-width: 0; }
.project-cost-drivers h3, .content-proof-pair h3 { margin-top: 0; }
.budget-first-reply { border-top: 1px solid var(--line); padding-top: 1.5rem; max-width: 75ch; }
.content-proof-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; }
.content-proof-pair article { border-top: 1px solid var(--line); padding-top: 1rem; min-width: 0; }
.project-cost-drivers .text-link, .content-proof-pair .text-link, .website-page .proof-work > section > .text-link { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 700px) { .service-choice-list, .project-cost-drivers, .content-proof-pair { grid-template-columns: minmax(0, 1fr); } .service-task-index { margin-top: 1rem; } .service-choice-list a { padding-right: 0; } .project-cost-drivers, .content-proof-pair { gap: 1.5rem; } }

/* Mata.Works studio: plain paper for reading; ink and texture stay inside artwork. */
:root {
    --surface-page: var(--paper);
    --surface-hero: var(--paper);
    --surface-paper: #efe6d5;
    --surface-paper-bright: var(--paper-bright);
    --surface-sage: #eee8dc;
    --surface-ink: var(--ink);
    --studio-shadow: 0 1px 0 #fffdf8, 0 10px 24px -18px #051c2c55;
}
html, body { background: var(--paper); }
main, body:has(.services-page) main, body:has(.contact-page) main { background: var(--paper); }
.site-header, .site-header.scrolled { background: var(--paper); }
.site-header.brand-art-frame::before, .site-footer.brand-art-frame::before { background-image: none; }
.brand-foil-edge, .site-footer .brand-foil-edge { background: var(--sun); height: 1px; }
.brand-foil-edge::after { display: none; }
.button-primary, .button-sun { border-color: #aa8b46; box-shadow: inset 0 1px 0 #dec58d, 0 2px 0 #8c6c2c; }
.button-primary:hover, .button-primary:focus-visible, .button-sun:hover, .button-sun:focus-visible { box-shadow: inset 0 1px 0 #aa8432, 0 2px 0 var(--ink); transform: translateY(-1px); }
.button-primary span { color: var(--ink); }
.page-hero h1, .product-hero h1 { letter-spacing: -.04em; line-height: 1.06; }
.section-heading h2, .closing-band h2, .principles-layout h2, .area-copy h2, .pricing-intro h2, .invoice-copy h2, .landing-work-copy h2, .service-entry h2, .process-list h2 { letter-spacing: -.035em; line-height: 1.06; }
.contact-page .contact-orbit { display: none; }
.product-hero-copy::before { background: var(--ink); }

/* A paper reading column beside one composed bookplate. */
.studio-hero.host-hero-art { background: var(--paper); color: var(--ink); padding: 0; }
.studio-hero.host-hero-art .host-hero-layout { align-items: center; background: none; border: 0; box-shadow: none; column-gap: clamp(2rem, 5vw, 5rem); grid-template-areas: "heading media" "support media"; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); min-height: 0; padding-block: clamp(2rem, 4vw, 4rem); row-gap: 0; }
.studio-hero.host-hero-art .host-hero-heading { align-self: end; }
.studio-hero.host-hero-art .host-hero-heading .eyebrow { color: var(--clay-dark); font-size: .75rem; letter-spacing: .08em; line-height: 1.6; margin-bottom: 1rem; max-width: 46ch; }
.studio-hero.host-hero-art .host-hero-heading .eyebrow-dot { background: var(--clay); flex-shrink: 0; }
.studio-hero.host-hero-art .host-hero-heading h1 { font-size: clamp(2.75rem, 4.3vw, 4.8rem); letter-spacing: -.037em; line-height: 1.045; margin: 0 0 1.45rem; max-width: 20ch; text-wrap: balance; }
.studio-hero.host-hero-art .host-hero-definition { border-left: 0; display: block; font-size: .9375rem; font-weight: 700; line-height: 1.65; margin: 0 0 1rem; max-width: 60ch; padding: 0; }
.studio-hero.host-hero-art .host-hero-support { align-self: start; min-width: 0; }
.studio-hero.host-hero-art .host-hero-support > p { color: var(--ink-soft); display: block; font-size: .9375rem; line-height: 1.7; margin: 0; max-width: 60ch; }
.studio-hero.host-hero-art .host-hero-support > .host-hero-mobile-intro { display: none; }
.studio-hero.host-hero-art .host-hero-actions { gap: .7rem 1.5rem; margin-top: 1.5rem; }
.studio-hero.host-hero-art .host-hero-actions .button { font-size: .875rem; line-height: 1.4; min-height: 48px; padding: .8rem 1.05rem; width: auto; }
.studio-hero.host-hero-art .text-link { border-color: var(--line); color: var(--ink); display: inline-flex; }
.studio-bookplate { align-self: center; grid-area: media; margin: 0; min-width: 0; width: 100%; }
.studio-bookplate > img { display: block; height: auto; width: 100%; }
.studio-bookplate figcaption { border-top: 1px solid var(--line); color: var(--ink-soft); display: flex; flex-wrap: wrap; font-size: .6875rem; gap: .25rem 1rem; justify-content: space-between; letter-spacing: .08em; margin-inline: 5.5%; padding-top: .7rem; text-transform: uppercase; }
.studio-bookplate figcaption span:first-child { color: var(--ink); font-weight: 800; }
.studio-introduction { border-top: 1px solid var(--line); margin-top: 1.5rem; max-width: 60ch; }
.studio-introduction > summary { color: var(--ink); cursor: pointer; font-size: .875rem; font-weight: 800; line-height: 1.6; min-height: 44px; padding-block: .8rem; }
.studio-introduction > summary span { color: var(--ink-soft); font-size: .75rem; font-weight: 500; margin-left: .5rem; }
.studio-introduction-body { display: grid; gap: 1rem 1.5rem; grid-template-columns: minmax(0, .75fr) minmax(0, 1fr); padding-block: .5rem 1rem; }
.studio-hero.host-hero-art .studio-introduction .host-hero-media { grid-area: auto; justify-self: start; max-width: 220px; width: 100%; }
.studio-hero.host-hero-art .studio-introduction video { box-shadow: 4px 4px 0 var(--paper-shade); }
.studio-hero.host-hero-art .studio-introduction figcaption { color: var(--ink-soft); font-size: .75rem; line-height: 1.5; margin-top: .75rem; }
.studio-hero.host-hero-art .studio-introduction .host-hero-transcript { border-color: var(--line); margin: 0; padding-top: 0; }
.studio-hero.host-hero-art .host-hero-transcript { border-color: var(--line); margin-top: 1.25rem; padding-top: .25rem; }
.studio-hero.host-hero-art .host-hero-transcript summary { font-size: .8125rem; min-height: 44px; }
.studio-hero.host-hero-art .studio-introduction .host-play span { display: inline; }

/* Existing page artwork becomes a bounded art field around its optional host. */
.studio-hero.host-hero-art .studio-host-frame { align-self: center; isolation: isolate; justify-self: end; margin: 0; max-width: 470px; padding: 2rem 2rem 1rem; position: relative; width: 100%; }
.studio-host-art { display: block; height: 100%; inset: 0; object-fit: cover; opacity: .4; pointer-events: none; position: absolute; width: 100%; z-index: -2; }
.studio-host-frame::before { background: linear-gradient(180deg, #f7f2e7aa, #f7f2e7ee); content: ""; inset: 0; position: absolute; z-index: -1; }
.studio-hero.host-hero-art .studio-host-frame .host-player { margin-inline: auto; max-width: 240px; }
.studio-hero.host-hero-art .studio-host-frame video { box-shadow: 4px 4px 0 #051c2c24; }
.studio-hero.host-hero-art .studio-host-frame figcaption { color: var(--ink-soft); font-size: .75rem; line-height: 1.5; margin-top: 1rem; text-align: center; }

/* The owners share one portrait; their roles and words remain uninterrupted. */
.studio-about.about-hero { background: var(--paper); background-image: none; padding: 0; }
.studio-about.about-hero .about-hero-layout { align-items: center; column-gap: clamp(2rem, 5vw, 5rem); grid-template-areas: "heading portrait" "support portrait" "focus focus" "videos videos"; grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr); padding-block: clamp(2.5rem, 5vw, 5rem); row-gap: 0; }
.studio-about .about-hero-copy { align-self: end; }
.studio-about .about-hero-copy h1 { font-size: clamp(3rem, 4.8vw, 5.5rem); letter-spacing: -.035em; line-height: 1.045; margin-bottom: 1.5rem; max-width: 15ch; }
.studio-about .about-hero-support { align-self: start; }
.studio-about .about-hero-support p { color: var(--ink-soft); font-size: 1rem; line-height: 1.75; margin: 0; max-width: 54ch; }
.studio-about .about-hero-support .button { margin-top: 1.5rem; }
.studio-owner-portrait { grid-area: portrait; margin: 0; min-width: 0; }
.studio-owner-portrait img { display: block; height: auto; width: 100%; }
.studio-owner-portrait figcaption { border-top: 1px solid var(--line); color: var(--ink-soft); font-size: .75rem; line-height: 1.6; margin-top: .5rem; padding-top: .7rem; }
.studio-about .about-team-focus { gap: clamp(2rem, 5vw, 5rem); margin: clamp(2.5rem, 5vw, 4.5rem) 0 2rem; }
.studio-about .about-team-focus article { border-top: 1px solid var(--line); padding-top: 1.5rem; }
.studio-about .about-team-focus .eyebrow { font-size: .75rem; margin-bottom: .75rem; }
.studio-about .about-team-focus h2 { font-size: clamp(1.8rem, 2.5vw, 2.5rem); letter-spacing: -.03em; line-height: 1.12; margin-bottom: 1rem; max-width: 23ch; }
.studio-about .about-team-focus p:not(.eyebrow) { color: var(--ink-soft); font-size: .9375rem; line-height: 1.75; margin: 0; max-width: 62ch; }
.studio-about .about-owner-videos { border-bottom: 0; margin: 0; padding-block: .25rem 0; }
.studio-about .about-owner-videos > summary { font-size: .875rem; }
.studio-about .about-hosts { grid-area: auto; justify-self: start; margin-top: 1.5rem; max-width: 560px; }
.studio-about .about-host video { box-shadow: 4px 4px 0 var(--paper-shade); }
body[data-page="about_us"] .principles-band { background: #efe8da; border-top: 1px solid var(--line); padding-block: clamp(3rem, 6vw, 5.5rem); }
body[data-page="about_us"] .principles-layout h2, .about-evidence h2 { letter-spacing: -.035em; line-height: 1.07; }

@media (max-width: 1000px) {
    .studio-hero.host-hero-art .host-hero-layout { column-gap: 2rem; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
    .studio-hero.host-hero-art .host-hero-heading h1 { font-size: clamp(2.6rem, 4.8vw, 3.8rem); }
    .studio-hero.host-hero-art .studio-host-frame { padding: 1.5rem 1.25rem 1rem; }
    .studio-about.about-hero .about-hero-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .studio-hero.host-hero-art .host-hero-layout { grid-template-areas: "heading" "support" "media"; grid-template-columns: minmax(0, 1fr); padding-block: 1.75rem 2rem; row-gap: 0; }
    .studio-hero.host-hero-art .host-hero-heading .eyebrow { font-size: .6875rem; margin-bottom: .8rem; max-width: none; }
    .studio-hero.host-hero-art .host-hero-heading h1 { font-size: clamp(2.5rem, 8.8vw, 3.8rem); line-height: 1.06; margin-bottom: 1.1rem; max-width: 23ch; }
    .studio-hero.host-hero-art .host-hero-definition { font-size: .875rem; line-height: 1.65; margin-bottom: .75rem; }
    .studio-hero.host-hero-art .host-hero-support > p:first-child { display: none; }
    .studio-hero.host-hero-art .host-hero-support > .host-hero-mobile-intro { display: block; font-size: .875rem; line-height: 1.65; }
    .studio-hero.host-hero-art .host-hero-actions { gap: .5rem 1rem; margin-top: 1.15rem; }
    .studio-hero.host-hero-art .host-hero-actions .button { min-height: 48px; width: auto; }
    .studio-introduction { margin-top: 1.1rem; }
    .studio-introduction > summary span { display: block; margin-left: 1rem; }
    .studio-bookplate { justify-self: center; margin-top: 1.25rem; max-width: 420px; }
    .studio-bookplate figcaption { font-size: .625rem; }
    .studio-hero.host-hero-art .studio-host-frame { justify-self: center; margin-top: 1.5rem; max-width: 360px; padding: 1.25rem; }
    .studio-hero.host-hero-art .studio-host-frame .host-player { max-width: 200px; }
    .studio-about.about-hero .about-hero-layout { grid-template-areas: "heading" "support" "portrait" "focus" "videos"; grid-template-columns: minmax(0, 1fr); padding-block: 2rem 2.5rem; }
    .studio-about .about-hero-copy h1 { font-size: clamp(3rem, 10vw, 4.5rem); line-height: 1.045; margin-bottom: 1.25rem; max-width: 16ch; }
    .studio-about .about-hero-support p { font-size: .9375rem; line-height: 1.75; margin: 0; }
    .studio-about .about-hero-support .button { margin-top: 1.25rem; width: auto; }
    .studio-owner-portrait { margin-top: 2rem; max-width: 640px; }
    .studio-about .about-team-focus { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; margin-block: 2rem; }
    .studio-about .about-hosts { gap: 1rem; max-width: 440px; }
}
@media (max-width: 420px) {
    .studio-hero.host-hero-art .host-hero-heading h1 { font-size: 2.5rem; }
    .studio-hero-home.host-hero-art .host-hero-definition { display: none; }
    .studio-hero.host-hero-art .host-hero-actions .text-link { display: inline-flex; font-size: .8125rem; }
    .studio-introduction-body { grid-template-columns: minmax(0, 1fr); }
    .studio-introduction-body .host-hero-transcript { margin-top: .5rem; }
    .studio-bookplate { max-width: 280px; }
}

/* Work carries the visual proof; the studio frame stays quiet. */
.client-work .client-work-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(2.5rem, 5vw, 4.5rem); margin-block: 2.5rem; }
.client-work .client-work-entry { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .85fr); gap: 1rem clamp(1.5rem, 4vw, 4rem); padding-top: 0; align-items: start; }
.client-work .client-work-label { grid-column: 1 / -1; margin: 0; border-color: var(--line); padding-block: .8rem .25rem; }
.client-work .client-work-label > span { color: var(--clay-dark); }
.client-work .client-work-label small { color: var(--ink-soft); font-size: .75rem; }
.client-work .client-work-preview { padding: clamp(.65rem, 1.1vw, 1rem); background: var(--paper-bright); border: 1px solid var(--line); border-radius: 0; box-shadow: 4px 4px 0 var(--paper-shade); margin: 0; transform: none; transition: border-color .2s ease; }
.client-work .client-work-preview::before, .client-work .client-work-preview::after { content: none; }
.client-work .client-work-preview:hover { transform: none; border-color: var(--clay-dark); }
.client-work .client-work-preview img { display: block; width: 100%; height: auto; aspect-ratio: auto; border: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.studio-project-copy { padding-top: clamp(.25rem, 1.5vw, 1.5rem); min-width: 0; }
.studio-project-copy h3 { font-size: clamp(1.75rem, 3vw, 3rem); margin-block: .5rem 1rem; max-width: 16ch; }
.studio-project-copy > p:not(.eyebrow) { max-width: 49ch; line-height: 1.75; }
.studio-project-copy .text-link { display: inline-flex; align-items: center; min-height: 44px; }
.studio-project-copy .studio-capture-note { color: var(--ink-soft); font-size: .875rem; margin-top: 1rem; }

/* The content page opens with finished work rather than a list of capabilities. */
.content-service-page .studio-content-heading { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: .5rem clamp(2rem, 5vw, 5rem); padding-block: clamp(2.5rem, 5vw, 4.5rem) 2.5rem; background: var(--paper); }
.studio-content-heading > .eyebrow { grid-column: 1 / -1; margin-bottom: 0; }
.content-service-page .studio-content-heading h1 { font-size: clamp(2.4rem, 4.3vw, 4.6rem); max-width: 19ch; margin-block: .5rem 0; }
.studio-content-heading > div { align-self: end; }
.studio-content-heading > div p { max-width: 48ch; line-height: 1.75; }
.studio-content-gallery { background: var(--paper-bright); padding-block: clamp(2rem, 4vw, 3.5rem); border-block: 1px solid var(--line); }
.studio-gallery-heading { max-width: 70ch; margin-bottom: 2rem; }
.studio-gallery-heading h2 { font: 400 clamp(1.9rem, 3vw, 3rem)/1.1 var(--display); letter-spacing: -.035em; margin-block: .5rem 1rem; }
.studio-gallery-heading p { line-height: 1.7; }
.studio-gallery-work { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) minmax(0, 1.05fr); gap: clamp(1.5rem, 3vw, 3rem); align-items: start; }
.studio-gallery-work > * { min-width: 0; margin: 0; }
.studio-gallery-work h3 { font: 400 clamp(1.45rem, 2vw, 1.9rem)/1.15 var(--display); margin-block: .5rem .8rem; letter-spacing: -.025em; }
.studio-gallery-work p { font-size: .9375rem; line-height: 1.7; }
.studio-gallery-work .eyebrow { display: block; font-size: .75rem; margin-block: 0 .5rem; }
.studio-poster-preview > a { display: block; padding: .75rem; background: var(--paper); border: 1px solid var(--line); box-shadow: 4px 4px 0 var(--paper-shade); }
.studio-poster-preview img { display: block; width: 100%; height: auto; max-height: 440px; object-fit: contain; }
.studio-ad-preview video { display: block; width: 100%; height: auto; max-height: 465px; aspect-ratio: 9 / 16; object-fit: contain; background: var(--ink); border: 1px solid var(--line); }
.studio-gallery-work figcaption { margin-top: 1.4rem; }
.studio-gallery-work details { margin-block: .75rem; border-block: 1px solid var(--line); }
.studio-gallery-work summary { min-height: 44px; padding-block: .7rem; cursor: pointer; font-size: .875rem; font-weight: 800; }
.studio-gallery-work .text-link { display: inline-flex; align-items: center; min-height: 44px; font-size: .875rem; }
.studio-voice-preview { border-top: 2px solid var(--sun); padding-top: 1.2rem; }
.studio-voice-preview audio { display: block; width: 100%; margin-block: 1rem; }
.studio-voice-preview #content-voice-label { font-size: .8125rem; font-weight: 800; }
.studio-writing-preview { border-top: 1px solid var(--line); margin-top: 2rem; padding-top: 1.5rem; }
.studio-writing-preview blockquote { margin: 1rem 0; padding-left: 1rem; border-left: 2px solid var(--sun); font-size: .9375rem; line-height: 1.75; }

/* Three useful entrances; the full recordings and their anchors remain below. */
.studio-listening-paths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 3rem); padding-block: 1.5rem 3rem; }
.studio-listening-paths a { border-top: 2px solid var(--sun); padding-top: 1rem; display: flex; flex-direction: column; align-items: start; gap: .75rem; min-height: 145px; }
.studio-listening-paths a > span { color: var(--clay-dark); font-size: .8125rem; font-weight: 800; }
.studio-listening-paths strong { font: 400 clamp(1.45rem, 2.2vw, 2.15rem)/1.1 var(--display); letter-spacing: -.025em; max-width: 20ch; }
.studio-listening-paths small { font-size: .875rem; border-bottom: 1px solid var(--line); padding-bottom: .3rem; }
.studio-listening-paths a:hover small { border-color: var(--clay-dark); }
.voice-studio-cover .studio-listening-invite { border-top: 1px solid color-mix(in srgb, var(--paper) 30%, transparent); padding-top: 1rem; font-size: .875rem; }
.voice-studio-track [id^="track-"] { scroll-margin-top: 7rem; }

/* Each specimen has its own voice inside the common studio frame. */
.studio-specimen .sample-hero { padding-block: clamp(2rem, 4vw, 4rem); background: var(--paper); }
.studio-specimen .sample-hero h1 { max-width: 24ch; font-size: clamp(2.2rem, 4.1vw, 4.3rem); letter-spacing: -.045em; line-height: 1.09; }
.studio-specimen .sample-hero > p:not(.eyebrow) { max-width: 73ch; line-height: 1.75; }
.studio-specimen .sample-layout { background: var(--paper-bright); border-top: 1px solid var(--line); grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(2rem, 4vw, 4rem); }
.studio-specimen .sample-preview { border: 1px solid var(--line); box-shadow: 4px 4px 0 var(--paper-shade); }
.studio-specimen .sample-copy { padding-top: .5rem; }
.studio-specimen .sample-copy h2, .studio-specimen .sample-intro h2 { font-size: clamp(1.9rem, 3vw, 2.9rem); max-width: 22ch; }
.studio-specimen .sample-copy p, .studio-specimen .sample-copy li { font-size: .9375rem; line-height: 1.8; }
.studio-specimen .sample-copy dd { margin: .3rem 0 1.25rem; line-height: 1.75; font-size: .9375rem; }
.studio-specimen .sample-copy dt { font-weight: 800; font-size: .875rem; }
.studio-specimen .sample-caption { font-size: .875rem; line-height: 1.65; }
.studio-specimen-practice .sample-hero h1 { font-family: var(--body); font-weight: 600; letter-spacing: -.055em; max-width: 26ch; }
.studio-practice-preview { font-family: var(--body); }
.studio-practice-masthead { display: flex; align-items: center; gap: 1rem; border-bottom: 1px solid var(--line); padding-bottom: 1rem; }
.studio-practice-masthead .sample-label { text-transform: none; font-size: 1.125rem; letter-spacing: -.02em; margin: 0; }
.studio-practice-masthead small { font-size: .8125rem; color: var(--ink-soft); font-weight: 500; letter-spacing: 0; }
.studio-practice-mark { width: 36px; height: 46px; border: 1px solid var(--ink-soft); border-radius: 50% 50% 0 0; position: relative; flex: 0 0 auto; }
.studio-practice-mark::before { content: ''; width: 1px; height: 26px; background: var(--ink-soft); position: absolute; left: 17px; top: 14px; }
.studio-practice-mark::after { content: ''; width: 13px; height: 13px; border-top: 1px solid var(--ink-soft); border-right: 1px solid var(--ink-soft); position: absolute; left: 11px; top: 15px; transform: rotate(135deg); }
.studio-practice-nav { display: flex; gap: .25rem 1rem; flex-wrap: wrap; margin-block: .5rem 1.75rem; }
.studio-practice-nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: .8125rem; font-weight: 700; }
.studio-specimen-practice .sample-preview h2 { font-family: var(--body); font-weight: 600; font-size: clamp(1.8rem, 3vw, 2.6rem); letter-spacing: -.045em; line-height: 1.2; max-width: 21ch; }
.studio-specimen-practice .sample-preview h3 { font-family: var(--body); font-weight: 700; font-size: 1.1rem; margin-top: 2rem; }
.studio-practice-preview ul { padding-left: 1.2rem; }
.studio-practice-preview li { padding-block: .4rem; }
.studio-practice-preview > dl { border-top: 1px solid var(--line); margin-block: 1.5rem; padding-top: .5rem; }
.studio-specimen-practice .sample-record > summary { padding-inline: 0; }
.studio-specimen-practice .sample-record-body { padding-inline: 0; }
.studio-shop-masthead { display: flex; justify-content: space-between; align-items: start; gap: 1rem; border-bottom: 1px solid var(--line); padding-bottom: 1rem; margin-bottom: 1.5rem; }
.studio-shop-name { font: 400 1.8rem/1.1 var(--display); margin: 0; letter-spacing: -.04em; }
.studio-shop-name > span { display: block; font: 500 .8125rem/1.5 var(--body); letter-spacing: 0; margin-top: .25rem; }
.studio-shop-masthead > .sample-label { margin: .3rem 0 0; font-size: .75rem; text-align: right; }
.studio-shop-product { margin: 0; }
.studio-shop-product img, .studio-campaign-product { display: block; width: 100%; height: auto; }
.studio-shop-product-heading { display: flex; gap: 1rem; justify-content: space-between; align-items: center; margin-block: 1.5rem 1rem; }
.studio-specimen-shop .sample-preview .studio-shop-product-heading h2 { font: 700 clamp(1.7rem, 2.6vw, 2.5rem)/1.1 var(--body); letter-spacing: -.05em; margin: 0; max-width: 12ch; }
.studio-shop-product-heading > span { flex: 0 0 auto; color: var(--ink-soft); font-size: .8125rem; line-height: 1.6; text-align: right; }
.studio-specimen-shop .sample-preview > p:not(.sample-caption):not(.sample-status) { font-size: .9375rem; }
.studio-specimen-shop .sample-review h3 { font-family: var(--body); font-size: 1.1rem; font-weight: 800; }
.studio-specimen-campaign .sample-campaign-art { max-height: 690px; object-fit: contain; }
.studio-specimen-campaign .sample-format h3 { font: 700 1.3rem/1.2 var(--body); letter-spacing: -.035em; }
.studio-specimen-campaign .sample-format p { font-size: .9375rem; line-height: 1.75; }
.studio-campaign-landing .studio-campaign-product { margin-block: 1rem 1.5rem; }
.studio-specimen-campaign .studio-campaign-landing h2 { font: 700 clamp(1.8rem, 3vw, 2.8rem)/1.1 var(--body); letter-spacing: -.05em; max-width: 15ch; }

@media (max-width: 1100px) {
    .studio-gallery-work { grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
    .studio-voice-preview { grid-column: 1 / -1; max-width: 70ch; }
}
@media (max-width: 760px) {
    .client-work .client-work-entry, .content-service-page .studio-content-heading, .studio-gallery-work, .studio-listening-paths, .studio-specimen .sample-layout { grid-template-columns: minmax(0, 1fr); }
    .client-work .client-work-entry { gap: .75rem; border-top: 0; }
    .client-work .client-work-label { grid-column: auto; }
    .client-work .client-work-grid { gap: 2.5rem; }
    .studio-project-copy { padding-top: .5rem; }
    .studio-project-copy h3 { max-width: none; }
    .content-service-page .studio-content-heading { gap: 1rem; }
    .studio-content-heading > .eyebrow { grid-column: auto; }
    .studio-gallery-work { gap: 2.5rem; }
    .studio-poster-preview > a { max-width: 350px; }
    .studio-ad-preview video { width: min(100%, 280px); }
    .studio-voice-preview { grid-column: auto; }
    .studio-listening-paths { gap: 1.25rem; padding-block: 1rem 2.5rem; }
    .studio-listening-paths a { min-height: auto; }
    .studio-listening-paths strong { max-width: none; }
    .studio-specimen .sample-hero h1 { max-width: none; }
    .studio-specimen .sample-preview { padding: 1.25rem; }
    .studio-specimen .sample-breadcrumb { margin-bottom: 1.5rem; }
    .studio-shop-masthead { flex-wrap: wrap; gap: .5rem; }
    .studio-shop-masthead > .sample-label { text-align: left; }
    .studio-shop-product-heading { align-items: start; }
    .studio-shop-product-heading > span { font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) { .client-work .client-work-preview { transition: none; } }

/* A printed collector card for each page's introduction. */
:root { --collector-gutter: clamp(.75rem, 2vw, 2rem); }
main .collector-front[data-collector-card],
.studio-hero.host-hero-art .host-hero-layout[data-collector-card],
.studio-about.about-hero .about-hero-layout[data-collector-card] {
    background: var(--paper); border: 2px solid var(--ink); border-radius: 3px;
    box-shadow: 5px 6px 0 var(--paper-shade); color: var(--ink);
    margin: clamp(1rem, 2.5vw, 2.25rem) auto; max-width: 1440px;
    outline: 1px solid var(--sun); outline-offset: -8px;
    padding: clamp(1.25rem, 3vw, 3rem);
    position: relative; width: calc(100% - 2 * var(--collector-gutter));
}
main [data-collector-card] h1 { color: var(--ink); }
main [data-collector-card] .eyebrow-light,
.journal-hero .collector-front[data-collector-card] > p,
.journal-article-hero .collector-front[data-collector-card] > p,
.contact-page [data-collector-card] .contact-copy > p,
.contact-page [data-collector-card] .contact-copy li { color: var(--ink-soft); }
main [data-collector-card] .eyebrow-light .eyebrow-dot { background: var(--clay); }
.journal-article-hero [data-collector-card] .journal-back,
.journal-hero [data-collector-card] .share-button-light,
.journal-article-hero [data-collector-card] .share-button-light { border-color: var(--line); color: var(--ink); }
.contact-page [data-collector-card] .contact-copy .text-link,
.contact-page [data-collector-card] .contact-copy a { color: var(--ink); }
[data-collector-card] > .eyebrow,
[data-collector-card] > div > .eyebrow:not(.eyebrow-light) {
    border-bottom: 1px solid var(--sun); padding-bottom: .65rem;
}
.journal-hero-inner[data-collector-card] .podcast-hero-foot { border-color: var(--line); color: var(--ink-soft); }
.journal-article-hero [data-collector-card] .journal-meta { color: var(--ink-soft); }
.journal-body.utility-page > [data-collector-card],
.episode-heading[data-collector-card] { margin-inline: 0; width: 100%; }

/* Paper fronts need paper-context text, including formerly dark introductions. */
[data-collector-card] .product-hero-copy { padding: 0; }
[data-collector-card] .product-hero-copy::before,
[data-collector-card] .product-intro-art { display: none; }
.product-hero-inner[data-collector-card] .product-hero-copy > p:not(.eyebrow),
[data-collector-card] .product-intro-figure figcaption,
[data-collector-card] .product-intro-transcript p,
[data-collector-card] .product-approval-note { color: var(--ink-soft); }
[data-collector-card] .product-intro-transcript { border-color: var(--line); }
[data-collector-card] .product-hero-copy .share-button-light { border-color: var(--line); color: var(--ink); }
[data-collector-card] .voice-studio-cover .eyebrow-light { color: var(--paper); }
[data-collector-card] .voice-studio-cover .eyebrow-light .eyebrow-dot { background: var(--sun); }
.contact-page [data-collector-card] .contact-fallback { color: var(--ink-soft); }

/* The people are the face of the studio's card; the new ink mark is its seal. */
.studio-bookplate.collector-player-card {
    align-self: center; background: var(--paper-bright); border: 2px solid var(--ink);
    border-radius: 3px; box-shadow: 5px 6px 0 var(--sun); justify-self: center;
    margin: 0; max-width: 420px; outline: 1px solid var(--sun); outline-offset: -7px;
    padding: .75rem; width: 100%;
}
.collector-card-top { align-items: center; border-bottom: 1px solid var(--sun); display: flex; font-size: .625rem; font-weight: 800; gap: .5rem; justify-content: space-between; letter-spacing: .065em; padding: .3rem .25rem .6rem; text-transform: uppercase; }
.collector-card-top > span:nth-child(2) { color: var(--clay); }
.studio-bookplate.collector-player-card > .collector-owner-art { aspect-ratio: 4 / 3; height: auto; object-fit: cover; object-position: center; width: 100%; }
.studio-bookplate.collector-player-card > figcaption { border: 0; display: block; font-size: inherit; letter-spacing: normal; margin: 0; padding: 0; text-transform: none; }
.collector-nameplate { background: var(--ink); border-block: 2px solid var(--sun); color: var(--paper); padding: .85rem .8rem; text-align: center; }
.studio-bookplate.collector-player-card .collector-nameplate > span { color: var(--paper); display: block; font-family: var(--display); font-size: clamp(1.65rem, 2.4vw, 2.4rem); font-weight: 400; letter-spacing: -.025em; line-height: 1.1; }
.collector-nameplate small { color: var(--paper); display: block; font-size: .625rem; font-weight: 700; letter-spacing: .08em; margin-top: .4rem; text-transform: uppercase; }
.collector-card-skills { border-bottom: 1px solid var(--line); display: grid; font-size: .625rem; font-weight: 800; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-block: .75rem; text-align: center; }
.collector-card-skills > span + span { border-left: 1px solid var(--line); }
.collector-card-footer { align-items: center; color: var(--ink-soft); display: flex; font-size: .625rem; gap: .5rem; justify-content: center; line-height: 1.6; padding-top: .4rem; }
.collector-card-footer img { flex-shrink: 0; height: 48px; object-fit: contain; width: 48px; }
.collector-card-footer small { font-size: .625rem; }

/* The other introductions keep their existing optional video inside a card. */
.studio-hero.host-hero-art .studio-host-frame {
    background: var(--paper-bright); border: 2px solid var(--ink); border-radius: 3px;
    box-shadow: 5px 6px 0 var(--sun); max-width: 310px;
    outline: 1px solid var(--sun); outline-offset: -7px; padding: .75rem;
}
.studio-host-frame .studio-host-art, .studio-host-frame::before { display: none; }
.studio-hero.host-hero-art .studio-host-frame .host-player { max-width: none; }
.studio-hero.host-hero-art .studio-host-frame video { aspect-ratio: 9 / 13; box-shadow: none; }
.studio-hero.host-hero-art .studio-host-frame .collector-host-name { background: var(--ink); border-top: 2px solid var(--sun); color: var(--paper); margin-top: .6rem; padding: .8rem .5rem; }
.collector-host-name strong { display: block; font-family: var(--display); font-size: 1.9rem; font-weight: 400; line-height: 1.1; }
.collector-host-name span, .collector-host-name small { display: block; font-size: .625rem; line-height: 1.6; margin-top: .25rem; }
.studio-owner-portrait { border: 2px solid var(--ink); border-radius: 3px; box-shadow: 5px 6px 0 var(--sun); outline: 1px solid var(--sun); outline-offset: -7px; padding: .75rem; }
.studio-owner-portrait figcaption { background: var(--ink); border-top: 2px solid var(--sun); color: var(--paper); padding: .75rem; text-align: center; }
.client-work-preview { outline: 1px solid var(--sun); outline-offset: -7px; }

@media (max-width: 760px) {
    main [data-collector-card], .studio-hero.host-hero-art .host-hero-layout[data-collector-card], .studio-about.about-hero .about-hero-layout[data-collector-card] { padding: 1.2rem; }
    .studio-bookplate.collector-player-card { margin-top: 1.25rem; max-width: 350px; }
    .studio-hero.host-hero-art .studio-host-frame { max-width: 245px; }
    .collector-card-skills { font-size: .625rem; }
}
@media (max-width: 620px) {
    .studio-hero-home.host-hero-art .host-hero-layout[data-collector-card] { align-items: start; column-gap: 1rem; grid-template-areas: "heading heading" "media support"; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); row-gap: 1.25rem; }
    .studio-hero-home.host-hero-art .host-hero-heading h1 { font-size: clamp(2rem, 8vw, 2.6rem); line-height: 1.06; margin-bottom: 0; }
    .studio-hero-home.host-hero-art .host-hero-definition { display: none; }
    .studio-hero-home.host-hero-art .host-hero-support > .host-hero-mobile-intro { font-size: .875rem; line-height: 1.6; }
    .studio-hero-home.host-hero-art .host-hero-actions { align-items: stretch; flex-direction: column; gap: .8rem; }
    .studio-hero-home.host-hero-art .host-hero-actions .button { padding-inline: .55rem; }
    .studio-hero-home .studio-introduction > summary { font-size: .8125rem; }
    .studio-hero-home .studio-introduction > summary span { font-size: .625rem; margin-left: 0; }
    .studio-bookplate.collector-player-card { margin-top: 0; padding: .5rem; }
    .collector-card-top { flex-wrap: wrap; font-size: .5625rem; gap: .25rem; justify-content: center; }
    .collector-card-top > span:last-child { width: 100%; text-align: center; }
    .collector-nameplate { padding: .7rem .35rem; }
    .studio-bookplate.collector-player-card .collector-nameplate > span { font-size: clamp(1.25rem, 5vw, 1.8rem); }
    .collector-nameplate small { font-size: .5625rem; letter-spacing: .04em; }
    .collector-card-skills { gap: .25rem; grid-template-columns: 1fr; padding-block: .5rem; }
    .collector-card-skills > span + span { border-left: 0; }
    .collector-card-footer { flex-direction: column; font-size: .5625rem; gap: .2rem; text-align: center; }
    .collector-card-footer img { height: 32px; width: 32px; }
    .collector-card-footer small { font-size: .5625rem; }
}
@media (max-width: 360px) {
    .studio-hero-home.host-hero-art .host-hero-layout[data-collector-card] { column-gap: .75rem; padding: 1rem; }
    .studio-hero-home.host-hero-art .host-hero-support > .host-hero-mobile-intro { font-size: .8125rem; }
    .studio-hero-home.host-hero-art .host-hero-actions .button { font-size: .8125rem; }
}

.collector-front[data-collector-card] .podcast-title-mark { color: var(--clay-dark); }

/* Curated stationery: cards are composed by role, not by wrapping every div. */
:root { --cardflow-space: clamp(1.5rem, 3vw, 3rem); --cardflow-paper: #fffaf0; }
main { background-color: var(--paper); background-image: repeating-linear-gradient(90deg, transparent 0 47px, #c2a25a08 47px 48px); }
main .craft-card {
    background: var(--cardflow-paper); border: 1px solid var(--ink); border-radius: 2px;
    box-shadow: 3px 5px 0 #e0d4bb; color: var(--ink); min-width: 0;
    margin-block: var(--cardflow-space); padding: clamp(1.25rem, 2.8vw, 2.75rem);
    position: relative; scroll-margin-top: 7rem;
}
main .craft-card > :last-child { margin-bottom: 0; }
main .craft-card h1, main .craft-card h2, main .craft-card h3 { color: var(--ink); }
main .craft-card > p, main .craft-card > div > p { color: var(--ink-soft); }
main .craft-card .eyebrow, main .craft-card .eyebrow-light { color: var(--clay-dark); }
main .craft-card .eyebrow-dot { background: var(--clay); }
main .craft-card .text-link, main .craft-card .text-link-light { border-color: var(--line); color: var(--ink); }
main .craft-card .text-link span { color: var(--clay-dark); }
main .craft-card--letter { background: var(--paper-bright); border-color: #9b8a68; border-top: 3px double var(--sun); }
main .craft-card--letter > .eyebrow { font-size: .6875rem; letter-spacing: .13em; }
main .craft-card--fieldnote { border-left: 5px solid var(--sun); background: #f3edde; }
main .craft-card--fieldnote h2, main .craft-card--fieldnote h3 { letter-spacing: -.025em; }
main .craft-card--ledger { background: #fffdf5; border: 1px solid #917951; outline: 1px solid #c2a25a77; outline-offset: -7px; }
main .craft-card--ledger > .eyebrow { border-bottom: 1px solid var(--sun); padding-bottom: .65rem; }
main .craft-card--record { background: #f5eedf; border: 2px solid var(--ink); box-shadow: 4px 5px 0 var(--sun); }
main .craft-card--invitation { border: 1px solid var(--ink); border-top: 5px solid var(--ink); background: var(--paper-bright); }
main .craft-card--invitation h2 { font-size: clamp(2rem, 3.2vw, 3.5rem); line-height: 1.08; }
main .craft-card--chapter { align-items: baseline; background: #f0e7d6; border: 1px solid #aa9467; border-inline: 3px double #aa9467; box-shadow: 2px 3px 0 var(--paper-shade); padding-block: 1.25rem; }
main .craft-card--chapter > h2, main .craft-card--chapter h2 { line-height: 1.08; margin-bottom: .6rem; }
main .craft-card--folio { background: var(--paper-bright); padding: clamp(1rem, 2.2vw, 2rem); border-color: #7c735f; }
main .craft-card--playbill { background: #efe5ce; border: 2px solid var(--ink); outline: 1px solid var(--sun); outline-offset: -8px; }
main .flow-group { background: transparent; border: 0; box-shadow: none; outline: 0; margin-inline: auto; max-width: 1440px; padding: var(--cardflow-space) 0; width: calc(100% - 2 * var(--collector-gutter)); }
.flow-group .craft-card { margin-block: 0; }
.flow-group > .craft-card + .craft-card { margin-top: var(--cardflow-space); }
.flow-group > .craft-card--chapter { margin-bottom: var(--cardflow-space); }
main .craft-card .button { max-width: 100%; }
main .craft-card input, main .craft-card textarea, main .craft-card audio, main .craft-card video { max-width: 100%; }
/* The logo gets the whole printed face; the nameplate stays part of the card. */
.studio-bookplate.collector-logo-card > .collector-logo-art { aspect-ratio: 800 / 760; display: block; height: auto; object-fit: contain; padding: .4rem; width: 100%; }
.collector-logo-card .collector-card-footer { padding: .65rem 0 .2rem; }
.collector-logo-card .collector-card-footer span { color: var(--ink-soft); }
/* Home: a welcome packet, service calling cards, then a personal invitation. */
.home-proof-list, .buyer-path-list, .home-process-steps { gap: clamp(1.25rem, 2vw, 2rem); }
.home-proof-list .craft-card { padding: 1.4rem; }
.home-proof-list .craft-card a { border: 0; display: flex; flex-direction: column; gap: .75rem; height: 100%; padding: 0; }
.home-proof-list .craft-card strong { font-family: var(--display); font-size: 1.6rem; font-weight: 400; line-height: 1.15; }
.home-proof-list .craft-card span { color: var(--ink-soft); }
main .buyer-path.craft-card { border-top: 1px solid var(--ink); padding: 1.75rem; }
main .buyer-path.craft-card--playbill { border: 2px solid var(--ink); }
main .buyer-path.craft-card--fieldnote { border-left: 5px solid var(--sun); }
.buyer-path.craft-card h3 { font-size: clamp(1.8rem, 2.5vw, 2.3rem); }
.buyer-path-list { align-items: stretch; }
.home-process-steps .craft-card { border-top: 1px solid var(--ink); padding: 1.5rem; }
.home-quote.craft-card { align-items: center; display: flex; gap: 2rem; justify-content: space-between; margin-inline: auto; max-width: 1440px; width: calc(100% - 2 * var(--collector-gutter)); }
.home-quote.craft-card p { color: var(--ink-soft); }
/* Client folios retain actual site captures as the large mounted artwork. */
.client-work-grid { gap: var(--cardflow-space); }
.client-work-entry.craft-card { margin: 0; padding: clamp(1rem, 2.5vw, 2.5rem); }
.client-work-label { border-bottom: 1px solid var(--sun); padding-bottom: .8rem; }
.client-work-entry.craft-card .client-work-preview { outline-offset: -6px; }
/* Written scopes are individual notes; lists and form fields remain inside them. */
.proof-work.flow-group > .craft-card { margin-block: var(--cardflow-space); }
.pilot-body.flow-group > .craft-card { margin-block: var(--cardflow-space); }
.service-offer-list, .care-ladder, .project-cost-drivers, .pricing-principle-list { gap: var(--cardflow-space); }
.service-offer.craft-card { border-top: 1px solid var(--ink); margin: 0; }
.service-entry.craft-card { margin-block: var(--cardflow-space); }
.service-entry.craft-card .service-entry-detail > p { color: var(--ink-soft); }
.pricing-principle.craft-card { margin: 0; }
.pricing-principle.craft-card p { color: var(--ink-soft); }
main .care-rung.craft-card { background: var(--paper-bright); color: var(--ink); margin: 0; padding: 1.5rem; }
.care-rung.craft-card > span, .care-rung.craft-card strong { color: var(--ink); }
.care-rung.craft-card p { color: var(--ink-soft); }
main .invoice-sheet.craft-card, main .complete-example-sheet.craft-card { transform: none; padding: clamp(1.25rem, 3vw, 2.5rem); }
main .margin-tool-section, main .care-section, main .principles-band, main .services-ledger-surface, main .software-demand, main .product-closing { background: transparent; padding-block: 0; }
.margin-tool-layout > .craft-card { margin: 0; }
.margin-tool-layout .craft-card .eyebrow-light { color: var(--clay-dark); }
.margin-tool.craft-card label { color: var(--ink); }
.margin-tool.craft-card .margin-input-row, .margin-tool.craft-card .margin-result, .margin-tool.craft-card .margin-total { color: var(--ink); }
.margin-tool.craft-card input { background: var(--paper-bright); color: var(--ink); }
/* About and contact are assembled from sibling cards, not one enclosing frame. */
.studio-about.about-hero .about-hero-layout.collector-front,
.contact-page .contact-layout.collector-front { background: transparent; border: 0; box-shadow: none; outline: 0; gap: 2rem; padding-inline: 0; }
.studio-about .about-hero-copy.craft-card, .studio-about .about-hero-support.craft-card { margin: 0; padding: 1.75rem; }
.studio-about .about-hero-copy.craft-card h1 { margin-bottom: 0; }
.studio-about .about-team-focus { margin-top: 2rem; }
.studio-about .about-team-focus > .craft-card { margin: 0; border-top: 3px double var(--sun); padding: 1.5rem; }
.studio-about .about-owner-videos > .about-hosts { gap: 1.5rem; }
.studio-about .about-host.craft-card { padding: .75rem; }
.contact-page { background: transparent; color: var(--ink); padding-block: .5rem var(--cardflow-space); }
.contact-copy.craft-card, .contact-form.craft-card { margin: 0; }
.contact-copy.craft-card > p, .contact-copy.craft-card .contact-note { color: var(--ink-soft); }
.contact-copy.craft-card h1 { font-size: clamp(2.7rem, 5vw, 5rem); line-height: 1.04; }
.contact-form.craft-card { padding: clamp(1.25rem, 2.5vw, 2.5rem); }
.contact-fallback { color: var(--ink-soft); }
/* Small, intentional local-area and workflow notes. */
.area-marker.craft-card { background: var(--ink); color: var(--paper); }
.area-marker.craft-card > p, .area-marker.craft-card > strong, .area-marker.craft-card > span { color: var(--paper); }
.area-copy.craft-card { margin: 0; }
.product-feature.craft-card { background: var(--paper-bright); margin-block: var(--cardflow-space); padding: clamp(1rem, 2vw, 2rem); }
.product-feature.craft-card .product-feature-copy { padding: 1.5rem; }
.product-feature.craft-card .product-feature-art { border: 1px solid var(--sun); }
.problem-path.craft-card { margin-block: var(--cardflow-space); padding: clamp(1.25rem, 3vw, 2.5rem); }
@media (max-width: 760px) {
    main .craft-card { padding: 1.25rem; }
    main .flow-group { padding-block: 1rem; }
    .home-quote.craft-card { align-items: flex-start; flex-direction: column; gap: 1rem; }
    .home-quote.craft-card .button { width: 100%; }
    .home-proof-list, .home-process-steps, .buyer-path-list { gap: 1.25rem; }
    main .buyer-path.craft-card { padding: 1.35rem; }
    .studio-about .about-hero-copy.craft-card, .studio-about .about-hero-support.craft-card { padding: 1.25rem; }
    .product-feature.craft-card .product-feature-copy { padding: 1rem .25rem; }
}

.margin-tool.craft-card .margin-result strong, .margin-tool.craft-card .margin-total strong { color: var(--ink); }

.buyer-paths.flow-group .buyer-help.craft-card { margin-top: var(--cardflow-space); }
.margin-tool-layout > .craft-card p { color: var(--ink-soft); }
/* An opened capability unfolds into sibling summary and content cards. */
.services-ledger-surface details.craft-card:has(.craft-card)[open] { background: transparent; border: 0; box-shadow: none; outline: 0; padding: 0; }
.services-ledger-surface details.craft-card:has(.craft-card)[open] > summary { background: var(--paper-bright); border: 1px solid var(--ink); padding: 1.25rem; margin-bottom: 1.5rem; }

/* The return address on the back of the packet. */
.site-footer .footer-layout.craft-footer { background: var(--paper-shade); border: 1px solid var(--ink); border-top: 3px double var(--sun); box-shadow: 3px 5px 0 #d6c7a9; margin: var(--cardflow-space) auto; padding: clamp(1.25rem, 3vw, 3rem); width: calc(100% - 2 * var(--collector-gutter)); max-width: 1440px; }

/* Keep functional surfaces legible inside their stationery cards. */
main .craft-card .agent-chat-log > .agent-message-host { color: var(--paper); }
main .craft-card.pilot-ending .share-button { color: var(--ink); border-color: var(--line); }
main .craft-card .agent-voice-mark { color: var(--sun); }
.process-list .craft-card > span { color: var(--clay-dark); }

/* Editorial cards form a reading sequence; layout wrappers do not wear a frame. */
.journal-body:has([data-craft-card]),
.sample-guide:has([data-craft-card]) { background: transparent; }
.journal-body > .craft-card,
.sample-guide > .craft-card,
.problem-group > .craft-card,
.podcast-list > .craft-card { margin-block: 0 clamp(1.4rem, 3vw, 2.4rem); }
.journal-body section.craft-card,
.journal-body .journal-cost.craft-card,
.journal-body .journal-sources.craft-card,
.journal-body .journal-next.craft-card,
.sample-guide section.craft-card,
.sample-guide .sample-next.craft-card,
.problem-group-heading.craft-card,
.journal-entry.craft-card,
.podcast-list-intro.craft-card,
.podcast-entry-summary.craft-card,
.podcast-entry-expanded .craft-card,
.episode-layout .craft-card,
.episode-series.craft-card,
.podcast-production-note.craft-card { padding: clamp(1.25rem, 3vw, 2.25rem); }
/* A reading chapter is a whole stationery card, unlike a section-label band. */
.journal-chapter.craft-card--chapter,
.journal-entry.craft-card--chapter,
.journal-body .content-path > .craft-card--chapter {
    background: var(--cardflow-paper); border: 1px solid #9b8a68;
    border-top: 3px double var(--sun); box-shadow: 3px 5px 0 #e0d4bb;
}
.journal-opening.craft-card .journal-lead {
    color: var(--ink); font-family: var(--display);
    font-size: clamp(1.4rem, 3vw, 2.2rem); line-height: 1.4; margin: 0;
}
.journal-opening > .eyebrow,
.journal-cost > .eyebrow,
.blog-question > .eyebrow,
.problem-group-heading > .eyebrow,
.podcast-story > .eyebrow,
.episode-next > .eyebrow {
    border-bottom: 1px solid var(--sun); padding-bottom: .65rem;
}
.journal-chapter > .craft-card-heading,
.sample-guide .craft-card-heading,
.utility-page .craft-card-heading { border-bottom: 1px solid var(--line); padding-bottom: 1rem; }
.journal-starter ol { margin-bottom: 0; }
.journal-body .journal-cost.craft-card { border-left-width: 1px; }
.journal-body .content-path { border: 0; gap: 1.25rem; padding-top: 0; margin-block: 2.25rem; }
.journal-body .content-path > .eyebrow { margin: 0; }
.journal-body .content-path > a.craft-card { margin: 0; padding: 1.25rem; }
.journal-body .journal-next.craft-card { flex-wrap: wrap; }
.journal-body .journal-next.craft-card > p { flex: 1 1 100%; }
.journal-body .journal-podcast.editorial-card-cluster {
    background: transparent; border: 0; color: var(--ink); display: grid;
    gap: 1.5rem; margin-block: 0 2.25rem; padding: 0;
}
.journal-podcast.editorial-card-cluster > .craft-card { margin: 0; padding: clamp(1.25rem, 3vw, 2.25rem); }
.journal-body .journal-podcast.editorial-card-cluster h2,
.journal-podcast.editorial-card-cluster .text-link { color: var(--ink); }
.journal-podcast.editorial-card-cluster .eyebrow { color: var(--clay-dark); }
.journal-podcast.editorial-card-cluster header > p:not(.eyebrow) { color: var(--ink-soft); line-height: 1.7; }
.journal-body .journal-featured-episode.craft-card { background: var(--ink); color: var(--paper); margin-block: 0 2.25rem; padding: 1.1rem; }
.journal-featured-episode.craft-card small { color: var(--sun); }
.journal-featured-episode.craft-card img { border: 1px solid var(--sun); }
.problem-group .journal-entry.craft-card:last-child { margin-bottom: 0; }
.problem-group .journal-number { border: 1px solid var(--sun); padding: .35rem; text-align: center; }
.podcast-list .problem-nav.craft-card,
.journal-list .problem-nav.craft-card { margin-block: 0 2rem; padding: 1.1rem; }
.podcast-list .podcast-entry { border: 0; margin-bottom: 1.75rem; }
.podcast-list .podcast-entry:last-of-type { border: 0; }
.podcast-entry-summary.craft-card { margin: 0; }
.podcast-entry-summary.craft-card .podcast-entry-thumb { border: 1px solid var(--sun); padding: .25rem; }
.podcast-entry-expanded { padding: 1.5rem 0 0; }
.podcast-entry-expanded > .craft-card { margin-bottom: 1.5rem; }
.podcast-entry-body { gap: 1.5rem; }
.podcast-entry-body .craft-card { margin: 0; }
.podcast-actions.craft-card { border-top-width: 1px; }
.podcast-list .podcast-production-note.craft-card { color: var(--ink-soft); line-height: 1.7; margin-top: 2rem; }
.episode-layout { gap: 1.75rem; }
.episode-layout .craft-card { margin-block: 0; min-width: 0; }
.episode-next.craft-card { border-top-width: 1px; }
.episode-series.craft-card { margin-block: 2rem 0; }
.sample-guide .sample-next.craft-card { margin-top: 0; }
@media (max-width: 760px) {
    .podcast-entry-body { grid-template-columns: minmax(0, 1fr); }
    .podcast-entry-summary.craft-card { padding: 1.1rem; }
    .journal-featured-episode.craft-card { grid-template-columns: minmax(0, 1fr); }
    .journal-featured-episode.craft-card > span { padding-right: 0; }
    .sample-guide .sample-next.craft-card { align-items: stretch; flex-direction: column; }
    .journal-body .journal-next.craft-card { align-items: stretch; }
}

/* A collection assembled by hand: poster mounts, listening sleeves, chapter
   dividers and project notes. The spaces between them stay unframed. */
.content-service-page .studio-content-gallery,
.content-service-page .proof-work,
.voice-studio :is(.voice-studio-list, .music-room, .voice-studio-live, .voice-studio-scope, .voice-studio-close),
.studio-specimen .sample-layout,
[data-page="demos"] :is(.demo-workbench, .story-listening, .voice-feature, .agent-showcase, .video-updates, .journey-next, .here-now-section) {
    background: transparent; border: 0;
}
.content-service-page .studio-content-gallery { padding-block: 1.75rem 2rem; }
.content-service-page .studio-gallery-heading.craft-card { max-width: none; margin: 0 0 1.75rem; padding: clamp(1.25rem, 3vw, 2.5rem); }
.content-service-page .studio-gallery-heading p { max-width: 67ch; }
.content-service-page .studio-gallery-work { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2.25rem); }
.content-service-page .studio-gallery-work > .craft-card { padding: clamp(1.1rem, 2.5vw, 2rem); margin: 0; max-width: none; }
.content-service-page .studio-poster-preview > a { background: var(--paper-shade); border: 0; box-shadow: none; padding: .6rem; }
.content-service-page .studio-poster-preview img { max-height: 515px; }
.content-service-page .studio-ad-preview video { max-height: 515px; width: 100%; margin-inline: auto; }
.content-service-page .studio-gallery-work figcaption { margin-top: 1.5rem; padding-top: .85rem; border-top: 1px solid var(--line); }
.content-service-page .studio-voice-preview.craft-card { grid-column: auto; }
.content-service-page .studio-writing-preview.craft-card { padding-top: clamp(1.25rem, 3vw, 2.5rem); }
.content-service-page .studio-writing-preview blockquote { font: 400 clamp(1.15rem, 1.8vw, 1.6rem)/1.55 var(--display); padding-left: 0; border: 0; margin-block: 1.5rem; }
.content-service-page .studio-voice-preview > .eyebrow,
.content-service-page .studio-writing-preview > .eyebrow { padding-bottom: .8rem; margin-bottom: 1rem; border-bottom: 1px solid var(--sun); }
.content-service-page .proof-work > .craft-card { margin-block: 0 clamp(1.5rem, 3vw, 2.25rem); padding: clamp(1.25rem, 3vw, 2.5rem); }
.content-service-page .proof-work > .craft-card:nth-child(2) { margin-inline-start: min(3vw, 2rem); }
.content-service-page .proof-work > .craft-card:nth-child(3) { margin-inline-end: min(3vw, 2rem); }

/* Each recording gets a labeled sleeve rather than a table row. */
.voice-studio .studio-listening-paths { gap: 1.25rem; padding-block: 1rem 2rem; }
.voice-studio .studio-listening-paths > .craft-card { padding: 1.5rem; margin: 0; min-height: 0; }
.voice-studio .voice-studio-intro.craft-card,
.voice-studio .music-room-heading.craft-card { max-width: none; padding: clamp(1.25rem, 3vw, 2.5rem); margin-bottom: 1.75rem; }
.voice-studio .voice-studio-intro > p,
.voice-studio .music-room-heading > p { max-width: 68ch; }
.voice-studio .voice-studio-track.craft-card { gap: clamp(1.5rem, 4vw, 4rem); padding: clamp(1.25rem, 3vw, 2.5rem); margin-bottom: 1.75rem; }
.voice-studio .voice-studio-track.craft-card:nth-of-type(even) { margin-inline-start: min(3vw, 2rem); }
.voice-studio .voice-studio-track.craft-card:nth-of-type(odd) { margin-inline-end: min(3vw, 2rem); }
.craft-track-number { display: block; color: var(--clay-dark); font-size: .7rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; padding-bottom: .85rem; border-bottom: 1px solid var(--sun); margin-bottom: 1.1rem; }
.voice-studio .voice-studio-track .voice-studio-player { background: transparent; border-left: 1px solid var(--line); padding: 0 0 0 clamp(1rem, 3vw, 2.5rem); }
.voice-studio .music-room { padding-block: 1.5rem 2rem; }
.voice-studio .music-record.craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin: 0; border-radius: 3px; }
.voice-studio .music-record-blues.craft-card { border-top: 5px solid var(--ink); }
.voice-studio .music-record-hip-hop.craft-card { border-bottom: 5px solid var(--sun); }
.voice-studio .music-room-credit.craft-card { padding: clamp(1.25rem, 3vw, 2rem); }
.voice-studio .voice-studio-live { gap: 1.75rem; padding-block: 1.5rem 2rem; color: var(--ink); align-items: start; }
.voice-studio .voice-studio-live > .craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin: 0; }
.voice-studio .voice-studio-live > .craft-card:first-child { background: var(--ink); color: var(--paper); }
.voice-studio .voice-studio-live > .craft-card:first-child h2,
.voice-studio .voice-studio-live > .craft-card:first-child > p { color: var(--paper); }
.voice-studio .voice-studio-live > .craft-card:first-child .eyebrow { color: var(--sun); }
.voice-studio .voice-studio-prompt > span { color: var(--clay-dark); }
.voice-studio .voice-studio-scope { grid-template-columns: 1fr; gap: 1.75rem; padding-block: 1.5rem 2rem; }
.voice-studio .voice-studio-scope > .craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin: 0; }
.voice-studio .voice-studio-scope dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.voice-studio .voice-studio-scope dl > .craft-card { padding: clamp(1.25rem, 3vw, 2rem); margin: 0; }
.voice-studio .voice-studio-close { gap: 1.75rem; padding-block: 1.5rem 2.5rem; align-items: start; }
.voice-studio .voice-studio-close > .craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin: 0; }
.voice-studio .voice-studio-close > ol.craft-card { padding-left: clamp(2.5rem, 5vw, 4rem); }
.voice-studio .voice-studio-close ol > li:last-child { padding-bottom: 0; }
.voice-studio .voice-studio-cost.craft-card { max-width: none; }
.release-film.craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin-block: 1rem 2.5rem; background: var(--paper-bright); }
.release-film.craft-card .release-film-player { box-shadow: none; }

/* Chapters act as dividers; each demonstration is its own composed plate. */
[data-page="demos"] .story-chapter.craft-card { padding: clamp(1.5rem, 4vw, 3rem); margin-block: 1.5rem 1.75rem; }
[data-page="demos"] section.demo-workbench { background: transparent; padding-block: .5rem 2rem; gap: 1.75rem; }
[data-page="demos"] .demo-module.craft-card { margin: 0; padding: clamp(1.25rem, 3vw, 2.5rem); gap: clamp(1.5rem, 4vw, 4rem); perspective: none; }
[data-page="demos"] .demo-module.craft-card .demo-module-copy h2 { font-size: clamp(2rem, 3.7vw, 3.8rem); line-height: 1.08; }
[data-page="demos"] .demo-module.craft-card .demo-screen { box-shadow: none; border-width: 1px; border-radius: 2px; transform: none; transition: none; }
[data-page="demos"] .demo-module.craft-card .demo-screen::before,
[data-page="demos"] .demo-module.craft-card .demo-screen::after,
[data-page="demos"] .demo-module.craft-card .estimate-clip { display: none; }
[data-page="demos"] .campaign-example.craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin-block: 1rem 1.75rem; }
[data-page="demos"] .campaign-motion { box-shadow: none; border-radius: 0; }
[data-page="demos"] .story-listening { gap: 1.75rem; padding-block: 1rem 2rem; align-items: start; }
[data-page="demos"] .story-listening > .craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin: 0; }
[data-page="demos"] .story-listening-takes { display: grid; gap: 1.75rem; background: transparent; padding: 0; box-shadow: none; border: 0; }
[data-page="demos"] .story-listening-takes > article.craft-card { padding: clamp(1.25rem, 3vw, 2rem); margin: 0; }
[data-page="demos"] section.voice-feature { background: transparent; }
[data-page="demos"] .voice-feature-layout { padding-block: 1.5rem 2rem; gap: 1.75rem; align-items: start; }
[data-page="demos"] .voice-feature-copy.craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin: 0; color: var(--ink); }
[data-page="demos"] .voice-feature-copy.craft-card :is(h2, p, .voice-feature-text-link) { color: var(--ink); }
[data-page="demos"] .voice-feature-copy.craft-card .eyebrow { color: var(--clay-dark); }
[data-page="demos"] .agent-card.craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); border: 1px solid var(--sun); border-radius: 3px; background: var(--paper-bright); box-shadow: 3px 5px 0 var(--paper-shade), 0 12px 24px -20px var(--ink); }
[data-page="demos"] .agent-card-voice.craft-card { border-top: 5px solid var(--ink); }
[data-page="demos"] .agent-showcase { padding-block: 1.5rem 2rem; }
[data-page="demos"] .agent-showcase-heading.craft-card { max-width: none; padding: clamp(1.25rem, 3vw, 2.5rem); margin-bottom: 1.75rem; }
[data-page="demos"] .agent-showcase-heading.craft-card h2 { font-size: clamp(2rem, 3.5vw, 3.7rem); line-height: 1.1; }
[data-page="demos"] .agent-showcase-grid { gap: 1.75rem; }
[data-page="demos"] .agent-chat-aside.craft-card { transform: none; padding: clamp(1.25rem, 3vw, 2.5rem); background: var(--paper); margin: 0; }
[data-page="demos"] #owner-brief-demo { padding-block: 1rem 2rem; background: transparent; }
[data-page="demos"] #owner-brief-demo > .craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); margin-bottom: 1.75rem; max-width: none; }
[data-page="demos"] .video-updates-layout { padding-block: 1rem 2rem; }
[data-page="demos"] .video-updates-heading.craft-card,
[data-page="demos"] .video-update.craft-card,
[data-page="demos"] .video-updates-footer.craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); }
[data-page="demos"] .video-updates-grid { margin-top: 1.75rem; gap: 1.75rem; }
[data-page="demos"] .video-updates-footer.craft-card { margin-top: 1.75rem; }
[data-page="demos"] .video-update.craft-card h3 { line-height: 1.15; }
[data-page="demos"] .journey-next { padding-block: 1rem 2rem; }
[data-page="demos"] .journey-next > .craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); }
[data-page="demos"] .journey-product-links { border: 0; gap: 1.5rem; margin-block: 1.75rem; }
[data-page="demos"] .journey-product-links > a.craft-card { padding: clamp(1.25rem, 3vw, 2rem); margin: 0; }
[data-page="demos"] .here-now-layout { padding-block: 1rem 2.5rem; }
[data-page="demos"] .here-now-heading.craft-card,
[data-page="demos"] .here-now-use.craft-card,
[data-page="demos"] .here-now-footer.craft-card { padding: clamp(1.25rem, 3vw, 2.5rem); }
[data-page="demos"] .here-now-heading.craft-card h2 { font-size: clamp(2.1rem, 4vw, 4rem); line-height: 1.08; }
[data-page="demos"] .here-now-uses { gap: 1.5rem; margin-top: 1.75rem; }
[data-page="demos"] .here-now-use.craft-card + .here-now-use.craft-card { border-left: 1px solid var(--sun); }
[data-page="demos"] .here-now-footer.craft-card { margin-top: 1.75rem; }

/* A specimen unfolds into separate cards: the object, the decisions, the brief.
   Its containing article supplies behavior and reading order, not another box. */
.studio-specimen .sample-layout { padding-block: 1.75rem 2.5rem; gap: 1.75rem; align-items: start; }
.studio-specimen .sample-preview.craft-specimen-flow,
.studio-specimen .sample-copy.craft-specimen-flow { background: transparent; box-shadow: none; border: 0; padding: 0; }
.studio-specimen .craft-specimen-flow > .craft-card { padding: clamp(1.25rem, 3vw, 2.25rem); margin: 0 0 1.75rem; }
.studio-specimen .sample-preview.craft-card,
.studio-specimen .sample-copy.craft-card,
.studio-specimen .sample-intro.craft-card { padding: clamp(1.25rem, 3vw, 2.25rem); margin: 0; }
.studio-specimen .craft-specimen-flow > .sample-format.craft-card { margin-bottom: 1.75rem; }
.studio-specimen .craft-specimen-flow > .craft-card > h3:first-child { margin-top: 0; }
.studio-specimen .sample-record.craft-card > summary { padding-block: .3rem; }
.studio-specimen .sample-record.craft-card .sample-record-body { padding: .75rem 0 0; }
.studio-specimen .sample-record.craft-card[open] > summary { background: transparent; border-bottom: 1px solid var(--line); padding-bottom: 1rem; }
.studio-specimen .sample-next.craft-card { margin-top: 0; align-items: start; flex-direction: column; }
.studio-specimen .sample-review.craft-card h3 { margin-top: 0; }
.studio-specimen .sample-shop fieldset:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.studio-specimen .sample-shop fieldset:last-child { margin-bottom: 0; }
.studio-specimen .sample-copy .craft-card > .eyebrow { padding-bottom: .8rem; margin-bottom: 1.1rem; border-bottom: 1px solid var(--sun); }
.studio-specimen .studio-practice-preview .craft-card ul { margin-bottom: 0; }
.studio-specimen .sample-campaign-art { background: var(--paper-shade); }

@media (max-width: 900px) {
    [data-page="demos"] .here-now-uses { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .content-service-page .studio-gallery-work,
    .voice-studio .voice-studio-scope dl { grid-template-columns: minmax(0, 1fr); }
    .content-service-page .studio-poster-preview > a { max-width: none; }
    .content-service-page .studio-ad-preview video { width: min(100%, 290px); }
    .content-service-page .proof-work > .craft-card:nth-child(n),
    .voice-studio .voice-studio-track.craft-card:nth-of-type(n) { margin-inline: 0; }
    .voice-studio .voice-studio-track .voice-studio-player { border-left: 0; border-top: 1px solid var(--line); padding: 1.25rem 0 0; }
    .voice-studio .voice-studio-live,
    .voice-studio .voice-studio-close { grid-template-columns: minmax(0, 1fr); }
    [data-page="demos"] .story-listening,
    [data-page="demos"] .agent-showcase-grid { grid-template-columns: minmax(0, 1fr); }
    .studio-specimen .sample-layout { grid-template-columns: minmax(0, 1fr); }
}

/* Keep the stationery cards, with quieter section labels and clearer priorities. */
main header.craft-card--chapter,
main .home-section-heading.craft-card--chapter,
main .section-heading.craft-card--chapter,
main .pricing-intro.craft-card--chapter {
    background: var(--paper-bright); border: 1px solid var(--line);
    border-left: 3px solid var(--sun); outline: none; box-shadow: none;
    padding: 1.1rem 1.4rem;
}
.home-proof-list .craft-card img {
    display: block; width: 100%; height: auto; aspect-ratio: 640 / 489;
    object-fit: cover; border: 1px solid var(--line); margin-bottom: .5rem;
}
.home-proof-list .craft-card .home-proof-scope { font-size: .9375rem; line-height: 1.6; }
.home-proof-list .craft-card .home-proof-visit { margin-top: auto; padding-top: .5rem; }
.project-cost-drivers > .craft-card { display: flex; flex-direction: column; align-items: start; }
.project-cost-drivers .project-price { font-weight: 800; color: var(--ink); line-height: 1.5; }
.project-cost-drivers .text-link { margin-top: auto; min-height: 44px; }
.project-cost-drivers .button { margin-top: .75rem; }
.pricing-running-costs { margin-block: 1.5rem 3rem; }
.pricing-running-costs > summary {
    background: var(--paper); border: 1px solid var(--sun); padding: 1.25rem;
    cursor: pointer; font: 400 clamp(1.4rem, 3vw, 2rem)/1.3 var(--display);
}
.pricing-running-costs > summary span { display: block; font: 400 .9375rem/1.6 var(--body); margin-top: .5rem; }
.pricing-running-costs-body > .section-wrap,
.pricing-running-costs-body > section > .section-wrap { padding-inline: 0; }
.contact-form .form-status { scroll-margin-block: 6rem 2rem; }
.contact-form .form-status:focus-visible { outline: 2px solid var(--ink); outline-offset: 5px; }
.turnstile-widget { min-width: 150px; }
@media (max-width: 760px) {
    .contact-page .contact-layout[data-collector-card] { gap: 1rem; }
    .contact-page .contact-copy.craft-card { padding: 1.15rem; }
    .contact-page .contact-copy h1 { font-size: clamp(1.9rem, 7vw, 2.6rem); line-height: 1.12; margin-bottom: .6rem; }
    .contact-page .contact-copy .eyebrow { margin-bottom: .7rem; }
    .home-proof-list .craft-card { padding: 1.15rem; }
}
@media (max-width: 620px) {
    .studio-hero-home.host-hero-art .host-hero-layout[data-collector-card] {
        grid-template-columns: minmax(0, 1fr); grid-template-areas: "heading" "support" "media";
        row-gap: 1rem;
    }
    .studio-hero-home.host-hero-art .host-hero-actions { align-items: flex-start; flex-direction: row; flex-wrap: wrap; gap: .6rem 1rem; }
    .studio-hero-home.host-hero-art .host-hero-actions .button { padding-inline: 1rem; font-size: .9375rem; }
    .studio-hero-home .studio-bookplate.collector-player-card {
        display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
        align-items: center; gap: .6rem; max-width: 350px; padding: .65rem;
    }
    .studio-hero-home .collector-card-top { display: none; }
    .studio-hero-home .collector-logo-art { height: auto; width: 100%; }
    .studio-hero-home .collector-card-skills { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem .5rem; }
    .studio-hero-home .collector-card-footer { padding-inline: .25rem; }
}

/* Software buying path: one strong demonstration, quieter supporting cards. */
body:is([data-page="index"], [data-page="services"], [data-page="products"], [data-page="product_detail"], [data-page="pricing"], [data-page="work"], [data-page="contact_page"]) main :is(.button-primary, .button-sun),
.workflow-demo-disclosure > summary {
    background: var(--ink); border: 1px solid var(--ink); color: var(--paper-bright);
    box-shadow: none;
}
body:is([data-page="index"], [data-page="services"], [data-page="products"], [data-page="product_detail"], [data-page="pricing"], [data-page="work"], [data-page="contact_page"]) main :is(.button-primary, .button-sun):hover,
.workflow-demo-disclosure > summary:hover { background: #163c51; color: var(--paper-bright); }
main :is(.workflow-feature, .workflow-paths, .software-support) .button-primary span { color: var(--sun); }
.studio-hero-home.host-hero-art .host-hero-layout[data-collector-card] {
    grid-template-columns: minmax(0, 1.65fr) minmax(240px, .65fr);
    padding-block: clamp(2rem, 4vw, 4rem); gap: 1.5rem 4rem;
}
.studio-hero-home.host-hero-art h1 { max-width: 17ch; font-size: clamp(2.75rem, 4.9vw, 5rem); line-height: 1.04; }
.studio-hero-home .studio-bookplate.collector-player-card { max-width: 300px; justify-self: center; align-self: center; box-shadow: 3px 4px 0 var(--paper-shade); }
.studio-hero-home .collector-nameplate > span { font-size: 1.8rem; }
.studio-hero-home .host-hero-definition { max-width: 42ch; }
.studio-hero-home .host-hero-support > p { max-width: 61ch; }
.workflow-feature { padding-block: 0; }
main .workflow-feature-card.craft-card { margin-block: 1.5rem 2rem; padding: clamp(1.25rem, 3vw, 3rem); background: var(--paper-bright); }
.workflow-feature-heading { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: end; gap: 1.5rem 3rem; }
.workflow-feature-heading h2 { font-size: clamp(2rem, 3.5vw, 3.5rem); line-height: 1.1; max-width: 20ch; margin: 0; }
.workflow-feature-heading > p { margin: 0; max-width: 50ch; }
.workflow-preview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; padding: 0; margin: 2rem 0 1rem; border-block: 1px solid var(--line); }
.workflow-preview li { padding: 1.5rem; }
.workflow-preview li:first-child { padding-left: 0; }
.workflow-preview li + li { border-left: 1px solid var(--line); }
.workflow-step { font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--clay-dark); }
.workflow-preview h3 { font: 400 clamp(1.5rem, 2vw, 2rem)/1.2 var(--display); margin: .75rem 0; }
.workflow-preview p { font-size: .9375rem; margin: 0; color: var(--ink-soft); }
.workflow-disclosure { font-size: .875rem; }
.workflow-demo-disclosure { margin-top: 1.25rem; }
.workflow-demo-disclosure > summary { cursor: pointer; padding: 1rem 1.25rem; font-weight: 800; width: fit-content; min-height: 48px; }
.workflow-demo-disclosure > summary span { color: var(--sun); margin-left: .5rem; }
main .workflow-demo-disclosure .pilot-demo { border: 0; border-top: 1px solid var(--line); outline: 0; box-shadow: none; background: transparent; margin: 1.5rem 0 0; padding: 1.5rem 0 0; }
.workflow-demo-disclosure .pilot-demo-intro h2 { font-size: clamp(1.6rem, 2.4vw, 2.4rem); }
.workflow-scope-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: .75rem; }
.workflow-paths { padding-block: 1rem 2rem; }
.workflow-path-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
main .workflow-path.craft-card { border: 1px solid var(--line); border-top: 1px solid var(--sun); box-shadow: none; margin: 0; padding: 1.5rem; display: flex; flex-direction: column; align-items: flex-start; }
.workflow-path h3 { font-size: clamp(1.7rem, 2.3vw, 2.3rem); line-height: 1.15; margin: .5rem 0 .75rem; }
.workflow-path .text-link { display: inline-flex; align-items: center; min-height: 44px; font-size: .875rem; }
main .workflow-path .workflow-path-note { border-top: 1px solid var(--line); margin: auto 0 0; padding-top: 1rem; font-size: .8125rem; }
.software-support { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 2rem; align-items: center; }
.software-support h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.15; }
.software-support nav { display: flex; flex-direction: column; align-items: flex-start; }
.software-support .text-link { display: inline-flex; align-items: center; min-height: 44px; }
main .home-process-steps .craft-card { border: 1px solid var(--line); box-shadow: none; }
.product-hero .product-hero-inner { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 3rem; }
.product-hero h1 { font-size: clamp(2.75rem, 4.7vw, 4.5rem); max-width: 16ch; }
.pilot-entry-note { padding: 2rem; border: 1px solid var(--line); border-top: 3px double var(--sun); background: var(--paper-bright); color: var(--ink); }
.pilot-entry-note h2 { font: 400 clamp(1.8rem, 2.7vw, 2.75rem)/1.15 var(--display); }
.pilot-entry-note .text-link { display: flex; align-items: center; min-height: 44px; margin-top: .5rem; }
.pilot-entry-note small { display: block; color: var(--ink-soft); margin-top: 1rem; }
.pilot-introduction { margin-block: 1rem; }
.pilot-introduction > summary { cursor: pointer; padding: 1rem; min-height: 44px; border: 1px solid var(--line); font-weight: 800; }
.pilot-introduction > summary span { display: block; font-weight: 400; color: var(--ink-soft); font-size: .875rem; margin-top: .25rem; }
.pilot-introduction .product-intro { max-width: 700px; padding: 1.5rem; margin-inline: auto; }
.pilot-introduction .product-intro-figure { max-width: 240px; margin-inline: auto; }
.pilot-introduction .product-intro-transcript { color: var(--ink); }
.software-secondary-costs { padding-block: 1.5rem; }
body[data-page="pricing"] .project-cost-drivers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body:is([data-page="services"], [data-page="pricing"]) .studio-hero.host-hero-art .host-hero-layout[data-collector-card] {
    grid-template-columns: minmax(0, 1fr); grid-template-areas: "heading" "support";
    padding-block: clamp(1.5rem, 3vw, 3rem); gap: .75rem;
}
body:is([data-page="services"], [data-page="pricing"]) .host-hero-heading { max-width: 850px; }
body:is([data-page="services"], [data-page="pricing"]) .host-hero-support { max-width: 760px; }
body:is([data-page="services"], [data-page="pricing"]) .host-hero-heading h1 { font-size: clamp(2.5rem, 4.5vw, 4.5rem); max-width: 21ch; }
body:is([data-page="services"], [data-page="pricing"]) .studio-introduction-body { max-width: 600px; }
@media (max-width: 1000px) {
    .studio-hero-home.host-hero-art .host-hero-layout[data-collector-card] { gap: 1rem 2rem; grid-template-columns: minmax(0, 1.5fr) minmax(200px, .65fr); }
    .workflow-path-list { grid-template-columns: 1fr; }
    .workflow-path h3 { max-width: 32ch; }
    .workflow-path .workflow-path-note { width: 100%; }
}
@media (max-width: 760px) {
    .studio-hero-home.host-hero-art .host-hero-layout[data-collector-card] { grid-template-columns: minmax(0, 1fr); grid-template-areas: "heading" "support" "media"; }
    .workflow-feature-heading, .product-hero .product-hero-inner, .software-support,
    body[data-page="pricing"] .project-cost-drivers { grid-template-columns: 1fr; gap: 1.25rem; }
    .workflow-preview { grid-template-columns: 1fr; margin-block: 1.25rem; }
    .workflow-preview li, .workflow-preview li:first-child { padding: 1rem 0; }
    .workflow-preview li + li { border-left: 0; border-top: 1px solid var(--line); }
    .workflow-preview h3 { margin-block: .5rem; }
    .pilot-entry-note { padding: 1.25rem; }
}
@media (max-width: 620px) {
    .studio-hero-home.host-hero-art .host-hero-layout[data-collector-card] { grid-template-columns: minmax(0, 1fr); grid-template-areas: "heading" "support" "media"; padding-block: 1.5rem; }
    .studio-hero-home.host-hero-art h1 { font-size: clamp(2.4rem, 9vw, 3.3rem); max-width: 17ch; }
    .studio-hero-home .studio-bookplate.collector-player-card { width: 100%; max-width: 300px; justify-self: start; }
    .studio-hero-home .collector-nameplate > span { font-size: 1.3rem; }
    .workflow-demo-disclosure > summary { width: 100%; }
    .workflow-feature-card .readiness-layout { gap: 1rem; }
}