:root{
  --lg-ink:#1b1a18; --lg-soft:#55514b; --lg-rule:#e2ddd4;
  --lg-paper:#faf8f5; --lg-card:#fff;
  --lg-accent:#0f5c5c; --lg-warm:#c2410c;
  --lg-gutter:clamp(1.25rem,4vw,3rem);
}
*{box-sizing:border-box}
body{margin:0;background:var(--lg-paper);color:var(--lg-ink);
  font:17px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Georgia,"Iowan Old Style","Times New Roman",serif;
  font-weight:600;letter-spacing:-.01em;margin:0}
a{color:var(--lg-accent)}
img{max-width:100%;display:block}
.ledger-shell{max-width:1080px;margin:0 auto;padding:0 var(--lg-gutter)}
.ledger-skip{position:absolute;left:-9999px}
.ledger-skip:focus{left:1rem;top:1rem;background:#fff;padding:.6rem 1rem;z-index:99}

/* header */
.ledger-head{background:var(--lg-card);border-bottom:1px solid var(--lg-rule);position:sticky;top:0;z-index:9}
/* 84px, RAISED WITH THE LOGO. The row's height has to be settled before the
   image loads or the header jumps as it arrives — which is why the mark
   carries no width/height attributes. A 55px logo in a 76px row left four
   pixels of air above and below it. */
.ledger-head__row{display:flex;align-items:center;gap:1.5rem;min-height:96px}
.ledger-brand{display:flex;align-items:center;gap:.7rem;margin-right:auto;text-decoration:none;color:inherit}
.ledger-brand__glyph{width:42px;height:42px;border-radius:9px;background:var(--lg-accent);color:#fff;
  display:grid;place-items:center;font-family:Georgia,serif;font-size:19px;flex:0 0 auto}
/* THE HEIGHT IS FIXED AND THE WIDTH FOLLOWS THE LOGO. A 42px SQUARE with
   object-fit:contain letterboxes a wide lockup — a 400x90 logo drew at about
   42x9 and read as a smudge — so the dimension to pin is the height.

   53px -> 70px ON 30 OCTOBER, AND THE REASON IS THE ASPECT RATIO RATHER THAN
   THE NUMBER. Pinning height suits a WIDE lockup: at 4.4:1, 53px tall comes
   out 235px wide and fills the header. Edwin's own logo is about 1.5:1, and
   at 53px tall it came out 80px wide — the rule working exactly as written,
   and a logo a third the presence of the one it was designed around.

       PINNING ONE DIMENSION SIZES ONE SHAPE WELL
       AND EVERY OTHER SHAPE BY ACCIDENT.

   max-width is what protects the wide ones: at 70px tall a 4.4:1 lockup
   wants 308px and is capped at 320, so it is unaffected. A squarer logo
   gains the whole difference. */
.ledger-brand__mark{height:70px;width:auto;max-width:min(320px,54vw);object-fit:contain;
  object-position:left center;flex:0 0 auto}
.ledger-brand__name{font-family:Georgia,serif;font-size:17px;line-height:1.2}
.ledger-brand__name small{display:block;font-family:inherit;font-size:12px;color:var(--lg-soft);
  letter-spacing:.08em;text-transform:uppercase}
.ledger-menu{display:flex;align-items:center;gap:1.5rem;font-size:15px}
.ledger-menu a{color:var(--lg-soft);text-decoration:none}
.ledger-menu a:hover,.ledger-menu a[aria-current]{color:var(--lg-accent)}

/* the services menu — a <details>, so it works with no JavaScript at all */
.ledger-drop{position:relative}
.ledger-drop>summary{list-style:none;cursor:pointer;color:var(--lg-soft);
  display:inline-flex;align-items:center;gap:.4rem;-webkit-tap-highlight-color:transparent}
.ledger-drop>summary::-webkit-details-marker{display:none}
.ledger-drop>summary::after{content:"";width:.34em;height:.34em;margin-top:-.22em;
  border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg)}
.ledger-drop>summary:hover,.ledger-drop[open]>summary{color:var(--lg-accent)}
.ledger-drop[open]>summary::after{margin-top:.1em;transform:rotate(225deg)}
.ledger-drop>summary:focus-visible{outline:2px solid var(--lg-accent);outline-offset:4px;border-radius:3px}
.ledger-drop__list{position:absolute;top:calc(100% + 1.15rem);left:-1.05rem;z-index:20;
  min-width:min(264px,calc(100vw - 2.5rem));margin:0;padding:.4rem 0;list-style:none;
  background:var(--lg-card);border:1px solid var(--lg-rule);border-radius:11px;
  box-shadow:0 14px 34px rgba(20,16,10,.14)}
.ledger-drop__list li{margin:0}
.ledger-drop__list a{display:block;padding:.55rem 1.05rem;color:var(--lg-ink);font-size:15px;line-height:1.35}
.ledger-drop__list a:hover,.ledger-drop__list a:focus{background:var(--lg-paper);color:var(--lg-accent)}
.ledger-drop__list a[aria-current]{color:var(--lg-accent);font-weight:600}
.ledger-drop__all a{color:var(--lg-soft);font-size:13px;letter-spacing:.07em;text-transform:uppercase}
.ledger-ring{background:var(--lg-accent);color:#fff;text-decoration:none;font-weight:600;
  padding:.62rem 1.1rem;border-radius:8px;font-size:15px;white-space:nowrap}

/* hero */
.ledger-hero__band{height:clamp(280px,38vw,430px);overflow:hidden;background:#d9d3c9}
.ledger-hero__band img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.ledger-hero__card{background:var(--lg-card);border:1px solid var(--lg-rule);border-radius:14px;
  padding:clamp(1.5rem,4vw,2.4rem);margin-top:-78px;position:relative;max-width:760px;
  box-shadow:0 12px 30px rgba(20,16,10,.08)}
.ledger-hero__card h1{font-size:clamp(1.7rem,4.2vw,2.5rem);line-height:1.15}
.ledger-hero__card p{color:var(--lg-soft);margin:.9rem 0 1.4rem}
.ledger-acts{display:flex;gap:.7rem;flex-wrap:wrap;margin:0}
.ledger-act{display:inline-block;text-decoration:none;font-weight:600;font-size:15px;
  padding:.72rem 1.25rem;border-radius:8px}
.ledger-act--fill{background:var(--lg-warm);color:#fff}
.ledger-act--line{border:1px solid var(--lg-rule);color:var(--lg-ink)}

/* name / address / phone */
.ledger-nap{display:grid;grid-template-columns:repeat(3,1fr);margin:3rem 0 0;
  border-top:1px solid var(--lg-rule);border-bottom:1px solid var(--lg-rule)}
.ledger-nap>div{padding:1.5rem 1.6rem;border-left:1px solid var(--lg-rule)}
.ledger-nap>div:first-child{border-left:0;padding-left:0}
.ledger-nap dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--lg-soft);margin-bottom:.45rem}
.ledger-nap dd{margin:0;font-size:16px}
.ledger-nap dd a{text-decoration:none}

/* generic block */
.ledger-block{padding:3.4rem 0}
.ledger-block__lede{max-width:620px;margin-bottom:2rem}
.ledger-block__lede h2{font-size:clamp(1.4rem,3vw,1.85rem)}
.ledger-block__lede p{color:var(--lg-soft);margin:.6rem 0 0}

/* who we are */
.ledger-about{display:grid;grid-template-columns:.85fr 1.15fr;gap:3rem;align-items:start}
.ledger-about h2{font-size:clamp(1.35rem,2.9vw,1.8rem);line-height:1.25}
.ledger-about__text p{margin:0 0 1.1rem;color:var(--lg-soft)}
.ledger-about__text p:first-child{font-size:19px;color:var(--lg-ink)}
.ledger-about__text p:last-child{margin-bottom:0}

/* services list */
.ledger-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 3rem}
.ledger-list li{border-top:1px solid var(--lg-rule)}
.ledger-list a,.ledger-list__row{display:flex;gap:1rem;align-items:baseline;
  padding:1.15rem 0;text-decoration:none;color:inherit}
.ledger-list a:hover .ledger-list__name{color:var(--lg-accent)}
.ledger-list__row{color:var(--lg-soft)}
.ledger-list__row .ledger-list__name{color:var(--lg-soft)}
.ledger-list__n{font-family:Georgia,serif;font-size:13px;color:var(--lg-accent);min-width:1.6rem}
.ledger-list__name{font-family:Georgia,serif;font-size:19px;display:block}
.ledger-list__sub{display:block;font-size:14px;color:var(--lg-soft);margin-top:.15rem}

/* prose (service + legal pages) */
.ledger-prose{max-width:720px}
.ledger-prose h2{font-size:1.3rem;margin:2.4rem 0 .8rem}
.ledger-prose h2:first-child{margin-top:0}
.ledger-prose p{margin:0 0 1.05rem;color:var(--lg-soft)}
.ledger-prose p.ledger-lead{font-size:19px;color:var(--lg-ink)}
.ledger-prose ul{color:var(--lg-soft);padding-left:1.1rem}
.ledger-prose li{margin-bottom:.5rem}

/* the ring */
.ledger-onward{border-top:1px solid var(--lg-rule);margin-top:2.8rem;padding-top:1.6rem;max-width:720px}
.ledger-onward p{margin:0;color:var(--lg-soft)}

/* map + hours */
.ledger-visit{display:grid;grid-template-columns:1.15fr .85fr;gap:2.5rem;align-items:start}
.ledger-map{border:1px solid var(--lg-rule);border-radius:12px;overflow:hidden;background:#eceae5}
.ledger-map iframe{display:block;width:100%;height:360px;border:0}
.ledger-hours{background:var(--lg-card);border:1px solid var(--lg-rule);border-radius:12px;padding:1.6rem}
.ledger-hours h2{font-size:1.15rem;margin-bottom:.9rem}
.ledger-hours table{width:100%;border-collapse:collapse;font-size:15px}
.ledger-hours td{padding:.52rem 0;border-top:1px solid var(--lg-rule)}
.ledger-hours tr:first-child td{border-top:0}
.ledger-hours td:last-child{text-align:right;color:var(--lg-soft)}
.ledger-hours .ledger-shut{color:#9b958c}

/* contact */
.ledger-contact{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}
.ledger-form label{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--lg-soft);margin:0 0 .35rem}
.ledger-form input,.ledger-form textarea{width:100%;font:inherit;font-size:16px;padding:.7rem .8rem;
  border:1px solid var(--lg-rule);border-radius:8px;background:#fff;margin-bottom:1rem}
.ledger-form textarea{min-height:140px;resize:vertical}
.ledger-form button{font:inherit;font-weight:600;font-size:15px;padding:.75rem 1.4rem;border:0;
  border-radius:8px;background:var(--lg-warm);color:#fff;cursor:pointer}
.ledger-form__note{font-size:13.5px;color:var(--lg-soft);margin:.9rem 0 0}

/* footer */
.ledger-foot{background:#123f47;color:#cfe0df;margin-top:3rem;padding:3rem 0 2rem;font-size:15px}
.ledger-foot a{color:#cfe0df;text-decoration:none}
.ledger-foot a:hover{color:#fff;text-decoration:underline}
.ledger-foot__spread{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
.ledger-foot h2{font-family:Georgia,serif;color:#fff;font-size:1rem;margin:0 0 .8rem;font-weight:600}
.ledger-foot ul{list-style:none;margin:0;padding:0}
.ledger-foot li{margin-bottom:.45rem}
.ledger-foot p{margin:0;color:#9fb9b8}
.ledger-badges{display:flex;gap:.6rem;margin-top:1rem}
.ledger-badges a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.1);
  display:grid;place-items:center}
.ledger-badges a:hover{background:rgba(255,255,255,.2)}
.ledger-badges svg{width:17px;height:17px;fill:#fff;display:block}
.ledger-foot__base{border-top:1px solid rgba(255,255,255,.14);margin-top:2.2rem;padding-top:1.3rem;
  display:flex;gap:1.4rem;flex-wrap:wrap;font-size:13.5px;color:#9fb9b8}

@media (max-width:820px){
  /* THE MENU USED TO BE display:none HERE, AND THAT IS WHY IT HAD TO GO.
   *
   * Below 820px — which is most of the traffic a local trade site gets — the
   * header had a logo and a phone button and no navigation whatsoever. The
   * footer carried everything, so nothing was unreachable, but reaching a
   * service page meant scrolling past the whole page first. There is no
   * hamburger to open because there is no JavaScript; the row wraps instead
   * and the menu sits on its own line under a hairline. */
  .ledger-head__row{flex-wrap:wrap;min-height:0;padding-top:.75rem;padding-bottom:.1rem;gap:.8rem 1.2rem}
  /* The phone button shares the top row with the logo on a narrow screen,
     so the logo gives up a little height and a lot of width. */
  .ledger-brand__mark{height:60px;max-width:min(268px,54vw)}
  .ledger-menu{order:3;flex-basis:100%;flex-wrap:wrap;gap:.4rem 1.15rem;font-size:14.5px;
    border-top:1px solid var(--lg-rule);margin-top:.15rem;padding:.65rem 0}
  .ledger-drop__list{top:calc(100% + .7rem);left:-.9rem}
  .ledger-nap{grid-template-columns:1fr}
  .ledger-nap>div{border-left:0;border-top:1px solid var(--lg-rule);padding-left:0}
  .ledger-nap>div:first-child{border-top:0}
  .ledger-list{grid-template-columns:1fr;gap:0}
  .ledger-about,.ledger-visit,.ledger-contact{grid-template-columns:1fr;gap:1.2rem}
  .ledger-foot__spread{grid-template-columns:1fr}
  .ledger-hero__card{margin-top:-50px}
}