/* Ethington CPA & Advisory — shared design system
   Ledger/accounting visual language: greenbar tint, hairline rules,
   double-rule "total" to close a section.
   Type: Newsreader (display) · IBM Plex Sans (body) · IBM Plex Mono (labels/figures) */

:root{
  --ink:#12181f; --paper:#fbfbf9; --rule:#d3d9d2; --greenbar:#eef3ec;
  --accent:#1f6f5c; --muted:#5b6660; --body:#28322c;
  --serif:"Newsreader",Georgia,serif;
  --sans:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --wrap:min(64rem,100% - 3rem);
  --narrow:min(46rem,100% - 3rem);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{width:var(--wrap);margin-inline:auto}
.narrow{width:var(--narrow);margin-inline:auto}
img{max-width:100%;height:auto}

.eyebrow{font-family:var(--mono);font-size:.66rem;font-weight:500;letter-spacing:.19em;text-transform:uppercase;color:var(--accent);margin:0 0 1.1rem}
h1,h2,h3{font-weight:400}
h2{font-family:var(--serif);font-size:clamp(1.7rem,3.6vw,2.4rem);letter-spacing:-.018em;line-height:1.15;margin:0 0 1rem}
h3{font-family:var(--serif);font-size:1.3rem;letter-spacing:-.012em;margin:0 0 .4rem}
p{margin:0 0 1rem;max-width:36rem}
a{color:var(--accent)}
a:focus-visible,.btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* ---- header ---- */
header{border-bottom:1px solid var(--rule);background:var(--paper)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding:1.15rem 0;flex-wrap:wrap}
.wordmark{font-family:var(--serif);font-size:1.35rem;letter-spacing:-.02em;text-decoration:none;color:var(--ink);line-height:1.1}
.wordmark span{font-family:var(--mono);font-size:.56rem;letter-spacing:.17em;text-transform:uppercase;color:var(--accent);display:block;margin-top:.2rem}
nav{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}
nav a.navlink{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--muted)}
nav a.navlink:hover,nav a.navlink[aria-current]{color:var(--ink)}
nav a.cta{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:1px solid var(--ink);padding:.55rem .95rem;color:var(--ink);white-space:nowrap}
nav a.cta:hover{background:var(--ink);color:var(--paper)}

/* ---- hero ---- */
.hero{padding:clamp(3rem,8vw,5.5rem) 0 clamp(2.5rem,6vw,4rem);
      background:repeating-linear-gradient(to bottom,transparent 0 39px,rgba(31,111,92,.05) 39px 40px)}
.hero h1{font-family:var(--serif);font-size:clamp(2.3rem,6.4vw,4.2rem);line-height:1.03;letter-spacing:-.028em;margin:0 0 1.4rem;max-width:17ch}
.hero h1 em{font-style:normal;color:var(--accent)}
.lede{font-size:clamp(1.05rem,2vw,1.2rem);max-width:34rem;color:var(--body)}

section{padding:clamp(2.75rem,6vw,4.5rem) 0;border-top:1px solid var(--rule)}
section.plain{border-top:none}

/* ---- VSL video ---- */
.vsl{margin:0 0 1.75rem;border:1px solid var(--ink);background:var(--ink);position:relative;aspect-ratio:16/9;
     display:flex;align-items:center;justify-content:center;overflow:hidden}
.vsl iframe,.vsl video{position:absolute;inset:0;width:100%;height:100%;border:0}
.vsl .ph{text-align:center;color:#9fb3aa;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;padding:1.5rem}
.vsl .ph strong{display:block;font-size:2rem;color:var(--paper);margin-bottom:.6rem;font-family:var(--serif);letter-spacing:normal;text-transform:none;font-weight:400}
.vslnote{font-family:var(--mono);font-size:.68rem;color:var(--muted);letter-spacing:.04em;margin-bottom:2.5rem}

/* ---- ledger rows ---- */
.ledger{margin-top:1.75rem;border-top:1px solid var(--ink)}
.entry{display:grid;grid-template-columns:8.5rem 1fr;gap:1.5rem;padding:1.4rem .75rem;border-bottom:1px solid var(--rule)}
.entry:nth-child(odd){background:var(--greenbar)}
.entry h3{margin:0;font-size:1.45rem}
.entry .when{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:.45rem}
.entry p{margin:.3rem 0 0;font-size:.96rem}
@media (max-width:38rem){.entry{grid-template-columns:1fr;gap:.45rem}}

/* ---- findings list (niche pages) ---- */
.finds{list-style:none;padding:0;margin:1.75rem 0 0;border-top:1px solid var(--rule)}
.finds li{padding:1.05rem .75rem;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:2.5rem 1fr;gap:.9rem;align-items:start}
.finds li:nth-child(odd){background:var(--greenbar)}
.finds .n{font-family:var(--mono);font-size:.7rem;color:var(--accent);padding-top:.2rem}
.finds strong{font-weight:500}
.finds span.d{display:block;color:var(--muted);font-size:.93rem;margin-top:.15rem}

/* ---- columns ---- */
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:0;margin-top:1.75rem;border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.col{padding:1.4rem 1.3rem;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.col h3{font-family:var(--sans);font-size:.95rem;font-weight:500;margin:0 0 .45rem}
.col p{font-size:.9rem;color:var(--muted);margin:0}
.col a{text-decoration:none;border-bottom:1px solid rgba(31,111,92,.3)}

.creds{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.4rem 0 0;padding:0;list-style:none}
.creds li{font-family:var(--mono);font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;border:1px solid var(--rule);padding:.42rem .78rem}

/* ---- bottom line CTA ---- */
.bottomline{border-top:1px solid var(--ink);border-bottom:4px double var(--ink);padding:2.4rem .75rem;margin-top:1.75rem;background:var(--greenbar)}
.bottomline h2{margin-bottom:.55rem}
.btn{display:inline-block;margin-top:.9rem;background:var(--ink);color:var(--paper);text-decoration:none;font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;padding:.9rem 1.55rem}
.btn:hover{background:var(--accent)}

footer{border-top:1px solid var(--rule);padding:2.4rem 0 3.25rem;font-size:.8rem;color:var(--muted)}
footer p{max-width:52rem;font-size:.78rem;line-height:1.55}
footer a{text-decoration:none;border-bottom:1px solid rgba(31,111,92,.3)}