/* Danang Physical Therapy: design tokens */
:root, [data-theme="academy"] {
  --surface: #0f0f0f;
  --surface-alt: #141414;
  --surface-raised: #171717;
  --line: #2a2a2a;
  --line-strong: #737373;
  --ink: #ededed;
  --ink-muted: #a3a3a3;
  --crimson: #ba2138;
  --crimson-text: #ef5a6f;
  --crimson-soft: #2b1218;
  --on-crimson: #ffffff;
  --action: var(--crimson);
  --action-hover: #a11d30;
  --on-action: #ffffff;
  --action-line: #ef5a6f;
  --focus-ring: #ef5a6f;
}
[data-theme="physio"] {
  --surface: #f7f5f0;
  --surface-alt: #efece5;
  --surface-raised: #ffffff;
  --line: #ddd8ce;
  --line-strong: #85807a;
  --ink: #141414;
  --ink-muted: #5c5a55;
  --crimson: #ba2138;
  --crimson-text: #ba2138;
  --crimson-soft: #f8e6e8;
  --on-crimson: #ffffff;
  --action: #141414;
  --action-hover: #2e2e2e;
  --on-action: #ffffff;
  --action-line: #141414;
  --focus-ring: #ba2138;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --container-max: 1120px;
  --measure: 68ch;
  --font-display: Anton, Impact, "Arial Narrow", sans-serif;
  --font-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-sans-vi: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* Components */
body { margin: 0; background: var(--surface); color: var(--ink); font-family: var(--font-sans); font-size: 16px; line-height: 26px; -webkit-font-smoothing: antialiased; }
:lang(vi) { font-family: var(--font-sans-vi); }
.nb-pad { padding: var(--space-6); }
.nb-row { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; }
.nb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-6); }
.nb-stack { display: flex; flex-direction: column; gap: var(--space-6); }

.nb-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); box-sizing: border-box; font-family: var(--font-display); font-weight: 400; font-size: 16px; letter-spacing: 0.02em; line-height: 1; border-radius: var(--radius-md); border: 1px solid transparent; text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s; }
.nb-btn-md { height: 48px; padding: 0 var(--space-6); }
.nb-btn-sm { height: 40px; padding: 0 var(--space-4); font-size: 14px; }
.nb-btn-primary { background: var(--action); border-color: var(--action); color: var(--on-action); }
.nb-btn-primary:hover { background: var(--action-hover); border-color: var(--action-hover); }
.nb-btn-outline { background: transparent; border-color: var(--action-line); color: var(--ink); }
.nb-btn-outline:hover { background: var(--surface-raised); }
.nb-btn-text { background: transparent; color: var(--crimson-text); padding-left: 0; padding-right: 0; height: auto; }
.nb-btn-text:hover { text-decoration: underline; text-underline-offset: 4px; }
.nb-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
[data-theme="physio"] .nb-btn { font-family: inherit; font-weight: 500; font-size: 15px; letter-spacing: 0; }

.nb-overline { margin: 0 0 var(--space-3); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--crimson-text); }

.nb-sh { max-width: 720px; }
.nb-sh-center { margin: 0 auto; text-align: center; }
.nb-sh-title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 36px; line-height: 40px; text-transform: uppercase; color: var(--ink); }
.nb-sh-lead { margin: var(--space-4) 0 0; font-size: 18px; line-height: 28px; color: var(--ink-muted); max-width: var(--measure); }
.nb-sh-center .nb-sh-lead { margin-left: auto; margin-right: auto; }

.nb-card { box-sizing: border-box; background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--space-8); }
.nb-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-4); }
.nb-card-num { font-family: var(--font-display); font-size: 56px; line-height: 56px; color: var(--crimson-text); }
.nb-card-of { font-family: var(--font-display); font-size: 12px; line-height: 16px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-muted); }
.nb-card-title { margin: var(--space-6) 0 var(--space-2); font-size: 20px; line-height: 28px; font-weight: 500; color: var(--ink); }
.nb-card-featured .nb-card-title { font-family: var(--font-display); font-weight: 400; font-size: 28px; line-height: 32px; text-transform: uppercase; }
.nb-card-body { margin: 0; font-size: 15px; line-height: 24px; color: var(--ink-muted); }

.nb-path { display: block; box-sizing: border-box; text-decoration: none; color: inherit; background: var(--surface-raised); border: 1px solid var(--line-strong); border-radius: var(--radius-lg); padding: var(--space-8); transition: border-color .15s; }
a.nb-path:hover { border-color: var(--action-line); }
a.nb-path:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.nb-path-method { margin: 0 0 var(--space-2); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--crimson-text); }
.nb-path-title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 28px; line-height: 32px; text-transform: uppercase; color: var(--ink); }
.nb-path-body { margin: var(--space-3) 0 0; font-size: 15px; line-height: 24px; color: var(--ink-muted); }
.nb-path-cta { display: inline-block; margin-top: var(--space-6); font-weight: 500; color: var(--crimson-text); }

.nb-lockup { display: inline-flex; flex-direction: column; gap: 2px; text-decoration: none; color: inherit; }
.nb-lockup-name { font-family: var(--font-display); font-size: 24px; line-height: 26px; letter-spacing: 0.02em; text-transform: uppercase; color: var(--ink); }
.nb-lockup-endorse { font-size: 11px; line-height: 14px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); }
a.nb-lockup:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 4px; border-radius: var(--radius-sm); }

.nb-family { border-top: 1px solid var(--line); padding: var(--space-8) 0 0; }
.nb-family-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-4); }
.nb-family-link { display: flex; flex-direction: column; gap: var(--space-1); height: 100%; box-sizing: border-box; padding: var(--space-4) var(--space-6); border: 1px solid var(--line-strong); border-radius: var(--radius-md); text-decoration: none; color: inherit; }
a.nb-family-link:hover { border-color: var(--action-line); }
a.nb-family-link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.is-current .nb-family-link { border-color: var(--action-line); }
.nb-family-name { font-family: var(--font-display); font-size: 18px; line-height: 22px; letter-spacing: 0.02em; text-transform: uppercase; color: var(--ink); }
.nb-family-desc { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.nb-family-here { margin-top: var(--space-2); align-self: flex-start; font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--crimson-text); background: var(--crimson-soft); padding: 2px var(--space-2); border-radius: var(--radius-sm); }

.nb-legal { padding: var(--space-6) 0 0; border-top: 1px solid var(--line); font-size: 13px; line-height: 20px; color: var(--ink-muted); }
.nb-legal-line { margin: 0 0 var(--space-2); color: var(--ink); }
.nb-legal-meta { margin: 0; display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); }
.nb-legal-link { color: var(--ink-muted); text-decoration: underline; text-underline-offset: 3px; }
.nb-legal-link:hover { color: var(--ink); }
.nb-legal-link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

/* Page styles */
body{margin:0}
.quick-tile{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background-color .22s ease}
.quick-tile:hover,.quick-tile:focus-visible{transform:translateY(-8px);box-shadow:0 16px 32px rgba(20,20,20,.14);border-color:var(--crimson)!important;background-color:var(--surface-raised)!important}
.quick-tile .go{display:inline-block;transition:transform .22s ease}
.quick-tile:hover .go,.quick-tile:focus-visible .go{transform:translateX(4px)}
@media (prefers-reduced-motion: reduce){.quick-tile,.quick-tile .go{transition:none}.quick-tile:hover,.quick-tile:focus-visible{transform:none}}
.lift,.nb-path,.nb-family-link{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.lift:hover,.lift:focus-visible,.nb-path:hover,.nb-path:focus-visible,.nb-family-link:hover,.nb-family-link:focus-visible{transform:translateY(-6px);box-shadow:0 16px 32px rgba(20,20,20,.14);border-color:var(--crimson)!important}@media (prefers-reduced-motion: reduce){.lift,.nb-path,.nb-family-link{transition:none}.lift:hover,.lift:focus-visible,.nb-path:hover,.nb-path:focus-visible,.nb-family-link:hover,.nb-family-link:focus-visible{transform:none}}
body{margin:0}
body{margin:0}
div.lift:focus-within{transform:translateY(-6px);box-shadow:0 16px 32px rgba(20,20,20,.14);border-color:var(--crimson)!important}
@media (prefers-reduced-motion: reduce){div.lift:focus-within{transform:none}}
body{margin:0}
.intake input[type=text],.intake input[type=email],.intake input[type=tel],.intake input[type=number],.intake select,.intake textarea{font:inherit;font-size:16px;font-weight:400;color:var(--ink);background:var(--surface-raised);border:1px solid var(--line-strong);border-radius:var(--radius-md);padding:12px 14px;box-sizing:border-box;width:100%}
.intake textarea{min-height:96px;resize:vertical}
.intake input:focus-visible,.intake select:focus-visible,.intake textarea:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.intake input[type=checkbox],.intake input[type=radio]{accent-color:#141414;width:18px;height:18px;margin:0;flex:none}
.intake input[type=range]{accent-color:#141414;width:100%}
body{margin:0}
.nf-tile .go{display:inline-block;transition:transform .22s ease}
.nf-tile:hover .go,.nf-tile:focus-visible .go{transform:translateX(4px)}
@media (prefers-reduced-motion: reduce){.nf-tile .go{transition:none}}