:root{
  --green:#0c3b2e; --green-d:#082a21; --green-l:#e1ece6; --lime:#d9f564; --lime-d:#b9d93a;
  --paper:#f4f2ea; --white:#fffefa; --ink:#14201b; --muted:#53615a; --stamp:#1f3fa6; --rule:rgba(12,59,46,.2);
  --display:'Young Serif',Georgia,serif; --body:'Figtree',system-ui,sans-serif; --mono:'DM Mono',ui-monospace,Menlo,monospace;
}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{font-family:var(--body);background:var(--paper);color:var(--ink);font-size:1.0625rem;line-height:1.65;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;line-height:1.08;letter-spacing:-.01em;color:var(--green)}
a{color:var(--stamp)}
.eyebrow{font-family:var(--mono);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stamp);margin-bottom:.8rem;display:block}
.on-dark .eyebrow,.hero .eyebrow{color:var(--lime)}
.section{padding:5.5rem 0}
.btn{font-family:var(--body);font-weight:700;border-radius:999px;padding:.8rem 1.6rem;letter-spacing:.01em}
.btn-lime{background:var(--lime);color:var(--green-d);border:2px solid var(--lime)}
.btn-lime:hover{background:#e7ff82;border-color:#e7ff82;color:var(--green-d)}
.btn-outline-lt{border:2px solid rgba(255,255,255,.7);color:#fff}
.btn-outline-lt:hover{background:#fff;color:var(--green)}
.btn-green{background:var(--green);color:#fff;border:2px solid var(--green)}
.btn-green:hover{background:var(--green-d);color:#fff}

/* navbar: minimal bar + full-screen overlay menu */
.topbar{position:sticky;top:0;z-index:1030;background:var(--paper);border-bottom:1px solid var(--rule)}
.topbar .inner{display:flex;align-items:center;gap:1rem;min-height:68px}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--green);margin-right:auto}
.brand img{height:44px;width:auto}
.brand-name{font-family:var(--display);font-size:1.2rem;line-height:1.05;display:block}
.brand-sub{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:block}
.top-phone{font-family:var(--mono);font-size:.9rem;color:var(--green);text-decoration:none;font-weight:500}
.menu-btn{background:var(--green);color:#fff;border:0;border-radius:999px;padding:.55rem 1.2rem;font-weight:700;display:flex;align-items:center;gap:.5rem}
.menu-btn:hover{background:var(--green-d)}
.offcanvas.menu-full{--bs-offcanvas-height:100vh;height:100vh;background:var(--green);color:#fff}
.menu-full .offcanvas-header{padding:1rem 1.5rem}
.menu-full .brand-name{color:#fff}
.menu-full .btn-close{filter:invert(1);opacity:1;font-size:1.2rem}
.menu-list{list-style:none;padding:0;margin:0}
.menu-list a{display:flex;align-items:baseline;gap:1rem;font-family:var(--display);font-size:clamp(1.7rem,4.4vw,3rem);color:#fff;text-decoration:none;padding:.35rem 0;border-bottom:1px solid rgba(255,255,255,.14)}
.menu-list a:hover{color:var(--lime)}
.menu-list small{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;color:var(--lime);text-transform:uppercase}

/* hero */
.hero{position:relative;background:var(--green);color:#fff;overflow:hidden;padding:5rem 0 6rem}
.hero .graticule{position:absolute;right:-12%;top:50%;width:min(900px,90vw);transform:translateY(-50%);opacity:.22;pointer-events:none}
.hero .container{position:relative}
.hero h1{color:#fff;font-size:clamp(2.5rem,6.4vw,5.2rem);max-width:15ch}
.hero h1 em{font-style:normal;color:var(--lime)}
.hero .lede{font-size:1.2rem;max-width:40rem;color:#e6efea;margin:1.5rem 0 2rem}
.hero .by{font-family:var(--mono);font-size:.82rem;letter-spacing:.08em;color:#bcd0c7;margin-top:2rem}

/* passport stamps: signature moment */
.stamp{display:inline-block;font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--stamp);border:3px double var(--stamp);border-radius:8px;padding:.5rem .8rem;text-align:center;line-height:1.25;transform:rotate(var(--r,-6deg));opacity:.9;background:transparent}
.stamp b{display:block;font-size:1.35rem;letter-spacing:.06em;font-weight:500}
.stamp span{display:block;font-size:.64rem}
.stamp.round{border-radius:50%;width:112px;height:112px;display:inline-flex;flex-direction:column;justify-content:center;align-items:center;padding:.3rem}
.stamp.lt{color:var(--lime);border-color:var(--lime)}
.hero-stamps{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:2.8rem}

/* services index */
.svc{border-top:2px solid var(--green);padding:1.8rem 0}
.svc:last-child{border-bottom:2px solid var(--green)}
.svc h3{font-size:clamp(1.5rem,2.6vw,2.1rem);margin-bottom:.5rem}
.svc .sub{font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem}
.svc details{margin-top:1rem}
.svc summary{cursor:pointer;font-weight:700;color:var(--stamp);list-style:none}
.svc summary::-webkit-details-marker{display:none}
.svc summary::before{content:"+ ";font-family:var(--mono)}
.svc details[open] summary::before{content:"– "}
.svc .more{padding:1rem 0 0;max-width:46rem}
.svc .more h4{font-size:1.1rem;margin:1.2rem 0 .3rem;font-family:var(--body);font-weight:700;color:var(--ink)}
.svc .more ol{padding-left:1.2rem}
.svc .stampcol{text-align:center}

/* who we serve */
.serve{background:var(--green-l)}
.serve-card{background:var(--white);border:1px solid var(--rule);border-top:6px solid var(--green);padding:1.8rem;height:100%}
.serve-card h3{font-size:1.4rem}

/* pull band */
.pull{background:var(--lime);padding:4rem 0;text-align:center}
.pull p{font-family:var(--display);font-size:clamp(1.7rem,4.4vw,3.2rem);color:var(--green-d);line-height:1.15;max-width:22ch;margin:0 auto}
.pull small{display:block;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;margin-top:1rem;color:var(--green)}

/* about */
.about-photo{width:100%;max-width:380px;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:190px 190px 12px 12px;border:4px solid var(--green);box-shadow:14px 14px 0 var(--lime)}
.creds{list-style:none;padding:0;margin:1.2rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem}
.creds li{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;border:1px solid var(--green);border-radius:999px;padding:.25rem .8rem;color:var(--green)}

/* practice + resources */
.practice{background:var(--green);color:#e6efea}
.practice h2,.practice h3{color:#fff}
.practice .q{border-left:3px solid var(--lime);padding:.2rem 0 .2rem 1rem;margin:0 0 1rem;font-family:var(--display);font-size:1.2rem;color:#fff}
.res-card{background:var(--white);border:1px solid var(--rule);padding:2rem;height:100%}

/* contact */
.contact .big{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.2rem);color:var(--green);text-decoration:none;display:block;overflow-wrap:anywhere}
.contact dt{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:1.3rem}
.contact dd{margin:0}
.map{border:3px solid var(--green);width:100%;height:100%;min-height:340px;display:block}

/* footer */
.footer{background:var(--green-d);color:#bcd0c7;padding:3rem 0 2rem}
.footer .chip{background:var(--paper);border-radius:10px;display:inline-block;padding:.5rem .8rem}
.footer .chip img{height:42px;width:auto;display:block}
.footer a{color:#fff}
.footer .social a{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid rgba(255,255,255,.4);border-radius:50%;margin-right:.4rem;text-decoration:none}
.footer .social a:hover{background:var(--lime);color:var(--green-d)}
.footer .powered{font-family:var(--mono);font-size:.8rem}
.footer .powered a{color:var(--lime)}

@media (max-width:767px){
  .section{padding:3.5rem 0}
  .hero{padding:3.2rem 0 4rem}
  .top-phone{display:none}
  .brand-sub{display:none}
  .svc .stampcol{text-align:left;margin-bottom:.5rem}
}
