/* Hallmark · common reading and interaction layer · warm paper + cyan · no framework */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:var(--space-6)}
body{margin:0;overflow-x:clip;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);font-size:17px;line-height:1.7;word-break:keep-all;-webkit-font-smoothing:antialiased}
body:has(dialog[open]){overflow-y:hidden}
::selection{background:var(--color-accent);color:var(--color-accent-ink)}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{opacity:.55;cursor:not-allowed}
img,svg{display:block;max-width:100%}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-style:normal;overflow-wrap:anywhere;min-width:0}
button,a,input{ -webkit-tap-highlight-color:transparent }
:focus-visible{outline:3px solid var(--color-focus);outline-offset:5px}
[hidden]{display:none!important}
.site-width{width:min(1200px,calc(100% - 96px));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:200;top:var(--space-3);left:var(--space-4);padding:var(--space-3) var(--space-5);background:var(--color-ink);color:var(--color-paper);transform:translateY(-200%)}
.skip-link:focus{transform:translateY(0)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);min-height:52px;padding:var(--space-4) var(--space-6);border:1px solid var(--color-ink);border-radius:var(--radius-sm);background:var(--color-ink);color:var(--color-paper);font-size:16px;font-weight:600;line-height:1.2;white-space:nowrap;transition:transform var(--dur-fast) var(--ease-out),opacity var(--dur-fast) var(--ease-out)}
.button:hover{transform:translateY(-2px)}
.button:active{transform:translateY(0);opacity:.8}
.button:disabled{transform:none}
.button--outline{background:transparent;color:var(--color-ink);border-color:var(--color-rule)}
.button--light{background:var(--color-paper);color:var(--color-ink);border-color:var(--color-paper)}
.text-link{display:inline-flex;align-items:center;gap:var(--space-2);min-height:44px;font-size:15px;font-weight:500;white-space:nowrap;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.text-link:hover{text-decoration-thickness:2px}
.text-link:active{opacity:.65}
.prototype-note{font-size:12px;line-height:1.6;color:var(--color-muted)}
.resource-kind{font-size:12px;font-weight:600;letter-spacing:.03em}
.resource-dialog{width:min(940px,calc(100% - 48px));max-height:calc(100dvh - 48px);padding:0;border:1px solid var(--color-rule);border-radius:var(--radius-lg);background:var(--color-paper);color:var(--color-ink);box-shadow:0 24px 100px var(--color-shadow);overflow:auto;overscroll-behavior:contain}
.resource-dialog::backdrop{background:var(--color-scrim);backdrop-filter:blur(5px)}
.dialog-close{position:absolute;right:var(--space-4);top:var(--space-4);z-index:2;display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--color-rule);border-radius:var(--radius-pill);background:var(--color-paper);color:var(--color-ink);font-size:26px;line-height:1}
.dialog-close:hover{background:var(--color-paper-2)}
.dialog-close:active{transform:scale(.94)}
.dialog-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);min-height:570px}
.dialog-art{display:flex;flex-direction:column;justify-content:space-between;gap:var(--space-12);padding:var(--space-10);background:var(--color-accent);color:var(--color-accent-ink);border-right:1px solid var(--color-rule)}
.dialog-art__brand{font-family:var(--font-body);font-weight:800;font-size:20px;letter-spacing:-.04em}
.dialog-art__title{font-family:var(--font-display);font-weight:800;font-size:32px;line-height:1.4;letter-spacing:-.03em;overflow-wrap:anywhere}
body[data-variant="b"] .dialog-art__title{font-weight:600}
.dialog-art__line{height:1px;background:currentColor;opacity:.35;margin:var(--space-6) 0}
.dialog-art__meta{font-size:12px;letter-spacing:.02em;line-height:1.8}
.dialog-content{padding:var(--space-16) var(--space-10) var(--space-10);min-width:0}
.dialog-kicker{font-size:12px;font-weight:600;color:var(--color-muted);margin-bottom:var(--space-3)}
.dialog-heading{font-family:var(--font-body);font-size:27px;font-weight:650;line-height:1.4;letter-spacing:-.035em;margin-bottom:var(--space-4)}
.dialog-description{font-size:15px;line-height:1.8;color:var(--color-muted)}
.dialog-subhead{font-size:14px;font-weight:600;margin-top:var(--space-6);margin-bottom:var(--space-2)}
.dialog-outline{margin:0 0 var(--space-6);padding:0;list-style:none;counter-reset:contents}
.dialog-outline li{counter-increment:contents;display:flex;align-items:baseline;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--color-rule);font-size:14px}
.dialog-outline li::before{content:counter(contents,decimal-leading-zero);font-size:11px;font-variant-numeric:tabular-nums;color:var(--color-muted)}
.dialog-note{font-size:12px;line-height:1.7;color:var(--color-muted);margin-top:var(--space-4)}
.dialog-content .button{width:100%}
.dialog-back{border:0;background:none;padding:0;margin:0 0 var(--space-6);font-size:13px;min-height:32px}
.dialog-back:hover{text-decoration:underline}
.lead-field{display:block;margin-top:var(--space-5)}
.lead-label{display:block;font-size:14px;font-weight:600;margin-bottom:var(--space-2)}
.lead-input{width:100%;height:52px;border:1px solid var(--color-rule);outline:2px solid transparent;outline-offset:2px;border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);background:var(--color-white);font-size:16px;line-height:1.4;transition:border-color var(--dur-fast) var(--ease-out)}
.lead-input::placeholder{color:var(--color-muted);opacity:.8}
.lead-input:hover{border-color:var(--color-muted)}
.lead-input:focus{outline-color:var(--color-focus)}
.lead-input[aria-invalid="true"]{border-color:var(--color-error);background:var(--color-error-bg)}
.field-error{display:block;min-height:24px;margin-top:var(--space-1);font-size:12px;line-height:1.6;color:var(--color-error)}
.lead-privacy{margin:var(--space-4) 0 var(--space-6);padding:var(--space-4);background:var(--color-paper-2);border-radius:var(--radius-sm);font-size:12px;line-height:1.7;color:var(--color-muted)}
.success-mark{display:grid;place-items:center;width:64px;height:64px;border:1px solid var(--color-ink);border-radius:var(--radius-pill);font-size:28px;margin-bottom:var(--space-8)}
.success-panel{padding-top:var(--space-8)}
.success-panel .button{margin-top:var(--space-8)}
@media(max-width:767px){
  body{font-size:16px}
  .site-width{width:calc(100% - 40px)}
  .resource-dialog{width:calc(100% - 24px);max-height:calc(100dvh - 24px);border-radius:var(--radius-md)}
  .dialog-grid{grid-template-columns:minmax(0,1fr);min-height:0}
  .dialog-art{padding:var(--space-6);gap:var(--space-4);border-right:0;border-bottom:1px solid var(--color-rule)}
  .dialog-art__brand{font-size:15px}
  .dialog-art__title{font-size:25px;max-width:calc(100% - 40px)}
  .dialog-art__line,.dialog-art__meta{display:none}
  .dialog-content{padding:var(--space-6)}
  .dialog-heading{font-size:24px}
  .dialog-close{width:36px;height:36px;top:var(--space-3);right:var(--space-3)}
  .success-panel{padding-top:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
