/* Wall theme for the Academy (academy.janberzins.com, /q4/, /path/, /team/, /downloads/, /astra/).
   Loaded after jb-ui.css. Same plaster, ink, blue and type as janberzins.com. */
:root{
--bg:#D7D5D2;--bg2:#E3E1DE;--paper:rgba(247,246,244,.86);--mist:rgba(29,29,31,.06);
--ink:#1D1D1F;--ink2:#3C3B39;--ash:#6E6D6A;--line:rgba(29,29,31,.09);--line2:rgba(29,29,31,.18);
--teal:#2A5BD7;--teal2:#7FA0EE;--tint:rgba(42,91,215,.09);--night:#1D1D1F;--night2:#2A2A2C;--on:#F5F5F7;--on2:rgba(245,245,247,.7);
--gold:#C9A25E;--goldt:rgba(201,162,94,.16);
--sans:"Inter","SF Pro Text",system-ui,-apple-system,"Segoe UI",sans-serif;
--disp:"Inter Tight","SF Pro Display",system-ui,-apple-system,"Segoe UI",sans-serif;
--r2:22px;--glass-line:rgba(29,29,31,.08);--ease:cubic-bezier(.22,.8,.2,1);
}
html{background:#D7D5D2}
body{background:#D7D5D2 url(https://janberzins.com/w/assets/wall-plain.webp) center/cover fixed;color:var(--ink);-webkit-font-smoothing:antialiased}
@supports (-webkit-touch-callout:none){body{background-attachment:scroll}}
h1,h2,h3{font-family:var(--disp);font-weight:650;letter-spacing:-.04em;line-height:1.02;text-wrap:balance}
h1{font-size:clamp(36px,5.4vw,72px)}h2{font-size:clamp(28px,3.6vw,48px)}h3{font-weight:600;letter-spacing:-.02em}
.t{color:var(--teal)}
.eyebrow{font:600 11px/1 var(--sans);letter-spacing:.16em;color:var(--ash)}
.lede{color:var(--ink2)}

/* glass cards with a pin, like the notes on the wall */
.panel,.qcard{background:var(--paper);border:0;box-shadow:inset 0 0 0 1px var(--glass-line),0 24px 50px -30px rgba(0,0,0,.35);
  backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);position:relative}
.panel::before,.qcard::before{content:"";position:absolute;top:12px;left:50%;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;
  background:#9B9893;box-shadow:inset 0 -1px 1px rgba(0,0,0,.25),0 1px 2px rgba(0,0,0,.2)}
.night{background:rgba(29,29,31,.9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 24px 50px -28px rgba(0,0,0,.6)}
.night .mk.example{color:var(--teal2)}
.card-example{background:rgba(247,246,244,.7)!important;border:1.5px dashed var(--line2)!important}
.card-course{border:1.5px solid var(--gold)!important}

/* top bar = glass bar of the wall */
.jnav{background:rgba(246,245,243,.62);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:0;box-shadow:0 1px 0 var(--glass-line)}
.jnav .in{min-height:62px}
.brand svg{display:none}
.brand b{font:650 17px/1 var(--disp);letter-spacing:-.02em}
.brand span{color:var(--ash);margin-top:3px}
.jnav .lnk{font-weight:500;color:var(--ink);border-radius:999px;padding:9px 14px}
.jnav .lnk:hover{background:rgba(29,29,31,.06);color:var(--ink)}
.jnav .lnk[href*="/book"]{background:var(--teal);color:#fff;font-weight:600;box-shadow:0 8px 20px -10px rgba(42,91,215,.8)}
.jnav .lnk[href*="/book"]:hover{background:#244FBF;color:#fff}

/* buttons: blue pill like "Book a call" */
.btn{font-family:var(--sans);border-color:rgba(29,29,31,.14);background:rgba(255,255,255,.75)}
.btn.dark,.btn.teal{background:var(--teal);border-color:var(--teal);color:#fff;box-shadow:0 8px 20px -12px rgba(42,91,215,.85)}
.btn.dark:hover,.btn.teal:hover{background:#244FBF}
.btn.gold{background:var(--ink);border-color:var(--ink);color:#fff}
.btn.ghost{background:transparent}
.night .btn:not(.dark):not(.teal):not(.gold){background:rgba(255,255,255,.1);color:var(--on);border-color:rgba(255,255,255,.2)}
input[type=email],input[type=text],input[type=password],input[type=search],input[type=url],input[type=number],select,textarea{background:#fff;color:#1D1D1F;border-color:rgba(29,29,31,.16)}
select{appearance:none;-webkit-appearance:none;padding-right:40px;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 8l5 5 5-5' fill='none' stroke='%231D1D1F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 14px center/16px no-repeat}
select option{color:#1D1D1F;background:#fff}

/* tabs, options, pills */
.tabs{background:rgba(29,29,31,.07)}
.tabs button[aria-selected=true]{background:#fff;color:var(--ink)}
.opt{background:rgba(255,255,255,.8);border-color:rgba(29,29,31,.14)}
.opt:hover{border-color:var(--teal2)}
.opt[aria-pressed=true]{border-color:var(--teal);background:rgba(42,91,215,.08)}
.pill{background:rgba(29,29,31,.07)}
.chip{background:rgba(255,255,255,.75);border-color:rgba(29,29,31,.14)}
.mk.course{background:var(--goldt);color:#6B5124}
.mk.how{background:rgba(29,29,31,.07)}
.bar i{background:linear-gradient(90deg,var(--teal),var(--teal2))}
.locked .veil{background:linear-gradient(180deg,rgba(215,213,210,.2),rgba(215,213,210,.85))}
.lframe{background:radial-gradient(120% 90% at 30% 20%,#9DB4EC 0%,#2A5BD7 38%,#1D1D1F 82%)}

/* the string: pencil on plaster, blue progress */
.jstring .st.base{stroke:rgba(29,29,31,.18)}
.jstring .st.done{stroke:var(--teal)}
.jstring .ring{stroke:var(--teal);opacity:.75}
.jstring .ringc{stroke:rgba(255,255,255,.7)}
.jstring .bead{stroke:rgba(29,29,31,.35)}
.jstring .bead.lock{fill:rgba(255,255,255,.55);stroke:rgba(29,29,31,.18)}
.jstring .future{stroke:rgba(29,29,31,.22)}
.jstring .glab{fill:var(--teal2)}
.jstring .gnode{fill:var(--ink)}
.sdet .wk,.sdet dt{color:var(--teal2)}

.foot{border-top:0;background:rgba(246,245,243,.55);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--ash)}
.foot a{color:var(--ink)}
.toast{background:var(--ink)}
::selection{background:rgba(42,91,215,.2)}
.jstring stop[offset="0"]{stop-color:#1D1D1F}.jstring stop[offset="1"]{stop-color:#2A5BD7}

/* page pieces that carried the old teal/night colours */
.qs{background:rgba(246,245,243,.72)!important;color:var(--ink)!important;border-bottom:0!important;box-shadow:0 1px 0 var(--glass-line);backdrop-filter:saturate(180%) blur(20px)!important;-webkit-backdrop-filter:saturate(180%) blur(20px)!important}
.qs a,.qs button,.qs-b{color:var(--ink)}
.qs-mark svg ellipse{stroke:var(--ink)}
.qs-line{background:linear-gradient(90deg,rgba(42,91,215,.7),rgba(42,91,215,.2))!important}
.qs-b i{background:#fff!important;border-color:var(--teal)!important}
.qs-b.seen i{background:var(--teal)!important}
.qs-b.on i{background:var(--gold)!important;border-color:var(--gold)!important;box-shadow:0 0 0 5px rgba(201,162,94,.25)!important}
.hub-c.dark{background:linear-gradient(150deg,#1D1D1F,#2E2E30)!important;border-color:#1D1D1F!important}
.hub-c.dark .k{color:var(--teal2)!important}
.hub-c .beads i{border-color:var(--teal2)!important}
.hub-c .beads i.on{background:var(--teal2)!important}
.hub-c .beads i.cur{background:var(--gold)!important;border-color:var(--gold)!important}
.tm2-c .ph,.tm-ph{background:linear-gradient(160deg,#EDECE9,#CFCDC9)!important}
.tm2-c .ph b,.tm-mono b{color:var(--ink)!important;font-weight:300!important}
.tm2-c .pb i,.tm-bar i,.rm:before{background:linear-gradient(90deg,var(--teal),var(--gold))!important}
.rm li:before{background:var(--teal)!important;box-shadow:0 0 0 5px rgba(42,91,215,.15)!important}
.rm li.gold:before{background:var(--gold)!important;box-shadow:0 0 0 5px rgba(201,162,94,.25)!important}
.pa-str,.pa-o .ic,.tp-how{background:#1D1D1F!important}
.pa-o[aria-pressed=true]{background:#fff!important;box-shadow:0 0 0 3px rgba(201,162,94,.25)!important}
.tm-pill{background:rgba(42,91,215,.1)!important;color:#2A5BD7!important}
.tp .stats b{font-weight:300!important}
[style*="background: rgb(94, 199, 214)"]{background:#7FA0EE!important}
[style*="background: rgb(19, 34, 42)"]{background:#1D1D1F!important}
[style*="rgba(94,199,214"]{border-color:rgba(127,160,238,.22)!important}
span.pill[style*="rgba(94,199,214"]{background:rgba(127,160,238,.16)!important}
.mk.course[style*="214,161,63"]{background:rgba(201,162,94,.2)!important}
/* drawn icons and strings */
svg [stroke="#5ec7d6"]{stroke:#7FA0EE}
svg [stroke="#3b7c88"]{stroke:#2A5BD7}
svg [stroke="#13222a"],svg [stroke="#111b20"]{stroke:#1D1D1F}
svg [stroke="#d6a13f"]{stroke:#C9A25E}
svg [fill="#d6a13f"]{fill:#C9A25E}
svg [fill="#eef6f7"]{fill:#F5F5F7}
stop[stop-color="#3b7c88"]{stop-color:#1D1D1F}
stop[stop-color="#5ec7d6"]{stop-color:#2A5BD7}
.qs-b.on,.qs-b.on *,.qs-b:hover,.qs-b:hover *{color:var(--ink)!important}.qs-b.on{font-weight:650}
/* "The wall" link says where it goes */
.jnav .lnk.back{display:inline-flex;flex-direction:column;align-items:flex-start;line-height:1.1;padding-top:6px;padding-bottom:6px}
.jnav .lnk.back::after{content:"back to main menu";font-size:10.5px;font-weight:500;color:var(--ash);margin-top:2px;letter-spacing:.01em}
/* team avatars (drawn, same style for everyone) */
.tm-av{position:absolute;inset:0;display:block}
.tm-av img{width:100%;height:100%;object-fit:contain;display:block}
.tm-av b{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);font:650 clamp(20px,2.6vw,34px)/1 var(--disp);letter-spacing:-.03em;color:var(--ink)}
.tm-ph:has(.tm-av),.tm2-c .ph:has(.tm-av){background:linear-gradient(160deg,#F2F1EE,#DEDCD8)!important}
.tm2-c .ph{position:relative}.tm2-c .ph .tm-av b{font:650 19px/1 var(--disp)!important;letter-spacing:-.03em}