@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;650;700;750;800&display=swap');

:root{
--bg:#f5f7fc;
--paper:#fff;
--ink:#14243e;
--muted:#647389;
--line:#dfe6f1;
--blue:#2561ed;
--deep:#1844ba;
--pale:#e7efff;
--red:#f14a50;
--soft:#ffedf0;
--green:#18785d;
--shadow:0 24px 70px #244a8a12;
--radius:25px;
--glass:#ffffffba}

*{
box-sizing:border-box}
html{
scroll-behavior:smooth;
scroll-padding-top:110px}
body{
margin:0;
background:var(--bg);
color:var(--ink);
font:15px/1.6 Manrope,Arial,sans-serif;
-webkit-font-smoothing:antialiased}
body.dark{
--bg:#101927;
--paper:#182538;
--ink:#edf3ff;
--muted:#a0aec4;
--line:#2b3b51;
--pale:#223b66;
--soft:#442932;
--glass:#182538d9;
--shadow:0 24px 70px #0002}
body.modal-open{
overflow:hidden}
button,input,select,textarea{
font:inherit;
color:inherit}
button,a,input,select,textarea{
-webkit-tap-highlight-color:transparent}
a{
color:inherit;
text-decoration:none}
button{
cursor:pointer}
button:disabled{
opacity:.45;
cursor:not-allowed}
button{
border:0;
background:none}
img{
max-width:100%;
display:block}
svg{
vertical-align:middle;
flex:none}
h1,h2,h3,h4,p{
margin:0}
h1,h2,h3,h4{
line-height:1.12;
letter-spacing:-.045em}
h1,h2{
font-weight:650}
h3,h4{
font-weight:750}
h2{
font-size:clamp(34px,4vw,57px)}
h3{
font-size:24px}
.container{
width:min(1280px,calc(100% - 72px));
margin:auto}
.section{
padding:94px 0}
.muted{
color:var(--muted)}
.small{
font-size:16px}
.eyebrow{
font-size:16px;
font-weight:800;
text-transform:uppercase;
letter-spacing:.17em;
display:flex;
align-items:center;
gap:9px;
color:var(--muted)}
.eyebrow:before{
content:'';
height:6px;
width:6px;
background:var(--red);
border-radius:50%}
.btn{
border-radius:14px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:13px;
padding:14px 21px;
line-height:1.4;
font-size:16px;
font-weight:800;
transition:transform .25s,background .25s,box-shadow .25s;
min-height:46px}
.btn:hover{
transform:translateY(-3px)}
.btn.primary{
background:var(--blue);
color:white;
box-shadow:0 9px 20px #2561ed20}
.btn.red{
background:var(--red);
color:white}
.btn.secondary{
background:var(--paper);
border:1px solid var(--line)}
.btn.soft{
background:var(--pale);
color:var(--blue)}
body.dark .btn.soft{
color:#b9ceff}
.btn.danger{
background:var(--soft);
color:var(--red)}
.btn.tiny{
padding:9px 13px;
min-height:36px;
font-size:16px}
.btn svg{
width:16px;
height:16px}
.iconbtn{
height:43px;
width:43px;
border:1px solid var(--line);
border-radius:13px;
display:inline-grid;
place-items:center;
background:var(--paper)}
.iconbtn:hover{
background:var(--pale)}
.row{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap}
.between{
justify-content:space-between}
.stack{
display:grid;
gap:16px}
.divider{
height:1px;
background:var(--line);
margin:25px 0}
.badge{
display:inline-flex;
padding:5px 10px;
border-radius:8px;
background:var(--pale);
color:var(--blue);
font-size:16px;
font-weight:800}
.badge.green{
background:#e2f5ed;
color:#18785d}
.badge.red{
background:var(--soft);
color:var(--red)}
.demo{
padding:9px 14px;
background:var(--paper);
border:1px dashed var(--line);
border-radius:12px;
color:var(--muted);
font-size:16px}
.lead{
font-size:16px;
color:var(--muted);
max-width:500px;
line-height:1.8}
.skip{
position:fixed;
top:-60px;
left:20px;
z-index:5000;
background:var(--paper);
padding:12px}
.skip:focus{
top:10px}
:focus-visible{
outline:3px solid #f14a50;
outline-offset:4px}
button[aria-pressed=true]{
font-weight:800}

/* Calm glass only on navigation, no decorative overlays on photographs. */
.header{
position:sticky;
top:0;
z-index:80;
background:var(--glass);
backdrop-filter:blur(20px) saturate(130%);
border-bottom:1px solid #91a8d022}
.header-inner{
height:91px;
display:flex;
align-items:center;
gap:28px}
.logo{
width:94px;
flex:none;
border-radius:8px;
overflow:hidden;
background:white;
padding:3px 6px}
.nav{
display:flex;
gap:26px;
margin-left:38px}
.nav a{
font-size:16px;
font-weight:700;
color:var(--muted);
position:relative}
.nav a:hover,.nav a.active{
color:var(--blue)}
.header-tools{
margin-left:auto;
display:flex;
gap:8px;
align-items:center}
.lang{
font-size:16px;
font-weight:800;
padding:9px}
.header .btn{
padding:12px 17px}
.hamb{
display:none}
.mobile-nav{
display:none}
.progress{
position:fixed;
top:0;
left:0;
height:2px;
background:var(--red);
z-index:100;
width:0}

/* Landing */
.hero{
position:relative;
overflow:hidden;
padding:65px 0 55px;
background:radial-gradient(ellipse at 77% 37%,#cfddff 0,transparent 54%),linear-gradient(135deg,#f6f9ff,#e9f0fd)}
body.dark .hero{
background:radial-gradient(ellipse at 77% 37%,#243f72,transparent 55%),linear-gradient(135deg,#101b2f,#1b2c48)}
.hero-grid{
display:grid;
grid-template-columns:1.05fr 1fr;
gap:50px;
align-items:center;
position:relative}
.hero h1{
font-size:clamp(58px,7.5vw,106px);
letter-spacing:-.075em;
line-height:1.02;
margin:22px 0 25px;
position:relative;
z-index:2}
.hero h1 em{
font-style:normal;
color:var(--blue);
position:relative}
.hero h1 em:after{
content:'';
position:absolute;
bottom:-5px;
left:0;
right:0;
height:9px;
border-bottom:3px solid var(--red);
border-radius:50%;
transform:rotate(-3deg)}
.hero .lead{
max-width:420px;
font-size:16px}
.hero-actions{
margin-top:29px}
.hero-foot{
margin-top:43px;
display:flex;
align-items:center;
gap:15px;
font-size:16px;
color:var(--muted)}
.hero-foot .rule{
width:39px;
height:1px;
background:var(--muted)}
.photo-stage{
height:530px;
position:relative;
isolation:isolate;
padding:12px 17px 15px 8px}
.photo-stage:before{
content:'';
position:absolute;
inset:25px 0 2px 27px;
background:var(--blue);
border-radius:33% 33% 18px 18px;
transform:rotate(5deg);
z-index:-1;
opacity:.14}
.hero-photo{
height:100%;
width:100%;
object-fit:cover;
object-position:50% 45%;
border-radius:34% 34% 19px 19px;
transform:rotate(-3deg);
box-shadow:0 25px 55px #264b7b1c}
.star{
position:absolute;
width:89px;
height:89px;
top:-10px;
right:0;
color:var(--red);
z-index:3;
animation:turn 50s linear infinite;
filter:drop-shadow(0 5px 10px #f14a5015)}
.photo-note{
position:absolute;
left:-17px;
bottom:32px;
background:var(--paper);
border:1px solid var(--line);
border-radius:15px;
padding:15px 20px;
box-shadow:var(--shadow);
transform:rotate(3deg);
display:flex;
align-items:center;
gap:11px;
font-size:16px;
line-height:1.6}
.photo-note b{
font-size:16px}
.mini-dot{
width:9px;
height:9px;
background:var(--red);
border-radius:50%}
.hero-bottom{
display:flex;
align-items:center;
justify-content:space-between;
border-top:1px solid #6d87ad26;
margin-top:47px;
padding-top:22px;
color:var(--muted);
font-size:16px}
.hero-bottom b{
color:var(--ink);
font-weight:700}
.vertical-text{
position:absolute;
right:-25px;
top:39%;
writing-mode:vertical-rl;
letter-spacing:.19em;
font-size:16px;
color:var(--muted)}
.intro-strip{
background:var(--paper);
border-bottom:1px solid var(--line);
padding:27px 0}
.intro-strip .container{
display:grid;
grid-template-columns:1.3fr 1fr 1fr;
gap:30px;
align-items:center}
.intro-strip p{
font-size:16px;
color:var(--muted)}
.intro-strip b{
display:block;
font-size:16px;
color:var(--ink);
margin-bottom:4px}
.intro-strip svg{
color:var(--blue)}
.intro-strip .row{
flex-wrap:nowrap}
.section-top{
display:flex;
align-items:end;
justify-content:space-between;
gap:30px;
margin-bottom:32px}
.section-top h2{
margin-top:13px}
.catalog-tools{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:27px;
gap:16px}
.tabs{
display:flex;
gap:6px;
flex-wrap:wrap}
.tab{
padding:11px 16px;
border-radius:12px;
font-size:16px;
color:var(--muted);
border:1px solid transparent;
transition:.2s}
.tab.active{
background:var(--ink);
color:var(--paper)}
.tab:hover{
border-color:var(--line)}
.search{
position:relative;
display:flex;
align-items:center;
gap:8px;
background:var(--paper);
border:1px solid var(--line);
border-radius:13px;
padding:9px 13px;
min-width:210px}
.search input{
border:0;
outline:none;
background:none;
min-width:0;
width:100%;
font-size:16px}
.search:focus-within{
outline:2px solid var(--blue)}
.courses{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:23px}
.course{
background:var(--paper);
border-radius:21px;
border:1px solid var(--line);
overflow:hidden;
transition:transform .35s,box-shadow .35s;
text-align:left;
padding:0}
.course:hover{
transform:translateY(-7px);
box-shadow:var(--shadow)}
.course-img{
height:235px;
overflow:hidden;
position:relative}
.course img{
height:100%;
width:100%;
object-fit:cover;
transition:transform .65s}
.course:hover img{
transform:scale(1.045)}
.course-img .badge{
position:absolute;
left:17px;
top:17px;
background:#fffdf5;
color:#283e5d}
.course-body{
padding:23px}
.course h3{
font-size:21px;
letter-spacing:-.035em;
min-height:47px}
.course p{
font-size:16px;
color:var(--muted);
margin:12px 0 20px;
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
min-height:38px}
.course .more{
display:flex;
justify-content:space-between;
align-items:center;
font-size:16px;
font-weight:800;
padding-top:17px;
border-top:1px solid var(--line)}
.circle-arr{
width:31px;
height:31px;
border-radius:50%;
background:var(--pale);
color:var(--blue);
display:grid;
place-items:center}
.empty{
border:1px dashed var(--line);
border-radius:20px;
padding:35px;
text-align:center;
color:var(--muted);
grid-column:1/-1}
.about-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:center}
.about-photo{
position:relative}
.about-photo img{
height:480px;
width:100%;
object-fit:cover;
border-radius:22px}
.about-photo:before{
content:'';
position:absolute;
width:130px;
height:130px;
border:1px solid var(--blue);
border-radius:50%;
left:-25px;
bottom:-25px;
z-index:-1}
.about-copy h2{
margin:16px 0 25px}
.about-copy p{
font-size:16px;
color:var(--muted);
margin-bottom:19px}
.about-line{
padding:17px 0;
border-bottom:1px solid var(--line);
display:flex;
gap:18px;
font-size:16px}
.about-line span{
color:var(--blue);
font-weight:800}
.portal-banner{
position:relative;
overflow:hidden;
border-radius:29px;
background:var(--blue);
color:white;
padding:51px;
display:grid;
grid-template-columns:1.2fr 1fr;
gap:80px;
align-items:center}
.portal-banner h2{
font-size:43px;
margin:12px 0 20px}
.portal-banner p{
font-size:16px;
color:#e1eaff}
.portal-banner .eyebrow{
color:#dce6ff}
.portal-banner .btn{
background:white;
color:#173a81;
margin-top:25px}
.portal-preview{
background:#ffffffed;
color:#19345c;
border-radius:20px;
padding:24px;
box-shadow:0 20px 60px #09245b26;
transform:rotate(3deg);
position:relative}
.portal-preview .preview-row{
padding:15px 0;
border-bottom:1px solid #dae3f2;
display:flex;
align-items:center;
gap:14px;
font-size:16px}
.preview-icon{
background:#eaf0ff;
border-radius:12px;
width:40px;
height:40px;
display:grid;
place-items:center;
color:#2561ed}
.contact-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px}
.contact-details{
padding:30px;
background:var(--paper);
border:1px solid var(--line);
border-radius:23px}
.contact-details a{
display:block;
font-size:22px;
font-weight:650;
margin:8px 0 24px;
letter-spacing:-.025em}
.contact-details a:last-child{
margin-bottom:0}
.contact-art{
padding:38px;
border-radius:23px;
background:var(--pale);
position:relative;
overflow:hidden;
display:flex;
flex-direction:column;
justify-content:space-between}
.contact-art:after{
content:'+';
font-size:290px;
line-height:1;
color:var(--blue);
opacity:.08;
position:absolute;
right:0;
bottom:-50px}
.footer{
border-top:1px solid var(--line);
padding:30px 0 35px;
font-size:16px;
color:var(--muted)}
.footer .container{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
flex-wrap:wrap}
.footer a:hover{
color:var(--blue)}
.footer .logo{
width:72px}
.page-heading{
padding:55px 0 30px}
.page-heading h1{
font-size:55px;
letter-spacing:-.06em;
margin:14px 0 20px}

/* Modal and inputs */
dialog{
border:1px solid var(--line);
color:var(--ink);
background:var(--paper);
border-radius:25px;
padding:0;
width:min(700px,calc(100% - 30px));
max-height:88dvh;
box-shadow:0 40px 140px #0e224749}
dialog::backdrop{
background:#0e1f4259;
backdrop-filter:blur(7px)}
.modal-head{
position:sticky;
top:0;
z-index:4;
display:flex;
align-items:center;
justify-content:space-between;
background:var(--paper);
padding:20px 26px;
border-bottom:1px solid var(--line);
gap:20px}
.modal-head h3{
font-size:19px}
.modal-body{
padding:27px}
.modal-body h2{
font-size:35px;
margin:12px 0 20px}
.modal-body p{
font-size:16px}
.modal-photo{
height:230px;
width:100%;
object-fit:cover;
border-radius:16px;
margin-bottom:22px}
.source-text{
white-space:pre-line;
font-size:16px;
line-height:1.9;
color:var(--muted);
margin:20px 0;
max-height:360px;
overflow:auto}
.fields{
display:grid;
grid-template-columns:1fr 1fr;
gap:17px}
.field{
display:grid;
gap:7px}
.field.full{
grid-column:1/-1}
.field label{
font-size:16px;
font-weight:800;
color:var(--muted)}
input,textarea,select{
width:100%;
border:1px solid var(--line);
border-radius:12px;
padding:12px 14px;
background:var(--bg);
outline:none;
font-size:16px;
min-height:45px}
input:focus,textarea:focus,select:focus{
border-color:var(--blue);
box-shadow:0 0 0 3px #2561ed12}
textarea{
resize:vertical;
min-height:90px}
.form-actions{
display:flex;
justify-content:flex-end;
gap:10px;
flex-wrap:wrap;
margin-top:24px}
.check{
display:flex;
align-items:start;
gap:10px;
font-size:16px;
color:var(--muted);
margin-top:17px}
.check input{
width:16px;
min-height:16px;
accent-color:var(--blue);
margin-top:3px}
.notice{
background:var(--pale);
padding:15px 18px;
border-radius:13px;
color:var(--muted);
font-size:16px;
line-height:1.8}
.notice strong{
color:var(--ink)}
.policy-links a{
color:var(--blue);
text-decoration:underline}
.role-choices{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:10px;
margin:18px 0}
.role-choice{
padding:15px 7px;
border:1px solid var(--line);
border-radius:14px;
text-align:center;
font-size:16px;
display:grid;
place-items:center;
gap:8px}
.role-choice.active{
background:var(--pale);
color:var(--blue);
border-color:var(--blue)}
.role-choice svg{
width:23px;
height:23px}
.settings-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px}
.reset{
color:var(--red);
font-size:16px;
text-decoration:underline}
.subnav{
padding:13px 0;
border-bottom:1px solid var(--line);
background:var(--paper)}


.chat-toggle{
position:fixed;
right:27px;
bottom:25px;
z-index:120;
width:56px;
height:56px;
border-radius:19px;
background:var(--blue);
color:white;
box-shadow:0 9px 30px #154bca40;
display:grid;
place-items:center;
transition:transform .3s}
.chat-toggle:hover{
transform:translateY(-4px) rotate(-4deg)}
.chat-toggle svg{
width:24px;
height:24px}
.chat{
position:fixed;
bottom:94px;
right:27px;
width:365px;
max-height:calc(100dvh - 150px);
z-index:119;
background:var(--paper);
border:1px solid var(--line);
border-radius:22px;
box-shadow:0 25px 90px #0e244532;
display:flex;
flex-direction:column;
overflow:hidden}
.chat[hidden]{
display:none}
.chat-head{
padding:19px;
display:flex;
align-items:center;
justify-content:space-between;
border-bottom:1px solid var(--line)}
.chat-head b{
font-size:16px}
.chat-head small{
font-size:16px;
color:var(--muted);
display:block}
.chat-log{
padding:17px;
overflow:auto;
min-height:170px;
max-height:340px;
display:grid;
gap:12px;
align-content:start}
.bubble{
max-width:94%;
background:var(--bg);
padding:12px 14px;
font-size:16px;
border-radius:14px 14px 14px 3px;
white-space:pre-wrap;
overflow-wrap:anywhere}
.bubble.me{
justify-self:end;
background:var(--blue);
color:white;
border-radius:14px 14px 3px 14px}
.chat-actions{
display:flex;
gap:6px;
flex-wrap:wrap;
padding:0 17px 13px}
.chat-actions button{
padding:7px 10px;
font-size:16px;
border:1px solid var(--line);
border-radius:10px;
color:var(--blue)}
.chat-input{
display:flex;
gap:8px;
padding:13px;
border-top:1px solid var(--line)}
.chat-input input{
font-size:16px;
min-width:0}
.chat-disclaimer{
font-size:16px;
color:var(--muted);
padding:0 15px 12px}
.toast{
position:fixed;
z-index:10000;
bottom:28px;
left:50%;
transform:translate(-50%,25px);
background:var(--ink);
color:var(--paper);
border-radius:13px;
padding:13px 21px;
max-width:min(550px,90vw);
font-size:16px;
box-shadow:var(--shadow);
opacity:0;
pointer-events:none;
transition:.3s}
.toast.show{
opacity:1;
transform:translate(-50%,0)}
.reveal{
animation:enter .65s both}
.stagger:nth-child(2){
animation-delay:.08s}
.stagger:nth-child(3){
animation-delay:.16s}
@keyframes enter{
from{
opacity:0;
transform:translateY(17px)}
to{
opacity:1;
transform:none}
}
@keyframes turn{
to{
transform:rotate(360deg)}
}

@media(min-width:1500px){
.container{
width:min(1370px,calc(100% - 120px))}
.hero h1{
font-size:112px}
.photo-stage{
height:570px}
}

@media(max-width:1100px){
.nav{
margin-left:15px;
gap:18px}
.header-inner{
gap:15px}
.header .booking-top{
display:none}
.hero-grid{
gap:30px}
.hero h1{
font-size:74px}
.photo-stage{
height:450px}
.hero-bottom{
gap:20px}
.courses{
gap:16px}
.course-img{
height:210px}
.portal-shell{
grid-template-columns:185px 1fr;
gap:20px}
.portal-columns{
grid-template-columns:1fr}
.about-grid{
gap:40px}
.portal-banner{
gap:35px}
.intro-strip .container{
grid-template-columns:1fr 1fr 1fr;
gap:15px}
}

@media(max-width:800px){
.container{
width:calc(100% - 38px)}
.header-inner{
height:77px}
.logo{
width:80px}
.nav{
display:none}
.hamb{
display:grid}
.header .account-label{
display:none}
.header-tools{
gap:6px}
.header .btn{
min-height:42px;
padding:10px}
.header .iconbtn{
width:38px;
height:38px}
.mobile-nav.open{
display:flex;
flex-direction:column;
padding:15px 24px;
gap:14px;
border-top:1px solid var(--line);
background:var(--paper)}
.hero{
padding-top:37px}
.hero-grid{
grid-template-columns:1fr;
gap:36px}
.hero h1{
font-size:clamp(60px,12vw,90px);
max-width:630px}
.hero .lead{
max-width:540px}
.hero-foot{
margin-top:25px}
.photo-stage{
height:470px;
max-width:500px;
width:100%;
margin:0 auto}
.vertical-text{
right:-4px}
.hero-bottom{
display:none}
.intro-strip .container{
grid-template-columns:1fr;
gap:18px}
.intro-strip{
padding:23px 0}
.section{
padding:65px 0}
.courses{
grid-template-columns:repeat(2,1fr)}
.course-body{
padding:18px}
.course h3{
font-size:20px}
.course-img{
height:225px}
.section-top{
align-items:start}
.section-top .lead{
display:none}
.catalog-tools{
align-items:start;
flex-direction:column}
.search{
width:100%}
.tabs{
gap:2px}
.tab{
padding:9px 10px;
font-size:16px}
.about-grid,.contact-grid,.portal-banner{
grid-template-columns:1fr;
gap:32px}
.about-photo img{
height:370px}
.portal-banner{
padding:32px}
.portal-banner h2{
font-size:35px}
.portal-preview{
max-width:500px;
transform:rotate(1deg)}
.portal-shell{
grid-template-columns:1fr;
gap:20px;
padding-top:20px}
.sidebar{
position:static;
padding:12px}
.profile{
display:flex;
align-items:center;
gap:12px;
padding:0 5px 12px;
margin:0}
.profile .avatar{
margin:0;
width:36px;
height:36px;
font-size:16px}
.sidebar-links{
display:flex;
overflow:auto;
gap:5px;
margin-top:10px}
.side-link{
width:auto;
white-space:nowrap;
padding:10px;
font-size:16px}
.side-link svg{
width:14px}
.portal-title h1{
font-size:29px}
.metrics{
gap:8px}
.metric{
padding:15px}
.metric strong{
font-size:30px}
.panel{
padding:19px}
.subnav .container{
align-items:start}
.privacy-demo{
font-size:16px;
max-width:235px}
.settings-grid{
grid-template-columns:1fr}
}

@media(max-width:480px){
.hero h1{
font-size:61px}
.photo-stage{
height:410px}
.hero .eyebrow{
font-size:16px;
letter-spacing:.11em}
.hero .lead{
font-size:16px}
.hero .btn{
padding:13px 17px}
.hero-actions{
gap:8px}
.hero-actions .secondary{
padding:13px}
.star{
width:65px;
height:65px;
right:5px}
.photo-note{
left:3px;
bottom:18px;
font-size:16px;
padding:11px 15px}
.photo-note b{
font-size:16px}
.course-img{
height:175px}
.course h3{
font-size:17px;
min-height:42px}
.course p{
font-size:16px;
min-height:53px}
.course-body{
padding:14px}
.course-img .badge{
left:10px;
top:10px;
font-size:16px;
padding:4px 7px}
.courses{
gap:12px}
.section-top h2{
font-size:35px}
.section-top .btn{
font-size:16px;
padding:10px 12px}
.fields{
grid-template-columns:1fr}
.field.full{
grid-column:auto}
.modal-body{
padding:21px}
.modal-head{
padding:17px 21px}
.chat{
right:12px;
bottom:82px;
width:calc(100% - 24px);
max-height:calc(100dvh - 110px)}
.chat-toggle{
right:17px;
bottom:18px;
width:51px;
height:51px;
border-radius:17px}
.lesson{
grid-template-columns:44px 1fr;
gap:10px}
.lesson .lesson-actions{
grid-column:2}
.lesson .date-block{
width:43px}
.portal-title{
flex-wrap:wrap}
.task-split{
flex-direction:column;
gap:12px}
.role-choices{
gap:6px}
.role-choice{
font-size:16px}
.metrics .metric span{
font-size:16px}
.portal-banner-small{
padding:24px}
.footer .logo{
display:none}
.header-tools .lang{
padding:5px}
.contact-details a{
font-size:19px}
}

@media(prefers-reduced-motion:reduce){
html{
scroll-behavior:auto}
*,*:before,*:after{
animation:none!important;
transition:none!important}
}

\n/* PUBLIC V2 */
.btn svg{
transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.btn:hover svg{
transform:translate(3px,-1px)}

.age-finder:after{
content:'';
position:absolute;
left:-80px;
bottom:-160px;
width:270px;
height:270px;
border:1px solid #2561ed18;
border-radius:45%;
transform:rotate(25deg);
pointer-events:none}

.age-finder>div{
z-index:1}
.home-schedule{
position:relative;
overflow:hidden}
.home-schedule:after{
content:'✳';
position:absolute;
right:-40px;
top:-110px;
font-size:400px;
color:var(--blue);
opacity:.035;
pointer-events:none;
animation:turn 90s linear infinite}
.home-schedule>.container{
position:relative;
z-index:1}

\n:root{
--shadow:0 22px 65px #244a8a15;
--radius:32px}
body{
font-size:16px}
.header-inner{
height:96px}
.header{
box-shadow:0 6px 30px #244a8a07}
.header .nav{
gap:19px;
margin-left:22px}
.header .nav a{
font-size:16px}
.header-tools .btn{
font-size:16px}
.btn{
border-radius:19px;
font-size:16px;
padding:15px 23px}
.btn.tiny{
border-radius:13px;
font-size:16px;
padding:9px 13px}
.iconbtn{
border-radius:15px}
.hero{
padding-top:75px;
padding-bottom:55px}
.hero .lead{
font-size:17px;
max-width:470px}
.hero h1{
margin-bottom:32px}
.hero-foot,.hero-bottom{
font-size:16px}
.photo-stage{
animation:float-in 1.2s cubic-bezier(.2,.8,.2,1) both}
.hero-photo{
border-radius:36% 36% 30px 30px}
.photo-note{
border-radius:21px;
padding:18px 23px;
animation:float-note 7s ease-in-out infinite}
.photo-note b{
font-size:17px}
.photo-note{
font-size:16px}
.star{
width:103px;
height:103px}
.intro-strip{
border:0;
margin:24px auto 0;
width:min(1280px,calc(100% - 72px));
border-radius:25px;
box-shadow:var(--shadow)}
.intro-strip .container{
width:calc(100% - 52px)}
.intro-strip p{
font-size:16px}
.intro-strip b{
font-size:17px}
.section{
padding:104px 0}
.eyebrow{
font-size:16px}
.lead{
font-size:17px}
.section-top{
margin-bottom:40px}
.section-top .small{
font-size:16px}
.tab{
font-size:16px;
border-radius:16px}
.search{
border-radius:18px;
padding:12px 16px}
.search input{
font-size:16px}
.course{
border-radius:29px;
box-shadow:0 8px 25px #244a8a05;
position:relative}
.course-img{
height:250px}
.course h3{
font-size:24px}
.course p{
font-size:16px;
min-height:46px}
.course-body{
padding:26px}
.course .more{
font-size:16px}
.course-img .badge{
font-size:16px;
left:20px;
top:20px}
.course:hover{
box-shadow:0 24px 60px #244a8a19;
transform:translateY(-9px)}
.course-fav{
position:absolute;
right:17px;
top:17px;
z-index:2;
width:38px;
height:38px;
border-radius:50%;
background:#ffffffd9;
backdrop-filter:blur(8px);
color:#244469;
display:grid;
place-items:center}
.course-fav.saved{
color:var(--red);
background:white}
.course-fav.saved svg{
fill:var(--red)}
.course-hit{
position:absolute;
inset:0;
z-index:0;
width:100%;
height:100%;
border-radius:29px}
.course .course-body,.course .course-img{
pointer-events:none}
.course-actions{
position:relative;
z-index:2;
display:flex;
gap:9px;
margin-top:20px;
align-items:center;
pointer-events:auto}
.course-actions button{
font-size:16px}
.about-copy p{
font-size:16px}
.about-photo img{
border-radius:35px}
.about-line{
font-size:16px;
padding:22px 0}
.contact-details,.contact-art{
border-radius:32px;
padding:36px}
.contact-details a{
font-size:25px}
.modal-head h3{
font-size:22px}
.modal-body p{
font-size:16px}
.modal-photo{
height:280px;
border-radius:23px}
.source-text{
font-size:16px}
.notice{
font-size:16px;
border-radius:18px}
.field label{
font-size:16px}
input,select,textarea{
font-size:16px;
border-radius:16px;
min-height:49px}
.field label{
font-weight:700}
.form-actions{
margin-top:28px}
.demo{
font-size:16px;
border-radius:16px}
.small{
font-size:16px}
.badge{
font-size:16px;
border-radius:10px}
dialog{
border-radius:32px}
.chat-toggle{
border-radius:22px}
.chat{
border-radius:29px}
.chat-head b{
font-size:16px}
.chat-head small{
font-size:16px}
.bubble{
font-size:16px;
line-height:1.7;
border-radius:19px 19px 19px 5px}
.chat-input input{
font-size:16px}
.chat-actions button{
font-size:16px;
border-radius:12px}
.chat-disclaimer{
font-size:16px}
.footer{
font-size:16px}
.footer button{
font-size:16px}
.privacy-demo{
font-size:16px}

.marquee{
overflow:hidden;
white-space:nowrap;
color:var(--blue);
padding:26px 0 10px;
mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee-track{
display:inline-flex;
gap:40px;
align-items:center;
animation:marquee 45s linear infinite}
.marquee span{
font-size:19px;
letter-spacing:-.03em;
font-weight:650}
.marquee i{
font-size:25px;
font-style:normal;
color:var(--red)}
.marquee:hover .marquee-track{
animation-play-state:paused}
.age-finder{
position:relative;
overflow:hidden;
display:grid;
grid-template-columns:1fr 1.1fr;
gap:60px;
padding:47px;
border-radius:37px;
background:linear-gradient(130deg,#dce9ff,#eef4ff);
border:1px solid #d7e3f5;
box-shadow:var(--shadow)}
body.dark .age-finder{
background:linear-gradient(130deg,#223c66,#1b2e4a);
border-color:var(--line)}
.age-finder h2{
font-size:40px;
margin:15px 0}
.age-big{
font-size:73px;
font-weight:650;
letter-spacing:-.07em;
line-height:1.2}
.age-big small{
font-size:20px;
letter-spacing:-.02em;
color:var(--muted);
margin-left:10px}
.age-slider{
width:100%;
accent-color:var(--blue);
padding:0;
margin:22px 0 7px;
cursor:pointer;
box-shadow:none!important;
min-height:30px;
background:transparent;
border:0}
.age-ticks{
display:flex;
justify-content:space-between;
font-size:16px;
color:var(--muted)}
.age-result{
display:grid;
gap:10px;
align-content:center}
.age-option{
padding:17px 20px;
border-radius:20px;
background:var(--glass);
border:1px solid var(--paper);
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
font-size:16px;
text-align:left;
transition:.25s}
.age-option:hover{
transform:translateX(6px);
background:var(--paper)}
.age-option small{
display:block;
color:var(--muted);
font-size:16px}
.age-finder .ghost-star{
position:absolute;
right:20%;
top:-30px;
opacity:.05;
font-size:230px;
pointer-events:none}
.stats-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
margin:35px 0}
.fact{
padding:27px;
border:1px solid var(--line);
border-radius:27px;
background:var(--paper);
box-shadow:var(--shadow)}
.fact b{
font-size:46px;
letter-spacing:-.06em;
font-weight:650;
color:var(--blue)}
.fact p{
font-size:16px;
color:var(--muted)}
.steps-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px}
.step{
position:relative;
overflow:hidden;
background:var(--paper);
border:1px solid var(--line);
padding:32px;
border-radius:29px;
box-shadow:var(--shadow);
transition:transform .35s}
.step:hover{
transform:translateY(-7px)}
.step .step-n{
font-size:57px;
letter-spacing:-.06em;
color:var(--blue);
line-height:1.2;
margin-bottom:26px}
.step h3{
font-size:25px;
margin-bottom:16px}
.step p{
font-size:16px;
color:var(--muted)}
.step:nth-child(2) .step-n{
color:var(--red)}
.step:after{
content:'+';
font-size:150px;
color:var(--blue);
opacity:.045;
position:absolute;
right:-5px;
top:-40px}
.schedule-shell{
padding:35px;
border-radius:31px;
background:var(--paper);
border:1px solid var(--line);
box-shadow:var(--shadow)}
.schedule-bar{
display:flex;
gap:13px;
align-items:end;
flex-wrap:wrap;
margin:23px 0}
.schedule-bar .field{
flex:1;
min-width:160px}
.seg{
display:inline-flex;
gap:4px;
padding:5px;
border:1px solid var(--line);
border-radius:18px;
background:var(--bg)}
.seg button{
border-radius:13px;
padding:10px 18px;
font-size:16px;
font-weight:750}
.seg button.active{
background:var(--blue);
color:white;
box-shadow:0 5px 15px #2561ed20}
.daystrip{
display:grid;
grid-template-columns:repeat(7,1fr);
gap:10px;
margin:24px 0}
.day-button{
padding:15px 6px;
background:var(--bg);
border:1px solid var(--line);
border-radius:21px;
text-align:center;
transition:.25s}
.day-button:hover{
transform:translateY(-4px)}
.day-button b{
display:block;
font-size:18px}
.day-button small{
font-size:16px;
color:var(--muted)}
.day-button.active{
background:var(--blue);
color:white;
border-color:var(--blue);
box-shadow:0 9px 24px #2561ed2a}
.day-button.active small{
color:#dbe7ff}
.schedule-list{
display:grid;
gap:13px}
.public-lesson{
display:grid;
grid-template-columns:83px 1fr auto;
gap:23px;
padding:23px;
border-radius:24px;
border:1px solid var(--line);
background:var(--paper);
align-items:center;
position:relative;
overflow:hidden;
transition:.3s}
.public-lesson:before{
content:'';
position:absolute;
top:24px;
bottom:24px;
left:0;
width:4px;
background:var(--blue);
border-radius:0 4px 4px 0}
.public-lesson:hover{
transform:translateX(3px);
box-shadow:0 9px 35px #244a8a0b}
.public-lesson .time{
font-size:25px;
font-weight:750;
letter-spacing:-.04em;
color:var(--blue)}
.public-lesson h3{
font-size:21px}
.public-lesson small{
font-size:16px;
color:var(--muted)}
.public-lesson .lesson-meta{
display:flex;
gap:15px;
flex-wrap:wrap;
margin-top:8px}
.week-scroll{
overflow:auto;
padding-bottom:12px}
.week-grid{
display:grid;
grid-template-columns:repeat(7,minmax(158px,1fr));
gap:11px;
min-width:1170px}
.week-day-head{
background:var(--pale);
color:var(--blue);
padding:13px;
border-radius:15px;
margin-bottom:12px;
text-align:center;
font-size:16px;
font-weight:800}
.week-card{
padding:17px 13px;
margin-bottom:10px;
border:1px solid var(--line);
border-left:3px solid var(--blue);
border-radius:17px;
background:var(--bg);
display:grid;
gap:9px;
font-size:16px;
text-align:left;
width:100%;
transition:.25s}
.week-card:hover{
background:var(--pale);
transform:translateY(-3px)}
.week-card strong{
font-size:16px;
line-height:1.6}
.week-card .time{
font-weight:800;
color:var(--blue);
font-size:16px}
.unscheduled{
margin-top:27px;
border-top:1px solid var(--line);
padding-top:25px}
.unscheduled .row{
margin-top:15px}
.unscheduled button{
padding:8px 12px;
border-radius:13px;
background:var(--bg);
font-size:16px;
border:1px solid var(--line)}
.live-note{
font-size:16px;
color:var(--muted);
line-height:1.8}
.home-schedule{
padding:65px 0;
background:var(--pale);
border-radius:50px;
margin:0 18px}
.upcoming-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:18px;
margin-top:25px}
.upcoming{
background:var(--paper);
border-radius:26px;
padding:27px;
box-shadow:var(--shadow)}
.upcoming .time{
font-size:30px;
letter-spacing:-.04em;
color:var(--blue);
font-weight:700}
.upcoming h3{
font-size:21px;
line-height:1.35;
margin:12px 0 20px}
.staff-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:23px}
.staff-card{
background:var(--paper);
border:1px solid var(--line);
border-radius:30px;
padding:32px;
box-shadow:var(--shadow)}
.staff-card .staff-icon{
height:54px;
width:54px;
background:var(--pale);
color:var(--blue);
border-radius:19px;
display:grid;
place-items:center;
margin-bottom:24px}
.staff-card h3{
font-size:26px;
line-height:1.3;
margin-bottom:13px}
.staff-card p{
font-size:16px;
line-height:1.9;
color:var(--muted);
margin-top:17px}
.faq-list{
max-width:950px}
.faq-item{
border-bottom:1px solid var(--line)}
.faq-item summary{
list-style:none;
display:flex;
justify-content:space-between;
align-items:center;
padding:26px 0;
cursor:pointer;
font-size:20px;
font-weight:650;
letter-spacing:-.025em;
gap:25px}
.faq-item summary::-webkit-details-marker{
display:none}
.faq-item summary:after{
content:'+';
font-size:23px;
background:var(--paper);
border:1px solid var(--line);
width:40px;
height:40px;
flex:none;
display:grid;
place-items:center;
border-radius:50%;
color:var(--blue);
transition:.3s}
.faq-item[open] summary:after{
content:'−';
background:var(--blue);
color:white;
transform:rotate(180deg)}
.faq-item p{
font-size:16px;
line-height:1.9;
color:var(--muted);
padding:0 65px 26px 0;
animation:enter .35s}
.map{
height:390px;
border-radius:29px;
border:1px solid var(--line);
background:var(--pale);
position:relative;
overflow:hidden;
margin-top:25px}
.map iframe{
position:absolute;
inset:0;
border:0;
width:100%;
height:100%;
z-index:2;
background:var(--pale)}
.map-placeholder{
position:absolute;
inset:0;
display:grid;
place-items:center;
text-align:center;
padding:30px;
background-image:linear-gradient(30deg,transparent 45%,#fff9 46%,#fff9 49%,transparent 50%),linear-gradient(120deg,transparent 45%,#fff8 46%,#fff8 49%,transparent 50%);
background-size:130px 130px}
.map-card{
padding:24px;
background:var(--glass);
backdrop-filter:blur(10px);
border:1px solid var(--paper);
border-radius:23px;
max-width:410px;
box-shadow:var(--shadow)}
.map-card h3{
font-size:21px;
margin:13px 0 18px}
.way-panel{
padding:24px;
background:var(--paper);
border-radius:25px;
border:1px solid var(--line);
margin-top:20px}
.way-panel p{
margin-top:20px;
font-size:16px;
color:var(--muted)}
.form-card{
background:var(--paper);
border:1px solid var(--line);
padding:33px;
border-radius:30px;
box-shadow:var(--shadow)}
.review-box{
border-radius:32px;
background:var(--paper);
border:1px solid var(--line);
padding:37px;
display:flex;
align-items:center;
justify-content:space-between;
gap:35px;
flex-wrap:wrap}
.review-box h3{
font-size:31px}
.review-box p{
font-size:16px;
color:var(--muted);
margin-top:14px;
max-width:600px}
.newsletter{
padding:42px;
background:var(--blue);
border-radius:33px;
color:white;
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
align-items:center;
position:relative;
overflow:hidden}
.newsletter h3{
font-size:32px;
margin-bottom:15px}
.newsletter p{
font-size:16px;
color:#dce7ff}
.newsletter .fields{
gap:10px}
.newsletter input{
background:#fff;
color:#14243e;
border:0}
.newsletter .btn{
background:var(--red);
color:white}
.newsletter .check{
color:#e0eaff;
font-size:16px}
.newsletter:before{
content:'✳';
position:absolute;
top:-90px;
left:-45px;
font-size:330px;
color:#ffffff09;
pointer-events:none}
.calc-grid{
display:grid;
grid-template-columns:1.1fr 1fr;
gap:30px;
background:var(--paper);
border:1px solid var(--line);
border-radius:32px;
padding:36px;
box-shadow:var(--shadow)}
.calc-result{
padding:35px;
border-radius:25px;
background:var(--blue);
color:white;
display:flex;
flex-direction:column;
justify-content:center}
.calc-result b{
font-size:51px;
letter-spacing:-.06em;
line-height:1.3}
.calc-result p{
font-size:16px;
color:#dce7ff;
margin:12px 0 25px}
.calc-values{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:17px;
margin-top:24px}
.plan-chips{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:22px}
.plan-chips button{
background:var(--pale);
border:1px solid var(--line);
font-size:16px;
padding:12px 16px;
border-radius:16px}
.plan-chips button.active{
background:var(--blue);
color:white;
border-color:var(--blue)}
.gallery-strip{
display:flex;
gap:18px;
overflow:auto;
scroll-snap-type:x mandatory;
padding:5px 4px 22px;
scrollbar-width:thin}
.gallery-item{
min-width:290px;
width:290px;
height:325px;
padding:0;
border-radius:27px;
overflow:hidden;
scroll-snap-align:start;
background:var(--paper)}
.gallery-item img{
width:100%;
height:100%;
object-fit:cover;
transition:.5s}
.gallery-item:hover img{
transform:scale(1.05)}
.gallery-tools{
display:flex;
gap:10px}
.booking-steps{
display:flex;
gap:8px;
margin-bottom:25px}
.booking-step{
flex:1;
height:5px;
background:var(--line);
border-radius:5px}
.booking-step.active{
background:var(--blue)}
.booking-slot{
padding:15px 18px;
border:1px solid var(--line);
border-radius:19px;
text-align:left;
width:100%;
font-size:16px;
background:var(--bg);
transition:.2s}
.booking-slot.active{
border-color:var(--blue);
background:var(--pale)}
.booking-slot small{
color:var(--muted);
display:block}
.booking-slot:hover{
transform:translateX(3px)}
.booking-summary{
display:grid;
gap:13px;
background:var(--bg);
padding:22px;
border-radius:23px;
margin:20px 0}
.booking-summary>div{
display:flex;
justify-content:space-between;
gap:20px;
font-size:16px}
.booking-summary span{
color:var(--muted)}
.booking-summary b{
text-align:right}
.success-mark{
width:69px;
height:69px;
display:grid;
place-items:center;
background:var(--pale);
color:var(--blue);
border-radius:24px;
margin:0 0 24px;
animation:success .65s}
.to-top{
position:fixed;
bottom:95px;
right:31px;
width:45px;
height:45px;
border:1px solid var(--line);
border-radius:17px;
background:var(--glass);
backdrop-filter:blur(12px);
z-index:100;
display:grid;
place-items:center;
opacity:0;
pointer-events:none;
transition:.25s}
.to-top.visible{
opacity:1;
pointer-events:auto}
.cookie{
position:fixed;
bottom:20px;
left:20px;
max-width:330px;
border:1px solid var(--line);
background:var(--glass);
backdrop-filter:blur(20px);
padding:20px;
border-radius:23px;
z-index:150;
box-shadow:var(--shadow);
font-size:16px;
line-height:1.8}
.cookie[hidden]{
display:none}
.cookie .btn{
margin-top:12px}
.float-decoration{
position:absolute;
pointer-events:none;
color:var(--blue);
opacity:.08;
font-size:150px;
font-weight:400}
.animated-section{
position:relative;
isolation:isolate}
.reveal{
animation:none;
opacity:1}
.motion-ready .reveal{
opacity:0;
transform:translateY(25px);
transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.motion-ready .reveal.visible{
opacity:1;
transform:none}
.motion-ready .reveal.stagger:nth-child(2){
transition-delay:.08s}
.motion-ready .reveal.stagger:nth-child(3){
transition-delay:.16s}
@keyframes marquee{
to{
transform:translateX(-50%)}
}
@keyframes float-note{
50%{
transform:translateY(-9px) rotate(2deg)}
}
@keyframes float-in{
from{
opacity:0;
transform:translateY(20px) rotate(2deg)}
to{
opacity:1;
transform:none}
}
@keyframes success{
0%{
transform:scale(.7);
opacity:0}
70%{
transform:scale(1.08)}
100%{
transform:scale(1)}
}

@media(max-width:1100px){
.header .nav{
display:none}
.header .hamb{
display:grid}
.mobile-nav.open{
display:flex;
flex-wrap:wrap;
gap:20px;
padding:20px 30px;
border-top:1px solid var(--line);
background:var(--paper)}
.public-lesson h3{
font-size:19px}
.hero .lead{
font-size:16px}
.course h3{
font-size:21px}
.course-img{
height:220px}
.course-body{
padding:22px}
.hero h1{
font-size:76px}
}

@media(max-width:800px){
.header-inner{
height:80px}
.hero{
padding-top:43px}
.hero .lead{
font-size:16px}
.hero-foot{
font-size:16px}
.photo-stage{
height:490px}
.intro-strip{
width:calc(100% - 38px);
margin-top:18px}
.intro-strip .container{
width:calc(100% - 36px)}
.intro-strip b{
font-size:16px}
.intro-strip p{
font-size:16px}
.section{
padding:72px 0}
.age-finder{
grid-template-columns:1fr;
gap:30px;
padding:30px}
.age-finder h2{
font-size:34px}
.stats-grid{
gap:11px}
.fact{
padding:20px}
.fact b{
font-size:37px}
.fact p{
font-size:16px}
.steps-grid{
grid-template-columns:1fr}
.step{
padding:29px}
.step .step-n{
margin-bottom:15px}
.staff-grid{
grid-template-columns:1fr}
.calc-grid{
grid-template-columns:1fr;
padding:25px}
.newsletter{
grid-template-columns:1fr;
padding:30px;
gap:25px}
.schedule-shell{
padding:22px}
.public-lesson{
grid-template-columns:70px 1fr;
gap:15px}
.public-lesson .slot-actions{
grid-column:2}
.schedule-bar{
align-items:stretch}
.daystrip{
gap:6px}
.day-button{
border-radius:16px}
.day-button b{
font-size:16px}
.day-button small{
font-size:16px}
.home-schedule{
border-radius:33px;
margin:0 8px;
padding:45px 0}
.upcoming-grid{
grid-template-columns:1fr}
.upcoming{
padding:25px}
.upcoming h3{
margin:10px 0 15px}
.contact-details,.contact-art{
padding:28px}
.form-card{
padding:25px}
.review-box{
padding:28px}
.course p{
font-size:16px}
.catalog-tools{
gap:20px}
}

@media(max-width:480px){
.hero h1{
font-size:65px}
.header-tools .btn{
font-size:16px;
padding:11px}
.header-tools .lang{
font-size:16px}
.photo-stage{
height:435px}
.star{
width:78px;
height:78px}
.photo-note{
font-size:16px;
padding:14px 18px}
.photo-note b{
font-size:16px}
.hero .btn{
padding:14px 17px;
font-size:16px}
.course-img{
height:190px}
.course h3{
font-size:18px}
.course p{
font-size:16px;
min-height:58px}
.course-body{
padding:16px}
.course .more{
font-size:16px}
.course-actions button{
font-size:16px;
padding:7px 9px}
.course-fav{
width:31px;
height:31px;
right:11px;
top:11px}
.course-img .badge{
font-size:16px;
left:11px;
top:11px;
max-width:calc(100% - 55px)}
.age-finder{
padding:25px;
border-radius:30px}
.age-big{
font-size:62px}
.age-option{
font-size:16px;
padding:15px}
.staff-card{
padding:25px}
.staff-card h3{
font-size:23px}
.schedule-shell{
padding:17px;
border-radius:26px}
.public-lesson{
padding:18px;
grid-template-columns:58px 1fr;
gap:13px}
.public-lesson .time{
font-size:21px}
.public-lesson h3{
font-size:18px}
.public-lesson small{
font-size:16px}
.public-lesson .btn{
font-size:16px}
.daystrip{
gap:4px}
.day-button{
padding:12px 3px;
border-radius:13px}
.day-button small{
font-size:16px}
.day-button b{
font-size:16px}
.schedule-bar .field{
min-width:100%;
}
.seg button{
padding:9px 11px;
font-size:16px}
.faq-item summary{
font-size:18px}
.faq-item p{
font-size:16px;
padding-right:10px}
.calc-result b{
font-size:43px}
.calc-values{
gap:13px}
.newsletter .fields{
grid-template-columns:1fr}
.gallery-item{
min-width:250px;
width:250px;
height:300px}
.map{
height:360px}
.contact-details a{
font-size:22px}
.privacy-demo{
max-width:200px;
font-size:16px;
bottom:4px;
left:5px}
.cookie{
left:12px;
bottom:12px;
max-width:calc(100% - 85px);
font-size:16px}
.to-top{
right:20px;
bottom:81px}
}

@media print{
.container{
width:100%}
.section{
padding:15px 0}
.schedule-shell,.public-lesson{
box-shadow:none;
border-color:#bbb;
break-inside:avoid}
.week-grid{
min-width:0;
grid-template-columns:repeat(7,1fr);
gap:3px}
.week-card{
padding:7px;
break-inside:avoid}
.week-card strong{
font-size:16px}
.week-card .time{
font-size:16px}
.week-scroll{
overflow:visible}
.motion-ready .reveal{
opacity:1;
transform:none}
body{
color:black;
background:white}
}

@media(prefers-reduced-motion:reduce){
*,*:before,*:after{
animation:none!important;
transition:none!important}
.motion-ready .reveal{
opacity:1;
transform:none}
html{
scroll-behavior:auto}
}