/* ============================================================
   Taylor Chiropractic & Wellness — page-specific styles
   palette-modern + type-modern-2 (Space Grotesk + IBM Plex Sans)
   ============================================================ */

/* ---- Nav ------------------------------------------------- */
.nav-bar { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,0.9);
  backdrop-filter: saturate(1.4) blur(8px); -webkit-backdrop-filter: saturate(1.4) blur(8px);
  transition: background 200ms ease, box-shadow 200ms ease; border-bottom: 1px solid transparent; }
.nav-scrolled { background: var(--bg); box-shadow: var(--shadow-sm); border-bottom-color: var(--rule); }
.nav-brand { display:flex; align-items:center; gap:.6rem; text-decoration:none; }
.nav-brand-mark { width:30px; height:30px; flex:0 0 auto; }
.nav-brand-text { font-family:var(--font-display); font-weight:700; font-size:1.15rem;
  color:var(--ink); letter-spacing:-0.02em; line-height:1; }
.nav-brand-sub { display:block; font-family:var(--font-mono); font-size:.6rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--accent-ink); margin-top:.2rem; }
.nav-desktop { display:flex; gap:2rem; align-items:center; }
.nav-link { font-family:var(--font-body); font-size:.9375rem; color:var(--ink-2); text-decoration:none; position:relative; }
.nav-link::after { content:''; position:absolute; bottom:-4px; left:0; width:0; height:2px;
  background:var(--accent); transition:width 300ms cubic-bezier(0.2,0.7,0.2,1); }
.nav-link:hover::after { width:100%; } .nav-link:hover { color:var(--ink); }
.nav-cta-desktop { font-size:.875rem; padding:.625rem 1.25rem; }
.nav-hamburger { display:none; background:none; border:none; color:var(--ink); cursor:pointer;
  padding:.5rem; min-width:44px; min-height:44px; align-items:center; justify-content:center; }
.nav-mobile-overlay { position:fixed; inset:0; background:var(--bg); z-index:9990; display:none;
  align-items:center; justify-content:center; }
.nav-mobile-overlay.open { display:flex; }
.nav-mobile-overlay .us-nav-close { position:absolute; top:14px; right:18px; background:none; border:0;
  cursor:pointer; color:var(--ink); min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
@media (min-width:821px){ .nav-mobile-overlay.open { display:none; } }
@media (max-width:820px){ .nav-desktop, .nav-cta-desktop { display:none; } .nav-hamburger { display:inline-flex; } }

/* ---- Animated link underline (flourish) ----------------- */
.link-underline { position:relative; color:var(--accent); font-weight:500; text-decoration:none; }
.link-underline::after { content:''; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background:var(--accent); transform:scaleX(0); transform-origin:left;
  transition:transform 280ms cubic-bezier(0.2,0.7,0.2,1); }
.link-underline:hover::after { transform:scaleX(1); }

/* ---- Hero (image-led) ----------------------------------- */
.hero-il { position:relative; min-height:88vh; display:flex; align-items:flex-end; overflow:hidden;
  background:var(--surface-2); }
.hero-il-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-il-scrim { position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(circle at 78% 20%, hsl(197 90% 45% / 0.28), transparent 42%),
    linear-gradient(180deg, rgba(6,20,28,0.30) 0%, rgba(6,20,28,0.12) 34%, rgba(6,20,28,0.78) 100%); }
.hero-il-dots { position:absolute; inset:0; z-index:2; pointer-events:none; opacity:.10;
  background-image:radial-gradient(circle, #fff 1px, transparent 1px); background-size:22px 22px;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 55%); mask-image:linear-gradient(180deg,#000,transparent 55%); }
.hero-il-inner { position:relative; z-index:3; width:100%; padding-block:clamp(3rem,7vw,6rem); }
.hero-il h1 { color:#fff; max-width:16ch; text-shadow:0 2px 24px rgba(0,0,0,0.35); }
.hero-il .eyebrow { color:rgba(255,255,255,0.82); }
.hero-il-lede { color:rgba(255,255,255,0.9); font-size:clamp(1.06rem,1.6vw,1.3rem); line-height:1.55; max-width:46ch; margin-top:1.4rem; }
.hero-microline { margin-top:2rem; display:flex; gap:1rem 1.5rem; flex-wrap:wrap; align-items:center;
  color:#fff; font-family:var(--font-mono); font-size:.8rem; letter-spacing:.04em; }
.hero-microline .dot { opacity:.5; }
.hero-microline strong { font-weight:600; }
.hero-cta-row { margin-top:2rem; display:flex; gap:1rem; flex-wrap:wrap; align-items:center; }
.hero-arrow { color:#fff; opacity:.9; }

/* ---- Awards / trust strip ------------------------------- */
.awards-row { display:flex; align-items:center; justify-content:center; gap:clamp(1.5rem,5vw,4rem);
  flex-wrap:wrap; }
.award-badge { display:flex; flex-direction:column; align-items:center; gap:.5rem; text-align:center; }
.award-badge img { width:76px; height:76px; object-fit:contain; }
.award-badge span { font-family:var(--font-mono); font-size:.66rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); }
.trust-stat { text-align:center; }
.trust-stat b { display:block; font-family:var(--font-display); font-weight:700; font-size:1.9rem; color:var(--ink); line-height:1; letter-spacing:-0.02em; }
.trust-stat span { font-size:.8rem; color:var(--ink-3); }
.trust-div { width:1px; height:52px; background:var(--rule); }

/* ---- Color-block tab (flourish) ------------------------- */
.block-tab { display:inline-block; background:var(--accent); color:var(--on-accent);
  padding:.45rem 1.1rem .45rem 1.9rem; margin-left:-1.9rem; border-radius:0 var(--radius-pill) var(--radius-pill) 0;
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; }

/* ---- Pillars (why root-cause) --------------------------- */
.pillar-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.pillar { padding:1.75rem; border:1px solid var(--rule); border-radius:var(--radius-lg); background:var(--surface); }
.pillar-ic { width:48px; height:48px; display:flex; align-items:center; justify-content:center;
  border-radius:14px; background:var(--accent-soft); color:var(--accent-ink); margin-bottom:1.1rem; }
.pillar h3 { font-size:1.2rem; }
.pillar p { color:var(--ink-2); margin-top:.5rem; line-height:1.6; font-size:.96rem; }

/* ---- Treatments (services menu) ------------------------- */
.tx-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:0; margin-top:clamp(2rem,4vw,3rem);
  border-top:1px solid var(--rule); }
.tx-item { display:flex; gap:1rem; padding:1.35rem 0; border-bottom:1px solid var(--rule);
  align-items:flex-start; }
.tx-grid .tx-item:nth-child(odd) { padding-right:clamp(1rem,3vw,2.5rem); }
.tx-grid .tx-item:nth-child(even) { padding-left:clamp(1rem,3vw,2.5rem); border-left:1px solid var(--rule); }
.tx-num { font-family:var(--font-mono); font-size:.72rem; color:var(--accent-ink); padding-top:.3rem; letter-spacing:.05em; }
.tx-body h3 { font-size:1.12rem; }
.tx-body p { color:var(--ink-2); margin-top:.3rem; line-height:1.55; font-size:.92rem; }

/* ---- Zigjag (founders story) ---------------------------- */
.zigzag-row { display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(2rem,5vw,3.5rem); align-items:center; }
.zigzag-row .zigzag-image { grid-column:1/6; }
.zigzag-row .zigzag-text { grid-column:6/13; }
.founder-duo { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.5rem; }
.founder-duo figure { margin:0; }
.founder-duo img { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:var(--radius-lg); border:1px solid var(--rule); }
.founder-duo figcaption { margin-top:.5rem; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.05em;
  text-transform:uppercase; color:var(--ink-3); }

/* ---- Location ------------------------------------------- */
.location-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.location-hours-table { width:100%; border-collapse:collapse; }
.location-hours-table td { padding:.4rem 0; border-bottom:1px solid var(--rule); font-size:.9375rem; }
.location-hours-table td:first-child { font-weight:500; color:var(--ink); }
.location-hours-table td:last-child { text-align:right; font-family:var(--font-mono); font-size:.85rem; color:var(--ink-2); }
.insurance-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; margin-top:1rem; }
.insurance-badge { background:var(--bg); border:1px solid var(--rule); border-radius:var(--radius-sm);
  padding:.55rem .8rem; font-size:.82rem; font-weight:500; color:var(--ink-2); text-align:center; }

/* ---- Footer --------------------------------------------- */
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; }
.footer-col-label { font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; opacity:.55; }
.footer-link { font-size:.9375rem; color:var(--bg); opacity:.72; text-decoration:none; transition:opacity 150ms; }
.footer-link:hover { opacity:1; color:var(--bg); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  border-top:1px solid rgba(255,255,255,0.12); margin-top:clamp(2rem,4vw,3rem); padding:1.5rem 0; }

/* ---- Signature move: Spinal alignment scroll-rail ------- */
#spine-rail { position:fixed; right:1.5rem; top:50%; transform:translateY(-50%); z-index:80;
  display:flex; flex-direction:column; gap:6px; align-items:center; pointer-events:none; }
#spine-rail .vert { width:12px; height:12px; border-radius:4px; background:var(--rule);
  border:1px solid var(--rule); transition:background 260ms ease, box-shadow 260ms ease, width 260ms ease; }
#spine-rail .vert.on { background:var(--accent); border-color:var(--accent); width:18px;
  box-shadow:0 0 10px hsl(197 90% 45% / 0.55); }
#spine-rail .spine-label { writing-mode:vertical-rl; font-family:var(--font-mono); font-size:.58rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--ink-3); margin-top:.5rem; }
@media (max-width:1100px){ #spine-rail { display:none; } }

/* ---- Responsive collapses (page.css layer) -------------- */
@media (max-width:820px){
  .pillar-grid { grid-template-columns:1fr; }
  .tx-grid { grid-template-columns:1fr; }
  .tx-grid .tx-item:nth-child(even) { padding-left:0; border-left:none; }
  .tx-grid .tx-item:nth-child(odd) { padding-right:0; }
  .zigzag-row { display:flex; flex-direction:column; }
  .zigzag-row .zigzag-image { order:-1; }
  .location-grid { grid-template-columns:1fr; gap:2rem; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:2rem; }
  .insurance-grid { grid-template-columns:repeat(2,1fr); }
  .hero-il { min-height:auto; }
}
@media (max-width:520px){
  .footer-grid { grid-template-columns:1fr; }
  .awards-row .trust-div { display:none; }
  .founder-duo { grid-template-columns:1fr 1fr; }
}