/* Dr Chang Fu Shi · Legal pages · shared stylesheet
   Palette and type to match the editorial site (drchangfushi.com).
   No left-side accents on cards (house rule). */

:root{
  --page:          oklch(95% 0.008 72);
  --greige:        oklch(85% 0.014 68);
  --greige-soft:   oklch(88% 0.011 70);
  --cream:         oklch(92% 0.014 70);
  --ink:           oklch(22% 0.010 58);
  --ink-soft:      oklch(42% 0.010 58);
  --ink-mute:      oklch(58% 0.010 60);
  --taupe:         oklch(52% 0.028 62);
  --taupe-light:   oklch(74% 0.018 65);
  --oxblood:       oklch(36% 0.095 30);
  --oxblood-hover: oklch(30% 0.095 30);
  --hairline:      oklch(22% 0.010 58 / .10);
  --hairline-dim:  oklch(22% 0.010 58 / .06);
  --hairline-ink:  oklch(95% 0.010 70 / .14);
  --ease:          cubic-bezier(0.23, 1, 0.32, 1);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{
  font-family:'Source Serif 4','Source Serif Pro','Georgia',serif;
  font-optical-sizing:auto;
  font-weight:400;
  color:var(--ink-soft);
  background:var(--page);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.7;
  overflow-x:hidden;
}

h1,h2,h3,h4{
  font-family:'Libre Caslon Text','Caslon','Garamond','Georgia',serif;
  font-weight:400;
  line-height:1.15;
  letter-spacing:-.012em;
  color:var(--ink);
  text-wrap:balance;
}
::selection{background:var(--taupe);color:var(--page)}
:focus-visible{outline:2px solid var(--oxblood);outline-offset:3px;border-radius:4px}

.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:2000}
.skip-link:focus{
  left:16px;top:16px;width:auto;height:auto;
  padding:10px 18px;background:var(--ink);color:var(--page);
  border-radius:4px;
  font-family:'Marcellus SC',serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  text-decoration:none;
}

.container{max-width:1200px;margin:0 auto;padding:0 clamp(24px,5vw,48px)}

/* Nav, matching the main site's hairline rhythm */
.legal-nav{
  position:sticky;top:0;z-index:50;
  background:oklch(95% 0.008 72 / .92);
  backdrop-filter:saturate(180%) blur(16px);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--hairline);
  padding:22px 0;
}
.legal-nav__inner{
  max-width:1320px;margin:0 auto;
  padding:0 clamp(24px,5vw,48px);
  display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
}
.legal-nav__logo{
  font-family:'Libre Caslon Text','Caslon','Garamond','Georgia',serif;
  font-size:21px;font-weight:500;letter-spacing:.002em;
  color:var(--ink);text-decoration:none;line-height:1;white-space:nowrap;
}
.legal-nav__back{
  font-family:'Marcellus SC',serif;
  font-size:11px;font-weight:400;letter-spacing:.26em;text-transform:uppercase;
  color:var(--ink-soft);text-decoration:none;
  transition:color 220ms var(--ease);
  display:inline-flex;align-items:center;gap:10px;
}
.legal-nav__back:hover{color:var(--oxblood)}
.legal-nav__back::before{
  content:'';width:24px;height:1px;background:currentColor;opacity:.6;
  transition:width 280ms var(--ease);
}
.legal-nav__back:hover::before{width:32px}

/* Document */
.legal{padding:clamp(64px,10vh,96px) 0 clamp(80px,12vh,128px);background:var(--page)}
.legal__wrap{max-width:760px;margin:0 auto}

.legal__kicker{
  font-family:'Marcellus SC',serif;
  font-size:11.5px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--taupe);
  margin-bottom:24px;
  display:inline-flex;align-items:center;gap:14px;line-height:1;
}
.legal__kicker::before{content:'';width:32px;height:1px;background:currentColor;opacity:.55}

.legal h1{
  font-family:'Libre Caslon Text','Caslon','Garamond','Georgia',serif;
  font-weight:300;
  font-size:clamp(44px,5.6vw,72px);
  line-height:1.02;
  letter-spacing:-.022em;
  color:var(--ink);
  margin-bottom:24px;
}
.legal__meta{
  font-family:'Source Serif 4',serif;
  font-size:13.5px;line-height:1.6;
  color:var(--ink-mute);
  margin-bottom:48px;
  padding-bottom:32px;
  border-bottom:1px solid var(--hairline);
  display:flex;flex-wrap:wrap;gap:6px 24px;
  font-style:italic;
}
.legal__meta strong{color:var(--ink-soft);font-weight:500;font-style:normal}

/* Notice card · top-bordered, no left accent (per house rule) */
.legal__notice{
  background:var(--cream);
  border-top:1px solid var(--hairline);
  padding:28px 32px;
  margin-bottom:56px;
  font-family:'Source Serif 4',serif;
  font-size:15.5px;line-height:1.75;
  color:var(--ink-soft);
  font-style:italic;
}
.legal__notice strong{
  font-family:'Marcellus SC',serif;
  font-size:11px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--taupe);
  font-weight:400;font-style:normal;
  display:block;margin-bottom:10px;
}

/* Headings inside the document */
.legal h2{
  font-family:'Libre Caslon Text','Caslon','Garamond','Georgia',serif;
  font-weight:400;
  font-size:clamp(24px,2.6vw,32px);
  line-height:1.15;
  letter-spacing:-.012em;
  margin:64px 0 20px;
  padding-top:8px;
  color:var(--ink);
}
.legal h2::before{
  content:'';display:block;
  width:32px;height:1px;background:var(--taupe);
  margin-bottom:22px;opacity:.7;
}
.legal h3{
  font-family:'Marcellus SC',serif;
  font-size:11.5px;font-weight:400;letter-spacing:.28em;text-transform:uppercase;
  color:var(--taupe);
  margin:32px 0 12px;
}

.legal p{
  font-family:'Source Serif 4',serif;
  font-size:16px;line-height:1.78;
  color:var(--ink-soft);
  margin-bottom:18px;
}
.legal ul,.legal ol{margin:14px 0 22px;padding-left:24px}
.legal li{
  font-family:'Source Serif 4',serif;
  font-size:16px;line-height:1.78;
  color:var(--ink-soft);
  margin-bottom:10px;
}
.legal strong{color:var(--ink);font-weight:500}
.legal em{color:var(--taupe);font-style:italic}

.legal a{
  color:var(--oxblood);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  transition:color 200ms var(--ease);
}
.legal a:hover{color:var(--oxblood-hover)}

/* Tables (cookies page) */
.legal table{
  width:100%;border-collapse:collapse;
  margin:22px 0 30px;
  font-family:'Source Serif 4',serif;
  font-size:14.5px;line-height:1.6;
}
.legal th,.legal td{
  text-align:left;padding:14px 16px;
  border-bottom:1px solid var(--hairline);
  vertical-align:top;color:var(--ink-soft);
}
.legal th{
  font-family:'Marcellus SC',serif;
  font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--taupe);font-weight:400;
  background:var(--cream);
  border-top:1px solid var(--hairline);
}

/* Contact card · no left bar */
.legal__contact{
  background:var(--cream);
  padding:28px 32px;
  margin-top:32px;
  border-top:1px solid var(--hairline);
}
.legal__contact p{margin-bottom:6px;font-size:15px;line-height:1.65}
.legal__contact p:last-child{margin-bottom:0}
.legal__contact p:first-child strong{
  font-family:'Libre Caslon Text','Caslon','Garamond','Georgia',serif;
  font-size:21px;font-weight:500;color:var(--ink);
  letter-spacing:-.005em;
}

.legal__see-also{
  margin-top:40px;
  font-family:'Marcellus SC',serif;
  font-size:11px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--ink-mute);
}
.legal__see-also a{
  color:var(--ink-soft);
  text-decoration:none;
  border-bottom:1px solid var(--hairline);
  padding-bottom:2px;
  transition:border-color 220ms var(--ease),color 220ms var(--ease);
}
.legal__see-also a:hover{color:var(--oxblood);border-color:var(--oxblood)}

/* Footer · matches main site */
.footer{
  background:var(--ink);
  color:oklch(95% 0.010 70 / .66);
  padding:88px 0 48px;
}
.footer__inner{
  max-width:1320px;margin:0 auto;
  padding:0 clamp(24px,5vw,48px);
  display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:64px;
}
.footer__brand{
  font-family:'Libre Caslon Text','Caslon','Garamond','Georgia',serif;
  font-size:28px;color:var(--page);
  letter-spacing:-.005em;
  text-decoration:none;
  display:inline-block;margin-bottom:12px;
}
.footer__tagline{
  font-family:'Source Serif 4',serif;
  font-size:14px;max-width:320px;line-height:1.7;
  color:oklch(95% 0.010 70 / .5);
  font-weight:400;font-style:italic;
  margin-top:10px;
}
.footer__col h5{
  font-family:'Marcellus SC',serif;
  font-size:10.5px;font-weight:400;letter-spacing:.28em;text-transform:uppercase;
  color:var(--taupe-light);
  margin-bottom:22px;
}
.footer__col a{
  display:block;
  font-family:'Source Serif 4',serif;
  font-size:15px;color:oklch(95% 0.010 70 / .7);
  text-decoration:none;margin-bottom:12px;
  transition:color 220ms var(--ease);
}
.footer__col a:hover{color:var(--page)}
.footer__col a[aria-current="page"]{color:var(--taupe-light)}

.footer__disclaimer{
  max-width:1320px;margin:48px auto 0;
  padding:24px clamp(24px,5vw,48px) 28px;
  border-top:1px solid var(--hairline-ink);
  font-family:'Source Serif 4',serif;
  font-size:13px;line-height:1.75;
  color:oklch(95% 0.010 70 / .42);
  font-weight:400;font-style:italic;
}
.footer__bottom{
  max-width:1320px;margin:0 auto;
  padding:20px clamp(24px,5vw,48px) 0;
  border-top:1px solid var(--hairline-ink);
  display:flex;flex-wrap:wrap;gap:8px 20px;
  justify-content:space-between;align-items:center;
  font-family:'Marcellus SC',serif;
  font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:oklch(95% 0.010 70 / .42);
}
.footer__bottom a{color:oklch(95% 0.010 70 / .55);text-decoration:none}
.footer__bottom a:hover{color:var(--page)}
.footer__entity{font-size:10.5px;color:oklch(95% 0.010 70 / .3);letter-spacing:.24em}

@media(max-width:820px){
  .legal{padding:48px 0 72px}
  .legal__notice,.legal__contact{padding:22px 24px}
  .footer__inner{grid-template-columns:1fr;gap:36px}
  .footer__bottom{flex-direction:column;align-items:flex-start;gap:8px;text-align:left}
}