/* ==========================================================================
   TALLYHASHS SHELL: the sale strip, navigation, phone menu and footer on every page.
   Loaded after the page's own stylesheet (site.css or store.css). Its tokens live on
   its own elements, so nothing here changes a page's content.
   ========================================================================== */
.promo,.snav,.snav-sheet,.sfoot{
  --sh-bg:#05080a; --sh-panel:#0b1013; --sh-ink:#f2f6f4; --sh-ink-2:#aab4af; --sh-ink-3:#8b958f; --sh-line:rgba(255,255,255,.09);
  --sh-brand:#34e39a; --sh-brand-2:#6ff0bb; --sh-on-brand:#03140d;
  --sh-font:"Inter","Inter Fallback",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --sh-ease:cubic-bezier(.2,.7,.2,1);
  font-family:var(--sh-font);
}
.snav .ic,.sfoot .ic,.promo .ic{width:20px;height:20px;flex:none}
.no-dash .snav a[href="/account/"],.no-dash .snav-sheet a[href="/account/"],.no-dash .sfoot a[href="/account/"]{display:none!important}

/* ---------- sale strip ---------- */
.promo{position:relative;z-index:61;display:flex;align-items:center;justify-content:center;gap:16px;min-height:42px;margin:0;padding:8px 18px;
  background:linear-gradient(90deg,#062a1c,#0a3d29 50%,#062a1c);color:#d9fbe9;font-size:14px;line-height:1.35;text-align:center;text-decoration:none;border-bottom:1px solid rgba(52,227,154,.18)}
.promo[hidden]{display:none}
.promo b{color:#fff;font-weight:600}
.promo-t{color:#a8dcc3}
.promo-go{display:inline-flex;align-items:center;gap:4px;color:var(--sh-brand);font-weight:600;white-space:nowrap}
.promo-go .ic{width:16px;height:16px;transition:transform .2s var(--sh-ease)}
@media (hover:hover) and (pointer:fine){a.promo:hover .promo-go .ic{transform:translateX(3px)}}

/* ---------- navigation ---------- */
.snav{position:sticky;top:0;z-index:60;background:rgba(5,8,10,.74);-webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);border-bottom:1px solid transparent;color:var(--sh-ink);transition:border-color .2s var(--sh-ease),background-color .2s var(--sh-ease)}
.snav.scrolled{border-bottom-color:var(--sh-line);background:rgba(5,8,10,.86)}
.snav-in{display:flex;align-items:center;gap:26px;height:64px}
.snav-brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--sh-ink);font-size:18px;font-weight:650;letter-spacing:-.02em;text-decoration:none;flex:none}
.snav-mark{width:30px;height:30px;flex:none}
.snav-links{display:flex;gap:2px;margin:0;padding:0;list-style:none}
.snav-links a{display:flex;align-items:center;height:44px;padding:0 12px;border-radius:999px;color:var(--sh-ink-2);font-size:14.5px;font-weight:500;text-decoration:none;transition:color .15s,background-color .15s}
.snav-links a:hover,.snav-links a[aria-current]{color:var(--sh-ink)}
.snav-links a:hover{background:rgba(255,255,255,.06)}
.snav-links a[aria-current]{background:rgba(255,255,255,.05)}
.snav-end{display:flex;align-items:center;gap:8px;margin-left:auto}
.snav-chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 13px 0 11px;border:1px solid var(--sh-line);border-radius:999px;color:var(--sh-ink-2);font-size:13.5px;text-decoration:none;white-space:nowrap;font-variant-numeric:tabular-nums;transition:border-color .2s,color .2s}
.snav-chip b{color:var(--sh-ink);font-weight:600}
.snav-chip:hover{border-color:rgba(255,255,255,.24);color:var(--sh-ink)}
.snav-dot{position:relative;width:7px;height:7px;border-radius:50%;background:#7e8883;flex:none}
.is-live .snav-dot{background:var(--sh-brand);box-shadow:0 0 0 3px rgba(52,227,154,.18)}
.snav-icon{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:999px;background:none;color:var(--sh-ink);cursor:pointer;transition:background-color .15s}
.snav-icon:hover{background:rgba(255,255,255,.07)}
.snav-ghost,.snav-buy{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border-radius:999px;font:600 14.5px/1 var(--sh-font);text-decoration:none;white-space:nowrap;transition:transform .15s var(--sh-ease),background-color .15s,border-color .15s,box-shadow .15s}
.snav-ghost{border:1.5px solid rgba(255,255,255,.22);color:var(--sh-ink)}
.snav-buy{background:var(--sh-brand);color:var(--sh-on-brand)}
.snav-ghost:active,.snav-buy:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
  .snav-ghost:hover{border-color:var(--sh-ink)}
  .snav-buy:hover{background:var(--sh-brand-2);box-shadow:0 8px 24px -10px rgba(52,227,154,.7)}
}
.snav-menu{display:none}
.snav-menu .ic-close,.snav-menu[aria-expanded=true] .ic-open{display:none}
.snav-menu[aria-expanded=true] .ic-close{display:block}
/* the panel hangs from the header (absolute, not fixed: the header's backdrop blur would make a fixed child size itself to the header) */
.snav-sheet{position:absolute;left:0;right:0;top:100%;height:calc(100vh - var(--sheet-top,64px));height:calc(100dvh - var(--sheet-top,64px));z-index:59;overflow:auto;overscroll-behavior:contain;background:var(--sh-bg);border-top:1px solid var(--sh-line)}
.menu-open{overflow:hidden}   /* on the root only: hiding body's overflow would unstick the header */
.menu-open .snav{z-index:90}   /* above a page's own section bar */
.snav-sheet[hidden]{display:none}
.snav-sheet ul{margin:0;padding-top:8px;padding-bottom:40px;list-style:none}
.snav-sheet a{display:flex;align-items:center;min-height:58px;border-bottom:1px solid var(--sh-line);color:var(--sh-ink);font-size:21px;font-weight:600;letter-spacing:-.01em;text-decoration:none}
@media (max-width:1180px){.snav-chip{display:none}}
@media (max-width:1020px){.snav-links,.snav-ghost{display:none}.snav-menu{display:grid}}
@media (max-width:420px){.snav-end>a.snav-icon{display:none}.snav-buy{padding:0 15px}}

/* ---------- footer ---------- */
.sfoot{padding:clamp(56px,7vw,88px) 0 calc(36px + env(safe-area-inset-bottom));background:var(--sh-bg);border-top:1px solid var(--sh-line);color:var(--sh-ink-2);font-size:14px;line-height:1.5}
.sfoot a{color:inherit}
.sfoot-promise{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:0 0 clamp(40px,5vw,64px);padding:0 0 clamp(32px,4vw,48px);border-bottom:1px solid var(--sh-line);list-style:none}
.sfoot-promise li{display:grid;grid-template-columns:28px 1fr;gap:2px 14px}
.sfoot-promise .ic{grid-row:span 2;width:24px;height:24px;margin-top:2px;color:var(--sh-brand)}
.sfoot-promise b{color:var(--sh-ink);font-size:15.5px;font-weight:600}
.sfoot-promise span{font-size:14px;line-height:1.45}
.sfoot-dir{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.sfoot-dir h3{margin:0 0 10px;color:var(--sh-ink);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none}
.sfoot-dir ul{margin:0;padding:0;list-style:none}
.sfoot-dir a{display:inline-flex;align-items:center;min-height:34px;text-decoration:none}
.sfoot-dir a:hover{color:var(--sh-ink);text-decoration:underline;text-underline-offset:.2em}
.sfoot-notes{margin-top:clamp(36px,4vw,56px);padding-top:28px;border-top:1px solid var(--sh-line);color:var(--sh-ink-3);font-size:12.5px;line-height:1.6}
.sfoot-notes ol{margin:0 0 14px;padding-left:20px}
.sfoot-notes li{margin-bottom:6px}
.sfoot-notes p{margin:0}
.sfoot-notes p+p{margin-top:10px}
.sfoot-notes a{color:var(--sh-ink-2)}
.sfoot-legal{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;margin-top:28px;padding-top:20px;border-top:1px solid var(--sh-line);font-size:13px}
.sfoot-legal .snav-brand{font-size:16px;margin-right:auto}
.sfoot-legal .snav-mark{width:24px;height:24px}
.sfoot-legal nav{display:flex;flex-wrap:wrap;gap:4px 20px}
.sfoot-legal nav a{display:inline-flex;align-items:center;min-height:36px;text-decoration:none}
.sfoot-legal nav a:hover{color:var(--sh-ink)}
.sfoot .ph{background:rgba(255,214,10,.16);color:#ffe27a;border-radius:5px;padding:0 5px}
@media (max-width:900px){.sfoot-promise,.sfoot-dir{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.promo{font-size:13px;gap:10px}.promo-t{display:none}.sfoot-legal .snav-brand{flex-basis:100%}}
@media (max-width:380px){.sfoot-promise{grid-template-columns:1fr}}

/* a page's own section bar (Pricing, Learn) sticks under the navigation, so the menu stays in reach */
.has-lnav .lnav{top:64px!important}

/* older pages pulled their hero photograph up under the old, taller header */
body .hero-photo,body.has-lnav .hero-photo{--hdr:0px!important}
@media print{.promo,.snav,.snav-sheet{display:none!important}}
