@font-face { font-family: 'TTCommonsPro'; src: url(/hashed/assets/TTCommonsPro-Normal.3db9973eee.woff2) format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'TTCommonsPro'; src: url(/hashed/assets/TTCommonsPro-Light.f2952d104f.woff2) format('woff2'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'TTCommonsPro'; src: url(/hashed/assets/TTCommonsPro-Medium.a15ff295ae.woff2) format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'TTCommonsPro'; src: url(/hashed/assets/TTCommonsPro-Bold.fc7e364914.woff2) format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'TTCommonsPro'; src: url(/hashed/assets/TTCommonsPro-ExtraBlack.59d3730f54.woff2) format('woff2'); font-weight: 900; font-style: normal; font-display: swap; }
/* Montserrat */
@font-face { font-family: 'Montserrat'; src: url(/hashed/assets/Montserrat-Normal.a341f805f5.woff2) format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url(/hashed/assets/Montserrat-Bold.4441cd5b96.woff2) format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url(/hashed/assets/Montserrat-BoldItalic.df381ba84a.woff2) format('woff2'); font-weight: 700; font-style: italic; font-display: swap; }

:root {
    --serif: 'Montserrat', Georgia, serif;
    --sans: 'TTCommonsPro', Arial, sans-serif;
    
    --white: #FFFAFB;
    --black: #242629;
    
    --pink:   #E97BA1;
    --peach:  #F18888;
    --yellow: #FCC856;
    --green:  #6ABFA6;
    --blue:   #6ABED2;
    --purple: #BAC5FB;
    --gray: #737982;
    --pink-light: #FFD8E5;
    --peach-light: #FFE4E2;
    --yellow-light: #FFF2D2;
    --green-light: #DEFFF6;
    --blue-light: #D8F4FF;
    --purple-light: #E3E7FF;
    --gray-light: #E7E7E7;
    --pink-bright: #E98DAD;
    --peach-bright: #F19995;
    --yellow-bright: #FCC26A;
    --green-bright: #7BC5AF;
    --blue-bright: #7DC5D5;
    --purple-bright: #7E96E7;
    --green-dark: #48927C;
    
    --link: #5e7ce1;
    
    --focus: var(--blue-light);
    --tap-hightlight: var(--blue-light);
    --link-hover: var(--blue-bright);
    --accent: var(--green-bright);
    --action: var(--accent);
    --placeholder: var(--gray);
    --error-background: var(--pink-light);
    
    --inset-shadow: 2px 2px 0px 2px rgba(0,0,0,.1) inset;
    --button-shadow: 5px 5px 0px var(--black);
    --radius: 30px;
}

.accent-white   { --accent: white;   }
.accent-black   { --accent: var(--black);   }
.accent-pink   { --accent: var(--pink);   }
.accent-peach  { --accent: var(--peach);  }
.accent-yellow { --accent: var(--yellow); }
.accent-green  { --accent: var(--green);  }
.accent-blue   { --accent: var(--blue);   }
.accent-purple { --accent: var(--purple); }
.accent-gray   { --accent: var(--gray-light); }
.accent-pink-light   { --accent: var(--pink-light);   }
.accent-peach-light  { --accent: var(--peach-light);  }
.accent-yellow-light { --accent: var(--yellow-light); }
.accent-green-light  { --accent: var(--green-light);  }
.accent-blue-light   { --accent: var(--blue-light);   }
.accent-purple-light { --accent: var(--purple-light); }
.accent-gray-light   { --accent: var(--gray-light);   }
.accent-pink-bright   { --accent: var(--pink-bright);   }
.accent-peach-bright  { --accent: var(--peach-bright);  }
.accent-yellow-bright { --accent: var(--yellow-bright); }
.accent-green-bright  { --accent: var(--green-bright);  }
.accent-blue-bright   { --accent: var(--blue-bright);   }
.accent-purple-bright { --accent: var(--purple-bright); }
.accent-gray-bright   { --accent: var(--gray-bright);   }

* {
    font-family: inherit;
    font-size: inherit;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
}
*,*:before,*:after {
    box-sizing: inherit;
}
html {
    box-sizing: border-box;
/*    scroll-behavior: smooth;*/
}
body {
    font-family: var(--serif);
    font-size: 20px;
    font-size: calc(13px + min(10px, 2vw));
    font-weight: 400;
    line-height: 1.5;
    background-color: var(--white);
    color: var(--black);
}
header {
    top: var(--alert-height, 0px); 
}
html, body {
    margin: 0;
    padding: 0;
}
body, .modal {
    scrollbar-gutter: stable both-edges;
}
::-webkit-scrollbar-track {
    background: transparent;
}
img {
    width: 100%;
    border-radius: 10px;
}
img.teacherimage {
    max-width: 500px;
}
main>p, header>p, main>ul, main>h1, main>h2, main>h3, main>blockquote, main>img, main>pre, main>form, .block, hr, .sitemap, .box {
    --maxwidth: 860px;
    --blockwidth: calc(min(148px + 52vw, var(--maxwidth), 100vw - 10px));
    margin-inline: auto;
    max-width: var(--blockwidth);
}
main>img {
    display: block;
    width: var(--blockwidth);
}
.block, .box {
    position: relative;
}
.box {
    background: var(--green);
    padding-top: 2em;
    padding-inline: 1.5em;
    padding-bottom: 1em;
    border-radius: var(--radius);
}
.videocontainer {
    margin-top: 1em;
    padding-bottom: 56.25%;
    user-select: none;
    -webkit-user-select: none;
}
.videocontainer video {
    display: block;
    position: absolute;
    border-radius: 30px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 5s cubic-bezier(.5,0,.5,1);
    transition-delay: 3s;
    cursor: pointer;
}
.videocontainer button {
    position: absolute;
    --s: calc(10px + var(--blockwidth)/5);
    left: calc(50% - var(--s)/2);
    bottom: calc(50% - var(--s)/2);
    width: var(--s);
    height: var(--s);
    border-radius: calc(var(--s)/2);
    color: var(--black);
    transition: opacity .3s ease-in, transform .3s ease-in-out;
    box-shadow: none;
    background: no-repeat center/100% url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOTUiIGhlaWdodD0iOTUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTYzIDQ1LjI3YTIgMiAwIDAgMSAwIDMuNDZMMzkgNjIuNmEyIDIgMCAwIDEtMy0xLjczVjMzLjE0YTIgMiAwIDAgMSAzLTEuNzNsMjQgMTMuODZaIiBmaWxsPSIjZmZmIi8+PC9zdmc+) rgba(0,200,220,.2);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 0;
}
.videocontainer.short.playing video {
    transform: scale(1.03);
}
.videocontainer.playing button, .videocontainer.playing:hover button {
    opacity: 0 !important;
    transform: rotate(10deg) scale(.1, .1) !important;
}
.videocontainer:hover button {
    transform: scale(1.3);
}
.videocontainer:active button {
    transform: scale(.8);
}
ol li + li {
    margin-top: .5em;
}
h1, h2, h3 {
    font-family: var(--sans);
    font-weight: 700;
    line-height: 1.5;
}
p {
    margin-block: 1em;
}
em {
    font-style: italic;
    font-weight: bold;
}
p.headline {
    font-size: 130%;
    text-align: center;
    --maxwidth: 700px;
}
h1 {
    font-size: 2rem;
    font-family: var(--sans);
    text-transform: uppercase;
    font-weight: 900;
}
p + h1 {
    margin-top: 100px;
}
h2 {
    font-size: 1.75rem;
}
h2.blog-toc-title {
    margin-top: 3em;
}
h3 {
    font-size: 1.5rem;
}
h1:has(+h3) {
    margin-bottom: .5em;
}
h1 + h3 {
    margin-top: 1em;
}
pre {
    font-size: .5em;
    font-family: courier, monospace;
}
form {
    margin-top: 1.5em;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    gap: .5em;
}
form.vertical {
    display: grid;
}
form.vertical button {
    width: 100%;
}
form label {
    font-family: var(--sans);
}
.sidebyside input, .sidebyside button {
    flex: 1;
}
.sidebyside input[type=email], .sidebyside input[type=text] {
    width: 15ch;
}
button, input[type=text], input[type=date], input[type=email], input[type=tel], input[type=submit], .pseudobutton, select {
    margin: 0;
    border-radius: var(--radius);
    white-space: nowrap;
    padding-inline: 1em;
    appearance: none;
    -webkit-appearance: none;
    font-size: 24px;
    font-size: calc(12px + min(12px, 2vw));
    height: 2.5em;
    font-family: var(--sans);
    font-weight: 900;
    line-height: 1.2;
    border: 2px solid var(--black);
    color: var(--black);
    cursor: pointer;
}
button, .pseudobutton {
    text-transform: uppercase;
}
input[type=text], input[type=email], input[type=date], input[type=tel] {
    cursor: text;
    width: 100%;
    outline: none;
    background-color: var(--white);
    box-shadow: var(--inset-shadow);
}
input[type=date] {
    background: var(--white);
    text-align: center;
}
input[type=text]:focus, input[type=email]:focus, input[type=date]:focus, input[type=tel]:focus {
    box-shadow: var(--inset-shadow), 0px 0px 0px 5px var(--focus);
}
input[type=text]::placeholder, input[type=email]::placeholder, input[type=date]::placeholder, input[type=tel]::placeholder {
    text-align: center;
    color: var(--placeholder);
    font-weight: 100;
}
input[type="checkbox"] {
    width: 24px !important;
    aspect-ratio: 1; 
    min-height: 24px;
    cursor: pointer;
    appearance: none;
    border: 2px solid var(--black);
    border-radius: 4px;
    background-color: var(--white);
    display: inline-block;
    position: relative;
}
input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    width: 9px;
    height: 22px;
    border-right: 4px solid var(--black); 
    border-bottom: 4px solid var(--black); 
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(42.5deg); 
}
label:has(input[type="checkbox"]) {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.25em; 
    margin-top: 0.25em;
    gap: 0.5em;
}
button, input[type=submit], .button, .pseudobutton, select {
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    touch-action: manipulation;
    background: var(--accent);
    cursor: pointer;
    box-shadow: var(--button-shadow);
}
a.pseudobutton {
    color: var(--black) !important;
    display: block; 
    user-select: none; 
    -webkit-user-select: none; 
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    touch-action: manipulation; 
    text-align: center; 
    line-height: 2.5em; 
}
a.pseudobutton:hover {
    filter: brightness(110%); 
}
a.pseudobutton:active {
    transform: translate(5px, 5px); 
    box-shadow: 0px 0px 0px var(--black); 
}
select {
    color: var(--black);
    outline: none;
    background: var(--white);
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTkuMTMgMTAuNzJhMiAyIDAgMCAxLTMuMjYgMGwtNS4yLTcuM0EyIDIgMCAwIDEgMi4yOC4yNEgxMi43YTIgMiAwIDAgMSAxLjYzIDMuMTZsLTUuMjEgNy4zWiIgZmlsbD0iIzAwMCIvPjwvc3ZnPg==);
    background-position: calc(100% - 15px) 50%;
    background-size: .5em;
    background-repeat: no-repeat;
    padding-right: 1.4em;
}
select:active {
    transform: translate(5px, 5px);
    box-shadow: none;
}
.toggle {
    display: flex;
    position: relative;
    gap: 1px;
}
.toggle input[type=radio] {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}
.toggle, .toggle * {
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.toggle input[type=radio] + span {
    font-size: 80%;
    border-radius: var(--radius);
    overflow: hidden;
    padding-block: 3px;
    padding-inline: 10px;
    font-weight: bold;
}
.toggle input[type=radio]:checked + span {
    background: var(--action);
    color: var(--white);
}
.toggle input[type=radio]:active + span {
    background: var(--green);
}
.buttoncancel {
    color: var(--black);
    background: #fff;
}
.stickytop {
    position: sticky;
    top: 0;
}
button:hover, input[type=submit]:hover, .button:hover, .buttonlink:hover {
    color: var(--black);
    filter: brightness(110%);
}
button:active, input[type=submit]:active, .button:active {
    transform: translate(5px, 5px);
    box-shadow: 0px 0px 0px var(--black);
}
a {
    --accent: var(--link);
    -webkit-tap-highlight-color: var(--tap-highlight);
    color: var(--accent);
    text-decoration: none;
}
a:hover {
    color: var(--link-hover);
}
p b {
/*    background-color: var(--yellow-light);*/
}
p a, li a {
    --accent-h: 2px;
    background: 
        linear-gradient(
            to right,
            var(--pink) 0%,  var(--pink) 20%,
            var(--peach) 20%, var(--peach) 40%,
            var(--yellow) 40%, var(--yellow) 60%,
            var(--green) 60%, var(--green) 80%,
            var(--blue) 80%, var(--blue) 100%
        ) no-repeat right bottom / 0 var(--accent-h);
    background-size: 0px 0px;
    transition: background-size .3s;
}
p a:hover, p a:focus-visible, li a:hover, li a:focus-visible {
    background-size: 100% var(--accent-h);
    background-position-x: left;
}
p a:active, li a:active {
    background-size: 100% 4px;
}
sup {
    vertical-align: top;
    position: relative;
    top: -0.5em;
}
blockquote {
    border-left: .5em solid var(--yellow);
    padding-left: .5em;
}
hr {
    margin-top: 2em;
    margin-bottom: 2em;
    border: 0;
    height: 2px;
    background-image: linear-gradient(
        to right,
        var(--pink) 0%,  var(--pink) 20%,
        var(--peach) 20%, var(--peach) 40%,
        var(--yellow) 40%, var(--yellow) 60%,
        var(--green) 60%, var(--green) 80%,
        var(--blue) 80%, var(--blue) 100%
    );
}
.sitemap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 2em;
}
footer {
    margin-top: 4em;
    padding-top: 4em;
    background-color: var(--black);
}
footer a {
    color: var(--white);
}
footer a:hover {
    color: var(--white);
}
footer section {
    display: flex-item;
    margin-right: 1em;
    margin-bottom: 1em;
    font-size: 18px;
    user-select: none;
    -webkit-user-select: none;
}
footer ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.subtle {
    font-size: 10px;
}
.subtle.center {
    text-align: center;
}
.subtle, .breadcrumbs {
    color: var(--gray);
}
.box .subtle {
    color: var(--black);
}
.subtle, .footnote, .breadcrumbs {
    font-size: 18px;
}
.subtle, .accent, .breadcrumbs {
    font-family: var(--sans);
    font-weight: 400;
}
.breadcrumbs {
    -webkit-user-select: none;
    user-select: none;
}
.logo-base {
    background: transparent;
    background-image: url(/hashed/assets/logo.24917fb824.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-tap-highlight-color: transparent;
    display: block;
}
.logo {
    margin-inline: auto;
    width: 50vw;
    height: calc(min(40px + 10vw, 140px));
    transition: transform .3s ease-in-out;
}
.logo-menu {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: white;
    padding: 5px;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1), 0 2px 8px rgba(0,0,0,0.08);
}
.logo-base span { display: none; }
.ham, .cart {
    width: 70px;
    height: 70px;
    position: absolute;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    top: calc(5px + var(--alert-height, 0px));
    -webkit-tap-highlight-color: transparent;
    background-size: 100%;
    user-select: none;
    -webkit-user-select: none;
}
.ham {
    background-color: transparent;
    border: none;
    box-shadow: none;
    left: 5px;
    background-image: url(/hashed/assets/ham.3ba5129333.svg);
    opacity: .15;
}
.ham:hover {
    background-color: transparent;
    opacity: .3;
}
.menu {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 25%;
    min-width: 350px;
    background-color: var(--peach);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 2rem 3rem;
    z-index: 1200;
    opacity: 1;
    transition: opacity 0.3s ease;
    overflow-y: auto;
}
.menu.hidden {
    opacity: 0;
    pointer-events: none;
}
.hidden {
    display: none;
}
.menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); 
    z-index: 1050;
  }
.menu-header {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    margin-bottom: 1.5rem;
}
.menu-close {
    position: absolute;
    top: 0;
    right: 0;
    background: transparent;
    border: none;
    color: white;
    font-size: 3rem;
    cursor: pointer;
    padding: 10px 25px;
    line-height: 1;
    box-shadow: none;
    height: auto;
    margin: 0;
    font-weight: normal;
}
.menu-close:active {
    transform: none;
}
.menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    text-align: center;
}  
.menu-item {
    margin: 10px 0;
    padding: 6px 0;
} 
.menu-item a {
    color: var(--white);
    text-decoration: none;
    font-size: 1.2rem;
    padding: 0;
    display: inline-block;
    transition: transform 0.2s;
}
.menu-item a:active {
    transform: scale(0.98);
}  
.menu-separator {
    margin: 0 20px;
}
.menu-footer {
    margin-top: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 767px) {
    .menu {
        width: 100%;
        min-width: unset; 
        padding: 3rem 3.5rem;
    }
    .menu-close {
        top: 10px;
        right: 10px;
    }
    .menu-footer {
        margin-top: 35px;
    }
}
#menu-items,
#menu-overlay {
  opacity: 1;
}
.menu-closing {
  transition: opacity 0.3s ease;
  opacity: 0;
}
.cart {
    top: calc(5px + var(--alert-height, 0px));
    right: 10px;
    color: transparent;
    background-color: var(--white);
    background-image: url(/hashed/assets/cart.72ddced450.svg) !important;
    border-radius: var(--radius);
    position: fixed;
    z-index: 5;
}
.cart:hover {
    color: transparent;
    transform: scale(1.1);
}
.cart:after {
    content: attr(data-count);
    font-family: var(--sans);
    font-weight: bold;
    font-size: 20px;
    line-height: 14px;
    text-align: center;
    top: 16px;
    left: 24px;
    position: absolute;
    display: block;
    color: var(--black);
    width: 18px;
    height: 18px;
    margin: 0;
    padding: 0;
/*    background: white;*/
}
.cart:active {
    transform: translate(5px, 5px);
    box-shadow: none;
}
.cart[data-count="0"] {
    opacity: .15;
    position: absolute;
}
.cart[data-count="0"]:after {
    opacity: 0;
}
#duck {
    perspective: 100px;
    cursor: grab;
}
#duck:active {
    cursor: grabbing;
}
#duck:after {
    content: "";
    display: block;
    width: 100px;
    height: 100px;
    background-image: url(/hashed/assets/duck.763e4cb137.svg);
    background-position: center;
    background-repeat: no-repeat;
    margin-inline: auto;
    transition: transform .3s ease-in-out;
}
#duck:hover:after {
    transform: rotate3d(0,1,0,-180deg);
}
#duck:active:after {
    transform: rotate3d(0,1,0,-180deg)rotate(-5deg)scale(1.3);
}
.alert-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: var(--yellow);
    color: var(--black);
    padding: 10px;
    text-align: center;
    font-size: 1.2rem;
    z-index: 1000;
}

.modal {
    display: flex;
    flex-flow: column;
    gap: 1em;
}
.modal button {
    width: 100%;
}
.modal ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.modal.menu ul {
    font-family: var(--sans);;
}
.error {
    border-radius: var(--radius);
    padding: 5px;
    font-family: var(--sans);
    background: var(--error-background);
}
.error b {
    font-family: var(--sans);
    font-weight: bold;
    text-transform: uppercase;
}
.debug {
    display:block;
    position:fixed;
    bottom:0;
    z-index:100;
    pointer-events:none;
    background:rgba(255,255,255,.0);
    text-shadow:1px 0px 0px white, -1px 0px 0px white, 0px 1px 0px white, 0px -1px 0px white;
}

.button-grid {
    margin-top: 1.5em;
    margin-inline: 1em;
    display: grid;
    --min-item-width: 300px;
    grid-template-columns: repeat(auto-fit, minmax(var(--min-item-width), 1fr));
    gap: 1em;
}
.button-grid.stack-vertically {
    display: flex;
    flex-flow: column nowrap;
}
.button-grid.stack-vertically a {
}
.button-grid.stack-vertically a h2 {
    text-align: center;
}

.block .button-grid {
    margin: 0;
}

.button-grid .product {
    padding: .25em;
    border: 1px solid var(--black);
    border-radius: 10px;
    color: var(--black);
    font-family: var(--sans);
}
.button-grid .product h1 {
    line-height: 1;
    margin-top: .05em;
    margin-bottom: .2em;
}
.button-grid .product p {
    font-weight: 400;
    margin-bottom: .5em;
}
.button-grid .product:active {
    transform: translate(5px, 5px);
    box-shadow: none;
}
.button-grid .product > * {
    margin: 0;
}

.viewgroup {
    position: relative;
    margin-top: 1em;
    line-height: 1.2;
}
.viewgroup h1 {
    margin: 0;
    padding-block: .25em;
    top: 5px;
    z-index: 1;
    background: var(--white);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-top-left-radius: var(--radius);
    border-top-right-radius: var(--radius);
    border: 1px solid var(--black);
    box-shadow: -30px -5px 0px var(--white), 30px -5px 0px var(--white);
}
.viewgroup .session {
    display: block;
    border-bottom: 1px solid var(--black);
    border-left: 1px solid var(--black);
    border-right: 1px solid var(--black);
    font-family: var(--sans);
    padding: 5px;
    color: var(--black);
    background-color: var(--accent);
}
.viewgroup .session:hover {
    filter: brightness(1.1);
}
.viewgroup .session .date, .viewgroup .session .location {
    font-weight: 400;
}
.viewgroup .session:last-child {
    border-bottom: 1px solid var(--black);
    border-bottom-left-radius: var(--radius);
    border-bottom-right-radius: var(--radius);
}
.viewgroup .session:active {
    filter: brightness(1.2);
}
.productinfo {
    padding-block: .5em;
    border-bottom: 3px solid var(--black);
}
.viewgroup>* {
    padding-inline: .5rem;
}
.session .product {
    font-weight: 600;
}
.session .location {
    margin-bottom: .5em;
}
.session .date {
    text-align: right;
    font-size: .8em;
}
.control {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .5em;
    padding-left: 1em;
    padding-right: 1em;
}
.calendar {
    user-select: none;
    -webkit-user-select: none;
    cursor: default;
    touch-action: manipulation;
}
.calendar.month {
    display: grid;
    gap: 1px;
    margin-inline: 10px;
    grid-template-columns: repeat(7, calc((100% - 6px)/7));
    font-family: var(--sans);
}
.daynumber {
    display: block;
    line-height: 1;
}
.daynumber .past {
    color: var(--gray);
}
.daynumber .today {
    position: relative;
    left: -3px;
    padding-inline: 7px;
    background: var(--pink-bright);
    border-radius: 1em;
    color: var(--white);
    font-weight: bold;
}
.month-header {
    margin: 0;
    margin-top: 1em;
    margin-bottom: .5em;
    z-index: 1;
    top: -2px;
/*    border-top: 3px solid black;*/
    border-bottom: 3px solid var(--black);
    background: var(--white);
    -webkit-backdrop-filter: blur(50px);
}
.month-header .text {
    padding-bottom: 2px;
    padding-left: 10px;
    padding-right: 10px;
}
.day {
    min-height: 14vw;
    word-wrap: break-word;
    outline: 1px solid rgba(0,0,0,.05);
}
.day.skip {
    outline: none;
}
.daysessions {
    margin-bottom: .5em;
}
.calsession {
    color: var(--black);
    display: block;
    margin: -1px;
    padding-inline: 2px;
    font-size: calc(min(1.75vw,15px));
    background: var(--peach);
    border: 1px solid var(--black);
    border-radius: 5px;
    box-shadow: 2px 2px 0px var(--black);
    cursor: pointer;
    background: var(--accent);
    position: relative;
}
.calsession hr {
    margin: 0;
    background: none;
    border-top: .5px solid rgba(0,0,0,.2);
}
.calsession:hover {
    color: var(--black);
    filter: brightness(110%);
}
.calsession:active {
    transform: translate(2px, 2px) !important;
    box-shadow: none;
}
.calsessiontitle {
    font-weight: 900;
    font-family: var(--sans);
    text-transform: uppercase;
}
.calsessiondate, .calsessionlocation {
    font-size: .75em;
}

/* cart */
.lineitem {
    margin-block: 1em;
}
.lineitem .title {
    display: flex;
    gap: 1em;
    justify-content: space-between;
    font-family: var(--sans);
    font-weight: bold;
    border-bottom: .5px solid #ccc;
    color: var(--accent);
}
.lineitem .details {
    text-align: right;
}
.total {
    font-weight: 600;
}
.checkout {
    margin-bottom: 1.5em;
    position: sticky;
    bottom: 1em;
}
input.code {
    text-transform: uppercase;
}

input[type=file] {
    display: block;
    padding: 5em;
    border: 5px dashed var(--black);
}

/* links */
.link {
    font-family: var(--sans);
    font-weight: 600;
    display: block;
    margin-block: 10px;
    border-radius: var(--radius);
    border: 1px solid var(--black);
    padding: .8em;
    color: var(--black);
    box-shadow: 5px 5px 0px var(--black);
}
.link:hover {
    background: var(--green);
}
.link:active {
    transform: translate(5px, 5px);
    box-shadow: none;
}

/* loss */
#loss {
    display: flex;
    flex-flow: wrap;
    justify-content: space-evenly;
    gap: 1em;
    padding-inline: 1em;
}
#loss section {
    display: flex;
    flex-flow: column;
    max-width: 400px;
}
#loss section p {
    margin: 0;
}
#loss section a {
    align-self: center;
}

.buttonlist {
    padding-left: 0;
    list-style-type: none;
}
.buttonlist li {
    margin-block: 1em;
}
.buttonlink {
    position: relative;
    display: inline-block;
    padding-inline: 5px;
    margin-left: 3px;
    margin-right: 5px;
    border-radius: var(--radius);
    box-shadow: 0px 0px 0px 1px var(--black), 2px 2px 0px 2px var(--black);
    color: var(--black);
    background: none;
    background-color: var(--accent);
}
.buttonlink.subtle {
    opacity: .3;
}
.buttonlink:active {
    box-shadow: 0px 0px 0px 2px var(--black);
    transform: translate(3px, 3px);
}
.yesscript { display: none; }
.carousel-container {
    position: relative;
}
.imageset {
    display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.imageset::-webkit-scrollbar {
    display: none;
}
.imageset img {
    display: block;
    object-fit: contain;
    max-height: 512px;
    border-radius: 0;
}
.carousel-arrows {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
    justify-content: space-between;
    padding: 0 10px;
}
.arrow-btn {
    background: var(--peach);
    color: var(--white);
    border: none;
    font-size: 1em;
    border-radius: 50%;
    padding: 0;
    width: 48px;
    height: 48px;

}
.arrow-btn:hover {
    color: var(--yellow);
}
.arrow-btn.hide {
    visibility: hidden; 
    opacity: 0;
    pointer-events: none;
    transition: visibility 0.3s ease, opacity 0.3s ease;
}
@media screen and (max-width: 767px) {
    .imageset img {
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }
    .carousel-arrows {
        display: none;
    }
}
.pagination-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 16px 0 32px 0;
}
.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: none;
    box-shadow: none;
    background-color: var(--yellow);
    padding: 0;
    transition: background-color 0.3s ease;
}
.dot:active {
    transform: none;
}
.dot.active {
    background-color: var(--peach);
}
.session-list { /* on class page */
    border: 1px solid var(--black);
    margin-bottom: .5em;
    border-radius: var(--radius);
    overflow: hidden;
    line-height: 1.2;
    font-size: 80%;
    font-family: var(--sans)
}
.session {
    display: block;
    padding: 1em;
    color: var(--black);
}
.button-grid .title {
    font-weight: 900;
    font-family: var(--sans);
    text-transform: uppercase;

}
.button-grid .subtitle {
    font-weight: bold;
    font-size: 80%;
}
.button-grid .location {
    display: inline-block;
    background-color: var(--black);
    border-radius: 5px;
    color: var(--accent);
    font-weight: bold;
    padding-inline: 3px;
    font-size: 80%;
}
.sold-out {
    position: relative;
    pointer-events: none;
    --black: rgba(0,0,0,.3);
}
.sold-out:after {
    content: 'SOLD OUT';
    position: absolute;
    color: black;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    line-height: 1em;
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    font-size: 120%;
    transform: translateY(-50%) rotate(-10deg);
}
.feature-list {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}
.feature-list img {
    max-width: 150px;
    margin-inline: 1em;
}
.cf-turnstile {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
}