
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&family=Newsreader:opsz,wght@6..72,500;6..72,600&display=swap');

:root{
  --ivory:#f4efe3;
  --paper:#fbf8f1;
  --ink:#1e272c;
  --euca:#97aa9b;
  --cyan:#5bb7c6;
  --sand:#d9c6a5;
  --brick:#9f493f;
  --graphite:#40474a;
  --muted:#687075;
  --line:rgba(30,39,44,.18);
  --max:1460px;
  --pad:clamp(1.05rem,4vw,4.6rem);
  --sec:clamp(5rem,9vw,9.4rem);
  --serif:"Newsreader",Georgia,serif;
  --sans:"DM Sans",Arial,sans-serif;
  --mono:"IBM Plex Mono","Courier New",monospace;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);line-height:1.58;overflow-x:hidden
}
img{display:block;width:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:600}
ul{list-style:none;margin:0;padding:0}
address{font-style:normal}
a:focus-visible{outline:2px solid var(--brick);outline-offset:4px}
.shell{width:min(100%,var(--max));margin:auto;padding-inline:var(--pad)}
.skip{position:absolute;left:1rem;top:-10rem;z-index:999;background:var(--paper);padding:.75rem 1rem;border:1px solid var(--ink)}
.skip:focus{top:1rem}
.code{font:400 .64rem var(--mono);text-transform:uppercase;letter-spacing:.11em}
.ref{display:flex;align-items:center;gap:.7rem;font:400 .66rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--brick);margin-bottom:1.8rem}
.ref:before{content:"";width:24px;height:2px;background:currentColor}

/* masthead */
.top{background:var(--ink);color:var(--paper)}
.top .shell{min-height:32px;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.header{background:var(--paper);border-bottom:1px solid var(--ink)}
.header-grid{min-height:92px;display:grid;grid-template-columns:.82fr 1.18fr}
.brand{display:flex;flex-direction:column;justify-content:center;padding-right:2rem;font:600 1.82rem/.8 var(--serif);text-transform:uppercase}
.brand small{font:400 .58rem var(--mono);letter-spacing:.14em;margin-top:.58rem}
.nav{display:grid;grid-template-columns:repeat(6,1fr);border-left:1px solid var(--line)}
.nav a{position:relative;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--line);font-size:.75rem;text-transform:uppercase;letter-spacing:.07em}
.nav a:after{content:"";position:absolute;left:18%;right:18%;bottom:13px;height:3px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:.2s}
.nav a:hover:after{transform:scaleX(1)}

/* hero */
.hero{padding:clamp(2rem,4vw,4rem) 0 clamp(5rem,9vw,9rem)}
.hero-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto auto;gap:1rem}
.hero-title{grid-column:1/8;grid-row:1/3;min-height:590px;padding:clamp(2rem,5vw,5rem);background:var(--ivory);border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.hero-title:after{content:"";position:absolute;right:-80px;bottom:-80px;width:330px;height:330px;background:linear-gradient(90deg,var(--line) 1px,transparent 1px),linear-gradient(var(--line) 1px,transparent 1px);background-size:34px 34px;opacity:.45}
.hero h1{font:600 clamp(4.6rem,9.5vw,9.6rem)/.78 var(--serif);letter-spacing:-.055em;max-width:7ch;position:relative;z-index:2}
.hero h1 span{display:block;color:var(--euca);margin-left:clamp(1rem,5vw,5rem)}
.hero-intro{display:grid;grid-template-columns:5rem 1fr;gap:1rem;max-width:34rem;position:relative;z-index:2}
.hero-intro p{font-size:clamp(1rem,1.2vw,1.16rem)}
.hero-main{grid-column:8/13;grid-row:1/4;min-height:760px;position:relative;overflow:hidden;background:var(--graphite)}
.hero-main img{height:100%;min-height:760px;filter:saturate(.55) contrast(.98)}
.hero-main:before{content:"";position:absolute;z-index:2;left:0;right:0;top:38%;height:2px;background:var(--cyan)}
.hero-main figcaption{position:absolute;z-index:3;left:1rem;top:calc(38% + 1rem);background:rgba(30,39,44,.9);color:var(--paper);padding:.6rem .7rem}
.hero-small{grid-column:1/5;grid-row:3;min-height:210px;position:relative;overflow:hidden}
.hero-small img{height:100%;min-height:210px;filter:saturate(.62)}
.hero-small figcaption{position:absolute;right:0;bottom:0;background:var(--graphite);color:white;padding:.55rem .7rem}
.hero-cta{grid-column:5/8;grid-row:3;background:var(--euca);min-height:210px;padding:1.4rem;display:flex;flex-direction:column;justify-content:space-between}
.hero-cta a{font:600 1.5rem var(--serif)}
.hero-cta a:after{content:" →"}

/* intro */
.intro{padding:var(--sec) 0;background:var(--ivory)}
.intro-grid{display:grid;grid-template-columns:.34fr 1fr .74fr;gap:clamp(1.5rem,5vw,5.5rem)}
.big{font:600 clamp(6rem,12vw,12rem)/.67 var(--serif);color:rgba(30,39,44,.1)}
.intro h2,.services h2,.smallbiz h2,.triad h2,.workflow h2,.faq h2,.visit h2{font-family:var(--serif);letter-spacing:-.045em}
.intro h2{font-size:clamp(3.2rem,6.5vw,6.8rem);line-height:.9;max-width:8ch}
.intro-copy{max-width:29rem}
.intro-copy p:first-child{font-size:1.14rem}
.intro-copy p+p{margin-top:1.25rem;color:var(--muted)}

/* service ledger */
.services{padding:var(--sec) 0;background:var(--paper)}
.services-head{display:grid;grid-template-columns:1fr .72fr;gap:3rem;align-items:end;margin-bottom:3.4rem}
.services h2{font-size:clamp(3.4rem,7vw,7.2rem);line-height:.87}
.services-head p{max-width:31rem;justify-self:end;color:var(--muted)}
.ledger{border-top:2px solid var(--ink)}
.ledger-row{display:grid;grid-template-columns:7rem minmax(230px,.82fr) minmax(250px,1.18fr);gap:1.5rem;align-items:center;min-height:118px;border-bottom:1px solid var(--line);position:relative}
.ledger-row:before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--euca)}
.ledger-row:nth-child(2):before,.ledger-row:nth-child(5):before{background:var(--cyan)}
.ledger-row:nth-child(3):before,.ledger-row:nth-child(6):before{background:var(--sand)}
.ledger-code{padding-left:1.2rem;font:400 .68rem var(--mono);color:var(--brick)}
.ledger-row h3{font-size:clamp(1.3rem,2.2vw,2rem)}
.ledger-row p{max-width:38rem;color:var(--muted);font-size:.91rem}

/* small business */
.smallbiz{padding:var(--sec) 0;background:var(--euca)}
.smallbiz-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(2rem,6vw,6rem)}
.smallbiz h2{font-size:clamp(3.5rem,7vw,7.3rem);line-height:.86;max-width:7.2ch}
.smallbiz-copy p{max-width:31rem;color:#37443e}
.smallbiz-copy p+p{margin-top:1.2rem}
.biz-check{margin-top:2.5rem;border-top:1px solid var(--ink)}
.biz-check li{display:grid;grid-template-columns:4rem 1fr;gap:1rem;padding:.9rem 0;border-bottom:1px solid rgba(30,39,44,.26)}
.biz-check .code{color:#77413b}

/* triad */
.triad{display:grid;grid-template-columns:1fr 1fr 1fr}
.triad-panel{min-height:620px;padding:var(--sec) var(--pad);position:relative;display:flex;flex-direction:column;justify-content:space-between}
.triad-panel.tax{background:var(--ink);color:var(--paper)}
.triad-panel.books{background:var(--sand)}
.triad-panel.advice{background:var(--cyan)}
.triad-panel h2{font-size:clamp(4.5rem,8.5vw,8rem);line-height:.78}
.triad-panel p{max-width:24rem}
.triad-panel.tax p{color:rgba(251,248,241,.75)}
.triad-panel .code{opacity:.75}

/* workflow */
.workflow{padding:var(--sec) 0;background:var(--paper)}
.workflow-head{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:end;margin-bottom:4rem}
.workflow h2{font-size:clamp(3.4rem,7vw,7.2rem);line-height:.87}
.workflow-head p{justify-self:end;max-width:31rem;color:var(--muted)}
.flow{display:grid;grid-template-columns:repeat(5,1fr);position:relative;min-height:390px}
.flow:before{content:"";position:absolute;left:5%;right:5%;top:49%;height:2px;background:var(--ink)}
.step{position:relative;padding:1rem;align-self:start}
.step:nth-child(even){align-self:end}
.step:after{content:"";position:absolute;width:16px;height:16px;border-radius:2px;background:var(--cyan);border:4px solid var(--paper);box-shadow:0 0 0 1px var(--ink);left:1rem}
.step:nth-child(odd):after{bottom:-38px}
.step:nth-child(even):after{top:-38px}
.step b{font:600 4rem/.8 var(--serif);color:rgba(30,39,44,.22)}
.step h3{font:600 1.45rem var(--serif);margin:.8rem 0 .5rem}
.step p{font-size:.84rem;color:var(--muted);max-width:12rem}

/* FAQ */
.faq{padding:var(--sec) 0;background:var(--sand)}
.faq-head{display:grid;grid-template-columns:1fr .64fr;gap:3rem;align-items:end;margin-bottom:3.4rem}
.faq h2{font-size:clamp(3.4rem,7vw,7.2rem);line-height:.87}
.faq-head p{max-width:30rem;justify-self:end;color:#62584c}
.faq-list{border-top:2px solid var(--ink)}
.faq-item{display:grid;grid-template-columns:5rem .95fr 1.05fr;gap:1.5rem;padding:1.4rem 0;border-bottom:1px solid rgba(30,39,44,.25);align-items:start}
.faq-item .code{color:var(--brick)}
.faq-item h3{font:600 clamp(1.2rem,2vw,1.8rem)/1.08 var(--serif)}
.faq-item p{font-size:.91rem;color:#62584c}

/* visit */
.visit{background:var(--graphite);color:var(--paper)}
.visit-grid{display:grid;grid-template-columns:.78fr 1.22fr;min-height:610px}
.visit-info{padding:var(--sec) var(--pad);display:flex;flex-direction:column;justify-content:space-between}
.visit-info h2{font-size:clamp(4rem,7.5vw,8rem);line-height:.83;max-width:6ch}
.visit-info address{font:600 clamp(2rem,3.8vw,4rem)/1 var(--serif)}
.visit-map{position:relative;padding:var(--sec) var(--pad);background:linear-gradient(rgba(251,248,241,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(251,248,241,.16) 1px,transparent 1px),#617178;background-size:58px 58px;overflow:hidden}
.visit-map:before{content:"";position:absolute;left:8%;right:8%;top:56%;height:2px;background:var(--paper)}
.visit-map:after{content:"";position:absolute;width:96px;height:96px;border-radius:50%;background:var(--cyan);left:62%;top:calc(56% - 48px);border:13px solid #617178;box-shadow:0 0 0 2px var(--paper)}
.visit-word{position:relative;z-index:2;font:600 clamp(5rem,10vw,11rem)/.73 var(--serif);letter-spacing:-.05em}
.visit-note{position:absolute;right:var(--pad);bottom:var(--pad);max-width:26rem;color:rgba(251,248,241,.78);font-size:.9rem}

/* footer */
.footer{background:var(--ink);color:var(--paper);padding:3.6rem 0 2rem;border-top:1px solid rgba(251,248,241,.15)}
.footer-title{font:600 clamp(4.8rem,10vw,10rem)/.7 var(--serif);text-transform:uppercase;padding-bottom:2rem;border-bottom:1px solid rgba(251,248,241,.18)}
.footer-title span{display:block}
.footer-title small{display:block;font:400 .11em var(--mono);letter-spacing:.15em;margin-top:1rem;color:#8ed0db}
.footer-row{display:grid;grid-template-columns:1fr 1.5fr auto;gap:2rem;padding-top:1.5rem}
.footer-address{font-size:.78rem;line-height:1.7;color:rgba(251,248,241,.72)}
.footer-links{display:flex;flex-wrap:wrap;gap:.7rem 1.5rem;font-size:.78rem}
.footer-links a:hover{color:#8ed0db}
.footer-code{text-align:right;color:rgba(251,248,241,.56)}

/* legal */
.legal-hero{padding:clamp(4rem,8vw,8rem) 0 3rem;background:var(--ivory);border-bottom:1px solid var(--ink)}
.legal-back{display:inline-block;font:400 .66rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--brick);margin-bottom:3rem}
.legal-hero h1{font:600 clamp(4rem,8vw,8.5rem)/.82 var(--serif);max-width:8ch}
.legal-hero p{max-width:44rem;margin-top:1.8rem;color:var(--muted)}
.legal-layout{display:grid;grid-template-columns:.3fr .7fr;gap:clamp(2.5rem,7vw,8rem);padding:clamp(3rem,7vw,7rem) 0 var(--sec)}
.legal-index{position:sticky;top:2rem;align-self:start;border-top:1px solid var(--ink)}
.legal-index a{display:block;padding:1rem 0;border-bottom:1px solid var(--line);font-size:.82rem}
.legal-copy{max-width:800px}
.legal-copy>section{scroll-margin-top:2rem;padding-bottom:4rem}
.legal-copy>section+section{padding-top:4rem;border-top:2px solid var(--ink)}
.legal-copy h2{font:600 clamp(2.8rem,5vw,5.4rem)/.9 var(--serif);margin-bottom:2rem}
.legal-copy h3{font:600 1.6rem var(--serif);margin:2rem 0 .8rem}
.legal-copy p+p{margin-top:1rem}

@media(max-width:980px){
  .header-grid{grid-template-columns:.72fr 1.28fr}
  .nav{grid-template-columns:repeat(3,1fr)}
  .intro-grid{grid-template-columns:.3fr 1fr}
  .intro-copy{grid-column:2}
  .faq-item{grid-template-columns:4rem 1fr}
  .faq-item p{grid-column:2}
}
@media(max-width:760px){
  .top .shell span:last-child{display:none}
  .header-grid{grid-template-columns:1fr}
  .brand{min-height:76px;border-bottom:1px solid var(--line)}
  .nav{border-left:0;grid-template-columns:repeat(3,1fr)}
  .nav a{min-height:54px}
  .hero-grid{display:flex;flex-direction:column}
  .hero-title{order:1;min-height:520px}
  .hero h1{font-size:clamp(4.6rem,20vw,7.2rem)}
  .hero h1 span{margin-left:0}
  .hero-main{order:2;min-height:500px}
  .hero-main img{min-height:500px}
  .hero-small{order:3;min-height:230px}
  .hero-cta{order:4}
  .intro-grid{grid-template-columns:1fr}.intro-copy{grid-column:auto}.big{font-size:5.5rem}
  .services-head,.workflow-head,.faq-head{display:block}
  .services-head p,.workflow-head p,.faq-head p{margin-top:1.4rem}
  .ledger-row{grid-template-columns:5rem 1fr;padding:1rem 0}.ledger-row p{grid-column:2}.ledger-code{padding-left:1rem}
  .smallbiz-grid{grid-template-columns:1fr}
  .triad{grid-template-columns:1fr}.triad-panel{min-height:420px}
  .flow{display:block;min-height:0;border-left:2px solid var(--ink);margin-left:.5rem}.flow:before{display:none}.step,.step:nth-child(even){padding:0 0 2.5rem 2rem}.step:after,.step:nth-child(odd):after,.step:nth-child(even):after{left:-9px;top:.3rem;bottom:auto}.step p{max-width:30rem}
  .faq-item{grid-template-columns:4rem 1fr}.faq-item p{grid-column:2}
  .visit-grid{grid-template-columns:1fr}.visit-info{min-height:430px}.visit-map{min-height:430px}
  .footer-row{grid-template-columns:1fr auto}.footer-links{grid-column:1/-1;grid-row:2}
  .legal-layout{grid-template-columns:1fr}.legal-index{position:static}
}
@media(max-width:500px){
  .nav{grid-template-columns:1fr 1fr}
  .hero-title{min-height:470px}
  .hero h1{font-size:clamp(4.2rem,22vw,6rem)}
  .triad-panel h2{font-size:4.6rem}
  .footer-row{grid-template-columns:1fr}
  .footer-code{text-align:left}
}
