/* Davao Corporate design layer. Loaded LAST on every page (public pages, home, shop, admin shell), so it re-themes everything through the shared color tokens.
   Brand: logo green #2e9e4f, logo blue #1e6fd6, navy #0b1f4d. Font: Jost (Google Fonts, with system fallbacks). Layout style follows the Golo business-listing reference. */
:root{--dc-g:#2e9e4f;--dc-g2:#3da84a;--dc-b:#1e6fd6;--dc-n:#0b1f4d;--dc-grad:linear-gradient(135deg,#2e9e4f 0%,#1e6fd6 100%);--dc-font:"Jost","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
html:root[data-theme="light"],html:root:not([data-theme]){--bg:#ffffff;--bg2:#f3f7fb;--card:#ffffff;--text:#0b1f3a;--muted:#5b6b80;--line:#e1e8f1;--gold:#1e6fd6;--gt:#1558b0;--on-gold:#ffffff;--ok:#2e9e4f;color-scheme:light}
html:root[data-theme="dark"]{--bg:#091323;--bg2:#0e1c32;--card:#12233d;--text:#eaf1fb;--muted:#9db0c9;--line:#223652;--gold:#3b8cf0;--gt:#7ab6ff;--on-gold:#ffffff;--ok:#4cc38a;color-scheme:dark}
html:root[data-theme="gold"]{--bg:#08170f;--bg2:#0d2417;--card:#11301e;--text:#ecf8f0;--muted:#a3c4b0;--line:#1f4a31;--gold:#3da84a;--gt:#7ee08f;--on-gold:#06210f;--ok:#4cc38a;color-scheme:dark}
html[data-theme="gold"] body{background-image:none}
html[data-theme="gold"] h1,html[data-theme="gold"] h2{background:none;-webkit-text-fill-color:currentColor;color:inherit;animation:none}
html[data-theme="gold"] .btn.p,html[data-theme="gold"] .btn.primary{background:var(--gold);color:var(--on-gold);animation:none;box-shadow:none;border-color:var(--gold)}
html[data-theme="gold"] .prod,html[data-theme="gold"] .svc,html[data-theme="gold"] .card,html[data-theme="gold"] .pcx{border-color:var(--line);box-shadow:none}
html[data-theme="gold"] .price,html[data-theme="gold"] .kicker{color:var(--gt);text-shadow:none}

body{font-family:var(--dc-font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--dc-font);font-weight:600;letter-spacing:-.005em}
button,input,select,textarea{font-family:var(--dc-font)}
html,*{scrollbar-color:#b9c8dc var(--bg2)}
::-webkit-scrollbar,::-webkit-scrollbar-track{background:var(--bg2)}::-webkit-scrollbar-thumb{background:#b9c8dc;border:3px solid var(--bg2)}::-webkit-scrollbar-thumb:hover{background:var(--dc-g)}

/* buttons */
.btn,.btn.sm{border-radius:10px;border-width:1.5px;border-color:var(--line);font-weight:600;font-family:var(--dc-font)}
.btn:hover{border-color:var(--gold);color:var(--gt);filter:none}
.btn.p,.btn.primary,.cta .btn{background:var(--dc-grad);border-color:transparent;color:#fff}
.btn.p:hover,.btn.primary:hover{color:#fff;filter:brightness(1.06);box-shadow:0 8px 20px rgba(30,111,214,.28)}
.pill,.pager a,.pager span,.share a,.share button{font-family:var(--dc-font)}
.pager span{background:var(--dc-grad);border-color:transparent;color:#fff}

/* cards and surfaces */
.card,.prod,.svc,.pcx,.faq details,.toc,.hubs a.hlk,.mk-t,.mk-run,.near{border-radius:14px}
.card,.prod,.svc{box-shadow:0 6px 20px rgba(11,31,77,.07)}
.card:hover,.prod:hover{border-color:var(--dc-g);box-shadow:0 16px 34px rgba(11,31,77,.14)}
.hero2,.cta{border-radius:16px;border-color:var(--line)}
.cta{border:1px solid var(--line);border-left:4px solid var(--dc-g)}
.price,.kicker,.cta small{color:var(--dc-g)}
.prose a{color:var(--gt)}
.prose blockquote{border-left-color:var(--dc-g)}
main h1{font-weight:700}

/* header: white bar, logo + wordmark, pill nav, gradient CTA */
.jh{background:color-mix(in srgb,var(--bg) 94%,transparent);border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(11,31,77,.03)}
.jh.scrolled{box-shadow:0 8px 28px rgba(11,31,77,.12)}
.jh-logo{width:auto;height:44px;display:flex;align-items:center;gap:10px;text-decoration:none;border-radius:0}
.jh-logo img,.jh-logo .lg{position:static;width:42px;height:42px;border-radius:0;opacity:1!important;flex:none}
.jh-wm{font:600 1.32rem/1 var(--dc-font);letter-spacing:-.01em;color:var(--text);white-space:nowrap}.jh-wm b{font-weight:700;color:var(--dc-g)}
@media(max-width:420px){.jh-wm{font-size:1.08rem}}
.jh-nav .dd>button{color:var(--text);font-family:var(--dc-font);font-weight:500;font-size:.98rem}
.jh-nav .dd:hover>button,.jh-nav .dd.open>button,.jh-nav .dd.on>button{background:var(--bg2);color:var(--gt)}
.jh-nav .dd.on>button{box-shadow:inset 0 -2px 0 var(--dc-g)}
.jh-nav .dm{border-radius:14px;box-shadow:0 20px 44px rgba(11,31,77,.18)}
.jh-nav .dm a{font-family:var(--dc-font);font-weight:600}
.jh-nav .dm a:hover,.jh-nav .dm a.on{background:var(--bg2);color:var(--gt)}
.jh-ic:hover,.jh-ic:focus-visible,.jh-ic.on{background:var(--bg2);border-color:var(--line);color:var(--gt)}
.jh-shop{background:var(--dc-grad);color:#fff;font-family:var(--dc-font);font-weight:600;border-radius:10px;box-shadow:0 6px 16px rgba(30,111,214,.28)}
.jh-shop:hover{filter:brightness(1.06)}
.jh .cnt{background:var(--dc-g);color:#fff;border-color:var(--bg)}
.hsearch input,.hs-p{font-family:var(--dc-font)}
.mmenu .mm-gold{color:var(--dc-g)}

/* footer: deep navy */
.ft{background:#071a3f;color:#cfdbef;border-top:0}
.ft a{color:#cfdbef}.ft a:hover{color:#7be0a0}
.ft h4{color:#fff;font-family:var(--dc-font);font-weight:600}
.ft-logo b{color:#fff;font-family:var(--dc-font)}.ft-logo small,.ft-brand p{color:#9fb4d3}
.ft-logo img{background:#fff;border-radius:12px;padding:4px}
.ft-bar{border-color:rgba(255,255,255,.12);color:#9fb4d3}
.ft-mail{color:#7be0a0!important}

/* mobile dock */
.dock{background:color-mix(in srgb,var(--bg) 96%,transparent);border-top:1px solid var(--line)}
.dock a.on,.dock button.on{color:var(--dc-g)}

/* shop / product cards on the home page and the shop page (their CSS lives in index.html) */
.s .w h2,.s h2{font-family:var(--dc-font);text-transform:none}
.s h2 span,.sh .hh .g,h2 span{color:var(--dc-g)}
.kick,.kick2{color:var(--dc-g)}.kick i,.kick2 i{background:var(--dc-g)}
.wm{display:none!important}
.dc-shop .s{background:transparent;padding:0}.dc-shop .w{padding:0}
.dc-shop #shop{padding:0;background:none}
html{background:var(--bg)}

/* ===== v252 navigation: underline menu, two-column panels with letter tiles, pill tools, gradient edge, redesigned phone drawer ===== */
.jh{border-bottom:0;box-shadow:0 1px 0 var(--line),0 10px 26px rgba(11,31,77,.05)}
.jh:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--dc-g),var(--dc-b) 60%,var(--dc-g));pointer-events:none}
.jh .jh-nav .dm a i{font-style:normal}
@media(min-width:1024px){
  .jh .jh-nav{gap:2px}
  .jh .jh-nav .dd>button{position:relative;border-radius:8px;padding:10px 12px;background:none;box-shadow:none;color:var(--text);font-weight:600;font-size:.97rem}
  .jh .jh-nav .dd>button:after{content:"";position:absolute;left:12px;right:28px;bottom:3px;height:3px;border-radius:3px;background:var(--dc-grad);transform:scaleX(0);transform-origin:left;transition:transform .28s cubic-bezier(.22,.8,.3,1)}
  .jh .jh-nav .dd:hover>button,.jh .jh-nav .dd.open>button,.jh .jh-nav .dd.on>button,.jh .jh-nav .dd>button:focus-visible{background:none;box-shadow:none;color:var(--gt)}
  .jh .jh-nav .dd:hover>button:after,.jh .jh-nav .dd.open>button:after,.jh .jh-nav .dd.on>button:after{transform:scaleX(1)}
  .jh .jh-nav .dd>button svg{opacity:.6}
  .jh .jh-nav .dm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 8px;min-width:min(480px,94vw);padding:12px;border-radius:20px;top:calc(100% + 12px);box-shadow:0 30px 70px rgba(11,31,77,.24)}
  .jh .jh-nav .dd:first-of-type .dm{min-width:min(600px,94vw)}
  .jh .jh-nav .dm:after{content:attr(aria-label);grid-column:1/-1;order:-1;margin:0 0 6px;padding:4px 10px 10px;border-bottom:1px solid var(--line);font:700 .72rem var(--dc-font);letter-spacing:.16em;text-transform:uppercase;color:var(--dc-g)}
  .jh .jh-nav .dm a{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:12px;row-gap:0;align-items:center;padding:9px 10px;border-radius:14px}
  .jh .jh-nav .dm a i{grid-row:1/3;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font:700 1.05rem var(--dc-font);color:#fff;background:var(--dc-grad);transition:transform .2s}
  .jh .jh-nav .dm a:nth-child(4n+2) i{background:linear-gradient(135deg,#1e6fd6,#38bdf8)}
  .jh .jh-nav .dm a:nth-child(4n+3) i{background:linear-gradient(135deg,#7a56d9,#b45fd1)}
  .jh .jh-nav .dm a:nth-child(4n) i{background:linear-gradient(135deg,#f5a524,#e4603a)}
  .jh .jh-nav .dm a:hover i{transform:scale(1.07) rotate(-3deg)}
  .jh .jh-nav .dm a b{font-size:.96rem;line-height:1.25}
  .jh .jh-nav .dm a small{font-size:.8rem;line-height:1.3}
  .jh .jh-nav .dm a:hover,.jh .jh-nav .dm a.on{background:var(--bg2)}
  .jh .jh-shop{margin-left:8px;padding:10px 22px;border-radius:999px;font-weight:700;letter-spacing:.01em}
  .jh .jh-tools{gap:2px;margin-left:8px;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--bg2)}
  .jh .jh-tools .jh-ic,.jh .jh-tools .lbtn{height:36px;border:0;background:none;color:var(--text)}
  .jh .jh-tools .jh-ic{width:36px}
  .jh .jh-tools .lbtn{padding:0 10px;gap:5px;border-radius:999px}
  .jh .jh-tools .jh-ic:hover,.jh .jh-tools .lbtn:hover,.jh .jh-tools .jh-ic:focus-visible{background:var(--card);color:var(--gt)}
  .jh .hsearch{background:var(--bg2);border:1px solid var(--line)}
}
@media(min-width:1024px) and (max-width:1219.98px){.jh .jh-nav .dd>button:after{left:9px;right:24px}.jh .jh-shop{padding:10px 16px}}
@media(max-width:1023.98px){
  .mmenu{width:min(88vw,360px);border-left:0;border-radius:22px 0 0 22px;background:var(--bg)}
  .mmenu:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--dc-g),var(--dc-b))}
  .mm-top{padding-left:26px}
  .mm-t{color:var(--dc-g)}
  .mmenu .mgh{display:flex;align-items:center;gap:10px;margin:22px 8px 6px;color:var(--dc-g)}
  .mmenu .mgh:after{content:"";flex:1;height:1px;background:var(--line)}
  .mm-big{display:flex;align-items:center;justify-content:space-between;padding:12px 12px;border-radius:12px;font-family:var(--dc-font);font-weight:600}
  .mm-big:after{content:"\203A";opacity:.4;font-size:1.35rem;line-height:1}
  .mm-big.on{background:var(--bg2);color:var(--gt)}
  .mm-big.on::before{left:0;width:4px}
  .mm-big.mm-gold{margin-top:6px;background:var(--dc-grad);color:#fff}.mm-big.mm-gold:after{opacity:.85}
}