/* ============================================================
   Hogan High-Net-Worth Divorce Law  -  Mark Hogan, Charlotte NC
   Direction: discreet luxury / private-client editorial.
   Warm near-black + champagne gold + ivory. Cormorant Garamond
   display, Jost UI. Hairline rules, serif numerals, dark-dominant
   hero. 100% distinct from every prior build.
   ============================================================ */

:root{
  --espresso:  #17130D;   /* warm near-black ground       */
  --espresso-2:#1F1A12;   /* dark surface / cards         */
  --char:      #2A2318;   /* lighter dark panel           */
  --ivory:     #F4EFE4;   /* light ground / text on dark  */
  --bone:      #EBE4D4;   /* light panel                  */
  --paper:     #F6F2E9;   /* lightest                     */
  --gold:      #C2A35B;   /* champagne gold accent        */
  --gold-2:    #D8BE84;   /* lighter gold (on dark)       */
  --gold-d:    #9C7E38;   /* gold for links on light      */
  --ink:       #1A150E;   /* headings on light            */
  --text:      #4B4536;   /* body on light                */
  --muted:     #8A8270;   /* muted on light               */
  --on-dark:   #EDE7D9;   /* body on dark                 */
  --muted-dark:rgba(237,231,217,.66);
  --line:      #E0D8C5;   /* hairline on light            */
  --line-2:    #EAE3D4;
  --line-dark: rgba(237,231,217,.16);

  --display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --ui: 'Jost', system-ui, -apple-system, sans-serif;

  --maxw: 1220px;
  --gut: clamp(22px, 5.5vw, 80px);
  --r: 3px;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
@media(prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
body{ margin:0; background:var(--paper); color:var(--text);
  font-family:var(--ui); font-size:16.5px; font-weight:300; line-height:1.72; letter-spacing:.005em;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
img{ max-width:100%; display:block; }
a{ color:var(--gold-d); }
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gut); }
.section{ padding-block:clamp(64px,10vw,128px); }
:focus-visible{ outline:2px solid var(--gold); outline-offset:4px; }
.skip{ position:absolute; left:-999px; }
.skip:focus{ left:14px; top:14px; background:var(--espresso); color:var(--ivory); padding:.6rem 1rem; z-index:200; }

h1,h2,h3,h4{ font-family:var(--display); color:var(--ink); font-weight:500; line-height:1.07; letter-spacing:-.005em; margin:0; }

/* eyebrow / labels */
.eyebrow{ font-family:var(--ui); font-weight:500; font-size:.7rem; letter-spacing:.32em; text-transform:uppercase; color:var(--gold-d); }
.eyebrow.on-dark{ color:var(--gold-2); }
.rule{ width:54px; height:1px; background:var(--gold); margin:1.5rem 0; border:0; }
.rule.center{ margin-inline:auto; }
.lead{ font-family:var(--ui); font-weight:300; font-size:1.18rem; line-height:1.7; color:var(--text); }
.lead.on-dark{ color:var(--muted-dark); }

/* buttons */
.btn{ display:inline-flex; align-items:center; gap:.7rem; font-family:var(--ui); font-weight:500; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase;
  padding:1.05rem 2rem; border:1px solid transparent; border-radius:var(--r); text-decoration:none; cursor:pointer; transition:background .25s, color .25s, border-color .25s; }
.btn-gold{ background:var(--gold); color:var(--espresso); }
.btn-gold:hover{ background:var(--gold-2); }
.btn-dark{ background:var(--espresso); color:var(--ivory); }
.btn-dark:hover{ background:var(--char); }
.btn-line{ border-color:var(--ink); color:var(--ink); background:transparent; }
.btn-line:hover{ background:var(--ink); color:var(--ivory); }
.btn-line-gold{ border-color:var(--gold); color:var(--gold-2); background:transparent; }
.btn-line-gold:hover{ background:var(--gold); color:var(--espresso); }
.btn-line-light{ border-color:rgba(237,231,217,.4); color:var(--ivory); background:transparent; }
.btn-line-light:hover{ background:var(--ivory); color:var(--espresso); }

/* ================= HEADER ================= */
.masthead{ position:absolute; top:0; left:0; right:0; z-index:90; }
.masthead.solid{ position:sticky; background:rgba(23,19,13,.86); backdrop-filter:blur(10px); border-bottom:1px solid var(--line-dark); }
.mast-row{ display:flex; align-items:center; justify-content:space-between; gap:1.4rem; min-height:92px; }
.brand{ display:flex; align-items:center; gap:.85rem; text-decoration:none; }
.brand .seal{ width:44px; height:44px; border:1px solid var(--gold); border-radius:50%; display:grid; place-items:center; flex:none;
  font-family:var(--display); font-weight:600; font-size:1.25rem; color:var(--gold-2); }
.brand .bt{ line-height:1.1; }
.brand .bt .nm{ font-family:var(--display); font-weight:600; font-size:1.4rem; letter-spacing:.01em; color:var(--ivory); display:block; }
.brand .bt .sub{ font-family:var(--ui); font-weight:400; font-size:.6rem; letter-spacing:.28em; text-transform:uppercase; color:var(--gold-2); margin-top:2px; }
.masthead.solid .brand .bt .nm{ color:var(--ivory); }
.mast-nav{ display:flex; align-items:center; gap:2.2rem; }
.mast-nav .links{ display:flex; align-items:center; gap:2.1rem; list-style:none; margin:0; padding:0; }
.mast-nav .links > li{ position:relative; }
.mast-nav .links > li > a{ font-family:var(--ui); font-weight:400; font-size:.76rem; letter-spacing:.18em; text-transform:uppercase; color:var(--on-dark); text-decoration:none; padding:.3rem 0; transition:color .2s; }
.mast-nav .links > li > a:hover, .mast-nav .links > li:focus-within > a{ color:var(--gold-2); }
.has-sub > a::after{ content:"+"; margin-left:.5rem; color:var(--gold); font-weight:400; }
.submenu{ position:absolute; top:100%; left:-1.4rem; min-width:300px; background:var(--espresso-2); border:1px solid var(--line-dark);
  padding:.6rem; list-style:none; margin:1rem 0 0; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .2s, transform .2s, visibility .2s; box-shadow:0 30px 60px -30px rgba(0,0,0,.7); }
.has-sub:hover .submenu, .has-sub:focus-within .submenu{ opacity:1; visibility:visible; transform:none; }
.submenu a{ display:block; font-family:var(--ui); font-size:.82rem; letter-spacing:.04em; color:var(--on-dark); text-decoration:none; padding:.65rem .85rem; transition:background .15s, color .15s; }
.submenu a:hover{ background:var(--char); color:var(--gold-2); }
.mast-cta{ font-family:var(--ui); font-weight:500; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--espresso); background:var(--gold); padding:.85rem 1.5rem; text-decoration:none; border-radius:var(--r); transition:background .2s; }
.mast-cta:hover{ background:var(--gold-2); }
.nav-toggle{ display:none; background:none; border:0; color:var(--ivory); cursor:pointer; padding:.3rem; }
.nav-toggle svg{ width:30px; height:30px; }
@media(max-width:1020px){
  .nav-toggle{ display:inline-flex; }
  .mast-nav{ position:fixed; inset:92px 0 auto 0; flex-direction:column; align-items:stretch; gap:0; background:var(--espresso);
    border-bottom:1px solid var(--line-dark); padding:1rem var(--gut) 2.4rem; max-height:calc(100vh - 92px); overflow:auto;
    transform:translateY(-10px); opacity:0; visibility:hidden; transition:opacity .25s, transform .25s, visibility .25s; }
  body.nav-open .mast-nav{ transform:none; opacity:1; visibility:visible; }
  .mast-nav .links{ flex-direction:column; align-items:stretch; gap:0; }
  .mast-nav .links > li{ border-bottom:1px solid var(--line-dark); }
  .mast-nav .links > li > a{ display:block; padding:1.1rem 0; font-size:.95rem; }
  .has-sub > a::after{ display:none; }
  .submenu{ position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0; background:transparent; padding:0 0 1rem 1rem; min-width:0; margin:0; }
  .submenu a{ padding:.5rem 0; }
  .mast-cta{ margin-top:1.4rem; text-align:center; }
}

/* ================= HERO (dark, luxury) ================= */
.hero{ position:relative; background:var(--espresso); color:var(--ivory); overflow:hidden; }
.hero::before{ content:""; position:absolute; inset:0; background:radial-gradient(120% 80% at 80% -10%, rgba(194,163,91,.13), transparent 60%); pointer-events:none; }
.hero .wrap{ position:relative; padding-block:clamp(150px,18vw,210px) clamp(64px,9vw,110px); }
.hero-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(40px,6vw,90px); align-items:center; }
@media(max-width:900px){ .hero-grid{ grid-template-columns:1fr; } }
.hero h1{ color:var(--ivory); font-size:clamp(2.9rem,6.4vw,5.2rem); font-weight:500; line-height:1.02; letter-spacing:-.01em; margin:1.4rem 0 0; }
.hero h1 em{ font-style:italic; color:var(--gold-2); }
.hero .lead{ margin:1.8rem 0 0; max-width:44ch; }
.hero-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.6rem; margin-top:2.4rem; }
.hero-actions .ph{ font-family:var(--display); font-weight:600; font-size:1.5rem; color:var(--ivory); text-decoration:none; letter-spacing:.01em; }
.hero-actions .ph:hover{ color:var(--gold-2); }
.hero-portrait{ position:relative; justify-self:center; max-width:430px; width:100%; }
.hero-portrait .pf{ position:relative; aspect-ratio:4/5; overflow:hidden; border:1px solid var(--gold); z-index:2; }
.hero-portrait .pf img{ width:100%; height:100%; object-fit:cover; filter:saturate(.92) contrast(1.02); }
.hero-portrait::after{ content:""; position:absolute; right:-16px; bottom:-16px; left:24px; top:24px; border:1px solid var(--line-dark); z-index:1; }
.hero-portrait .cap{ position:absolute; left:0; right:0; bottom:0; z-index:3; background:linear-gradient(to top, rgba(23,19,13,.92), transparent); padding:1.6rem 1.4rem .9rem; }
.hero-portrait .cap b{ font-family:var(--display); font-weight:600; font-size:1.3rem; color:var(--ivory); display:block; }
.hero-portrait .cap span{ font-family:var(--ui); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-2); }

/* credentials rule under hero */
.creds-strip{ background:var(--espresso-2); border-top:1px solid var(--line-dark); }
.creds-strip .wrap{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.6rem 3rem; padding-block:1.7rem; }
.creds-strip .ci{ text-align:center; }
.creds-strip .ci b{ font-family:var(--display); font-weight:600; font-size:1.35rem; color:var(--gold-2); display:block; line-height:1; }
.creds-strip .ci span{ font-family:var(--ui); font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted-dark); }
.creds-strip .dot{ width:4px; height:4px; border-radius:50%; background:var(--gold); opacity:.6; }
@media(max-width:680px){ .creds-strip .dot{ display:none; } }

/* ================= SECTION HEADINGS ================= */
.sec-head{ max-width:60ch; }
.sec-head.center{ margin-inline:auto; text-align:center; }
.sec-head h2{ font-size:clamp(2.3rem,4.6vw,3.5rem); font-weight:500; margin:.8rem 0 0; }
.sec-head .lead{ margin-top:1.2rem; }
.sec-head.center .rule{ margin-inline:auto; }

/* ================= PRACTICE (editorial list w/ serif numerals) ================= */
.practice-list{ margin-top:clamp(32px,4vw,56px); border-top:1px solid var(--line); }
.pr{ display:grid; grid-template-columns:auto 1fr auto; gap:clamp(18px,3vw,48px); align-items:center; padding:clamp(22px,3vw,34px) 0; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink); transition:padding-left .3s, background .3s; }
.pr:hover{ padding-left:14px; background:linear-gradient(90deg, rgba(194,163,91,.06), transparent 40%); }
.pr .no{ font-family:var(--display); font-weight:500; font-size:2.1rem; color:var(--gold-d); line-height:1; width:2.4ch; }
.pr .tx h3{ font-size:clamp(1.4rem,2.4vw,1.9rem); font-weight:500; margin:0 0 .25rem; }
.pr .tx p{ font-family:var(--ui); font-size:.92rem; color:var(--muted); margin:0; max-width:62ch; }
.pr .arw{ font-family:var(--ui); color:var(--gold-d); font-size:1.4rem; opacity:0; transform:translateX(-8px); transition:opacity .3s, transform .3s; }
.pr:hover .arw{ opacity:1; transform:none; }
@media(max-width:640px){ .pr{ grid-template-columns:auto 1fr; } .pr .arw{ display:none; } }

/* ================= ON-DARK SECTION ================= */
.dark{ background:var(--espresso); color:var(--on-dark); }
.dark h2, .dark h3, .dark h4{ color:var(--ivory); }
.dark .lead{ color:var(--muted-dark); }

/* ================= BIO ================= */
.bio .wrap{ display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(36px,6vw,80px); align-items:start; }
@media(max-width:900px){ .bio .wrap{ grid-template-columns:1fr; } }
.bio-portrait{ position:relative; }
.bio-portrait .pf{ aspect-ratio:4/5; overflow:hidden; border:1px solid var(--gold); }
.bio-portrait .pf img{ width:100%; height:100%; object-fit:cover; }
.bio h2{ font-size:clamp(2.1rem,4vw,3rem); }
.bio p{ margin:1.1rem 0 0; }
.cred-cols{ margin-top:2.2rem; display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(24px,3vw,44px); }
@media(max-width:560px){ .cred-cols{ grid-template-columns:1fr; } }
.cred-cols .cc{ border-top:1px solid var(--line); padding:1.2rem 0; }
.cred-cols .cc h4{ font-family:var(--ui); font-weight:500; font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-d); margin:0 0 .7rem; }
.cred-cols .cc ul{ list-style:none; margin:0; padding:0; display:grid; gap:.45rem; }
.cred-cols .cc li{ font-family:var(--ui); font-size:.88rem; color:var(--text); line-height:1.5; }

/* ================= APPROACH / DISCRETION ================= */
.statement .wrap{ max-width:50ch; text-align:center; margin-inline:auto; }
.statement .big{ font-family:var(--display); font-weight:500; font-style:italic; font-size:clamp(1.8rem,3.6vw,2.8rem); line-height:1.28; color:var(--ivory); }
.statement .big b{ font-style:normal; font-weight:500; color:var(--gold-2); }

/* ================= COLLABORATION (Krispen) ================= */
.collab .wrap{ display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(36px,5vw,72px); align-items:center; }
@media(max-width:860px){ .collab .wrap{ grid-template-columns:1fr; } }
.collab h2{ font-size:clamp(2rem,3.8vw,2.9rem); }
.collab .quote{ font-family:var(--display); font-weight:500; font-style:italic; font-size:clamp(1.5rem,2.6vw,2rem); line-height:1.34; color:var(--ink); margin:1.6rem 0; padding-left:1.6rem; border-left:2px solid var(--gold); }
.collab .who{ font-family:var(--ui); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.collab p{ margin:1rem 0 0; }
.collab p a{ color:var(--gold-d); font-weight:500; }
.collab-card{ background:var(--paper); border:1px solid var(--line); padding:clamp(26px,3vw,40px); }
.collab-card .eyebrow{ display:block; margin-bottom:1rem; }
.collab-card .nm{ font-family:var(--display); font-weight:600; font-size:1.7rem; color:var(--ink); }
.collab-card .ro{ font-family:var(--ui); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-d); margin:.4rem 0 1.4rem; }
.collab-card p{ font-family:var(--ui); font-size:.92rem; color:var(--text); margin:0 0 1.6rem; }
.collab-card .btn{ width:100%; justify-content:center; }

/* ================= CTA ================= */
.cta{ background:var(--espresso); color:var(--ivory); text-align:center; }
.cta h2{ color:var(--ivory); font-size:clamp(2.3rem,5vw,3.6rem); font-weight:500; max-width:18ch; margin:0 auto; }
.cta .lead{ color:var(--muted-dark); max-width:48ch; margin:1.4rem auto 0; }
.cta-actions{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-top:2.4rem; }
.cta .fine{ font-family:var(--ui); margin-top:2rem; font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-dark); }

/* ================= INTERIOR ================= */
.page-hero{ background:var(--espresso); color:var(--ivory); }
.page-hero .wrap{ padding-block:clamp(140px,16vw,180px) clamp(40px,6vw,66px); }
.breadcrumb{ font-family:var(--ui); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-dark); }
.breadcrumb a{ color:var(--muted-dark); text-decoration:none; }
.breadcrumb a:hover{ color:var(--gold-2); }
.breadcrumb span{ color:var(--gold); margin-inline:.5rem; }
.page-hero h1{ color:var(--ivory); font-size:clamp(2.4rem,5vw,3.8rem); font-weight:500; margin:1.1rem 0 0; max-width:20ch; }
.page-hero .lead{ color:var(--muted-dark); margin-top:1.3rem; max-width:60ch; }

.layout{ display:grid; grid-template-columns:1fr 300px; gap:clamp(40px,5vw,72px); }
@media(max-width:960px){ .layout{ grid-template-columns:1fr; } }
.prose{ max-width:70ch; }
.prose > :first-child{ margin-top:0; }
.prose h2{ font-size:clamp(1.7rem,3vw,2.3rem); font-weight:500; margin:2.6rem 0 .7rem; }
.prose h3{ font-family:var(--display); font-size:1.4rem; font-weight:600; margin:1.9rem 0 .5rem; color:var(--ink); }
.prose p{ margin:0 0 1.15rem; }
.prose ul{ margin:0 0 1.35rem; padding:0; list-style:none; display:grid; gap:.6rem; }
.prose ul li{ display:flex; gap:.85rem; }
.prose ul li::before{ content:""; flex:none; width:7px; height:1px; margin-top:.85rem; background:var(--gold); }
.prose a{ color:var(--gold-d); font-weight:500; }
.prose strong{ color:var(--ink); font-weight:500; }
.callout{ border-top:1px solid var(--gold); border-bottom:1px solid var(--gold); padding:1.4rem 0; margin:1.8rem 0; font-family:var(--ui); }
.callout strong{ font-family:var(--display); font-style:italic; font-weight:600; font-size:1.15rem; color:var(--ink); display:block; margin-bottom:.4rem; }
.tags-row{ display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.8rem; }
.tag{ font-family:var(--ui); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-d); border:1px solid var(--line); padding:.4rem .8rem; }

.aside{ position:sticky; top:120px; align-self:start; }
.aside-card{ border:1px solid var(--line); padding:1.6rem; margin-bottom:1.4rem; background:var(--paper); }
.aside-card h4{ font-family:var(--ui); font-weight:500; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-d); margin:0 0 1rem; }
.aside-card ul{ list-style:none; margin:0; padding:0; display:grid; gap:.7rem; }
.aside-card a{ font-family:var(--ui); font-size:.9rem; color:var(--text); text-decoration:none; }
.aside-card a:hover{ color:var(--gold-d); }
.aside-cta{ background:var(--espresso); color:var(--on-dark); padding:1.7rem; }
.aside-cta h4{ color:var(--ivory); font-family:var(--display); font-weight:600; font-size:1.4rem; margin:0 0 .5rem; letter-spacing:0; text-transform:none; }
.aside-cta p{ font-family:var(--ui); font-size:.86rem; color:var(--muted-dark); margin:0 0 1.2rem; }
.aside-cta a.tel{ font-family:var(--display); font-weight:600; font-size:1.5rem; color:var(--gold-2); text-decoration:none; }

/* ================= CONTACT ================= */
.contact-grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(36px,5vw,68px); }
@media(max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-info .ln{ border-top:1px solid var(--line); padding:1.1rem 0; }
.contact-info .ln h4{ font-family:var(--ui); font-weight:500; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-d); margin:0 0 .3rem; }
.contact-info .ln p{ margin:0; color:var(--ink); font-size:1.05rem; }
.contact-info .ln a{ color:var(--ink); text-decoration:none; }
.contact-info .ln a:hover{ color:var(--gold-d); }
.form{ border:1px solid var(--line); padding:clamp(26px,3vw,40px); background:var(--paper); }
.field{ margin-bottom:1.1rem; }
.field label{ display:block; font-family:var(--ui); font-weight:500; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); margin-bottom:.5rem; }
.field input, .field select, .field textarea{ width:100%; font-family:var(--ui); font-size:1rem; font-weight:300; color:var(--ink);
  background:#FFFDF8; border:1px solid var(--line); border-radius:var(--r); padding:.85rem .95rem; }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--gold); }
.field textarea{ min-height:130px; resize:vertical; }
.hp{ position:absolute; left:-9999px; }

/* ================= FOOTER ================= */
.site-footer{ background:var(--espresso); color:var(--on-dark); padding-block:clamp(56px,7vw,88px) 2.4rem; border-top:1px solid var(--line-dark); }
.foot-grid{ display:grid; grid-template-columns:1.8fr 1fr 1fr; gap:clamp(28px,4vw,56px); }
@media(max-width:760px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:500px){ .foot-grid{ grid-template-columns:1fr; } }
.foot-brand .seal{ width:46px; height:46px; border:1px solid var(--gold); border-radius:50%; display:grid; place-items:center; font-family:var(--display); font-weight:600; font-size:1.3rem; color:var(--gold-2); margin-bottom:1.1rem; }
.foot-brand .nm{ font-family:var(--display); font-weight:600; font-size:1.5rem; color:var(--ivory); }
.foot-brand p{ font-family:var(--ui); color:var(--muted-dark); font-size:.88rem; margin:.9rem 0 .3rem; max-width:36ch; line-height:1.65; }
.foot-col h5{ font-family:var(--ui); font-weight:500; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-2); margin:.3rem 0 1.1rem; }
.foot-col a{ display:block; font-family:var(--ui); color:var(--muted-dark); text-decoration:none; font-size:.9rem; margin-bottom:.6rem; }
.foot-col a:hover{ color:var(--ivory); }
.legal{ margin-top:clamp(36px,5vw,56px); padding-top:1.6rem; border-top:1px solid var(--line-dark); font-family:var(--ui); font-size:.76rem; color:var(--muted-dark); line-height:1.7; }
.legal .row{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem; letter-spacing:.1em; text-transform:uppercase; font-size:.68rem; }

/* motion */
.reveal{ transition:opacity .8s ease, transform .8s ease; }
.js .reveal{ opacity:0; transform:translateY(22px); }
.reveal.in{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .js .reveal{ opacity:1!important; transform:none!important; transition:none; }
  .pr:hover{ padding-left:0; }
}