:root{--bg:#f5f7f0;--surface:#e9eedf;--ink:#14291f;--muted:#4a5c50;--kernel:#8fb339;--hull:#731d4f;--btn:#731d4f;--line:#cfd8c3;--on-dark:#f5f7f0;--dark:#14291f;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0e1b14;--surface:#16291f;--ink:#eef2e6;--muted:#a3b3a6;--line:#2a4034;--dark:#07110b;--hull:#e59bc4;--btn:#a8447a}}
*{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px);color-scheme:light dark}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 "Public Sans",system-ui,sans-serif}
h1,h2,h3{font-family:"Bricolage Grotesque","Public Sans",sans-serif;line-height:1.05;margin:0 0 .5em;letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,8vw,5.6rem);font-weight:800}
h2{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:700}
h3{font-size:1.3rem;font-weight:700}
p{max-width:62ch;margin:0 0 1em}
a{color:inherit}
:focus-visible{outline:3px solid var(--hull);outline-offset:3px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
header{position:sticky;top:env(safe-area-inset-top,0px);background:var(--bg);border-bottom:1px solid var(--line);z-index:5}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;flex-wrap:wrap}
.logo{font:800 1.4rem "Bricolage Grotesque",sans-serif;text-decoration:none;letter-spacing:-.03em}
.logo i{color:var(--kernel);font-style:normal}
nav{display:flex;gap:4px;flex-wrap:wrap}
nav a{text-decoration:none;padding:6px 12px;border-radius:2px;font-size:.95rem;font-weight:500}
nav a:hover,nav a[aria-current]{background:var(--surface)}
.btn{display:inline-block;background:var(--btn);color:#fff;padding:12px 24px;border-radius:2px;text-decoration:none;font-weight:600;border:2px solid var(--edge);--edge:#4a1033;--glow:color-mix(in srgb,var(--btn) 20%,transparent);box-shadow:0 0 0 3px var(--glow),0 2px 0 var(--edge),0 4px 10px rgba(20,41,31,.2);cursor:pointer;font-size:1rem;font-family:inherit;transition:box-shadow .12s,transform .12s}
.btn:hover{transform:translateY(-1px);box-shadow:0 0 0 3px var(--glow),0 3px 0 var(--edge),0 6px 14px rgba(20,41,31,.24)}
.btn:active{transform:translateY(1px);box-shadow:0 0 0 3px var(--glow),0 0 0 var(--edge),0 1px 3px rgba(20,41,31,.2)}
.btn.alt{background:var(--bg);color:var(--ink);--edge:var(--ink);--glow:color-mix(in srgb,var(--ink) 20%,transparent)}
.page{display:none}.page.on{display:block}
.hero{padding-top:72px;padding-bottom:56px;display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center}
.hero p{font-size:1.2rem;color:var(--muted)}
.hero .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.band{background:var(--surface);padding:64px 0}
.dark{background:var(--dark);color:var(--on-dark);padding:72px 0}
.dark p{color:#c3d0c6}
.two{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.fam{display:block;text-decoration:none;padding:36px;border-radius:3px;min-height:240px}
.fam.a{background:var(--kernel);color:#14291f}
.fam.b{background:var(--dark);color:var(--on-dark)}
.fam p{opacity:.85}
.row{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:22px 0;border-top:1px solid var(--line)}
.row h3{margin:0}
.row p{margin:0}
.sec{padding-top:56px;padding-bottom:56px}
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:520px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}
th{font-family:"Bricolage Grotesque",sans-serif}
form{display:grid;gap:14px;max-width:560px}
label{font-weight:600;font-size:.95rem;display:grid;gap:6px}
input,select,textarea{font:inherit;padding:12px;border:1px solid var(--line);border-radius:2px;background:var(--bg);color:var(--ink)}
footer{background:var(--dark);color:#c3d0c6;padding:48px 0 32px;font-size:.95rem}
footer .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
footer h3{color:var(--on-dark);font-size:1rem}
footer a{display:block;text-decoration:none;margin:4px 0}
.wa{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));background:#25a15a;color:#fff;border:2px solid #1b7a43;border-radius:2px;box-shadow:0 0 0 3px rgba(37,161,90,.2),0 2px 0 #1b7a43,0 4px 10px rgba(20,41,31,.2);padding:10px 18px;text-decoration:none;font-weight:600;z-index:6}
.pil{border-top:4px solid var(--kernel);padding-top:16px}.pil h3{margin-bottom:.4em}.pil p{margin-bottom:.6em}
.cap{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:24px 0}.cap div{border:1px solid var(--line);border-radius:3px;background:var(--bg);padding:20px}.cap h3{font-size:1.1rem;margin:0 0 6px}.cap p{margin:0;font-size:.95rem;color:var(--muted)}
.chips{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}.chips li{border:1px solid var(--line);border-left:4px solid var(--kernel);border-radius:2px;background:var(--surface);padding:9px 16px;font-weight:500}
.hero .eyebrow{font:700 .85rem "Public Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--hull);margin:0 0 14px;max-width:none}
.pd{display:grid;grid-template-columns:1fr 340px;gap:48px;align-items:start}
.pn{position:sticky;top:calc(88px + env(safe-area-inset-top,0px));background:var(--surface);border:1px solid var(--line);border-radius:3px;padding:32px 28px;min-height:380px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.pn svg{width:100%;max-width:140px;height:auto}
.pn span{font:800 clamp(2.2rem,4vw,3rem)/.95 "Bricolage Grotesque",sans-serif;letter-spacing:-.03em;color:var(--hull);overflow-wrap:anywhere}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.logos{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:20px 0 8px}.logos div{border:1px dashed var(--line);border-radius:3px;padding:28px 12px;text-align:center;color:var(--muted);font-weight:500}
.ph{font-size:clamp(2.2rem,6vw,4rem)}.lead{font-size:1.25rem;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:20px 0 8px}
.card{display:block;text-decoration:none;padding:22px;border:1px solid var(--line);border-radius:3px;background:var(--surface)}
.card:hover{border-color:var(--ink)}.card h3{margin:10px 0 6px}.card p{font-size:.95rem;margin:0 0 8px}.card span{font-size:.85rem;color:var(--muted)}
.crumb{font-size:.9rem;color:var(--muted);margin-bottom:20px}.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 0}.crumb li+li::before{content:"/";margin:0 8px;opacity:.5}.crumb a{color:inherit;text-underline-offset:3px}.crumb a:hover{color:var(--ink)}.crumb [aria-current]{color:var(--ink);font-weight:600}
table th[scope=row]{width:34%;font-weight:600}
.menu{display:none;background:var(--bg);color:var(--ink);border:2px solid var(--ink);border-radius:2px;padding:0 16px;min-height:44px;font:600 .95rem "Public Sans",sans-serif;cursor:pointer}
@media(max-width:760px){header .wrap{padding-top:8px;padding-bottom:8px}.menu{display:block}header nav,header .hq{display:none}header.open nav{display:flex;flex-direction:column;width:100%;order:3;margin-top:8px}header.open nav a{padding:14px 8px;border-radius:0;border-bottom:1px solid var(--line);font-size:1.05rem}header.open .hq{display:block;width:100%;text-align:center;order:4;margin:0px 0 8px}}
@media(max-width:760px){.hero,.two,.row,footer .wrap{grid-template-columns:1fr}.row{gap:6px}.sec{padding-top:36px;padding-bottom:40px}.hero{padding-top:36px;padding-bottom:36px}.grid{grid-template-columns:repeat(2,1fr);gap:12px}.card{padding:14px}.card h3{font-size:1.05rem}.card svg{width:44px;height:44px}.cap{grid-template-columns:1fr}.pd{grid-template-columns:1fr}.pn{display:none}.logos{grid-template-columns:repeat(2,1fr)}.three{grid-template-columns:1fr}}
@media(prefers-reduced-motion:no-preference){.hero svg{animation:rock 6s ease-in-out infinite}@keyframes rock{50%{transform:rotate(4deg)}}}

button {
  font-family:sans-serif;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #ffffff;
  background-color: #10b981; /* Main button face */
  
  /* Crisp dark frame */
  border: 2px solid #065f46; 
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  
  /* LAYERED SHADOWS: 
     1. Inset top highlight (2px white at 35% opacity)
     2. Inset left highlight (2px white at 20% opacity)
     3. ADDED: Inset bottom shadow (3px darker green shade pointing up from the bottom edge)
     4. External 3D outset shadow (4px Right and 4px Bottom)
     5. Subtle 2px light green ambient outer glow */
  box-shadow: 
    inset 0 2px 0 rgba(255, 255, 255, 0.35),
    inset 2px 0 0 rgba(255, 255, 255, 0.20),
    inset 0 -3px 0 rgba(4, 120, 87, 0.45),
    4px 4px 0 #065f46,
    0 0 0 1px rgba(52, 211, 153, 0.25),
        -1px -1px 1px 1px rgba(52, 211, 153, 0.4),
    6px 6px 1px 1px rgba(52, 211, 153, 0.4);
  
  transition: transform 0.1s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.1s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Hover: Pops up, depth shadow expands, and accents sharpen */
.btn:hover {
  transform: translate(-1px, -1px);
  box-shadow: 
    inset 0 2px 0 rgba(255, 255, 255, 0.45), 
    inset 2px 0 0 rgba(255, 255, 255, 0.25),
    inset 0 -3px 0 rgba(4, 120, 87, 0.60), /* Darker bottom accent intensifies */
    5px 5px 0 #065f46,
    -1px -1px 0px 0px rgba(52, 211, 153, 0.4),
    7px 7px 0px 0px rgba(52, 211, 153, 0.4);
}

/* Clicked/Active: Sinks down, flattening out, inner highlights compress */
.btn:active {
  transform: translate(4px, 4px);
  box-shadow: 
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 1px 0 0 rgba(255, 255, 255, 0.1),
    inset 0 -1px 0 rgba(4, 120, 87, 0.2), /* Squashes down on click */
    2px 2px 0 #065f46,
    0 0 2px 1px rgba(52, 211, 153, 0.15);
}

/* Accessibility */
.btn:focus-visible {
  outline: 3px solid rgba(16, 185, 129, 0.4);
  outline-offset: 4px;
}

.badge {
    position: absolute;
    top: -8px;
    right: -10px;
    background-color: #e74c3c;
    color: white;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: bold;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  }