/* ==========================================================
     IRONWOOD - the loud one.
     Anton caps at scale, Ironwood gold used as big blocks
     rather than hairlines, hard black/gold/white banding.
     Mobile-first: base rules are the phone, min-width adds up.
     ========================================================== */
  :root{
    --gold:#C18B3D;
    --gold-hi:#D8984B;
    --gold-ink:#7E4E14;
    --black:#000000;
    --ink:#121110;
    --paper:#FFFFFF;
    --surface:#F4F2EE;
    --muted:#66615A;
    --line:#E0DCD4;
    --cream:#EBDCB2;

    --disp:'Anton',Impact,'Haettenschweiler','Arial Narrow Bold',sans-serif;
    --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
    --gut:1.15rem;
    --band:3.2rem;
    --max:1240px;
  }
  @media (min-width:700px){:root{--gut:2.2rem;--band:4.4rem}}
  @media (min-width:1100px){:root{--gut:3.2rem;--band:5.6rem}}

  *{box-sizing:border-box}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
  html,body{overflow-x:clip}
  body{margin:0;background:var(--paper);color:var(--ink);
    font-family:var(--sans);font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
  img{max-width:100%;display:block;height:auto}
  a{color:inherit}
  .wrap{max-width:var(--max);margin:0 auto}
  .band{padding:var(--band) var(--gut)}

  /* ---- display type: Anton, caps, tight ---- */
  h1,h2,h3,.disp{font-family:var(--disp);font-weight:400;text-transform:uppercase;
    letter-spacing:-.004em;line-height:.92;margin:0}
  h1{font-size:clamp(2.6rem,10.4vw,6.4rem)}
  h2{font-size:clamp(2rem,6vw,4rem)}
  h3{font-size:clamp(1.3rem,2.4vw,1.75rem);line-height:.98}
  p{margin:0}
  .lede{font-size:1.02rem;line-height:1.58;color:var(--muted);max-width:52ch}
  @media (min-width:700px){.lede{font-size:1.1rem}}
  .kick{display:inline-block;font-family:var(--sans);font-size:.72rem;font-weight:800;
    letter-spacing:.16em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.9rem}

  /* ---- buttons: chunky, squared, loud ---- */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
    min-height:52px;padding:.95rem 1.7rem;border-radius:6px;
    font-family:var(--sans);font-size:.88rem;font-weight:800;letter-spacing:.055em;
    text-transform:uppercase;text-decoration:none;border:2px solid transparent;
    line-height:1.1;text-align:center;transition:background .15s,border-color .15s,color .15s}
  .btn-gold{background:var(--gold);color:#120B02;border-color:var(--gold)}
  .btn-gold:hover{background:var(--gold-hi);border-color:var(--gold-hi)}
  .btn-black{background:var(--black);color:#fff;border-color:var(--black)}
  .btn-black:hover{background:#2A2622;border-color:#2A2622}
  .btn-out{background:transparent;color:var(--ink);border-color:var(--ink)}
  .btn-out:hover{background:var(--ink);color:#fff}
  .btn-outw{background:transparent;color:#fff;border-color:#fff}
  .btn-outw:hover{background:#fff;color:var(--black)}
  .btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
  .btn svg{width:17px;height:17px;flex:0 0 auto}

  /* ---- gold utility bar ---- */
  .util{background:var(--gold);color:#120B02}
  .util .wrap{max-width:var(--max);margin:0 auto;padding:.5rem var(--gut);
    display:flex;align-items:center;justify-content:center;gap:1rem;
    font-family:var(--sans);font-size:.76rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
  .util a{color:#120B02;text-decoration:none;display:inline-flex;align-items:center;min-height:40px}
  .util .hide-sm{display:none}
  @media (min-width:800px){
    .util .wrap{justify-content:space-between}
    .util .hide-sm{display:inline-flex;align-items:center}
    .util a{min-height:0}
  }

  /* ---- header ---- */
  .hdr{position:sticky;top:0;z-index:70;background:var(--black)}
  .hdr .wrap{max-width:var(--max);margin:0 auto;padding:.55rem var(--gut);
    display:flex;align-items:center;gap:1rem}
  .hdr .brand img{height:48px;width:auto}
  @media (min-width:700px){.hdr .brand img{height:58px}}
  .hdr nav{display:none}
  .hdr .acts{display:flex;align-items:center;gap:.5rem;margin-left:auto}
  .hdr .acts .btn{min-height:44px;padding:.65rem 1.1rem;font-size:.78rem}
  .tel-ic{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;
    border-radius:6px;border:2px solid rgba(255,255,255,.35);color:#fff}
  .tel-ic svg{width:19px;height:19px}
  .tel-ic:hover{border-color:var(--gold);color:var(--gold)}
  @media (min-width:1040px){
    .hdr nav{display:flex;align-items:center;gap:1.6rem;margin-left:1.6rem}
    .hdr nav a{font-family:var(--sans);font-size:.8rem;font-weight:800;letter-spacing:.09em;
      text-transform:uppercase;color:rgba(255,255,255,.88);text-decoration:none}
    .hdr nav a:hover{color:var(--gold)}
    .tel-ic{display:none}
  }
  .navitem{position:relative;display:inline-flex}
  .navtop{display:inline-flex;align-items:center;gap:.3rem;cursor:pointer}
  .navtop svg{width:11px;height:11px;transition:transform .18s}
  .navitem:hover .navtop svg{transform:rotate(180deg)}
  .navitem::after{content:"";position:absolute;top:100%;left:0;right:0;height:1rem}
  .drop{position:absolute;top:100%;left:-.8rem;margin-top:1rem;min-width:252px;padding:.35rem;
    background:var(--black);border:2px solid var(--gold);display:grid;gap:1px;
    opacity:0;visibility:hidden;transform:translateY(-5px);
    transition:opacity .15s,transform .15s,visibility .15s;z-index:80}
  .navitem:hover .drop,.navitem:focus-within .drop{opacity:1;visibility:visible;transform:none}
  .drop a{display:block;padding:.7rem .85rem;font-size:.82rem;font-weight:700;letter-spacing:.05em;
    text-transform:uppercase;color:#fff}
  .drop a:hover{background:var(--gold);color:#120B02}
  @media (prefers-reduced-motion:reduce){.drop{transition:none}.navtop svg{transition:none}}

  /* ---- hero ---- */
  .hero{position:relative;isolation:isolate;background:var(--black);
    min-height:clamp(460px,76vh,640px);display:flex;align-items:center;text-align:center}
  .hero picture,.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
  .hero::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(10,8,5,.62)}
  .hero .wrap{width:100%;max-width:1000px;margin:0 auto;padding:4.2rem var(--gut)}
  .hero h1{color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.4)}
  .hero .rule{height:5px;width:88px;background:var(--gold);margin:1.4rem auto}
  .hero p{color:#fff;font-family:var(--sans);font-size:.95rem;font-weight:800;
    letter-spacing:.075em;text-transform:uppercase;line-height:1.5;max-width:34ch;margin:0 auto}
  @media (min-width:700px){.hero p{font-size:1.06rem;max-width:44ch}}
  .hero .cta{display:flex;flex-direction:column;gap:.6rem;margin-top:2rem}
  @media (min-width:560px){.hero .cta{flex-direction:row;justify-content:center;flex-wrap:wrap}}

  /* ---- gold stat strip ---- */
  .stats{background:var(--gold);color:#120B02}
  .stats .wrap{max-width:var(--max);margin:0 auto;padding:1.4rem var(--gut);
    display:grid;grid-template-columns:1fr 1fr;gap:1.2rem .9rem}
  .stats div{text-align:center}
  .stats b{display:block;font-family:var(--disp);font-size:clamp(1.9rem,6vw,2.9rem);
    line-height:.9;text-transform:uppercase}
  .stats span{display:block;font-size:.69rem;font-weight:800;letter-spacing:.11em;
    text-transform:uppercase;margin-top:.35rem;line-height:1.3}
  @media (min-width:800px){.stats .wrap{grid-template-columns:repeat(4,1fr);padding:1.7rem var(--gut)}}

  /* ---- what we build ---- */
  .build{background:var(--ink);color:#fff}
  .build .kick{color:var(--gold)}
  .build h2{color:#fff}
  .build .grid{display:grid;gap:.7rem;margin-top:2rem}
  .build a{display:flex;align-items:center;gap:1rem;padding:1.15rem 1.25rem;
    background:rgba(255,255,255,.055);border-left:5px solid var(--gold);
    text-decoration:none;color:#fff;min-height:72px;transition:background .15s}
  .build a:hover{background:rgba(193,139,61,.2)}
  .build a .n{font-family:var(--disp);font-size:1.45rem;color:var(--gold);line-height:1;flex:0 0 auto}
  .build a .t{display:grid;gap:.1rem;flex:1 1 auto}
  .build a .t b{font-family:var(--disp);font-size:1.12rem;font-weight:400;
    text-transform:uppercase;letter-spacing:.004em;line-height:1.05}
  .build a .t span{font-size:.86rem;color:rgba(255,255,255,.66);line-height:1.35}
  .build a svg{width:19px;height:19px;color:var(--gold);flex:0 0 auto;transition:transform .15s}
  .build a:hover svg{transform:translateX(4px)}
  @media (min-width:760px){.build .grid{grid-template-columns:1fr 1fr}}

  /* ---- alternating photo rows ---- */
  .row .wrap{max-width:var(--max);margin:0 auto;display:grid;gap:1.5rem}
  .row figure{margin:0;overflow:hidden;background:var(--surface);border-bottom:6px solid var(--gold)}
  .row figure img{width:100%;aspect-ratio:4/3;object-fit:cover}
  .row .copy{display:grid;gap:.9rem;align-content:center;justify-items:start}
  @media (min-width:900px){
    .row .wrap{grid-template-columns:1fr 1fr;gap:clamp(2rem,4.5vw,4rem);align-items:center}
    .row.flip figure{order:2}
    .row figure img{aspect-ratio:5/4}
  }

  /* ---- why: big numerals on black ---- */
  .why{background:var(--black);color:#fff}
  .why .kick{color:var(--gold)}
  .why h2{color:#fff}
  .whys{display:grid;gap:1.9rem;margin-top:2.2rem}
  .why-i{display:grid;gap:.4rem;padding-top:1rem;border-top:4px solid var(--gold)}
  .why-i .n{font-family:var(--disp);font-size:2.3rem;color:var(--gold);line-height:.9}
  .why-i h3{color:#fff}
  .why-i p{color:rgba(255,255,255,.68);font-size:.95rem;line-height:1.5}
  @media (min-width:820px){.whys{grid-template-columns:repeat(4,1fr);gap:1.8rem}}

  /* ---- steps ---- */
  .steps{display:grid;gap:1.8rem;margin-top:2.2rem}
  .stp{display:grid;gap:.4rem;padding-top:1rem;border-top:4px solid var(--gold)}
  .stp .n{font-family:var(--disp);font-size:2.3rem;color:var(--gold);line-height:.9}
  .stp p{color:var(--muted);font-size:.95rem;line-height:1.5}
  @media (min-width:800px){.steps{grid-template-columns:repeat(3,1fr);gap:2rem}}

  /* ---- financing ---- */
  .fin{background:var(--surface)}
  .fin .wrap{max-width:var(--max);margin:0 auto;display:grid;gap:1.6rem}
  .fin ul{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.65rem}
  .fin li{display:flex;gap:.6rem;align-items:flex-start;font-size:.97rem;font-weight:600}
  .fin li svg{width:18px;height:18px;color:var(--gold-ink);flex:0 0 auto;margin-top:.2rem}
  .fin .cta{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem}
  .finprint{font-size:.77rem;line-height:1.55;color:var(--muted)}
  @media (min-width:880px){.fin .wrap{grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}}

  /* ---- big gold CTA ---- */
  .cta-band{background:var(--gold);color:#120B02;text-align:center}
  .cta-band h2{color:#120B02;max-width:18ch;margin:0 auto}
  .cta-band p{font-weight:800;font-size:.86rem;letter-spacing:.1em;text-transform:uppercase;
    margin-top:1rem}
  .cta-band .acts{display:flex;flex-direction:column;gap:.6rem;margin-top:1.9rem;align-items:center}
  @media (min-width:560px){.cta-band .acts{flex-direction:row;justify-content:center}}

  /* ---- area ---- */
  .area .wrap{max-width:var(--max);margin:0 auto;display:grid;gap:2rem}
  .towns{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.3rem}
  .towns a,.towns span{display:inline-flex;align-items:center;min-height:42px;padding:.45rem .95rem;
    border:2px solid var(--line);background:var(--paper);font-size:.8rem;font-weight:800;
    letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-decoration:none}
  .towns a:hover{border-color:var(--gold);color:var(--gold-ink)}
  .visit{background:var(--black);color:#fff;padding:1.6rem;display:grid;gap:.6rem;align-content:start;
    border-top:6px solid var(--gold)}
  .visit .kick{color:var(--gold)}
  .visit .addr{font-family:var(--disp);font-size:1.4rem;text-transform:uppercase;line-height:1.05}
  .visit p{color:rgba(255,255,255,.7);font-size:.92rem}
  .visit .acts{display:grid;gap:.55rem;margin-top:.7rem}
  @media (min-width:880px){.area .wrap{grid-template-columns:1.1fr .9fr;gap:3rem;align-items:start}
    .visit{padding:2rem}}

  /* ---- form ---- */
  .request{background:var(--surface);border-top:6px solid var(--gold)}
  .jobberform{background:var(--paper);border:2px solid var(--line);padding:1.1rem;
    max-width:760px;margin-top:1.8rem;overflow:hidden}
  @media (min-width:700px){.jobberform{padding:2rem}}
  .jobberform input,.jobberform textarea,.jobberform select{
    font-family:var(--sans)!important;max-width:100%!important;font-size:16px!important}
  .jobberform iframe{width:100%!important;max-width:100%!important}
  .fallback{margin-top:1.1rem;color:var(--muted);font-size:.93rem}
  .fallback a{color:var(--gold-ink);font-weight:800}

  /* ---- footer ---- */
  footer{background:var(--black);color:rgba(255,255,255,.72);padding:3rem var(--gut) 6.5rem}
  @media (min-width:760px){footer{padding-bottom:3.2rem}}
  footer .wrap{max-width:var(--max);margin:0 auto;display:grid;gap:2rem}
  footer img{height:58px;width:auto;margin-bottom:1rem}
  footer h4{font-family:var(--sans);font-size:.72rem;font-weight:800;letter-spacing:.14em;
    text-transform:uppercase;color:var(--gold);margin:0 0 .8rem}
  footer a{color:rgba(255,255,255,.9);text-decoration:none}
  footer a:hover{color:var(--gold)}
  footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;font-size:.94rem}
  footer ul a{display:inline-flex;align-items:center;min-height:44px}
  footer .small{font-size:.93rem;line-height:1.55;max-width:34ch}
  .legal{border-top:2px solid rgba(255,255,255,.16);margin-top:2.2rem;padding-top:1.2rem;
    font-size:.82rem;color:rgba(255,255,255,.62)}
  .legal a{display:inline-block;padding:.5rem 0}
  @media (min-width:820px){footer .wrap{grid-template-columns:1.4fr 1fr 1fr}
    footer ul a{min-height:32px}.legal a{padding:0}}

  /* ---- mobile bar ---- */
  .bar{position:fixed;left:0;right:0;bottom:0;z-index:90;display:flex;gap:.5rem;
    padding:.55rem .7rem calc(.55rem + env(safe-area-inset-bottom));
    background:var(--black);border-top:3px solid var(--gold)}
  .bar .btn{flex:1;min-height:50px;padding:.8rem .6rem;font-size:.8rem}
  @media (min-width:760px){.bar{display:none}}

/* ==========================================================
   SUBPAGE COMPONENTS
   The twelve inner pages share one class vocabulary. Everything
   below restyles it in the same loud idiom as the homepage:
   Anton caps, gold used as blocks and edges, hard banding.
   Page copy is untouched - only the presentation changed.
   ========================================================== */

/* ---- page header (replaces the homepage hero) ---- */
.phead{background:var(--black);color:#fff;
  padding:clamp(2.6rem,7vw,4.4rem) var(--gut) clamp(2.2rem,5vw,3.4rem);
  border-bottom:6px solid var(--gold)}
.phead .wrap{max-width:var(--max);margin:0 auto}
.phead .eyebrow,.phead .kick{color:var(--gold);display:block;margin-bottom:.8rem}
.phead h1{color:#fff;max-width:20ch;font-size:clamp(2.2rem,7.4vw,4.4rem)}
.phead .lede{color:rgba(255,255,255,.76);margin-top:1.2rem;max-width:56ch}
.phead .btn{margin-top:1.6rem}

/* ---- in-page sub navigation ---- */
.subnav{position:sticky;top:0;z-index:40;background:var(--ink);
  border-bottom:2px solid var(--gold);padding:0 var(--gut)}
.subnav-in{max-width:var(--max);margin:0 auto;display:flex;gap:1.6rem;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.subnav-in::-webkit-scrollbar{display:none}
.subnav a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:50px;
  font-size:.76rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(255,255,255,.72);text-decoration:none;white-space:nowrap}
.subnav a:hover{color:var(--gold)}

/* ---- bands ---- */
.band.tint{background:var(--surface)}
.band.dark{background:var(--black);color:#fff}
.band.dark h2,.band.dark h3{color:#fff}
.band.dark .lede{color:rgba(255,255,255,.7)}
.band.dark .kick,.band.dark .eyebrow{color:var(--gold)}
.band.cta{background:var(--gold);color:#120B02;text-align:center}
.band.cta h2{color:#120B02;max-width:20ch;margin:0 auto}
.band.cta .lede{color:rgba(18,11,2,.78);margin:1rem auto 0;text-align:center}
.cta-actions{display:flex;flex-direction:column;gap:.6rem;margin-top:1.8rem;align-items:center}
@media (min-width:560px){.cta-actions{flex-direction:row;justify-content:center}}

.sec-head{max-width:54ch;margin-bottom:clamp(1.8rem,3vw,2.6rem)}
.sec-head h2+.lede,.sec-head .lede{margin-top:1rem}
.eyebrow,.kicker{display:inline-block;font-family:var(--sans);font-size:.72rem;font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.9rem}
.band.dark .kicker,.band.cta .kicker{color:var(--gold)}
.subhead{font-family:var(--disp);text-transform:uppercase;font-size:clamp(1.5rem,3vw,2.1rem);
  line-height:.96;margin:2.8rem 0 0}

/* ---- panels: gold left edge instead of a rounded card ---- */
.panel{background:var(--surface);border-left:5px solid var(--gold);
  padding:1.5rem 1.5rem 1.6rem;display:grid;gap:.6rem;align-content:start}
.panel h3{font-family:var(--disp);text-transform:uppercase;font-size:1.2rem;line-height:1.02}
.panel p{color:var(--muted);font-size:.96rem}
.panel ul{margin:.3rem 0 0;padding-left:1.1rem;color:var(--muted);font-size:.95rem;display:grid;gap:.4rem}
.panel .pico{width:38px;height:38px;display:grid;place-items:center;
  background:var(--gold);color:#120B02;margin-bottom:.3rem}
.panel .pico svg{width:20px;height:20px}
.band.dark .panel{background:rgba(255,255,255,.055);border-left-color:var(--gold)}
.band.dark .panel p,.band.dark .panel ul{color:rgba(255,255,255,.7)}
.duo{display:grid;gap:.9rem}
@media (min-width:820px){.duo{grid-template-columns:1fr 1fr}}

/* ---- decking line cards ---- */
.lineup{display:grid;gap:.9rem;margin-top:2rem;align-items:start}
@media (min-width:820px){.lineup{grid-template-columns:1fr 1fr}}
.dl{background:var(--surface);border-left:5px solid var(--gold);padding:1.5rem 1.5rem 1.7rem}
.dl h3{margin:0;font-family:var(--disp);text-transform:uppercase;font-size:1.3rem;line-height:1.02}
.dl .sub{color:var(--muted);font-size:.86rem;margin:.3rem 0 0}
.colorlist{margin:1.05rem 0 0;font-size:.92rem;line-height:1.6;color:var(--muted)}
.colorlist b{display:block;color:var(--ink);font-weight:800;font-size:.7rem;
  letter-spacing:.12em;text-transform:uppercase;margin-bottom:.2rem}

/* ---- tags, pills, badges: squared and shouty ---- */
.tags{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.85rem}
.tag,.pill,.warr{display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;padding:.3rem .55rem;background:var(--ink);color:#fff;line-height:1.25}
.tag.gold,.pill,.warr{background:var(--gold);color:#120B02}
.tag.pvc{background:#2C6675;color:#fff}
.tag.comp{background:#6A6034;color:#fff}
.band.dark .warr,.band.dark .pill{background:var(--gold);color:#120B02}

/* ---- rank meter ---- */
.rank{display:inline-flex;gap:3px;vertical-align:middle;margin-right:.6rem}
.rank i{width:6px;height:14px;background:var(--line);display:block}
.rank i.on{background:var(--gold)}
.band.dark .rank i{background:rgba(255,255,255,.22)}
.band.dark .rank i.on{background:var(--gold)}
.tier{color:var(--muted);font-size:.88rem}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.ln{font-weight:700}
.tnote,.swnote{font-size:.85rem;color:var(--muted);margin-top:1.2rem;line-height:1.6;max-width:76ch}

/* ---- tables ---- */
.tablewrap{overflow-x:auto;border:2px solid var(--line);background:var(--paper);
  -webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:460px;font-size:.94rem}
thead th{text-align:left;font-family:var(--sans);font-size:.68rem;font-weight:800;
  letter-spacing:.13em;text-transform:uppercase;color:#120B02;background:var(--gold);
  padding:.9rem 1.2rem;white-space:nowrap}
tbody td{padding:.9rem 1.2rem;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--surface)}
thead th:last-child,tbody td:last-child{text-align:right}
#compare-lines .tablewrap{max-width:1060px}

/* ---- cost drivers ---- */
.drivers{display:grid;gap:.9rem}
@media (min-width:760px){.drivers{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1040px){.drivers{grid-template-columns:repeat(3,1fr)}}
.driver{background:var(--surface);border-top:4px solid var(--gold);
  padding:1.4rem 1.4rem 1.5rem;display:grid;gap:.45rem;align-content:start;position:relative}
.driver .dnum{font-family:var(--disp);font-size:1.9rem;line-height:.9;color:var(--gold)}
.driver strong{font-family:var(--disp);font-weight:400;text-transform:uppercase;
  font-size:1.12rem;line-height:1.04}
.driver p{color:var(--muted);font-size:.94rem}

/* ---- material blocks ---- */
.matduo{display:grid;gap:.9rem;margin-top:2.2rem}
@media (min-width:820px){.matduo{grid-template-columns:1fr 1fr}}
.mat{background:var(--surface);border-left:5px solid var(--gold);padding:1.6rem 1.5rem}
.mat h3{margin:.6rem 0 .5rem;font-family:var(--disp);text-transform:uppercase;
  font-size:1.35rem;line-height:1.02}
.mat ul{margin:.9rem 0 0;padding-left:1.1rem;color:var(--muted)}
.mat li{margin:.4rem 0}
.mat li b{color:var(--ink);font-weight:700}

/* ---- full-bleed photo band ---- */
.photoband{position:relative;height:clamp(220px,30vw,380px);overflow:hidden;display:grid;place-items:center}
.photoband img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photoband::after{content:"";position:absolute;inset:0;background:rgba(8,6,4,.62)}
.photoband .pb{position:relative;z-index:2;text-align:center;padding:0 var(--gut);
  display:grid;gap:.9rem;justify-items:center}
.photoband p{color:#fff;font-family:var(--disp);text-transform:uppercase;
  font-size:clamp(1.5rem,4vw,2.6rem);line-height:.98;max-width:22ch}
.photoband span{color:var(--gold);font-size:.74rem;letter-spacing:.16em;
  text-transform:uppercase;font-weight:800}

/* ---- legal / privacy ---- */
.legalbody{max-width:70ch}
.legalbody h3{margin:2.4rem 0 .7rem;font-family:var(--disp);text-transform:uppercase;font-size:1.3rem}
.legalbody p{color:var(--muted);margin:.85rem 0;line-height:1.75}
.legalbody ul{color:var(--muted);margin:.85rem 0;padding-left:1.15rem;display:grid;gap:.5rem;line-height:1.7}
.legalbody a{color:var(--gold-ink);font-weight:700}
.legalbody strong{color:var(--ink)}
.updated{font-size:.88rem;color:var(--muted);margin-top:.6rem}

/* ---- legacy button aliases used in page copy ---- */
.btn-dark{background:var(--black);color:#fff;border-color:var(--black)}
.btn-dark:hover{background:#2A2622;border-color:#2A2622}
.btn-outline-dark{background:transparent;color:#120B02;border-color:#120B02}
.btn-outline-dark:hover{background:#120B02;color:var(--gold)}
.btn-line{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-line:hover{background:var(--ink);color:#fff}
.band.dark .btn-line{color:#fff;border-color:#fff}
.band.dark .btn-line:hover{background:#fff;color:var(--black)}

/* ---- misc inherited from the old pages ---- */
.lede{color:var(--muted);font-size:1.02rem;line-height:1.58;max-width:52ch}
@media (min-width:700px){.lede{font-size:1.08rem}}
.grid3{display:grid;gap:.9rem}
@media (min-width:820px){.grid3{grid-template-columns:repeat(3,1fr)}}

/* ---- FAQ accordions ---------------------------------------------
   Missed in the first conversion pass; details/summary were falling
   back to the browser's bare disclosure triangles. -------------- */
details{background:var(--paper);border-left:5px solid var(--gold);padding:1.1rem 1.3rem}
details+details{margin-top:.6rem}
.band.tint details{background:var(--paper)}
summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;min-height:30px;font-family:var(--disp);text-transform:uppercase;font-weight:400;
  font-size:1.08rem;line-height:1.08;letter-spacing:.002em}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--sans);font-weight:800;font-size:1.5rem;line-height:1;
  color:var(--gold-ink);flex:0 0 auto}
details[open] summary::after{content:"–"}
details p{color:var(--muted);margin-top:.85rem;font-size:.96rem;line-height:1.6}
summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

/* ---- table captions ---- */
caption{caption-side:top;text-align:left;padding:.85rem 1.2rem;background:var(--ink);color:#fff;
  font-family:var(--sans);font-size:.72rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}