/* insight-patient-center.css · Patient Center page only. 9/19.
   Loaded AFTER insight.css, insight-hero.css, insight-contact.css and insight-archive.css.
   Nothing in those four files is changed. Every rule here is new and scoped to .pc-*.

   CARLOS: five blocks. Jump row, numbered first-visit steps, hairline row lists,
   two-column plan list, scroll reveal. All of it is tokens, no new colors or fonts. */

/* anchors land clear of the fixed header (ink strip + white bar) */
.pc-anchor{scroll-margin-top:calc(var(--nav-h) + 64px)}
/* --pc-wall: the yellow-orange wall in the hero photograph, sampled from the lit face
   of the office wall (#F4C268) and taken one step deeper so it holds on white. */
.archive-page{--pc-wall:#E0A33C}
/* the jump band sits tight under the breadcrumb, not at full section rhythm */
.pc-jumpband{padding-block:clamp(26px,3vw,40px)}
html{scroll-behavior:smooth}

/* Book Now now lives in insight-book-button.css, loaded on every page. */

/* hero quote · same one-line treatment as Who We Serve, attribution inside the lede */
.c-intro--arc .arc-quote cite{font-style:normal}

/* ---- jump row · the afford-tile treatment with a title instead of a figure ---- */
.pc-jump{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;
  border-top:2px solid var(--ink);border-bottom:1px solid var(--hairline);
  list-style:none;margin:0;padding:0}
.pc-jump>li{display:contents}
.pc-tile{background:transparent;display:flex;flex-direction:column;gap:9px;height:100%;
  padding:28px clamp(12px,1.4vw,22px) 26px;box-sizing:border-box;text-decoration:none;
  border-left:1px solid var(--hairline);
  transition:background-color .18s ease,transform .18s ease}
.pc-jump>li:first-child .pc-tile{border-left:0}
.pc-tile__title{font-family:var(--display);font-weight:600;font-size:clamp(21px,1.75vw,26px);
  line-height:1.1;letter-spacing:.015em;color:var(--ink)}
.pc-tile__sub{font-family:var(--text);font-size:15px;line-height:1.5;color:var(--body);text-wrap:pretty}
/* 9/20 (Gary): the row has to read fast at rest, not only on rollover. A gold arrow sits
   in every tile at the baseline so the eye reads five things to go to, and it steps right
   on hover. CARLOS: plain span, no icon font. */
.pc-tile__go{margin-top:auto;padding-top:14px;font-family:var(--text);font-size:15px;
  font-weight:600;line-height:1;color:var(--accent-text);
  transition:color .18s ease,transform .18s ease}
.pc-tile:hover .pc-tile__go,.pc-tile:focus-visible .pc-tile__go{color:#E3D3B3;transform:translateX(5px)}
/* rollover: the ink fill the site uses everywhere else, cream title, soft white line */
.pc-tile:hover,.pc-tile:focus-visible{background:var(--ink)}
.pc-tile:hover .pc-tile__title,.pc-tile:focus-visible .pc-tile__title{color:#E3D3B3}
.pc-tile:hover .pc-tile__sub,.pc-tile:focus-visible .pc-tile__sub{color:var(--on-dark-soft)}
/* 9/20 (Gary): the direction line was too small to register on landing. Up to 17px with a
   gold rule beside it, so the band announces itself before the tiles are read. */
.pc-jumpdir{display:flex;align-items:center;gap:14px;font-family:var(--text);font-size:17px;
  font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);
  margin:0 0 18px}
.pc-jumpdir::after{content:"";flex:1;height:3px;background-image:radial-gradient(circle,var(--accent-text) 1.5px,transparent 1.6px);
  background-size:9px 3px;background-repeat:repeat-x;background-position:left center}
@media (max-width:1080px){
  .pc-jump{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc-jump>li:nth-child(odd) .pc-tile{border-left:0}
  .pc-jump>li:nth-child(n+3) .pc-tile{border-top:1px solid var(--hairline)}
}
@media (max-width:560px){
  .pc-jump{grid-template-columns:1fr}
  .pc-jump>li .pc-tile{border-left:0}
  .pc-jump>li:nth-child(n+2) .pc-tile{border-top:1px solid var(--hairline)}
}
@media (prefers-reduced-motion:reduce){.pc-tile,.pc-tile__go{transition:none}
  .pc-tile:hover .pc-tile__go{transform:none}html{scroll-behavior:auto}}

/* ---- section furniture · tighter than the .section default rhythm ---- */
.pc-sec{padding-block:clamp(40px,5vw,72px)}
/* the last block before the reviews band, whose own top padding carries the break */
.pc-sec--last{padding-bottom:clamp(20px,2.4vw,34px)}
.pc-sec .lede{max-width:68ch}
.pc-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
/* same button as Book Now in the header: #F7C86E, ink label, 6px corners, one size up */
.pc-actions .btn--primary{font-family:var(--brand-text);background:#F7C86E;color:var(--ink);
  border-color:#F7C86E;font-size:16px;font-weight:600;letter-spacing:.03em;
  padding:15px 26px;border-radius:6px}
.pc-actions .btn--primary:hover{background:#EFBB55;border-color:#EFBB55;color:var(--ink)}

/* ---- the seven steps · homepage day1 numerals plus one icon per step ---- */
.pc-steps{list-style:none;margin:28px 0 0;padding:0;
  border-top:1px solid var(--hairline)}
.pc-steps li{display:grid;grid-template-columns:48px minmax(0,1fr);
  gap:4px 14px;padding:20px 0;border-bottom:1px solid var(--hairline);align-items:start}
.pc-ic{grid-row:span 2;width:48px;font-size:26px;line-height:1.25;text-align:center;
  color:var(--icon-light);padding-top:2px}
.pc-steps h3{margin:0 0 3px;font-family:var(--text);font-size:18px;font-weight:600;
  letter-spacing:0;color:var(--ink)}
.pc-steps p{margin:0;font-size:16px;line-height:1.62;color:var(--body);max-width:68ch;text-wrap:pretty}
@media (max-width:560px){
  .pc-steps li{grid-template-columns:30px minmax(0,1fr);gap:4px 10px}
  .pc-ic{width:30px;font-size:19px}
}

/* ---- hairline row lists · payment options and forms ---- */
.pc-rows{list-style:none;margin:26px 0 0;padding:0;border-top:1px solid var(--hairline)}
.pc-rows li{padding:22px 0;border-bottom:1px solid var(--hairline)}
.pc-rows h3{margin:0 0 6px;font-family:var(--text);font-size:18px;font-weight:600;
  letter-spacing:0;color:var(--ink)}
.pc-rows h3 a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--hairline-strong)}
.pc-rows h3 a:hover{color:var(--accent-text);text-decoration-color:currentColor}
.pc-rows p{margin:0;font-size:16px;line-height:1.65;color:var(--body);max-width:72ch;text-wrap:pretty}
.pc-rows--forms li{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.pc-rows--forms h3{margin:0}
.pc-pdf{font-family:var(--text);font-size:12px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent-text);white-space:nowrap}

/* ChiroHealthUSA terms · same disclosure control as the homepage Paying for care section */
.pc-terms{margin-top:26px;padding-top:22px;border-top:1px solid var(--hairline)}

/* ---- insurance plans · two columns on desktop, one at 375 ---- */
.pc-plans{list-style:none;margin:26px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,4vw,64px);
  border-top:1px solid var(--hairline)}
.pc-plans li{padding:16px 2px;border-bottom:1px solid var(--hairline);
  font-size:17px;line-height:1.5;color:var(--ink);text-wrap:pretty}
@media (max-width:640px){.pc-plans{grid-template-columns:1fr}}
.pc-plans-note{margin:24px 0 0;font-size:16px;line-height:1.6;color:var(--body);max-width:62ch}
.pc-plans-note a{font-weight:600;color:var(--accent-text)}

/* ---- scroll reveal · the afford pattern, js-gated and reduced-motion safe ---- */
.js .pc-reveal{opacity:0}
.pc-reveal.pc-in{opacity:1;animation:pc-rise .6s cubic-bezier(.2,.7,.2,1) backwards}
@keyframes pc-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .js .pc-reveal{opacity:1;animation:none}
  .pc-reveal.pc-in{animation:none}
}