:root{
    --paper:#d2c4b2;         /* the real stock */
    --green:#20331f;
    --green-2:#31492c;
    --gold:#b7975a;
    --gold-deep:#8f7442;
    --brown:#5b4230;
    --ink:#26302099;         /* not used raw */
    --ink-1:#242c1c;
    --muted:#5f5a48;
    --ash:#131810;
    --serif:"Libre Baskerville", Georgia, serif;
    --body:"Lora", Georgia, serif;
  }
  *{box-sizing:border-box; margin:0; padding:0;}

  html{overflow-x:hidden;}
  body{ color:var(--ink-1); font-family:var(--body); line-height:1.75; background:#cfc1ae;
        -webkit-font-smoothing:antialiased; overflow-x:hidden; max-width:100%; }
  /* narrow screens: heavy letterspacing on uppercase overflows a phone, so ease it and wrap */
  @media screen and (max-width: 560px){
    .sub-seal{letter-spacing:.16em; font-size:10px; line-height:1.8;}
    .masthead .mh-word{letter-spacing:.16em;}
    nav.mnav{gap:0 11px; margin-top:14px;}
    nav.mnav a{letter-spacing:.12em; font-size:10.5px;}
    h1{letter-spacing:.2em; font-size:15px;}
    .lede{font-size:17px;}
    .wrap{padding:0 22px;}
  }

  /* THE GROUND: the real cotton-rag sheet, whole, with its raking light. Fixed so the
     page scrolls over one continuous piece of paper. */
  body::before{
    content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
    background-color:var(--paper);
    /* fine procedural paper tooth (resolution-independent, tiles seamlessly, never pixelates)
       multiplied over the real sheet, so the grain reads at every screen size */
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.6' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.42'/%3E%3C/svg%3E"),
      url('assets/textures/paper.webp');
    background-size:220px 220px, cover;
    background-position:0 0, center;
    background-repeat:repeat, no-repeat;
    background-blend-mode:multiply, normal;
  }
  /* a light touch: lift the top corners, drop a soft shadow low. Kept faint so the grain of
     the real sheet stays visible instead of washing to flat cream. */
  body::after{
    content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
    background:
      radial-gradient(130% 70% at 50% -15%, rgba(255,251,240,.24), rgba(255,251,240,0) 52%),
      radial-gradient(120% 95% at 50% 125%, rgba(52,38,24,.24), rgba(52,38,24,0) 58%);
  }

  .wrap{max-width:820px; margin:0 auto; padding:0 32px; position:relative; z-index:1;}
  .measure{max-width:620px; margin-left:auto; margin-right:auto;}

  /* ---- letterpress: type pressed INTO the sheet ---- */
  .press{ color:var(--green);
    text-shadow:0 1px 0 rgba(255,252,244,.7), 0 -1px 1px rgba(28,40,22,.35); }
  .press-gold{ color:var(--gold-deep);
    text-shadow:0 1px 0 rgba(255,252,244,.65), 0 -1px 1px rgba(60,44,28,.4); }
  .raise{ color:var(--green);
    text-shadow:0 -1px 0 rgba(28,40,22,.28), 0 1.5px 0 rgba(255,252,244,.8); }

  /* ---- ornaments: hairline gold rules and stars, no chunky borders ---- */
  .rule{height:0; border:none; border-top:1px solid var(--gold-deep); opacity:.55;
        margin:0; width:100%;}
  .starrule{display:flex; align-items:center; gap:18px; justify-content:center;
            margin:clamp(26px,4vw,44px) auto; max-width:340px; color:var(--gold-deep);}
  .starrule::before,.starrule::after{content:""; flex:1; height:0; border-top:1px solid var(--gold-deep); opacity:.5;}
  .starrule .st{font-size:13px; letter-spacing:.2em; color:var(--gold-deep);}

  /* ---- the head: the seal pressed into the paper ---- */
  header.top{padding:clamp(54px,9vw,110px) 0 clamp(20px,3vw,32px); text-align:center;}
  /* transparent medallion, embossed into the sheet: highlight below, shadow above, a cast drop */
  .seal{width:min(300px,68vw); height:auto; display:block; margin:0 auto clamp(20px,3vw,30px);
        filter:drop-shadow(0 1px 0 rgba(255,252,244,.7)) drop-shadow(0 -1px 1px rgba(40,30,18,.28)) drop-shadow(0 10px 20px rgba(40,30,18,.22));}
  h1{font-family:var(--serif); font-weight:700; font-size:clamp(15px,2vw,20px); letter-spacing:.34em;
     text-transform:uppercase; line-height:1.6; color:var(--green);
     text-shadow:0 1px 0 rgba(255,252,244,.7), 0 -1px 1px rgba(28,40,22,.3);}
  .sub-seal{font-family:var(--serif); font-size:clamp(9.5px,1.3vw,11px); letter-spacing:.46em;
            text-transform:uppercase; margin-top:12px;}
  .lede{font-family:var(--body); font-style:italic; font-size:clamp(18px,2.3vw,23px); color:var(--muted);
        max-width:500px; margin:22px auto 0; line-height:1.6;}

  /* ---- section headings ---- */
  section{padding:clamp(20px,3vw,34px) 0;}
  .eyebrow{font-family:var(--serif); font-size:11px; letter-spacing:.42em; text-transform:uppercase;
           color:var(--gold-deep); text-align:center; margin-bottom:10px;}
  h2{font-family:var(--serif); font-weight:700; font-size:clamp(22px,3vw,32px); letter-spacing:.02em;
     text-align:center; line-height:1.3;}

  /* ---- THE LEDGER: the four lines of business, as pressed entries not boxes ---- */
  .ledger{margin-top:clamp(28px,4vw,44px);}
  .entry{padding:clamp(22px,3vw,30px) 0; border-top:1px solid rgba(40,30,18,.16);
         position:relative;}
  .entry:first-child{border-top:none;}
  .entry .no{font-family:var(--serif); font-size:12px; letter-spacing:.2em; color:var(--gold-deep);
             display:block; margin-bottom:8px;}
  .entry h3{font-family:var(--serif); font-weight:700; font-size:clamp(20px,2.6vw,26px);
            letter-spacing:.12em; text-transform:uppercase; line-height:1.2;}
  .entry p{color:var(--muted); font-size:16px; max-width:560px; margin:10px auto 0;}
  .entry .tag{display:inline-block; margin-top:12px; font-family:var(--serif); font-size:10px;
              letter-spacing:.28em; text-transform:uppercase; color:var(--gold-deep);}

  /* ================= WOODBAND ================= */
  .woodband{position:relative; overflow:hidden; isolation:isolate;
    padding:clamp(52px,8vw,92px) 0; margin:clamp(30px,4vw,54px) 0; text-align:center; background:var(--ash);}
  .woodband::before{content:""; position:absolute; inset:0; z-index:-2;
    background:url('assets/textures/carved.webp') center/cover no-repeat;}
  .woodband::after{content:""; position:absolute; inset:0; z-index:-1; background:rgba(19,24,16,.6);}
  .woodband .gild{position:absolute; top:0; left:0; right:0; height:2px; z-index:2;
    background:url('assets/textures/gold-strip.webp') center/100% 100% no-repeat;}
  .woodband .eyebrow{color:var(--gold);}
  .woodband h2{color:#efe7d6; text-shadow:0 -1px 0 rgba(0,0,0,.55), 0 1px 0 rgba(255,255,255,.08);}
  .woodband p{max-width:600px; margin:16px auto 0; color:#cdc6b2;}

  /* ---- the green seal-block ---- */
  .green-block{position:relative; overflow:hidden; isolation:isolate; background:var(--green);
    border-radius:3px; padding:clamp(30px,4vw,46px); text-align:center;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 3px 2px rgba(255,252,244,.4), 0 14px 34px rgba(40,30,18,.28);}
  .green-block::before{content:""; position:absolute; inset:0; z-index:-1;
    background:url('assets/textures/walnut.webp') center/cover no-repeat; opacity:.2;}
  .green-block .eyebrow{color:var(--gold);}
  .green-block h3{font-family:var(--serif); font-weight:700; color:#efe7d6; font-size:clamp(19px,2.4vw,25px);
    letter-spacing:.06em; text-shadow:0 -1px 0 rgba(0,0,0,.4);}
  .green-block p{color:#c9c2ae; max-width:520px; margin:12px auto 0; font-size:16px;}
  .btn{display:inline-block; margin-top:22px; font-family:var(--serif); font-size:11px; letter-spacing:.24em;
    text-transform:uppercase; text-decoration:none; padding:13px 28px; border-radius:2px;
    background:url('assets/textures/gold.webp') center/cover, var(--gold); color:#241d0f;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 2px 4px rgba(0,0,0,.25);}
  .btn:hover{filter:brightness(1.06);}

  footer{padding:clamp(40px,6vw,72px) 0; text-align:center; color:var(--muted); font-size:12px;
         letter-spacing:.06em;}
  footer .fseal{font-family:var(--serif); letter-spacing:.36em; text-transform:uppercase; font-size:11px;
                color:var(--gold-deep); margin-bottom:10px;}

  /* ===== masthead + nav (multi-page) ===== */
  .masthead{text-align:center; padding:clamp(24px,4vw,40px) 0 clamp(12px,2vw,20px);}
  .masthead .mh-seal{width:clamp(64px,9vw,92px); height:auto; display:block; margin:0 auto 12px;
        filter:drop-shadow(0 1px 0 rgba(255,252,244,.6)) drop-shadow(0 -1px 1px rgba(40,30,18,.24)) drop-shadow(0 5px 10px rgba(40,30,18,.16));}
  .masthead .mh-word{font-family:var(--serif); font-weight:700; font-size:clamp(11px,1.6vw,14px); letter-spacing:.28em; text-transform:uppercase; color:var(--green); text-shadow:0 1px 0 rgba(255,252,244,.7); line-height:1.5;}
  .masthead .mh-word a{color:inherit; text-decoration:none;}
  nav.mnav{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:0 clamp(12px,2vw,22px); margin-top:18px;}
  nav.mnav a{font-family:var(--serif); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-deep); text-decoration:none; padding:7px 0; position:relative; transition:color .2s;}
  nav.mnav a:hover, nav.mnav a.here{color:var(--green);}
  nav.mnav a.here::after{content:""; position:absolute; left:0; right:0; bottom:1px; border-top:1px solid var(--gold-deep); opacity:.55;}
  nav.mnav .sep{color:var(--gold-deep); opacity:.4; font-size:8px; transform:translateY(-1px);}
  .mh-hr{border:none; border-top:1px solid var(--gold-deep); opacity:.35; max-width:600px; margin:clamp(16px,2vw,22px) auto 0;}

  /* page header for sub-pages (no giant seal, the masthead carries the brand) */
  .phead{text-align:center; padding:clamp(34px,5vw,60px) 0 clamp(10px,2vw,20px);}
  .phead .eyebrow{margin-bottom:12px;}
  .phead h1{font-family:var(--serif); font-weight:700; font-size:clamp(26px,4vw,44px); letter-spacing:.1em; text-transform:uppercase; line-height:1.15; color:var(--green); text-shadow:0 1px 0 rgba(255,252,244,.7), 0 -1px 1px rgba(28,40,22,.3);}
  .phead .lede{margin-top:18px;}
  .prose{max-width:600px; margin:clamp(20px,3vw,34px) auto 0;}
  .prose p{color:var(--muted); font-size:17px; margin-bottom:18px;}
  .prose p.first::first-letter{font-family:var(--serif); font-weight:700; color:var(--green); font-size:3.1em; line-height:.8; float:left; margin:6px 10px 0 0;}
  .prose h3{font-family:var(--serif); font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--green); font-size:15px; margin:26px 0 10px;}
  .backhome{display:block; text-align:center; margin-top:clamp(30px,4vw,50px); font-family:var(--serif); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); text-decoration:none;}
  .backhome:hover{color:var(--green);}