/* Perk & Chipper v4 — institutional editorial. Palette: Engraver's Black, Bone, Silver Leaf, Pewter, Stone, Ash. Inter UI; Libre Bodoni display. */
@font-face{font-family:"Inter";src:url("../fonts/Inter-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/Inter-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/Inter-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Libre Bodoni";src:url("../fonts/LibreBodoni-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Libre Bodoni";src:url("../fonts/LibreBodoni-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("../fonts/IBMPlexMono-Regular.woff2") format("woff2");font-weight:400;font-display:swap}

:root{
  --black:#111111;--bone:#F4F1EA;--silver:#A8A9AD;--pewter:#3A3A3C;--stone:#6E6C68;--ash:#D8D5CC;
  --line:#2a2a2b;--line-bone:#d0cdc4;
  --sans:"Inter",Arial,Helvetica,sans-serif;
  --serif:"Libre Bodoni","Times New Roman",Times,serif;
  --mono:"Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --wrap:78rem;--measure:42rem;--gutter:clamp(1.5rem,5vw,4rem);
  --ease:cubic-bezier(.22,.7,.15,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--bone);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;font-weight:400;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:underline;text-decoration-color:var(--stone);text-underline-offset:.22em;text-decoration-thickness:1px;transition:text-decoration-color .2s}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--bone);outline-offset:3px}
.bone :focus-visible{outline-color:var(--black)}
p{margin:0 0 1.15em}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:400;letter-spacing:-.02em;line-height:1.05}
h1{font-size:clamp(3.25rem,8.2vw,7.25rem);letter-spacing:-.03em;line-height:.98}
h2{font-size:clamp(2.35rem,4.8vw,4.25rem);max-width:16ch}
h3{font-size:clamp(1.45rem,2.2vw,1.85rem);letter-spacing:-.015em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-999px;top:0;background:var(--bone);color:var(--black);padding:.55rem 1rem;z-index:40}
.skip:focus{left:1rem;top:1rem}

/* micro labels */
.eyebrow{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--silver);margin:0 0 1.75rem;display:flex;align-items:center;gap:.85rem}
.eyebrow::before{content:"";width:1.5rem;height:1px;background:currentColor}
.bone .eyebrow{color:var(--stone)}
.num{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;color:var(--silver)}
.bone .num{color:var(--stone)}

.hairline{height:0;border:0;border-top:1px solid var(--pewter);margin:0}
.bone .hairline{border-top-color:var(--line-bone)}
.draw{position:relative}
.draw::after{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--bone);transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--ease)}
.in.draw::after,.draw.in::after{transform:scaleX(1)}
.bone .draw::after{background:var(--black)}

/* header */
.site-header{position:sticky;top:0;z-index:30;background:rgba(17,17,17,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:5rem}
.brand img{width:clamp(168px,16vw,210px);height:auto}
.nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:clamp(1.1rem,2.2vw,2.1rem)}
.nav a{font-size:.875rem;font-weight:400;text-decoration:none;color:var(--silver);padding:.35rem 0;letter-spacing:.01em}
.nav a:hover,.nav a[aria-current="page"]{color:var(--bone)}
.nav .nav-cta{border:1px solid var(--pewter);padding:.5rem 1.05rem;color:var(--bone);margin-left:.25rem}
.nav .nav-cta:hover{border-color:var(--bone)}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;font-size:.85rem;border:1px solid var(--pewter);padding:.45rem .95rem;color:var(--bone)}
.mnav summary::-webkit-details-marker{display:none}
.mnav ul{list-style:none;margin:0;padding:.85rem 1.25rem;position:absolute;right:0;top:calc(100% + .55rem);background:var(--black);border:1px solid var(--pewter);min-width:15.5rem}
.mnav li a{display:block;padding:.65rem 0;text-decoration:none;color:var(--silver);border-bottom:1px solid var(--line);font-size:.95rem}
.mnav li:last-child a{border-bottom:0}
.mnav a[aria-current="page"]{color:var(--bone)}
@media (max-width:920px){.nav{display:none}.mnav{display:block}}

/* sections */
.section{padding:clamp(5.5rem,12vw,10rem) 0}
.section.tight{padding:clamp(3.5rem,7vw,5.5rem) 0}
.bone{background:var(--bone);color:var(--black)}
.bone a{text-decoration-color:var(--silver)}
.split-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);gap:2rem 4rem;align-items:end;margin-bottom:clamp(3rem,6vw,5rem)}
.split-head p{margin:0;color:var(--ash);font-size:1.05rem;max-width:32rem}
.bone .split-head p{color:var(--pewter)}
@media (max-width:860px){.split-head{grid-template-columns:1fr}}

/* hero */
.hero{min-height:calc(100svh - 5rem);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(5rem,12vw,9rem) 0 clamp(3.5rem,7vw,5rem);position:relative}
.hero h1{max-width:14ch}
.hero .lede{font-family:var(--sans);font-size:clamp(1.05rem,1.35vw,1.2rem);line-height:1.6;color:var(--ash);max-width:34rem;margin:2rem 0 0;font-weight:400}
.hero-foot{margin-top:clamp(4rem,9vw,7rem);padding-top:1.75rem;border-top:1px solid var(--pewter);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.5rem 3rem;align-items:baseline}
.hero-foot .tag{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--silver);margin:0}
.hero-foot .links{display:flex;flex-wrap:wrap;gap:1.75rem}
.hero-foot a{text-decoration:none;color:var(--bone);font-size:.95rem}
.hero-foot a:hover{text-decoration:underline;text-decoration-color:var(--silver);text-underline-offset:.25em}
.hero-foot a span{color:var(--silver);margin-left:.4rem}

/* text links / CTAs — no pills, no shadows */
.link{display:inline-flex;align-items:center;gap:.55rem;font-size:.95rem;text-decoration:none;color:inherit;border-bottom:1px solid currentColor;padding-bottom:.15rem}
.link .arr{transition:transform .3s var(--ease);display:inline-block}
.link:hover .arr{transform:translateX(4px)}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.85rem 1.35rem;font-size:.9rem;text-decoration:none;border:1px solid var(--pewter);color:var(--bone);background:transparent}
.btn:hover{border-color:var(--bone)}
.bone .btn{border-color:var(--black);color:var(--black)}
.bone .btn:hover{background:var(--black);color:var(--bone)}
.cta-row{display:flex;flex-wrap:wrap;gap:1.25rem;align-items:center;margin-top:2.25rem}

/* pillars (home) */
.pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:0}
.pillar{padding:2.75rem 2.25rem 0 0;position:relative;text-decoration:none;color:inherit;display:block}
.pillar + .pillar{padding-left:2.25rem;border-left:1px solid var(--line)}
.bone .pillar + .pillar{border-left-color:var(--line-bone)}
.pillar h3{margin:1rem 0 .85rem;font-size:clamp(1.75rem,2.8vw,2.35rem)}
.pillar p{color:var(--ash);margin:0 0 1.75rem;max-width:28rem;font-size:1rem}
.bone .pillar p{color:var(--pewter)}
.pillar .more{font-size:.9rem;color:var(--silver)}
.bone .pillar .more{color:var(--stone)}
.pillar:hover .more{color:inherit}
.pillar:hover .more .arr{transform:translateX(4px)}
.pillar .more .arr{display:inline-block;transition:transform .3s var(--ease);margin-left:.35rem}
@media (max-width:860px){.pillars{grid-template-columns:1fr}.pillar,.pillar + .pillar{padding:2.25rem 0;border-left:0;border-top:1px solid var(--pewter)}.bone .pillar + .pillar{border-top-color:var(--line-bone)}}

/* statement */
.statement{font-family:var(--serif);font-size:clamp(1.75rem,3.4vw,2.85rem);line-height:1.22;letter-spacing:-.02em;font-weight:400;max-width:22ch;margin:0}
.statement .quiet{color:var(--stone)}
.dark .statement .quiet,.statement .quiet.dark{color:var(--silver)}

/* practice detail */
.practice{display:grid;grid-template-columns:minmax(0,4.5fr) minmax(0,7.5fr);gap:clamp(2.5rem,6vw,6rem)}
.practice .aside{position:sticky;top:7rem;align-self:start}
.practice .aside h2{font-size:clamp(2.6rem,5.2vw,4.5rem)}
.practice .aside .tag{font-family:var(--sans);font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--silver);margin:1.1rem 0 1.5rem;letter-spacing:0;line-height:1.45;max-width:28rem}
.bone .practice .aside .tag{color:var(--stone)}
.practice .aside .intro{color:var(--ash);max-width:28rem;margin:0}
.bone .practice .aside .intro{color:var(--pewter)}
.list{list-style:none;margin:0;padding:0}
.list li{display:grid;grid-template-columns:3.25rem minmax(0,1fr);gap:1rem;padding:1.65rem 0;border-top:1px solid var(--line)}
.bone .list li{border-top-color:var(--line-bone)}
.list li:last-child{border-bottom:1px solid var(--line)}
.bone .list li:last-child{border-bottom-color:var(--line-bone)}
.list h3{font-family:var(--sans);font-weight:500;font-size:1.1rem;letter-spacing:-.01em;margin:0 0 .4rem}
.list p{margin:0;color:var(--silver);font-size:.98rem}
.bone .list p{color:var(--pewter)}
@media (max-width:900px){.practice{grid-template-columns:1fr}.practice .aside{position:static}}

.outcomes{margin-top:2.25rem;padding-top:1.5rem;border-top:1px solid var(--pewter)}
.bone .outcomes{border-top-color:var(--line-bone)}
.outcomes .k{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--silver);margin:0 0 .85rem}
.bone .outcomes .k{color:var(--stone)}
.outcomes ul{list-style:none;margin:0;padding:0}
.outcomes li{padding:.3rem 0 .3rem 1.25rem;position:relative;color:inherit;font-size:.95rem}
.outcomes li::before{content:"";position:absolute;left:0;top:1em;width:.65rem;height:1px;background:currentColor}

/* note / disclaimer strip */
.note-strip{font-size:.9rem;color:var(--silver);max-width:44rem;margin:0;line-height:1.55}
.bone .note-strip{color:var(--pewter)}

/* approach */
.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.75rem,3vw,3rem)}
.principles article{border-top:1px solid var(--pewter);padding-top:1.5rem}
.bone .principles article{border-top-color:var(--black)}
.principles h3{font-family:var(--sans);font-weight:500;font-size:1.15rem;margin:.85rem 0 .6rem}
.principles p{color:var(--silver);margin:0;font-size:.98rem}
.bone .principles p{color:var(--pewter)}
@media (max-width:760px){.principles{grid-template-columns:1fr}}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem)}
.duo article{border-top:1px solid var(--pewter);padding-top:1.5rem}
.bone .duo article{border-top-color:var(--black)}
.duo h3{font-family:var(--sans);font-weight:500;font-size:1.2rem;margin:.75rem 0 .65rem}
.duo p{color:var(--silver);margin:0;max-width:32rem}
.bone .duo p{color:var(--pewter)}
@media (max-width:760px){.duo{grid-template-columns:1fr}}

/* page head */
.page-head{padding:clamp(5rem,11vw,8.5rem) 0 clamp(3.5rem,7vw,5.5rem);border-bottom:1px solid var(--line)}
.page-head h1{font-size:clamp(3rem,7vw,6rem);max-width:12ch}
.page-head .lede{font-family:var(--sans);font-size:clamp(1.05rem,1.35vw,1.2rem);color:var(--ash);max-width:36rem;margin:1.75rem 0 0;line-height:1.6}
.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin:2.5rem 0 0;padding:0;list-style:none}
.chips a{display:inline-block;font-size:.8rem;letter-spacing:.04em;text-decoration:none;color:var(--silver);border:1px solid var(--pewter);padding:.4rem .85rem}
.chips a:hover{color:var(--bone);border-color:var(--bone)}

/* contact */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem}
.contact-grid .big{font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.5rem);letter-spacing:-.02em;text-decoration-color:var(--pewter)}
.contact-grid dl{margin:0}
.contact-grid dl div{display:grid;grid-template-columns:7.5rem 1fr;gap:1rem;padding:1.2rem 0;border-top:1px solid var(--line)}
.contact-grid dl div:last-child{border-bottom:1px solid var(--line)}
.contact-grid dt{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--silver);padding-top:.35rem}
.contact-grid dd{margin:0}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}
@media (max-width:480px){.contact-grid dl div{grid-template-columns:1fr;gap:.3rem}}

/* prose / legal */
.prose{max-width:44rem}
.prose h2{font-family:var(--sans);font-weight:500;font-size:1.15rem;letter-spacing:-.01em;margin:2.5rem 0 .7rem;max-width:none}
.prose h2:first-child{margin-top:0}
.prose p{color:var(--ash)}

/* 404 */
.err{min-height:62vh;display:flex;align-items:center;padding:6rem 0}
.err .code{font-family:var(--mono);color:var(--silver);letter-spacing:.2em;margin-bottom:1.5rem}

/* CTA band */
.cta-band{padding:clamp(5rem,11vw,9rem) 0;border-top:1px solid var(--line)}
.cta-band .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:2rem}
.cta-band h2{max-width:12ch}
.cta-band .mail{display:inline-block;margin-top:1.75rem;font-family:var(--serif);font-size:clamp(1.35rem,2.6vw,2.1rem);letter-spacing:-.02em;text-decoration-color:var(--pewter)}
.cta-band .note{color:var(--silver);max-width:22rem;margin:0;font-size:.9rem}

/* footer */
.site-footer{border-top:1px solid var(--line);background:var(--black);padding-top:4.5rem;padding-bottom:2.5rem}
.footer-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2.5rem 3rem;padding-bottom:3rem}
.footer-brand{display:flex;flex-direction:column;gap:1.5rem}
.footer-brand .wordmark{width:180px}
.footer-brand .mono-mark{width:42px;opacity:.85}
.footer-cols{display:flex;flex-wrap:wrap;gap:2.25rem 4rem}
.footer-cols .k{font-family:var(--mono);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);margin:0 0 .9rem}
.footer-cols ul{list-style:none;margin:0;padding:0}
.footer-cols li{margin:0 0 .5rem}
.footer-cols a{text-decoration:none;color:var(--silver);font-size:.9rem}
.footer-cols a:hover{color:var(--bone)}
.footer-legal{padding-top:2rem;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr);gap:1.25rem 3rem}
.footer-legal p{font-size:.78rem;line-height:1.6;color:var(--silver);margin:0}
.footer-legal a{color:var(--silver)}
@media (max-width:860px){.footer-legal{grid-template-columns:1fr}}

/* motion */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal.d1{transition-delay:.08s}.js .reveal.d2{transition-delay:.16s}.js .reveal.d3{transition-delay:.24s}
.hero .rise{animation:rise 1s var(--ease) both}
.hero .rise.d1{animation-delay:.1s}.hero .rise.d2{animation-delay:.2s}.hero .rise.d3{animation-delay:.3s}
@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .reveal{opacity:1;transform:none}
  .draw::after{transform:scaleX(1)}
}
@media print{.site-header,.mnav,.cta-band{display:none}body{background:#fff;color:#000}}