/* Courses mega menu and the enquiry form. Loaded only when the courses panel is in use. */

/* The Courses item in the header is a button that opens the panel */
.lst-menu .lst-mega-btn,.lst-menu-mobile .lst-mega-btn{display:inline-flex;align-items:center;gap:6px;font:inherit;cursor:pointer;border:0;background:none;color:var(--lst-heading)}
.lst-menu .lst-mega-btn{padding:9px 12px;border-radius:999px;font-weight:600;font-size:15px;white-space:nowrap}
.lst-menu .lst-mega-btn:hover,.lst-menu .lst-mega-btn[aria-expanded="true"]{background:var(--lst-primary-soft)}
.lst-mega-btn svg{transition:transform .2s}
.lst-mega-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.lst-menu-mobile .lst-mega-btn{display:flex;width:100%;justify-content:space-between;padding:14px 4px;border-bottom:1px solid var(--lst-border);border-radius:0;font-weight:700;font-size:17px}

/* The panel drops down under the header */
.lst-mega{position:absolute;left:0;right:0;top:100%;z-index:60;background:var(--lst-surface);border-bottom:1px solid var(--lst-border);box-shadow:0 30px 60px rgba(0,0,0,.18);max-height:calc(100vh - 90px);overflow:auto;animation:lstDrop .18s ease-out}
.lst-mega[hidden]{display:none}
@keyframes lstDrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.lst-mega .lst-container{padding-top:28px;padding-bottom:30px}
.lst-mega-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}
.lst-mega-head h2{font-size:clamp(22px,2.4vw,28px);margin:0 0 4px}
.lst-mega-head p{margin:0;color:var(--lst-muted)}
.lst-mega-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.lst-mega-grid li{display:flex}
.lst-course{flex:1;width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:left;font:inherit;cursor:pointer;padding:13px 16px;border:1px solid var(--lst-border);border-radius:14px;background:var(--lst-bg);color:var(--lst-heading);transition:border-color .15s,background .15s,transform .15s}
.lst-course:hover,.lst-course:focus-visible{border-color:var(--lst-primary);background:var(--lst-primary-soft);transform:translateY(-1px)}
.lst-course-name{font-weight:700;font-size:15px;line-height:1.3}
.lst-course-time{flex:none;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--lst-primary-soft);color:var(--lst-primary-text);white-space:nowrap}
.lst-course:hover .lst-course-time,.lst-course:focus-visible .lst-course-time{background:var(--lst-bg)}
.lst-mega-foot{margin:18px 0 0;font-weight:700}
.lst-mega-foot a{display:inline-flex;align-items:center;gap:6px}
@media(max-width:1100px){.lst-mega-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.lst-mega-grid{grid-template-columns:1fr}.lst-mega .lst-container{padding-top:20px;padding-bottom:24px}}

/* The enquiry form */
.lst-modal{position:fixed;inset:0;z-index:100001;display:flex;align-items:center;justify-content:center;padding:16px}
.lst-modal[hidden]{display:none}
.lst-modal-back{position:absolute;inset:0;background:rgba(10,10,10,.6)}
.lst-modal-box{position:relative;width:100%;max-width:560px;max-height:calc(100vh - 32px);overflow:auto;background:var(--lst-surface);color:var(--lst-text);border-radius:26px;padding:34px 32px 28px;box-shadow:0 30px 80px rgba(0,0,0,.4)}
.lst-modal-x{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--lst-border);background:var(--lst-bg);color:var(--lst-heading);cursor:pointer}
.lst-modal h2{font-size:clamp(24px,3vw,30px);margin:10px 44px 8px 0}
.lst-enq-about{margin:0 0 22px}
.lst-field{margin-bottom:14px}
.lst-field label{display:block;margin-bottom:6px;font-weight:700;font-size:14px;color:var(--lst-heading)}
.lst-field input,.lst-field select{width:100%;padding:13px 14px;border:1.5px solid var(--lst-border);border-radius:12px;font:inherit;font-size:16px;background:var(--lst-bg);color:var(--lst-heading)}
.lst-field input:focus,.lst-field select:focus{outline:none;border-color:var(--lst-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--lst-primary) 25%,transparent)}
.lst-field [aria-invalid="true"]{border-color:#c0392b}
.lst-hp{position:absolute;left:-9999px;width:0;height:0;opacity:0}
.lst-enq-err{margin:4px 0 14px;padding:10px 14px;border-radius:10px;background:var(--lst-bad-bg,#fdecea);color:var(--lst-bad,#b42318);font-weight:600;font-size:14.5px}
.lst-enq-err[hidden]{display:none}
.lst-enq-actions{display:flex;flex-wrap:wrap;gap:12px}
.lst-enq-actions .lst-btn{flex:1 1 200px}
.lst-btn-wa{background:#25d366;color:#06351a}
.lst-btn-wa:hover{background:#25d366;color:#06351a;filter:brightness(1.06)}
.lst-enq-note{margin:12px 0 0;font-size:13px;color:var(--lst-muted)}
.lst-enq-done p{margin:0 0 10px}
.lst-done-when{font-weight:800;font-size:18px;color:var(--lst-heading)}
.lst-done-quiz{margin:22px 0 18px;padding:20px;border-radius:18px;background:var(--lst-primary-soft)}
.lst-done-quiz h3{margin:0 0 6px;font-size:19px}
.lst-done-quiz p{margin:0 0 14px}
.lst-done-close{margin-top:4px}
body.lst-modal-open{overflow:hidden}
/* On a phone the form is a card that floats up from the bottom: at most 75% of the screen high, with room on both sides and underneath */
@media(max-width:560px){
	.lst-modal{padding:0 14px calc(16px + env(safe-area-inset-bottom,0px));align-items:flex-end}
	.lst-modal-box{max-width:none;max-height:75vh;max-height:75dvh;padding:22px 18px 20px;border-radius:24px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;animation:lstSheet .3s cubic-bezier(.2,.8,.2,1)}
	.lst-modal-x{position:sticky;top:0;float:right;margin:-6px -2px 8px 10px;z-index:3}
	.lst-modal h2{margin:4px 0 8px;font-size:clamp(22px,6vw,26px)}
	.lst-enq-actions .lst-btn{flex-basis:100%}
}
@keyframes lstSheet{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.lst-modal-box{animation:none}}

/* Anything marked hidden stays hidden, even when a button style says otherwise */
.lst-modal [hidden],.lst-mega [hidden]{display:none!important}