@font-face{
font-family:title;
src:url('font/AmaticSC-Bold.ttf') format('truetype');
}

@font-face{
font-family:subtitle;
src:url('font/AmaticSC-Regular.ttf') format('truetype');
}

@font-face{
font-family:bodyfont;
src:url('font/Caveat-VariableFont_wght.ttf') format('truetype');
}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
overflow-x:clip;
}

body{
background:#fff;
font-family:Arial;
overflow-x:clip;
width:100%;
max-width:100%;
}

.page-wrap{
width:100%;
}

section{

padding:80px;

width:100%;

max-width:100%;

}

.block{

min-height:700px;

display:flex;

flex-direction:column;

justify-content:center;

width:100%;

max-width:100%;

}

.divider{

height:80px;

padding:0;

margin:0;

background:white;

--section-bg:#fff;

}



.yellow{
background:#F7D75B;
--section-bg:#F7D75B;
--brush-color:rgba(236,72,55,.82);
}

.pink{
background:#F7D9DF;
--section-bg:#F7D9DF;
--brush-color:rgba(214,48,92,.78);
}

.blue{
background:#BFE7EF;
--section-bg:#BFE7EF;
--brush-color:rgba(232,64,52,.8);
}

.block.blue:not(.sansa-class-block){

--brush-color:#F7C756;

}

.sansa-class-block{

min-height:auto;

padding:88px 80px;

align-items:center;

--brush-color:#F7D75B;

}

.sansa-class-title{

font-family:title;

font-size:56px;

line-height:1;

margin:0;

text-align:center;

max-width:none;

}

.class-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(180px,1fr));

gap:16px;

width:100%;

max-width:1200px;

margin:0 auto;

}

.class-photo{

display:block;

width:100%;

padding:8px;

border:none;

border-radius:3px;

background:#fff;

box-shadow:0 2px 8px rgba(0,0,0,.08);

cursor:zoom-in;

transition:transform .2s ease,box-shadow .2s ease;

transform:rotate(var(--tilt,0deg));

-webkit-tap-highlight-color:transparent;

position:relative;

}

.class-photo:hover{

transform:rotate(calc(var(--tilt,0deg) + .5deg)) translateY(-4px) scale(1.02);

box-shadow:0 6px 16px rgba(0,0,0,.1);

}

.class-photo img{

display:block;

width:100%;

aspect-ratio:1;

object-fit:cover;

border-radius:2px;

}

.media-play-badge{

position:absolute;

right:14px;

bottom:14px;

width:36px;

height:36px;

border-radius:50%;

background:rgba(0,0,0,.55);

color:#fff;

font-size:14px;

line-height:36px;

text-align:center;

pointer-events:none;

box-shadow:0 2px 8px rgba(0,0,0,.2);

}

.class-photo .media-play-badge{

right:12px;

bottom:12px;

width:30px;

height:30px;

font-size:12px;

line-height:30px;

}

@media (max-width:1024px) and (min-width:769px){

.sansa-class-block{

padding-block:72px;

}

.gallery-grid{

column-gap:56px;

row-gap:56px;

}

}

.orange{
background:#F7C756;
--section-bg:#F7C756;
--brush-color:rgba(220,55,45,.84);
}

.block.orange{

min-height:auto;

padding:96px 80px 120px;

--brush-color:#BFE7EF;

}

.block.orange h2{

margin:0;

}

.more-coming-block{

min-height:auto;

padding:80px;

align-items:center;

text-align:center;

}

.coming-soon-line{

font-family:title;

font-size:36px;

line-height:1;

margin:8px 0 0;

max-width:none;

transform:translateX(32px);

}

.gallery-debug{

width:100%;

max-width:900px;

margin:0 auto 28px;

padding:16px 20px;

background:rgba(255,255,255,.45);

border:1px dashed rgba(0,0,0,.18);

font-family:Arial,sans-serif;

font-size:16px;

line-height:1.5;

}

.gallery-debug p{

font-family:Arial,sans-serif;

font-size:16px;

line-height:1.5;

max-width:none;

margin:0 0 6px;

}

.gallery-debug-error{

color:#8a1f1f;

}

.gallery-debug-attempts{

margin:8px 0 0 18px;

padding:0;

}

.gallery-debug-attempts li{

font-family:Consolas,monospace;

font-size:13px;

margin-bottom:4px;

}


h1{

font-family:title;

font-size:120px;

line-height:.9;

}

h2{

font-family:title;

font-size:72px;

margin-bottom:40px;

}

h3{

font-family:subtitle;

font-size:42px;

margin-bottom:24px;

}

p{

font-family:bodyfont;

font-size:28px;

line-height:1.8;

max-width:900px;

}


.gallery-grid{

display:grid;

grid-template-columns:repeat(2,minmax(260px,1fr));

column-gap:88px;

row-gap:88px;

justify-items:center;

align-items:start;

width:100%;

max-width:1440px;

margin:40px auto 0;

padding:32px 24px 56px;

}

.gallery-item{

display:flex;

flex-direction:column;

align-items:center;

width:max-content;

max-width:100%;

text-align:center;

}

.gallery-item:last-child:nth-child(odd){

grid-column:1 / -1;

}

.gallery-item:nth-child(odd) .gallery-frame{

--tilt:-0.9deg;

}

.gallery-item:nth-child(even) .gallery-frame{

--tilt:0.75deg;

}

.gallery-frame{

position:relative;

display:block;

width:fit-content;

max-width:100%;

margin-bottom:14px;

line-height:0;

padding:10px 10px 12px;

background:rgba(255,255,255,.62);

border:1px solid rgba(255,255,255,.9);

box-shadow:
0 1px 2px rgba(0,0,0,.04),
0 8px 22px rgba(0,0,0,.08),
0 18px 40px rgba(0,0,0,.05);

transform:rotate(var(--tilt,0deg));

transition:transform .2s ease,box-shadow .2s ease;

font:inherit;

color:inherit;

cursor:zoom-in;

-webkit-tap-highlight-color:transparent;

}

.gallery-frame::after{

content:"";

position:absolute;

inset:5px;

border:1px solid rgba(0,0,0,.06);

pointer-events:none;

}

.gallery-frame:hover{

transform:rotate(calc(var(--tilt,0deg) + .5deg)) translateY(-4px) scale(1.02);

box-shadow:
0 2px 4px rgba(0,0,0,.05),
0 10px 28px rgba(0,0,0,.1),
0 22px 48px rgba(0,0,0,.06);

}

.gallery-art{

display:block;

width:auto;

height:auto;

max-width:480px;

max-height:520px;

border:none;

box-shadow:none;

outline:none;

background:none;

position:relative;

z-index:1;

}

.gallery-title{

font-family:subtitle;

font-size:48px;

font-weight:700;

line-height:1.3;

margin:0 0 6px;

opacity:.72;

max-width:none;

}

.gallery-date{

font-family:bodyfont;

font-size:26px;

font-weight:500;

line-height:1.4;

opacity:.48;

max-width:none;

}

.small{

font-size:24px;

opacity:.7;

margin-top:20px;

}

.yellow-hero.block{

flex-direction:row;

align-items:center;

justify-content:space-between;

gap:40px;

}

.yellow-text h1{

position:relative;

z-index:2;

font-size:156px;

}

.yellow-cta{

position:relative;

z-index:1;

display:inline-block;

margin-top:20px;

}

.yellow-cta span{

position:relative;

z-index:1;

display:inline-block;

padding:16px 64px 16px 72px;

color:#fff;

font-family:title;

font-size:52px;

line-height:1;

transform:rotate(-10deg) translateX(22px);

transform-origin:center center;

}

.brush-highlight{

display:block;

background-color:var(--brush-color,rgba(232,64,52,.82));

-webkit-mask-image:var(--brush-mask-url);

mask-image:var(--brush-mask-url);

-webkit-mask-size:100% 100%;

mask-size:100% 100%;

-webkit-mask-repeat:no-repeat;

mask-repeat:no-repeat;

-webkit-mask-position:center;

mask-position:center;

width:420px;

max-width:none;

aspect-ratio:var(--brush-aspect-ratio,420 / 100);

-webkit-mask-mode:alpha;

mask-mode:alpha;

}

.yellow-cta-brush{

position:absolute;

left:-22px;

top:50%;

width:1108px;

max-width:none;

transform:translateY(-50%);

pointer-events:none;

z-index:0;

}

.yellow-photo{

position:relative;

width:704px;

flex-shrink:0;

display:flex;

flex-direction:column;

align-items:center;

transform:rotate(15deg);

transform-origin:center center;

}

.yellow-meet{

position:relative;

z-index:3;

text-align:center;

margin:0;

width:100%;

transform:translateY(40px);

margin-bottom:-48px;

}

.yellow-photo-wrap{

position:relative;

width:100%;

}

.yellow-frame{

width:100%;

height:auto;

display:block;

position:relative;

z-index:2;

}

.yellow-photo-cutout{

position:absolute;

top:18%;

left:20%;

right:20%;

bottom:18%;

overflow:hidden;

z-index:1;

}

.yellow-student{

width:100%;

height:100%;

object-fit:contain;

object-position:center;

transform:rotate(-3deg) scale(0.92);

transform-origin:center center;

}

.about-block{

flex-direction:row;

align-items:center;

justify-content:space-between;

gap:80px;

--brush-color:#BFE7EF;

}

.about-left{

flex:1;

}

.about-right{

flex:1;

text-align:right;

}

.about-right h2{

margin:0;

}

.about-right .brush-title-wrap{

margin-left:auto;

}

.about-right p{

max-width:none;

margin-bottom:8px;

}

.profile-block{

align-items:center;

}

.brush-title-wrap{

position:relative;

display:flex;

align-items:center;

width:fit-content;

max-width:100%;

margin-bottom:24px;

}

.brush-title-wrap--left{

justify-content:flex-start;

}

.brush-title-wrap--right{

justify-content:flex-end;

}

.brush-title-wrap--center{

justify-content:center;

width:100%;

}

.brush-title-wrap h1,
.brush-title-wrap h2{

position:relative;

z-index:2;

margin:0;

max-width:none;

}

.brush-title-bg{

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

z-index:1;

pointer-events:none;

}

.profile-title-wrap{

margin-bottom:32px;

}

.profile-title{

text-align:center;

}

.profile-intro{

text-align:center;

max-width:900px;

margin-bottom:60px;

}

.profile-ratings{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

width:100%;

}

.teacher-block{

align-items:stretch;

--brush-color:#BFE7EF;

}

.teacher-block .teacher-comment-text{

position:relative;

}

.teacher-block .brush-title-wrap{

z-index:1;

margin-bottom:8px;

}

.teacher-block .brush-title-wrap .brush-title-bg.brush-highlight{

left:0;

top:50%;

transform:translateY(-50%);

}

.teacher-block .teacher-comment-preview,
.teacher-block .teacher-comment-full{

position:relative;

z-index:2;

margin-top:24px;

}

.rating-item{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:28px;

}

.rating-label{

font-family:subtitle;

font-size:32px;

line-height:1.2;

}

.rating-stars{

position:relative;

display:inline-block;

font-size:32px;

letter-spacing:4px;

line-height:1;

vertical-align:middle;

}

.rating-stars__track{

display:block;

color:rgba(255,95,114,.22);

}

.rating-stars__fill{

position:absolute;

inset:0 auto 0 0;

width:0;

overflow:hidden;

color:#ff5f72;

white-space:nowrap;

pointer-events:none;

}

.profile-ratings.stars-animate .rating-stars__fill{

width:calc(var(--rating,0) / 5 * 100%);

transition:width .75s cubic-bezier(.4,0,.2,1);

transition-delay:calc(var(--star-delay,0) * .12s);

}

.teacher-comment-row{

display:flex;

gap:80px;

width:100%;

align-items:flex-start;

}

.teacher-comment-text{

flex:1;

}

.teacher-comment-text h2{

margin:0;

}

.teacher-comment-text p{

max-width:none;

}

.teacher-comment-preview{

max-width:none;

}

.teacher-comment-toggle{

display:block;

width:100%;

padding:0;

border:none;

background:transparent;

text-align:left;

cursor:pointer;

font:inherit;

color:inherit;

}

.teacher-comment-excerpt{

display:block;

}

.teacher-comment-read-more{

display:inline-block;

margin-top:12px;

font-family:subtitle;

font-size:28px;

line-height:1;

color:#d6305c;

text-decoration:underline;

text-underline-offset:4px;

}

.teacher-comment-toggle:hover .teacher-comment-read-more,
.teacher-comment-toggle:focus-visible .teacher-comment-read-more{

opacity:.82;

}

.teacher-sign{

flex-shrink:0;

display:flex;

flex-direction:column;

align-items:center;

justify-content:flex-start;

gap:0;

text-align:center;

min-width:280px;

max-width:320px;

padding-top:8px;

}

.teacher-portrait-wrap{

width:148px;

height:148px;

margin:0 auto 20px;

padding:4px;

border-radius:50%;

background:#fff;

box-shadow:0 8px 24px rgba(86,36,52,.14);

flex-shrink:0;

}

.teacher-portrait{

display:block;

width:100%;

height:100%;

border-radius:50%;

object-fit:cover;

object-position:center 18%;

}

.teacher-sign-img{

display:block;

width:min(100%,170px);

height:auto;

margin:0 auto 12px;

flex-shrink:0;

}

.teacher-sign p{

max-width:280px;

font-size:24px;

line-height:1.5;

margin:0 0 8px;

}

.teacher-sign-name{

font-weight:700;

}

.teacher-sign p:last-child{

margin-bottom:0;

font-size:22px;

line-height:1.45;

opacity:.92;

}

@media (min-width:769px){

.page-wrap{

--page-gutter:clamp(20px,4vw,48px);

max-width:1280px;

margin-inline:auto;

padding-inline:var(--page-gutter);

}

.page-wrap>section{

position:relative;

width:100%;

margin-inline:0;

padding-inline:0;

max-width:none;

background:var(--section-bg,transparent);

box-shadow:0 0 0 100vmax var(--section-bg,transparent);

clip-path:inset(0 -100vmax);

}

.page-wrap>.yellow-hero.block{

overflow:clip;

padding-block:clamp(72px,8vh,96px) clamp(48px,5vh,64px);

}

.page-wrap>section.divider{

padding-block:0;

}

.page-wrap>section.block{

padding-block:80px;

}

.page-wrap>.sansa-class-block{

padding-block:88px;

}

.page-wrap>.block.orange{

padding-block:96px 120px;

}

.page-wrap>.more-coming-block{

padding-block:80px;

}

.class-grid,
.gallery-grid{

max-width:none;

width:100%;

margin-inline:0;

}

.gallery-grid{

padding-inline:0;

}

.yellow-hero.block{

flex-direction:row;

align-items:flex-start;

justify-content:space-between;

gap:clamp(24px,3vw,40px);

min-height:min(620px,88vh);

overflow:clip;

}

.yellow-text{

flex:1 1 0;

min-width:0;

max-width:52%;

flex-shrink:0;

padding-top:clamp(8px,1vh,16px);

}

.yellow-text h1{

font-size:clamp(72px,7vw,112px);

line-height:.9;

}

.yellow-cta{

margin-top:10px;

}

.yellow-cta span{

font-size:52px;

padding:16px 64px 16px 72px;

}

.yellow-cta-brush.brush-highlight{

width:1108px;

max-width:100%;

left:-22px;

}

.yellow-photo{

width:min(520px,44%);

flex-shrink:0;

align-self:center;

}

.yellow-meet{

transform:translateY(34px);

margin-bottom:-40px;

font-size:clamp(44px,3.5vw,64px);

}

}

@media (max-width:768px){

section{

padding:48px 20px;

}

.block{

min-height:auto;

}

.divider{

width:100%;

position:relative;

z-index:0;

height:48px;

padding:0;

}

h1{

font-size:72px;

line-height:.95;

}

h2{

font-size:48px;

margin-bottom:24px;

}

h3{

font-size:32px;

}

p{

font-size:22px;

line-height:1.6;

max-width:100%;

}

.block.orange{

padding:56px 20px 72px;

}

.sansa-class-block{

padding:48px 20px;

}

.yellow-hero.block{

flex-direction:column;

align-items:stretch;

gap:32px;

padding-bottom:90px;

overflow:visible;

justify-content:flex-start;

position:relative;

z-index:2;

}

.yellow-text{

width:100%;

}

.yellow-text h1{

font-size:75px;

}

.yellow-cta{

margin-top:12px;

}

.yellow-cta-brush{

width:min(100%,507px);

left:0;

}

.brush-title-bg.brush-highlight{

width:min(100%,300px);

}

.yellow-cta span{

padding:12px 40px 12px 48px;

font-size:44px;

transform:rotate(-10deg) translateX(14px);

}

.yellow-photo{

width:64%;

max-width:64%;

flex-shrink:1;

align-self:flex-end;

margin-left:auto;

margin-right:0;

margin-top:-32px;

margin-bottom:-150px;

position:relative;

z-index:10;

}

.yellow-meet{

transform:translateY(12px);

margin-bottom:-28px;

}

.about-block{

flex-direction:column;

align-items:stretch;

gap:40px;

position:relative;

z-index:1;

padding-top:110px;

}

.about-right{

text-align:right;

}

.profile-ratings{

grid-template-columns:1fr;

gap:32px;

}

.profile-intro{

margin-bottom:40px;

}

.rating-label,
.rating-stars{

font-size:26px;

}

.teacher-comment-row{

flex-direction:column;

gap:32px;

}

.teacher-sign{

min-width:0;

width:100%;

max-width:320px;

margin-inline:auto;

padding-top:0;

}

.teacher-portrait-wrap{

width:132px;

height:132px;

margin-bottom:18px;

}

.teacher-sign-img{

width:min(100%,150px);

margin-bottom:10px;

}

.gallery-grid{

grid-template-columns:1fr;

column-gap:0;

row-gap:32px;

width:100%;

max-width:100%;

margin-top:24px;

padding:0;

}

.gallery-item{

width:100%;

max-width:100%;

grid-column:1;

}

.gallery-item:last-child:nth-child(odd){

grid-column:1;

}

.gallery-frame{

max-width:calc(100vw - 40px);

margin-left:auto;

margin-right:auto;

}

.gallery-art{

max-width:100%;

max-height:none;

width:auto;

height:auto;

}

.gallery-title{

font-size:36px;

}

.gallery-date{

font-size:20px;

}

.sansa-class-title{

font-size:44px;

margin:0;

}

.class-grid{

gap:12px;

}

.more-coming-block{

padding:48px 20px;

}

.coming-soon-line{

font-size:24px;

margin-top:4px;

transform:translateX(24px);

}

html.motion-ready .yellow-cta:not(.cta-visible) span{

transform:rotate(-10deg) translateX(14px) translateY(10px);

}

html.motion-ready .yellow-cta.cta-visible span{

transform:rotate(-10deg) translateX(14px) translateY(0);

}

}

.gallery-lightbox{

position:fixed;

inset:0;

z-index:9999;

display:flex;

align-items:center;

justify-content:center;

padding:24px;

opacity:0;

visibility:hidden;

transition:opacity .35s ease,visibility .35s ease;

}

.gallery-lightbox.is-open{

visibility:visible;

}

.gallery-lightbox.is-open.is-active{

opacity:1;

}

.gallery-lightbox-backdrop{

position:absolute;

inset:0;

background:rgba(20,18,16,.52);

backdrop-filter:blur(10px);

-webkit-backdrop-filter:blur(10px);

cursor:zoom-out;

opacity:0;

transition:opacity .35s ease;

}

.gallery-lightbox.is-open.is-active .gallery-lightbox-backdrop{

opacity:1;

}

.gallery-lightbox-panel{

position:relative;

z-index:1;

display:flex;

flex-direction:column;

align-items:center;

max-width:min(96vw,1600px);

max-height:92vh;

transform:scale(.96) translateY(12px);

opacity:0;

transition:transform .35s ease,opacity .35s ease;

}

.gallery-lightbox.is-open.is-active .gallery-lightbox-panel{

transform:scale(1) translateY(0);

opacity:1;

}

.gallery-lightbox-img{

display:block;

max-width:100%;

max-height:calc(92vh - 72px);

width:auto;

height:auto;

object-fit:contain;

border-radius:4px;

box-shadow:0 12px 48px rgba(0,0,0,.35);

opacity:0;

transition:opacity .35s ease;

}

.gallery-lightbox.is-loaded .gallery-lightbox-img{

opacity:1;

}

.gallery-lightbox-video{

display:block;

max-width:100%;

max-height:calc(92vh - 72px);

width:auto;

height:auto;

border-radius:4px;

box-shadow:0 12px 48px rgba(0,0,0,.35);

opacity:0;

transition:opacity .35s ease;

background:#000;

}

.gallery-lightbox-video[hidden]{

display:none;

}

.gallery-lightbox.is-loaded .gallery-lightbox-video:not([hidden]){

opacity:1;

}

.gallery-lightbox-img[hidden]{

display:none;

}

.gallery-lightbox-caption{

margin-top:16px;

color:#fff;

font-family:bodyfont;

font-size:24px;

text-align:center;

opacity:.85;

max-width:100%;

}

.gallery-lightbox-close{

position:absolute;

top:16px;

right:16px;

z-index:2;

width:44px;

height:44px;

border:none;

border-radius:50%;

background:rgba(255,255,255,.15);

color:#fff;

font-size:32px;

line-height:1;

cursor:pointer;

transition:background .2s ease;

}

.gallery-lightbox-close:hover{

background:rgba(255,255,255,.28);

}

.gallery-lightbox-spinner{

position:absolute;

width:40px;

height:40px;

border:3px solid rgba(255,255,255,.25);

border-top-color:#fff;

border-radius:50%;

animation:gallery-lightbox-spin .8s linear infinite;

}

.gallery-lightbox.is-loaded .gallery-lightbox-spinner{

display:none;

}

@keyframes gallery-lightbox-spin{

to{ transform:rotate(360deg); }

}

body.gallery-lightbox-open{

overflow:hidden;

}

.teacher-comment-modal{

position:fixed;

inset:0;

z-index:9998;

display:flex;

align-items:center;

justify-content:center;

padding:24px;

visibility:hidden;

pointer-events:none;

}

.teacher-comment-modal.is-open{

visibility:visible;

pointer-events:auto;

}

.teacher-comment-modal-backdrop{

position:absolute;

inset:0;

background:rgba(36,18,24,.52);

opacity:0;

transition:opacity .28s ease;

}

.teacher-comment-modal.is-active .teacher-comment-modal-backdrop{

opacity:1;

}

.teacher-comment-modal-panel{

position:relative;

z-index:1;

width:min(100%,760px);

max-height:min(82vh,860px);

overflow:auto;

padding:36px 40px 32px;

background:#f7e8ec;

border-radius:8px;

box-shadow:0 24px 64px rgba(0,0,0,.22);

opacity:0;

transform:translateY(16px);

transition:opacity .28s ease,transform .28s ease;

}

.teacher-comment-modal.is-active .teacher-comment-modal-panel{

opacity:1;

transform:none;

}

.teacher-comment-modal-name{

margin:0 0 20px;

font-family:subtitle;

font-size:32px;

line-height:1.2;

color:#d6305c;

}

.teacher-comment-modal-body p{

margin:0 0 18px;

font-size:22px;

line-height:1.65;

max-width:none;

white-space:pre-line;

}

.teacher-comment-modal-body p:last-child{

margin-bottom:0;

}

.teacher-comment-modal-close{

position:absolute;

top:12px;

right:12px;

z-index:2;

width:40px;

height:40px;

border:none;

border-radius:50%;

background:transparent;

color:#5a3040;

font-size:32px;

line-height:1;

cursor:pointer;

}

.teacher-comment-modal-close:hover{

opacity:.75;

}

body.teacher-comment-modal-open{

overflow:hidden;

}

.gallery-skeleton{

position:absolute;

inset:10px 10px 12px;

z-index:0;

border-radius:2px;

background:linear-gradient(110deg,rgba(255,255,255,.35) 8%,rgba(255,255,255,.78) 18%,rgba(255,255,255,.35) 33%);

background-size:200% 100%;

animation:gallery-skeleton-shimmer 1.35s ease-in-out infinite;

transition:opacity .35s ease;

}

.gallery-frame.is-loaded .gallery-skeleton{

opacity:0;

}

@keyframes gallery-skeleton-shimmer{

0%{ background-position:200% 0; }

100%{ background-position:-200% 0; }

}

html.motion-ready .reveal-section:not(.is-visible){

opacity:0;

}

html.motion-ready .reveal-section.is-visible{

opacity:1;

transform:none;

transition:opacity .65s ease;

}

html.motion-ready .reveal-section:not(.is-visible) .gallery-item{

opacity:0;

}

html.motion-ready .reveal-section.is-visible .gallery-item{

opacity:1;

transition:opacity .55s ease;

transition-delay:calc(var(--stagger,0) * 70ms);

}

html.motion-ready .reveal-section:not(.is-visible) .class-photo{

opacity:0;

}

html.motion-ready .reveal-section.is-visible .class-photo{

opacity:1;

transform:rotate(var(--tilt,0deg));

transition:opacity .55s ease,transform .55s ease,box-shadow .2s ease;

transition-delay:calc(var(--stagger,0) * 60ms);

}

html.motion-ready .brush-highlight:not(.is-drawn){

clip-path:inset(0 100% 0 0);

}

html.motion-ready .brush-highlight.is-drawn{

clip-path:inset(0 0 0 0);

transition:clip-path 800ms ease-out;

}

html.motion-ready .brush-title-bg.brush-highlight{

transform:translate(-50%,calc(-50% + var(--parallax-y,0px)));

}

html.motion-ready .teacher-block .brush-title-wrap .brush-title-bg.brush-highlight{

transform:translateY(calc(-50% + var(--parallax-y,0px)));

}

html.motion-ready .yellow-cta-brush.brush-highlight{

transform:translateY(calc(-50% + var(--parallax-y,0px)));

}

html.motion-ready .brush-title-wrap:not(.title-visible) h1,
html.motion-ready .brush-title-wrap:not(.title-visible) h2{

opacity:0;

}

html.motion-ready .brush-title-wrap.title-visible h1,
html.motion-ready .brush-title-wrap.title-visible h2{

opacity:1;

transform:none;

transition:opacity .5s ease;

}

html.motion-ready .yellow-cta:not(.cta-visible) span{

opacity:0;

transform:rotate(-10deg) translateX(22px);

}

html.motion-ready .yellow-cta.cta-visible span{

opacity:1;

transform:rotate(-10deg) translateX(22px);

transition:opacity .5s ease;

}

.yellow-frame.parallax-decor{

translate:0 var(--parallax-y,0);

}

@media (prefers-reduced-motion:reduce){

html.motion-ready .reveal-section,
html.motion-ready .reveal-section .gallery-item,
html.motion-ready .reveal-section .class-photo,
html.motion-ready .brush-highlight,
html.motion-ready .brush-title-wrap h1,
html.motion-ready .brush-title-wrap h2,
html.motion-ready .yellow-cta span{

opacity:1 !important;

transform:none !important;

transition:none !important;

clip-path:none !important;

}

.yellow-frame.parallax-decor{

translate:none;

}

.gallery-skeleton{

animation:none;

opacity:0;

}

.profile-ratings.stars-animate .rating-stars__fill{

transition:none !important;

}

}
