/* VOLKX visual system. Content and responsive behavior remain in volkx.css. */
:root {
  --studio-ink: #111;
  --studio-paper: #f7f7f7;
  --studio-line: #3b3b3b;
}
body {
  background: radial-gradient(ellipse 900px 460px at 50% 0, #202020 0, #0c0c0c 80%);
  background-repeat: no-repeat;
  background-color: #0c0c0c;
}
.site-header {
  background: #171717f5;
  border-color: #404040;
  border-radius: 14px;
  box-shadow: 0 12px 35px #0004, inset 0 1px 0 #ffffff06;
}
.site-header .brand img { mix-blend-mode: screen; }
/* Quick links belong inside the header, including the 1001–1100px breakpoint.
   Only the All pages menu should inherit dropdown positioning. */
.site-header > .quick-nav {
  position: static;
  inset: auto;
  width: auto;
  max-height: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  align-items: center;
  flex: 0 0 auto;
}
.site-header > .quick-nav a { width: auto; }
.button,.outline { border-radius: 7px; transition: background .2s, border-color .2s, transform .2s; }
.site-header>.button { border-radius: 7px; }
.all-pages-menu>nav { border-radius: 10px; padding: 10px; }
.all-pages-menu>nav>a { border-radius: 5px; }
.service-hero { padding-top: 36px; padding-bottom: 40px; }
.service-hero-heading { margin-bottom: 26px; }
.service-hero .eyebrow { font-size: 10px; letter-spacing: .2em; color: #bcbcbc; }
.service-hero h1 {
  font-size: clamp(44px, 5.2vw, 68px);
  line-height: 1.02;
  letter-spacing: -.06em;
  margin-top: 14px;
}
.service-hero h1 span { color: #a9a9a9; }
.service-hero-heading>p:last-child { max-width: 58ch; font-size: 16px; line-height: 1.75; margin-top: 16px; }
.first-service-cards { gap: 20px; }
.first-service-card {
  position: relative;
  background: var(--studio-paper);
  color: var(--studio-ink);
  border: 1px solid #fff4;
  border-radius: 10px;
  padding: 24px;
  box-shadow: 0 16px 28px #0002;
  transition: transform .2s, background .2s, box-shadow .2s;
}
.first-service-card .service-number {
  width: 100%;
  padding: 0;
  border: 0;
  color: #5a5a5a;
  font-size: 10px;
  letter-spacing: .14em;
}
.service-visual {
  display: block;
  width: 100%;
  margin: 20px 0 0;
  padding: 12px 8px;
  background: #181818;
  border: 1px solid #373737;
  border-radius: 6px;
  overflow: hidden;
}
.service-visual svg { display: block; width: 100%; height: 96px; }
.visual-window { fill: #242424; stroke: #777; stroke-width: 1; }
.visual-panel { fill: #353535; stroke: #555; stroke-width: 1; }
.visual-line { fill: none; stroke: #aaa; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.visual-dot { fill: #a7a7a7; }
.visual-strong,.visual-core { fill: #ededed; }
.visual-connector { fill: none; stroke: #777; stroke-width: 1.5; }
.visual-core-mark,.visual-dark-line { fill: none; stroke: #1b1b1b; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.first-service-card h2 {
  font-size: clamp(29px, 2.8vw, 37px);
  line-height: 1.08;
  letter-spacing: -.045em;
  margin-top: 23px;
  min-height: 2.16em;
}
.first-service-card .service-subtitle { color: #414141; font-size: 13px; min-height: 3em; margin-top: 12px; }
.first-service-card p { font-size: 14px; line-height: 1.75; color: #505050; margin: 10px 0 22px; max-width: 32ch; }
.first-service-card .card-link { font-size: 13px; padding-top: 15px; border-color: #c8c8c8; gap: 14px; }
.card-link>span { display: inline-grid; place-items: center; border: 1px solid #c3c3c3; border-radius: 5px; width: 28px; height: 28px; }
.first-service-card:hover .card-link>span { transform: none; background: #181818; color: #fff; border-color: #181818; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  .first-service-card:hover { transform: translateY(-4px); box-shadow: 0 22px 35px #0004; }
}
.service-next-step { padding-top: 24px; gap: 8px 24px; font-size: 13px; }
.service-next-step p { color: #aaa; }
.policy>h1,.policy .service-page-intro h1,.policy .agent-page-intro h1 { letter-spacing: -.055em; line-height: 1.06; }
.policy .eyebrow { color: #aaa; }
.workflow-example,.policy .service-card,.policy .plan-summary,.planner-card { border-color: var(--studio-line); border-radius: 9px; }
.tier-scroll { border-radius: 9px; border-color: #484848; }
.tier-table thead th { background: #202020; }
.tier-table thead th:first-child { background: #202020; }
.policy .workflow-jump a { border-radius: 9px; }
footer { padding-block: 28px; border-top-color: #343434; }
footer a:not(.brand) { min-height: 44px; display: inline-flex; align-items: center; font-size: 12px; }
footer>p { font-size: 12px; line-height: 1.7; }
footer>span { font-size: 10px; line-height: 1.7; }
@media(min-width:651px) and (max-width:1000px) {
  .first-service-cards { gap: 14px; }
  .first-service-card { padding: 20px 16px; }
  .service-visual { padding: 8px 3px; }
  .service-visual svg { height: 92px; }
  .first-service-card h2 { font-size: 29px; }
  .first-service-card .card-link { font-size: 12px; gap: 6px; }
}
@media(max-width:650px) {
  .service-hero { padding-top: 34px; padding-bottom: 30px; }
  .service-hero h1 { font-size: clamp(35px,9.8vw,56px); margin-top: 18px; }
  .service-hero-heading { margin-bottom: 28px; }
  .service-hero-heading>p:last-child { font-size: 15px; max-width: 36ch; margin-top: 20px; }
  .first-service-cards { gap: 20px; }
  .first-service-card { padding: 22px; }
  .service-visual { margin-top: 16px; padding: 8px; }
  .service-visual svg { height: 88px; }
  .first-service-card h2 { min-height: 0; margin-top: 22px; font-size: 34px; max-width: 13ch; }
  .first-service-card .service-subtitle { min-height: 0; margin-top: 12px; font-size: 14px; }
  .first-service-card p { font-size: 15px; margin-top: 14px; max-width: 32ch; }
  .first-service-card .card-link { font-size: 14px; }
  .service-next-step { gap: 3px; }
  .service-next-step a { font-size: 14px; }
}
@media(prefers-reduced-transparency:reduce) { .site-header { background:#171717; } }
@media(prefers-reduced-motion:reduce) { .first-service-card:hover { transform:none; } }

/* A light footer balances the dark page without adding another section. */
footer.wrap {
  width:100%; max-width:none; margin:0;
  padding:32px max(48px, calc((100% - 1220px)/2));
  background:#f4f4f4; color:#4b4b4b; border-top:1px solid #fff;
}
footer.wrap a,footer.wrap .brand,footer.wrap .brand>span { color:#171717; }
footer.wrap p,footer.wrap>span { color:#555; }
footer.wrap a:not(.brand):hover { text-decoration:underline; text-underline-offset:4px; }
footer.wrap a:focus-visible { outline-color:#171717; }
@media(min-width:721px) and (max-width:1100px) { footer.wrap { padding-inline:28px; } }
@media(max-width:720px) { footer.wrap { padding:28px 18px; } }
@media(max-width:360px) { footer.wrap { padding-inline:16px; } }

/* Interior pages share the homepage's paper surfaces and charcoal framing. */
:root { --studio-muted:#505050; --studio-paper-line:#d3d3d3; }
body { min-height:100dvh; display:flex; flex-direction:column; }
body>main { flex:1; }
body>.site-header { flex-shrink:0; }
.policy { padding-block:46px 64px; }
.policy h1 { font-size:clamp(38px,4.8vw,64px); line-height:1.06; text-wrap:balance; }
.policy h2,.policy h3 { text-wrap:balance; }
.policy .package-page-intro h1,.policy .agent-page-intro h1 { font-size:clamp(38px,4.8vw,64px); line-height:1.06; }
.policy>.eyebrow,.policy>h1,.policy>h1+p { text-align:center; }
.policy>h1+p { max-width:66ch; margin-inline:auto; }
.policy .service-detail-grid { border:0; gap:20px; }
.policy :is(.service-detail-grid>section,.service-card,.plan-summary,.planner-card,.workflow-example,.package-scope),
.document-page>section,.document-page>.review-note,.recovery-page>.policy-nav {
  background:var(--studio-paper); color:var(--studio-ink); color-scheme:light;
  border:1px solid #fff4; border-radius:10px; box-shadow:0 16px 28px #0002;
}
.policy :is(.service-detail-grid>section,.service-card,.plan-summary,.planner-card,.workflow-example,.package-scope) :is(h2,h3,h4,label),
.document-page>section :is(h2,h3) { color:var(--studio-ink); }
.policy :is(.service-detail-grid>section,.service-card,.plan-summary,.planner-card,.workflow-example,.package-scope) :is(p,li),
.document-page>section :is(p,li),.document-page>.review-note p { color:var(--studio-muted); }
.policy :is(.service-detail-grid>section,.service-card,.plan-summary,.planner-card,.workflow-example,.package-scope) :is(.eyebrow,.label,.service-meta,.muted,.scope-tier,.scope-lead),
.document-page>section .eyebrow { color:#595959; }
.policy :is(.service-detail-grid>section,.service-card,.plan-summary,.planner-card,.workflow-example,.package-scope) a,
.document-page>section a,.recovery-page>.policy-nav a { color:#171717; }
.policy :is(.planner-card,.package-scope) .button { background:#191919; color:#fff; border-color:#191919; }
.policy :is(.planner-card,.package-scope) .button:hover { background:#363636; border-color:#363636; }
.policy :is(.planner-card,.package-scope) :is(.outline,.text-link) { color:#171717; border-color:#929292; }
.policy :is(.planner-card,.package-scope) .outline:hover { background:#e5e5e5; }
.policy :is(.service-card,.plan-summary,.planner-card,.workflow-example,.package-scope,.service-detail-grid) :focus-visible,
.document-page>section :focus-visible,.recovery-page>.policy-nav :focus-visible { outline:3px solid #171717; outline-offset:4px; box-shadow:none; }
.policy .service-detail-grid>section { padding:30px; margin:0; }
.service-detail-grid .detail-number { color:#626262; border-bottom:1px solid var(--studio-paper-line); padding-bottom:16px; }
.policy .service-detail-grid h2 { margin-top:22px; }
.policy .service-detail-grid p { font-size:16px; }
.policy .policy-nav { display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:center; margin-top:30px; }
.policy .policy-nav a { font-size:14px; }

/* Comparison: dark tier headings, quiet white rows, clear dark actions. */
.tier-scroll { background:var(--studio-paper); border-color:#666; }
.tier-table tbody th,.tier-table tbody td,.tier-table tfoot th,.tier-table tfoot td {
  background:var(--studio-paper); color:#363636; border-color:var(--studio-paper-line);
}
.tier-table tbody th:first-child,.tier-table tfoot th:first-child { background:#ebebeb; color:#171717; }
.tier-table tbody tr:nth-child(even) td { background:#eee; }
.tier-table tbody tr:hover td { background:#e1e1e1; }
.tier-table thead th { border-top:0; border-bottom-color:#555; }
.tier-table thead strong { color:#f7f7f7; }
.tier-table tfoot .outline { color:#fff; background:#191919; border-color:#191919; text-decoration:none; }
.tier-table tfoot .outline:hover { background:#363636; }
.tier-table tfoot a:focus-visible { outline-color:#171717; }
.policy .package-detail { margin:16px 0; }
.package-scope>summary { padding:24px; }
.scope-toggle { color:#171717; }
.scope-body { padding:0 28px 28px; }
.policy .scope-body h3 { padding-top:24px; border-top:1px solid var(--studio-paper-line); }
.package-scope>summary:focus-visible { outline-offset:-6px; border-radius:10px; }

/* Workflows: matching light entry cards and readable example panels. */
.policy .workflow-jump a { background:var(--studio-paper); box-shadow:0 16px 28px #0002; border:1px solid #fff4; }
.policy .workflow-jump a:focus-visible { outline-color:#fff; }
.workflow-example .example-message>span { color:#595959; }
.workflow-example .example-message { background:#e9e9e9; border:1px solid #d1d1d1; border-radius:6px; padding:16px; }
.workflow-example .example-answer { background:#fff; border-left:3px solid #333; }
.policy .workflow-example .example-message p { color:#262626; font-size:15px; }
.policy .workflow-example .example-note { color:#595959; }

/* Individual services retain strong selected and keyboard states. */
.policy .service-grid { gap:20px; }
.policy .service-card { padding:26px; }
.service-card .service-meta { gap:12px; font-size:10px; letter-spacing:.08em; }
.policy .service-card h3 { font-size:29px; letter-spacing:-.045em; }
.policy .service-card button { color:#171717; border-color:var(--studio-paper-line); }
.policy .service-card button:hover { text-decoration:underline; text-underline-offset:4px; }
.policy .service-card.selected { background:#e1e1e1; border-color:#fff; box-shadow:inset 0 0 0 2px #171717,0 16px 28px #0002; }
.policy .service-card.selected button { color:#171717; font-weight:600; }
.filters { justify-content:center; }
.filters button { border-radius:7px; }
.selection-review { padding-top:28px; }

/* Brief form: light fields, clear labels and explicit feedback. */
.policy .plan-summary,.policy .planner-card { padding:28px; }
.brief-guide { border-color:var(--studio-paper-line); }
.planner-card :is(input,textarea,select) { background:#fff; color:#171717; border:1px solid #888; border-radius:6px; }
.planner-card ::placeholder { color:#626262; opacity:1; }
.planner-card .error-summary { color:#171717; border:2px solid #222; border-radius:6px; background:#e8e8e8; }
.planner-card :is(input,textarea,select)[aria-invalid=true] { border:2px solid #222; }
.planner-card .error-summary h3 { margin-top:0; }
.planner-card #brief-text { color:#303030; border-color:var(--studio-paper-line); font-size:14px; }
.planner-card #brief-result { scroll-margin-top:120px; }
.planner-card #brief-result:focus-visible { outline-color:#171717; }

/* Reference pages use the same paper treatment without changing their notices. */
.document-page { max-width:960px; }
.document-page>h1 { margin-top:16px; }
.document-page>.policy-nav { margin-bottom:32px; }
.document-page>section { padding:32px; margin-top:20px; }
.document-page>section h2 { font-size:clamp(27px,3vw,36px); margin:0 0 20px; }
.document-page>section p+p { margin-top:18px; }
.document-page>section li+li { margin-top:12px; }
.document-page>.review-note { padding:24px 32px; margin-top:24px; border-left:4px solid #777; }
.document-page>.review-note p { margin:0; font-size:14px; }
.recovery-page { max-width:800px; padding-block:80px; }
.recovery-page>.policy-nav { padding:26px; margin-top:32px; }

/* Interaction polish: a clear selection, a readable chart and quieter secondary links. */
.all-pages-menu>nav { max-height:min(70dvh,calc(100dvh - 112px - env(safe-area-inset-bottom))); }
.site-header>.button[aria-current="page"] { box-shadow:inset 0 -3px 0 #707070; }
.workflow-jump strong { min-height:2.4em; display:flex; align-items:center; }
.policy .service-card { transition:background .2s,box-shadow .2s; }
.policy .service-card.selected { background:#fff; box-shadow:inset 0 0 0 2px #171717,0 16px 28px #0002; }
.policy .service-card button>span:last-child { display:grid; place-items:center; flex-shrink:0; width:30px; height:30px; border:1px solid #b8b8b8; border-radius:5px; }
.policy .service-card.selected button>span:last-child { background:#191919; color:#fff; border-color:#191919; }
.policy .selection-review { background:#1b1b1b; border:1px solid #444; border-radius:10px; padding:28px; }
.policy .selection-review h2 { font-size:30px; }
.selected-services li { border-color:#414141; }
.selected-services button:hover { color:#fff; background:#292929; border-radius:5px; }
.selection-bar { margin-top:20px; }
.policy .edit-services { display:inline-flex; gap:12px; align-items:center; min-height:44px; font-size:14px; margin-top:10px; }
.policy .plan-summary .brief-guide ol { list-style:none; counter-reset:brief-step; padding:0; }
.brief-guide li { counter-increment:brief-step; display:flex; align-items:baseline; gap:12px; }
.brief-guide li::before { content:counter(brief-step,decimal-leading-zero); font-size:11px; color:#595959; font-variant-numeric:tabular-nums; }
.tier-table tbody tr:nth-child(8)>*,.tier-table tbody tr:nth-child(14)>*,.tier-table tbody tr:nth-child(18)>* { border-top:2px solid #aaa; }
.tier-table tbody th { font-weight:600; }
.tier-table tbody td { font-size:14px; }
.document-page>section :is(p,ul) { max-width:72ch; }
.policy #faq { padding-top:24px; border-top:1px solid #444; }
.policy #faq summary { padding-block:18px; font-size:17px; min-height:56px; }
.policy #faq details { padding:0; }
.policy #faq details p { margin:0 0 24px; max-width:70ch; font-size:15px; }
.policy #faq summary:hover { color:#fff; }
.policy #faq summary::after { top:18px; }
.interaction-note { margin:28px 0; padding:24px; border:1px solid #777; border-radius:10px; background:#1c1c1c; }
.interaction-note p { margin-top:10px; }
html:not(.planner-ready) :is(#brief-form,.filters,.service-card button,.selection-review,#edit-services) { display:none; }

@media(max-width:650px) {
  .workflow-jump strong { min-height:0; }
  .policy .selection-review { padding:24px 20px; }
  .selection-bar { flex-direction:column; align-items:stretch; }
  .tier-table tbody td { font-size:13px; }
}

@media(max-width:800px) {
  .policy .service-grid { gap:16px; }
  .policy .service-detail-grid { gap:16px; }
  .policy .service-detail-grid>section { padding:24px; }
}
@media(max-width:650px) {
  .policy { padding-block:34px 42px; }
  .policy h1,.policy .package-page-intro h1,.policy .agent-page-intro h1 { font-size:clamp(35px,9vw,50px); }
  .policy .service-detail-grid>section,.policy .service-card,.policy .plan-summary,.policy .planner-card { padding:24px 20px; }
  .policy .service-detail-grid h2 { font-size:28px; }
  .package-scope>summary { padding:22px; }
  .scope-body { padding:0 22px 24px; }
  .tier-table th:first-child { box-shadow:2px 0 0 #b8b8b8; }
  .tier-table tfoot .outline { white-space:normal; }
  .document-page>section { padding:26px 22px; }
  .document-page>section h2 { font-size:28px; }
  .document-page>.review-note { padding:22px; }
  .document-page>section ul { padding-left:20px; }
  .recovery-page { padding-block:60px; }
}