:root{
  --green:#1A3C2A; --green-2:#24503A; --green-3:#2F6A4A; --leaf:#6DC24B; --orange:#FF6B00; --orange-dk:#D95B00;
  --ink:#1B2420; --muted:#5B6660; --line:#E3E8E4; --paper:#FFFFFF; --wash:#EEF2EE;
  --head:"Montserrat",Arial,"Helvetica Neue",Helvetica,sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  box-sizing:border-box;
}
*,*::before,*::after{box-sizing:inherit}
[hidden]{display:none!important}
html,body{margin:0;background:var(--wash);color:var(--ink);font-family:var(--body);-webkit-text-size-adjust:100%}
body{padding-bottom:env(safe-area-inset-bottom,0px)}
.card{max-width:440px;margin:0 auto;background:var(--paper);min-height:100vh;display:flex;flex-direction:column;box-shadow:0 0 40px rgba(26,60,42,.08)}

/* ----- Header ----- */
header{position:relative;overflow:hidden;color:#fff;padding:calc(20px + env(safe-area-inset-top,0px)) 22px 30px;
  background:
    radial-gradient(120% 90% at 100% 0%,rgba(109,194,75,.28),transparent 55%),
    radial-gradient(90% 70% at 0% 100%,rgba(255,107,0,.16),transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='32' viewBox='0 0 64 32'%3E%3Cpath d='M0 24 32 8l32 16' fill='none' stroke='%23ffffff' stroke-opacity='.05' stroke-width='2'/%3E%3C/svg%3E") 0 0/64px 32px,
    linear-gradient(160deg,var(--green-2),var(--green) 60%)}
header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:linear-gradient(90deg,var(--orange),#FF8A3D)}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 24px}
.brand{margin:0;line-height:0}
.brand img{height:54px;width:auto;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.25))}
.brand span{font:700 .85rem var(--head);color:var(--leaf);line-height:1.2}
.live{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.18);color:#fff;text-decoration:none;font:700 .72rem var(--head);letter-spacing:.02em;white-space:nowrap}
.live i{width:8px;height:8px;border-radius:50%;background:var(--leaf);box-shadow:0 0 0 0 rgba(109,194,75,.7);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(109,194,75,0)}100%{box-shadow:0 0 0 0 rgba(109,194,75,0)}}
.who{display:flex;gap:16px;align-items:center}
.photo{flex:0 0 84px;height:84px;border-radius:50%;border:3px solid var(--orange);box-shadow:0 0 0 4px rgba(255,255,255,.12),0 8px 20px rgba(0,0,0,.25);
  background:linear-gradient(145deg,var(--green-3),var(--green));display:grid;place-items:center;font:800 1.7rem var(--head);color:#fff;overflow:hidden}
.photo img{width:100%;height:100%;object-fit:cover}
h1{margin:0;font:800 1.8rem/1.08 var(--head);letter-spacing:-.01em}
.role{white-space:pre-line;margin:7px 0 0;font-size:.95rem;color:#D6E3DA;line-height:1.35}

/* ----- Main ----- */
main{padding:22px 20px 8px;flex:1}
.save{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:66px;border:0;border-radius:14px;
  background:linear-gradient(180deg,#FF7A1A,var(--orange));color:#fff;cursor:pointer;text-decoration:none;padding:12px 16px;
  box-shadow:0 8px 18px rgba(255,107,0,.28),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .15s ease,box-shadow .15s ease}
.save svg{width:26px;height:26px;flex:0 0 auto}
.save span{display:flex;flex-direction:column;font:800 1.12rem/1.2 var(--head)}
.save small{font:400 .8rem var(--body);opacity:.92;margin-top:2px}
.save:active{transform:scale(.98);box-shadow:0 3px 8px rgba(255,107,0,.3)}
.quick{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 12px}
.quick a,.share button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:13px 4px;border:1.5px solid var(--line);border-radius:14px;
  background:var(--paper);color:var(--green);text-decoration:none;font:700 .85rem var(--head);cursor:pointer;transition:border-color .15s,background .15s}
.quick a:active,.share button:active{background:#F4F8F4;border-color:var(--leaf)}
.quick svg{width:22px;height:22px}
.share{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 28px}
.share button{flex-direction:row;justify-content:center;gap:8px;padding:11px 8px;color:var(--ink);font-weight:600}
.share svg{width:18px;height:18px;color:var(--leaf)}
h2{font:800 .78rem var(--head);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
section{margin:0 0 28px}

.about p{margin:0 0 14px;font-size:.95rem;line-height:1.55}
.about h3{margin:14px 0 7px;font:700 .7rem var(--head);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.chips li{padding:6px 11px;border-radius:999px;font:700 .78rem var(--head);background:#EAF6E4;color:var(--green)}
.chips.cert li{background:#FFF0E5;color:var(--orange-dk)}
.chips.area li{background:var(--wash);color:var(--ink);font-weight:600}
.about .links{margin-top:14px}

.services{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 14px;padding:0;list-style:none}
.services li{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 2px 10px;border-radius:12px;background:#F6F9F6;
  font:700 .68rem/1.15 var(--head);color:var(--green);text-align:center}
.services svg{width:26px;height:26px;color:var(--orange)}
.area-h{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:.85rem;color:var(--muted)}
.area-h svg{width:16px;height:16px;color:var(--leaf)}

.tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:4px;margin:0 0 6px;border-radius:12px;background:var(--wash)}
.tabs button{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 6px;border:0;border-radius:9px;background:transparent;
  color:var(--muted);font:700 .88rem var(--head);cursor:pointer;transition:background .15s,color .15s}
.tabs button small{min-width:22px;padding:2px 6px;border-radius:999px;background:rgba(26,60,42,.08);font-size:.72rem}
.tabs button[aria-selected="true"]{background:var(--paper);color:var(--green);box-shadow:0 1px 4px rgba(26,60,42,.12)}
.tabs button[aria-selected="true"] small{background:var(--orange);color:#fff}
.loclist{list-style:none;margin:0;padding:0}
.loclist li{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}
.loclist .loc{flex:1;min-width:0;padding:12px 2px;color:var(--ink);text-decoration:none}
.loclist .loc b{display:block;font:700 .92rem/1.25 var(--head)}
.loclist .loc span{display:block;margin-top:2px;color:var(--muted);font-size:.8rem}
.loclist .call{flex:0 0 auto;padding:8px 10px;border-radius:999px;background:#EAF6E4;color:var(--green);text-decoration:none;font:700 .78rem var(--head);white-space:nowrap}
.loclist .call:active{background:var(--leaf);color:#fff}
.offices .loc span{margin-top:1px}
.locs .more{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin-top:12px;padding:13px 16px;
  border:1.5px solid var(--green);border-radius:12px;background:#F4F8F4;color:var(--green);font:700 .9rem var(--head);cursor:pointer;text-align:left}
.locs .more .chev{transition:transform .2s ease}
.locs .more[aria-expanded="true"] .chev{transform:rotate(90deg)}
.locs .more:active{background:#EAF6E4}
.offices .acts{display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:10px 0}
.offices .acts .call{text-align:center}
.offices .dir{display:inline-flex;align-items:center;justify-content:center;gap:5px;background:var(--orange);color:#fff}
.offices .dir svg{width:14px;height:14px}
.offices .dir:active{background:var(--orange-dk)}
.links{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.links li{border-bottom:1px solid var(--line)}
.links a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 4px;color:var(--ink);text-decoration:none;transition:background .15s}
.links a:active{background:#F6F9F6}
.links b{display:block;font:700 .98rem var(--head)}
.links span{display:block;color:var(--muted);font-size:.85rem;margin-top:3px}
.links .em{background:linear-gradient(90deg,#FFF3EA,transparent);border-radius:10px;padding-left:12px;padding-right:10px}
.links .em b{color:var(--orange-dk)}
.chev{flex:0 0 auto;color:var(--leaf);font-size:1.3rem;line-height:1}
footer{padding:18px 20px 28px;color:var(--muted);font-size:.72rem;line-height:1.45;text-align:center}
footer .replay{display:inline-flex;align-items:center;gap:8px;margin:0 auto 18px;padding:10px 18px;border:1.5px solid var(--line);border-radius:999px;
  background:var(--paper);color:var(--green);font:700 .85rem var(--head);cursor:pointer}
footer .replay svg{width:16px;height:16px;color:var(--orange)}
footer .replay:active{background:#F4F8F4;border-color:var(--leaf)}
footer img{display:block;height:26px;width:auto;margin:0 auto 10px;opacity:.9}
a:focus-visible,button:focus-visible{outline:3px solid var(--leaf);outline-offset:3px}

/* ----- QR sheet + toast ----- */
.sheet{position:fixed;inset:0;z-index:40;display:grid;place-items:end center;background:rgba(10,24,16,.55);opacity:0;pointer-events:none;transition:opacity .2s}
.sheet.on{opacity:1;pointer-events:auto}
.sheet > div{width:100%;max-width:440px;background:var(--paper);border-radius:22px 22px 0 0;padding:22px 22px calc(22px + env(safe-area-inset-bottom,0px));text-align:center;
  transform:translateY(30px);transition:transform .25s ease}
.sheet.on > div{transform:none}
.sheet h3{margin:0 0 4px;font:800 1.2rem var(--head);color:var(--green)}
.sheet p{margin:0 0 16px;color:var(--muted);font-size:.88rem}
.sheet .qr{width:min(72vw,260px);margin:0 auto 16px;padding:14px;border-radius:18px;border:1.5px solid var(--line)}
.sheet .qr svg{display:block;width:100%;height:auto}
.sheet button{width:100%;padding:14px;border:0;border-radius:12px;background:var(--green);color:#fff;font:700 1rem var(--head);cursor:pointer}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;z-index:45;
  background:var(--green);color:#fff;padding:12px 16px;border-radius:10px;font-size:.9rem;max-width:90vw;text-align:center;transition:.25s;pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ----- Entrance: sections rise in once the intro is out of the way ----- */
html.anim .rise{opacity:0;transform:translateY(14px)}
html.anim.ready .rise{opacity:1;transform:none;transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.3,1);transition-delay:calc(var(--i,0) * 70ms)}
@media (prefers-reduced-motion:reduce){
  .toast,.sheet,.sheet > div,html.anim.ready .rise{transition:none}
  .live i{animation:none}
}

/* ===== Intro video ===== */
#intro{display:none}
html.intro #intro{display:block;position:fixed;inset:0;z-index:50;background:#000;opacity:1;transition:opacity .45s ease}
html.intro body{overflow:hidden}
html.intro-done #intro{opacity:0;pointer-events:none}
#intro video{width:100%;height:100%;object-fit:cover;display:block}
/* name + title over the end of a video intro */
#intro .vname{position:absolute;left:0;right:0;bottom:0;padding:60px 24px calc(76px + env(safe-area-inset-bottom,0px));text-align:center;color:#fff;
              pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.55) 45%);opacity:0;transition:opacity .5s ease}
#intro .vname .nm{margin-top:0;font-family:var(--head);font-weight:800;text-shadow:0 2px 14px rgba(0,0,0,.5);transition-delay:.1s}
#intro .vname .tt{white-space:pre-line;transition-delay:.25s}
#intro.named .vname{opacity:1}
#intro.named .vname .nm,#intro.named .vname .tt{opacity:1;transform:none}
#intro .nm,#intro .tt{margin:0;opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
#intro .nm{font-size:1.7rem;line-height:1.15}
#intro .tt{margin-top:6px;font-size:1rem;line-height:1.35;color:#D6E3DA}
#skip{z-index:2;position:absolute;right:16px;bottom:calc(18px + env(safe-area-inset-bottom,0px));padding:9px 16px;border-radius:999px;
      border:1px solid rgba(255,255,255,.45);background:rgba(0,0,0,.45);color:#fff;font:600 .85rem Arial,Helvetica,sans-serif;cursor:pointer}