@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,680&family=Work+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --bg:#FCFBF6;
  --surface:#FFFFFF;
  --ink:#16201A;
  --ink-soft:#5C6B60;
  --green:#1F6E43;
  --green-deep:#0F3C27;
  --mustard:#E7A33E;
  --mustard-deep:#C9862A;
  --line:#DDE3DA;
  --radius:14px;
  --maxw:920px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'Work Sans', sans-serif;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--green);}
a:focus-visible, button:focus-visible{outline:2px solid var(--mustard); outline-offset:2px;}

img{max-width:100%; display:block;}

/* ---------- Top bar ---------- */
.topbar{
  position:sticky; top:0; z-index:50;
  background:var(--green-deep);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.topbar-inner{
  max-width:1100px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand img{height:34px; width:auto; border-radius:6px;}
.brand-name{
  font-family:'Fraunces', serif; font-weight:600; font-size:1.15rem;
  color:#F6F4EC; letter-spacing:.01em;
}
.brand-tag{
  display:none;
  font-family:'IBM Plex Mono', monospace; font-size:.68rem;
  color:var(--mustard); text-transform:uppercase; letter-spacing:.14em;
}

nav.mainnav{display:flex; align-items:center; gap:4px;}
nav.mainnav a{
  color:#E7ECE4; text-decoration:none; font-size:.92rem; font-weight:500;
  padding:8px 12px; border-radius:8px; transition:background .15s ease, color .15s ease;
}
nav.mainnav a:hover{background:rgba(255,255,255,.08); color:#fff;}
nav.mainnav a.active{color:var(--mustard);}

.navtoggle{
  display:none; background:none; border:1px solid rgba(255,255,255,.25); border-radius:8px;
  width:38px; height:38px; cursor:pointer; position:relative;
}
.navtoggle span, .navtoggle::before, .navtoggle::after{
  content:''; position:absolute; left:9px; right:9px; height:2px; background:#F6F4EC;
}
.navtoggle span{top:18px;}
.navtoggle::before{top:12px;}
.navtoggle::after{top:24px;}

@media (max-width: 720px){
  .brand-name{font-size:1.05rem;}
  .navtoggle{display:block;}
  nav.mainnav{
    display:none; position:absolute; top:100%; left:0; right:0;
    background:var(--green-deep); flex-direction:column; align-items:stretch;
    padding:6px 14px 14px; border-bottom:1px solid rgba(255,255,255,.08);
  }
  nav.mainnav.open{display:flex;}
  nav.mainnav a{padding:12px 10px; border-top:1px solid rgba(255,255,255,.06);}
}

/* ---------- Hero ---------- */
.hero{
  max-width:var(--maxw); margin:0 auto; padding:52px 20px 28px;
}
.eyebrow{
  font-family:'IBM Plex Mono', monospace; font-size:.72rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--green); display:flex; align-items:center; gap:10px;
}
.eyebrow::before{content:''; width:22px; height:1px; background:var(--mustard-deep);}
.hero h1{
  font-family:'Fraunces', serif; font-weight:680; font-size:clamp(2rem, 5vw, 2.9rem);
  margin:.4em 0 .2em; letter-spacing:-.01em; color:var(--ink);
}
.hero .updated{
  font-family:'IBM Plex Mono', monospace; font-size:.78rem; color:var(--ink-soft);
}
.hero p.lede{
  max-width:62ch; color:var(--ink-soft); font-size:1.02rem; margin-top:14px;
}

/* ---------- Content ---------- */
main.content{
  max-width:var(--maxw); margin:0 auto; padding:8px 20px 64px;
}
.policy section{margin-top:38px;}
.policy h2{
  font-family:'Fraunces', serif; font-weight:600; font-size:1.35rem;
  display:flex; align-items:baseline; gap:12px; color:var(--ink);
}
.policy h2 .num{
  font-family:'IBM Plex Mono', monospace; font-size:.85rem; color:var(--mustard-deep);
  font-weight:500;
}
.policy h3{font-size:1.05rem; font-weight:600; margin-bottom:.3em;}
.policy p{color:#2B342E;}
.policy ul, .policy ol{padding-left:1.3em; color:#2B342E;}
.policy li{margin:.3em 0;}
.policy table{width:100%; border-collapse:collapse; margin:14px 0; font-size:.94rem;}
.policy th, .policy td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line);}
.policy th{font-family:'IBM Plex Mono', monospace; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft);}

.note{
  background:#F3F6EF; border-left:3px solid var(--green);
  padding:12px 16px; border-radius:0 8px 8px 0; font-size:.93rem; color:#33402F;
}

/* ---------- Quick nav pills (support page) ---------- */
.pillrow{display:flex; flex-wrap:wrap; gap:10px; margin:18px 0 6px;}
.pill{
  border:1px solid var(--line); background:var(--surface); border-radius:999px;
  padding:9px 16px; font-size:.9rem; text-decoration:none; color:var(--ink);
  display:flex; align-items:center; gap:8px;
}
.pill:hover{border-color:var(--green);}
.pill .dot{width:6px; height:6px; border-radius:50%; background:var(--mustard);}

/* ---------- Contact cards (support page) ---------- */
.cardgrid{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:16px; margin-top:20px;}
.card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px;
}
.card .label{font-family:'IBM Plex Mono', monospace; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft);}
.card .value{font-family:'Fraunces', serif; font-size:1.25rem; font-weight:600; margin-top:6px;}
.card .value a{color:var(--ink); text-decoration:none;}
.card .sub{color:var(--ink-soft); font-size:.85rem; margin-top:4px;}

.mapwrap{
  border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); margin-top:20px;
}
.mapwrap iframe{width:100%; height:320px; border:0; display:block;}

/* ---------- Receipt / slip signature block ---------- */
.slip{
  position:relative;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
  padding:26px 26px 22px;
  max-width:420px;
}
.slip::before{
  content:'';
  position:absolute; top:-9px; left:0; right:0; height:18px;
  background:
    radial-gradient(circle at 9px 9px, transparent 9px, var(--surface) 9.5px) repeat-x;
  background-size:18px 18px;
}
.slip-head{
  font-family:'Fraunces', serif; font-weight:600; font-size:1.1rem;
  display:flex; align-items:center; gap:8px;
}
.slip-head .tick{
  width:20px; height:20px; border-radius:50%; background:var(--green);
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
}
.slip-head .tick svg{width:11px; height:11px;}
.slip-sub{font-family:'IBM Plex Mono', monospace; font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); margin:2px 0 14px 28px;}
.slip-row{
  display:flex; justify-content:space-between; gap:14px;
  font-family:'IBM Plex Mono', monospace; font-size:.82rem;
  padding:9px 0; border-top:1px dashed var(--line);
}
.slip-row:first-of-type{border-top:none;}
.slip-row dt{color:var(--ink-soft);}
.slip-row dd{margin:0; text-align:right; color:var(--ink); font-weight:500;}
.slip-row dd a{color:var(--ink);}

/* ---------- Footer ---------- */
footer{
  background:var(--green-deep); color:#E7ECE4; margin-top:70px;
  padding:0 20px 40px;
}
.footer-inner{max-width:1100px; margin:0 auto; padding-top:0;}
.slip-lift{transform:translateY(-46px); margin-bottom:-46px;}
.footer-grid{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:30px;
  padding-top:60px;
}
.footer-links{display:flex; flex-direction:column; gap:8px;}
.footer-links a{color:#CBD6C6; text-decoration:none; font-size:.92rem;}
.footer-links a:hover{color:#fff;}
.footer-title{font-family:'IBM Plex Mono', monospace; font-size:.7rem; text-transform:uppercase; letter-spacing:.14em; color:var(--mustard); margin-bottom:10px;}
.footer-bottom{
  max-width:1100px; margin:26px auto 0; padding-top:18px;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:.8rem; color:#9FB09A; display:flex; flex-wrap:wrap; gap:8px 16px; justify-content:space-between;
}
