/* Abilene Pain — shared stylesheet.
   Dark is the brand default. Light is the visitor's choice, remembered per browser.
   Every colour on the pages comes from the tokens below. */

:root {
  color-scheme: dark;
  --bg: #0b1017; --surface: #121a25; --surface-2: #101823; --surface-3: #18232f; --band: #0b1220;
  --hero-1: #1a3d6b; --hero-2: #12233c;
  --veil-1: rgba(4,7,14,.94); --veil-2: rgba(4,7,14,.72); --veil-3: rgba(4,7,14,.28);
  --ink: #ffffff; --text: #eef3f9; --text-2: #dfe8f4; --text-3: #d2dceb; --muted: #bccadb;
  --accent: #61b6ff; --accent-soft: #93cbff; --accent-soft-hover: #bfdcff;
  --primary: #1d6ef0; --primary-hover: #61b6ff; --on-primary: #ffffff; --primary-tint: rgba(29,110,240,.15);
  --line: rgba(150,190,240,.22); --line-strong: rgba(150,190,240,.34); --line-bold: rgba(97,182,255,.6); --ring: rgba(97,182,255,.5);
  --glass: rgba(11,16,23,.88); --hover-fill: rgba(255,255,255,.06); --shadow: rgba(0,0,0,.4);
}
:root[data-ap-theme="light"] {
  color-scheme: light;
  --bg: #f6f4ee; --surface: #ffffff; --surface-2: #fbfaf6; --surface-3: #e8ecf2; --band: #eceff5;
  --hero-1: #b9d3f2; --hero-2: #dce8f7;
  --veil-1: rgba(246,244,238,.94); --veil-2: rgba(246,244,238,.7); --veil-3: rgba(246,244,238,.25);
  --ink: #0c1626; --text: #16233a; --text-2: #2a3850; --text-3: #3d4b63; --muted: #5a6981;
  --accent: #1560d8; --accent-soft: #1a5fc4; --accent-soft-hover: #0d47a8;
  --primary: #1d6ef0; --primary-hover: #155fd6; --on-primary: #ffffff; --primary-tint: rgba(29,110,240,.1);
  --line: rgba(20,40,70,.14); --line-strong: rgba(20,40,70,.28); --line-bold: rgba(21,96,216,.55); --ring: rgba(21,96,216,.45);
  --glass: rgba(246,244,238,.88); --hover-fill: rgba(20,40,70,.04); --shadow: rgba(20,30,50,.16);
}
/* the 300-weight serif is right on a dark ground; on a light one it needs the 400 to hold */
:root[data-ap-theme="light"] [data-ap-root] :is(h1, h2) { font-weight: 400 !important; }
:root { --ts: 1; }
:root[data-ap-big] { --ts: 1.15; }   /* Larger Text: every page font size is calc(size * var(--ts)) */
.ap-light-only { display: none !important; }
:root[data-ap-theme="light"] .ap-light-only { display: block !important; }
:root[data-ap-theme="light"] .ap-dark-only { display: none !important; }

/* ---- base ---- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--bg); color: var(--text); }
* { box-sizing: border-box; }
a { color: var(--accent-soft); text-decoration: none; }
a:hover { color: var(--accent-soft-hover); }
p a, li a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
::selection { background: var(--primary); color: #fff; }
input, select, textarea { color-scheme: inherit; }
picture { display: contents; }
.ap-skip { position: absolute; left: -9999px; }
.ap-skip:focus { left: 12px; top: 12px; z-index: 300; background: var(--primary); color: var(--on-primary); padding: 14px 18px; font: 600 14px Barlow, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
#ap-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: linear-gradient(90deg, var(--primary), var(--accent)); z-index: 200; pointer-events: none; }

/* ---- header ---- */
[data-ap-root] > header { position: sticky !important; top: 0 !important; transform: translateZ(0); }
@media (hover: none), (pointer: coarse) {
  [data-ap-root] > header { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: var(--bg) !important; }
}
[data-ap-root] > header > nav { overscroll-behavior-x: contain; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
[data-ap-root] > header > nav::-webkit-scrollbar { display: none; }
[data-ap-root] > header > nav > a { flex: 0 0 auto; white-space: nowrap; }
[data-ap-root] > header > a[href^="tel:"] { flex: 0 0 auto; }
@media (min-width: 1000px) {
  [data-ap-root] > header > nav {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
    mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
  }
}
[data-ap-current] { color: var(--ink) !important; box-shadow: inset 0 -2px 0 var(--accent); }
@media (max-width: 1500px) and (min-width: 1000px) { [data-ap-root] > header > a[href^="tel:"] span { display: none; } }
@media (max-width: 1320px) and (min-width: 1000px) { [data-ap-root] > header > a[href^="tel:"] { display: none !important; } }
@media (max-width: 1500px) and (min-width: 1000px) { [data-ap-root] > header > nav { gap: 14px !important; font-size: 14px !important; } }

/* ---- display control: theme + text size ---- */
#ap-display { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
#ap-theme, #ap-textsize {
  position: relative; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0;
  background: transparent; border: 1px solid var(--line-strong); color: var(--text); cursor: pointer;
  transition: border-color .2s, color .2s, background .2s;
}
#ap-theme:hover, #ap-textsize:hover { border-color: var(--accent); color: var(--accent); }
#ap-theme svg { position: absolute; transition: opacity .25s, transform .35s cubic-bezier(.2,.7,.2,1); }
#ap-theme .ap-ic-moon { opacity: 0; transform: rotate(-60deg) scale(.6); }
:root[data-ap-theme="light"] #ap-theme .ap-ic-sun { opacity: 0; transform: rotate(60deg) scale(.6); }
:root[data-ap-theme="light"] #ap-theme .ap-ic-moon { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { #ap-theme svg { transition: none; } }
#ap-textsize { font: 500 16px/1 Newsreader, Georgia, serif; }
#ap-textsize[aria-pressed="true"] { background: var(--surface-3); color: var(--ink); border-color: var(--line-bold); }
.ap-sr { position: absolute; left: -9999px; }

/* ---- hamburger menu ---- */
#ap-menu-btn {
  display: none; align-items: center; gap: 10px; flex: 0 0 auto;
  min-height: 42px; padding: 10px 14px; background: transparent; border: 1px solid var(--line-strong);
  color: var(--text); font-family: inherit; font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; cursor: pointer;
}
#ap-menu-btn span { display: block; width: 20px; height: 2px; background: var(--accent); box-shadow: 0 6px 0 var(--accent), 0 -6px 0 var(--accent); }
#ap-menu { position: fixed; inset: 0; z-index: 300; display: none; background: var(--bg); padding: 12px clamp(14px,4vw,24px) 20px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
#ap-menu[data-open] { display: block; }
#ap-menu-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
#ap-menu-head span { font-family: 'Barlow Condensed', sans-serif; letter-spacing: .18em; text-transform: uppercase; font-size: 15px; color: var(--accent-soft); }
#ap-menu-close { min-height: 42px; min-width: 42px; background: transparent; border: 1px solid var(--line-strong); color: var(--text); font-size: 22px; line-height: 1; cursor: pointer; }
#ap-menu a.ap-mi { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 14px; margin: 0 0 1px; background: var(--surface); color: var(--text); font-size: 17px; line-height: 1.35; font-weight: 400; letter-spacing: 0; text-transform: none; text-decoration: none; box-shadow: 0 0 0 1px var(--line); }
#ap-menu a.ap-mi[data-ap-here] { background: var(--primary); color: var(--on-primary); font-weight: 500; box-shadow: 0 0 0 1px var(--primary); }
#ap-menu .ap-mfoot { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 12px; }
#ap-menu .ap-mfoot a { display: flex; align-items: center; justify-content: center; min-height: 48px; background: var(--primary); color: var(--on-primary); font-size: 15px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; }
#ap-menu .ap-mfoot a + a { background: var(--surface-3); color: var(--text); }
#ap-menu .ap-mdisp { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 12px; }
#ap-menu .ap-mdisp button { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 46px; padding: 0 14px; background: var(--surface); border: 0; box-shadow: 0 0 0 1px var(--line); color: var(--text); font: 400 15px Barlow, sans-serif; text-align: left; cursor: pointer; }
#ap-menu .ap-mdisp button svg { flex: 0 0 auto; color: var(--accent-soft); }
#ap-menu .ap-mdisp button[aria-pressed="true"] { background: var(--surface-3); }
#ap-menu .ap-mdisp button[aria-pressed="true"] svg { color: var(--accent); }
body[data-ap-lock] { overflow: hidden; }
body[data-ap-lock] #ap-callbar { display: none !important; }
@media (min-width: 1000px) { #ap-menu, #ap-menu-btn { display: none !important; } }
@media (max-width: 999px) {
  [data-ap-root] > header > nav { display: none !important; }
  #ap-menu-btn { display: flex !important; margin-left: auto; }
  #ap-textsize { display: none; }
}
@media (max-width: 560px) { #ap-display { display: none; } }
/* narrow phones with a Sections button: the menu button goes icon-only (it keeps its spoken label) */
@media (max-width: 430px) { header:has(#ap-ixb) #ap-menu-btn { font-size: 0; gap: 0; padding: 10px 13px; } }

/* ---- phones ---- */
#ap-callbar { display: none; }
@media (max-width: 860px) {
  #ap-callbar { display: flex; transform: translateY(115%); transition: transform .28s cubic-bezier(.2,.7,.3,1); padding-bottom: env(safe-area-inset-bottom); }
  #ap-callbar[data-ap-show] { transform: translateY(0); }
  body { padding-bottom: 84px; }
  [data-ap-root] > header { padding: 10px clamp(10px, 3vw, 18px) !important; gap: 8px !important; justify-content: space-between !important; flex-wrap: nowrap !important; overflow: visible !important; }
  [data-ap-root] > header > a[href^="tel:"] { display: none !important; }
  [data-ap-root] p, [data-ap-root] li { font-size: calc(17.5px * var(--ts)) !important; line-height: 1.62 !important; }
  [data-ap-root] p[style*="uppercase"] { font-size: calc(15px * var(--ts)) !important; letter-spacing: .12em !important; }
  [data-ap-root] h1 { font-size: calc(40px * var(--ts)) !important; line-height: 1.08 !important; }
}

/* ---- section index (pages with an in-page nav) ---- */
#ap-ix { position: fixed; left: 0; right: 0; z-index: 49; background: var(--surface-2); box-shadow: 0 1px 0 var(--line), 0 10px 24px var(--shadow); transform: translateY(-130%); transition: transform .28s cubic-bezier(.2,.6,.2,1); }
#ap-ix[data-ap-show] { transform: translateY(0); }
#ap-ix .ap-ixr { display: flex; gap: 4px; align-items: center; max-width: 1320px; margin: 0 auto; padding: 0 clamp(16px,4vw,56px); overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
#ap-ix .ap-ixr::-webkit-scrollbar { display: none; }
#ap-ix a { flex: 0 0 auto; padding: 14px 14px; color: var(--text-3); font-size: 15px; text-decoration: none; border-bottom: 2px solid transparent; white-space: nowrap; }
#ap-ix a:hover { color: var(--ink); }
#ap-ix a[data-ap-cur] { color: var(--ink); border-bottom-color: var(--accent); }
#ap-ixb { display: none; }
#ap-ixp { display: none; }
@media (max-width: 999px) {
  #ap-ix { display: none; }
  #ap-ixb { display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; padding: 13px 14px; min-height: 42px; background: transparent; border: 1px solid var(--line-strong); color: var(--text); font: inherit; font-size: 15px; line-height: 1; cursor: pointer; margin-left: auto; }
  #ap-ixb[aria-expanded="true"] { background: var(--surface-3); border-color: var(--accent); }
  #ap-ixp { position: fixed; left: 0; right: 0; z-index: 48; background: var(--bg); box-shadow: 0 12px 28px var(--shadow); padding: 8px 12px 14px; display: none; max-height: 64vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  #ap-ixp[data-open] { display: block; }
  #ap-ixp a { display: block; padding: 15px 15px; margin-bottom: 1px; background: var(--surface); color: var(--text); font-size: 17px; text-decoration: none; box-shadow: 0 0 0 1px var(--line); }
  #ap-ixp a[data-ap-cur] { background: var(--primary); color: var(--on-primary); font-weight: 500; box-shadow: 0 0 0 1px var(--primary); }
}
@media (max-width: 520px) { #ap-ixb { padding: 13px 10px; font-size: 14px; gap: 5px; } }

/* ---- office picker sheet (phones) ---- */
#ap-loc-scrim { position: fixed; inset: 0; z-index: 110; background: var(--veil-2); opacity: 0; pointer-events: none; transition: opacity .22s ease; }
#ap-loc-scrim[data-open] { opacity: 1; pointer-events: auto; }
#ap-loc { position: fixed; left: 0; right: 0; bottom: 0; z-index: 111; background: var(--surface-2); box-shadow: 0 -14px 40px var(--shadow); padding: 10px 12px calc(14px + env(safe-area-inset-bottom)); transform: translateY(102%); transition: transform .26s cubic-bezier(.2,.7,.2,1); max-height: 82vh; overflow-y: auto; -webkit-overflow-scrolling: touch; touch-action: none; }
#ap-loc[data-open] { transform: translateY(0); }
#ap-loc[data-scrolls] { touch-action: pan-y; }
#ap-loc .ap-grab { width: 42px; height: 5px; border-radius: 3px; background: var(--line-bold); margin: 4px auto 12px; }
#ap-loc h2 { margin: 0 0 3px; padding: 0 6px; font-family: Newsreader, Georgia, serif; font-weight: 400; font-size: 22px; line-height: 1.2; color: var(--ink); }
#ap-loc .ap-sub { margin: 0 0 14px; padding: 0 6px; font-size: 14.5px; color: var(--muted); }
#ap-loc a.ap-lo { display: block; padding: 16px 16px; margin-bottom: 8px; background: var(--surface); text-decoration: none; box-shadow: 0 0 0 1px var(--line); }
#ap-loc a.ap-lo:first-of-type { box-shadow: 0 0 0 1px var(--line-bold); background: var(--surface-3); }
#ap-loc .ap-lo-n { display: block; color: var(--ink); font-size: 18px; font-weight: 500; margin-bottom: 3px; }
#ap-loc .ap-lo-a { display: block; color: var(--text-3); font-size: 15px; line-height: 1.45; }
#ap-loc .ap-lo-v { display: block; color: var(--accent); font-size: 15px; font-weight: 500; margin-top: 7px; }
#ap-loc .ap-lo-t { display: block; color: var(--accent-soft); font-size: 13px; margin-top: 5px; }
#ap-loc .ap-hint { margin: 4px 6px 0; font-size: 14px; line-height: 1.5; color: var(--muted); }
#ap-loc button.ap-x { display: block; width: 100%; margin-top: 10px; padding: 15px; background: transparent; border: 1px solid var(--line-strong); color: var(--text-3); font: inherit; font-size: 15px; cursor: pointer; }
@media (min-width: 861px) { #ap-loc, #ap-loc-scrim { display: none; } }

/* ---- share buttons ---- */
[data-ap-share] button { padding: 14px 20px; min-height: 46px; background: transparent; border: 1px solid var(--line-strong); color: var(--text-2); font: inherit; font-size: 14.5px; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
[data-ap-share] button:hover { border-color: var(--accent); color: var(--ink); }
[data-ap-share] button[data-ok] { border-color: var(--primary); color: var(--accent-soft); }

/* ---- checklists ---- */
.ap-ck { list-style: none; margin: 20px 0 0; padding: 0; display: grid; gap: 1px; }
.ap-ck li { margin: 0; }
.ap-ck label { display: flex; align-items: flex-start; gap: 14px; padding: 15px 16px; background: var(--surface); box-shadow: 0 0 0 1px var(--line); cursor: pointer; color: var(--text-2); font-size: 16.5px; line-height: 1.5; }
.ap-ck label:hover { background: var(--surface-3); }
.ap-ck input { appearance: none; -webkit-appearance: none; flex: 0 0 auto; width: 24px; height: 24px; margin: 1px 0 0; border: 1px solid var(--line-bold); background: transparent; cursor: pointer; position: relative; }
.ap-ck input:checked { background: var(--primary); border-color: var(--primary); }
.ap-ck input:checked::after { content: ""; position: absolute; left: 7px; top: 3px; width: 7px; height: 13px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.ap-ck label:has(input:checked) { background: var(--surface-2); }
.ap-ck label:has(input:checked) span { color: var(--muted); text-decoration: line-through; }
.ap-ckr { margin: 16px 0 0; padding: 12px 0 0; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ap-ckr button { padding: 12px 18px; min-height: 44px; background: transparent; border: 1px solid var(--line-strong); color: var(--text-3); font: inherit; font-size: 14.5px; cursor: pointer; }
.ap-ckr button:hover { border-color: var(--accent); color: var(--ink); }
.ap-ckc { font-size: 14.5px; color: var(--accent-soft); }

/* ---- accordions ---- */
.ap-cond { display: block; width: 100%; text-align: left; background: var(--bg); border: 1px solid var(--line); padding: clamp(22px,2.4vw,30px); transition: background .2s, border-color .2s; cursor: pointer; }
.ap-cond:hover { border-color: var(--line-bold); }
.ap-cond[data-open] { background: var(--surface-3); border-color: var(--line-bold); }
.ap-cond button { display: block; width: 100%; padding: 0; margin: 0; background: transparent; border: 0; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.ap-cond-marker::before { content: "Detail"; }
.ap-cond[data-open] .ap-cond-marker::before { content: "Close"; }
.ap-acc-sign::before { content: "+"; }
.ap-acc-btn[aria-expanded="true"] .ap-acc-sign::before { content: "\2212"; }
.ap-faq { display: block; box-shadow: 0 0 0 1px var(--line); padding: clamp(22px,2.6vw,30px); background: var(--surface); transition: background .2s; }
.ap-faq:hover, .ap-faq[data-open] { background: var(--surface-3); }
.ap-faq h3 { margin: 0; }
.ap-faq h3 button { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; width: 100%; padding: 0; background: transparent; border: 0; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.ap-faq h3 button .ap-acc-sign { font-size: 22px; line-height: 1; color: var(--accent); font-family: Barlow, sans-serif; }
.ap-faq h3 button[aria-expanded="true"] .ap-acc-sign::before { content: "\2212"; }
.ap-faq-a { margin: 14px 0 0; max-width: 78ch; color: var(--text-2); font-size: 17.5px; line-height: 1.7; }

/* ---- motion ---- */
@media (prefers-reduced-motion: no-preference) {
  [data-ap-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .75s cubic-bezier(.2,.6,.2,1), transform .75s cubic-bezier(.2,.6,.2,1); }
  [data-ap-reveal].ap-in { opacity: 1; transform: none; }
  [data-ap-card] { transition: transform .28s ease, box-shadow .28s ease, background .28s ease; }
  [data-ap-card]:hover { transform: translateY(-3px); box-shadow: 0 0 0 1px var(--ring), 0 14px 30px var(--shadow) !important; }
  @keyframes apDrift { 0% { transform: scale(1) translate3d(0,0,0); } 50% { transform: scale(1.07) translate3d(1.5%,-1%,0); } 100% { transform: scale(1) translate3d(0,0,0); } }
  [data-ap-drift] { animation: apDrift 30s ease-in-out infinite; will-change: transform; }
}

/* ---- patient education library ---- */
.ap-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 clamp(18px,2vw,26px); }
.ap-filters button { padding: 10px 16px; border: 1px solid var(--line-strong); background: transparent; color: var(--text-2); font: 500 calc(14px * var(--ts)) Barlow, sans-serif; cursor: pointer; }
.ap-filters button:hover { border-color: var(--accent); color: var(--ink); }
.ap-filters button[aria-pressed="true"] { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.ap-lib { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 1px; }
.ap-lib-card { display: flex; flex-direction: column; gap: 14px; box-shadow: 0 0 0 1px var(--line); background: var(--surface); padding: clamp(22px,2.8vw,32px); }
.ap-lib-kind { margin: 0; font-size: calc(12px * var(--ts)); letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.ap-lib-card h2 { margin: 0; font-family: Newsreader, Georgia, serif; font-weight: 400; font-size: calc(clamp(21px,2vw,25px) * var(--ts)); line-height: 1.22; color: var(--ink); }
.ap-lib-card h2 a:hover { color: var(--accent-soft); }
.ap-lib-card p { margin: 0; color: var(--text-3); font-size: calc(17.5px * var(--ts)); }
.ap-lib-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 6px; }
.ap-lib-acts a { display: inline-block; padding: 10px 14px; border: 1px solid var(--line-strong); color: var(--text); font-size: calc(13.5px * var(--ts)); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }
.ap-lib-acts a:hover { border-color: var(--accent); color: var(--ink); }
.ap-lib-acts a.ap-lib-primary { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.ap-lib-acts a.ap-lib-primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
.ap-new { display: inline-block; margin-left: 10px; padding: 3px 8px; background: var(--primary); color: var(--on-primary); font-size: calc(11px * var(--ts)); letter-spacing: .14em; vertical-align: middle; }

/* ---- patient education articles: reading devices ---- */
.ap-article { max-width: 66ch; }
.ap-article dfn { font-style: normal; text-decoration: underline dotted var(--accent); text-underline-offset: 4px; cursor: help; }
.ap-brief { margin: 0 0 28px; padding: clamp(20px,2.6vw,28px); box-shadow: 0 0 0 1px var(--line-bold); background: var(--surface); }
.ap-brief .ap-brief-l { margin: 0 0 10px; font-size: calc(12.5px * var(--ts)); letter-spacing: .13em; text-transform: uppercase; color: var(--accent); }
.ap-brief ul { margin: 0; padding-left: 20px; display: grid; gap: 9px; color: var(--ink); font-size: calc(18px * var(--ts)); line-height: 1.55; }
.ap-cmp { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 1px; margin: 0 0 24px; }
.ap-cmp > div { background: var(--surface); box-shadow: 0 0 0 1px var(--line); padding: clamp(18px,2.2vw,24px); display: grid; gap: 12px; align-content: start; }
.ap-cmp > div[data-hi] { box-shadow: 0 0 0 1px var(--line-bold); }
.ap-cmp h4 { margin: 0; font-family: Newsreader, Georgia, serif; font-weight: 400; font-size: calc(23px * var(--ts)); color: var(--ink); }
.ap-cmp .r { margin: 0; font-size: calc(16px * var(--ts)); line-height: 1.55; color: var(--text-2); }
.ap-cmp .r b { display: block; font-weight: 500; font-size: calc(12px * var(--ts)); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); margin-bottom: 3px; }
.ap-cmp ul { margin: 0; padding-left: 18px; display: grid; gap: 8px; }
.ap-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 1px; margin: 0 0 24px; }
.ap-pair > div { background: var(--surface); box-shadow: 0 0 0 1px var(--line); padding: clamp(18px,2.2vw,24px); }
.ap-pair > div[data-no] { background: var(--bg); }
.ap-pair h4 { margin: 0 0 12px; font-family: Newsreader, Georgia, serif; font-weight: 400; font-size: calc(22px * var(--ts)); color: var(--ink); }
.ap-pair ul { margin: 0; padding-left: 18px; display: grid; gap: 9px; color: var(--text-2); font-size: calc(16.5px * var(--ts)); line-height: 1.55; }
.ap-steps { list-style: none; margin: 0 0 24px; padding: 0; display: grid; }
.ap-steps li { display: grid; grid-template-columns: 44px 1fr; gap: 16px; padding: 0 0 22px; position: relative; }
.ap-steps li::before { content: ""; position: absolute; left: 21px; top: 44px; bottom: 0; width: 1px; background: var(--line-strong); }
.ap-steps li:last-child::before { display: none; }
.ap-steps .n { width: 44px; height: 44px; display: grid; place-items: center; box-shadow: 0 0 0 1px var(--line-bold); background: var(--surface); color: var(--accent); font: 600 15px Barlow, sans-serif; }
.ap-steps h4 { margin: 8px 0 6px; font-family: Newsreader, Georgia, serif; font-weight: 400; font-size: calc(21px * var(--ts)); color: var(--ink); }
.ap-steps p { margin: 0; font-size: calc(17px * var(--ts)); line-height: 1.6; color: var(--text-2); }
.ap-fig { margin: 0 0 26px; padding: clamp(18px,2.4vw,26px); box-shadow: 0 0 0 1px var(--line); background: var(--surface); }
.ap-fig svg { display: block; width: 100%; height: auto; max-width: 560px; margin: 0 auto; }
.ap-fig figcaption { margin: 12px 0 0; font-size: calc(14.5px * var(--ts)); color: var(--muted); text-align: center; }
.ap-rtable-wrap { margin: 0 0 24px; padding: 4px clamp(10px,2vw,20px); background: var(--bg); box-shadow: 0 0 0 1px var(--line); overflow-x: auto; }
.ap-rtable { width: 100%; border-collapse: collapse; font-size: calc(16.5px * var(--ts)); line-height: 1.5; color: var(--text-2); }
.ap-rtable th { padding: 12px 12px; border-bottom: 1px solid var(--line-strong); font-weight: 500; text-align: left; font-size: calc(12.5px * var(--ts)); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); }
.ap-rtable td { padding: 14px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.ap-rtable tr:last-child td { border-bottom: 0; }
.ap-rtable td:first-child { color: var(--ink); font-family: Newsreader, Georgia, serif; font-size: calc(19px * var(--ts)); }
@media (max-width: 700px) {
  .ap-rtable thead { display: none; }
  .ap-rtable tr { display: block; padding: 16px 0; border-bottom: 1px solid var(--line); }
  .ap-rtable tr:last-child { border-bottom: 0; }
  .ap-rtable td { display: block; padding: 4px 0; border: 0; }
  .ap-rtable td:first-child { margin-bottom: 6px; }
  .ap-rtable td[data-label]::before { content: attr(data-label); display: block; font-size: calc(12px * var(--ts)); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); margin-bottom: 2px; }
}

/* ---- inline guide panel on Your Procedure ---- */
.ap-inline { box-shadow: 0 0 0 1px var(--line-bold); background: var(--surface); }
.ap-inline-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px clamp(16px,3vw,32px); border-bottom: 1px solid var(--line); }
.ap-inline-head a, .ap-inline-head button { padding: 9px 14px; border: 1px solid var(--line-strong); background: transparent; color: var(--text); font: 600 calc(12.5px * var(--ts)) Barlow, sans-serif; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; cursor: pointer; }
.ap-inline-head a:hover, .ap-inline-head button:hover { border-color: var(--accent); color: var(--ink); }
.ap-inline-body { padding: clamp(24px,3vw,44px) clamp(16px,3vw,32px); display: grid; grid-template-columns: minmax(0, 72ch); justify-content: center; }
.ap-inline-body .ap-article > :first-child { margin-top: 0; }

/* ---- print ---- */
@media print {
  @page { margin: 14mm; }
  html, body { background: #fff !important; }
  [data-ap-root] { background: #fff !important; color: #111 !important; }
  [data-ap-root] *, [data-ap-root] h1, [data-ap-root] h2, [data-ap-root] h3, [data-ap-root] p, [data-ap-root] li, [data-ap-root] strong { color: #111 !important; background: transparent !important; box-shadow: none !important; text-shadow: none !important; }
  [data-ap-root] section { border-color: #bbb !important; padding: 10mm 0 !important; }
  [data-ap-root] > header, #ap-callbar, #ap-progress, .ap-skip, [role="group"], form, nav, #ap-ix, #ap-ixp, #ap-menu { display: none !important; }
  [data-ap-reveal] { opacity: 1 !important; transform: none !important; }
  .ap-acc-body[hidden], .ap-faq-a[hidden], .ap-cond-detail[hidden] { display: block !important; }
  a { text-decoration: none !important; }
  a[href^="tel:"], a[href^="sms:"], a[href^="mailto:"] { border: 0 !important; padding: 0 !important; }
}